@useclickly/react 1.0.0 → 1.0.1

package/dist/internal/AnnotationList.d.ts

@@ -0,0 +1,11 @@
+interface Props {
+    anchor: {
+        x: number;
+        y: number;
+    };
+    width: number;
+    onClose: () => void;
+}
+export declare function AnnotationList({ anchor, width, onClose }: Props): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=AnnotationList.d.ts.map

package/dist/internal/AnnotationList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnnotationList.d.ts","sourceRoot":"","sources":["../../src/internal/AnnotationList.tsx"],"names":[],"mappings":"AAOA,UAAU,KAAK;IACb,MAAM,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,wBAAgB,cAAc,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,KAAK,+BA2C/D"}

package/dist/internal/AnnotationPins.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Persistent numbered markers anchored to annotated elements. Updates
+ * on scroll/resize (RAF-coalesced) and re-resolves the live element by
+ * its stored `elementPath` selector on each render.
+ */
+export declare function AnnotationPins(): import("react").JSX.Element;
+//# sourceMappingURL=AnnotationPins.d.ts.map

package/dist/internal/AnnotationPins.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnnotationPins.d.ts","sourceRoot":"","sources":["../../src/internal/AnnotationPins.tsx"],"names":[],"mappings":"AAKA;;;;GAIG;AACH,wBAAgB,cAAc,gCA6B7B"}

package/dist/internal/AnnotationPopup.d.ts

@@ -0,0 +1,5 @@
+import { type SelectionEngine } from "@useclickly/core";
+export declare function AnnotationPopup({ engine }: {
+    engine: SelectionEngine;
+}): import("react").JSX.Element | null;
+//# sourceMappingURL=AnnotationPopup.d.ts.map

package/dist/internal/AnnotationPopup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnnotationPopup.d.ts","sourceRoot":"","sources":["../../src/internal/AnnotationPopup.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,KAAK,eAAe,EACrB,MAAM,kBAAkB,CAAC;AAS1B,wBAAgB,eAAe,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,eAAe,CAAA;CAAE,sCA4RtE"}

package/dist/internal/ClicklyRoot.d.ts

@@ -0,0 +1,15 @@
+import type { SelectionEngine } from "@useclickly/core";
+/**
+ * Top-level React subtree rendered (via createPortal) inside the
+ * shadow root. Owns:
+ *
+ *  - the expanded ↔ collapsed UI state
+ *  - all keyboard shortcuts (delegating engine actions to the engine)
+ *  - the body `data-clickly-active` attribute used to flip the page
+ *    cursor to crosshair while inspecting
+ */
+export declare function ClicklyRoot({ engine, host, }: {
+    engine: SelectionEngine;
+    host: HTMLElement;
+}): import("react").JSX.Element;
+//# sourceMappingURL=ClicklyRoot.d.ts.map

package/dist/internal/ClicklyRoot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ClicklyRoot.d.ts","sourceRoot":"","sources":["../../src/internal/ClicklyRoot.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAUxD;;;;;;;;GAQG;AACH,wBAAgB,WAAW,CAAC,EAC1B,MAAM,EACN,IAAI,GACL,EAAE;IACD,MAAM,EAAE,eAAe,CAAC;IACxB,IAAI,EAAE,WAAW,CAAC;CACnB,+BA2HA"}

package/dist/internal/CollapsedFAB.d.ts

@@ -0,0 +1,10 @@
+interface Props {
+    onExpand: () => void;
+}
+/**
+ * Default state — a small round button anchored bottom-right.
+ * Click to expand the full toolbar.
+ */
+export declare function CollapsedFAB({ onExpand }: Props): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=CollapsedFAB.d.ts.map

package/dist/internal/CollapsedFAB.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollapsedFAB.d.ts","sourceRoot":"","sources":["../../src/internal/CollapsedFAB.tsx"],"names":[],"mappings":"AAGA,UAAU,KAAK;IACb,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,EAAE,KAAK,+BAe/C"}

package/dist/internal/SettingsPopover.d.ts

@@ -0,0 +1,11 @@
+interface Props {
+    anchor: {
+        x: number;
+        y: number;
+    };
+    width: number;
+    onClose: () => void;
+}
+export declare function SettingsPopover({ anchor, width, onClose }: Props): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=SettingsPopover.d.ts.map

package/dist/internal/SettingsPopover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SettingsPopover.d.ts","sourceRoot":"","sources":["../../src/internal/SettingsPopover.tsx"],"names":[],"mappings":"AAIA,UAAU,KAAK;IACb,MAAM,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,wBAAgB,eAAe,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,KAAK,+BAyGhE"}

package/dist/internal/Toolbar.d.ts

@@ -0,0 +1,8 @@
+import type { SelectionEngine } from "@useclickly/core";
+interface Props {
+    engine: SelectionEngine;
+    onCollapse: () => void;
+}
+export declare function Toolbar({ engine, onCollapse }: Props): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=Toolbar.d.ts.map

package/dist/internal/Toolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../src/internal/Toolbar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAiB,MAAM,kBAAkB,CAAC;AAsBvE,UAAU,KAAK;IACb,MAAM,EAAE,eAAe,CAAC;IACxB,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAuBD,wBAAgB,OAAO,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,EAAE,KAAK,+BAyLpD"}

package/dist/internal/globalStyles.d.ts

