@plenary/react 0.1.0

package/dist/components/Video.js

@@ -0,0 +1,131 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+function VideoPlaceholder({ className, style }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-plenary-video-placeholder": "",
+      className,
+      style: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        minHeight: 120,
+        border: "1px dashed #94a3b8",
+        borderRadius: 4,
+        background: "#f1f5f9",
+        color: "#94a3b8",
+        ...style
+      },
+      children: /* @__PURE__ */ jsxs(
+        "svg",
+        {
+          width: "32",
+          height: "32",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          "aria-hidden": "true",
+          children: [
+            /* @__PURE__ */ jsx("rect", { x: "3", y: "5", width: "18", height: "14", rx: "2" }),
+            /* @__PURE__ */ jsx("path", { d: "m10 9 5 3-5 3z" })
+          ]
+        }
+      )
+    }
+  );
+}
+function MissingVideoPlaceholder({
+  className,
+  style
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-plenary-video-missing": "",
+      className,
+      title: "Video not found \u2014 it may have been deleted from the Media Library",
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        gap: 6,
+        minHeight: 120,
+        padding: 8,
+        border: "1px dashed #f87171",
+        borderRadius: 4,
+        background: "#fef2f2",
+        color: "#b91c1c",
+        font: "500 12px/1.4 system-ui, sans-serif",
+        textAlign: "center",
+        ...style
+      },
+      children: [
+        /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            width: "32",
+            height: "32",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "1.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            "aria-hidden": "true",
+            children: [
+              /* @__PURE__ */ jsx("rect", { x: "3", y: "5", width: "18", height: "14", rx: "2" }),
+              /* @__PURE__ */ jsx("path", { d: "m10 9 5 3-5 3z" }),
+              /* @__PURE__ */ jsx("path", { d: "m3 3 18 18" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { children: "Video not found" })
+      ]
+    }
+  );
+}
+function Video({
+  media,
+  poster,
+  controls,
+  autoplay,
+  loop,
+  muted,
+  playsinline,
+  preload,
+  className,
+  style,
+  editor
+}) {
+  if (media?.missing) {
+    return editor ? /* @__PURE__ */ jsx(MissingVideoPlaceholder, { className, style }) : null;
+  }
+  const url = media?.url;
+  if (!url) {
+    return editor ? /* @__PURE__ */ jsx(VideoPlaceholder, { className, style }) : null;
+  }
+  const baseStyle = { maxWidth: "100%", height: "auto", ...style };
+  return /* @__PURE__ */ jsx(
+    "video",
+    {
+      src: url,
+      poster: poster?.url || void 0,
+      controls: editor ? false : controls,
+      autoPlay: editor ? false : autoplay,
+      loop,
+      muted,
+      playsInline: playsinline,
+      preload,
+      className,
+      style: baseStyle
+    }
+  );
+}
+export {
+  Video
+};
+//# sourceMappingURL=Video.js.map

