@jini-ai/ui 0.1.2 → 0.3.1

package/dist/features/html-editor/css.js

@@ -0,0 +1,140 @@
+/**
+ * `editor.getCss()` always returns single-line, semicolon-packed CSS — confirmed directly in
+ * GrapesJS's own bundled source (`CssRule.prototype.toCSS`/`getDeclaration`): there is no
+ * formatting/indent option anywhere in that path, minification is unconditional. Left as-is, a host
+ * reopening an HTML-source view after an Interactive-tab edit would find hand-authored, readable CSS
+ * replaced by one dense blob. A real CSS parser (e.g. `postcss` + a printer, or a browser-bundle
+ * build of `prettier`) is unwarranted weight for a formatting-only pass over CSS this function's own
+ * caller already generated — the input is always GrapesJS's own regular, predictable serialization,
+ * never arbitrary untrusted CSS, so a small tokenizer is sufficient and safe here specifically (it
+ * would not be a safe substitute for a real parser on attacker-controlled input).
+ *
+ * Tracks brace depth (indentation), quote state (so `;`/`{`/`}` inside a string literal, e.g.
+ * `content: "a;b"`, are never mistaken for structure), and paren depth (so the same characters
+ * inside a function value are left alone too — the concrete case that broke without this: a
+ * `url(data:image/svg+xml;base64,...)` value's own semicolon, which naive brace/semicolon splitting
+ * mistakes for a declaration terminator and corrupts the value).
+ *
+ * @complexity O(n) single pass over the CSS string, O(1) additional space beyond the output buffer.
+ * @overallScore 100
+ */
+export function prettifyCss(css) {
+    const INDENT = '  ';
+    let out = '';
+    let depth = 0;
+    let parenDepth = 0;
+    let quote = null;
+    let atDeclStart = false;
+    let i = 0;
+    const n = css.length;
+    const trimTrailingSpace = () => {
+        out = out.replace(/[ \t]+$/, '');
+    };
+    const peekNextNonSpace = (from) => {
+        let j = from;
+        while (j < n && /\s/.test(css[j]))
+            j++;
+        return css[j];
+    };
+    while (i < n) {
+        const ch = css[i];
+        if (quote) {
+            out += ch;
+            if (ch === '\\' && i + 1 < n) {
+                out += css[i + 1];
+                i += 2;
+                continue;
+            }
+            if (ch === quote)
+                quote = null;
+            i++;
+            continue;
+        }
+        if (ch === '"' || ch === "'") {
+            quote = ch;
+            out += ch;
+            i++;
+            continue;
+        }
+        if (ch === '(') {
+            parenDepth++;
+            out += ch;
+            i++;
+            continue;
+        }
+        if (ch === ')') {
+            parenDepth = Math.max(0, parenDepth - 1);
+            out += ch;
+            i++;
+            continue;
+        }
+        if (parenDepth === 0 && ch === '{') {
+            trimTrailingSpace();
+            out += ' {';
+            depth++;
+            atDeclStart = true;
+            i++;
+            while (i < n && /\s/.test(css[i]))
+                i++;
+            if (peekNextNonSpace(i) !== '}')
+                out += '\n' + INDENT.repeat(depth);
+            continue;
+        }
+        if (parenDepth === 0 && ch === '}') {
+            depth = Math.max(0, depth - 1);
+            trimTrailingSpace();
+            // A `}` immediately after `{` (an empty rule) needs no newline before it; otherwise close on
+            // its own indented line.
+            if (!out.endsWith('{'))
+                out += '\n' + INDENT.repeat(depth);
+            out += '}';
+            atDeclStart = false;
+            i++;
+            while (i < n && /\s/.test(css[i]))
+                i++;
+            const nextCh = css[i];
+            // A following `}` (closing a parent at-rule) manages its own leading newline via the same
+            // trimTrailingSpace() above — adding one here too would double up into a stray blank line.
+            if (nextCh !== undefined && nextCh !== '}') {
+                out += depth === 0 ? '\n\n' : '\n' + INDENT.repeat(depth);
+            }
+            continue;
+        }
+        if (parenDepth === 0 && ch === ';') {
+            out += ';';
+            i++;
+            const nextCh = peekNextNonSpace(i);
+            while (i < n && /\s/.test(css[i]))
+                i++;
+            if (nextCh !== '}' && nextCh !== undefined) {
+                out += '\n' + INDENT.repeat(depth);
+                atDeclStart = true;
+            }
+            continue;
+        }
+        // Only the FIRST colon of a declaration (the property/value separator) gets a space after it —
+        // a selector's own colon (`.gm-btn:hover`, matched at `depth === 0`, before any `{`) is left
+        // untouched, and only `atDeclStart` (cleared the moment this fires) keeps a later colon inside
+        // the same value (there are none in practice here, but the guard costs nothing) from being
+        // treated as another property separator.
+        if (parenDepth === 0 && ch === ':' && depth > 0 && atDeclStart) {
+            out += ': ';
+            atDeclStart = false;
+            i++;
+            while (i < n && css[i] === ' ')
+                i++;
+            continue;
+        }
+        if (/\s/.test(ch)) {
+            out += ' ';
+            i++;
+            while (i < n && /\s/.test(css[i]))
+                i++;
+            continue;
+        }
+        out += ch;
+        i++;
+    }
+    return out.trim();
+}
+//# sourceMappingURL=css.js.map

package/dist/features/html-editor/css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"css.js","sourceRoot":"","sources":["../../../src/features/html-editor/css.ts"],"names":[],"mappings":"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"}

package/dist/features/html-editor/dom.d.ts

