Watermark

---
import { Watermark } from '@santi020k/lumen-astro'
---

<Watermark content="Draft">
  <div style="height: 200px; background: var(--ui-surface);">Protected content</div>
</Watermark>

import { Watermark } from '@santi020k/lumen-react'

export const Example = () => (
  <>
    <Watermark content="Draft">
      <div style={{ height: '200px', background: 'var(--ui-surface)' }}>Protected content</div>
    </Watermark>
  </>
)

<script type="module">
  import { defineLumenElements } from '@santi020k/lumen-elements/define'

  defineLumenElements()
</script>

<lumen-watermark content="Draft">
  <div style="height: 200px; background: var(--ui-surface);">Protected content</div>
</lumen-watermark>