@glazeen/react-watermark

A lightweight, customizable React watermark component built exclusively for the Glazeen software house.

Installation

npm install @glazeen/react-watermark

Usage

import { GlazeenWatermark } from '@glazeen/react-watermark';

function App() {
  return (
    <div style={{ position: 'relative', width: '100%', height: '100vh' }}>
      <h1>My Application</h1>
      <p>Content goes here.</p>
      
      {/* Render the watermark */}
      <GlazeenWatermark />
    </div>
  );
}

Features

• Modern & Lightweight: Built using React, TypeScript, and Tailwind CSS v4.
• Namespaced Styles: All component styles are prefixed to prevent collisions with the host application.
• Dual Support: Ships with both CommonJS and ESM support, properly typed via .d.ts files.

Development

This component library uses Vite for bundling and Storybook for isolated component development.

To get started with development:

1. Install dependencies:

   npm install

2. Run Storybook (Recommended for UI work):

   npm run storybook

3. Build the library:

   npm run build