@elytracms/studio 0.0.63 → 0.0.65

package/convex/assets.ts

@@ -26,6 +26,17 @@ export const upsert = mutation({
     storageKey: v.string(),
     url: v.optional(v.string()),
     focalPoint: v.optional(v.object({ x: v.number(), y: v.number() })),
+    /** Downscaled editorial preview variant (EC-400) — a second stored blob. */
+    thumb: v.optional(
+      v.object({
+        storageKey: v.string(),
+        url: v.string(),
+        width: v.number(),
+        height: v.number(),
+      }),
+    ),
+    /** Delivery LQIP blur-placeholder data URI (EC-420) — rides the delivery wire. */
+    lqip: v.optional(v.string()),
     /** Schema-driven asset metadata bag (EC-301): alt, copyright, credit, …. */
     meta: v.optional(v.any()),
     createdAt: v.string(),

package/convex/delivery.ts

@@ -193,6 +193,11 @@ export async function loadSnapshot(
       // the delivery snapshot — both were omitted here, dropping a studio-set
       // hotspot/metadata on the LIVE path.
       ...(row.focalPoint !== undefined ? { focalPoint: row.focalPoint } : {}),
+      // EC-420 (AD-2): the LQIP blur placeholder is DELIVERY data, so it ships on
+      // the wire (the EC-368 image seam turns it into a next/image blurDataURL).
+      // The editorial `thumb` (EC-400) is deliberately NOT projected — it stays
+      // in the studio, per the EC-311 additive-metadata invariant.
+      ...(row.lqip !== undefined ? { lqip: row.lqip } : {}),
       ...(row.meta !== undefined ? { meta: row.meta } : {}),
       storageKey: row.storageKey,
       ...(url !== undefined ? { url } : {}),

package/convex/schema.ts

@@ -184,6 +184,29 @@ export default defineSchema({
     url: v.optional(v.string()),
     /** Normalized image focal point `{ x, y }` in 0–1 (EC-230); CSS object-position. */
     focalPoint: v.optional(v.object({ x: v.number(), y: v.number() })),
+    /**
+     * Downscaled editorial preview variant (EC-400) — a second stored blob's
+     * key/url + re-encoded dimensions. Studio grids/pickers/table cells serve
+     * this instead of the full original to cut Convex serve egress. Editorial-
+     * only: the delivery snapshot projects assets field-by-field and never ships
+     * `thumb` (EC-311 invariant). Optional; older rows simply have none.
+     */
+    thumb: v.optional(
+      v.object({
+        storageKey: v.string(),
+        url: v.string(),
+        width: v.number(),
+        height: v.number(),
+      }),
+    ),
+    /**
+     * Delivery LQIP blur-placeholder data URI (EC-420) — a tiny (≤24px) base64
+     * re-encode. UNLIKE `thumb`, this DOES ship on the delivery snapshot (AD-2):
+     * the `@elytracms/next` image seam feeds it to `next/image` as a blurDataURL.
+     * Capped at ~1 KB by the core record schema so it never bloats list queries.
+     * Optional; older rows simply have none.
+     */
+    lqip: v.optional(v.string()),
     /** Schema-driven asset metadata bag (EC-301): alt, copyright, credit, …. */
     meta: v.optional(v.any()),
     createdAt: v.string(),

package/dist/components/assets/asset-thumb.d.ts

@@ -5,8 +5,10 @@ export declare function useAssetRecord(assetId: string | null | undefined): Asse
 /**
  * A read-only image thumbnail honouring the asset's focal point (EC-248): the
  * preview crops with the same `object-position` delivery uses (EC-230), so the
- * editor sees exactly what a focal-point change does. Non-image / unresolvable
- * assets fall back to the labelled icon, matching the table cell's preview.
+ * editor sees exactly what a focal-point change does. Prefers the EC-400
+ * downscaled `thumb` variant (light egress) and falls back to the original.
+ * Non-image / unresolvable assets fall back to the labelled icon, matching the
+ * table cell's preview.
  */
 export declare function AssetThumb({ record, className, alt, }: {
     record: AssetRecord | undefined;

package/dist/components/assets/asset-thumb.js

@@ -22,15 +22,37 @@ function isResolvableImage(record) {
         typeof record.url === 'string' &&
         record.url.startsWith('http'));
 }
+const isHttp = (url) => typeof url === 'string' && url.startsWith('http');
+/**
+ * The best studio thumbnail src for an image record (EC-400): prefer the stored
+ * downscaled `thumb` variant when it is browser-resolvable, else fall back to the
+ * full original `url`. A missing/broken thumb therefore degrades to the original —
+ * never a broken tile (scope §4). Non-image / unresolvable records yield
+ * `undefined` (the icon placeholder). Focal-point editing + the canvas keep the
+ * original elsewhere (delivery fidelity) — this preference is thumbnail-only.
+ */
+function thumbnailSrc(record) {
+    if (!record || !record.contentType.startsWith('image/'))
+        return undefined;
+    const thumbUrl = record.thumb?.url;
+    if (isHttp(thumbUrl))
+        return thumbUrl;
+    if (isHttp(record.url))
+        return record.url;
+    return undefined;
+}
 /**
  * A read-only image thumbnail honouring the asset's focal point (EC-248): the
  * preview crops with the same `object-position` delivery uses (EC-230), so the
- * editor sees exactly what a focal-point change does. Non-image / unresolvable
- * assets fall back to the labelled icon, matching the table cell's preview.
+ * editor sees exactly what a focal-point change does. Prefers the EC-400
+ * downscaled `thumb` variant (light egress) and falls back to the original.
+ * Non-image / unresolvable assets fall back to the labelled icon, matching the
+ * table cell's preview.
  */
 export function AssetThumb({ record, className, alt, }) {
-    if (isResolvableImage(record)) {
-        return (_jsx("img", { src: record.url, alt: alt ?? record.alt ?? record.title ?? record.filename, loading: "lazy", style: { objectPosition: focalPointObjectPosition(record.focalPoint) }, className: cn('rounded border border-border bg-muted object-cover', className) }));
+    const src = thumbnailSrc(record);
+    if (record && src) {
+        return (_jsx("img", { src: src, alt: alt ?? record.alt ?? record.title ?? record.filename, loading: "lazy", style: { objectPosition: focalPointObjectPosition(record.focalPoint) }, className: cn('rounded border border-border bg-muted object-cover', className) }));
     }
     return (_jsx("div", { className: cn('flex items-center justify-center rounded border border-border bg-muted text-muted-foreground', className), children: _jsx(Image, { className: "size-4", "aria-hidden": true }) }));
 }

package/dist/components/assets/asset-thumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"asset-thumb.js","sourceRoot":"","sources":["../../../src/components/assets/asset-thumb.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, useRef, useState } from 'react'\nimport { Image } from 'lucide-react'\nimport type { AssetRecord } from '@elytracms/core/persistence'\nimport { Text } from '@elytracms/studio/ui'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { cn } from '@elytracms/studio/lib/utils'\nimport { useOptionalAssets } from './assets-store'\nimport {\n  CENTER_FOCAL_POINT,\n  focalPointFromPoint,\n  focalPointObjectPosition,\n} from './focal-point'\nimport type { FocalPoint } from './focal-point'\n\n/** Resolve an asset record by id from the ambient library, if one is mounted. */\nexport function useAssetRecord(assetId: string | null | undefined): AssetRecord | undefined {\n  const store = useOptionalAssets()\n  return useMemo(() => {\n    if (!assetId || !store || store.status !== 'ready') return undefined\n    return store.assets.find((a) => a.id === assetId)\n  }, [assetId, store])\n}\n\n/** True when the record is an image with a browser-resolvable URL (EC-212). */\nfunction isResolvableImage(record: AssetRecord | undefined): record is AssetRecord & { url: string } {\n  return (\n    record !== undefined &&\n    record.contentType.startsWith('image/') &&\n    typeof record.url === 'string' &&\n    record.url.startsWith('http')\n  )\n}\n\n/**\n * A read-only image thumbnail honouring the asset's focal point (EC-248): the\n * preview crops with the same `object-position` delivery uses (EC-230), so the\n * editor sees exactly what a focal-point change does. Non-image / unresolvable\n * assets fall back to the labelled icon, matching the table cell's preview.\n */\nexport function AssetThumb({\n  record,\n  className,\n  alt,\n}: {\n  record: AssetRecord | undefined\n  className?: string\n  alt?: string\n}) {\n  if (isResolvableImage(record)) {\n    return (\n      <img\n        src={record.url}\n        alt={alt ?? record.alt ?? record.title ?? record.filename}\n        loading=\"lazy\"\n        style={{ objectPosition: focalPointObjectPosition(record.focalPoint) }}\n        className={cn('rounded border border-border bg-muted object-cover', className)}\n      />\n    )\n  }\n  return (\n    <div\n      className={cn(\n        'flex items-center justify-center rounded border border-border bg-muted text-muted-foreground',\n        className,\n      )}\n    >\n      <Image className=\"size-4\" aria-hidden />\n    </div>\n  )\n}\n\n/**\n * The focal-point picker (EC-248/EC-301): click or **drag** anywhere on the image\n * to place the normalized 0–1 hotspot delivery threads to `object-position`\n * (EC-230). The marker follows the pointer live while dragging and only commits on\n * release (`onPreview` updates the marker, `onChange` commits). `onChange(null)`\n * resets to centre. Shows a placeholder until the image loads; renders a muted note\n * when the asset has no resolvable image.\n */\nexport function FocalPointPicker({\n  record,\n  point,\n  onChange,\n  onPreview,\n  disabled,\n}: {\n  record: AssetRecord | undefined\n  point: FocalPoint | undefined\n  onChange: (point: FocalPoint | null) => void\n  /** Called continuously while dragging to move the marker without committing. */\n  onPreview?: (point: FocalPoint) => void\n  disabled?: boolean\n}) {\n  const marker = point ?? CENTER_FOCAL_POINT\n  const dragging = useRef(false)\n  const [loaded, setLoaded] = useState(false)\n\n  if (!isResolvableImage(record)) {\n    return (\n      <Text size=\"xs\" tone=\"subtle\">\n        {translate('assets.focalPoint.noPreview')}\n      </Text>\n    )\n  }\n\n  const pointFrom = (e: React.PointerEvent<HTMLElement>): FocalPoint =>\n    focalPointFromPoint(e.currentTarget.getBoundingClientRect(), e.clientX, e.clientY)\n\n  function onPointerDown(e: React.PointerEvent<HTMLButtonElement>) {\n    if (disabled) return\n    dragging.current = true\n    e.currentTarget.setPointerCapture(e.pointerId)\n    ;(onPreview ?? onChange)(pointFrom(e))\n  }\n  function onPointerMove(e: React.PointerEvent<HTMLButtonElement>) {\n    if (disabled || !dragging.current) return\n    ;(onPreview ?? onChange)(pointFrom(e))\n  }\n  function onPointerUp(e: React.PointerEvent<HTMLButtonElement>) {\n    if (disabled || !dragging.current) return\n    dragging.current = false\n    e.currentTarget.releasePointerCapture(e.pointerId)\n    onChange(pointFrom(e)) // commit on release only\n  }\n\n  return (\n    <button\n      type=\"button\"\n      aria-label={translate('assets.focalPoint.setLabel')}\n      disabled={disabled}\n      onPointerDown={onPointerDown}\n      onPointerMove={onPointerMove}\n      onPointerUp={onPointerUp}\n      className={cn(\n        'relative block w-full touch-none select-none overflow-hidden rounded border border-border bg-muted',\n        'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40',\n        disabled ? 'cursor-default opacity-60' : 'cursor-crosshair',\n      )}\n    >\n      {/* Width-constrained, natural aspect (no object-fit), so the button wraps\n          the image tightly and the bounding rect equals the image box — the\n          normalized pointer coordinates are then exact, with no letterbox offset. */}\n      <img\n        src={record.url}\n        alt={record.alt ?? record.filename}\n        draggable={false}\n        onLoad={() => setLoaded(true)}\n        className={cn('block h-auto w-full select-none transition-opacity', loaded ? 'opacity-100' : 'opacity-0')}\n      />\n      {!loaded ? (\n        <span className=\"absolute inset-0 grid aspect-video place-items-center bg-muted\">\n          <Image className=\"size-6 animate-pulse text-muted-foreground\" aria-hidden />\n        </span>\n      ) : (\n        <span\n          aria-hidden\n          className=\"pointer-events-none absolute size-4 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-white shadow-[0_0_0_1.5px_rgba(0,0,0,0.55)] ring-1 ring-black/40\"\n          style={{ left: `${marker.x * 100}%`, top: `${marker.y * 100}%` }}\n        />\n      )}\n    </button>\n  )\n}\n\n/** Common crop aspect ratios shown as focal-aware previews (EC-301). */\nconst FOCAL_CROP_RATIOS = [\n  { label: '9:16', className: 'aspect-[9/16]' },\n  { label: '3:4', className: 'aspect-[3/4]' },\n  { label: '1:1', className: 'aspect-square' },\n  { label: '4:3', className: 'aspect-[4/3]' },\n  { label: '16:9', className: 'aspect-video' },\n] as const\n\n/**\n * A row of common-ratio crop previews (EC-301), each cropping the image with the\n * same `object-position` delivery uses — so the editor sees how the focal point\n * holds the subject across portrait/square/landscape crops. Updates live as the\n * point is dragged.\n */\nexport function FocalCropPreviews({\n  record,\n  point,\n}: {\n  record: AssetRecord | undefined\n  point: FocalPoint | undefined\n}) {\n  if (!isResolvableImage(record)) return null\n  const objectPosition = focalPointObjectPosition(point)\n  return (\n    <div className=\"flex items-end gap-2\">\n      {FOCAL_CROP_RATIOS.map((ratio) => (\n        <div key={ratio.label} className=\"flex min-w-0 flex-col items-center gap-1\">\n          <div className={cn('h-14 overflow-hidden rounded border border-border bg-muted', ratio.className)}>\n            <img\n              src={record.url}\n              alt=\"\"\n              draggable={false}\n              style={{ objectPosition }}\n              className=\"h-full w-full object-cover\"\n            />\n          </div>\n          <Text size=\"xs\" tone=\"subtle\">\n            {ratio.label}\n          </Text>\n        </div>\n      ))}\n    </div>\n  )\n}\n"]}
+{"version":3,"file":"asset-thumb.js","sourceRoot":"","sources":["../../../src/components/assets/asset-thumb.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, useRef, useState } from 'react'\nimport { Image } from 'lucide-react'\nimport type { AssetRecord } from '@elytracms/core/persistence'\nimport { Text } from '@elytracms/studio/ui'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { cn } from '@elytracms/studio/lib/utils'\nimport { useOptionalAssets } from './assets-store'\nimport {\n  CENTER_FOCAL_POINT,\n  focalPointFromPoint,\n  focalPointObjectPosition,\n} from './focal-point'\nimport type { FocalPoint } from './focal-point'\n\n/** Resolve an asset record by id from the ambient library, if one is mounted. */\nexport function useAssetRecord(assetId: string | null | undefined): AssetRecord | undefined {\n  const store = useOptionalAssets()\n  return useMemo(() => {\n    if (!assetId || !store || store.status !== 'ready') return undefined\n    return store.assets.find((a) => a.id === assetId)\n  }, [assetId, store])\n}\n\n/** True when the record is an image with a browser-resolvable URL (EC-212). */\nfunction isResolvableImage(record: AssetRecord | undefined): record is AssetRecord & { url: string } {\n  return (\n    record !== undefined &&\n    record.contentType.startsWith('image/') &&\n    typeof record.url === 'string' &&\n    record.url.startsWith('http')\n  )\n}\n\nconst isHttp = (url: string | undefined): url is string =>\n  typeof url === 'string' && url.startsWith('http')\n\n/**\n * The best studio thumbnail src for an image record (EC-400): prefer the stored\n * downscaled `thumb` variant when it is browser-resolvable, else fall back to the\n * full original `url`. A missing/broken thumb therefore degrades to the original —\n * never a broken tile (scope §4). Non-image / unresolvable records yield\n * `undefined` (the icon placeholder). Focal-point editing + the canvas keep the\n * original elsewhere (delivery fidelity) — this preference is thumbnail-only.\n */\nfunction thumbnailSrc(record: AssetRecord | undefined): string | undefined {\n  if (!record || !record.contentType.startsWith('image/')) return undefined\n  const thumbUrl = record.thumb?.url\n  if (isHttp(thumbUrl)) return thumbUrl\n  if (isHttp(record.url)) return record.url\n  return undefined\n}\n\n/**\n * A read-only image thumbnail honouring the asset's focal point (EC-248): the\n * preview crops with the same `object-position` delivery uses (EC-230), so the\n * editor sees exactly what a focal-point change does. Prefers the EC-400\n * downscaled `thumb` variant (light egress) and falls back to the original.\n * Non-image / unresolvable assets fall back to the labelled icon, matching the\n * table cell's preview.\n */\nexport function AssetThumb({\n  record,\n  className,\n  alt,\n}: {\n  record: AssetRecord | undefined\n  className?: string\n  alt?: string\n}) {\n  const src = thumbnailSrc(record)\n  if (record && src) {\n    return (\n      <img\n        src={src}\n        alt={alt ?? record.alt ?? record.title ?? record.filename}\n        loading=\"lazy\"\n        style={{ objectPosition: focalPointObjectPosition(record.focalPoint) }}\n        className={cn('rounded border border-border bg-muted object-cover', className)}\n      />\n    )\n  }\n  return (\n    <div\n      className={cn(\n        'flex items-center justify-center rounded border border-border bg-muted text-muted-foreground',\n        className,\n      )}\n    >\n      <Image className=\"size-4\" aria-hidden />\n    </div>\n  )\n}\n\n/**\n * The focal-point picker (EC-248/EC-301): click or **drag** anywhere on the image\n * to place the normalized 0–1 hotspot delivery threads to `object-position`\n * (EC-230). The marker follows the pointer live while dragging and only commits on\n * release (`onPreview` updates the marker, `onChange` commits). `onChange(null)`\n * resets to centre. Shows a placeholder until the image loads; renders a muted note\n * when the asset has no resolvable image.\n */\nexport function FocalPointPicker({\n  record,\n  point,\n  onChange,\n  onPreview,\n  disabled,\n}: {\n  record: AssetRecord | undefined\n  point: FocalPoint | undefined\n  onChange: (point: FocalPoint | null) => void\n  /** Called continuously while dragging to move the marker without committing. */\n  onPreview?: (point: FocalPoint) => void\n  disabled?: boolean\n}) {\n  const marker = point ?? CENTER_FOCAL_POINT\n  const dragging = useRef(false)\n  const [loaded, setLoaded] = useState(false)\n\n  if (!isResolvableImage(record)) {\n    return (\n      <Text size=\"xs\" tone=\"subtle\">\n        {translate('assets.focalPoint.noPreview')}\n      </Text>\n    )\n  }\n\n  const pointFrom = (e: React.PointerEvent<HTMLElement>): FocalPoint =>\n    focalPointFromPoint(e.currentTarget.getBoundingClientRect(), e.clientX, e.clientY)\n\n  function onPointerDown(e: React.PointerEvent<HTMLButtonElement>) {\n    if (disabled) return\n    dragging.current = true\n    e.currentTarget.setPointerCapture(e.pointerId)\n    ;(onPreview ?? onChange)(pointFrom(e))\n  }\n  function onPointerMove(e: React.PointerEvent<HTMLButtonElement>) {\n    if (disabled || !dragging.current) return\n    ;(onPreview ?? onChange)(pointFrom(e))\n  }\n  function onPointerUp(e: React.PointerEvent<HTMLButtonElement>) {\n    if (disabled || !dragging.current) return\n    dragging.current = false\n    e.currentTarget.releasePointerCapture(e.pointerId)\n    onChange(pointFrom(e)) // commit on release only\n  }\n\n  return (\n    <button\n      type=\"button\"\n      aria-label={translate('assets.focalPoint.setLabel')}\n      disabled={disabled}\n      onPointerDown={onPointerDown}\n      onPointerMove={onPointerMove}\n      onPointerUp={onPointerUp}\n      className={cn(\n        'relative block w-full touch-none select-none overflow-hidden rounded border border-border bg-muted',\n        'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40',\n        disabled ? 'cursor-default opacity-60' : 'cursor-crosshair',\n      )}\n    >\n      {/* Width-constrained, natural aspect (no object-fit), so the button wraps\n          the image tightly and the bounding rect equals the image box — the\n          normalized pointer coordinates are then exact, with no letterbox offset. */}\n      <img\n        src={record.url}\n        alt={record.alt ?? record.filename}\n        draggable={false}\n        onLoad={() => setLoaded(true)}\n        className={cn('block h-auto w-full select-none transition-opacity', loaded ? 'opacity-100' : 'opacity-0')}\n      />\n      {!loaded ? (\n        <span className=\"absolute inset-0 grid aspect-video place-items-center bg-muted\">\n          <Image className=\"size-6 animate-pulse text-muted-foreground\" aria-hidden />\n        </span>\n      ) : (\n        <span\n          aria-hidden\n          className=\"pointer-events-none absolute size-4 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-white shadow-[0_0_0_1.5px_rgba(0,0,0,0.55)] ring-1 ring-black/40\"\n          style={{ left: `${marker.x * 100}%`, top: `${marker.y * 100}%` }}\n        />\n      )}\n    </button>\n  )\n}\n\n/** Common crop aspect ratios shown as focal-aware previews (EC-301). */\nconst FOCAL_CROP_RATIOS = [\n  { label: '9:16', className: 'aspect-[9/16]' },\n  { label: '3:4', className: 'aspect-[3/4]' },\n  { label: '1:1', className: 'aspect-square' },\n  { label: '4:3', className: 'aspect-[4/3]' },\n  { label: '16:9', className: 'aspect-video' },\n] as const\n\n/**\n * A row of common-ratio crop previews (EC-301), each cropping the image with the\n * same `object-position` delivery uses — so the editor sees how the focal point\n * holds the subject across portrait/square/landscape crops. Updates live as the\n * point is dragged.\n */\nexport function FocalCropPreviews({\n  record,\n  point,\n}: {\n  record: AssetRecord | undefined\n  point: FocalPoint | undefined\n}) {\n  if (!isResolvableImage(record)) return null\n  const objectPosition = focalPointObjectPosition(point)\n  return (\n    <div className=\"flex items-end gap-2\">\n      {FOCAL_CROP_RATIOS.map((ratio) => (\n        <div key={ratio.label} className=\"flex min-w-0 flex-col items-center gap-1\">\n          <div className={cn('h-14 overflow-hidden rounded border border-border bg-muted', ratio.className)}>\n            <img\n              src={record.url}\n              alt=\"\"\n              draggable={false}\n              style={{ objectPosition }}\n              className=\"h-full w-full object-cover\"\n            />\n          </div>\n          <Text size=\"xs\" tone=\"subtle\">\n            {ratio.label}\n          </Text>\n        </div>\n      ))}\n    </div>\n  )\n}\n"]}

package/dist/components/assets/assets-module.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useRef, useState } from 'react';
-import { LayoutGrid, List, RotateCcw, Upload, X } from 'lucide-react';
+import { ImageDown, LayoutGrid, List, Loader2, RotateCcw, Upload, X } from 'lucide-react';
 import { Badge, Button, Panel, PanelBody, PanelHeader, Row, SegmentedControl, Stack, Text, } from '@elytracms/studio/ui';
 import { translate } from '@elytracms/studio/lib/i18n';
 import { useAssets } from './assets-store.js';
@@ -53,7 +53,7 @@ function AssetsListSurface({ projectId }) {
         if (event.dataTransfer.files.length > 0)
             store.upload([...event.dataTransfer.files]);
     }
-    const toolbarExtra = (_jsxs(Row, { gap: "2", align: "center", children: [_jsx("input", { ref: fileInputRef, type: "file", multiple: true, className: "hidden", onChange: onPick, "data-testid": "asset-file-input" }), _jsxs(Button, { size: "sm", variant: "outline", onClick: () => fileInputRef.current?.click(), "data-testid": "asset-upload", children: [_jsx(Upload, {}), " ", translate('common.upload')] }), _jsx(AssetsViewToggle, { mode: mode, onChange: setModeAndPersist })] }));
+    const toolbarExtra = (_jsxs(Row, { gap: "2", align: "center", children: [_jsx("input", { ref: fileInputRef, type: "file", multiple: true, className: "hidden", onChange: onPick, "data-testid": "asset-file-input" }), _jsx(GeneratePreviewsButton, {}), _jsxs(Button, { size: "sm", variant: "outline", onClick: () => fileInputRef.current?.click(), "data-testid": "asset-upload", children: [_jsx(Upload, {}), " ", translate('common.upload')] }), _jsx(AssetsViewToggle, { mode: mode, onChange: setModeAndPersist })] }));
     return (_jsxs("div", { className: "relative flex h-full min-h-0 flex-col", onDragOver: (event) => {
             event.preventDefault();
             setDragging(true);
@@ -80,6 +80,52 @@ function AssetsViewToggle({ mode, onChange, }) {
             },
         ] }));
 }
+/**
+ * The EC-400 "Generate previews" maintenance action (AD-1): backfills downscaled
+ * thumbnails onto existing images so their grid/picker cells stop streaming the
+ * full original. Idempotent (skips assets that already have a thumb or don't need
+ * one), sequential with a live count, and cancellable. The work runs through the
+ * assets store → operations facade → shared cache; this component only drives it.
+ */
+function GeneratePreviewsButton() {
+    const store = useAssets();
+    const [progress, setProgress] = useState(null);
+    const [running, setRunning] = useState(false);
+    const [summary, setSummary] = useState(null);
+    const signalRef = useRef(null);
+    async function onClick() {
+        if (running)
+            return;
+        setSummary(null);
+        const signal = { cancelled: false };
+        signalRef.current = signal;
+        setRunning(true);
+        setProgress({ total: 0, done: 0, generated: 0, skipped: 0, failed: 0 });
+        try {
+            const result = await store.generatePreviews({ onProgress: setProgress, signal });
+            setSummary(result.cancelled
+                ? translate('assets.generatePreviews.cancelled', { count: result.generated })
+                : result.generated > 0
+                    ? translate('assets.generatePreviews.done', { count: result.generated })
+                    : translate('assets.generatePreviews.none'));
+        }
+        finally {
+            setRunning(false);
+            setProgress(null);
+            signalRef.current = null;
+        }
+    }
+    if (running) {
+        return (_jsxs(Row, { gap: "2", align: "center", "data-testid": "generate-previews-running", children: [_jsx(Text, { size: "xs", tone: "muted", className: "whitespace-nowrap", children: translate('assets.generatePreviews.running', {
+                        done: progress?.done ?? 0,
+                        total: progress?.total ?? 0,
+                    }) }), _jsx(Button, { size: "sm", variant: "ghost", onClick: () => {
+                        if (signalRef.current)
+                            signalRef.current.cancelled = true;
+                    }, "data-testid": "generate-previews-cancel", children: translate('common.cancel') })] }));
+    }
+    return (_jsxs(Row, { gap: "2", align: "center", children: [summary ? (_jsx(Text, { size: "xs", tone: "subtle", className: "whitespace-nowrap", "data-testid": "generate-previews-summary", children: summary })) : null, _jsxs(Button, { size: "sm", variant: "outline", onClick: onClick, title: translate('assets.generatePreviews.hint'), "data-testid": "generate-previews", children: [running ? _jsx(Loader2, { className: "animate-spin" }) : _jsx(ImageDown, {}), ' ', translate('assets.generatePreviews.button')] })] }));
+}
 /** Upload phase → the `assets.upload.phase.*` catalog key suffix (idle → queued). */
 const PHASE_KEY = {
     idle: 'queued',

package/dist/components/assets/assets-module.js.map

@@ -1 +1 @@
-{"version":3,"file":"assets-module.js","sourceRoot":"","sources":["../../../src/components/assets/assets-module.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, useState } from 'react'\nimport type { ChangeEvent, DragEvent } from 'react'\nimport { LayoutGrid, List, RotateCcw, Upload, X } from 'lucide-react'\nimport type { CollectionDef } from '@elytracms/core/cms-core'\nimport {\n  Badge,\n  Button,\n  Panel,\n  PanelBody,\n  PanelHeader,\n  Row,\n  SegmentedControl,\n  Stack,\n  Text,\n} from '@elytracms/studio/ui'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport type { UploadState } from '@elytracms/studio/lib/assets'\nimport { useAssets } from './assets-store'\nimport type { UploadEntry } from './assets-store'\nimport { useAssetsCollectionViewSource } from './assets-collection-view-source'\nimport { CollectionViewProvider } from '../collection-view/collection-view-context'\nimport { RailStoreStatus } from '../rail-store-status'\nimport { LoadedCollectionTable } from '../cms/collection-table'\nimport { AssetGridView } from './asset-grid'\nimport { AssetDetail } from './asset-detail'\nimport {\n  type AssetsViewMode,\n  readAssetsViewMode,\n  storeAssetsViewMode,\n} from './assets-view-preference'\n\n/**\n * The studio Assets module (EC-319). The reuse proof (alongside users/redirects)\n * that the portable list surface serves a rail with an entirely different\n * backend (the asset library store, not `cmsDocuments`): `assetId === null` is\n * the universal list — list mode is `LoadedCollectionTable`, grid mode is\n * `AssetGridView`, a **transient personal** toggle (EC-317-style, localStorage) —\n * over the SAME {@link useAssetsCollectionViewSource}; `assetId` set opens the\n * bespoke asset detail surface (`asset-detail.tsx`).\n *\n * Must be mounted where an `<AssetsProvider>` is ambient — already true at the\n * project level (EC-195), so this never mounts its own.\n */\nexport function AssetsModule({\n  projectId,\n  assetId = null,\n  schema,\n}: {\n  projectId: string\n  assetId?: string | null\n  schema: CollectionDef\n}) {\n  const store = useAssets()\n  const source = useAssetsCollectionViewSource(projectId, schema)\n\n  if (store.status !== 'ready') {\n    return (\n      <RailStoreStatus\n        store={store}\n        errorLabel={translate('assets.error.loadFailed')}\n        loadingLabel={translate('assets.loading')}\n        errorTestId=\"assets-error\"\n      />\n    )\n  }\n\n  return (\n    <CollectionViewProvider source={source}>\n      {assetId !== null ? (\n        <AssetDetail key={assetId} projectId={projectId} assetId={assetId} />\n      ) : (\n        <AssetsListSurface projectId={projectId} />\n      )}\n    </CollectionViewProvider>\n  )\n}\n\n/** The list surface: upload + the grid/list toggle in a shared toolbar, over\n *  either the universal table or the thumbnail grid — same source, same rows. */\nfunction AssetsListSurface({ projectId }: { projectId: string }) {\n  const store = useAssets()\n  const [mode, setMode] = useState<AssetsViewMode>(() => readAssetsViewMode())\n  const [dragging, setDragging] = useState(false)\n  const fileInputRef = useRef<HTMLInputElement | null>(null)\n\n  function setModeAndPersist(next: AssetsViewMode) {\n    setMode(next)\n    storeAssetsViewMode(next)\n  }\n\n  function onPick(event: ChangeEvent<HTMLInputElement>) {\n    if (event.target.files) store.upload([...event.target.files])\n    event.target.value = ''\n  }\n\n  function onDrop(event: DragEvent) {\n    event.preventDefault()\n    setDragging(false)\n    if (event.dataTransfer.files.length > 0) store.upload([...event.dataTransfer.files])\n  }\n\n  const toolbarExtra = (\n    <Row gap=\"2\" align=\"center\">\n      <input\n        ref={fileInputRef}\n        type=\"file\"\n        multiple\n        className=\"hidden\"\n        onChange={onPick}\n        data-testid=\"asset-file-input\"\n      />\n      <Button size=\"sm\" variant=\"outline\" onClick={() => fileInputRef.current?.click()} data-testid=\"asset-upload\">\n        <Upload /> {translate('common.upload')}\n      </Button>\n      <AssetsViewToggle mode={mode} onChange={setModeAndPersist} />\n    </Row>\n  )\n\n  return (\n    <div\n      className=\"relative flex h-full min-h-0 flex-col\"\n      onDragOver={(event) => {\n        event.preventDefault()\n        setDragging(true)\n      }}\n      onDragLeave={() => setDragging(false)}\n      onDrop={onDrop}\n    >\n      {store.uploads.length > 0 ? <UploadQueue /> : null}\n\n      {mode === 'grid' ? (\n        <AssetGridView projectId={projectId} toolbarExtra={toolbarExtra} />\n      ) : (\n        <LoadedCollectionTable projectId={projectId} toolbarExtra={toolbarExtra} />\n      )}\n\n      {dragging ? (\n        <div\n          className=\"pointer-events-none absolute inset-0 z-10 grid place-items-center rounded-xl border-2 border-dashed border-primary bg-background/85\"\n          data-testid=\"asset-drop-overlay\"\n        >\n          <Row gap=\"2\" align=\"center\">\n            <Upload className=\"size-5 text-primary\" />\n            <Text className=\"font-medium\">{translate('cms.asset.dropToUpload')}</Text>\n          </Row>\n        </div>\n      ) : null}\n    </div>\n  )\n}\n\n/** The grid/list toggle (EC-319, EC-317-style transient view pref). */\nfunction AssetsViewToggle({\n  mode,\n  onChange,\n}: {\n  mode: AssetsViewMode\n  onChange: (mode: AssetsViewMode) => void\n}) {\n  return (\n    <SegmentedControl\n      ariaLabel={translate('assets.viewToggle.groupLabel')}\n      items={[\n        {\n          key: 'list',\n          label: <List className=\"size-3.5\" />,\n          active: mode === 'list',\n          onClick: () => onChange('list'),\n          ariaLabel: translate('assets.viewToggle.list'),\n          testId: 'assets-view-list',\n        },\n        {\n          key: 'grid',\n          label: <LayoutGrid className=\"size-3.5\" />,\n          active: mode === 'grid',\n          onClick: () => onChange('grid'),\n          ariaLabel: translate('assets.viewToggle.grid'),\n          testId: 'assets-view-grid',\n        },\n      ]}\n    />\n  )\n}\n\n/** Upload phase → the `assets.upload.phase.*` catalog key suffix (idle → queued). */\nconst PHASE_KEY: Record<UploadState['phase'], string> = {\n  idle: 'queued',\n  preparing: 'preparing',\n  uploading: 'uploading',\n  confirming: 'confirming',\n  done: 'done',\n  failed: 'failed',\n}\n\n/** The in-flight upload panel: progress while transferring, explicit failure + retry. */\nfunction UploadQueue() {\n  const store = useAssets()\n  return (\n    <Panel className=\"m-4 mb-0 sm:mx-6\" data-testid=\"upload-queue\">\n      <PanelHeader>\n        <Text size=\"xs\" weight=\"semibold\" tone=\"muted\">\n          {translate('assets.uploads.heading')}\n        </Text>\n      </PanelHeader>\n      <PanelBody className=\"divide-y divide-border p-0\">\n        {store.uploads.map((entry) => (\n          <UploadRow\n            key={entry.id}\n            entry={entry}\n            onRetry={() => store.retryUpload(entry.id)}\n            onDismiss={() => store.dismissUpload(entry.id)}\n          />\n        ))}\n      </PanelBody>\n    </Panel>\n  )\n}\n\nfunction UploadRow({\n  entry,\n  onRetry,\n  onDismiss,\n}: {\n  entry: UploadEntry\n  onRetry: () => void\n  onDismiss: () => void\n}) {\n  const { state } = entry\n  const failed = state.phase === 'failed'\n  return (\n    <Stack gap=\"1\" className=\"px-3 py-2\" data-testid=\"upload-row\">\n      <Row gap=\"2\">\n        <Text size=\"sm\" weight=\"medium\" className=\"min-w-0 flex-1 truncate\">\n          {entry.filename}\n        </Text>\n        <Badge variant={failed ? 'error' : state.phase === 'done' ? 'success' : 'info'}>\n          {translate('assets.upload.phase.' + PHASE_KEY[state.phase])}\n          {state.attempt > 1\n            ? ' · ' + translate('assets.upload.attempt', { count: state.attempt })\n            : ''}\n        </Badge>\n        {failed ? (\n          <>\n            {state.failure?.retryable !== false ? (\n              <Button variant=\"outline\" size=\"sm\" onClick={onRetry} data-testid=\"upload-retry\">\n                <RotateCcw /> Retry\n              </Button>\n            ) : null}\n            <Button\n              variant=\"ghost\"\n              size=\"icon-sm\"\n              onClick={onDismiss}\n              aria-label={translate('assets.upload.dismissLabel')}\n            >\n              <X />\n            </Button>\n          </>\n        ) : null}\n      </Row>\n      {failed ? (\n        <Text size=\"xs\" tone=\"muted\" data-testid=\"upload-error\">\n          {state.failure?.stage}: {state.failure?.message}\n        </Text>\n      ) : (\n        <ProgressBar value={state.progress} />\n      )}\n    </Stack>\n  )\n}\n\nfunction ProgressBar({ value }: { value: number }) {\n  return (\n    <span className=\"block h-1.5 w-full overflow-hidden rounded-full bg-muted\">\n      <span\n        className=\"block h-full rounded-full bg-primary transition-[width]\"\n        style={{ width: `${Math.round(value * 100)}%` }}\n      />\n    </span>\n  )\n}\n"]}
+{"version":3,"file":"assets-module.js","sourceRoot":"","sources":["../../../src/components/assets/assets-module.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, useState } from 'react'\nimport type { ChangeEvent, DragEvent } from 'react'\nimport { ImageDown, LayoutGrid, List, Loader2, RotateCcw, Upload, X } from 'lucide-react'\nimport type { CollectionDef } from '@elytracms/core/cms-core'\nimport {\n  Badge,\n  Button,\n  Panel,\n  PanelBody,\n  PanelHeader,\n  Row,\n  SegmentedControl,\n  Stack,\n  Text,\n} from '@elytracms/studio/ui'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport type { BackfillProgress, BackfillSignal, UploadState } from '@elytracms/studio/lib/assets'\nimport { useAssets } from './assets-store'\nimport type { UploadEntry } from './assets-store'\nimport { useAssetsCollectionViewSource } from './assets-collection-view-source'\nimport { CollectionViewProvider } from '../collection-view/collection-view-context'\nimport { RailStoreStatus } from '../rail-store-status'\nimport { LoadedCollectionTable } from '../cms/collection-table'\nimport { AssetGridView } from './asset-grid'\nimport { AssetDetail } from './asset-detail'\nimport {\n  type AssetsViewMode,\n  readAssetsViewMode,\n  storeAssetsViewMode,\n} from './assets-view-preference'\n\n/**\n * The studio Assets module (EC-319). The reuse proof (alongside users/redirects)\n * that the portable list surface serves a rail with an entirely different\n * backend (the asset library store, not `cmsDocuments`): `assetId === null` is\n * the universal list — list mode is `LoadedCollectionTable`, grid mode is\n * `AssetGridView`, a **transient personal** toggle (EC-317-style, localStorage) —\n * over the SAME {@link useAssetsCollectionViewSource}; `assetId` set opens the\n * bespoke asset detail surface (`asset-detail.tsx`).\n *\n * Must be mounted where an `<AssetsProvider>` is ambient — already true at the\n * project level (EC-195), so this never mounts its own.\n */\nexport function AssetsModule({\n  projectId,\n  assetId = null,\n  schema,\n}: {\n  projectId: string\n  assetId?: string | null\n  schema: CollectionDef\n}) {\n  const store = useAssets()\n  const source = useAssetsCollectionViewSource(projectId, schema)\n\n  if (store.status !== 'ready') {\n    return (\n      <RailStoreStatus\n        store={store}\n        errorLabel={translate('assets.error.loadFailed')}\n        loadingLabel={translate('assets.loading')}\n        errorTestId=\"assets-error\"\n      />\n    )\n  }\n\n  return (\n    <CollectionViewProvider source={source}>\n      {assetId !== null ? (\n        <AssetDetail key={assetId} projectId={projectId} assetId={assetId} />\n      ) : (\n        <AssetsListSurface projectId={projectId} />\n      )}\n    </CollectionViewProvider>\n  )\n}\n\n/** The list surface: upload + the grid/list toggle in a shared toolbar, over\n *  either the universal table or the thumbnail grid — same source, same rows. */\nfunction AssetsListSurface({ projectId }: { projectId: string }) {\n  const store = useAssets()\n  const [mode, setMode] = useState<AssetsViewMode>(() => readAssetsViewMode())\n  const [dragging, setDragging] = useState(false)\n  const fileInputRef = useRef<HTMLInputElement | null>(null)\n\n  function setModeAndPersist(next: AssetsViewMode) {\n    setMode(next)\n    storeAssetsViewMode(next)\n  }\n\n  function onPick(event: ChangeEvent<HTMLInputElement>) {\n    if (event.target.files) store.upload([...event.target.files])\n    event.target.value = ''\n  }\n\n  function onDrop(event: DragEvent) {\n    event.preventDefault()\n    setDragging(false)\n    if (event.dataTransfer.files.length > 0) store.upload([...event.dataTransfer.files])\n  }\n\n  const toolbarExtra = (\n    <Row gap=\"2\" align=\"center\">\n      <input\n        ref={fileInputRef}\n        type=\"file\"\n        multiple\n        className=\"hidden\"\n        onChange={onPick}\n        data-testid=\"asset-file-input\"\n      />\n      <GeneratePreviewsButton />\n      <Button size=\"sm\" variant=\"outline\" onClick={() => fileInputRef.current?.click()} data-testid=\"asset-upload\">\n        <Upload /> {translate('common.upload')}\n      </Button>\n      <AssetsViewToggle mode={mode} onChange={setModeAndPersist} />\n    </Row>\n  )\n\n  return (\n    <div\n      className=\"relative flex h-full min-h-0 flex-col\"\n      onDragOver={(event) => {\n        event.preventDefault()\n        setDragging(true)\n      }}\n      onDragLeave={() => setDragging(false)}\n      onDrop={onDrop}\n    >\n      {store.uploads.length > 0 ? <UploadQueue /> : null}\n\n      {mode === 'grid' ? (\n        <AssetGridView projectId={projectId} toolbarExtra={toolbarExtra} />\n      ) : (\n        <LoadedCollectionTable projectId={projectId} toolbarExtra={toolbarExtra} />\n      )}\n\n      {dragging ? (\n        <div\n          className=\"pointer-events-none absolute inset-0 z-10 grid place-items-center rounded-xl border-2 border-dashed border-primary bg-background/85\"\n          data-testid=\"asset-drop-overlay\"\n        >\n          <Row gap=\"2\" align=\"center\">\n            <Upload className=\"size-5 text-primary\" />\n            <Text className=\"font-medium\">{translate('cms.asset.dropToUpload')}</Text>\n          </Row>\n        </div>\n      ) : null}\n    </div>\n  )\n}\n\n/** The grid/list toggle (EC-319, EC-317-style transient view pref). */\nfunction AssetsViewToggle({\n  mode,\n  onChange,\n}: {\n  mode: AssetsViewMode\n  onChange: (mode: AssetsViewMode) => void\n}) {\n  return (\n    <SegmentedControl\n      ariaLabel={translate('assets.viewToggle.groupLabel')}\n      items={[\n        {\n          key: 'list',\n          label: <List className=\"size-3.5\" />,\n          active: mode === 'list',\n          onClick: () => onChange('list'),\n          ariaLabel: translate('assets.viewToggle.list'),\n          testId: 'assets-view-list',\n        },\n        {\n          key: 'grid',\n          label: <LayoutGrid className=\"size-3.5\" />,\n          active: mode === 'grid',\n          onClick: () => onChange('grid'),\n          ariaLabel: translate('assets.viewToggle.grid'),\n          testId: 'assets-view-grid',\n        },\n      ]}\n    />\n  )\n}\n\n/**\n * The EC-400 \"Generate previews\" maintenance action (AD-1): backfills downscaled\n * thumbnails onto existing images so their grid/picker cells stop streaming the\n * full original. Idempotent (skips assets that already have a thumb or don't need\n * one), sequential with a live count, and cancellable. The work runs through the\n * assets store → operations facade → shared cache; this component only drives it.\n */\nfunction GeneratePreviewsButton() {\n  const store = useAssets()\n  const [progress, setProgress] = useState<BackfillProgress | null>(null)\n  const [running, setRunning] = useState(false)\n  const [summary, setSummary] = useState<string | null>(null)\n  const signalRef = useRef<BackfillSignal | null>(null)\n\n  async function onClick() {\n    if (running) return\n    setSummary(null)\n    const signal: BackfillSignal = { cancelled: false }\n    signalRef.current = signal\n    setRunning(true)\n    setProgress({ total: 0, done: 0, generated: 0, skipped: 0, failed: 0 })\n    try {\n      const result = await store.generatePreviews({ onProgress: setProgress, signal })\n      setSummary(\n        result.cancelled\n          ? translate('assets.generatePreviews.cancelled', { count: result.generated })\n          : result.generated > 0\n            ? translate('assets.generatePreviews.done', { count: result.generated })\n            : translate('assets.generatePreviews.none'),\n      )\n    } finally {\n      setRunning(false)\n      setProgress(null)\n      signalRef.current = null\n    }\n  }\n\n  if (running) {\n    return (\n      <Row gap=\"2\" align=\"center\" data-testid=\"generate-previews-running\">\n        <Text size=\"xs\" tone=\"muted\" className=\"whitespace-nowrap\">\n          {translate('assets.generatePreviews.running', {\n            done: progress?.done ?? 0,\n            total: progress?.total ?? 0,\n          })}\n        </Text>\n        <Button\n          size=\"sm\"\n          variant=\"ghost\"\n          onClick={() => {\n            if (signalRef.current) signalRef.current.cancelled = true\n          }}\n          data-testid=\"generate-previews-cancel\"\n        >\n          {translate('common.cancel')}\n        </Button>\n      </Row>\n    )\n  }\n\n  return (\n    <Row gap=\"2\" align=\"center\">\n      {summary ? (\n        <Text size=\"xs\" tone=\"subtle\" className=\"whitespace-nowrap\" data-testid=\"generate-previews-summary\">\n          {summary}\n        </Text>\n      ) : null}\n      <Button\n        size=\"sm\"\n        variant=\"outline\"\n        onClick={onClick}\n        title={translate('assets.generatePreviews.hint')}\n        data-testid=\"generate-previews\"\n      >\n        {running ? <Loader2 className=\"animate-spin\" /> : <ImageDown />}{' '}\n        {translate('assets.generatePreviews.button')}\n      </Button>\n    </Row>\n  )\n}\n\n/** Upload phase → the `assets.upload.phase.*` catalog key suffix (idle → queued). */\nconst PHASE_KEY: Record<UploadState['phase'], string> = {\n  idle: 'queued',\n  preparing: 'preparing',\n  uploading: 'uploading',\n  confirming: 'confirming',\n  done: 'done',\n  failed: 'failed',\n}\n\n/** The in-flight upload panel: progress while transferring, explicit failure + retry. */\nfunction UploadQueue() {\n  const store = useAssets()\n  return (\n    <Panel className=\"m-4 mb-0 sm:mx-6\" data-testid=\"upload-queue\">\n      <PanelHeader>\n        <Text size=\"xs\" weight=\"semibold\" tone=\"muted\">\n          {translate('assets.uploads.heading')}\n        </Text>\n      </PanelHeader>\n      <PanelBody className=\"divide-y divide-border p-0\">\n        {store.uploads.map((entry) => (\n          <UploadRow\n            key={entry.id}\n            entry={entry}\n            onRetry={() => store.retryUpload(entry.id)}\n            onDismiss={() => store.dismissUpload(entry.id)}\n          />\n        ))}\n      </PanelBody>\n    </Panel>\n  )\n}\n\nfunction UploadRow({\n  entry,\n  onRetry,\n  onDismiss,\n}: {\n  entry: UploadEntry\n  onRetry: () => void\n  onDismiss: () => void\n}) {\n  const { state } = entry\n  const failed = state.phase === 'failed'\n  return (\n    <Stack gap=\"1\" className=\"px-3 py-2\" data-testid=\"upload-row\">\n      <Row gap=\"2\">\n        <Text size=\"sm\" weight=\"medium\" className=\"min-w-0 flex-1 truncate\">\n          {entry.filename}\n        </Text>\n        <Badge variant={failed ? 'error' : state.phase === 'done' ? 'success' : 'info'}>\n          {translate('assets.upload.phase.' + PHASE_KEY[state.phase])}\n          {state.attempt > 1\n            ? ' · ' + translate('assets.upload.attempt', { count: state.attempt })\n            : ''}\n        </Badge>\n        {failed ? (\n          <>\n            {state.failure?.retryable !== false ? (\n              <Button variant=\"outline\" size=\"sm\" onClick={onRetry} data-testid=\"upload-retry\">\n                <RotateCcw /> Retry\n              </Button>\n            ) : null}\n            <Button\n              variant=\"ghost\"\n              size=\"icon-sm\"\n              onClick={onDismiss}\n              aria-label={translate('assets.upload.dismissLabel')}\n            >\n              <X />\n            </Button>\n          </>\n        ) : null}\n      </Row>\n      {failed ? (\n        <Text size=\"xs\" tone=\"muted\" data-testid=\"upload-error\">\n          {state.failure?.stage}: {state.failure?.message}\n        </Text>\n      ) : (\n        <ProgressBar value={state.progress} />\n      )}\n    </Stack>\n  )\n}\n\nfunction ProgressBar({ value }: { value: number }) {\n  return (\n    <span className=\"block h-1.5 w-full overflow-hidden rounded-full bg-muted\">\n      <span\n        className=\"block h-full rounded-full bg-primary transition-[width]\"\n        style={{ width: `${Math.round(value * 100)}%` }}\n      />\n    </span>\n  )\n}\n"]}

package/dist/components/assets/assets-store.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react';
 import type { AssetRecord } from '@elytracms/core/persistence';
-import type { DeleteAssetResult, UploadState, UploadableFile } from '@elytracms/studio/lib/assets';
+import type { BackfillProgress, BackfillSignal, DeleteAssetResult, UploadState, UploadableFile } from '@elytracms/studio/lib/assets';
 import type { ReferenceEntryView } from '@elytracms/studio/lib/references';
 import type { AssetMetadataPatch, UpdateAssetMetadataResult } from './asset-metadata.js';
 /**
@@ -36,6 +36,16 @@ export interface AssetsStore {
     }): Promise<DeleteAssetResult>;
     /** Edit alt/title (EC-152); persists through the operations asset facade. */
     updateMetadata(assetId: string, patch: AssetMetadataPatch): Promise<UpdateAssetMetadataResult>;
+    /**
+     * Backfill downscaled previews onto existing images (EC-400 AD-1). Sequential,
+     * idempotent, cancellable; each patch flows through the operations facade and
+     * the shared query cache (AD-5/AD-17). Reports progress via `handlers.onProgress`
+     * and stops when `handlers.signal.cancelled` flips.
+     */
+    generatePreviews(handlers?: {
+        onProgress?: (progress: BackfillProgress) => void;
+        signal?: BackfillSignal;
+    }): Promise<BackfillProgress>;
     refresh(): Promise<void>;
 }
 declare const useAssets: () => AssetsStore;

package/dist/components/assets/assets-store.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useCallback, useContext, useMemo, useRef, useState } from 'react';
-import { deleteAsset, runUpload, xhrUploadTransport } from '@elytracms/studio/lib/assets';
+import { deleteAsset, runVariantBackfill, runUpload, xhrUploadTransport } from '@elytracms/studio/lib/assets';
 import { loadInboundAssetReferenceViews } from '@elytracms/studio/lib/references';
 import { getStudioOperations, operationsAssetRepository } from '@elytracms/studio/lib/operations';
 import { listStoreState, useOperationCache, useOperationQuery } from '@elytracms/studio/lib/query';
@@ -124,6 +124,21 @@ export function AssetsProvider({ projectId, children, }) {
         }
         return result;
     }, [studio, projectId, cache]);
+    const generatePreviews = useCallback(async (handlers) => {
+        const { adapter, assetRepo } = await studio();
+        // Reads (list) + the variant patch (upsert) go through the operations facade;
+        // bytes ride on `adapter.blobs`. The backfill is per-variant (EC-420 AD-4):
+        // one fetch of each original fills whichever of thumb/lqip is missing. Each
+        // generated record is patched into the shared cache in place (EC-301 perf,
+        // AD-17) so the grid updates live without a full re-list.
+        return runVariantBackfill({
+            assets: assetRepo,
+            blobs: adapter.blobs,
+            onGenerated: (updated) => cache.patch(assetsQueryKey(projectId), (prev) => (prev ?? []).map((a) => (a.id === updated.id ? updated : a))),
+            ...(handlers?.onProgress ? { onProgress: handlers.onProgress } : {}),
+            ...(handlers?.signal ? { signal: handlers.signal } : {}),
+        }, projectId);
+    }, [studio, projectId, cache]);
     const store = useMemo(() => ({
         projectId,
         status,
@@ -136,6 +151,7 @@ export function AssetsProvider({ projectId, children, }) {
         usagesOf,
         remove,
         updateMetadata,
+        generatePreviews,
         refresh,
     }), [
         projectId,
@@ -149,6 +165,7 @@ export function AssetsProvider({ projectId, children, }) {
         usagesOf,
         remove,
         updateMetadata,
+        generatePreviews,
         refresh,
     ]);
     return _jsx(AssetsContext.Provider, { value: store, children: children });

package/dist/components/assets/assets-store.js.map

@@ -1 +1 @@
-{"version":3,"file":"assets-store.js","sourceRoot":"","sources":["../../../src/components/assets/assets-store.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useContext, useMemo, useRef, useState } from 'react'\nimport type { ReactNode } from 'react'\nimport type { AssetRecord, AssetRepository } from '@elytracms/core/persistence'\nimport { deleteAsset, runUpload, xhrUploadTransport } from '@elytracms/studio/lib/assets'\nimport type { DeleteAssetResult, UploadState, UploadableFile } from '@elytracms/studio/lib/assets'\nimport { loadInboundAssetReferenceViews } from '@elytracms/studio/lib/references'\nimport type { ReferenceEntryView } from '@elytracms/studio/lib/references'\nimport { getStudioOperations, operationsAssetRepository } from '@elytracms/studio/lib/operations'\nimport type { OperationsClient, StudioOperations } from '@elytracms/studio/lib/operations'\nimport { listStoreState, useOperationCache, useOperationQuery } from '@elytracms/studio/lib/query'\nimport { createRequiredContext } from '@elytracms/studio/lib/required-context'\nimport { updateAssetMetadata } from './asset-metadata'\nimport type { AssetMetadataPatch, UpdateAssetMetadataResult } from './asset-metadata'\n\n/**\n * Asset library store (EC-151, EC-141). Asset *metadata* mutations go through\n * the shared operations client (`assets.*` commands — validate → authorize →\n * mutate → event); blob *bytes* ride on `adapter.blobs`, which is transport,\n * not domain. The UI works identically against the in-memory seed and a live\n * Convex deployment.\n */\n\nexport interface UploadEntry {\n  id: string\n  filename: string\n  state: UploadState\n}\n\nexport interface AssetsStore {\n  /** The active project (e.g. for reference deep links, EC-202). */\n  projectId: string\n  status: 'loading' | 'ready' | 'error'\n  errorMessage?: string\n  assets: readonly AssetRecord[]\n  uploads: readonly UploadEntry[]\n  upload(files: Iterable<UploadableFile>): void\n  retryUpload(uploadId: string): void\n  dismissUpload(uploadId: string): void\n  /**\n   * Index-accurate inbound references of an asset (EC-202): the \"used by\"\n   * pre-flight of the block-or-confirm delete dialog, read from the EC-155\n   * reference index (not the retired string scan).\n   */\n  usagesOf(assetId: string): Promise<ReferenceEntryView[]>\n  remove(assetId: string, options?: { confirmInUse?: boolean }): Promise<DeleteAssetResult>\n  /** Edit alt/title (EC-152); persists through the operations asset facade. */\n  updateMetadata(assetId: string, patch: AssetMetadataPatch): Promise<UpdateAssetMetadataResult>\n  refresh(): Promise<void>\n}\n\nconst { Context: AssetsContext, useRequired: useAssets } = createRequiredContext<AssetsStore>(\n  'Assets',\n  { article: 'an' },\n)\n\nconst EMPTY_ASSETS: readonly AssetRecord[] = []\n\n/** Cache key for a project's asset library (shared by the query and its patches). */\nfunction assetsQueryKey(projectId: string): readonly [string, string] {\n  return ['assets', projectId]\n}\n\n/** Load a project's asset library (pure over the operations client). A list\n *  failure throws so the query surfaces it as an error status. */\nasync function loadAssets(operations: OperationsClient, projectId: string): Promise<AssetRecord[]> {\n  const result = await operations.assets.list({ projectId })\n  if (!result.ok) throw new Error(result.error.message)\n  return [...result.value]\n}\n\nexport function AssetsProvider({\n  projectId,\n  children,\n}: {\n  projectId: string\n  children: ReactNode\n}) {\n  const uploadFilesRef = useRef(new Map<string, UploadableFile>())\n  const uploadSeq = useRef(0)\n  const [uploads, setUploads] = useState<readonly UploadEntry[]>([])\n\n  /** The shared studio operations bundle + the metadata-write facade over it. */\n  const studio = useCallback(async (): Promise<\n    StudioOperations & { assetRepo: AssetRepository }\n  > => {\n    const bundle = await getStudioOperations()\n    return { ...bundle, assetRepo: operationsAssetRepository(bundle.operations) }\n  }, [])\n\n  // The library list, read through the one operations-backed query cache\n  // (EC-308/AD-17). No `invalidateOn`: this provider is the sole writer of its\n  // project's assets, so its own mutations patch the cache in place (the EC-301\n  // rule — a metadata or focal-point edit must never trigger a full re-list).\n  const query = useOperationQuery<AssetRecord[]>({\n    queryKey: assetsQueryKey(projectId),\n    loader: (operations) => loadAssets(operations, projectId),\n  })\n  const cache = useOperationCache()\n  const refetch = query.refetch\n  const assets = query.data ?? EMPTY_ASSETS\n  const { status, errorMessage } = listStoreState(query)\n\n  /** Re-list from the backend (the public escape hatch + post-upload reconcile). */\n  const refresh = useCallback(async () => {\n    await refetch()\n  }, [refetch])\n\n  const setUploadState = useCallback((uploadId: string, state: UploadState) => {\n    setUploads((prev) => prev.map((u) => (u.id === uploadId ? { ...u, state } : u)))\n  }, [])\n\n  const runEntry = useCallback(\n    async (uploadId: string, file: UploadableFile, previous?: UploadState) => {\n      const { adapter, assetRepo } = await studio()\n      const result = await runUpload(\n        {\n          // Bytes ride on blob storage (transport); the metadata record is\n          // confirmed through the `assets.upsert` operation command.\n          blobs: adapter.blobs,\n          assets: assetRepo,\n          ...(typeof XMLHttpRequest !== 'undefined' ? { transport: xhrUploadTransport } : {}),\n        },\n        {\n          projectId,\n          file,\n          onState: (state) => setUploadState(uploadId, state),\n        },\n        previous,\n      )\n      if (result.ok) {\n        // Completed uploads leave the queue; the asset appears in the library.\n        uploadFilesRef.current.delete(uploadId)\n        setUploads((prev) => prev.filter((u) => u.id !== uploadId))\n        await refresh()\n      }\n    },\n    [studio, projectId, refresh, setUploadState],\n  )\n\n  const upload = useCallback(\n    (files: Iterable<UploadableFile>) => {\n      for (const file of files) {\n        uploadSeq.current += 1\n        const uploadId = `upload-${uploadSeq.current}`\n        uploadFilesRef.current.set(uploadId, file)\n        setUploads((prev) => [\n          ...prev,\n          { id: uploadId, filename: file.name, state: { phase: 'idle', progress: 0, attempt: 0 } },\n        ])\n        void runEntry(uploadId, file)\n      }\n    },\n    [runEntry],\n  )\n\n  const retryUpload = useCallback(\n    (uploadId: string) => {\n      const file = uploadFilesRef.current.get(uploadId)\n      const entry = uploads.find((u) => u.id === uploadId)\n      if (!file || !entry || entry.state.phase !== 'failed') return\n      void runEntry(uploadId, file, entry.state)\n    },\n    [runEntry, uploads],\n  )\n\n  const dismissUpload = useCallback((uploadId: string) => {\n    uploadFilesRef.current.delete(uploadId)\n    setUploads((prev) => prev.filter((u) => u.id !== uploadId))\n  }, [])\n\n  const usagesOf = useCallback(\n    // Index-accurate (EC-202): inbound references from the EC-155 index via the\n    // operations queries — the same machinery the References panel uses.\n    async (assetId: string) => loadInboundAssetReferenceViews(projectId, assetId),\n    [projectId],\n  )\n\n  const remove = useCallback(\n    async (assetId: string, options?: { confirmInUse?: boolean }) => {\n      const { adapter, assetRepo } = await studio()\n      // Metadata removal goes through the `assets.remove` command (via the\n      // facade); blob byte deletion stays on the adapter; the usage gate reads\n      // the EC-155 reference index (`adapter.references`, EC-202).\n      const result = await deleteAsset(\n        { assets: assetRepo, blobs: adapter.blobs, references: adapter.references },\n        projectId,\n        assetId,\n        options,\n      )\n      // Drop the one removed record from the cache rather than re-listing the whole\n      // library (EC-301 perf, mirrors updateMetadata) — a delete must not trigger a full\n      // `assets.list` round-trip on top of the deletion itself.\n      if (result.outcome === 'deleted' || result.outcome === 'not-found') {\n        cache.patch<AssetRecord[]>(assetsQueryKey(projectId), (prev) =>\n          (prev ?? []).filter((a) => a.id !== assetId),\n        )\n      }\n      return result\n    },\n    [studio, projectId, cache],\n  )\n\n  const updateMetadata = useCallback(\n    async (assetId: string, patch: AssetMetadataPatch) => {\n      // Metadata writes go through the `assets.upsert` command via the\n      // operations facade (EC-141) — never straight at a repository.\n      const { assetRepo } = await studio()\n      const result = await updateAssetMetadata({ assets: assetRepo }, projectId, assetId, patch)\n      if (result.ok) {\n        // Patch the one updated record into the cache rather than re-listing the\n        // whole library (EC-301). A focal-point or alt edit must not trigger a full\n        // `assets.list` round-trip — that re-list (plus the marker only moving once\n        // it returned) was the focal-point picker's lag and query storm.\n        const updated = result.asset\n        cache.patch<AssetRecord[]>(assetsQueryKey(projectId), (prev) =>\n          (prev ?? []).map((a) => (a.id === assetId ? updated : a)),\n        )\n      }\n      return result\n    },\n    [studio, projectId, cache],\n  )\n\n  const store = useMemo<AssetsStore>(\n    () => ({\n      projectId,\n      status,\n      ...(errorMessage !== undefined ? { errorMessage } : {}),\n      assets,\n      uploads,\n      upload,\n      retryUpload,\n      dismissUpload,\n      usagesOf,\n      remove,\n      updateMetadata,\n      refresh,\n    }),\n    [\n      projectId,\n      status,\n      errorMessage,\n      assets,\n      uploads,\n      upload,\n      retryUpload,\n      dismissUpload,\n      usagesOf,\n      remove,\n      updateMetadata,\n      refresh,\n    ],\n  )\n\n  return <AssetsContext.Provider value={store}>{children}</AssetsContext.Provider>\n}\n\nexport { useAssets }\n\n/**\n * The assets store when an `<AssetsProvider>` is mounted above, else `null`.\n * Lets surfaces outside the Assets section (the CMS asset picker, EC-152)\n * reuse an ambient provider or mount their own.\n */\nexport function useOptionalAssets(): AssetsStore | null {\n  return useContext(AssetsContext)\n}\n"]}
+{"version":3,"file":"assets-store.js","sourceRoot":"","sources":["../../../src/components/assets/assets-store.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useContext, useMemo, useRef, useState } from 'react'\nimport type { ReactNode } from 'react'\nimport type { AssetRecord, AssetRepository } from '@elytracms/core/persistence'\nimport { deleteAsset, runVariantBackfill, runUpload, xhrUploadTransport } from '@elytracms/studio/lib/assets'\nimport type {\n  BackfillProgress,\n  BackfillSignal,\n  DeleteAssetResult,\n  UploadState,\n  UploadableFile,\n} from '@elytracms/studio/lib/assets'\nimport { loadInboundAssetReferenceViews } from '@elytracms/studio/lib/references'\nimport type { ReferenceEntryView } from '@elytracms/studio/lib/references'\nimport { getStudioOperations, operationsAssetRepository } from '@elytracms/studio/lib/operations'\nimport type { OperationsClient, StudioOperations } from '@elytracms/studio/lib/operations'\nimport { listStoreState, useOperationCache, useOperationQuery } from '@elytracms/studio/lib/query'\nimport { createRequiredContext } from '@elytracms/studio/lib/required-context'\nimport { updateAssetMetadata } from './asset-metadata'\nimport type { AssetMetadataPatch, UpdateAssetMetadataResult } from './asset-metadata'\n\n/**\n * Asset library store (EC-151, EC-141). Asset *metadata* mutations go through\n * the shared operations client (`assets.*` commands — validate → authorize →\n * mutate → event); blob *bytes* ride on `adapter.blobs`, which is transport,\n * not domain. The UI works identically against the in-memory seed and a live\n * Convex deployment.\n */\n\nexport interface UploadEntry {\n  id: string\n  filename: string\n  state: UploadState\n}\n\nexport interface AssetsStore {\n  /** The active project (e.g. for reference deep links, EC-202). */\n  projectId: string\n  status: 'loading' | 'ready' | 'error'\n  errorMessage?: string\n  assets: readonly AssetRecord[]\n  uploads: readonly UploadEntry[]\n  upload(files: Iterable<UploadableFile>): void\n  retryUpload(uploadId: string): void\n  dismissUpload(uploadId: string): void\n  /**\n   * Index-accurate inbound references of an asset (EC-202): the \"used by\"\n   * pre-flight of the block-or-confirm delete dialog, read from the EC-155\n   * reference index (not the retired string scan).\n   */\n  usagesOf(assetId: string): Promise<ReferenceEntryView[]>\n  remove(assetId: string, options?: { confirmInUse?: boolean }): Promise<DeleteAssetResult>\n  /** Edit alt/title (EC-152); persists through the operations asset facade. */\n  updateMetadata(assetId: string, patch: AssetMetadataPatch): Promise<UpdateAssetMetadataResult>\n  /**\n   * Backfill downscaled previews onto existing images (EC-400 AD-1). Sequential,\n   * idempotent, cancellable; each patch flows through the operations facade and\n   * the shared query cache (AD-5/AD-17). Reports progress via `handlers.onProgress`\n   * and stops when `handlers.signal.cancelled` flips.\n   */\n  generatePreviews(handlers?: {\n    onProgress?: (progress: BackfillProgress) => void\n    signal?: BackfillSignal\n  }): Promise<BackfillProgress>\n  refresh(): Promise<void>\n}\n\nconst { Context: AssetsContext, useRequired: useAssets } = createRequiredContext<AssetsStore>(\n  'Assets',\n  { article: 'an' },\n)\n\nconst EMPTY_ASSETS: readonly AssetRecord[] = []\n\n/** Cache key for a project's asset library (shared by the query and its patches). */\nfunction assetsQueryKey(projectId: string): readonly [string, string] {\n  return ['assets', projectId]\n}\n\n/** Load a project's asset library (pure over the operations client). A list\n *  failure throws so the query surfaces it as an error status. */\nasync function loadAssets(operations: OperationsClient, projectId: string): Promise<AssetRecord[]> {\n  const result = await operations.assets.list({ projectId })\n  if (!result.ok) throw new Error(result.error.message)\n  return [...result.value]\n}\n\nexport function AssetsProvider({\n  projectId,\n  children,\n}: {\n  projectId: string\n  children: ReactNode\n}) {\n  const uploadFilesRef = useRef(new Map<string, UploadableFile>())\n  const uploadSeq = useRef(0)\n  const [uploads, setUploads] = useState<readonly UploadEntry[]>([])\n\n  /** The shared studio operations bundle + the metadata-write facade over it. */\n  const studio = useCallback(async (): Promise<\n    StudioOperations & { assetRepo: AssetRepository }\n  > => {\n    const bundle = await getStudioOperations()\n    return { ...bundle, assetRepo: operationsAssetRepository(bundle.operations) }\n  }, [])\n\n  // The library list, read through the one operations-backed query cache\n  // (EC-308/AD-17). No `invalidateOn`: this provider is the sole writer of its\n  // project's assets, so its own mutations patch the cache in place (the EC-301\n  // rule — a metadata or focal-point edit must never trigger a full re-list).\n  const query = useOperationQuery<AssetRecord[]>({\n    queryKey: assetsQueryKey(projectId),\n    loader: (operations) => loadAssets(operations, projectId),\n  })\n  const cache = useOperationCache()\n  const refetch = query.refetch\n  const assets = query.data ?? EMPTY_ASSETS\n  const { status, errorMessage } = listStoreState(query)\n\n  /** Re-list from the backend (the public escape hatch + post-upload reconcile). */\n  const refresh = useCallback(async () => {\n    await refetch()\n  }, [refetch])\n\n  const setUploadState = useCallback((uploadId: string, state: UploadState) => {\n    setUploads((prev) => prev.map((u) => (u.id === uploadId ? { ...u, state } : u)))\n  }, [])\n\n  const runEntry = useCallback(\n    async (uploadId: string, file: UploadableFile, previous?: UploadState) => {\n      const { adapter, assetRepo } = await studio()\n      const result = await runUpload(\n        {\n          // Bytes ride on blob storage (transport); the metadata record is\n          // confirmed through the `assets.upsert` operation command.\n          blobs: adapter.blobs,\n          assets: assetRepo,\n          ...(typeof XMLHttpRequest !== 'undefined' ? { transport: xhrUploadTransport } : {}),\n        },\n        {\n          projectId,\n          file,\n          onState: (state) => setUploadState(uploadId, state),\n        },\n        previous,\n      )\n      if (result.ok) {\n        // Completed uploads leave the queue; the asset appears in the library.\n        uploadFilesRef.current.delete(uploadId)\n        setUploads((prev) => prev.filter((u) => u.id !== uploadId))\n        await refresh()\n      }\n    },\n    [studio, projectId, refresh, setUploadState],\n  )\n\n  const upload = useCallback(\n    (files: Iterable<UploadableFile>) => {\n      for (const file of files) {\n        uploadSeq.current += 1\n        const uploadId = `upload-${uploadSeq.current}`\n        uploadFilesRef.current.set(uploadId, file)\n        setUploads((prev) => [\n          ...prev,\n          { id: uploadId, filename: file.name, state: { phase: 'idle', progress: 0, attempt: 0 } },\n        ])\n        void runEntry(uploadId, file)\n      }\n    },\n    [runEntry],\n  )\n\n  const retryUpload = useCallback(\n    (uploadId: string) => {\n      const file = uploadFilesRef.current.get(uploadId)\n      const entry = uploads.find((u) => u.id === uploadId)\n      if (!file || !entry || entry.state.phase !== 'failed') return\n      void runEntry(uploadId, file, entry.state)\n    },\n    [runEntry, uploads],\n  )\n\n  const dismissUpload = useCallback((uploadId: string) => {\n    uploadFilesRef.current.delete(uploadId)\n    setUploads((prev) => prev.filter((u) => u.id !== uploadId))\n  }, [])\n\n  const usagesOf = useCallback(\n    // Index-accurate (EC-202): inbound references from the EC-155 index via the\n    // operations queries — the same machinery the References panel uses.\n    async (assetId: string) => loadInboundAssetReferenceViews(projectId, assetId),\n    [projectId],\n  )\n\n  const remove = useCallback(\n    async (assetId: string, options?: { confirmInUse?: boolean }) => {\n      const { adapter, assetRepo } = await studio()\n      // Metadata removal goes through the `assets.remove` command (via the\n      // facade); blob byte deletion stays on the adapter; the usage gate reads\n      // the EC-155 reference index (`adapter.references`, EC-202).\n      const result = await deleteAsset(\n        { assets: assetRepo, blobs: adapter.blobs, references: adapter.references },\n        projectId,\n        assetId,\n        options,\n      )\n      // Drop the one removed record from the cache rather than re-listing the whole\n      // library (EC-301 perf, mirrors updateMetadata) — a delete must not trigger a full\n      // `assets.list` round-trip on top of the deletion itself.\n      if (result.outcome === 'deleted' || result.outcome === 'not-found') {\n        cache.patch<AssetRecord[]>(assetsQueryKey(projectId), (prev) =>\n          (prev ?? []).filter((a) => a.id !== assetId),\n        )\n      }\n      return result\n    },\n    [studio, projectId, cache],\n  )\n\n  const updateMetadata = useCallback(\n    async (assetId: string, patch: AssetMetadataPatch) => {\n      // Metadata writes go through the `assets.upsert` command via the\n      // operations facade (EC-141) — never straight at a repository.\n      const { assetRepo } = await studio()\n      const result = await updateAssetMetadata({ assets: assetRepo }, projectId, assetId, patch)\n      if (result.ok) {\n        // Patch the one updated record into the cache rather than re-listing the\n        // whole library (EC-301). A focal-point or alt edit must not trigger a full\n        // `assets.list` round-trip — that re-list (plus the marker only moving once\n        // it returned) was the focal-point picker's lag and query storm.\n        const updated = result.asset\n        cache.patch<AssetRecord[]>(assetsQueryKey(projectId), (prev) =>\n          (prev ?? []).map((a) => (a.id === assetId ? updated : a)),\n        )\n      }\n      return result\n    },\n    [studio, projectId, cache],\n  )\n\n  const generatePreviews = useCallback(\n    async (handlers?: {\n      onProgress?: (progress: BackfillProgress) => void\n      signal?: BackfillSignal\n    }) => {\n      const { adapter, assetRepo } = await studio()\n      // Reads (list) + the variant patch (upsert) go through the operations facade;\n      // bytes ride on `adapter.blobs`. The backfill is per-variant (EC-420 AD-4):\n      // one fetch of each original fills whichever of thumb/lqip is missing. Each\n      // generated record is patched into the shared cache in place (EC-301 perf,\n      // AD-17) so the grid updates live without a full re-list.\n      return runVariantBackfill(\n        {\n          assets: assetRepo,\n          blobs: adapter.blobs,\n          onGenerated: (updated) =>\n            cache.patch<AssetRecord[]>(assetsQueryKey(projectId), (prev) =>\n              (prev ?? []).map((a) => (a.id === updated.id ? updated : a)),\n            ),\n          ...(handlers?.onProgress ? { onProgress: handlers.onProgress } : {}),\n          ...(handlers?.signal ? { signal: handlers.signal } : {}),\n        },\n        projectId,\n      )\n    },\n    [studio, projectId, cache],\n  )\n\n  const store = useMemo<AssetsStore>(\n    () => ({\n      projectId,\n      status,\n      ...(errorMessage !== undefined ? { errorMessage } : {}),\n      assets,\n      uploads,\n      upload,\n      retryUpload,\n      dismissUpload,\n      usagesOf,\n      remove,\n      updateMetadata,\n      generatePreviews,\n      refresh,\n    }),\n    [\n      projectId,\n      status,\n      errorMessage,\n      assets,\n      uploads,\n      upload,\n      retryUpload,\n      dismissUpload,\n      usagesOf,\n      remove,\n      updateMetadata,\n      generatePreviews,\n      refresh,\n    ],\n  )\n\n  return <AssetsContext.Provider value={store}>{children}</AssetsContext.Provider>\n}\n\nexport { useAssets }\n\n/**\n * The assets store when an `<AssetsProvider>` is mounted above, else `null`.\n * Lets surfaces outside the Assets section (the CMS asset picker, EC-152)\n * reuse an ambient provider or mount their own.\n */\nexport function useOptionalAssets(): AssetsStore | null {\n  return useContext(AssetsContext)\n}\n"]}

package/dist/components/builder/blocks-model.d.ts

@@ -80,6 +80,17 @@ export declare function tilesForManifest(studio: StudioRegistry, manifest: Compo
  * categories alphabetically (registry order within a group). Deterministic.
  */
 export declare function blockGroups(studio: StudioRegistry, filter?: BlockFilter): BlockGroup[];
+/**
+ * Whether ANY component could be inserted under a slot allow-list (EC-405) — the
+ * cheap existence check behind the canvas insertion affordances: a "+" only shows
+ * at a position where the blocks panel would offer at least one tile. Mirrors the
+ * exact filter {@link blockGroups} applies (canvas-eligible AND, when an allow-list
+ * is present, on that list), short-circuiting on the first match instead of
+ * building tiles; falls back to the layout-helper presets (which are also
+ * insertable there). `undefined`/absent `slotAllow` means "allow any" → true when
+ * the registry has any canvas-eligible component.
+ */
+export declare function hasInsertableComponent(studio: StudioRegistry, slotAllow?: string[]): boolean;
 /**
  * Layout helper presets (EC-067) as panel tiles. Preview nodes are re-id'd
  * deterministically so sibling React keys stay unique.

package/dist/components/builder/blocks-model.js

@@ -1,5 +1,7 @@
 import { cloneWithNewIds, isLayoutContainerId } from '@elytracms/core/project-graph';
 import { isCanvasEligible, propValueValidator } from '@elytracms/core/component-registry';
+import { localizedStringVariants } from '@elytracms/core/cms-core';
+import { localizedLabel } from '@elytracms/studio/lib/i18n';
 import { componentStatus } from '@elytracms/studio/lib/registry';
 import { nodeFromProps, previewSpecs } from '@elytracms/studio/lib/registry/preview';
 import { LAYOUT_PRESETS, nodeFromManifest, seededNodeFromManifest } from './node-factory.js';
@@ -41,9 +43,7 @@ function manifestIssues(studio, manifest) {
         return [`No implementation is registered for "${manifest.id}".`];
     }
     if (status === 'invalid') {
-        return studio.registry.issues
-            .filter((issue) => issue.componentId === manifest.id)
-            .map((issue) => issue.message);
+        return studio.registry.issues.filter((issue) => issue.componentId === manifest.id).map((issue) => issue.message);
     }
     return [];
 }
@@ -94,7 +94,7 @@ export function fixtureSubtree(studio, manifest, fixture, baseId) {
 }
 /** All tiles for one manifest: one per fixture, else a single default tile. */
 export function tilesForManifest(studio, manifest) {
-    const title = manifest.title ?? manifest.id;
+    const title = localizedLabel(manifest.title, manifest.id);
     const baseIssues = manifestIssues(studio, manifest);
     if (!manifest.fixtures || manifest.fixtures.length === 0) {
         // No declared fixtures: insert the manifest defaults, seeding layout
@@ -138,7 +138,7 @@ export function tilesForManifest(studio, manifest) {
     });
 }
 function matches(manifest, query) {
-    const hay = [manifest.id, manifest.title, manifest.description, manifest.category]
+    const hay = [manifest.id, ...localizedStringVariants(manifest.title), manifest.description, manifest.category]
         .filter(Boolean)
         .join(' ')
         .toLowerCase();
@@ -168,9 +168,27 @@ export function blockGroups(studio, filter = {}) {
         tiles.push(...tilesForManifest(studio, manifest));
         groups.set(category, tiles);
     }
-    return [...groups.entries()]
-        .sort(([a], [b]) => a.localeCompare(b))
-        .map(([category, tiles]) => ({ category, tiles }));
+    return [...groups.entries()].sort(([a], [b]) => a.localeCompare(b)).map(([category, tiles]) => ({ category, tiles }));
+}
+/**
+ * Whether ANY component could be inserted under a slot allow-list (EC-405) — the
+ * cheap existence check behind the canvas insertion affordances: a "+" only shows
+ * at a position where the blocks panel would offer at least one tile. Mirrors the
+ * exact filter {@link blockGroups} applies (canvas-eligible AND, when an allow-list
+ * is present, on that list), short-circuiting on the first match instead of
+ * building tiles; falls back to the layout-helper presets (which are also
+ * insertable there). `undefined`/absent `slotAllow` means "allow any" → true when
+ * the registry has any canvas-eligible component.
+ */
+export function hasInsertableComponent(studio, slotAllow) {
+    for (const manifest of studio.registry.list()) {
+        if (!isCanvasEligible(manifest))
+            continue;
+        if (slotAllow && !slotAllow.includes(manifest.id))
+            continue;
+        return true;
+    }
+    return presetTiles(slotAllow).length > 0;
 }
 /**
  * Layout helper presets (EC-067) as panel tiles. Preview nodes are re-id'd