@@ -0,0 +1,13 @@
+/**
+ * CSS injected into `document.head` (NOT the shadow root). Targets the
+ * host page body to:
+ *
+ *   - disable text selection while we're inspecting/pressed/dragging
+ *     (otherwise the browser tries to select text mid-drag and the
+ *     marquee never starts)
+ *   - swap the cursor to crosshair in area mode for a clear UX cue
+ *
+ * Mounted by `Clickly.tsx`, torn down on unmount.
+ */
+export declare const GLOBAL_PAGE_CSS = "\nbody[data-clickly-active] {\n  -webkit-user-select: none !important;\n  user-select: none !important;\n}\nbody[data-clickly-active],\nbody[data-clickly-active] *:not(input):not(textarea):not(select) {\n  cursor: crosshair !important;\n}\nbody[data-clickly-mode=\"multi\"],\nbody[data-clickly-mode=\"multi\"] *:not(input):not(textarea):not(select) {\n  cursor: copy !important;\n}\n/* Restore normal cursor while the annotation popup is open so the user\n   can comfortably type in the textarea + click the buttons. */\nbody[data-clickly-annotating] {\n  cursor: default !important;\n}\n";
+//# sourceMappingURL=globalStyles.d.ts.map

package/dist/internal/globalStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"globalStyles.d.ts","sourceRoot":"","sources":["../../src/internal/globalStyles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,eAAO,MAAM,eAAe,ilBAkB3B,CAAC"}

package/dist/internal/icons.d.ts

@@ -0,0 +1,12 @@
+export declare const IconCursor: () => import("react").JSX.Element;
+export declare const IconLayers: () => import("react").JSX.Element;
+export declare const IconSquare: () => import("react").JSX.Element;
+export declare const IconCopy: () => import("react").JSX.Element;
+export declare const IconTrash: () => import("react").JSX.Element;
+export declare const IconSettings: () => import("react").JSX.Element;
+export declare const IconGrip: () => import("react").JSX.Element;
+export declare const IconClose: () => import("react").JSX.Element;
+export declare const IconCheck: () => import("react").JSX.Element;
+export declare const IconList: () => import("react").JSX.Element;
+export declare const IconPower: () => import("react").JSX.Element;
+//# sourceMappingURL=icons.d.ts.map

package/dist/internal/icons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../../src/internal/icons.tsx"],"names":[],"mappings":"AA0BA,eAAO,MAAM,UAAU,mCAItB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAMtB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAItB,CAAC;AAEF,eAAO,MAAM,QAAQ,mCAKpB,CAAC;AAEF,eAAO,MAAM,SAAS,mCAIrB,CAAC;AAEF,eAAO,MAAM,YAAY,mCAKxB,CAAC;AAEF,eAAO,MAAM,QAAQ,mCASpB,CAAC;AAEF,eAAO,MAAM,SAAS,mCAIrB,CAAC;AAEF,eAAO,MAAM,SAAS,mCAIrB,CAAC;AAEF,eAAO,MAAM,QAAQ,mCAIpB,CAAC;AAEF,eAAO,MAAM,SAAS,mCAIrB,CAAC"}

package/dist/internal/styles.d.ts

