@jini-ai/ui 0.3.14 → 0.4.0

package/dist/react/components/PaletteTweaks.js

@@ -11,11 +11,11 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { Icon } from './Icon.js';
 export const PALETTE_TWEAKS_SWATCHES = [
-    { id: 'coral', label: 'Coral - default', stripe: ['#ff5a3c', '#ff7a5c', '#fde2d6', '#171717'] },
-    { id: 'electric', label: 'Electric', stripe: ['#7c3aed', '#a855f7', '#e9d5ff', '#171717'] },
-    { id: 'acid-forest', label: 'Acid forest', stripe: ['#16a34a', '#22c55e', '#bbf7d0', '#0f1d14'] },
-    { id: 'risograph', label: 'Risograph', stripe: ['#e11d48', '#2563eb', '#fde68a', '#171717'] },
-    { id: 'mono-noir', label: 'Mono noir', stripe: ['#0a0a0a', '#262626', '#e5e5e5', '#fafafa'] },
+    { id: 'coral', label: 'Coral - default', stripe: ['var(--jini-primary)', 'var(--jini-primary)', 'var(--jini-primary)', 'var(--jini-primary)'] },
+    { id: 'electric', label: 'Electric', stripe: ['var(--jini-primary)', 'var(--jini-primary)', 'var(--jini-primary)', 'var(--jini-primary)'] },
+    { id: 'acid-forest', label: 'Acid forest', stripe: ['var(--jini-primary)', 'var(--jini-primary)', 'var(--jini-primary)', 'var(--jini-primary)'] },
+    { id: 'risograph', label: 'Risograph', stripe: ['var(--jini-primary)', 'var(--jini-primary)', 'var(--jini-primary)', 'var(--jini-primary)'] },
+    { id: 'mono-noir', label: 'Mono noir', stripe: ['var(--jini-text)', 'var(--jini-primary)', 'var(--jini-primary)', 'var(--jini-primary)'] },
 ];
 // --- Pure derivations (module-level, directly unit-testable) --------------
 /**

package/dist/react/hooks/useBrandFonts.d.ts

@@ -9,14 +9,29 @@ export interface BrandFontManifest {
     files?: BrandFontManifestFile[];
 }
 export interface UseBrandFontsOptions {
+    projectId?: string;
     /**
      * Builds the URL for a project asset path (e.g. `fonts/manifest.json`).
      * Omit to skip the self-hosted-font-manifest stage entirely — this hook
      * never hardcodes a font-service URL of its own.
      */
-    resolveProjectAssetUrl?: (projectId: string, path: string) => string;
+    resolveProjectAssetUrl?: (requiredArgs: {
+        projectId: string;
+        path: string;
+    }) => string;
+    manifest?: BrandFontManifestPort;
+    /** Native fetch port used by the default manifest loader. */
+    fetch?: typeof globalThis.fetch;
+    document?: Document;
 }
-export declare function useBrandFonts(projectId: string | undefined, fonts: {
-    googleFontsUrl?: string;
-}[], options?: UseBrandFontsOptions): void;
+export interface BrandFontManifestPort {
+    load(requiredArgs: {
+        url: string;
+    }): Promise<Pick<Response, 'ok' | 'json'>>;
+}
+export declare function useBrandFonts({ fonts }: {
+    fonts: {
+        googleFontsUrl?: string;
+    }[];
+}, options?: UseBrandFontsOptions): void;
 //# sourceMappingURL=useBrandFonts.d.ts.map

package/dist/react/hooks/useBrandFonts.js

@@ -5,9 +5,13 @@
 // down on change. Not tied to any one feature domain — feature-local hooks
 // live inside their own `features/<domain>/react/hooks/` instead.
 import { useEffect, useMemo } from 'react';
