js-cloudimage-hotspot 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Scaleflex
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,294 @@
+# js-cloudimage-hotspot
+
+Interactive image hotspots with zoom, popovers, and accessibility. Zero dependencies.
+
+## Features
+
+- **Hotspot markers** — Positioned via percentage or pixel coordinates with pulsing animation
+- **Popover system** — Hover, click, or load triggers with built-in flip/shift positioning
+- **Zoom & Pan** — CSS transform-based with mouse wheel, pinch-to-zoom, double-click, drag-to-pan
+- **WCAG 2.1 AA** — Full keyboard navigation, ARIA attributes, focus management, reduced motion
+- **CSS variable theming** — Light and dark themes, fully customizable
+- **Two init methods** — JavaScript API and HTML data-attributes
+- **React wrapper** — Separate entry point with component, hook, and ref API
+- **TypeScript** — Full type definitions
+- **Cloudimage CDN** — Optional responsive image loading
+- **Multi-image scenes** — Navigate between images with animated transitions
+- **< 15 KB gzipped** — Zero runtime dependencies
+
+## Installation
+
+```bash
+npm install js-cloudimage-hotspot
+```
+
+### CDN
+
+```html
+<script src="https://cdn.scaleflex.it/plugins/js-cloudimage-hotspot/latest/js-cloudimage-hotspot.min.js"></script>
+```
+
+## Quick Start
+
+### JavaScript API
+
+```js
+import CIHotspot from 'js-cloudimage-hotspot';
+
+const viewer = new CIHotspot('#product-image', {
+  src: 'https://example.com/living-room.jpg',
+  alt: 'Modern living room',
+  zoom: true,
+  trigger: 'hover',
+  hotspots: [
+    {
+      id: 'sofa',
+      x: '40%',
+      y: '60%',
+      label: 'Modern Sofa',
+      data: { title: 'Modern Sofa', price: '$899', description: 'Comfortable 3-seat sofa' },
+    },
+    {
+      id: 'lamp',
+      x: '75%',
+      y: '25%',
+      label: 'Floor Lamp',
+      data: { title: 'Arc Floor Lamp', price: '$249' },
+    },
+  ],
+  onOpen(hotspot) {
+    console.log('Opened:', hotspot.id);
+  },
+});
+```
+
+### HTML Data-Attributes
+
+```html
+<div
+  data-ci-hotspot-src="https://example.com/room.jpg"
+  data-ci-hotspot-alt="Living room"
+  data-ci-hotspot-zoom="true"
+  data-ci-hotspot-trigger="hover"
+  data-ci-hotspot-items='[
+    {"id":"sofa","x":"40%","y":"60%","label":"Sofa","data":{"title":"Sofa","price":"$899"}}
+  ]'
+></div>
+
+<script>CIHotspot.autoInit();</script>
+```
+
+## API Reference
+
+### Constructor
+
+```ts
+new CIHotspot(element: HTMLElement | string, config: CIHotspotConfig)
+```
+
+### Config
+
+| Option | Type | Default | Description |
+|--------|------|---------|-------------|
+| `src` | `string` | — | Image source URL (required) |
+| `hotspots` | `HotspotItem[]` | — | Array of hotspot definitions (required) |
+| `alt` | `string` | `''` | Image alt text |
+| `trigger` | `'hover' \| 'click' \| 'load'` | `'hover'` | Popover trigger mode |
+| `zoom` | `boolean` | `false` | Enable zoom & pan |
+| `zoomMax` | `number` | `4` | Maximum zoom level |
+| `zoomMin` | `number` | `1` | Minimum zoom level |
+| `theme` | `'light' \| 'dark'` | `'light'` | Theme |
+| `pulse` | `boolean` | `true` | Marker pulse animation |
+| `placement` | `'top' \| 'bottom' \| 'left' \| 'right' \| 'auto'` | `'top'` | Popover placement |
+| `lazyLoad` | `boolean` | `true` | Lazy load image |
+| `zoomControls` | `boolean` | `true` | Show zoom control buttons |
+| `zoomControlsPosition` | `'top-left' \| 'top-center' \| 'top-right' \| 'bottom-left' \| 'bottom-center' \| 'bottom-right'` | `'bottom-right'` | Zoom controls position |
+| `renderPopover` | `(hotspot) => string \| HTMLElement` | — | Custom popover render |
+| `onOpen` | `(hotspot) => void` | — | Popover open callback |
+| `onClose` | `(hotspot) => void` | — | Popover close callback |
+| `onZoom` | `(level) => void` | — | Zoom change callback |
+| `onClick` | `(event, hotspot) => void` | — | Marker click callback |
+| `cloudimage` | `CloudimageConfig` | — | Cloudimage CDN config |
+| `scenes` | `Scene[]` | — | Array of scenes for multi-image navigation |
+| `initialScene` | `string` | first scene | Scene ID to display initially |
+| `sceneTransition` | `'fade' \| 'slide' \| 'none'` | `'fade'` | Scene transition animation |
+| `sceneAspectRatio` | `string` | — | Fixed viewport ratio (e.g. `'16/9'`). Prevents layout jumps. |
+| `onSceneChange` | `(id, scene) => void` | — | Scene change callback |
+
+### HotspotItem
+
+| Field | Type | Description |
+|-------|------|-------------|
+| `id` | `string` | Unique identifier (required) |
+| `x` | `string \| number` | X coordinate: `'65%'` or `650` (px) |
+| `y` | `string \| number` | Y coordinate: `'40%'` or `400` (px) |
+| `label` | `string` | Accessible label (required) |
+| `data` | `PopoverData` | Data for built-in template |
+| `content` | `string` | HTML content (sanitized) |
+| `trigger` | `'hover' \| 'click' \| 'load'` | Override global trigger |
+| `placement` | `Placement` | Override global placement |
+| `className` | `string` | Custom CSS class |
+| `hidden` | `boolean` | Initially hidden |
+| `icon` | `string` | Custom icon |
+| `navigateTo` | `string` | Scene ID to navigate to on click |
+
+### Instance Methods
+
+```ts
+instance.open(id: string): void
+instance.close(id: string): void
+instance.closeAll(): void
+instance.setZoom(level: number): void
+instance.getZoom(): number
+instance.resetZoom(): void
+instance.addHotspot(hotspot: HotspotItem): void
+instance.removeHotspot(id: string): void
+instance.updateHotspot(id: string, updates: Partial<HotspotItem>): void
+instance.update(config: Partial<CIHotspotConfig>): void
+instance.destroy(): void
+instance.goToScene(sceneId: string): void
+instance.getCurrentScene(): string | undefined
+instance.getScenes(): string[]
+```
+
+### Static Methods
+
+```ts
+CIHotspot.autoInit(root?: HTMLElement): CIHotspotInstance[]
+```
+
+## React Usage
+
+```tsx
+import { CIHotspotViewer, useCIHotspot } from 'js-cloudimage-hotspot/react';
+
+// Component
+function ProductImage() {
+  return (
+    <CIHotspotViewer
+      src="/living-room.jpg"
+      alt="Living room"
+      zoom
+      hotspots={[
+        { id: 'sofa', x: '40%', y: '60%', label: 'Sofa', data: { title: 'Sofa', price: '$899' } },
+      ]}
+      onOpen={(h) => console.log('Opened:', h.id)}
+    />
+  );
+}
+
+// Hook
+function ProductImage() {
+  const { containerRef, instance } = useCIHotspot({
+    src: '/room.jpg',
+    hotspots: [...],
+    zoom: true,
+  });
+
+  return (
+    <>
+      <div ref={containerRef} />
+      <button onClick={() => instance.current?.setZoom(2)}>Zoom 2x</button>
+    </>
+  );
+}
+
+// Ref API
+function ProductImage() {
+  const ref = useRef<CIHotspotViewerRef>(null);
+  return (
+    <>
+      <CIHotspotViewer ref={ref} src="/room.jpg" hotspots={[...]} zoom />
+      <button onClick={() => ref.current?.open('sofa')}>Show Sofa</button>
+    </>
+  );
+}
+```
+
+## Multi-Image Scenes
+
+Navigate between multiple images, each with its own hotspots:
+
+```js
+const viewer = new CIHotspot('#tour', {
+  scenes: [
+    {
+      id: 'living-room',
+      src: '/living-room.jpg',
+      alt: 'Living room',
+      hotspots: [
+        { id: 'sofa', x: '40%', y: '60%', label: 'Sofa', data: { title: 'Modern Sofa' } },
+        { id: 'go-kitchen', x: '85%', y: '50%', label: 'Go to Kitchen', navigateTo: 'kitchen' },
+      ],
+    },
+    {
+      id: 'kitchen',
+      src: '/kitchen.jpg',
+      alt: 'Kitchen',
+      hotspots: [
+        { id: 'island', x: '50%', y: '65%', label: 'Island', data: { title: 'Marble Island' } },
+        { id: 'go-back', x: '10%', y: '50%', label: 'Back', navigateTo: 'living-room' },
+      ],
+    },
+  ],
+  sceneTransition: 'fade',  // 'fade' | 'slide' | 'none'
+});
+
+// Programmatic navigation
+viewer.goToScene('kitchen');
+viewer.getCurrentScene(); // 'kitchen'
+viewer.getScenes();       // ['living-room', 'kitchen']
+```
+
+Hotspots with `navigateTo` display as arrow markers and switch scenes on click.
+
+## Theming
+
+All visuals are customizable via CSS variables:
+
+```css
+.my-viewer {
+  --ci-hotspot-marker-bg: rgba(0, 88, 163, 0.8);
+  --ci-hotspot-pulse-color: rgba(0, 88, 163, 0.3);
+  --ci-hotspot-cta-bg: #e63946;
+  --ci-hotspot-popover-border-radius: 4px;
+}
+```
+
+Set `theme: 'dark'` for the built-in dark theme.
+
+## Accessibility
+
+- All markers are `<button>` elements with `aria-label`
+- `Tab` / `Shift+Tab` navigates between markers
+- `Enter` / `Space` toggles popovers
+- `Escape` closes popovers and returns focus
+- `Arrow keys` pan when zoomed
+- `+` / `-` / `0` zoom controls
+- Focus trapping in popovers with interactive content
+- `prefers-reduced-motion` disables animations
+
+## Cloudimage Integration
+
+```js
+new CIHotspot('#el', {
+  src: 'https://example.com/room.jpg',
+  cloudimage: {
+    token: 'demo',
+    limitFactor: 100,
+    params: 'q=80',
+  },
+  hotspots: [...],
+});
+```
+
+## Browser Support
+
+- Chrome 80+
+- Firefox 80+
+- Safari 14+
+- Edge 80+
+
+## License
+
+MIT