@@ -0,0 +1,15 @@
+/**
+ * `isComponent` (passed to `editor.Components.addType` — see `react/hooks/useInteractiveHtmlEditor.ts`)
+ * is not always called with a real DOM `Element`. GrapesJS also invokes it during headless/internal
+ * re-parses — confirmed live: `ComponentTextView.syncContent`'s re-parse of RTE-edited content
+ * (`Components.parseString` -> `ParserHtml.detectNode`) passes a lightweight parsed-node object
+ * instead, whose `attributes` is a plain object rather than a DOM `NamedNodeMap`, with no
+ * `.hasAttribute` method at all. Calling `.hasAttribute` unconditionally throws a `TypeError` inside
+ * GrapesJS's own parser on every RTE-driven edit, which silently aborts that re-parse before it ever
+ * reaches the component model. `el.attributes` is present on both shapes (a real `NamedNodeMap` or
+ * GrapesJS's plain object), so checking it directly is the one path guaranteed to work regardless of
+ * which parse mode called this. An `isProtectedElement` predicate passed to `InteractiveHtmlEditor`
+ * that checks attributes should use this instead of `el.hasAttribute` directly.
+ */
+export declare function hasAttributeOnAnyNodeShape(el: Element, attr: string): boolean;
+//# sourceMappingURL=dom.d.ts.map

package/dist/features/html-editor/dom.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dom.d.ts","sourceRoot":"","sources":["../../../src/features/html-editor/dom.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,wBAAgB,0BAA0B,CAAC,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CAI7E"}

package/dist/features/html-editor/dom.js

@@ -0,0 +1,20 @@
+/**
+ * `isComponent` (passed to `editor.Components.addType` — see `react/hooks/useInteractiveHtmlEditor.ts`)
+ * is not always called with a real DOM `Element`. GrapesJS also invokes it during headless/internal
+ * re-parses — confirmed live: `ComponentTextView.syncContent`'s re-parse of RTE-edited content
+ * (`Components.parseString` -> `ParserHtml.detectNode`) passes a lightweight parsed-node object
+ * instead, whose `attributes` is a plain object rather than a DOM `NamedNodeMap`, with no
+ * `.hasAttribute` method at all. Calling `.hasAttribute` unconditionally throws a `TypeError` inside
+ * GrapesJS's own parser on every RTE-driven edit, which silently aborts that re-parse before it ever
+ * reaches the component model. `el.attributes` is present on both shapes (a real `NamedNodeMap` or
+ * GrapesJS's plain object), so checking it directly is the one path guaranteed to work regardless of
+ * which parse mode called this. An `isProtectedElement` predicate passed to `InteractiveHtmlEditor`
+ * that checks attributes should use this instead of `el.hasAttribute` directly.
+ */
+export function hasAttributeOnAnyNodeShape(el, attr) {
+    if (typeof el.hasAttribute === 'function')
+        return el.hasAttribute(attr);
+    const attributes = el.attributes;
+    return !!attributes && Object.prototype.hasOwnProperty.call(attributes, attr);
+}
+//# sourceMappingURL=dom.js.map

package/dist/features/html-editor/dom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dom.js","sourceRoot":"","sources":["../../../src/features/html-editor/dom.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,0BAA0B,CAAC,EAAW,EAAE,IAAY;IAClE,IAAI,OAAO,EAAE,CAAC,YAAY,KAAK,UAAU;QAAE,OAAO,EAAE,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;IACxE,MAAM,UAAU,GAAI,EAA0D,CAAC,UAAU,CAAC;IAC1F,OAAO,CAAC,CAAC,UAAU,IAAI,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;AAChF,CAAC"}

package/dist/features/html-editor/index.d.ts

@@ -0,0 +1,8 @@
+export { InteractiveHtmlEditor } from './react/components/InteractiveHtmlEditor.js';
+export type { InteractiveHtmlEditorProps } from './react/components/InteractiveHtmlEditor.js';
+export { useInteractiveHtmlEditor } from './react/hooks/useInteractiveHtmlEditor.js';
+export type { CanvasContentWrapperNode, CanvasStyling } from './canvas-style.js';
+export type { CanvasEmbedPlaceholderDescriptor } from './canvas-embed-placeholders.js';
+export { hasAttributeOnAnyNodeShape } from './dom.js';
+export { prettifyCss } from './css.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/features/html-editor/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/features/html-editor/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,6CAA6C,CAAC;AACpF,YAAY,EAAE,0BAA0B,EAAE,MAAM,6CAA6C,CAAC;AAE9F,OAAO,EAAE,wBAAwB,EAAE,MAAM,2CAA2C,CAAC;AAErF,YAAY,EAAE,wBAAwB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACjF,YAAY,EAAE,gCAAgC,EAAE,MAAM,gCAAgC,CAAC;AAEvF,OAAO,EAAE,0BAA0B,EAAE,MAAM,UAAU,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC"}

package/dist/features/html-editor/index.js

@@ -0,0 +1,5 @@
+export { InteractiveHtmlEditor } from './react/components/InteractiveHtmlEditor.js';
+export { useInteractiveHtmlEditor } from './react/hooks/useInteractiveHtmlEditor.js';
+export { hasAttributeOnAnyNodeShape } from './dom.js';
+export { prettifyCss } from './css.js';
+//# sourceMappingURL=index.js.map

package/dist/features/html-editor/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/features/html-editor/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,6CAA6C,CAAC;AAGpF,OAAO,EAAE,wBAAwB,EAAE,MAAM,2CAA2C,CAAC;AAKrF,OAAO,EAAE,0BAA0B,EAAE,MAAM,UAAU,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC"}

package/dist/features/html-editor/react/components/InteractiveHtmlEditor.d.ts