@@ -0,0 +1,7 @@
+/**
+ * CSS injected into the shadow root by the React layer. Separate from
+ * the overlay-marker CSS in `@useclickly/core/styles` so each package owns
+ * its surface.
+ */
+export declare const REACT_UI_CSS = "\n.clickly-ui, .clickly-ui * { box-sizing: border-box; }\n\n/* \u2500\u2500\u2500 Floating action button (collapsed state) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.clickly-fab {\n  position: fixed;\n  right: 16px;\n  bottom: 16px;\n  width: 48px;\n  height: 48px;\n  border: none;\n  border-radius: 999px;\n  background: #0f172a;\n  color: #f8fafc;\n  display: grid;\n  place-items: center;\n  cursor: pointer;\n  pointer-events: auto;\n  user-select: none;\n  box-shadow:\n    0 8px 24px rgba(0,0,0,0.30),\n    0 0 0 1px rgba(255,255,255,0.06) inset;\n  transition: transform 140ms ease, box-shadow 140ms ease;\n  z-index: 1;\n}\n.clickly-fab:hover {\n  transform: scale(1.06);\n  box-shadow:\n    0 10px 28px rgba(0,0,0,0.36),\n    0 0 0 1px rgba(255,255,255,0.10) inset;\n}\n.clickly-fab:active { transform: scale(0.96); }\n.clickly-fab svg { width: 18px; height: 18px; color: #f8fafc; }\n\n.clickly-fab-badge {\n  position: absolute;\n  top: -2px;\n  right: -2px;\n  min-width: 18px;\n  height: 18px;\n  padding: 0 5px;\n  background: #f59e0b;\n  color: #0f172a;\n  font: 600 11px -apple-system, BlinkMacSystemFont, \"Segoe UI\", system-ui, sans-serif;\n  border-radius: 9px;\n  display: grid;\n  place-items: center;\n  pointer-events: none;\n}\n\n/* \u2500\u2500\u2500 Toolbar (expanded state) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.clickly-toolbar {\n  position: fixed;\n  display: flex;\n  align-items: center;\n  gap: 2px;\n  padding: 6px;\n  height: 44px;\n  background: rgba(9, 14, 28, 0.97);\n  color: #f8fafc;\n  border-radius: 16px;\n  font: 13px/1 -apple-system, BlinkMacSystemFont, \"Segoe UI\", system-ui, sans-serif;\n  box-shadow:\n    0 16px 40px rgba(0,0,0,0.45),\n    0 0 0 1px rgba(255,255,255,0.08) inset,\n    0 1px 0 rgba(255,255,255,0.06) inset;\n  pointer-events: auto;\n  user-select: none;\n  z-index: 1;\n  animation: clickly-fade-in 150ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n@keyframes clickly-fade-in {\n  from { opacity: 0; transform: translateY(6px) scale(0.97); }\n  to   { opacity: 1; transform: translateY(0) scale(1); }\n}\n\n.clickly-toolbar .grip {\n  display: grid;\n  place-items: center;\n  width: 22px;\n  height: 32px;\n  color: #475569;\n  touch-action: none;\n  cursor: grab;\n  border-radius: 6px;\n  transition: color 120ms ease;\n}\n.clickly-toolbar .grip:hover { color: #94a3b8; }\n.clickly-toolbar .grip:active { cursor: grabbing; }\n\n.clickly-toolbar .divider {\n  width: 1px;\n  height: 20px;\n  background: rgba(255,255,255,0.08);\n  margin: 0 3px;\n  flex-shrink: 0;\n}\n\n.clickly-btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 4px;\n  height: 32px;\n  padding: 0 8px;\n  background: transparent;\n  border: none;\n  border-radius: 10px;\n  color: #94a3b8;\n  cursor: pointer;\n  font: inherit;\n  transition: background 100ms ease, color 100ms ease;\n  position: relative;\n}\n.clickly-btn:hover  { background: rgba(255,255,255,0.09); color: #e2e8f0; }\n.clickly-btn:active { background: rgba(255,255,255,0.15); color: #fff; transform: scale(0.96); }\n.clickly-btn.is-active {\n  background: #0ea5e9;\n  color: #fff;\n  box-shadow: 0 0 0 1px rgba(14,165,233,0.4), 0 2px 8px rgba(14,165,233,0.3);\n}\n.clickly-btn.is-active:hover { background: #0284c7; }\n.clickly-btn[disabled] { opacity: 0.28; cursor: not-allowed; pointer-events: none; }\n\n.clickly-btn.icon-only {\n  width: 32px;\n  padding: 0;\n}\n\n.clickly-btn.primary-pinned {\n  background: #10b981;\n  color: #fff;\n  font-weight: 600;\n  font-size: 12px;\n  padding: 0 10px;\n  gap: 5px;\n  box-shadow: 0 0 0 1px rgba(16,185,129,0.4), 0 2px 8px rgba(16,185,129,0.25);\n}\n.clickly-btn.primary-pinned:hover { background: #059669; }\n\n/* \u2500\u2500\u2500 Tooltip \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.clickly-tip {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  /* Ensures the absolute-positioned counter badge clips correctly */\n  isolation: isolate;\n}\n\n.clickly-tip .tip-bubble {\n  position: absolute;\n  bottom: calc(100% + 10px);\n  left: 50%;\n  transform: translateX(-50%);\n  background: rgba(15, 23, 42, 0.98);\n  color: #f1f5f9;\n  font-size: 12px;\n  font-weight: 500;\n  white-space: nowrap;\n  padding: 5px 10px;\n  border-radius: 8px;\n  pointer-events: none;\n  opacity: 0;\n  transition: opacity 80ms ease;\n  transition-delay: 200ms;\n  box-shadow: 0 4px 16px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.07) inset;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  z-index: 10;\n}\n\n/* Arrow */\n.clickly-tip .tip-bubble::after {\n  content: \"\";\n  position: absolute;\n  top: 100%;\n  left: 50%;\n  transform: translateX(-50%);\n  border: 5px solid transparent;\n  border-top-color: rgba(15, 23, 42, 0.98);\n}\n\n.clickly-tip:hover .tip-bubble { opacity: 1; }\n\n.clickly-tip .tip-bubble kbd {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 18px;\n  height: 18px;\n  padding: 0 4px;\n  background: rgba(255,255,255,0.12);\n  border: 1px solid rgba(255,255,255,0.10);\n  border-radius: 4px;\n  font: 11px/1 ui-monospace, \"SF Mono\", Menlo, monospace;\n  color: #94a3b8;\n}\n\n/* \u2500\u2500\u2500 Popup & popovers \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.clickly-popup, .clickly-popover {\n  position: fixed;\n  background: #fff;\n  color: #0f172a;\n  border-radius: 10px;\n  box-shadow: 0 12px 32px rgba(2,6,23,0.18), 0 0 0 1px rgba(15,23,42,0.06);\n  font: 13px/1.5 -apple-system, BlinkMacSystemFont, \"Segoe UI\", system-ui, sans-serif;\n  pointer-events: auto;\n  z-index: 2;\n  animation: clickly-fade-in 120ms ease-out;\n}\n\n.clickly-popup {\n  width: 320px;\n  padding: 12px;\n  max-height: calc(100vh - 80px);\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n}\n\n/* Collapsible header row \u2014 shows element label + CSS toggle */\n.clickly-popup .popup-header {\n  display: flex;\n  align-items: center;\n  gap: 5px;\n  margin-bottom: 8px;\n  padding: 4px 2px;\n  border-radius: 4px;\n  cursor: pointer;\n  user-select: none;\n  color: #475569;\n  font-size: 11px;\n  font-family: ui-monospace, \"SF Mono\", Menlo, monospace;\n  transition: background 80ms ease;\n}\n.clickly-popup .popup-header:hover { background: #f1f5f9; }\n\n.clickly-popup .popup-chevron {\n  font-size: 12px;\n  color: #94a3b8;\n  flex-shrink: 0;\n  width: 12px;\n  text-align: center;\n}\n\n.clickly-popup .popup-label {\n  flex: 1;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n/* Edit-mode toggle button \u2014 top-right of CSS panel header */\n.clickly-popup .popup-edit-toggle {\n  flex-shrink: 0;\n  display: grid;\n  place-items: center;\n  width: 20px;\n  height: 20px;\n  background: transparent;\n  border: 1px solid #e2e8f0;\n  border-radius: 5px;\n  color: #94a3b8;\n  cursor: pointer;\n  padding: 0;\n  margin-left: auto;\n  transition: background 100ms ease, color 100ms ease, border-color 100ms ease;\n}\n.clickly-popup .popup-edit-toggle:hover {\n  background: #f1f5f9;\n  color: #475569;\n  border-color: #cbd5e1;\n}\n.clickly-popup .popup-edit-toggle.is-editing {\n  background: #0ea5e9;\n  color: #fff;\n  border-color: #0ea5e9;\n}\n.clickly-popup .popup-edit-toggle.is-editing:hover {\n  background: #0284c7;\n}\n\n/* Computed-styles panel */\n.clickly-popup .popup-styles {\n  margin-bottom: 8px;\n  padding: 8px;\n  background: #f8fafc;\n  border: 1px solid #e2e8f0;\n  border-radius: 6px;\n  font-family: ui-monospace, \"SF Mono\", Menlo, monospace;\n  font-size: 11px;\n  max-height: 160px;\n  overflow-y: auto;\n  overscroll-behavior: contain;\n}\n\n.clickly-popup .style-row {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  line-height: 1.7;\n  border-radius: 4px;\n  padding: 0 2px;\n  transition: background 80ms ease;\n}\n\n.clickly-popup .style-row--changed {\n  background: rgba(245, 158, 11, 0.10);\n}\n\n.clickly-popup .style-key {\n  color: #7c3aed;\n  flex-shrink: 0;\n  min-width: 90px;\n  font-size: 11px;\n}\n\n/* Editable value input \u2014 live CSS preview */\n.clickly-popup .style-val-input {\n  flex: 1;\n  min-width: 0;\n  background: transparent;\n  border: none;\n  border-bottom: 1px solid transparent;\n  color: #0f172a;\n  font: 11px/1.7 ui-monospace, \"SF Mono\", Menlo, monospace;\n  padding: 0;\n  outline: none;\n  transition: border-color 100ms ease;\n  word-break: break-all;\n}\n.clickly-popup .style-val-input:focus {\n  border-bottom-color: #0ea5e9;\n  background: rgba(14, 165, 233, 0.05);\n  border-radius: 2px 2px 0 0;\n}\n\n/* Revert button shown only on changed rows */\n.clickly-popup .style-revert-btn {\n  flex-shrink: 0;\n  background: transparent;\n  border: none;\n  color: #94a3b8;\n  font-size: 13px;\n  cursor: pointer;\n  padding: 0 2px;\n  line-height: 1;\n  border-radius: 3px;\n  transition: color 80ms ease, background 80ms ease;\n}\n.clickly-popup .style-revert-btn:hover {\n  color: #f59e0b;\n  background: rgba(245,158,11,0.12);\n}\n\n/* Hint text at bottom of CSS panel when edits exist */\n.clickly-popup .style-hint {\n  margin-top: 6px;\n  padding-top: 6px;\n  border-top: 1px solid #e2e8f0;\n  font-size: 10.5px;\n  color: #94a3b8;\n  font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", system-ui, sans-serif;\n  line-height: 1.4;\n}\n\n.clickly-popup textarea {\n  width: 100%;\n  min-height: 64px;\n  max-height: 160px;\n  padding: 8px;\n  border: 1px solid #e2e8f0;\n  border-radius: 6px;\n  resize: vertical;\n  font: inherit;\n  color: inherit;\n}\n.clickly-popup textarea:focus {\n  outline: none;\n  border-color: #0ea5e9;\n  box-shadow: 0 0 0 3px rgba(14,165,233,0.18);\n}\n\n.clickly-popup .row {\n  display: flex;\n  justify-content: flex-end;\n  gap: 6px;\n  margin-top: 10px;\n}\n\n.clickly-popup .row .ghost {\n  background: transparent;\n  color: #475569;\n  border: 1px solid #e2e8f0;\n}\n.clickly-popup .row .ghost:hover { background: #f8fafc; }\n\n.clickly-popup .row .primary {\n  background: #0ea5e9;\n  color: #fff;\n  border: none;\n}\n.clickly-popup .row .primary:hover { background: #0284c7; }\n.clickly-popup .row button {\n  height: 28px;\n  padding: 0 12px;\n  border-radius: 6px;\n  font: inherit;\n  cursor: pointer;\n}\n\n/* Old popover kept for any legacy use */\n.clickly-popover { width: 260px; padding: 12px; }\n\n/* \u2500\u2500\u2500 Settings panel (redesigned) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.clickly-settings {\n  position: fixed;\n  width: 284px;\n  background: #fff;\n  border-radius: 14px;\n  box-shadow: 0 16px 48px rgba(2,6,23,0.20), 0 0 0 1px rgba(15,23,42,0.07);\n  font: 13px/1.5 -apple-system, BlinkMacSystemFont, \"Segoe UI\", system-ui, sans-serif;\n  color: #0f172a;\n  pointer-events: auto;\n  z-index: 2;\n  animation: clickly-fade-in 150ms cubic-bezier(0.16, 1, 0.3, 1);\n  overflow: hidden;\n}\n\n.settings-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 14px 14px 12px;\n  border-bottom: 1px solid #f1f5f9;\n}\n\n.settings-title {\n  font-size: 13px;\n  font-weight: 600;\n  color: #0f172a;\n  letter-spacing: -0.01em;\n}\n\n.settings-close {\n  display: grid;\n  place-items: center;\n  width: 24px;\n  height: 24px;\n  background: #f1f5f9;\n  border: none;\n  border-radius: 6px;\n  color: #64748b;\n  cursor: pointer;\n  padding: 0;\n  transition: background 100ms, color 100ms;\n}\n.settings-close:hover { background: #e2e8f0; color: #0f172a; }\n.settings-close svg { width: 13px; height: 13px; }\n\n.settings-section { padding: 10px 14px; }\n\n.settings-divider {\n  height: 1px;\n  background: #f1f5f9;\n  margin: 0;\n}\n\n.settings-label {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  font-size: 13px;\n  font-weight: 500;\n  color: #1e293b;\n  margin-bottom: 8px;\n}\n\n.settings-hint {\n  font-size: 11.5px;\n  font-weight: 400;\n  color: #94a3b8;\n}\n\n.settings-select {\n  width: 100%;\n  padding: 7px 10px;\n  background: #f8fafc;\n  border: 1px solid #e2e8f0;\n  border-radius: 8px;\n  font: inherit;\n  font-size: 13px;\n  color: #1e293b;\n  cursor: pointer;\n  appearance: none;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E\");\n  background-repeat: no-repeat;\n  background-position: right 10px center;\n  padding-right: 32px;\n  transition: border-color 120ms, box-shadow 120ms;\n}\n.settings-select:focus {\n  outline: none;\n  border-color: #0ea5e9;\n  box-shadow: 0 0 0 3px rgba(14,165,233,0.15);\n  background-color: #fff;\n}\n\n.settings-row {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  padding: 6px 0;\n}\n.settings-row + .settings-row {\n  border-top: 1px solid #f8fafc;\n}\n\n.settings-row-label {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  font-size: 13px;\n  font-weight: 500;\n  color: #1e293b;\n  min-width: 0;\n}\n\n/* Toggle switch */\n.clickly-toggle {\n  position: relative;\n  flex-shrink: 0;\n  width: 38px;\n  height: 22px;\n  cursor: pointer;\n}\n.clickly-toggle input {\n  position: absolute;\n  opacity: 0;\n  width: 0;\n  height: 0;\n}\n.toggle-track {\n  position: absolute;\n  inset: 0;\n  background: #e2e8f0;\n  border-radius: 11px;\n  transition: background 180ms ease;\n}\n.toggle-track::after {\n  content: \"\";\n  position: absolute;\n  top: 3px;\n  left: 3px;\n  width: 16px;\n  height: 16px;\n  background: #fff;\n  border-radius: 50%;\n  box-shadow: 0 1px 4px rgba(0,0,0,0.2);\n  transition: transform 180ms cubic-bezier(0.34, 1.56, 0.64, 1);\n}\n.clickly-toggle input:checked + .toggle-track {\n  background: #0ea5e9;\n}\n.clickly-toggle input:checked + .toggle-track::after {\n  transform: translateX(16px);\n}\n\n/* Color picker */\n.settings-color-wrap {\n  display: flex;\n  align-items: center;\n  gap: 0;\n  cursor: pointer;\n  border-radius: 8px;\n  overflow: hidden;\n  border: 1px solid #e2e8f0;\n  flex-shrink: 0;\n}\n.settings-color-wrap input[type=\"color\"] {\n  position: absolute;\n  opacity: 0;\n  width: 0;\n  height: 0;\n  pointer-events: none;\n}\n.color-swatch {\n  display: block;\n  width: 32px;\n  height: 24px;\n  border-radius: 7px;\n  border: 1px solid rgba(0,0,0,0.08);\n  transition: transform 100ms ease;\n}\n.settings-color-wrap:hover .color-swatch { transform: scale(1.08); }\n\n.clickly-counter {\n  /* Float as a badge \u2014 positioned absolutely so it doesn't widen the button */\n  position: absolute;\n  top: -5px;\n  right: -5px;\n  min-width: 16px;\n  height: 16px;\n  padding: 0 4px;\n  border-radius: 8px;\n  background: #f59e0b;\n  color: #0f172a;\n  font-size: 10px;\n  font-weight: 700;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  pointer-events: none;\n  border: 1.5px solid rgba(9, 14, 28, 0.97);\n}\n\n/* \u2500\u2500\u2500 Annotation pins (persistent numbered markers) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.clickly-pin {\n  position: fixed;\n  width: 24px;\n  height: 24px;\n  border-radius: 999px;\n  background: #10b981;\n  color: #fff;\n  font: 700 11px/24px -apple-system, BlinkMacSystemFont, \"Segoe UI\", system-ui, sans-serif;\n  text-align: center;\n  cursor: pointer;\n  pointer-events: auto;\n  user-select: none;\n  box-shadow: 0 2px 8px rgba(16,185,129,0.4), 0 0 0 2px #fff;\n  z-index: 10;\n  transition: transform 120ms cubic-bezier(0.34,1.56,0.64,1), box-shadow 120ms ease;\n}\n.clickly-pin:hover {\n  transform: scale(1.18);\n  box-shadow: 0 4px 16px rgba(16,185,129,0.5), 0 0 0 2px #fff;\n}\n.clickly-pin-num { display: block; }\n\n/* \u2500\u2500\u2500 Pin hover preview (dark tooltip) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.pin-preview {\n  position: absolute;\n  right: calc(100% + 10px);\n  top: 50%;\n  transform: translateY(-50%);\n  width: 220px;\n  padding: 8px 10px;\n  background: rgba(9, 14, 28, 0.96);\n  color: #f1f5f9;\n  border-radius: 10px;\n  box-shadow: 0 8px 24px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.07) inset;\n  font: 12px/1.45 -apple-system, BlinkMacSystemFont, \"Segoe UI\", system-ui, sans-serif;\n  text-align: left;\n  cursor: default;\n  pointer-events: none;\n  z-index: 11;\n  animation: clickly-fade-in 100ms ease-out;\n  white-space: normal;\n}\n\n.pin-preview-meta {\n  font-size: 10.5px;\n  color: #64748b;\n  font-family: ui-monospace, \"SF Mono\", Menlo, monospace;\n  margin-bottom: 4px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.pin-preview-comment {\n  font-size: 12px;\n  color: #e2e8f0;\n  word-break: break-word;\n  display: -webkit-box;\n  -webkit-line-clamp: 3;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n/* \u2500\u2500\u2500 Pin edit popup \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.pin-edit {\n  position: absolute;\n  right: calc(100% + 10px);\n  top: 50%;\n  transform: translateY(-50%);\n  width: 260px;\n  background: #fff;\n  border-radius: 12px;\n  box-shadow: 0 12px 40px rgba(2,6,23,0.20), 0 0 0 1px rgba(15,23,42,0.07);\n  font: 13px/1.5 -apple-system, BlinkMacSystemFont, \"Segoe UI\", system-ui, sans-serif;\n  color: #0f172a;\n  text-align: left;\n  cursor: default;\n  z-index: 11;\n  animation: clickly-fade-in 120ms cubic-bezier(0.16,1,0.3,1);\n  overflow: hidden;\n}\n\n.pin-edit-header {\n  padding: 10px 12px 8px;\n  border-bottom: 1px solid #f1f5f9;\n}\n\n.pin-edit-label {\n  font-size: 11.5px;\n  font-weight: 600;\n  color: #475569;\n}\n\n.pin-edit-path {\n  font-family: ui-monospace, \"SF Mono\", Menlo, monospace;\n  font-weight: 400;\n  color: #94a3b8;\n  font-size: 10.5px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  display: inline-block;\n  max-width: 160px;\n  vertical-align: bottom;\n}\n\n.pin-edit-textarea {\n  display: block;\n  width: 100%;\n  min-height: 72px;\n  padding: 10px 12px;\n  border: none;\n  border-bottom: 1px solid #f1f5f9;\n  resize: vertical;\n  font: 13px/1.5 inherit;\n  color: #0f172a;\n  background: #fff;\n  box-sizing: border-box;\n}\n.pin-edit-textarea:focus {\n  outline: none;\n  background: #f8fafc;\n}\n\n.pin-edit-actions {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 8px 10px;\n  gap: 6px;\n}\n\n.pin-edit-right {\n  display: flex;\n  gap: 6px;\n}\n\n.pin-edit-delete {\n  display: grid;\n  place-items: center;\n  width: 30px;\n  height: 30px;\n  background: transparent;\n  border: 1px solid #fee2e2;\n  border-radius: 8px;\n  color: #ef4444;\n  cursor: pointer;\n  padding: 0;\n  transition: background 100ms, border-color 100ms;\n}\n.pin-edit-delete:hover { background: #fef2f2; border-color: #fca5a5; }\n.pin-edit-delete svg { width: 14px; height: 14px; }\n\n.pin-edit-cancel, .pin-edit-save {\n  height: 30px;\n  padding: 0 12px;\n  border-radius: 8px;\n  font: 12px/1 inherit;\n  font-weight: 500;\n  cursor: pointer;\n  border: none;\n  transition: background 100ms;\n}\n\n.pin-edit-cancel {\n  background: #f1f5f9;\n  color: #475569;\n}\n.pin-edit-cancel:hover { background: #e2e8f0; }\n\n.pin-edit-save {\n  background: #10b981;\n  color: #fff;\n}\n.pin-edit-save:hover { background: #059669; }\n\n/* \u2500\u2500\u2500 Annotation list \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.clickly-list {\n  position: fixed;\n  width: 320px;\n  max-height: 55vh;\n  background: #fff;\n  border-radius: 14px;\n  box-shadow: 0 16px 48px rgba(2,6,23,0.20), 0 0 0 1px rgba(15,23,42,0.07);\n  color: #0f172a;\n  font: 13px/1.5 -apple-system, BlinkMacSystemFont, \"Segoe UI\", system-ui, sans-serif;\n  pointer-events: auto;\n  z-index: 2;\n  animation: clickly-fade-in 150ms cubic-bezier(0.16, 1, 0.3, 1);\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.list-header {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 12px 14px 10px;\n  border-bottom: 1px solid #f1f5f9;\n  flex-shrink: 0;\n}\n\n.list-title {\n  font-size: 13px;\n  font-weight: 600;\n  color: #0f172a;\n  letter-spacing: -0.01em;\n  flex: 1;\n}\n\n.list-count {\n  min-width: 20px;\n  height: 20px;\n  padding: 0 6px;\n  background: #f1f5f9;\n  color: #475569;\n  font-size: 11px;\n  font-weight: 600;\n  border-radius: 10px;\n  display: grid;\n  place-items: center;\n}\n\n.list-items {\n  overflow-y: auto;\n  overscroll-behavior: contain;\n  flex: 1;\n}\n\n.list-empty {\n  padding: 24px;\n  text-align: center;\n  color: #94a3b8;\n  font-size: 12px;\n}\n\n/* \u2500\u2500\u2500 Annotation card \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.list-card {\n  padding: 10px 12px;\n  border-bottom: 1px solid #f8fafc;\n  transition: background 80ms ease;\n}\n.list-card:last-child { border-bottom: none; }\n.list-card:hover { background: #fafafa; }\n\n.list-card-header {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  margin-bottom: 4px;\n}\n\n.list-card-num {\n  font-size: 11px;\n  font-weight: 700;\n  color: #94a3b8;\n  flex-shrink: 0;\n  min-width: 20px;\n}\n\n.list-card-path {\n  flex: 1;\n  min-width: 0;\n  font-family: ui-monospace, \"SF Mono\", Menlo, monospace;\n  font-size: 10.5px;\n  color: #475569;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.list-card-actions {\n  display: flex;\n  gap: 3px;\n  flex-shrink: 0;\n}\n\n.list-action-btn {\n  display: grid;\n  place-items: center;\n  width: 24px;\n  height: 24px;\n  background: transparent;\n  border: none;\n  border-radius: 6px;\n  color: #94a3b8;\n  cursor: pointer;\n  padding: 0;\n  transition: background 80ms ease, color 80ms ease;\n}\n.list-action-btn svg { width: 12px; height: 12px; }\n.list-action-btn:hover { background: #f1f5f9; color: #475569; }\n.list-action-btn.copied { color: #10b981; }\n.list-action-btn.list-action-delete:hover { background: #fef2f2; color: #ef4444; }\n\n.list-card-comment {\n  font-size: 12px;\n  color: #1e293b;\n  line-height: 1.45;\n  margin: 0 0 6px;\n  word-break: break-word;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n/* CSS changes badge */\n.list-card-css {\n  background: rgba(124, 58, 237, 0.05);\n  border: 1px solid rgba(124, 58, 237, 0.12);\n  border-radius: 6px;\n  padding: 5px 8px;\n  margin-top: 4px;\n}\n\n.list-card-css-label {\n  display: block;\n  font-size: 10px;\n  font-weight: 600;\n  color: #7c3aed;\n  text-transform: uppercase;\n  letter-spacing: 0.04em;\n  margin-bottom: 3px;\n}\n\n.list-card-css-code {\n  font-family: ui-monospace, \"SF Mono\", Menlo, monospace;\n  font-size: 10px;\n  color: #475569;\n  line-height: 1.5;\n  margin: 0;\n  white-space: pre-wrap;\n  word-break: break-all;\n  max-height: 60px;\n  overflow: hidden;\n}\n";
+//# sourceMappingURL=styles.d.ts.map

package/dist/internal/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/internal/styles.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,eAAO,MAAM,YAAY,i5vBAy8BxB,CAAC"}

package/dist/output/markdown.d.ts

@@ -0,0 +1,5 @@
+import type { Annotation } from "@useclickly/core";
+import type { OutputDetail } from "../state/settings";
+export declare function annotationsToMarkdown(annotations: Annotation[], detail?: OutputDetail): string;
+export declare function formatOne(a: Annotation, index: number, detail: OutputDetail): string;
+//# sourceMappingURL=markdown.d.ts.map

package/dist/output/markdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../../src/output/markdown.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEtD,wBAAgB,qBAAqB,CACnC,WAAW,EAAE,UAAU,EAAE,EACzB,MAAM,GAAE,YAAyB,GAChC,MAAM,CAGR;AAED,wBAAgB,SAAS,CAAC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY,GAAG,MAAM,CAkCpF"}

package/dist/output/markdown.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=markdown.test.d.ts.map

package/dist/output/markdown.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"markdown.test.d.ts","sourceRoot":"","sources":["../../src/output/markdown.test.ts"],"names":[],"mappings":""}