package/dist/components/Video.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/Video.tsx"],"sourcesContent":["import type { CSSProperties } from \"react\";\nimport type { MediaValue, ResolvedMedia } from \"../media.js\";\n\nexport interface VideoProps {\n  /** A resolved media value (the renderer resolves it before render). */\n  media?: ResolvedMedia | MediaValue | null;\n  /** Optional poster image, an independent media pick. */\n  poster?: ResolvedMedia | MediaValue | null;\n  controls?: boolean;\n  autoplay?: boolean;\n  loop?: boolean;\n  muted?: boolean;\n  playsinline?: boolean;\n  preload?: \"none\" | \"metadata\" | \"auto\";\n  className?: string;\n  style?: CSSProperties;\n  /** True on editor-preview renders; enables the no-media placeholder. */\n  editor?: boolean;\n}\n\n/** An empty-state stand-in so a media-less Video block is visible and selectable. */\nfunction VideoPlaceholder({ className, style }: { className?: string; style?: CSSProperties }) {\n  return (\n    <div\n      data-plenary-video-placeholder=\"\"\n      className={className}\n      style={{\n        display: \"flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        minHeight: 120,\n        border: \"1px dashed #94a3b8\",\n        borderRadius: 4,\n        background: \"#f1f5f9\",\n        color: \"#94a3b8\",\n        ...style,\n      }}\n    >\n      <svg\n        width=\"32\"\n        height=\"32\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeWidth=\"1.5\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <rect x=\"3\" y=\"5\" width=\"18\" height=\"14\" rx=\"2\" />\n        <path d=\"m10 9 5 3-5 3z\" />\n      </svg>\n    </div>\n  );\n}\n\n/**\n * The stand-in for a dangling reference — an asset deleted from the Media\n * Library while blocks still point at it. The mirror of Image's, and distinct\n * from the empty-state placeholder for the same reason: \"this video is gone\"\n * and \"no video chosen yet\" are different problems.\n */\nfunction MissingVideoPlaceholder({\n  className,\n  style,\n}: {\n  className?: string;\n  style?: CSSProperties;\n}) {\n  return (\n    <div\n      data-plenary-video-missing=\"\"\n      className={className}\n      title=\"Video not found — it may have been deleted from the Media Library\"\n      style={{\n        display: \"flex\",\n        flexDirection: \"column\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        gap: 6,\n        minHeight: 120,\n        padding: 8,\n        border: \"1px dashed #f87171\",\n        borderRadius: 4,\n        background: \"#fef2f2\",\n        color: \"#b91c1c\",\n        font: \"500 12px/1.4 system-ui, sans-serif\",\n        textAlign: \"center\",\n        ...style,\n      }}\n    >\n      <svg\n        width=\"32\"\n        height=\"32\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeWidth=\"1.5\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <rect x=\"3\" y=\"5\" width=\"18\" height=\"14\" rx=\"2\" />\n        <path d=\"m10 9 5 3-5 3z\" />\n        <path d=\"m3 3 18 18\" />\n      </svg>\n      <span>Video not found</span>\n    </div>\n  );\n}\n\n/**\n * An HTML5 `video` sourced from a resolved media prop; the file is served\n * as uploaded (no transcoding). Without a URL it renders nothing on a\n * published page — but in the editor preview it renders a placeholder, so a\n * Video block with no media assigned can still be seen and selected. A\n * reference whose asset was deleted gets its own placeholder, so the editor can\n * tell it apart from an unset one.\n *\n * A deleted *poster* needs no such handling: its URL is dropped with the rest\n * of the missing value, so the player simply renders without one.\n *\n * Editor previews render the player inert: the native controls are hidden so\n * a canvas click selects the block instead of toggling playback (a video\n * without controls ignores clicks, and the events bubble to the bridge's\n * selection handler — pointer-events must stay on, or the node would be\n * unhoverable since its annotation wrapper has no box of its own), and\n * autoplay is suppressed so nothing plays while editing.\n *\n * A replaced element renders at the file's intrinsic pixel size by default,\n * which overflows any smaller container (e.g. a section column) — so the\n * responsive default `max-width: 100%; height: auto` is baked in. The Style\n * tab still wins: its compiled sheet applies with `!important`, and explicit\n * inline `style` values override the defaults via merge order.\n */\nexport function Video({\n  media,\n  poster,\n  controls,\n  autoplay,\n  loop,\n  muted,\n  playsinline,\n  preload,\n  className,\n  style,\n  editor,\n}: VideoProps) {\n  if (media?.missing) {\n    return editor ? <MissingVideoPlaceholder className={className} style={style} /> : null;\n  }\n\n  const url = media?.url;\n  if (!url) {\n    return editor ? <VideoPlaceholder className={className} style={style} /> : null;\n  }\n\n  const baseStyle: CSSProperties = { maxWidth: \"100%\", height: \"auto\", ...style };\n\n  return (\n    <video\n      src={url}\n      poster={poster?.url || undefined}\n      controls={editor ? false : controls}\n      autoPlay={editor ? false : autoplay}\n      loop={loop}\n      muted={muted}\n      playsInline={playsinline}\n      preload={preload}\n      className={className}\n      style={baseStyle}\n    />\n  );\n}\n"],"mappings":"AAsCM,SAWE,KAXF;AAjBN,SAAS,iBAAiB,EAAE,WAAW,MAAM,GAAkD;AAC7F,SACE;AAAA,IAAC;AAAA;AAAA,MACC,kCAA+B;AAAA,MAC/B;AAAA,MACA,OAAO;AAAA,QACL,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,gBAAgB;AAAA,QAChB,WAAW;AAAA,QACX,QAAQ;AAAA,QACR,cAAc;AAAA,QACd,YAAY;AAAA,QACZ,OAAO;AAAA,QACP,GAAG;AAAA,MACL;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,OAAM;AAAA,UACN,QAAO;AAAA,UACP,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,QAAO;AAAA,UACP,aAAY;AAAA,UACZ,eAAc;AAAA,UACd,gBAAe;AAAA,UACf,eAAY;AAAA,UAEZ;AAAA,gCAAC,UAAK,GAAE,KAAI,GAAE,KAAI,OAAM,MAAK,QAAO,MAAK,IAAG,KAAI;AAAA,YAChD,oBAAC,UAAK,GAAE,kBAAiB;AAAA;AAAA;AAAA,MAC3B;AAAA;AAAA,EACF;AAEJ;AAQA,SAAS,wBAAwB;AAAA,EAC/B;AAAA,EACA;AACF,GAGG;AACD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,8BAA2B;AAAA,MAC3B;AAAA,MACA,OAAM;AAAA,MACN,OAAO;AAAA,QACL,SAAS;AAAA,QACT,eAAe;AAAA,QACf,YAAY;AAAA,QACZ,gBAAgB;AAAA,QAChB,KAAK;AAAA,QACL,WAAW;AAAA,QACX,SAAS;AAAA,QACT,QAAQ;AAAA,QACR,cAAc;AAAA,QACd,YAAY;AAAA,QACZ,OAAO;AAAA,QACP,MAAM;AAAA,QACN,WAAW;AAAA,QACX,GAAG;AAAA,MACL;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,OAAM;AAAA,YACN,QAAO;AAAA,YACP,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,QAAO;AAAA,YACP,aAAY;AAAA,YACZ,eAAc;AAAA,YACd,gBAAe;AAAA,YACf,eAAY;AAAA,YAEZ;AAAA,kCAAC,UAAK,GAAE,KAAI,GAAE,KAAI,OAAM,MAAK,QAAO,MAAK,IAAG,KAAI;AAAA,cAChD,oBAAC,UAAK,GAAE,kBAAiB;AAAA,cACzB,oBAAC,UAAK,GAAE,cAAa;AAAA;AAAA;AAAA,QACvB;AAAA,QACA,oBAAC,UAAK,6BAAe;AAAA;AAAA;AAAA,EACvB;AAEJ;AA0BO,SAAS,MAAM;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAe;AACb,MAAI,OAAO,SAAS;AAClB,WAAO,SAAS,oBAAC,2BAAwB,WAAsB,OAAc,IAAK;AAAA,EACpF;AAEA,QAAM,MAAM,OAAO;AACnB,MAAI,CAAC,KAAK;AACR,WAAO,SAAS,oBAAC,oBAAiB,WAAsB,OAAc,IAAK;AAAA,EAC7E;AAEA,QAAM,YAA2B,EAAE,UAAU,QAAQ,QAAQ,QAAQ,GAAG,MAAM;AAE9E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,QAAQ,QAAQ,OAAO;AAAA,MACvB,UAAU,SAAS,QAAQ;AAAA,MAC3B,UAAU,SAAS,QAAQ;AAAA,MAC3B;AAAA,MACA;AAAA,MACA,aAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA,OAAO;AAAA;AAAA,EACT;AAEJ;","names":[]}