@@ -0,0 +1,94 @@
+import 'grapesjs/dist/css/grapes.min.css';
+import type { CanvasEmbedPlaceholderDescriptor } from '../../canvas-embed-placeholders.js';
+import type { CanvasStyling } from '../../canvas-style.js';
+/**
+ * @file A visual, click-into-text editing surface for a bespoke HTML document, built on GrapesJS
+ * (MIT). Renders `html` like a live preview but lets the operator click into rendered text and edit
+ * it in place, with a small Rich Text Editor toolbar (bold/italic/link) — not a structured-document
+ * editor: `html` in, edited `html` out via `onChange`, the same contract as an HTML source
+ * `<textarea>`. See `react/hooks/useInteractiveHtmlEditor.ts` for why this is uncontrolled
+ * (mount-once) rather than reacting to `html`/`isProtectedElement` prop changes after construction.
+ *
+ * **Scope, this pass: text editing + basic formatting only.** GrapesJS also does drag/drop block
+ * manipulation, a Style Manager, and a Layers panel; none of that chrome is enabled here (`panels:
+ * { defaults: [] }`, `blockManager: { blocks: [] }` in the hook) — Gutenberg-style block
+ * move/duplicate/lock/group is explicitly deferred, not merely unbuilt.
+ *
+ * **`GJS_STYLE_VARS` below is a consequence of that same choice, not a separate styling decision.**
+ * GrapesJS's own vendor CSS unconditionally reserves layout space for the default chrome this
+ * component turns off — `.gjs-cv-canvas`'s width is `calc(100% - var(--gjs-left-width))` (default
+ * `15%`, for a left Layers/Blocks column that never renders here) and its top offset is
+ * `var(--gjs-canvas-top)` (default `40px`, for a top panel bar that also never renders) — confirmed
+ * live by measuring the rendered canvas: it sat 197px narrower than its own wrapper at a 1300px
+ * wrapper width, exactly `15%`. Left un-overridden, every host gets a dead gray gap on the canvas's
+ * right and top edges. Zeroing both variables, scoped to this component's own wrapper via inline
+ * style (cascades to the GrapesJS-owned descendants below it), is this component's responsibility to
+ * get right once — not something every host integrating it should have to rediscover and patch in
+ * its own stylesheet.
+ *
+ * **This component has zero knowledge of any host's embed/placeholder conventions.** `isProtectedElement`
+ * is an optional predicate the caller supplies to lock specific elements (identified however the
+ * caller likes) out of every GrapesJS interaction that could edit, move, or remove them — not
+ * editable, draggable, droppable, removable, or selectable. When omitted, no elements are protected.
+ * `describeEmbedPlaceholder` is the same idea for a second, independent concern: recognizing an
+ * unresolved embed marker and labeling it for `../../canvas-embed-placeholders.ts`'s explicit
+ * placeholder card. See `@jini-ai/admin/react`'s `InteractiveHtmlEditor` for a worked example of both:
+ * it composes this primitive with a predicate recognizing Tovu's legacy `data-embed-type` convention
+ * for the first, and a describer recognizing the current `data-embed-config` convention for the
+ * second.
+ *
+ * ## Styling contract
+ *
+ * This component imports GrapesJS's own vendor stylesheet (`grapesjs/dist/css/grapes.min.css`),
+ * because GrapesJS's canvas/RTE chrome does not render usably without it. This is not authored
+ * product styling a host would want to override — it is a third-party editor's own required CSS, the
+ * same category of dependency as shipping a `<video>` element would carry the browser's native
+ * controls chrome. The host's own `.interactive-html-editor` wrapper class is still available for
+ * layout (sizing, borders) it wants to apply.
+ *
+ * Styling the EDITED DOCUMENT is a separate concern, and the host's: `canvasStyling` supplies the
+ * stylesheets and raw CSS the canvas document itself renders against, so `html` is edited looking
+ * the way it will publish instead of against browser defaults. Neither half reaches `onChange` —
+ * GrapesJS keeps `canvas.styles`/`canvas.frameStyle` out of its exported code, and
+ * `useInteractiveHtmlEditor`'s `serializeEditorContent` builds its output from the component tree
+ * and the `CssComposer`, neither of which these touch. Omit it to edit against browser defaults on
+ * GrapesJS's white canvas, which is what every caller got before the option existed. See
+ * `../../canvas-style.ts` for why supplying it also has to displace GrapesJS's own default canvas
+ * background.
+ *
+ * `canvasStyling.contentWrapper` adds a third half to that same contract: the real DOM ancestor chain
+ * (e.g. `<main><article class="post-detail wrap">`) the host's own page template wraps `html` in, so
+ * the canvas centers/pads content the same way the published page does instead of full-bleed. Also
+ * never reaches `onChange` — see `../../canvas-content-wrapper.ts`'s file header for why that is
+ * guaranteed by WHEN it is applied (against the live canvas, after GrapesJS has already parsed
+ * `html`), not by a strip-on-export step.
+ */
+export interface InteractiveHtmlEditorProps {
+    /** The document to load into the editor. Read once, at mount — see this file's header and
+     *  `react/hooks/useInteractiveHtmlEditor.ts` for why. */
+    html: string;
+    /** Fires with the editor's current serialized HTML on every content edit. Does not persist
+     *  anything itself — the caller decides when/whether to save, same as an HTML source textarea's
+     *  `onChange`. */
+    onChange: (html: string) => void;
+    className?: string;
+    /** Identifies elements that must never become editable, draggable, removable, or droppable inside
+     *  the editor. Read once, at mount, same as `html`. Predicates that check attributes should use
+     *  `hasAttributeOnAnyNodeShape` (exported alongside this component) rather than `el.hasAttribute`
+     *  directly — see that helper's own doc for why. Omit to protect nothing. */
+    isProtectedElement?: (el: Element) => boolean;
+    /** CSS to render the edited document against inside the editing canvas, so the operator sees
+     *  roughly what the document publishes as rather than browser defaults. Read once, at mount, same
+     *  as `html`. Never part of `onChange`'s output — see this file's "Styling contract" section. */
+    canvasStyling?: CanvasStyling;
+    /** Identifies elements that are unresolved embed markers, so the canvas can decorate each one with
+     *  an explicit placeholder card instead of leaving it an empty, unlabeled element (or whatever
+     *  fallback content it authored) — see `../../canvas-embed-placeholders.ts`'s own file header for
+     *  the export-safety argument. Read once, at mount, same as `isProtectedElement`. Returning
+     *  `undefined` for an element means "not a marker this host owns" — left completely untouched.
+     *  Omit to decorate nothing, the pre-existing behavior. This component has the same zero knowledge
+     *  of any host's marker convention that `isProtectedElement` documents above. */
+    describeEmbedPlaceholder?: (el: Element) => CanvasEmbedPlaceholderDescriptor | undefined;
+}
+export declare function InteractiveHtmlEditor({ html, onChange, className, isProtectedElement, canvasStyling, describeEmbedPlaceholder, }: InteractiveHtmlEditorProps): import("react").JSX.Element;
+//# sourceMappingURL=InteractiveHtmlEditor.d.ts.map