package/dist/a11y/aria.d.ts

@@ -0,0 +1,7 @@
+/** Announce a message to screen readers via a live region */
+export declare function announceToScreenReader(message: string): void;
+/** Register an instance that uses the live region */
+export declare function acquireLiveRegion(): void;
+/** Release an instance; removes the live region when the last one is released */
+export declare function releaseLiveRegion(): void;
+//# sourceMappingURL=aria.d.ts.map

package/dist/a11y/aria.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"aria.d.ts","sourceRoot":"","sources":["../../src/a11y/aria.ts"],"names":[],"mappings":"AAKA,6DAA6D;AAC7D,wBAAgB,sBAAsB,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,CAmB5D;AAED,qDAAqD;AACrD,wBAAgB,iBAAiB,IAAI,IAAI,CAExC;AAED,iFAAiF;AACjF,wBAAgB,iBAAiB,IAAI,IAAI,CAMxC"}

package/dist/a11y/focus.d.ts

@@ -0,0 +1,9 @@
+/** Get all focusable elements within a container */
+export declare function getFocusableElements(container: HTMLElement): HTMLElement[];
+/** Create a focus trap within a popover element */
+export declare function createFocusTrap(popover: HTMLElement, returnFocusTo: HTMLElement): {
+    activate: () => void;
+    deactivate: () => void;
+    destroy: () => void;
+};
+//# sourceMappingURL=focus.d.ts.map