package/dist/context.d.ts

@@ -0,0 +1,26 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { PlenaryClient, ClientConfig } from '@plenary/client';
+
+interface PlenaryProviderProps {
+    /** An already-created client (client-rendered apps). */
+    client?: PlenaryClient;
+    /**
+     * Or the client config, from which the provider creates one. This is the
+     * RSC-safe path: a client instance cannot cross a server/client component
+     * boundary, but plain config can (the API key is a public delivery key, so
+     * shipping it to the browser is by design).
+     */
+    config?: ClientConfig;
+    children?: ReactNode;
+}
+/**
+ * Provides a `PlenaryClient` to components that act at runtime in the browser —
+ * today the built-in Form block, which submits through it. Rendering content
+ * does not require the provider; only interactive blocks do.
+ */
+declare function PlenaryProvider({ client, config, children }: PlenaryProviderProps): react.JSX.Element;
+/** The nearest provided client, or `null` outside a {@link PlenaryProvider}. */
+declare function usePlenaryClient(): PlenaryClient | null;
+
+export { PlenaryProvider, type PlenaryProviderProps, usePlenaryClient };

package/dist/context.js

@@ -0,0 +1,20 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { createContext, useContext, useMemo } from "react";
+import { createClient } from "@plenary/client";
+const PlenaryClientContext = createContext(null);
+function PlenaryProvider({ client, config, children }) {
+  const value = useMemo(
+    () => client ?? (config ? createClient(config) : null),
+    [client, config?.baseUrl, config?.siteKey, config?.apiKey, config?.locale, config?.fetch]
+  );
+  return /* @__PURE__ */ jsx(PlenaryClientContext.Provider, { value, children });
+}
+function usePlenaryClient() {
+  return useContext(PlenaryClientContext);
+}
+export {
+  PlenaryProvider,
+  usePlenaryClient
+};
+//# sourceMappingURL=context.js.map