package/dist/features/html-editor/react/components/InteractiveHtmlEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InteractiveHtmlEditor.d.ts","sourceRoot":"","sources":["../../../../../src/features/html-editor/react/components/InteractiveHtmlEditor.tsx"],"names":[],"mappings":"AACA,OAAO,kCAAkC,CAAC;AAC1C,OAAO,KAAK,EAAE,gCAAgC,EAAE,MAAM,oCAAoC,CAAC;AAC3F,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAG3D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6DG;AACH,MAAM,WAAW,0BAA0B;IACzC;6DACyD;IACzD,IAAI,EAAE,MAAM,CAAC;IACb;;sBAEkB;IAClB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;iFAG6E;IAC7E,kBAAkB,CAAC,EAAE,CAAC,EAAE,EAAE,OAAO,KAAK,OAAO,CAAC;IAC9C;;qGAEiG;IACjG,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B;;;;;;qFAMiF;IACjF,wBAAwB,CAAC,EAAE,CAAC,EAAE,EAAE,OAAO,KAAK,gCAAgC,GAAG,SAAS,CAAC;CAC1F;AASD,wBAAgB,qBAAqB,CAAC,EACpC,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,kBAAkB,EAClB,aAAa,EACb,wBAAwB,GACzB,EAAE,0BAA0B,+BAU5B"}

package/dist/features/html-editor/react/components/InteractiveHtmlEditor.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import 'grapesjs/dist/css/grapes.min.css';
+import { useInteractiveHtmlEditor } from '../hooks/useInteractiveHtmlEditor.js';
+/** See this file's header for why these exist: they zero out layout space GrapesJS's default CSS
+ *  reserves for chrome this component never renders (`panels: { defaults: [] }`). */
+const GJS_STYLE_VARS = {
+    '--gjs-left-width': '0px',
+    '--gjs-canvas-top': '0px',
+};
+export function InteractiveHtmlEditor({ html, onChange, className, isProtectedElement, canvasStyling, describeEmbedPlaceholder, }) {
+    const { containerRef } = useInteractiveHtmlEditor(html, onChange, isProtectedElement, canvasStyling, describeEmbedPlaceholder);
+    const wrapperClassName = className ? `interactive-html-editor ${className}` : 'interactive-html-editor';
+    return _jsx("div", { ref: containerRef, className: wrapperClassName, style: GJS_STYLE_VARS });
+}
+//# sourceMappingURL=InteractiveHtmlEditor.js.map

package/dist/features/html-editor/react/components/InteractiveHtmlEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InteractiveHtmlEditor.js","sourceRoot":"","sources":["../../../../../src/features/html-editor/react/components/InteractiveHtmlEditor.tsx"],"names":[],"mappings":";AACA,OAAO,kCAAkC,CAAC;AAG1C,OAAO,EAAE,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AA4FhF;qFACqF;AACrF,MAAM,cAAc,GAAG;IACrB,kBAAkB,EAAE,KAAK;IACzB,kBAAkB,EAAE,KAAK;CACT,CAAC;AAEnB,MAAM,UAAU,qBAAqB,CAAC,EACpC,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,kBAAkB,EAClB,aAAa,EACb,wBAAwB,GACG;IAC3B,MAAM,EAAE,YAAY,EAAE,GAAG,wBAAwB,CAC/C,IAAI,EACJ,QAAQ,EACR,kBAAkB,EAClB,aAAa,EACb,wBAAwB,CACzB,CAAC;IACF,MAAM,gBAAgB,GAAG,SAAS,CAAC,CAAC,CAAC,2BAA2B,SAAS,EAAE,CAAC,CAAC,CAAC,yBAAyB,CAAC;IACxG,OAAO,cAAK,GAAG,EAAE,YAAY,EAAE,SAAS,EAAE,gBAAgB,EAAE,KAAK,EAAE,cAAc,GAAI,CAAC;AACxF,CAAC"}

package/dist/features/html-editor/react/hooks/useInteractiveHtmlEditor.d.ts