package/dist/state/annotations.d.ts

@@ -0,0 +1,21 @@
+import type { Annotation } from "@useclickly/core";
+export interface AnnotationsStore {
+    byId: Record<string, Annotation>;
+    order: string[];
+    add: (a: Annotation) => void;
+    remove: (id: string) => void;
+    update: (id: string, patch: Partial<Annotation>) => void;
+    clear: () => void;
+    /** Imperative read. Hooks should use `useAnnotationsList()` instead. */
+    list: () => Annotation[];
+}
+export declare const useAnnotations: import("zustand").UseBoundStore<import("zustand").StoreApi<AnnotationsStore>>;
+/**
+ * Subscribe to the annotation list with shallow equality — re-renders
+ * only when items add/remove/reorder/update. Always use this from
+ * component code; never call `useAnnotations(s => s.list())`, which
+ * returns a new array reference on every store change and infinite-loops
+ * `useSyncExternalStore`.
+ */
+export declare function useAnnotationsList(): Annotation[];
+//# sourceMappingURL=annotations.d.ts.map

package/dist/state/annotations.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"annotations.d.ts","sourceRoot":"","sources":["../../src/state/annotations.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAInD,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IACjC,KAAK,EAAE,MAAM,EAAE,CAAC;IAEhB,GAAG,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAC7B,MAAM,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7B,MAAM,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;IACzD,KAAK,EAAE,MAAM,IAAI,CAAC;IAElB,wEAAwE;IACxE,IAAI,EAAE,MAAM,UAAU,EAAE,CAAC;CAC1B;AAED,eAAO,MAAM,cAAc,+EA+BxB,CAAC;AAEJ;;;;;;GAMG;AACH,wBAAgB,kBAAkB,IAAI,UAAU,EAAE,CAIjD"}