package/dist/context.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/context.tsx"],"sourcesContent":["\"use client\";\n\nimport { createContext, useContext, useMemo, type ReactNode } from \"react\";\nimport { createClient, type ClientConfig, type PlenaryClient } from \"@plenary/client\";\n\nconst PlenaryClientContext = createContext<PlenaryClient | null>(null);\n\nexport interface PlenaryProviderProps {\n  /** An already-created client (client-rendered apps). */\n  client?: PlenaryClient;\n  /**\n   * Or the client config, from which the provider creates one. This is the\n   * RSC-safe path: a client instance cannot cross a server/client component\n   * boundary, but plain config can (the API key is a public delivery key, so\n   * shipping it to the browser is by design).\n   */\n  config?: ClientConfig;\n  children?: ReactNode;\n}\n\n/**\n * Provides a `PlenaryClient` to components that act at runtime in the browser —\n * today the built-in Form block, which submits through it. Rendering content\n * does not require the provider; only interactive blocks do.\n */\nexport function PlenaryProvider({ client, config, children }: PlenaryProviderProps) {\n  // Keyed on config fields, not object identity — an inline config literal\n  // must not rebuild the client (and re-render every consumer) each render.\n  const value = useMemo(\n    () => client ?? (config ? createClient(config) : null),\n    [client, config?.baseUrl, config?.siteKey, config?.apiKey, config?.locale, config?.fetch],\n  );\n  return <PlenaryClientContext.Provider value={value}>{children}</PlenaryClientContext.Provider>;\n}\n\n/** The nearest provided client, or `null` outside a {@link PlenaryProvider}. */\nexport function usePlenaryClient(): PlenaryClient | null {\n  return useContext(PlenaryClientContext);\n}\n"],"mappings":";AAgCS;AA9BT,SAAS,eAAe,YAAY,eAA+B;AACnE,SAAS,oBAA2D;AAEpE,MAAM,uBAAuB,cAAoC,IAAI;AAoB9D,SAAS,gBAAgB,EAAE,QAAQ,QAAQ,SAAS,GAAyB;AAGlF,QAAM,QAAQ;AAAA,IACZ,MAAM,WAAW,SAAS,aAAa,MAAM,IAAI;AAAA,IACjD,CAAC,QAAQ,QAAQ,SAAS,QAAQ,SAAS,QAAQ,QAAQ,QAAQ,QAAQ,QAAQ,KAAK;AAAA,EAC1F;AACA,SAAO,oBAAC,qBAAqB,UAArB,EAA8B,OAAe,UAAS;AAChE;AAGO,SAAS,mBAAyC;AACvD,SAAO,WAAW,oBAAoB;AACxC;","names":[]}

package/dist/form.d.ts

@@ -0,0 +1,25 @@
+import { PublicFormDefinition } from '@plenary/client';
+
+/** The raw value a `form` prop holds in the dom: a pointer to a form by key. */
+interface FormValue {
+    form_key?: string;
+    /** Present when the value was already resolved (the preview inlines it). */
+    definition?: PublicFormDefinition | null;
+}
+/**
+ * The shape a component sees after resolution. `definition` is `null` when the
+ * form could not be fetched (deleted, inactive, not on this site, no client).
+ */
+interface ResolvedForm {
+    form_key: string;
+    definition: PublicFormDefinition | null;
+}
+/**
+ * Merge a form prop value with its (optional) fetched definition into the
+ * resolved shape a component sees. Pure and synchronous — the renderer calls it
+ * after a batch definition fetch. A value that already carries a definition
+ * (the preview inlines one) is used as-is.
+ */
+declare function toResolvedForm(value: FormValue | null | undefined, definition?: PublicFormDefinition | null): ResolvedForm | null;
+
+export { type FormValue, type ResolvedForm, toResolvedForm };

package/dist/form.js

@@ -0,0 +1,11 @@
+function toResolvedForm(value, definition) {
+  if (!value || !value.form_key) return null;
+  return {
+    form_key: value.form_key,
+    definition: value.definition !== void 0 ? value.definition : definition ?? null
+  };
+}
+export {
+  toResolvedForm
+};
+//# sourceMappingURL=form.js.map

package/dist/form.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/form.ts"],"sourcesContent":["import type { PublicFormDefinition } from \"@plenary/client\";\n\n/** The raw value a `form` prop holds in the dom: a pointer to a form by key. */\nexport interface FormValue {\n  form_key?: string;\n  /** Present when the value was already resolved (the preview inlines it). */\n  definition?: PublicFormDefinition | null;\n}\n\n/**\n * The shape a component sees after resolution. `definition` is `null` when the\n * form could not be fetched (deleted, inactive, not on this site, no client).\n */\nexport interface ResolvedForm {\n  form_key: string;\n  definition: PublicFormDefinition | null;\n}\n\n/**\n * Merge a form prop value with its (optional) fetched definition into the\n * resolved shape a component sees. Pure and synchronous — the renderer calls it\n * after a batch definition fetch. A value that already carries a definition\n * (the preview inlines one) is used as-is.\n */\nexport function toResolvedForm(\n  value: FormValue | null | undefined,\n  definition?: PublicFormDefinition | null,\n): ResolvedForm | null {\n  if (!value || !value.form_key) return null;\n  return {\n    form_key: value.form_key,\n    definition: value.definition !== undefined ? value.definition : (definition ?? null),\n  };\n}\n"],"mappings":"AAwBO,SAAS,eACd,OACA,YACqB;AACrB,MAAI,CAAC,SAAS,CAAC,MAAM,SAAU,QAAO;AACtC,SAAO;AAAA,IACL,UAAU,MAAM;AAAA,IAChB,YAAY,MAAM,eAAe,SAAY,MAAM,aAAc,cAAc;AAAA,EACjF;AACF;","names":[]}

package/dist/index.d.ts

