@llumi/design-system 0.1.0 → 1.0.1

package/dist/types/components/review/comment-dialog.element.d.ts

@@ -1,7 +1,15 @@
+import { ReferenceElement } from '@floating-ui/dom';
 import { PropertyValues } from 'lit';
 import { TailwindElement } from '../../shared/tailwind-element';
 export declare class LlumiCommentDialog extends TailwindElement {
     targetElement: HTMLElement | null;
+    /**
+     * Optional positioning reference that overrides `targetElement` — used for
+     * text-selection comments, where the dialog must anchor to the selected
+     * range's rect rather than the whole (potentially tall) selectable element.
+     * A floating-ui virtual element (`{ getBoundingClientRect() }`) is accepted.
+     */
+    anchor: ReferenceElement | null;
     value: string;
     private floating;
     private cleanup?;

package/dist/types/components/review/review.element.d.ts

@@ -2,16 +2,19 @@ import { CustomTarget } from './custom-target.utils';
 import { ReviewResult } from './review.type';
 /**
  * `<llumi-review>` — wraps light-DOM content for element- and text-selection
- * review comments. Both events carry a `ReviewResult` detail and are composed.
+ * review comments. Both events bubble and are composed.
  *
- * @fires llumi-review-change - On every edit (comment added/edited/deleted, or overall comment changed).
- * @fires llumi-review-submit - When the user clicks Submit / Approve.
+ * @attr {string} persist - When set to a non-empty value, persists the review draft to
+ *   localStorage under that key and restores it on load. Read once on connect.
+ * @fires llumi-review-change - On every edit (comment added/edited/deleted, or overall comment changed). `detail` is a `ReviewResult`.
+ * @fires llumi-review-submit - When the user clicks Submit / Approve. `detail` is `{ result: ReviewResult, clearPersisted: () => void }`; call `clearPersisted()` after a confirmed server save to discard the persisted draft.
  */
 export declare class LlumiReview extends HTMLElement {
     static observedAttributes: string[];
     initialData?: ReviewResult;
     customTargets?: CustomTarget[];
     private actor;
+    private persistence;
     private manager;
     private rangeMap;
     private hoveredComment;
@@ -19,15 +22,22 @@ export declare class LlumiReview extends HTMLElement {
     private selectionComments;
     private bar;
     private commentDialog;
+    private commentDialogAnchorId;
     private overallDialog;
     private icons;
     private get shortcut();
     private get barPosition();
     private get defaultMode();
+    private get persistKey();
     connectedCallback(): void;
     disconnectedCallback(): void;
     attributeChangedCallback(): void;
-    private emitResult;
+    private buildDetailResult;
+    private emitChange;
+    private emitSubmit;
+    /** Clears the persisted draft for this element. No-op when persistence is off. */
+    clearPersisted(): void;
+    private selectionAnchor;
     private mountChrome;
     private onIconClick;
     private syncFromSnapshot;

package/dist/types/components/review/review.machine.d.ts

@@ -1,3 +1,4 @@
+import { ReviewPersistence } from './review.persistence';
 import { ReviewComment, ReviewResult, SelectionRange } from './review.type';
 export interface HighlightCallbacks {
     activate: (commentedIds: Set<string>) => void;
@@ -16,6 +17,7 @@ type ReviewMachineContext = {
     shortcut: string;
     defaultMode: "idle" | "annotating";
     highlights: HighlightCallbacks;
+    persistence: ReviewPersistence;
 };
 type ReviewMachineEvents = {
     type: "TOGGLE";
@@ -61,6 +63,7 @@ type ReviewMachineInput = {
     initialData?: ReviewResult;
     defaultMode: "idle" | "annotating";
     highlights: HighlightCallbacks;
+    persistence: ReviewPersistence;
 };
 export declare function buildReviewResult(context: Pick<ReviewMachineContext, "comments" | "overallComment">): ReviewResult;
 export declare function createReviewMachine(): import('xstate').StateMachine<ReviewMachineContext, {
@@ -136,6 +139,9 @@ export declare function createReviewMachine(): import('xstate').StateMachine<Rev
 } | {
     type: "emitChanged";
     params: import('xstate').NonReducibleUnknown;
+} | {
+    type: "persistSave";
+    params: unknown;
 } | {
     type: "emitSubmitted";
     params: import('xstate').NonReducibleUnknown;

package/dist/types/components/review/review.persistence.d.ts

@@ -0,0 +1,16 @@
+import { ReviewResult } from './review.type';
+/**
+ * Storage engine for `<llumi-review>` drafts. Injected into the review machine
+ * via input (mirrors `HighlightCallbacks`). All access is best-effort: it never
+ * throws into the component.
+ */
+export interface ReviewPersistence {
+    /** Read + parse + validate. Returns undefined on miss or corruption. */
+    load(): ReviewResult | undefined;
+    /** Write JSON. An empty/`approved` result removes the key instead. */
+    save(result: ReviewResult): void;
+    /** Remove the stored draft. */
+    clear(): void;
+}
+export declare const noopPersistence: ReviewPersistence;
+export declare function createReviewPersistence(key: string): ReviewPersistence;

package/dist/types/components/review/review.type.d.ts

@@ -18,6 +18,11 @@ export type ReviewResult = {
     comments: ReviewComment[];
     overallComment?: string;
 };
+export interface ReviewSubmitDetail {
+    result: ReviewResult;
+    /** Clears the persisted draft for this element. No-op when persistence is off. */
+    clearPersisted: () => void;
+}
 export type ReviewBarPosition = "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
 export type ReviewMode = "idle" | "commenting" | "editing";
 /**

package/package.json

@@ -1,52 +1,51 @@
 {
-	"name": "@llumi/design-system",
-	"version": "0.1.0",
-	"type": "module",
-	"files": [
-		"dist",
-		"custom-elements.json"
-	],
-	"sideEffects": [
-		"**/*.css",
-		"**/*.js",
-		"**/*.mjs",
-		"**/*.cjs"
-	],
-	"exports": {
-		"./review": {
-			"types": "./dist/types/components/review/index.d.ts",
-			"import": "./dist/review.mjs",
-			"require": "./dist/review.cjs",
-			"default": "./dist/review.mjs"
-		},
-		"./review.mjs": "./dist/review.mjs",
-		"./review.cjs": "./dist/review.cjs",
-		"./review.js": "./dist/review.js",
-		"./review.css": "./dist/review.css",
-		"./package.json": "./package.json"
-	},
-	"scripts": {
-		"build": "vite build -c vite.lib.config.ts && vite build -c vite.umd.config.ts && cp src/components/review/review.css dist/review.css",
-		"analyze": "cem analyze --config custom-elements-manifest.config.mjs",
-		"test:browser": "vitest run",
-		"prepack": "bun run build && bun run analyze"
-	},
-	"dependencies": {
-		"@floating-ui/dom": "^1.6.13",
-		"clsx": "^2.1.1",
-		"lit": "^3.2.1",
-		"tailwind-merge": "^3.0.2",
-		"tinykeys": "^3.0.0",
-		"xstate": "^5.28.0"
-	},
-	"devDependencies": {
-		"@tailwindcss/vite": "^4.1.18",
-		"@vitest/browser": "^3.0.0",
-		"playwright": "^1.50.0",
-		"tailwindcss": "^4.1.18",
-		"vite": "^6.0.0",
-		"vite-plugin-dts": "^4.5.0",
-		"vitest": "^3.0.0"
-	},
-	"customElements": "custom-elements.json"
-}
+  "name": "@llumi/design-system",
+  "version": "1.0.1",
+  "type": "module",
+  "files": [
+    "dist",
+    "custom-elements.json"
+  ],
+  "sideEffects": [
+    "**/*.css",
+    "**/*.js",
+    "**/*.mjs",
+    "**/*.cjs"
+  ],
+  "exports": {
+    "./review": {
+      "types": "./dist/types/components/review/index.d.ts",
+      "import": "./dist/review.mjs",
+      "require": "./dist/review.cjs",
+      "default": "./dist/review.mjs"
+    },
+    "./review.mjs": "./dist/review.mjs",
+    "./review.cjs": "./dist/review.cjs",
+    "./review.js": "./dist/review.js",
+    "./review.css": "./dist/review.css",
+    "./package.json": "./package.json"
+  },
+  "dependencies": {
+    "@floating-ui/dom": "^1.6.13",
+    "clsx": "^2.1.1",
+    "lit": "^3.2.1",
+    "tailwind-merge": "^3.0.2",
+    "tinykeys": "^3.0.0",
+    "xstate": "^5.28.0"
+  },
+  "devDependencies": {
+    "@tailwindcss/vite": "^4.1.18",
+    "@vitest/browser": "^3.0.0",
+    "playwright": "^1.50.0",
+    "tailwindcss": "^4.1.18",
+    "vite": "^6.0.0",
+    "vite-plugin-dts": "^4.5.0",
+    "vitest": "^3.0.0"
+  },
+  "customElements": "custom-elements.json",
+  "scripts": {
+    "build": "vite build -c vite.lib.config.ts && vite build -c vite.umd.config.ts && cp src/components/review/review.css dist/review.css",
+    "analyze": "cem analyze --config custom-elements-manifest.config.mjs",
+    "test:browser": "vitest run"
+  }
+}