package/dist/state/annotations.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=annotations.test.d.ts.map

package/dist/state/annotations.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"annotations.test.d.ts","sourceRoot":"","sources":["../../src/state/annotations.test.ts"],"names":[],"mappings":""}

package/dist/state/settings.d.ts

@@ -0,0 +1,14 @@
+export type OutputDetail = "compact" | "standard" | "detailed" | "forensic";
+export interface Settings {
+    outputDetail: OutputDetail;
+    copyOnAdd: boolean;
+    showReactComponents: boolean;
+    markerColor: string;
+}
+export interface SettingsStore extends Settings {
+    set: (patch: Partial<Settings>) => void;
+    reset: () => void;
+}
+export declare const DEFAULTS: Settings;
+export declare const useSettings: import("zustand").UseBoundStore<import("zustand").StoreApi<SettingsStore>>;
+//# sourceMappingURL=settings.d.ts.map

package/dist/state/settings.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"settings.d.ts","sourceRoot":"","sources":["../../src/state/settings.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,GAAG,UAAU,CAAC;AAE5E,MAAM,WAAW,QAAQ;IACvB,YAAY,EAAE,YAAY,CAAC;IAC3B,SAAS,EAAE,OAAO,CAAC;IACnB,mBAAmB,EAAE,OAAO,CAAC;IAC7B,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,aAAc,SAAQ,QAAQ;IAC7C,GAAG,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,QAAQ,CAAC,KAAK,IAAI,CAAC;IACxC,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,eAAO,MAAM,QAAQ,EAAE,QAKtB,CAAC;AAyBF,eAAO,MAAM,WAAW,4EAYrB,CAAC"}