-import { FETCH_TIMEOUT_MS, fetchWithTimeout } from '@jini-ai/platform/fetch-with-timeout';
-export function useBrandFonts(projectId, fonts, options = {}) {
-    const { resolveProjectAssetUrl } = options;
+import { requestWithTimeout } from '../../utils/browser-request.js';
+export function useBrandFonts({ fonts }, options = {}) {
+    const { projectId, resolveProjectAssetUrl, fetch, manifest: suppliedManifest } = options;
+    const manifest = useMemo(() => suppliedManifest ?? {
+        load: ({ url }) => requestWithTimeout({ url, timeoutMs: 15_000 }, { ...(fetch === undefined ? {} : { fetch }), init: { cache: 'no-store' } }),
+    }, [suppliedManifest, fetch]);
+    const document = options.document ?? globalThis.document;
     const googleUrls = useMemo(() => {
         const urls = fonts
             .map((f) => f.googleFontsUrl)
@@ -26,7 +30,7 @@ export function useBrandFonts(projectId, fonts, options = {}) {
             for (const link of links)
                 link.remove();
         };
-    }, [googleUrls]);
+    }, [googleUrls, document]);
     useEffect(() => {
         if (!projectId || !resolveProjectAssetUrl)
             return;
@@ -34,7 +38,7 @@ export function useBrandFonts(projectId, fonts, options = {}) {
         let styleEl = null;
         void (async () => {
             try {
-                const resp = await fetchWithTimeout(resolveProjectAssetUrl(projectId, 'fonts/manifest.json'), { cache: 'no-store' }, { timeoutMs: FETCH_TIMEOUT_MS.QUICK });
+                const resp = await manifest.load({ url: resolveProjectAssetUrl({ projectId, path: 'fonts/manifest.json' }) });
                 if (!resp.ok)
                     return;
                 const data = (await resp.json());
@@ -43,7 +47,7 @@ export function useBrandFonts(projectId, fonts, options = {}) {
                     return;
                 const css = files
                     .map((f) => {
-                    const url = resolveProjectAssetUrl(projectId, `fonts/${f.file}`);
+                    const url = resolveProjectAssetUrl({ projectId, path: `fonts/${f.file}` });
                     return [
                         '@font-face {',
                         `  font-family: '${f.family.replace(/'/g, '')}';`,
@@ -69,6 +73,6 @@ export function useBrandFonts(projectId, fonts, options = {}) {
             if (styleEl)
                 styleEl.remove();
         };
-    }, [projectId, resolveProjectAssetUrl]);
+    }, [projectId, resolveProjectAssetUrl, manifest, document]);
 }
 //# sourceMappingURL=useBrandFonts.js.map

package/dist/react/hooks/useDebouncedValue.d.ts

@@ -1,2 +1,13 @@
-export declare function useDebouncedValue<T>(value: T, delayMs: number): T;
+export interface DebounceSchedulerPort {
+    schedule(requiredArgs: {
+        callback: () => void;
+        delayMs: number;
+    }): () => void;
+}
+export declare function useDebouncedValue<T>({ value, delayMs }: {
+    value: T;
+    delayMs: number;
+}, { scheduler }?: {
+    scheduler?: DebounceSchedulerPort;
+}): T;
 //# sourceMappingURL=useDebouncedValue.d.ts.map

package/dist/react/hooks/useDebouncedValue.js

@@ -3,12 +3,17 @@
 // one feature domain — feature-local hooks live inside their own
 // `features/<domain>/react/hooks/` instead.
 import { useEffect, useState } from 'react';
-export function useDebouncedValue(value, delayMs) {
+const browserScheduler = {
+    schedule: ({ callback, delayMs }) => {
+        const timer = setTimeout(callback, delayMs);
+        return () => clearTimeout(timer);
+    },
+};
+export function useDebouncedValue({ value, delayMs }, { scheduler = browserScheduler } = {}) {
     const [debounced, setDebounced] = useState(value);
     useEffect(() => {
-        const timer = setTimeout(() => setDebounced(value), delayMs);
-        return () => clearTimeout(timer);
-    }, [value, delayMs]);
+        return scheduler.schedule({ callback: () => setDebounced(value), delayMs });
+    }, [value, delayMs, scheduler]);
     return debounced;
 }
 //# sourceMappingURL=useDebouncedValue.js.map

package/dist/react/hooks/useStableHandler.d.ts

@@ -6,5 +6,7 @@
  * — safe for event handlers, which only fire after commit; do not call the
  * result during render).
  */
-export declare function useStableHandler<Args extends unknown[], Result>(handler: (...args: Args) => Result): (...args: Args) => Result;
+export declare function useStableHandler<Args extends unknown[], Result>({ handler }: {
+    handler: (...args: Args) => Result;
+}): (...args: Args) => Result;
 //# sourceMappingURL=useStableHandler.d.ts.map

package/dist/react/hooks/useStableHandler.js

@@ -7,7 +7,7 @@ import { useCallback, useEffect, useRef } from 'react';
  * — safe for event handlers, which only fire after commit; do not call the
  * result during render).
  */
-export function useStableHandler(handler) {
+export function useStableHandler({ handler }) {
     const ref = useRef(handler);
     useEffect(() => {
         ref.current = handler;

package/dist/renderers/annotation-canvas/drawing.d.ts

@@ -5,17 +5,17 @@
  * layer.
  *
  * Origin: `apps/web/src/components/PreviewDrawOverlay.tsx`. See
- * `../source-map.md`.
+ * `../archived provenance ledger`.
  */
 import type { CaptureTarget, NormalizedRect, Stroke, TextMark } from './types.js';
-export declare const STROKE_COLOR = "#ff3b30";
+export declare const STROKE_COLOR: string;
 export declare const STROKE_WIDTH = 4;
-export declare const TARGET_COLOR = "#1677ff";
+export declare const TARGET_COLOR: string;
 /** Text-annotation glyph height as a fraction of the frame height, so a dropped label reads at a consistent size across differently-sized frames and its on-screen size matches what gets baked into an exported screenshot. */
 export declare const TEXT_FONT_FRACTION = 0.03;
 export declare const TEXT_LINE_HEIGHT = 1.25;
 export declare const TEXT_MIN_FONT_PX = 12;
-export declare const TEXT_FONT_FAMILY = "system-ui, -apple-system, BlinkMacSystemFont, sans-serif";
+export declare const TEXT_FONT_FAMILY: string;
 export declare function textFontSizePx(frameHeight: number): number;
 export declare function drawNormalizedBox(ctx: CanvasRenderingContext2D, box: NormalizedRect, width: number, height: number): void;
 /** Redraws every committed stroke, the in-progress draft stroke, committed selection boxes, and the in-progress box draft. Called on every pointer move (rAF-coalesced by the caller) and on every history mutation. */

package/dist/renderers/annotation-canvas/drawing.js

@@ -1,32 +1,39 @@
-export const STROKE_COLOR = '#ff3b30';
+import { defaultAdminTheme } from '../../theme/default.js';
+import { resolveAnnotationTheme } from './theme.js';
+export const STROKE_COLOR = defaultAdminTheme.light.danger;
 export const STROKE_WIDTH = 4;
-export const TARGET_COLOR = '#1677ff';
+export const TARGET_COLOR = defaultAdminTheme.light.primary;
 /** Text-annotation glyph height as a fraction of the frame height, so a dropped label reads at a consistent size across differently-sized frames and its on-screen size matches what gets baked into an exported screenshot. */
 export const TEXT_FONT_FRACTION = 0.03;
 export const TEXT_LINE_HEIGHT = 1.25;
 export const TEXT_MIN_FONT_PX = 12;
-export const TEXT_FONT_FAMILY = 'system-ui, -apple-system, BlinkMacSystemFont, sans-serif';
+export const TEXT_FONT_FAMILY = defaultAdminTheme.fonts.body;
 export function textFontSizePx(frameHeight) {
     return Math.max(TEXT_MIN_FONT_PX, TEXT_FONT_FRACTION * frameHeight);
 }
 export function drawNormalizedBox(ctx, box, width, height) {
+    const theme = resolveAnnotationTheme({ canvas: ctx.canvas });
     const left = box.x * width;
     const top = box.y * height;
     const boxWidth = Math.max(1, box.width * width);
     const boxHeight = Math.max(1, box.height * height);
     ctx.save();
-    ctx.fillStyle = 'rgba(255, 59, 48, 0.10)';
-    ctx.strokeStyle = STROKE_COLOR;
+    ctx.fillStyle = theme.stroke;
+    const boxAlpha = ctx.globalAlpha;
+    ctx.globalAlpha = boxAlpha * 0.10;
+    ctx.strokeStyle = theme.stroke;
     ctx.lineWidth = Math.max(2, Math.round(Math.min(width, height) * 0.002));
     ctx.setLineDash([10, 6]);
     ctx.fillRect(left, top, boxWidth, boxHeight);
+    ctx.globalAlpha = boxAlpha;
     ctx.strokeRect(left, top, boxWidth, boxHeight);
     ctx.restore();
 }
 /** Redraws every committed stroke, the in-progress draft stroke, committed selection boxes, and the in-progress box draft. Called on every pointer move (rAF-coalesced by the caller) and on every history mutation. */
 export function redrawStrokesAndBoxes(ctx, input, width, height, dpr) {
+    const theme = resolveAnnotationTheme({ canvas: ctx.canvas });
     ctx.clearRect(0, 0, width, height);
-    ctx.strokeStyle = STROKE_COLOR;
+    ctx.strokeStyle = theme.stroke;
     ctx.lineWidth = STROKE_WIDTH * dpr;
     ctx.lineCap = 'round';
     ctx.lineJoin = 'round';
@@ -50,14 +57,15 @@ export function redrawStrokesAndBoxes(ctx, input, width, height, dpr) {
 }
 /** Bakes the transparent on-screen text labels into an exported screenshot. Uses the same frame-height-fraction glyph size the DOM textareas use, so what the user typed lands at the same size/position in the captured image. */
 export function drawTextMarks(ctx, marks, width, height) {
+    const theme = resolveAnnotationTheme({ canvas: ctx.canvas });
     const fontPx = textFontSizePx(height);
     const lineHeight = fontPx * TEXT_LINE_HEIGHT;
     const topPad = (lineHeight - fontPx) / 2;
     ctx.save();
     ctx.textBaseline = 'top';
-    ctx.font = `600 ${fontPx}px ${TEXT_FONT_FAMILY}`;
-    ctx.fillStyle = STROKE_COLOR;
-    ctx.shadowColor = 'rgba(255,255,255,0.75)';
+    ctx.font = `600 ${fontPx}px ${theme.font}`;
+    ctx.fillStyle = theme.stroke;
+    ctx.shadowColor = theme.bg;
     ctx.shadowBlur = Math.max(1, fontPx * 0.14);
     for (const mark of marks) {
         if (mark.text.trim().length === 0)
@@ -79,21 +87,25 @@ export function drawCaptureTarget(ctx, scaleX, scaleY, target) {
         return;
     if (width <= 0 || height <= 0)
         return;
+    const theme = resolveAnnotationTheme({ canvas: ctx.canvas });
     const left = x * scaleX;
     const top = y * scaleY;
     const boxWidth = Math.max(1, width * scaleX);
     const boxHeight = Math.max(1, height * scaleY);
     ctx.save();
-    ctx.fillStyle = 'rgba(22, 119, 255, 0.12)';
-    ctx.strokeStyle = TARGET_COLOR;
+    ctx.fillStyle = theme.target;
+    const targetAlpha = ctx.globalAlpha;
+    ctx.globalAlpha = targetAlpha * 0.12;
+    ctx.strokeStyle = theme.target;
     ctx.lineWidth = Math.max(2, Math.round(Math.max(scaleX, scaleY) * 2));
     ctx.setLineDash([Math.max(8, 8 * scaleX), Math.max(4, 4 * scaleX)]);
     ctx.fillRect(left, top, boxWidth, boxHeight);
+    ctx.globalAlpha = targetAlpha;
     ctx.strokeRect(left, top, boxWidth, boxHeight);
     const label = (target.label || target.elementId || '').trim();
     if (label) {
         const fontSize = Math.max(12, Math.round(12 * Math.max(scaleX, scaleY)));
-        ctx.font = `600 ${fontSize}px ${TEXT_FONT_FAMILY}`;
+        ctx.font = `600 ${fontSize}px ${theme.font}`;
         const text = label.length > 42 ? `${label.slice(0, 39)}...` : label;
         const metrics = ctx.measureText(text);
         const padX = Math.max(6, Math.round(6 * scaleX));
@@ -102,19 +114,20 @@ export function drawCaptureTarget(ctx, scaleX, scaleY, target) {
         const labelHeight = fontSize + padY * 2;
         const labelTop = Math.max(0, top - labelHeight - Math.max(4, 4 * scaleY));
         ctx.setLineDash([]);
-        ctx.fillStyle = TARGET_COLOR;
+        ctx.fillStyle = theme.target;
         ctx.fillRect(left, labelTop, labelWidth, labelHeight);
-        ctx.fillStyle = '#fff';
+        ctx.fillStyle = theme.ink;
         ctx.fillText(text, left + padX, labelTop + padY + fontSize * 0.82);
     }
     ctx.restore();
 }
 /** Composites the current marks (capture-target highlight, selection boxes, strokes, text labels) onto an already-drawn background image at export resolution. */
 export function compositeMarksOntoCanvas(ctx, input, outputWidth, outputHeight, scaleX, scaleY) {
+    const theme = resolveAnnotationTheme({ canvas: ctx.canvas });
     drawCaptureTarget(ctx, scaleX, scaleY, input.target);
     for (const box of input.selectionBoxes)
         drawNormalizedBox(ctx, box, outputWidth, outputHeight);
-    ctx.strokeStyle = STROKE_COLOR;
+    ctx.strokeStyle = theme.stroke;
     ctx.lineWidth = STROKE_WIDTH * Math.max(scaleX, scaleY);
     ctx.lineCap = 'round';
     ctx.lineJoin = 'round';

package/dist/renderers/annotation-canvas/react/components/AnnotationCanvas.js

@@ -66,8 +66,8 @@ export function AnnotationCanvas(props) {
                                 resize: 'none',
                                 overflow: 'hidden',
                                 whiteSpace: 'pre',
-                                color: '#ff3b30',
-                                caretColor: '#ff3b30',
+                                color: 'var(--jini-danger)',
+                                caretColor: 'var(--jini-danger)',
                                 fontWeight: 600,
                                 fontSize: c.textFontPx,
                                 lineHeight: 1.25,

package/dist/renderers/annotation-canvas/react/hooks/useAnnotationCanvas.js

@@ -1,3 +1,4 @@
+import { resolveAnnotationTheme } from '../../theme.js';
 /**
  * Headless controller for the annotation-canvas engine: freehand/box/text
  * drawing, undo/redo, canvas rAF/DPR redraw, the collision-avoiding floating
@@ -7,7 +8,7 @@
  * Shift+Cmd/Ctrl+Z redo; Enter in the note input submits as Queue).
  *
  * Origin: `apps/web/src/components/PreviewDrawOverlay.tsx`. See
- * `../../source-map.md` for the exact file-by-file port breakdown and what
+ * `../../archived provenance ledger` for the exact file-by-file port breakdown and what
  * was intentionally left product-side (the `window` `CustomEvent` wire
  * protocol, the compositor-iframe snapshot lookup, the composer's
  * submission semantics).
@@ -621,7 +622,7 @@ export function useAnnotationCanvas(options) {
         // ever reached via `send()`, itself only invocable from an event handler
         // on an already-mounted, hydrated component — never during an SSR render
         // pass, where `document` is provably defined. Proved dead and removed
-        // during the coverage pass (see `source-map.md`); the guard is only
+        // during the coverage pass (see `archived provenance ledger`); the guard is only
         // meaningful at JSX-render time (portal / effect bodies), not inside an
         // async handler like this one.
         const out = document.createElement('canvas');
@@ -638,7 +639,7 @@ export function useAnnotationCanvas(options) {
         });
         if (!bg)
             return null;
-        ctx.fillStyle = '#ffffff';
+        ctx.fillStyle = resolveAnnotationTheme({ canvas: out }).bg;
         ctx.fillRect(0, 0, out.width, out.height);
         ctx.drawImage(bg, 0, 0, snap.w, snap.h);
         const sx = snap.w / Math.max(1, frameRect.width);

package/dist/renderers/annotation-canvas/rules.d.ts

@@ -6,7 +6,7 @@
  * useAnnotationCanvas.ts`) measures from the live DOM and passes in.
  *
  * Origin: `apps/web/src/components/PreviewDrawOverlay.tsx`. See
- * `../source-map.md`.
+ * `../archived provenance ledger`.
  */
 import type { AnnotationAction, CSSPropertiesLike, DockPlacement, NormalizedRect, Point, Rect } from './types.js';
 export declare function clamp(value: number, min: number, max: number): number;

package/dist/renderers/annotation-canvas/theme.d.ts

@@ -0,0 +1,13 @@
+/** Canvas requires resolved colors rather than var() strings. Its injected canvas owns the DOM. */
+export declare function resolveAnnotationTheme({ canvas }: {
+    readonly canvas?: HTMLCanvasElement;
+}, { getComputedStyle }?: {
+    readonly getComputedStyle?: (element: Element) => CSSStyleDeclaration;
+}): {
+    stroke: string;
+    target: string;
+    bg: string;
+    ink: string;
+    font: string;
+};
+//# sourceMappingURL=theme.d.ts.map

package/dist/renderers/annotation-canvas/theme.js

@@ -0,0 +1,16 @@
+import { defaultAdminTheme } from '../../theme/default.js';
+/** Canvas requires resolved colors rather than var() strings. Its injected canvas owns the DOM. */
+export function resolveAnnotationTheme({ canvas }, { getComputedStyle } = {}) {
+    const document = canvas?.ownerDocument;
+    const readStyle = getComputedStyle ?? (document?.defaultView ? document.defaultView.getComputedStyle.bind(document.defaultView) : undefined);
+    const style = document && readStyle ? readStyle(canvas?.isConnected ? canvas : document.documentElement) : undefined;
+    const read = (name, fallback) => style?.getPropertyValue(name).trim() || fallback;
+    return {
+        stroke: read('--jini-danger', defaultAdminTheme.light.danger),
+        target: read('--jini-primary', defaultAdminTheme.light.primary),
+        bg: read('--jini-bg', defaultAdminTheme.light.bg),
+        ink: read('--jini-primary-ink', defaultAdminTheme.light.primaryInk),
+        font: read('--jini-font-body', defaultAdminTheme.fonts.body),
+    };
+}
+//# sourceMappingURL=theme.js.map

package/dist/renderers/annotation-canvas/types.d.ts

@@ -4,7 +4,7 @@
  * `children`), with a send/draft/queue submit-action picker.
  *
  * Origin: `apps/web/src/components/PreviewDrawOverlay.tsx` (the origin
- * project, 2,158 lines). See `../source-map.md` for the full port writeup.
+ * project, 2,158 lines). See `../archived provenance ledger` for the full port writeup.
  */
 export interface Point {
     x: number;

package/dist/renderers/index.d.ts

@@ -3,7 +3,7 @@
  * srcDoc host. See `ADS-memory/reports/jini-port/extraction-plan.md` §3 and
  * `ADS-memory/reports/jini-port/recon/r4b-webui-design.md` §1 ("@jini-ai/artifacts-react —
  * RendererRegistry", the pre-lock name for this package) for the design
- * this targets, and `source-map.md` for exact provenance.
+ * this targets, and `archived provenance ledger` for exact provenance.
  */
 export type { ArtifactFile, ArtifactManifest, ArtifactKind, ArtifactRendererId, ArtifactExportKind, ArtifactStatus } from './types.js';
 export { RendererRegistry, resolveArtifactManifest, type ArtifactRenderer, type ArtifactRendererContext, type ArtifactRenderMatch, } from './registry.js';

package/dist/renderers/new-tab-preview.d.ts

@@ -1,5 +1,8 @@
+import type { AdminTheme, ColorScheme } from '../theme/types.js';
 import type { SandboxedDocumentOptions } from './types.js';
 export interface NewTabPreviewOptions extends SandboxedDocumentOptions {
+    adminTheme?: AdminTheme;
+    colorScheme?: ColorScheme;
     /** Allow `window.showModalDialog`-style native modals (`alert`/`confirm`/`prompt`) inside the sandboxed frame. Defaults to `false`. */
     allowModals?: boolean;
 }

package/dist/renderers/new-tab-preview.js

@@ -1,3 +1,5 @@
+import { defaultAdminTheme } from '../theme/default.js';
+import { renderAdminThemeVariables } from '../theme/stylesheet.js';
 import { escapeHtmlAttribute } from './html-utils.js';
 import { buildSandboxedDocument } from './sandboxed-document.js';
 /**
@@ -18,7 +20,7 @@ export function buildSandboxedPreviewPage(html, title, options = {}) {
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <title>${safeTitle}</title>
-  <style>html,body,iframe{margin:0;width:100%;height:100%;border:0}body{overflow:hidden;background:#fff}</style>
+  <style>${renderAdminThemeVariables({ theme: options.adminTheme ?? defaultAdminTheme }, { ...(options.colorScheme ? { colorScheme: options.colorScheme } : {}) })}html,body,iframe{margin:0;width:100%;height:100%;border:0}body{overflow:hidden;background:var(--jini-bg)}</style>
 </head>
 <body>
   <iframe title="${safeTitle}" sandbox="${sandbox}" srcdoc="${escapeHtmlAttribute(innerDoc)}"></iframe>

package/dist/renderers/preview-modal-shell/react/hooks/usePreviewModalShell.d.ts

@@ -4,7 +4,7 @@
  * consumer.
  *
  * Origin: `apps/web/src/components/PreviewModal.tsx`'s component body (the
- * generic-chrome subset — see `../../source-map.md`'s classification). The
+ * generic-chrome subset — see `../../archived provenance ledger`'s classification). The
  * merged Share/Export popover's state (`templateShareOpen`/
  * `copyShareFeedback`/`socialShareTargets`/...) is deliberately not ported
  * here; that block is OD-specific and out of scope for this shell.

package/dist/renderers/preview-modal-shell/react/hooks/usePreviewModalShell.js

@@ -4,7 +4,7 @@
  * consumer.
  *
  * Origin: `apps/web/src/components/PreviewModal.tsx`'s component body (the
- * generic-chrome subset — see `../../source-map.md`'s classification). The
+ * generic-chrome subset — see `../../archived provenance ledger`'s classification). The
  * merged Share/Export popover's state (`templateShareOpen`/
  * `copyShareFeedback`/`socialShareTargets`/...) is deliberately not ported
  * here; that block is OD-specific and out of scope for this shell.

package/dist/renderers/preview-modal-shell/rules.d.ts

@@ -6,7 +6,7 @@
  *
  * Origin: `apps/web/src/components/PreviewModal.tsx`'s inline derivations
  * (the `initial` viewId ternary, `activeView`/`scale`/`scalerStyle` memos).
- * See `../source-map.md`.
+ * See `../archived provenance ledger`.
  */
 import type { PreviewModalContentStatus, PreviewModalScalerStyle, PreviewModalUnavailable } from './types.js';
 export interface PreviewModalViewLike {

package/dist/renderers/preview-modal-shell/types.d.ts

@@ -4,10 +4,10 @@
  * arbitrary preview content. No React import: React-specific prop shapes
  * (anything carrying a `ReactNode`, e.g. the per-view `custom` stage or the
  * sidebar's `content`) live in `react/components/PreviewModalShell.tsx`
- * instead — see the React-layout policy note in `../source-map.md`.
+ * instead — see the React-layout policy note in `../archived provenance ledger`.
  *
  * Origin: `apps/web/src/components/PreviewModal.tsx`. See
- * `../source-map.md`'s `preview-modal-shell` classification section for the
+ * `../archived provenance ledger`'s `preview-modal-shell` classification section for the
  * full generic-vs-OD-specific breakdown.
  */
 /** One item in a split-button primary action's secondary-options menu. */
@@ -35,7 +35,7 @@ export interface PreviewModalPrimaryAction {
  * Shown in the content stage in place of the loading/error/rendered states
  * when a view genuinely has nothing to preview (generalized from the
  * origin's closed `'skill' | 'plugin' | 'template'` noun vocabulary — see
- * `../source-map.md`). The caller owns the copy; the shell just displays it.
+ * `../archived provenance ledger`). The caller owns the copy; the shell just displays it.
  */
 export interface PreviewModalUnavailable {
     message: string;

package/dist/renderers/preview-modal-shell/types.js

@@ -4,10 +4,10 @@
  * arbitrary preview content. No React import: React-specific prop shapes
  * (anything carrying a `ReactNode`, e.g. the per-view `custom` stage or the
  * sidebar's `content`) live in `react/components/PreviewModalShell.tsx`
- * instead — see the React-layout policy note in `../source-map.md`.
+ * instead — see the React-layout policy note in `../archived provenance ledger`.
  *
  * Origin: `apps/web/src/components/PreviewModal.tsx`. See
- * `../source-map.md`'s `preview-modal-shell` classification section for the
+ * `../archived provenance ledger`'s `preview-modal-shell` classification section for the
  * full generic-vs-OD-specific breakdown.
  */
 export {};

package/dist/renderers/react/components/ArtifactView.d.ts

@@ -26,7 +26,7 @@ export interface ArtifactViewSlots {
 export interface ArtifactViewProps {
     file: ArtifactFile;
     registry: RendererRegistry;
-    /** Passed through to `registry.resolve({ file, hints })`. */
+    /** Passed through to `registry.resolve({ file }, { hints })`. */
     hints?: Record<string, unknown> | undefined;
     /** Passed through to `SrcDocSandbox` for the built-in `html`/`svg` rendering. */
     srcDocOptions?: BuildSrcDocOptions | undefined;

package/dist/renderers/react/components/ArtifactView.js

@@ -7,7 +7,7 @@ import { SrcDocSandbox } from './SrcDocSandbox.js';
 import { AnnotationCanvas } from '../../annotation-canvas/index.js';
 export function ArtifactView({ file, registry, hints, srcDocOptions, slots, className, annotation }) {
     const t = useT();
-    const match = useMemo(() => registry.resolve({ file, hints }), [registry, file, hints]);
+    const match = useMemo(() => registry.resolve({ file }, { hints }), [registry, file, hints]);
     const wrap = (node) => (annotation ? _jsx(AnnotationCanvas, { ...annotation, children: node }) : node);
     if (!match) {
         return wrap(_jsx("div", { className: className, role: "status", children: t('No renderer is registered for this artifact.') }));

package/dist/renderers/registry.d.ts

@@ -8,7 +8,7 @@
  * rendering needs a host-injected postMessage bridge (see
  * `srcdoc/bridge.ts`), so a host registers its own `deck-html`
  * {@link ArtifactRenderer} into the registry instance it constructs instead
- * of this package shipping one. See `source-map.md`.
+ * of this package shipping one. See `archived provenance ledger`.
  */
 import type { ArtifactFile, ArtifactManifest } from './types.js';
 export interface ArtifactRendererContext {
@@ -27,7 +27,7 @@ export interface ArtifactRenderer {
      */
     supportsStreaming: boolean;
     renderPartial?: ((content: string) => string) | undefined;
-    canRender: (ctx: ArtifactRendererContext) => boolean;
+    canRender: (required: Pick<ArtifactRendererContext, "file">, optional?: Omit<ArtifactRendererContext, "file">) => boolean;
 }
 export interface ArtifactRenderMatch {
     renderer: ArtifactRenderer;
@@ -44,14 +44,20 @@ export interface ArtifactRenderMatch {
  * resolve a manifest for the file itself — see `@jini-ai/chat`'s
  * `inferLegacyManifest` — before handing the file to this registry.
  */
-export declare function resolveArtifactManifest(file: ArtifactFile): ArtifactManifest | null;
+export declare function resolveArtifactManifest({ file }: {
+    file: ArtifactFile;
+}): ArtifactManifest | null;
 export declare class RendererRegistry {
     private readonly renderers;
-    constructor(renderers: readonly ArtifactRenderer[]);
+    constructor({ renderers }: {
+        renderers: readonly ArtifactRenderer[];
+    });
     /** Renderers currently registered, in resolution order. */
     list(): readonly ArtifactRenderer[];
-    resolve(ctx: ArtifactRendererContext): ArtifactRenderMatch | null;
+    resolve({ file }: Pick<ArtifactRendererContext, "file">, { hints }?: Omit<ArtifactRendererContext, "file">): ArtifactRenderMatch | null;
     /** Returns a new registry with `renderer` appended (or replacing an existing renderer of the same id). */
-    register(renderer: ArtifactRenderer): RendererRegistry;
+    register({ renderer }: {
+        renderer: ArtifactRenderer;
+    }): RendererRegistry;
 }
 //# sourceMappingURL=registry.d.ts.map

package/dist/renderers/registry.js

@@ -9,31 +9,29 @@
  * resolve a manifest for the file itself — see `@jini-ai/chat`'s
  * `inferLegacyManifest` — before handing the file to this registry.
  */
-export function resolveArtifactManifest(file) {
+export function resolveArtifactManifest({ file }) {
     return file.manifest ?? null;
 }
 export class RendererRegistry {
     renderers;
-    constructor(renderers) {
-        this.renderers = renderers;
-    }
+    constructor({ renderers }) { this.renderers = renderers; }
     /** Renderers currently registered, in resolution order. */
     list() {
         return this.renderers;
     }
-    resolve(ctx) {
-        const manifest = resolveArtifactManifest(ctx.file);
+    resolve({ file }, { hints } = {}) {
+        const manifest = resolveArtifactManifest({ file });
         if (!manifest)
             return null;
-        const renderer = this.renderers.find((item) => item.canRender(ctx));
+        const renderer = this.renderers.find((item) => item.canRender({ file }, { hints }));
         if (!renderer)
             return null;
         return { renderer, manifest };
     }
     /** Returns a new registry with `renderer` appended (or replacing an existing renderer of the same id). */
-    register(renderer) {
+    register({ renderer }) {
         const withoutExisting = this.renderers.filter((item) => item.id !== renderer.id);
-        return new RendererRegistry([...withoutExisting, renderer]);
+        return new RendererRegistry({ renderers: [...withoutExisting, renderer] });
     }
 }
 //# sourceMappingURL=registry.js.map

package/dist/renderers/renderers/html.js

@@ -9,8 +9,8 @@ import { resolveArtifactManifest } from '../registry.js';
 export const HtmlRenderer = {
     id: 'html',
     supportsStreaming: false,
-    canRender: ({ file, hints }) => {
-        const manifest = resolveArtifactManifest(file);
+    canRender: ({ file }, { hints } = {}) => {
+        const manifest = resolveArtifactManifest({ file: file });
         if (!manifest)
             return false;
         if (manifest.kind === 'deck' || manifest.renderer === 'deck-html')

package/dist/renderers/renderers/index.js

@@ -13,6 +13,6 @@ export { ReactComponentRenderer } from './react-component.js';
  * deck rendering registers its own via `.register(...)`.
  */
 export function createDefaultRendererRegistry() {
-    return new RendererRegistry([HtmlRenderer, MarkdownRenderer, SvgRenderer, ReactComponentRenderer]);
+    return new RendererRegistry({ renderers: [HtmlRenderer, MarkdownRenderer, SvgRenderer, ReactComponentRenderer] });
 }
 //# sourceMappingURL=index.js.map