package/dist/a11y/focus.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"focus.d.ts","sourceRoot":"","sources":["../../src/a11y/focus.ts"],"names":[],"mappings":"AAIA,oDAAoD;AACpD,wBAAgB,oBAAoB,CAAC,SAAS,EAAE,WAAW,GAAG,WAAW,EAAE,CAE1E;AAED,mDAAmD;AACnD,wBAAgB,eAAe,CAC7B,OAAO,EAAE,WAAW,EACpB,aAAa,EAAE,WAAW,GACzB;IAAE,QAAQ,EAAE,MAAM,IAAI,CAAC;IAAC,UAAU,EAAE,MAAM,IAAI,CAAC;IAAC,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,CA8CvE"}

package/dist/a11y/keyboard.d.ts

@@ -0,0 +1,14 @@
+import type { ZoomPan } from '../zoom/zoom-pan';
+export interface KeyboardHandlerOptions {
+    container: HTMLElement;
+    getZoomPan: () => ZoomPan | null;
+    onEscape?: () => void;
+    onFullscreenToggle?: () => void;
+}
+/** Handles keyboard navigation within the hotspot container */
+export declare class KeyboardHandler {
+    private cleanups;
+    constructor(options: KeyboardHandlerOptions);
+    destroy(): void;
+}
+//# sourceMappingURL=keyboard.d.ts.map