package/dist/state/settings.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=settings.test.d.ts.map

package/dist/state/settings.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"settings.test.d.ts","sourceRoot":"","sources":["../../src/state/settings.test.ts"],"names":[],"mappings":""}

package/dist/state/useEngineState.d.ts

@@ -0,0 +1,7 @@
+import type { EngineState, SelectionEngine } from "@useclickly/core";
+/**
+ * React-friendly accessor for the SelectionEngine's external store.
+ * Engine is already a `Subscribable<EngineState>` — zero adapter code.
+ */
+export declare function useEngineState(engine: SelectionEngine | null): EngineState;
+//# sourceMappingURL=useEngineState.d.ts.map

package/dist/state/useEngineState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEngineState.d.ts","sourceRoot":"","sources":["../../src/state/useEngineState.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAErE;;;GAGG;AACH,wBAAgB,cAAc,CAAC,MAAM,EAAE,eAAe,GAAG,IAAI,GAAG,WAAW,CAM1E"}

package/dist/test/setup.d.ts

@@ -0,0 +1,7 @@
+/**
+ * jsdom test setup. Phase 5 ships only state/store unit tests — DOM
+ * component tests arrive in Phase 12 via Playwright. The setup is kept
+ * so future component tests have a single place to extend matchers.
+ */
+export {};
+//# sourceMappingURL=setup.d.ts.map