@@ -0,0 +1,33 @@
+import { type CanvasEmbedPlaceholderDescriptor } from '../../canvas-embed-placeholders.js';
+import { type CanvasStyling } from '../../canvas-style.js';
+/**
+ * Owns one GrapesJS `Editor` instance for the lifetime of the calling component's mount. `onChange`
+ * fires with the editor's current serialized content (see `serializeEditorContent`) on every content
+ * mutation (GrapesJS's `update` event — components, styles, or attributes changing); it is not
+ * debounced, so a caller replacing an existing uncontrolled `<textarea>` (which already pushes a full
+ * value on every keystroke) sees matching behavior.
+ *
+ * **Mounts into a dedicated child node, not the wrapper div `containerRef` itself, and removes that
+ * child node (not just its content) on cleanup.** Defensive, for React StrictMode's dev-time
+ * double-invoke (mount -> cleanup -> mount again, synchronously): if a destroyed instance's canvas
+ * were still mid-render when cleanup ran, clearing the container's *current* content at that moment
+ * cannot remove DOM that does not exist yet, and a later async write from the discarded instance
+ * would land after the fact. Detaching the whole per-instance node sidesteps that class of ordering
+ * problem entirely — whatever a destroyed instance's async work later does, it mutates a node no
+ * longer connected to `document`, so it can never become visible or queryable in the live page no
+ * matter when it runs. (Investigated live via Playwright while chasing an unrelated symptom — two
+ * canvas iframes coexisting after one mount — which turned out to be a separate, harmless GrapesJS
+ * quirk unrelated to StrictMode: `Canvas`'s `FramesView` always constructs one `FrameView` that never
+ * proceeds past construction to `render()`, alongside the real one; it keeps Backbone's default
+ * `class="frame"` forever, inert and unrendered. `.gjs-frame` — the class `FrameView.render()`
+ * assigns — is what callers should select on, never a bare `iframe` under the wrapper.)
+ *
+ * @complexity O(1) setup/teardown. Steady-state cost is GrapesJS's own serialization per edit,
+ * proportional to document size — not something this hook controls or should hide a note about
+ * beyond that.
+ * @overallScore 100
+ */
+export declare function useInteractiveHtmlEditor(html: string, onChange: (html: string) => void, isProtectedElement?: (el: Element) => boolean, canvasStyling?: CanvasStyling, describeEmbedPlaceholder?: (el: Element) => CanvasEmbedPlaceholderDescriptor | undefined): {
+    containerRef: import("react").RefObject<HTMLDivElement | null>;
+};
+//# sourceMappingURL=useInteractiveHtmlEditor.d.ts.map

package/dist/features/html-editor/react/hooks/useInteractiveHtmlEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInteractiveHtmlEditor.d.ts","sourceRoot":"","sources":["../../../../../src/features/html-editor/react/hooks/useInteractiveHtmlEditor.ts"],"names":[],"mappings":"AAGA,OAAO,EAAgC,KAAK,gCAAgC,EAAE,MAAM,oCAAoC,CAAC;AACzH,OAAO,EAA0B,KAAK,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAgHnF;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,wBAAwB,CACtC,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,EAChC,kBAAkB,CAAC,EAAE,CAAC,EAAE,EAAE,OAAO,KAAK,OAAO,EAC7C,aAAa,GAAE,aAAkB,EACjC,wBAAwB,CAAC,EAAE,CAAC,EAAE,EAAE,OAAO,KAAK,gCAAgC,GAAG,SAAS;;EAsCzF"}

package/dist/features/html-editor/react/hooks/useInteractiveHtmlEditor.js