@@ -0,0 +1,16 @@
+export { PlenaryPage, PlenaryPageProps, SyncRenderOptions, renderDocument, renderDocumentSync } from './render.js';
+export { Plenary, Registry, getManifest, getTheme, register, registerTheme, registry } from './registry.js';
+export { Box, BoxProps } from './components/Box.js';
+export { Section, SectionProps } from './components/Section.js';
+export { Text, TextProps } from './components/Text.js';
+export { Image, ImageProps } from './components/Image.js';
+export { Video, VideoProps } from './components/Video.js';
+export { Form, FormProps } from './components/Form.js';
+export { Placeholder, PlaceholderProps } from './components/Placeholder.js';
+export { MediaValue, ResolvedMedia, resolveMedia, toResolvedMedia } from './media.js';
+export { FormValue, ResolvedForm, toResolvedForm } from './form.js';
+export { PlenaryProvider, PlenaryProviderProps, usePlenaryClient } from './context.js';
+export { PlenaryComponent, RegisteredComponent, RenderContext, SlotProps } from './types.js';
+import 'react';
+import '@plenary/client';
+import '@plenary/core';

package/dist/index.js

@@ -0,0 +1,55 @@
+import {
+  PlenaryPage,
+  renderDocument,
+  renderDocumentSync
+} from "./render.js";
+import {
+  Registry,
+  registry,
+  register,
+  registerTheme,
+  Plenary,
+  getManifest,
+  getTheme
+} from "./registry.js";
+import { Box } from "./components/Box.js";
+import { Section } from "./components/Section.js";
+import { Text } from "./components/Text.js";
+import { Image } from "./components/Image.js";
+import { Video } from "./components/Video.js";
+import { Form } from "./components/Form.js";
+import { Placeholder } from "./components/Placeholder.js";
+import {
+  resolveMedia,
+  toResolvedMedia
+} from "./media.js";
+import { toResolvedForm } from "./form.js";
+import {
+  PlenaryProvider,
+  usePlenaryClient
+} from "./context.js";
+export {
+  Box,
+  Form,
+  Image,
+  Placeholder,
+  Plenary,
+  PlenaryPage,
+  PlenaryProvider,
+  Registry,
+  Section,
+  Text,
+  Video,
+  getManifest,
+  getTheme,
+  register,
+  registerTheme,
+  registry,
+  renderDocument,
+  renderDocumentSync,
+  resolveMedia,
+  toResolvedForm,
+  toResolvedMedia,
+  usePlenaryClient
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["/**\n * @plenary/react — the DOM renderer, component registry, and built-in\n * components (Box/Section/Text/Image/Video/Form) for rendering a Page's `dom`\n * tree. Custom components register on top of the built-ins. The preview bridge\n * lands in Phase 5.\n */\n\nexport {\n  PlenaryPage,\n  renderDocument,\n  renderDocumentSync,\n  type PlenaryPageProps,\n  type SyncRenderOptions,\n} from \"./render.js\";\nexport {\n  Registry,\n  registry,\n  register,\n  registerTheme,\n  Plenary,\n  getManifest,\n  getTheme,\n} from \"./registry.js\";\nexport { Box, type BoxProps } from \"./components/Box.js\";\nexport { Section, type SectionProps } from \"./components/Section.js\";\nexport { Text, type TextProps } from \"./components/Text.js\";\nexport { Image, type ImageProps } from \"./components/Image.js\";\nexport { Video, type VideoProps } from \"./components/Video.js\";\nexport { Form, type FormProps } from \"./components/Form.js\";\nexport { Placeholder, type PlaceholderProps } from \"./components/Placeholder.js\";\nexport {\n  resolveMedia,\n  toResolvedMedia,\n  type MediaValue,\n  type ResolvedMedia,\n} from \"./media.js\";\nexport { toResolvedForm, type FormValue, type ResolvedForm } from \"./form.js\";\nexport {\n  PlenaryProvider,\n  usePlenaryClient,\n  type PlenaryProviderProps,\n} from \"./context.js\";\nexport type {\n  PlenaryComponent,\n  RegisteredComponent,\n  RenderContext,\n  SlotProps,\n} from \"./types.js\";\n"],"mappings":"AAOA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,WAA0B;AACnC,SAAS,eAAkC;AAC3C,SAAS,YAA4B;AACrC,SAAS,aAA8B;AACvC,SAAS,aAA8B;AACvC,SAAS,YAA4B;AACrC,SAAS,mBAA0C;AACnD;AAAA,EACE;AAAA,EACA;AAAA,OAGK;AACP,SAAS,sBAAyD;AAClE;AAAA,EACE;AAAA,EACA;AAAA,OAEK;","names":[]}

package/dist/media.d.ts

