@drawnagency/primitives 0.1.62 → 0.1.63

package/dist/{chunk-FJBDGYHE.js → chunk-FECCYOPJ.js}

@@ -1,6 +1,6 @@
 import {
   EditablePlainText
-} from "./chunk-QWDOJUUO.js";
+} from "./chunk-VMDKWUMT.js";
 import {
   usePages
 } from "./chunk-4E66N6UV.js";

package/dist/{chunk-JRT4KWHU.js → chunk-QYQ3DQHI.js}

@@ -9,7 +9,7 @@ import {
   MediaBlock,
   containerGridClass,
   useEditableCollection
-} from "./chunk-QWDOJUUO.js";
+} from "./chunk-VMDKWUMT.js";
 import {
   AddIcon,
   DeleteIcon,

package/dist/{chunk-QWDOJUUO.js → chunk-VMDKWUMT.js}

@@ -264,10 +264,14 @@ function MediaBlock({ refValue, options, link, isEditMode, onRefChange }) {
   const showBorder = refValue.border ?? options.border;
   const captionStr = refValue.caption ? Array.isArray(refValue.caption) ? refValue.caption.join("\n") : refValue.caption : "";
   const replace = onRefChange ? (imageId) => onRefChange({ ...refValue, imageId }) : void 0;
+  const baked = refValue;
   const resolved = /* @__PURE__ */ jsx3(
     ResolvedMedia,
     {
       imageId: refValue.imageId || void 0,
+      src: baked.src,
+      srcset: baked.srcset,
+      alt: baked.alt,
       className: "h-full w-full",
       imgClassName: fitClass,
       invertFrom: refValue.invertFrom

package/dist/components/primitives/index.js

@@ -2,7 +2,7 @@ import {
   EditableRichText,
   LinkPopover,
   defineHeadingSection
-} from "../../chunk-FJBDGYHE.js";
+} from "../../chunk-FECCYOPJ.js";
 import {
   EditableGrid,
   EditablePlainText,
@@ -10,7 +10,7 @@ import {
   MediaBlock,
   ResolvedMedia,
   useEditableCollection
-} from "../../chunk-QWDOJUUO.js";
+} from "../../chunk-VMDKWUMT.js";
 import "../../chunk-4E66N6UV.js";
 import {
   DeleteIcon,

package/dist/components/sections/Media/MediaBlock.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MediaBlock.d.ts","sourceRoot":"","sources":["../../../../src/components/sections/Media/MediaBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AACpE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAOvD,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,oBAAoB,CAAC;IAC/B,OAAO,EAAE;QAAE,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,WAAW,CAAC,EAAE,OAAO,CAAC;QAAC,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,SAAS,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;KAAE,CAAC;IACxG,4EAA4E;IAC5E,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,oBAAoB,KAAK,IAAI,CAAC;CACnD;AAED,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,WAAW,EAAE,EAAE,eAAe,2CA2E/F"}
+{"version":3,"file":"MediaBlock.d.ts","sourceRoot":"","sources":["../../../../src/components/sections/Media/MediaBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AACpE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAOvD,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,oBAAoB,CAAC;IAC/B,OAAO,EAAE;QAAE,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,WAAW,CAAC,EAAE,OAAO,CAAC;QAAC,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,SAAS,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;KAAE,CAAC;IACxG,4EAA4E;IAC5E,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,oBAAoB,KAAK,IAAI,CAAC;CACnD;AAED,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,WAAW,EAAE,EAAE,eAAe,2CAoF/F"}

package/dist/components/sections/brand-guide.js

@@ -2,9 +2,9 @@ import {
   ColorItemSchema,
   ColorSpaceSchema,
   brandGuideSectionDefs
-} from "../../chunk-JRT4KWHU.js";
+} from "../../chunk-QYQ3DQHI.js";
 import "../../chunk-5THS4K5D.js";
-import "../../chunk-QWDOJUUO.js";
+import "../../chunk-VMDKWUMT.js";
 import "../../chunk-I5737FJY.js";
 import "../../chunk-CBWK3KPV.js";
 import "../../chunk-3DCG4DNU.js";

package/dist/components/sections/register-schemas.js

@@ -3,7 +3,7 @@ import {
   pluralize,
   stripHtmlToPlainText,
   truncate
-} from "../../chunk-JRT4KWHU.js";
+} from "../../chunk-QYQ3DQHI.js";
 import {
   DeleteButton,
   DragHandle,
@@ -20,7 +20,7 @@ import "../../chunk-5THS4K5D.js";
 import {
   EditableRichText,
   defineHeadingSection
-} from "../../chunk-FJBDGYHE.js";
+} from "../../chunk-FECCYOPJ.js";
 import {
   EditablePlainText,
   MAX_CONTAINER_COLUMNS,
@@ -28,7 +28,7 @@ import {
   colSpanClass,
   containerGridClass,
   spacerHiddenClass
-} from "../../chunk-QWDOJUUO.js";
+} from "../../chunk-VMDKWUMT.js";
 import "../../chunk-4E66N6UV.js";
 import "../../chunk-I5737FJY.js";
 import "../../chunk-CBWK3KPV.js";

package/dist/components/shell/EditorShell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditorShell.d.ts","sourceRoot":"","sources":["../../../src/components/shell/EditorShell.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAqEjD,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAQxD,UAAU,KAAK;IACb,OAAO,EAAE,MAAM,CAAC;IAIhB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,YAAY,EAAE;QACZ,KAAK,EAAE,OAAO,CAAC;QACf,aAAa,EAAE,OAAO,CAAC;QACvB,YAAY,EAAE,OAAO,CAAC;QACtB,cAAc,EAAE,OAAO,CAAC;QACxB,kBAAkB,EAAE,OAAO,CAAC;QAC5B,cAAc,EAAE,OAAO,CAAC;KACzB,CAAC;IACF,WAAW,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,OAAO,GAAG,QAAQ,CAAA;KAAE,GAAG,IAAI,CAAC;CACjE;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,OAAO,EACP,YAAY,EACZ,MAAM,EACN,SAAS,EAAE,gBAAgB,EAC3B,YAAY,EACZ,WAAW,GACZ,EAAE,KAAK,2CAo6BP"}
+{"version":3,"file":"EditorShell.d.ts","sourceRoot":"","sources":["../../../src/components/shell/EditorShell.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAsEjD,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAQxD,UAAU,KAAK;IACb,OAAO,EAAE,MAAM,CAAC;IAIhB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,YAAY,EAAE;QACZ,KAAK,EAAE,OAAO,CAAC;QACf,aAAa,EAAE,OAAO,CAAC;QACvB,YAAY,EAAE,OAAO,CAAC;QACtB,cAAc,EAAE,OAAO,CAAC;QACxB,kBAAkB,EAAE,OAAO,CAAC;QAC5B,cAAc,EAAE,OAAO,CAAC;KACzB,CAAC;IACF,WAAW,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,OAAO,GAAG,QAAQ,CAAA;KAAE,GAAG,IAAI,CAAC;CACjE;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,OAAO,EACP,YAAY,EACZ,MAAM,EACN,SAAS,EAAE,gBAAgB,EAC3B,YAAY,EACZ,WAAW,GACZ,EAAE,KAAK,2CAo6BP"}

package/dist/components/shell/view-branch.d.ts

@@ -0,0 +1,12 @@
+export type ViewBranch = "saved" | "live";
+/**
+ * Section visibility for the editor's view-mode toggle.
+ *
+ * - `"live"` ("Published"): mirrors what an anonymous visitor sees on the
+ *   deployed site — only `status === "live"` (the same predicate the real viewer
+ *   applies in `viewer-page.ts`).
+ * - `"saved"` ("Unpublished"): all in-progress edits — every status EXCEPT
+ *   `archived` — so edits to live content show alongside drafts.
+ */
+export declare function isSectionVisibleInViewBranch(status: string, viewBranch: ViewBranch): boolean;
+//# sourceMappingURL=view-branch.d.ts.map

package/dist/components/shell/view-branch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"view-branch.d.ts","sourceRoot":"","sources":["../../../src/components/shell/view-branch.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,MAAM,CAAC;AAE1C;;;;;;;;GAQG;AACH,wBAAgB,4BAA4B,CAAC,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,GAAG,OAAO,CAE5F"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@drawnagency/primitives",
-  "version": "0.1.62",
+  "version": "0.1.63",
   "type": "module",
   "exports": {
     "./package.json": "./package.json",

package/src/components/sections/Media/MediaBlock.tsx

@@ -27,9 +27,18 @@ export function MediaBlock({ refValue, options, link, isEditMode, onRefChange }:
 
   const replace = onRefChange ? (imageId: string) => onRefChange({ ...refValue, imageId }) : undefined;
 
+  // The zero-JS viewer has no MediaLibraryContext, so useResolvedMedia() can't
+  // resolve the URL. The SSR pass (resolveManifestReferences) bakes src/srcset/alt
+  // onto the ref instead — forward them so a real <img> renders rather than the
+  // placeholder. In edit mode these are absent and ResolvedMedia falls back to the
+  // live manifest via context. (Mirrors a3e8913, which did this for MediaGrid/SplitContent.)
+  const baked = refValue as Record<string, unknown>;
   const resolved = (
     <ResolvedMedia
       imageId={refValue.imageId || undefined}
+      src={baked.src as string | undefined}
+      srcset={baked.srcset as string | undefined}
+      alt={baked.alt as string | undefined}
       className="h-full w-full"
       imgClassName={fitClass}
       invertFrom={refValue.invertFrom}

package/src/components/shell/EditorShell.tsx

@@ -69,6 +69,7 @@ import { Button } from "../shared/Button";
 import { SplitButton } from "../shared/SplitButton";
 import { IconButton } from "../shared/IconButton";
 import { SegmentedControl } from "../shared/SegmentedControl";
+import { isSectionVisibleInViewBranch } from "./view-branch";
 import { SettingsIcon } from "../shared/icons";
 import { ImageIcon, ListOrderedIcon, FilesIcon, X } from "lucide-react";
 import { ErrorBoundary } from "../shared/ErrorBoundary";
@@ -1216,12 +1217,13 @@ function EditorContent({
   const editingEnabled = isEditMode && !isPublishing;
 
   // View mode: render the active page's sections from the fetched branch, in page
-  // order (Live additionally filters to status === "live"). Edit mode: the active
-  // page's in-memory sections (the `sections` prop is already `activeSections`).
+  // order. "Published" (live) shows only status === "live"; "Unpublished" (saved)
+  // shows all in-progress edits except archived (see view-branch.ts). Edit mode:
+  // the active page's in-memory sections (the `sections` prop is already `activeSections`).
   const displaySections = !isEditMode && viewSections !== null
     ? activePageSectionIds
         .map((id) => viewSections.find((s) => s.section.id === id))
-        .filter((s): s is LoadedSection => !!s && (viewBranch !== "live" || s.meta.status === "live"))
+        .filter((s): s is LoadedSection => !!s && isSectionVisibleInViewBranch(s.meta.status, viewBranch))
     : sections;
 
   useEffect(() => {
@@ -1642,8 +1644,8 @@ function EditorToolbar({
           <div className="mx-auto max-w-screen-xl flex items-center justify-center px-4 py-2">
             <SegmentedControl
               options={[
-                { value: "saved", label: "Draft" },
-                { value: "live", label: "Live" },
+                { value: "live", label: "Published" },
+                { value: "saved", label: "Unpublished" },
               ]}
               value={viewBranch}
               onChange={(v) => setViewBranch(v as "saved" | "live")}

package/src/components/shell/view-branch.ts

@@ -0,0 +1,14 @@
+export type ViewBranch = "saved" | "live";
+
+/**
+ * Section visibility for the editor's view-mode toggle.
+ *
+ * - `"live"` ("Published"): mirrors what an anonymous visitor sees on the
+ *   deployed site — only `status === "live"` (the same predicate the real viewer
+ *   applies in `viewer-page.ts`).
+ * - `"saved"` ("Unpublished"): all in-progress edits — every status EXCEPT
+ *   `archived` — so edits to live content show alongside drafts.
+ */
+export function isSectionVisibleInViewBranch(status: string, viewBranch: ViewBranch): boolean {
+  return viewBranch === "live" ? status === "live" : status !== "archived";
+}