@@ -0,0 +1,170 @@
+import { useEffect, useRef } from 'react';
+import grapesjs, {} from 'grapesjs';
+import { applyCanvasContentWrapper } from '../../canvas-content-wrapper.js';
+import { applyCanvasEmbedPlaceholders } from '../../canvas-embed-placeholders.js';
+import { buildCanvasStyleConfig } from '../../canvas-style.js';
+import { prettifyCss } from '../../css.js';
+/**
+ * @file `InteractiveHtmlEditor`'s GrapesJS lifecycle: construct the editor once per mount against
+ * the container ref, wire content-change notifications out, and tear the editor down on unmount.
+ * Split from the component the same reason `ConfirmDialog.hooks.tsx` is split from `ConfirmDialog.tsx`
+ * in `@jini-ai/admin` — the imperative, non-React lifecycle (`grapesjs.init`/`editor.destroy`) stays
+ * out of the render path, and a test can drive it independently of the markup.
+ *
+ * **Uncontrolled by design.** `html` (and `isProtectedElement`, and `canvasStyling`) are read once,
+ * at construction — this hook does not react to later changes in any of them. GrapesJS owns an internal component tree
+ * once initialized; feeding an external string back into a live editor on every parent re-render
+ * (which is what a naive `useEffect([html])` would do, since this same hook's own `onChange` callback
+ * pushes edits back up into whatever state produced the `html` prop) would either fight the operator's
+ * cursor or require diffing GrapesJS's tree against a string to detect "did this change come from us",
+ * which is real complexity this component's text-editing-only scope does not need. A host that needs a
+ * fresh document only mounts this component while it's active and remounts with fresh `html` — see
+ * `@jini-ai/admin/react`'s `InteractiveHtmlEditor` adapter and its caller in Tovu's `PageEditor.tsx`.
+ *
+ * **This module has zero knowledge of what "protected" means.** It only knows how to register a
+ * locked GrapesJS component type for whatever `isProtectedElement` predicate its caller supplies —
+ * see this file's `registerProtectedElementType`. The predicate itself (e.g. recognizing a host's own
+ * embed-placeholder convention) belongs to the caller, not this primitive.
+ *
+ * **`canvasStyling.contentWrapper` is applied on `load`, against the live canvas — never folded into
+ * `components` above.** See `../../canvas-content-wrapper.ts`'s own file header for why: GrapesJS's
+ * exported HTML/CSS are built from its component model, which `components` seeds and this wrapper
+ * never touches, so it cannot leak into a save no matter how the canvas is edited afterward.
+ */
+const PROTECTED_ELEMENT_TYPE = 'protected-element';
+/** Bold/italic/link only. GrapesJS's other built-in RTE actions (underline, strikethrough, wrap) are
+ *  omitted, not merely unconfigured, by naming exactly these three rather than leaving the default
+ *  action list in place. */
+const RTE_ACTIONS = ['bold', 'italic', 'link'];
+/**
+ * Registers the `protected-element` component type so any parsed element `isProtectedElement`
+ * recognizes is locked out of every GrapesJS interaction that could mutate or move it: not editable
+ * (excluded from RTE content-editing, including as a nested island inside a `text` component), not
+ * draggable/droppable/removable, and hidden from the layers/style/settings panels this component's
+ * minimal chrome does not render anyway. Passed as a `plugins` entry so it registers before
+ * `editor.setComponents` parses the initial `html` (see `initInteractiveHtmlEditor` below).
+ *
+ * @complexity O(1) — one type registration; the per-element check GrapesJS then runs during parsing
+ * is O(1) per element (whatever `isProtectedElement` costs), not owned by this function.
+ * @overallScore 100
+ */
+function registerProtectedElementType(editor, isProtectedElement) {
+    editor.Components.addType(PROTECTED_ELEMENT_TYPE, {
+        isComponent: (el) => (isProtectedElement(el) ? { type: PROTECTED_ELEMENT_TYPE } : undefined),
+        model: {
+            defaults: {
+                editable: false,
+                draggable: false,
+                droppable: false,
+                removable: false,
+                selectable: false,
+                highlightable: false,
+                hoverable: false,
+                layerable: false,
+                badgable: false,
+                stylable: false,
+            },
+        },
+    });
+}
+function initInteractiveHtmlEditor(container, html, isProtectedElement, canvasStyling) {
+    return grapesjs.init({
+        container,
+        height: '100%',
+        fromElement: false,
+        components: html,
+        storageManager: { type: 'none' },
+        panels: { defaults: [] },
+        blockManager: { blocks: [] },
+        richTextEditor: { actions: RTE_ACTIONS },
+        canvas: buildCanvasStyleConfig(canvasStyling),
+        plugins: isProtectedElement
+            ? [(editor) => registerProtectedElementType(editor, isProtectedElement)]
+            : [],
+    });
+}
+/**
+ * `editor.getHtml()` and `editor.getCss()` are separate outputs in GrapesJS — the component tree
+ * and its CSS rules live in independent models (`CodeManager` vs `CssComposer`). Confirmed live, the
+ * hard way: calling `getHtml()` alone silently drops every CSS rule the moment a real edit triggers
+ * GrapesJS's component-tree re-sync (before any edit, GrapesJS passes an unparsed `<style>` block
+ * through untouched, masking this; after one real edit, `getHtml()`'s output is built fresh from the
+ * component model, which has no CSS in it at all — reproduced with a real page's content: one text
+ * edit took `getHtml()`'s output from 8215 characters down to 3160, `<style>` block and all rules
+ * gone, the typed edit itself the only thing that survived). `keepUnusedStyles: true` on `getCss()`
+ * matters here specifically: real documents commonly carry `@media` blocks and `::before`/`::after`
+ * rules that don't correspond to any single "matched" component in the tree — GrapesJS's default CSS
+ * export can drop rules it doesn't consider currently referenced, which would silently re-lose exactly
+ * the kind of rule a real design (dark-mode variants, decorative pseudo-elements) depends on.
+ */
+function serializeEditorContent(editor) {
+    const css = editor.getCss({ keepUnusedStyles: true });
+    const html = editor.getHtml();
+    return css ? `<style>${prettifyCss(css)}</style>${html}` : html;
+}
+/**
+ * Owns one GrapesJS `Editor` instance for the lifetime of the calling component's mount. `onChange`
+ * fires with the editor's current serialized content (see `serializeEditorContent`) on every content
+ * mutation (GrapesJS's `update` event — components, styles, or attributes changing); it is not
+ * debounced, so a caller replacing an existing uncontrolled `<textarea>` (which already pushes a full
+ * value on every keystroke) sees matching behavior.
+ *
+ * **Mounts into a dedicated child node, not the wrapper div `containerRef` itself, and removes that
+ * child node (not just its content) on cleanup.** Defensive, for React StrictMode's dev-time
+ * double-invoke (mount -> cleanup -> mount again, synchronously): if a destroyed instance's canvas
+ * were still mid-render when cleanup ran, clearing the container's *current* content at that moment
+ * cannot remove DOM that does not exist yet, and a later async write from the discarded instance
+ * would land after the fact. Detaching the whole per-instance node sidesteps that class of ordering
+ * problem entirely — whatever a destroyed instance's async work later does, it mutates a node no
+ * longer connected to `document`, so it can never become visible or queryable in the live page no
+ * matter when it runs. (Investigated live via Playwright while chasing an unrelated symptom — two
+ * canvas iframes coexisting after one mount — which turned out to be a separate, harmless GrapesJS
+ * quirk unrelated to StrictMode: `Canvas`'s `FramesView` always constructs one `FrameView` that never
+ * proceeds past construction to `render()`, alongside the real one; it keeps Backbone's default
+ * `class="frame"` forever, inert and unrendered. `.gjs-frame` — the class `FrameView.render()`
+ * assigns — is what callers should select on, never a bare `iframe` under the wrapper.)
+ *
+ * @complexity O(1) setup/teardown. Steady-state cost is GrapesJS's own serialization per edit,
+ * proportional to document size — not something this hook controls or should hide a note about
+ * beyond that.
+ * @overallScore 100
+ */
+export function useInteractiveHtmlEditor(html, onChange, isProtectedElement, canvasStyling = {}, describeEmbedPlaceholder) {
+    const wrapperRef = useRef(null);
+    const onChangeRef = useRef(onChange);
+    onChangeRef.current = onChange;
+    useEffect(() => {
+        const wrapper = wrapperRef.current;
+        if (!wrapper)
+            return;
+        const mountEl = document.createElement('div');
+        mountEl.style.height = '100%';
+        wrapper.appendChild(mountEl);
+        const editor = initInteractiveHtmlEditor(mountEl, html, isProtectedElement, canvasStyling);
+        const handleUpdate = () => onChangeRef.current(serializeEditorContent(editor));
+        editor.on('update', handleUpdate);
+        // `load` fires once the canvas's initial component render is done (`editor.Canvas.getBody()` is
+        // populated) — see `applyCanvasContentWrapper`'s own file header for why the wrap has to happen
+        // here, against the live canvas, rather than folded into `components` above. Embed placeholders
+        // piggyback on this SAME handler/event rather than a second `editor.on('load', ...)` registration
+        // — see `applyCanvasEmbedPlaceholders`'s own file header for its matching export-safety argument.
+        // Applied AFTER the content wrapper so a placeholder can sit correctly however deep the wrapper
+        // chain nests its marker, though nothing about either function actually depends on this order.
+        const handleLoad = () => {
+            const body = editor.Canvas.getBody();
+            applyCanvasContentWrapper(body, canvasStyling.contentWrapper);
+            if (describeEmbedPlaceholder)
+                applyCanvasEmbedPlaceholders(body, describeEmbedPlaceholder);
+        };
+        editor.on('load', handleLoad);
+        return () => {
+            editor.off('update', handleUpdate);
+            editor.off('load', handleLoad);
+            editor.destroy();
+            mountEl.remove();
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps -- intentionally mount-only, see file header
+    }, []);
+    return { containerRef: wrapperRef };
+}
+//# sourceMappingURL=useInteractiveHtmlEditor.js.map

package/dist/features/html-editor/react/hooks/useInteractiveHtmlEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInteractiveHtmlEditor.js","sourceRoot":"","sources":["../../../../../src/features/html-editor/react/hooks/useInteractiveHtmlEditor.ts"],"names":[],"mappings":"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"}

package/dist/features/html-viewer/dependencies.d.ts

@@ -1,7 +1,7 @@
 import type { FullscreenPort, HtmlViewerDependencies, NewTabPreviewPort } from './ports.js';
 /** Real browser Fullscreen API binding. Every method is SSR-guarded (`typeof document === 'undefined'`). */
 export declare function createBrowserFullscreenPort(): FullscreenPort;
-/** Reuses `@jini-ai/renderers-react`'s `openSandboxedPreviewInNewTab` — the sandboxed-iframe core this whole slice is the first `@jini-ai/ui` consumer of. */
+/** Reuses `@jini-ai/ui`'s own `./renderers` subpath's `openSandboxedPreviewInNewTab` — the sandboxed-iframe core this whole slice is the first consumer of within this package. */
 export declare function createBrowserNewTabPreviewPort(): NewTabPreviewPort;
 export declare function createDefaultHtmlViewerDependencies(): HtmlViewerDependencies;
 export declare const defaultHtmlViewerDependencies: HtmlViewerDependencies;

package/dist/features/html-viewer/dependencies.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dependencies.d.ts","sourceRoot":"","sources":["../../../src/features/html-viewer/dependencies.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,sBAAsB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAE5F,4GAA4G;AAC5G,wBAAgB,2BAA2B,IAAI,cAAc,CAuB5D;AAED,8JAA8J;AAC9J,wBAAgB,8BAA8B,IAAI,iBAAiB,CAMlE;AAED,wBAAgB,mCAAmC,IAAI,sBAAsB,CAK5E;AAOD,eAAO,MAAM,6BAA6B,EAAE,sBAA8D,CAAC"}
+{"version":3,"file":"dependencies.d.ts","sourceRoot":"","sources":["../../../src/features/html-viewer/dependencies.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,sBAAsB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAE5F,4GAA4G;AAC5G,wBAAgB,2BAA2B,IAAI,cAAc,CAuB5D;AAED,mLAAmL;AACnL,wBAAgB,8BAA8B,IAAI,iBAAiB,CAMlE;AAED,wBAAgB,mCAAmC,IAAI,sBAAsB,CAK5E;AAOD,eAAO,MAAM,6BAA6B,EAAE,sBAA8D,CAAC"}

package/dist/features/html-viewer/dependencies.js

@@ -1,4 +1,4 @@
-import { openSandboxedPreviewInNewTab } from '@jini-ai/renderers-react';
+import { openSandboxedPreviewInNewTab } from '../../renderers/index.js';
 /** Real browser Fullscreen API binding. Every method is SSR-guarded (`typeof document === 'undefined'`). */
 export function createBrowserFullscreenPort() {
     return {
@@ -28,7 +28,7 @@ export function createBrowserFullscreenPort() {
         },
     };
 }
-/** Reuses `@jini-ai/renderers-react`'s `openSandboxedPreviewInNewTab` — the sandboxed-iframe core this whole slice is the first `@jini-ai/ui` consumer of. */
+/** Reuses `@jini-ai/ui`'s own `./renderers` subpath's `openSandboxedPreviewInNewTab` — the sandboxed-iframe core this whole slice is the first consumer of within this package. */
 export function createBrowserNewTabPreviewPort() {
     return {
         openInNewTab(html, title) {

package/dist/features/html-viewer/dependencies.js.map

@@ -1 +1 @@
-{"version":3,"file":"dependencies.js","sourceRoot":"","sources":["../../../src/features/html-viewer/dependencies.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,4BAA4B,EAAE,MAAM,0BAA0B,CAAC;AAGxE,4GAA4G;AAC5G,MAAM,UAAU,2BAA2B;IACzC,OAAO;QACL,KAAK,CAAC,iBAAiB,CAAC,OAAO;YAC7B,IAAI,OAAO,OAAO,CAAC,iBAAiB,KAAK,UAAU;gBAAE,OAAO;YAC5D,MAAM,OAAO,CAAC,iBAAiB,EAAE,CAAC;QACpC,CAAC;QACD,KAAK,CAAC,cAAc;YAClB,IAAI,OAAO,QAAQ,KAAK,WAAW;gBAAE,OAAO;YAC5C,IAAI,CAAC,QAAQ,CAAC,iBAAiB,IAAI,OAAO,QAAQ,CAAC,cAAc,KAAK,UAAU;gBAAE,OAAO;YACzF,MAAM,QAAQ,CAAC,cAAc,EAAE,CAAC;QAClC,CAAC;QACD,iBAAiB;YACf,sEAAsE;YACtE,qEAAqE;YACrE,2DAA2D;YAC3D,OAAO,OAAO,QAAQ,KAAK,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,iBAAiB,IAAI,IAAI,CAAC,CAAC;QACvF,CAAC;QACD,yBAAyB,CAAC,QAAQ;YAChC,IAAI,OAAO,QAAQ,KAAK,WAAW;gBAAE,OAAO,GAAG,EAAE,GAAE,CAAC,CAAC;YACrD,QAAQ,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,QAAQ,CAAC,CAAC;YACxD,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,kBAAkB,EAAE,QAAQ,CAAC,CAAC;QAC1E,CAAC;KACF,CAAC;AACJ,CAAC;AAED,8JAA8J;AAC9J,MAAM,UAAU,8BAA8B;IAC5C,OAAO;QACL,YAAY,CAAC,IAAI,EAAE,KAAK;YACtB,4BAA4B,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;QAC5C,CAAC;KACF,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,mCAAmC;IACjD,OAAO;QACL,UAAU,EAAE,2BAA2B,EAAE;QACzC,aAAa,EAAE,8BAA8B,EAAE;KAChD,CAAC;AACJ,CAAC;AAED,yEAAyE;AACzE,2EAA2E;AAC3E,0EAA0E;AAC1E,2EAA2E;AAC3E,6CAA6C;AAC7C,MAAM,CAAC,MAAM,6BAA6B,GAA2B,mCAAmC,EAAE,CAAC"}
+{"version":3,"file":"dependencies.js","sourceRoot":"","sources":["../../../src/features/html-viewer/dependencies.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,4BAA4B,EAAE,MAAM,0BAA0B,CAAC;AAGxE,4GAA4G;AAC5G,MAAM,UAAU,2BAA2B;IACzC,OAAO;QACL,KAAK,CAAC,iBAAiB,CAAC,OAAO;YAC7B,IAAI,OAAO,OAAO,CAAC,iBAAiB,KAAK,UAAU;gBAAE,OAAO;YAC5D,MAAM,OAAO,CAAC,iBAAiB,EAAE,CAAC;QACpC,CAAC;QACD,KAAK,CAAC,cAAc;YAClB,IAAI,OAAO,QAAQ,KAAK,WAAW;gBAAE,OAAO;YAC5C,IAAI,CAAC,QAAQ,CAAC,iBAAiB,IAAI,OAAO,QAAQ,CAAC,cAAc,KAAK,UAAU;gBAAE,OAAO;YACzF,MAAM,QAAQ,CAAC,cAAc,EAAE,CAAC;QAClC,CAAC;QACD,iBAAiB;YACf,sEAAsE;YACtE,qEAAqE;YACrE,2DAA2D;YAC3D,OAAO,OAAO,QAAQ,KAAK,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,iBAAiB,IAAI,IAAI,CAAC,CAAC;QACvF,CAAC;QACD,yBAAyB,CAAC,QAAQ;YAChC,IAAI,OAAO,QAAQ,KAAK,WAAW;gBAAE,OAAO,GAAG,EAAE,GAAE,CAAC,CAAC;YACrD,QAAQ,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,QAAQ,CAAC,CAAC;YACxD,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,kBAAkB,EAAE,QAAQ,CAAC,CAAC;QAC1E,CAAC;KACF,CAAC;AACJ,CAAC;AAED,mLAAmL;AACnL,MAAM,UAAU,8BAA8B;IAC5C,OAAO;QACL,YAAY,CAAC,IAAI,EAAE,KAAK;YACtB,4BAA4B,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;QAC5C,CAAC;KACF,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,mCAAmC;IACjD,OAAO;QACL,UAAU,EAAE,2BAA2B,EAAE;QACzC,aAAa,EAAE,8BAA8B,EAAE;KAChD,CAAC;AACJ,CAAC;AAED,yEAAyE;AACzE,2EAA2E;AAC3E,0EAA0E;AAC1E,2EAA2E;AAC3E,6CAA6C;AAC7C,MAAM,CAAC,MAAM,6BAA6B,GAA2B,mCAAmC,EAAE,CAAC"}

package/dist/features/html-viewer/react/hooks/useDeckNavigation.d.ts

@@ -14,8 +14,8 @@ export interface DeckNavigationController {
     goTo(index: number): void;
 }
 /**
- * Drives deck/slide navigation over `@jini-ai/renderers-react`'s
- * `useSandboxBridge`, speaking the neutral `jini:deck-*` protocol from
+ * Drives deck/slide navigation over `@jini-ai/ui`'s own `./renderers`
+ * subpath's `useSandboxBridge`, speaking the neutral `jini:deck-*` protocol from
  * `constants.ts`. The sandboxed content itself must implement the deck
  * framework that responds to these messages — this hook only sends
  * navigation requests and tracks the state the content reports back.