@@ -0,0 +1,60 @@
+import { PlenaryClient, MediaDetail } from '@plenary/client';
+
+/** The raw value an `image`/`file` prop holds in the dom: a media pointer. */
+interface MediaValue {
+    media_id?: string;
+    alt?: string;
+    caption?: string;
+    /** Present when the value was already resolved (carries a URL). */
+    url?: string;
+    variants?: Record<string, string>;
+    /** Server-hydrated URL of the block's one-off variant spec (Image block). */
+    variant_url?: string;
+    width?: number;
+    height?: number;
+    /**
+     * Set when the referenced asset no longer exists. The editor preview marks
+     * values whose detail lookup 404s, so the renderer can tell a dangling
+     * pointer from one it simply has not resolved yet.
+     */
+    missing?: boolean;
+}
+/** The shape a component sees after resolution. `url` is `""` when unresolved. */
+interface ResolvedMedia {
+    media_id?: string;
+    url: string;
+    alt: string;
+    variants: Record<string, string>;
+    /** Server-hydrated URL of the block's one-off variant spec (Image block). */
+    variant_url?: string;
+    caption?: string;
+    width?: number;
+    height?: number;
+    /** The asset this value points at was deleted — the reference is dangling. */
+    missing?: boolean;
+}
+/**
+ * Merge a media prop value with its (optional) fetched detail into the resolved
+ * shape a component sees. Pure and synchronous — the renderer calls it after a
+ * batch media fetch. When the value is already resolved it is used as-is; when
+ * no detail is available the result is unresolved (empty `url`).
+ *
+ * `missing` reports that the lookup found the asset gone (a 404, not a failure
+ * to fetch); the value's own `missing` flag says the same thing when the
+ * console resolved it. Either way every URL on the value is dropped: the server
+ * derives an Image block's `variant_url` by content address, without checking
+ * the asset still exists, so a stored one outlives the file it names.
+ */
+declare function toResolvedMedia(value: MediaValue | null | undefined, detail?: MediaDetail | null, missing?: boolean): ResolvedMedia | null;
+/**
+ * Resolve a media-typed prop value to `{ url, alt, variants }`.
+ *
+ * - A value already carrying a `url` is used as-is — no fetch.
+ * - A bare `{ media_id }` is fetched via the client. A 404 means the asset was
+ *   deleted, and resolves to a `missing` value; any other failure degrades to
+ *   an unresolved value (empty `url`) rather than throwing.
+ * - Anything without a `media_id` or `url` resolves to `null`.
+ */
+declare function resolveMedia(value: MediaValue | null | undefined, client?: PlenaryClient): Promise<ResolvedMedia | null>;
+
+export { type MediaValue, type ResolvedMedia, resolveMedia, toResolvedMedia };

package/dist/media.js

@@ -0,0 +1,74 @@
+import { PlenaryNotFoundError } from "@plenary/client";
+function readyVariants(detail) {
+  const out = {};
+  for (const [key, v] of Object.entries(detail.variants ?? {})) {
+    if (v.url) out[key] = v.url;
+  }
+  return out;
+}
+function isResolved(value) {
+  return typeof value.url === "string" && value.url !== "";
+}
+function toResolvedMedia(value, detail, missing) {
+  if (!value) return null;
+  if ((missing || value.missing) && value.media_id) {
+    return {
+      media_id: value.media_id,
+      url: "",
+      alt: value.alt ?? value.caption ?? "",
+      variants: {},
+      caption: value.caption,
+      missing: true
+    };
+  }
+  if (isResolved(value)) {
+    return {
+      media_id: value.media_id,
+      url: value.url,
+      alt: value.alt ?? value.caption ?? "",
+      variants: value.variants ?? {},
+      variant_url: value.variant_url,
+      caption: value.caption,
+      width: value.width,
+      height: value.height
+    };
+  }
+  if (detail) {
+    return {
+      media_id: detail.media_id,
+      url: detail.original_url,
+      alt: value.alt ?? detail.label ?? detail.description ?? "",
+      variants: readyVariants(detail),
+      variant_url: value.variant_url,
+      caption: value.caption,
+      width: detail.width,
+      height: detail.height
+    };
+  }
+  if (value.media_id) {
+    return {
+      media_id: value.media_id,
+      url: "",
+      alt: value.alt ?? value.caption ?? "",
+      variants: {},
+      variant_url: value.variant_url,
+      caption: value.caption
+    };
+  }
+  return null;
+}
+async function resolveMedia(value, client) {
+  if (!value || isResolved(value) || !value.media_id || !client) {
+    return toResolvedMedia(value);
+  }
+  try {
+    return toResolvedMedia(value, await client.getMedia(value.media_id));
+  } catch (err) {
+    return toResolvedMedia(value, null, err instanceof PlenaryNotFoundError);
+  }
+}
+export {
+  resolveMedia,
+  toResolvedMedia
+};
+//# sourceMappingURL=media.js.map