package/dist/a11y/keyboard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"keyboard.d.ts","sourceRoot":"","sources":["../../src/a11y/keyboard.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAGhD,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,WAAW,CAAC;IACvB,UAAU,EAAE,MAAM,OAAO,GAAG,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;CACjC;AAKD,+DAA+D;AAC/D,qBAAa,eAAe;IAC1B,OAAO,CAAC,QAAQ,CAAsB;gBAE1B,OAAO,EAAE,sBAAsB;IA2E3C,OAAO,IAAI,IAAI;CAIhB"}

package/dist/core/CIHotspot.d.ts

@@ -0,0 +1,48 @@
+import type { CIHotspotConfig, CIHotspotInstance, HotspotItem } from './types';
+export declare class CIHotspot implements CIHotspotInstance {
+    private config;
+    private rootEl;
+    private containerEl;
+    private viewportEl;
+    private imgEl;
+    private markersEl;
+    private markers;
+    private popovers;
+    private normalizedHotspots;
+    private scrollHint;
+    private zoomPan;
+    private zoomControls;
+    private cloudimageHandler;
+    private resizeObserver;
+    private keyboardHandler;
+    private focusTraps;
+    private cleanups;
+    private destroyed;
+    constructor(element: HTMLElement | string, config: CIHotspotConfig);
+    /** Auto-initialize all elements with data-ci-hotspot-src attribute */
+    static autoInit(root?: HTMLElement): CIHotspotInstance[];
+    private buildDOM;
+    private applyTheme;
+    private setupImage;
+    private loadImage;
+    private initHotspots;
+    private addHotspotInternal;
+    private bindTrigger;
+    private renormalizePixelCoordinates;
+    private initZoom;
+    private setupResponsive;
+    private initKeyboard;
+    open(id: string): void;
+    close(id: string): void;
+    closeAll(): void;
+    setZoom(level: number): void;
+    getZoom(): number;
+    resetZoom(): void;
+    addHotspot(hotspot: HotspotItem): void;
+    removeHotspot(id: string): void;
+    updateHotspot(id: string, updates: Partial<HotspotItem>): void;
+    update(config: Partial<CIHotspotConfig>): void;
+    destroy(): void;
+    private destroyInternal;
+}
+//# sourceMappingURL=CIHotspot.d.ts.map

