labellife-design-tool 0.1.0 → 0.3.0

package/README.md

@@ -14,6 +14,7 @@ Professional canvas editor built with React, TypeScript, and Konva.js. A powerfu
 - 📥 **Template Import** - Import JSON templates with user input collection
 - 🌐 **i18n Support** - Internationalization support (English, Dutch)
 - ⚙️ **Configurable** - Customize features, panels, and behavior
+- 🧩 **Modular Architecture** - Exclude panels, add custom panels, control features
 
 ## Installation
 
@@ -88,6 +89,397 @@ function MyEditor() {
 }
 ```
 
+### Modular Configuration (v0.2.0+)
+
+The library supports a modular architecture that allows you to customize panels, features, and tools.
+
+#### Exclude Panels
+
+Hide panels you don't need:
+
+```tsx
+import { CanvasEditor } from 'labellife-design-tool';
+
+<CanvasEditor
+  name="Editor"
+  config={{
+    panels: {
+      disable: ['variables', 'export', 'background'], // Hide these panels
+    },
+  }}
+/>
+```
+
+#### Enable Only Specific Panels
+
+Show only the panels you need:
+
+```tsx
+<CanvasEditor
+  name="Minimal Editor"
+  config={{
+    panels: {
+      enable: ['elements', 'text', 'image'], // Only show these three
+    },
+  }}
+/>
+```
+
+#### Reorder Panels
+
+Customize the panel order:
+
+```tsx
+<CanvasEditor
+  name="Custom Order"
+  config={{
+    panels: {
+      order: ['text', 'elements', 'image', 'design'], // Custom order
+    },
+  }}
+/>
+```
+
+#### Feature Flags
+
+Control which features are available:
+
+```tsx
+<CanvasEditor
+  name="No Unsplash"
+  config={{
+    features: {
+      unsplash: false,        // Disable Unsplash integration
+      imageUpload: true,      // Keep image upload enabled
+      textTools: true,        // Keep text tools enabled
+      shapeTools: false,      // Disable shape tools
+    },
+  }}
+/>
+```
+
+#### Tool Configuration
+
+Control which tools are available:
+
+```tsx
+<CanvasEditor
+  name="Limited Tools"
+  config={{
+    tools: {
+      disable: ['line'], // Disable line tool
+      // Or enable only specific tools:
+      // enable: ['select', 'text'],
+    },
+  }}
+/>
+```
+
+#### Template Input Configuration
+
+Control how template input dialogs behave when importing templates:
+
+```tsx
+<CanvasEditor
+  name="Optional Template Inputs"
+  config={{
+    templateInput: {
+      show: true,      // Whether to show the input dialog (default: true)
+      required: false, // Whether input fields are required (default: true)
+    }
+  }}
+/>
+```
+
+Options:
+- `show`: When set to `false`, no input dialog will appear when importing templates, and all template variables will remain as placeholders.
+- `required`: When set to `false`, all input fields in the dialog will be marked as optional, allowing users to skip them if desired.
+
+#### Theme Customization
+
+Customize the visual appearance with themes:
+
+```tsx
+<CanvasEditor
+  name="Custom Theme"
+  config={{
+    theme: {
+      colors: {
+        primary: '#10b981', // Green instead of blue
+        background: {
+          main: '#1e293b',    // Slate-800
+          sidebar: '#0f172a', // Slate-900
+        },
+        button: {
+          primary: {
+            background: '#10b981', // Green-600
+            hover: '#059669',     // Green-700
+          }
+        }
+      }
+    }
+  }}
+/>
+```
+
+#### Using Pre-built Themes
+
+Use one of the built-in themes:
+
+```tsx
+import { CanvasEditor, LIGHT_THEME, DARK_THEME } from 'labellife-design-tool';
+
+<CanvasEditor
+  name="Light Theme Editor"
+  config={{
+    theme: {
+      colors: LIGHT_THEME
+    }
+  }}
+/>
+```
+
+### Adding Custom Panels
+
+You can add your own custom panels to extend the editor's functionality.
+
+#### Step 1: Create Your Custom Panel Component
+
+```tsx
+import React from 'react';
+import { PanelProps } from 'labellife-design-tool';
+import { Settings } from 'lucide-react';
+
+// Your custom panel component receives PanelProps
+const MyCustomPanel: React.FC<PanelProps> = ({
+  design,           // Current design state
+  currentPage,      // Current page
+  selectedElement,  // Currently selected element (or null)
+  selectedIds,      // Array of selected element IDs
+  setDesign,        // Function to update the design
+  updateElement,    // Function to update an element
+  deleteElement,    // Optional: Function to delete an element
+}) => {
+  return (
+    <div className="p-4">
+      <h3 className="text-white font-semibold mb-4 flex items-center gap-2">
+        <Settings className="w-5 h-5" />
+        Custom Settings
+      </h3>
+      
+      <div className="space-y-4">
+        {/* Display current design info */}
+        <div className="bg-gray-700 p-3 rounded">
+          <p className="text-sm text-gray-300">
+            Design: {design.name}
+          </p>
+          <p className="text-sm text-gray-300">
+            Pages: {design.pages.length}
+          </p>
+          <p className="text-sm text-gray-300">
+            Selected: {selectedElement?.name || 'None'}
+          </p>
+        </div>
+
+        {/* Custom actions */}
+        <button
+          onClick={() => {
+            setDesign({
+              ...design,
+              name: `Updated at ${new Date().toLocaleTimeString()}`,
+            });
+          }}
+          className="w-full bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700"
+        >
+          Update Design Name
+        </button>
+
+        {/* Update selected element */}
+        {selectedElement && (
+          <button
+            onClick={() => {
+              updateElement(selectedElement.id, {
+                opacity: selectedElement.opacity === 1 ? 0.5 : 1,
+              });
+            }}
+            className="w-full bg-green-600 text-white px-4 py-2 rounded hover:bg-green-700"
+          >
+            Toggle Opacity
+          </button>
+        )}
+      </div>
+    </div>
+  );
+};
+```
+
+#### Step 2: Configure and Add Your Custom Panel
+
+```tsx
+import { CanvasEditor, CustomPanelConfig } from 'labellife-design-tool';
+import { Settings } from 'lucide-react';
+import { MyCustomPanel } from './MyCustomPanel';
+
+// Define your custom panel configuration
+const customPanel: CustomPanelConfig = {
+  id: 'my-custom-panel',        // Unique ID (must not conflict with built-in panels)
+  title: 'Custom Settings',     // Title shown in the panel header
+  icon: Settings,               // Optional: Icon component (from lucide-react or custom)
+  component: MyCustomPanel,      // Your panel component
+  
+  // Positioning options (choose one):
+  position: 'after',            // 'before' | 'after' | number
+  afterPanel: 'text',           // Insert after 'text' panel
+  // Or use:
+  // beforePanel: 'design',     // Insert before 'design' panel
+  // position: 2,               // Insert at index 2
+};
+
+// Use it in your editor
+function App() {
+  return (
+    <CanvasEditor
+      name="My Editor"
+      config={{
+        panels: {
+          custom: [customPanel], // Add your custom panel
+        },
+      }}
+    />
+  );
+}
+```
+
+#### Panel Positioning Options
+
+You can control where your custom panel appears:
+
+```tsx
+// Position after a specific panel
+{
+  id: 'panel-after',
+  position: 'after',
+  afterPanel: 'text'  // Appears after 'text' panel
+}
+
+// Position before a specific panel
+{
+  id: 'panel-before',
+  position: 'before',
+  beforePanel: 'design'  // Appears before 'design' panel
+}
+
+// Position at a specific index
+{
+  id: 'panel-index',
+  position: 2  // Appears at index 2 (0-based)
+}
+
+// Default: Add to end (no position specified)
+{
+  id: 'panel-end'
+}
+```
+
+#### Complete Example: Custom Panel with Multiple Features
+
+```tsx
+import React from 'react';
+import { CanvasEditor, CustomPanelConfig, PanelProps } from 'labellife-design-tool';
+import { Palette, Layers } from 'lucide-react';
+
+// Custom panel that manages design colors
+const ColorPalettePanel: React.FC<PanelProps> = ({
+  design,
+  setDesign,
+}) => {
+  const colors = ['#FF0000', '#00FF00', '#0000FF', '#FFFF00', '#FF00FF'];
+  
+  return (
+    <div className="p-4">
+      <h3 className="text-white font-semibold mb-4">Color Palette</h3>
+      <div className="grid grid-cols-5 gap-2">
+        {colors.map((color) => (
+          <button
+            key={color}
+            onClick={() => {
+              setDesign({
+                ...design,
+                colors: [...(design.colors || []), color],
+              });
+            }}
+            className="w-10 h-10 rounded"
+            style={{ backgroundColor: color }}
+            title={color}
+          />
+        ))}
+      </div>
+    </div>
+  );
+};
+
+// Custom panel configuration
+const colorPalettePanel: CustomPanelConfig = {
+  id: 'color-palette',
+  title: 'Colors',
+  icon: Palette,
+  component: ColorPalettePanel,
+  position: 'after',
+  afterPanel: 'design',
+};
+
+// Use multiple custom panels
+function App() {
+  return (
+    <CanvasEditor
+      name="Custom Editor"
+      config={{
+        panels: {
+          custom: [colorPalettePanel], // Add custom panel
+          disable: ['variables'],       // Hide variables panel
+          order: ['elements', 'text', 'color-palette', 'image'], // Custom order
+        },
+      }}
+    />
+  );
+}
+```
+
+#### Available Panel Props
+
+Your custom panel component receives these props:
+
+```tsx
+interface PanelProps {
+  // Core editor state
+  design: CanvasDesign;              // Current design
+  currentPage: Page;                 // Current page
+  selectedElement: CanvasElement | null;  // Selected element
+  selectedIds: string[];             // Array of selected IDs
+  
+  // Core editor actions
+  setDesign: (design: CanvasDesign) => void;
+  updateElement: (id: string, attrs: Partial<CanvasElement>) => void;
+  deleteElement?: (id: string) => void;
+  
+  // Additional props (panel-specific)
+  [key: string]: any;
+}
+```
+
+#### Built-in Panel IDs
+
+Available built-in panel IDs you can reference:
+- `'elements'` - Elements/Shapes panel
+- `'text'` - Text panel
+- `'image'` - Images panel
+- `'design'` - Design panel
+- `'background'` - Background panel
+- `'variables'` - Variables panel (if enabled)
+- `'export'` - Export panel (if enabled)
+
+For more advanced examples and API documentation, see [MODULAR_USAGE_GUIDE.md](./MODULAR_USAGE_GUIDE.md).
+
 ## Development
 
 To run the development server:

package/dist/lib/CanvasEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CanvasEditor.d.ts","sourceRoot":"","sources":["../../src/CanvasEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAkFxE,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAExC,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAA;CAAE,CA68B7D,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"CanvasEditor.d.ts","sourceRoot":"","sources":["../../src/CanvasEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAqFjF,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAExC,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAA;CAAE,CAikC7D,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/lib/components/Header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../src/components/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,gBAAgB,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,QAAQ,KAAK,IAAI,CAAC;CAC7D;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA0CxC,CAAC;AAEF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../src/components/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,gBAAgB,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,QAAQ,KAAK,IAAI,CAAC;CAC7D;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA0DxC,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/lib/components/LeftMenu.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { ToolType, ActivePanelId } from "../types";
+import { ToolType, ActivePanelId, PanelConfig } from "../types";
 import { Config } from "../types/Config";
 export interface LeftMenuProps {
     tool: ToolType;
@@ -7,6 +7,7 @@ export interface LeftMenuProps {
     onSetTool: (tool: ToolType) => void;
     onSetActivePanel: (panel: ActivePanelId) => void;
     config?: Config;
+    panels?: PanelConfig[];
 }
 export declare const LeftMenu: React.FC<LeftMenuProps>;
 export default LeftMenu;

package/dist/lib/components/LeftMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LeftMenu.d.ts","sourceRoot":"","sources":["../../../src/components/LeftMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAWzC,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,QAAQ,CAAC;IACf,WAAW,EAAE,aAAa,CAAC;IAC3B,SAAS,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,CAAC;IACpC,gBAAgB,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACjD,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAqH5C,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"LeftMenu.d.ts","sourceRoot":"","sources":["../../../src/components/LeftMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAsBzC,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,QAAQ,CAAC;IACf,WAAW,EAAE,aAAa,CAAC;IAC3B,SAAS,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,CAAC;IACpC,gBAAgB,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACjD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,WAAW,EAAE,CAAC;CACxB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAkL5C,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/dist/lib/components/TemplateInputModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TemplateInputModal.d.ts","sourceRoot":"","sources":["../../../src/components/TemplateInputModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,UAAU,uBAAuB;IAC/B,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IAClD,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAkazD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"TemplateInputModal.d.ts","sourceRoot":"","sources":["../../../src/components/TemplateInputModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,UAAU,uBAAuB;IAC/B,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IAClD,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA2ezD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/lib/components/header/AppName.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppName.d.ts","sourceRoot":"","sources":["../../../../src/components/header/AppName.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,EAGpB,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"AppName.d.ts","sourceRoot":"","sources":["../../../../src/components/header/AppName.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,EAGpB,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/lib/components/header/ExportButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExportButton.d.ts","sourceRoot":"","sources":["../../../../src/components/header/ExportButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,UAAU,iBAAiB;IACzB,gBAAgB,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,QAAQ,KAAK,IAAI,CAAC;CAC7D;AAED,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAW7C,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ExportButton.d.ts","sourceRoot":"","sources":["../../../../src/components/header/ExportButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAG5C,UAAU,iBAAiB;IACzB,gBAAgB,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,QAAQ,KAAK,IAAI,CAAC;CAC7D;AAED,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAW7C,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/lib/components/header/HistoryControls.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HistoryControls.d.ts","sourceRoot":"","sources":["../../../../src/components/header/HistoryControls.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,UAAU,oBAAoB;IAC5B,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAED,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA2BnD,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"HistoryControls.d.ts","sourceRoot":"","sources":["../../../../src/components/header/HistoryControls.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,oBAAoB;IAC5B,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAED,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA2BnD,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/lib/components/header/ZoomControls.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ZoomControls.d.ts","sourceRoot":"","sources":["../../../../src/components/header/ZoomControls.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,UAAU,iBAAiB;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAmC7C,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ZoomControls.d.ts","sourceRoot":"","sources":["../../../../src/components/header/ZoomControls.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,iBAAiB;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAmC7C,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/lib/components/sidebar/RightSidebar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RightSidebar.d.ts","sourceRoot":"","sources":["../../../../src/components/sidebar/RightSidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,UAAU,iBAAiB;IACzB,mBAAmB,EAAE,aAAa,EAAE,CAAC;IACrC,eAAe,EAAE,aAAa,GAAG,SAAS,GAAG,IAAI,CAAC;IAClD,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IACrE,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,iBAAiB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,gBAAgB,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAiH7C,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"RightSidebar.d.ts","sourceRoot":"","sources":["../../../../src/components/sidebar/RightSidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,UAAU,iBAAiB;IACzB,mBAAmB,EAAE,aAAa,EAAE,CAAC;IACrC,eAAe,EAAE,aAAa,GAAG,SAAS,GAAG,IAAI,CAAC;IAClD,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IACrE,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,iBAAiB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,gBAAgB,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAqL7C,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/lib/constants/themes.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Default theme configurations for LabelLife Design Tool
+ */
+import { ThemeColors } from '../types/Theme';
+/**
+ * Default dark theme (matches current styling)
+ */
+export declare const DEFAULT_THEME: ThemeColors;
+/**
+ * Light theme variant
+ */
+export declare const LIGHT_THEME: ThemeColors;
+/**
+ * Dark theme variant with higher contrast
+ */
+export declare const DARK_THEME: ThemeColors;
+//# sourceMappingURL=themes.d.ts.map

package/dist/lib/constants/themes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"themes.d.ts","sourceRoot":"","sources":["../../../src/constants/themes.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE,WA6B3B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,WAAW,EAAE,WA6BzB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,UAAU,EAAE,WA6BxB,CAAC"}

package/dist/lib/contexts/ThemeContext.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import { ThemeColors, ThemeConfig } from '../types/Theme';
+/**
+ * Theme context type
+ */
+interface ThemeContextType {
+    theme: ThemeColors;
+}
+/**
+ * Hook to access the current theme
+ */
+export declare const useTheme: () => ThemeContextType;
+/**
+ * Theme provider component
+ */
+export declare const ThemeProvider: React.FC<{
+    children: React.ReactNode;
+    themeConfig?: ThemeConfig;
+}>;
+export {};
+//# sourceMappingURL=ThemeContext.d.ts.map

package/dist/lib/contexts/ThemeContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../../src/contexts/ThemeContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAI1D;;GAEG;AACH,UAAU,gBAAgB;IACxB,KAAK,EAAE,WAAW,CAAC;CACpB;AASD;;GAEG;AACH,eAAO,MAAM,QAAQ,wBAAiC,CAAC;AAEvD;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC;IACnC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B,CAYA,CAAC"}

package/dist/lib/i18n.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Scoped i18n instance for LabelLife Design Tool
+ * Uses namespace 'labellife-editor' to avoid conflicts with consumer's i18n
+ */
+declare const EDITOR_NAMESPACE = "labellife-editor";
+declare const editorI18n: import("node_modules/i18next").i18n;
+export default editorI18n;
+export { EDITOR_NAMESPACE };
+//# sourceMappingURL=i18n.d.ts.map

package/dist/lib/i18n.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"i18n.d.ts","sourceRoot":"","sources":["../../src/i18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,gBAAgB,qBAAqB,CAAC;AAG5C,QAAA,MAAM,UAAU,qCAAwB,CAAC;AA+BzC,eAAe,UAAU,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,CAAC"}