package/dist/media.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/media.ts"],"sourcesContent":["import { PlenaryNotFoundError, type PlenaryClient, type MediaDetail } from \"@plenary/client\";\n\n/** The raw value an `image`/`file` prop holds in the dom: a media pointer. */\nexport interface MediaValue {\n  media_id?: string;\n  alt?: string;\n  caption?: string;\n  /** Present when the value was already resolved (carries a URL). */\n  url?: string;\n  variants?: Record<string, string>;\n  /** Server-hydrated URL of the block's one-off variant spec (Image block). */\n  variant_url?: string;\n  width?: number;\n  height?: number;\n  /**\n   * Set when the referenced asset no longer exists. The editor preview marks\n   * values whose detail lookup 404s, so the renderer can tell a dangling\n   * pointer from one it simply has not resolved yet.\n   */\n  missing?: boolean;\n}\n\n/** The shape a component sees after resolution. `url` is `\"\"` when unresolved. */\nexport interface ResolvedMedia {\n  media_id?: string;\n  url: string;\n  alt: string;\n  variants: Record<string, string>;\n  /** Server-hydrated URL of the block's one-off variant spec (Image block). */\n  variant_url?: string;\n  caption?: string;\n  width?: number;\n  height?: number;\n  /** The asset this value points at was deleted — the reference is dangling. */\n  missing?: boolean;\n}\n\nfunction readyVariants(detail: MediaDetail): Record<string, string> {\n  const out: Record<string, string> = {};\n  for (const [key, v] of Object.entries(detail.variants ?? {})) {\n    if (v.url) out[key] = v.url;\n  }\n  return out;\n}\n\n/** True when the value already carries a URL and needs no client fetch. */\nfunction isResolved(value: MediaValue): value is MediaValue & { url: string } {\n  return typeof value.url === \"string\" && value.url !== \"\";\n}\n\n/**\n * Merge a media prop value with its (optional) fetched detail into the resolved\n * shape a component sees. Pure and synchronous — the renderer calls it after a\n * batch media fetch. When the value is already resolved it is used as-is; when\n * no detail is available the result is unresolved (empty `url`).\n *\n * `missing` reports that the lookup found the asset gone (a 404, not a failure\n * to fetch); the value's own `missing` flag says the same thing when the\n * console resolved it. Either way every URL on the value is dropped: the server\n * derives an Image block's `variant_url` by content address, without checking\n * the asset still exists, so a stored one outlives the file it names.\n */\nexport function toResolvedMedia(\n  value: MediaValue | null | undefined,\n  detail?: MediaDetail | null,\n  missing?: boolean,\n): ResolvedMedia | null {\n  if (!value) return null;\n\n  if ((missing || value.missing) && value.media_id) {\n    return {\n      media_id: value.media_id,\n      url: \"\",\n      alt: value.alt ?? value.caption ?? \"\",\n      variants: {},\n      caption: value.caption,\n      missing: true,\n    };\n  }\n\n  if (isResolved(value)) {\n    return {\n      media_id: value.media_id,\n      url: value.url,\n      alt: value.alt ?? value.caption ?? \"\",\n      variants: value.variants ?? {},\n      variant_url: value.variant_url,\n      caption: value.caption,\n      width: value.width,\n      height: value.height,\n    };\n  }\n\n  if (detail) {\n    return {\n      media_id: detail.media_id,\n      url: detail.original_url,\n      alt: value.alt ?? detail.label ?? detail.description ?? \"\",\n      variants: readyVariants(detail),\n      variant_url: value.variant_url,\n      caption: value.caption,\n      width: detail.width,\n      height: detail.height,\n    };\n  }\n\n  if (value.media_id) {\n    return {\n      media_id: value.media_id,\n      url: \"\",\n      alt: value.alt ?? value.caption ?? \"\",\n      variants: {},\n      variant_url: value.variant_url,\n      caption: value.caption,\n    };\n  }\n\n  return null;\n}\n\n/**\n * Resolve a media-typed prop value to `{ url, alt, variants }`.\n *\n * - A value already carrying a `url` is used as-is — no fetch.\n * - A bare `{ media_id }` is fetched via the client. A 404 means the asset was\n *   deleted, and resolves to a `missing` value; any other failure degrades to\n *   an unresolved value (empty `url`) rather than throwing.\n * - Anything without a `media_id` or `url` resolves to `null`.\n */\nexport async function resolveMedia(\n  value: MediaValue | null | undefined,\n  client?: PlenaryClient,\n): Promise<ResolvedMedia | null> {\n  if (!value || isResolved(value) || !value.media_id || !client) {\n    return toResolvedMedia(value);\n  }\n  try {\n    return toResolvedMedia(value, await client.getMedia(value.media_id));\n  } catch (err) {\n    return toResolvedMedia(value, null, err instanceof PlenaryNotFoundError);\n  }\n}\n"],"mappings":"AAAA,SAAS,4BAAkE;AAqC3E,SAAS,cAAc,QAA6C;AAClE,QAAM,MAA8B,CAAC;AACrC,aAAW,CAAC,KAAK,CAAC,KAAK,OAAO,QAAQ,OAAO,YAAY,CAAC,CAAC,GAAG;AAC5D,QAAI,EAAE,IAAK,KAAI,GAAG,IAAI,EAAE;AAAA,EAC1B;AACA,SAAO;AACT;AAGA,SAAS,WAAW,OAA0D;AAC5E,SAAO,OAAO,MAAM,QAAQ,YAAY,MAAM,QAAQ;AACxD;AAcO,SAAS,gBACd,OACA,QACA,SACsB;AACtB,MAAI,CAAC,MAAO,QAAO;AAEnB,OAAK,WAAW,MAAM,YAAY,MAAM,UAAU;AAChD,WAAO;AAAA,MACL,UAAU,MAAM;AAAA,MAChB,KAAK;AAAA,MACL,KAAK,MAAM,OAAO,MAAM,WAAW;AAAA,MACnC,UAAU,CAAC;AAAA,MACX,SAAS,MAAM;AAAA,MACf,SAAS;AAAA,IACX;AAAA,EACF;AAEA,MAAI,WAAW,KAAK,GAAG;AACrB,WAAO;AAAA,MACL,UAAU,MAAM;AAAA,MAChB,KAAK,MAAM;AAAA,MACX,KAAK,MAAM,OAAO,MAAM,WAAW;AAAA,MACnC,UAAU,MAAM,YAAY,CAAC;AAAA,MAC7B,aAAa,MAAM;AAAA,MACnB,SAAS,MAAM;AAAA,MACf,OAAO,MAAM;AAAA,MACb,QAAQ,MAAM;AAAA,IAChB;AAAA,EACF;AAEA,MAAI,QAAQ;AACV,WAAO;AAAA,MACL,UAAU,OAAO;AAAA,MACjB,KAAK,OAAO;AAAA,MACZ,KAAK,MAAM,OAAO,OAAO,SAAS,OAAO,eAAe;AAAA,MACxD,UAAU,cAAc,MAAM;AAAA,MAC9B,aAAa,MAAM;AAAA,MACnB,SAAS,MAAM;AAAA,MACf,OAAO,OAAO;AAAA,MACd,QAAQ,OAAO;AAAA,IACjB;AAAA,EACF;AAEA,MAAI,MAAM,UAAU;AAClB,WAAO;AAAA,MACL,UAAU,MAAM;AAAA,MAChB,KAAK;AAAA,MACL,KAAK,MAAM,OAAO,MAAM,WAAW;AAAA,MACnC,UAAU,CAAC;AAAA,MACX,aAAa,MAAM;AAAA,MACnB,SAAS,MAAM;AAAA,IACjB;AAAA,EACF;AAEA,SAAO;AACT;AAWA,eAAsB,aACpB,OACA,QAC+B;AAC/B,MAAI,CAAC,SAAS,WAAW,KAAK,KAAK,CAAC,MAAM,YAAY,CAAC,QAAQ;AAC7D,WAAO,gBAAgB,KAAK;AAAA,EAC9B;AACA,MAAI;AACF,WAAO,gBAAgB,OAAO,MAAM,OAAO,SAAS,MAAM,QAAQ,CAAC;AAAA,EACrE,SAAS,KAAK;AACZ,WAAO,gBAAgB,OAAO,MAAM,eAAe,oBAAoB;AAAA,EACzE;AACF;","names":[]}