package/dist/core/CIHotspot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CIHotspot.d.ts","sourceRoot":"","sources":["../../src/core/CIHotspot.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,iBAAiB,EAAE,WAAW,EAAqB,MAAM,SAAS,CAAC;AAiBlG,qBAAa,SAAU,YAAW,iBAAiB;IACjD,OAAO,CAAC,MAAM,CAAkB;IAChC,OAAO,CAAC,MAAM,CAAc;IAC5B,OAAO,CAAC,WAAW,CAAe;IAClC,OAAO,CAAC,UAAU,CAAe;IACjC,OAAO,CAAC,KAAK,CAAoB;IACjC,OAAO,CAAC,SAAS,CAAe;IAChC,OAAO,CAAC,OAAO,CAAwC;IACvD,OAAO,CAAC,QAAQ,CAA8B;IAC9C,OAAO,CAAC,kBAAkB,CAAwC;IAClE,OAAO,CAAC,UAAU,CAA2B;IAC7C,OAAO,CAAC,OAAO,CAAwB;IACvC,OAAO,CAAC,YAAY,CAAkF;IACtG,OAAO,CAAC,iBAAiB,CAAkE;IAC3F,OAAO,CAAC,cAAc,CAA+B;IACrD,OAAO,CAAC,eAAe,CAAgC;IACvD,OAAO,CAAC,UAAU,CAAyD;IAC3E,OAAO,CAAC,QAAQ,CAAsB;IACtC,OAAO,CAAC,SAAS,CAAS;gBAEd,OAAO,EAAE,WAAW,GAAG,MAAM,EAAE,MAAM,EAAE,eAAe;IAmBlE,sEAAsE;IACtE,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,WAAW,GAAG,iBAAiB,EAAE;IAexD,OAAO,CAAC,QAAQ;IA2BhB,OAAO,CAAC,UAAU;IAMlB,OAAO,CAAC,UAAU;IA2BlB,OAAO,CAAC,SAAS;IA0BjB,OAAO,CAAC,YAAY;IAepB,OAAO,CAAC,kBAAkB;IA0C1B,OAAO,CAAC,WAAW;IAkGnB,OAAO,CAAC,2BAA2B;IAsBnC,OAAO,CAAC,QAAQ;IA6BhB,OAAO,CAAC,eAAe;IAuBvB,OAAO,CAAC,YAAY;IAapB,IAAI,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI;IAStB,KAAK,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI;IASvB,QAAQ,IAAI,IAAI;IAUhB,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAI5B,OAAO,IAAI,MAAM;IAIjB,SAAS,IAAI,IAAI;IAIjB,UAAU,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAKtC,aAAa,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI;IAgB/B,aAAa,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI;IAY9D,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,IAAI;IAgB9C,OAAO,IAAI,IAAI;IAOf,OAAO,CAAC,eAAe;CA4CxB"}

package/dist/core/ci-hotspot.d.ts