package/dist/test/setup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"setup.d.ts","sourceRoot":"","sources":["../../src/test/setup.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,OAAO,EAAE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useclickly/react",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Click-to-annotate dev toolbar for React 18+ apps. Generates agent-ready prompts. Drop in one component — no config.",
   "license": "MIT",
   "author": "Clickly contributors",
@@ -43,11 +43,19 @@
     },
     "./package.json": "./package.json"
   },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "test": "vitest run",
+    "test:e2e": "playwright test",
+    "typecheck": "tsc --noEmit",
+    "clean": "rimraf dist .turbo"
+  },
   "dependencies": {
+    "@useclickly/core": "workspace:*",
     "idb-keyval": "^6.2.1",
     "nanoid": "^5.0.7",
-    "zustand": "^5.0.0",
-    "@useclickly/core": "1.0.0"
+    "zustand": "^5.0.0"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
@@ -72,13 +80,5 @@
   },
   "publishConfig": {
     "access": "public"
-  },
-  "scripts": {
-    "build": "tsup",
-    "dev": "tsup --watch",
-    "test": "vitest run",
-    "test:e2e": "playwright test",
-    "typecheck": "tsc --noEmit",
-    "clean": "rimraf dist .turbo"
   }
-}
+}

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2026 Clickly contributors
-
-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.