package/dist/registry.d.ts

@@ -0,0 +1,45 @@
+import { ComponentRegistration, ThemeRegistration, ManifestComponent } from '@plenary/core';
+import { PlenaryComponent, RegisteredComponent } from './types.js';
+import 'react';
+import '@plenary/client';
+
+/**
+ * The module-singleton component registry. Because it is a shared module, both
+ * the render path (SSR + client) and the preview bridge see the same
+ * registrations — the site's registry file is imported wherever either is used.
+ */
+declare class Registry {
+    private components;
+    private theme;
+    constructor();
+    /** Register a component (built-in or custom) under its registration key. */
+    register(component: PlenaryComponent, registration: ComponentRegistration): this;
+    /**
+     * Declare the site's design tokens. Each token mirrors a CSS custom property
+     * the site's stylesheet defines (`--<name>`); the editor stores references
+     * (`var(--<name>)`), so the tokens must actually exist in the site's CSS for
+     * styled pages to render.
+     */
+    registerTheme(theme: ThemeRegistration): this;
+    getTheme(): ThemeRegistration | undefined;
+    get(key: string): RegisteredComponent | undefined;
+    all(): RegisteredComponent[];
+    /** The full component manifest announced to the console over the bridge. */
+    manifest(): ManifestComponent[];
+}
+declare const registry: Registry;
+/** Register a component so the dom tree may reference it by key. */
+declare function register(component: PlenaryComponent, registration: ComponentRegistration): Registry;
+/** Declare the site's design tokens (see Registry.registerTheme). */
+declare function registerTheme(theme: ThemeRegistration): Registry;
+/** Namespace mirroring the design brief's `Plenary.register(...)` surface. */
+declare const Plenary: {
+    register: typeof register;
+    registerTheme: typeof registerTheme;
+};
+/** The manifest of every registered component (built-ins + custom). */
+declare function getManifest(): ManifestComponent[];
+/** The site's registered design tokens, if any. */
+declare function getTheme(): ThemeRegistration | undefined;
+
+export { Plenary, Registry, getManifest, getTheme, register, registerTheme, registry };