@@ -0,0 +1,95 @@
+import type { CIHotspotConfig, CIHotspotInstance, HotspotItem } from './types';
+export declare class CIHotspot implements CIHotspotInstance {
+    private config;
+    private rootEl;
+    private containerEl;
+    private viewportEl;
+    private imgEl;
+    private markersEl;
+    private markers;
+    private popovers;
+    private normalizedHotspots;
+    private scrollHint;
+    private zoomPan;
+    private zoomControls;
+    private cloudimageHandler;
+    private resizeObserver;
+    private keyboardHandler;
+    private fullscreenControl;
+    private focusTraps;
+    private cleanups;
+    private hotspotCleanups;
+    private imageLoaded;
+    private destroyed;
+    private currentSceneId;
+    private scenesMap;
+    private isTransitioning;
+    private transitionTimer;
+    private activeTimers;
+    private sceneHotspotOverrides;
+    constructor(element: HTMLElement | string, config: CIHotspotConfig);
+    /** Auto-initialize all elements with data-ci-hotspot-src or data-ci-hotspot-scenes attribute */
+    static autoInit(root?: HTMLElement): CIHotspotInstance[];
+    private buildDOM;
+    private applyTheme;
+    private setupImage;
+    private loadImage;
+    private initHotspots;
+    private addHotspotInternal;
+    /** For navigateTo hotspots without explicit data/content, generate popover content from the destination scene */
+    private enrichNavigateHotspot;
+    private static readonly NAVIGATE_ARROW_SVG;
+    private bindNavigateTrigger;
+    private bindTrigger;
+    private bindHoverTrigger;
+    private bindClickTrigger;
+    private bindKeyboardTrigger;
+    private renormalizePixelCoordinates;
+    private showLoadTriggerPopovers;
+    private initZoom;
+    private setupResponsive;
+    /** Position the markers layer to match the rendered image area within a fixed-ratio viewport */
+    private syncMarkersToImage;
+    private initScenes;
+    private initKeyboard;
+    private initFullscreen;
+    private preloadedScenes;
+    private preloadSceneImage;
+    private ensureFocusTrap;
+    /** Create a setTimeout that is automatically cleared on destroy */
+    private trackedTimeout;
+    /** Sync current hotspots back to scene override map so navigating away and back preserves changes */
+    private syncCurrentSceneHotspots;
+    private addHotspotCleanups;
+    private clearHotspots;
+    /** Read scene transition duration from CSS variable (handles both ms and s units) */
+    private getSceneTransitionDuration;
+    private performSceneTransition;
+    private switchToScene;
+    /** Get references to the internal DOM elements */
+    getElements(): {
+        container: HTMLElement;
+        viewport: HTMLElement;
+        image: HTMLImageElement;
+        markers: HTMLElement;
+    };
+    open(id: string): void;
+    close(id: string): void;
+    closeAll(): void;
+    setZoom(level: number): void;
+    getZoom(): number;
+    resetZoom(): void;
+    goToScene(sceneId: string): void;
+    getCurrentScene(): string | undefined;
+    getScenes(): string[];
+    enterFullscreen(): void;
+    exitFullscreen(): void;
+    isFullscreen(): boolean;
+    addHotspot(hotspot: HotspotItem): void;
+    removeHotspot(id: string): void;
+    updateHotspot(id: string, updates: Partial<HotspotItem>): void;
+    update(config: Partial<CIHotspotConfig>): void;
+    destroy(): void;
+    private destroyInternal;
+}
+//# sourceMappingURL=ci-hotspot.d.ts.map

package/dist/core/ci-hotspot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ci-hotspot.d.ts","sourceRoot":"","sources":["../../src/core/ci-hotspot.ts"],"names":[],"mappings":"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"}

package/dist/core/config.d.ts

@@ -0,0 +1,15 @@
+import type { CIHotspotConfig, ResolvedCIHotspotConfig } from './types';
+export declare const DEFAULT_CONFIG: Omit<Required<CIHotspotConfig>, 'src' | 'hotspots' | 'cloudimage' | 'renderPopover' | 'onOpen' | 'onClose' | 'onZoom' | 'onClick' | 'scenes' | 'initialScene' | 'onSceneChange' | 'sceneAspectRatio' | 'onFullscreenChange'>;
+/** Data attribute to config property mapping */
+export declare const DATA_ATTR_MAP: Record<string, {
+    key: string;
+    type: 'string' | 'boolean' | 'number' | 'json';
+    nested?: string;
+}>;
+/** Parse data attributes from an element into a config object */
+export declare function parseDataAttributes(element: HTMLElement): Partial<CIHotspotConfig>;
+/** Merge user config with defaults */
+export declare function mergeConfig(userConfig: Partial<CIHotspotConfig>): ResolvedCIHotspotConfig;
+/** Validate config — throws on critical issues */
+export declare function validateConfig(config: ResolvedCIHotspotConfig): void;
+//# sourceMappingURL=config.d.ts.map

package/dist/core/config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/core/config.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAoB,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAE1F,eAAO,MAAM,cAAc,EAAE,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,EAAE,KAAK,GAAG,UAAU,GAAG,YAAY,GAAG,eAAe,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,cAAc,GAAG,eAAe,GAAG,kBAAkB,GAAG,oBAAoB,CAgBvP,CAAC;AAEF,gDAAgD;AAChD,eAAO,MAAM,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAA;CAAE,CA0B1H,CAAC;AAEF,iEAAiE;AACjE,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CAAC,eAAe,CAAC,CAsBlF;AA0BD,sCAAsC;AACtC,wBAAgB,WAAW,CAAC,UAAU,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,uBAAuB,CAOzF;AAED,kDAAkD;AAClD,wBAAgB,cAAc,CAAC,MAAM,EAAE,uBAAuB,GAAG,IAAI,CA0BpE"}