@particle-academy/fancy-cms-ui 0.0.1-dev.1 → 0.0.1-dev.3

package/dist/registry-Bk7GN1rA.d.cts

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+import { N as Node, P as PageDoc } from './types-CpfPEq3V.cjs';
+
+interface ElementContext {
+    node: Node;
+    doc: PageDoc;
+    /** Pre-rendered child nodes, in order. */
+    children: ReactNode;
+}
+/**
+ * Renders the INNER content of a node. The outer `[data-cms]` wrapper is added
+ * by {@link RenderNode}, so a renderer only returns what goes inside.
+ */
+type ElementRenderer = (ctx: ElementContext) => ReactNode;
+type ElementRegistry = Record<string, ElementRenderer>;
+/** Built-in native elements. Containers render their children; leaves render content. */
+declare const defaultRegistry: ElementRegistry;
+
+export { type ElementContext as E, type ElementRegistry as a, type ElementRenderer as b, defaultRegistry as d };

package/dist/registry-Dht9JBLU.d.ts

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+import { N as Node, P as PageDoc } from './types-CpfPEq3V.js';
+
+interface ElementContext {
+    node: Node;
+    doc: PageDoc;
+    /** Pre-rendered child nodes, in order. */
+    children: ReactNode;
+}
+/**
+ * Renders the INNER content of a node. The outer `[data-cms]` wrapper is added
+ * by {@link RenderNode}, so a renderer only returns what goes inside.
+ */
+type ElementRenderer = (ctx: ElementContext) => ReactNode;
+type ElementRegistry = Record<string, ElementRenderer>;
+/** Built-in native elements. Containers render their children; leaves render content. */
+declare const defaultRegistry: ElementRegistry;
+
+export { type ElementContext as E, type ElementRegistry as a, type ElementRenderer as b, defaultRegistry as d };

package/dist/{types-DKCl14aV.d.cts → types-CpfPEq3V.d.cts}

@@ -142,6 +142,12 @@ interface Node {
         each: Binding;
         as: string;
     };
+    /**
+     * Host CSS class(es) applied to the node's element. The migration enabler:
+     * reuse the host site's existing stylesheet for pixel-perfect reproduction
+     * instead of re-deriving every rule through {@link StyleProps}.
+     */
+    className?: string;
     /** Derived from the addon manifest — interactive/3rd-party ⇒ hydration island. */
     island?: boolean;
 }

package/dist/{types-DKCl14aV.d.ts → types-CpfPEq3V.d.ts}

@@ -142,6 +142,12 @@ interface Node {
         each: Binding;
         as: string;
     };
+    /**
+     * Host CSS class(es) applied to the node's element. The migration enabler:
+     * reuse the host site's existing stylesheet for pixel-perfect reproduction
+     * instead of re-deriving every rule through {@link StyleProps}.
+     */
+    className?: string;
     /** Derived from the addon manifest — interactive/3rd-party ⇒ hydration island. */
     island?: boolean;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@particle-academy/fancy-cms-ui",
-  "version": "0.0.1-dev.1",
+  "version": "0.0.1-dev.3",
   "description": "Editor + isomorphic renderer for fancy-cms — the Stages document model, PageOp op-spine, the JS style→CSS emitter (one half of the dual-emitter pair with the PHP particle-academy/fancy-cms), and the React renderer. Built on the Fancy UI suite.",
   "repository": {
     "type": "git",

package/dist/chunk-MRWUUNJR.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/react/registry.tsx","../src/react/RenderNode.tsx","../src/react/CmsPage.tsx"],"names":["jsx"],"mappings":";;;;AAmBA,SAAS,QAAQ,CAAA,EAAoC;AACnD,EAAA,IAAI,CAAA,KAAM,MAAA,IAAa,CAAA,KAAM,IAAA,EAAM,OAAO,EAAA;AAC1C,EAAA,IAAI,SAAA,CAAU,CAAC,CAAA,EAAG,OAAO,EAAA;AACzB,EAAA,OAAO,OAAO,CAAC,CAAA;AACjB;AAGO,IAAM,eAAA,GAAmC;AAAA,EAC9C,OAAA,EAAS,CAAC,EAAE,QAAA,EAAS,KAAM,QAAA;AAAA,EAC3B,KAAA,EAAO,CAAC,EAAE,QAAA,EAAS,KAAM,QAAA;AAAA,EACzB,IAAA,EAAM,CAAC,EAAE,QAAA,EAAS,KAAM,QAAA;AAAA,EACxB,KAAA,EAAO,CAAC,EAAE,QAAA,EAAS,KAAM,QAAA;AAAA,EACzB,KAAA,EAAO,CAAC,EAAE,QAAA,EAAS,KAAM,QAAA;AAAA,EACzB,IAAA,EAAM,CAAC,EAAE,IAAA,OAAW,OAAA,CAAQ,IAAA,CAAK,MAAM,OAAO,CAAA;AAAA,EAC9C,KAAA,EAAO,CAAC,EAAE,IAAA,EAAK,qBACb,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,OAAA,CAAQ,IAAA,CAAK,KAAA,CAAM,GAAG,CAAA;AAAA,MAC3B,GAAA,EAAK,OAAA,CAAQ,IAAA,CAAK,KAAA,CAAM,GAAG,CAAA;AAAA,MAC3B,KAAA,EAAO,EAAE,KAAA,EAAO,MAAA,EAAQ,QAAQ,MAAA,EAAQ,SAAA,EAAW,OAAA,EAAS,OAAA,EAAS,OAAA;AAAQ;AAAA;AAGnF;ACvBO,SAAS,WAAW,EAAE,GAAA,EAAK,EAAA,EAAI,QAAA,GAAW,iBAAgB,EAAyC;AACxG,EAAA,MAAM,IAAA,GAAO,GAAA,CAAI,KAAA,CAAM,EAAE,CAAA;AACzB,EAAA,IAAI,CAAC,MAAM,OAAO,IAAA;AAElB,EAAA,MAAM,OAAO,UAAA,CAAW,GAAA,EAAK,EAAE,CAAA,CAAE,GAAA,CAAI,CAAC,KAAA,qBACpCA,GAAAA,CAAC,UAAA,EAAA,EAA0B,KAAU,EAAA,EAAI,KAAA,CAAM,IAAI,QAAA,EAAA,EAAlC,KAAA,CAAM,EAAgD,CACxE,CAAA;AAED,EAAA,MAAM,QAAA,GAAW,QAAA,CAAS,IAAA,CAAK,IAAI,CAAA;AACnC,EAAA,MAAM,KAAA,GAAQ,QAAA,GAAW,QAAA,CAAS,EAAE,IAAA,EAAM,GAAA,EAAK,QAAA,EAAU,IAAA,EAAM,CAAA,GAAI,IAAA,CAAK,MAAA,GAAS,IAAA,GAAO,IAAA;AAExF,EAAA,uBACEA,GAAAA,CAAC,KAAA,EAAA,EAAI,UAAA,EAAU,IAAA,CAAK,EAAA,EAAI,iBAAA,EAAiB,IAAA,CAAK,MAAA,GAAS,IAAA,CAAK,IAAA,GAAO,MAAA,EAChE,QAAA,EAAA,KAAA,EACH,CAAA;AAEJ;ACnBO,SAAS,OAAA,CAAQ;AAAA,EACtB,GAAA;AAAA,EACA,QAAA,GAAW,eAAA;AAAA,EACX,aAAA,GAAgB;AAClB,CAAA,EAA+B;AAC7B,EAAA,4BACG,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,IAAA,aAAA,mBAAgBA,IAAC,OAAA,EAAA,EAAM,iBAAA,EAAgB,IAAI,QAAA,EAAA,UAAA,CAAW,GAAG,GAAE,CAAA,GAAW,IAAA;AAAA,IACtE,GAAA,CAAI,QAAA,CAAS,GAAA,CAAI,CAAC,EAAA,qBACjBA,GAAAA,CAAC,UAAA,EAAA,EAAoB,GAAA,EAAU,EAAA,EAAQ,QAAA,EAAA,EAAtB,EAA0C,CAC5D;AAAA,GAAA,EACH,CAAA;AAEJ","file":"chunk-MRWUUNJR.js","sourcesContent":["import type { ReactNode } from \"react\";\nimport { isBinding, type Bound, type Json, type Node, type PageDoc } from \"../document/types\";\n\nexport interface ElementContext {\n  node: Node;\n  doc: PageDoc;\n  /** Pre-rendered child nodes, in order. */\n  children: ReactNode;\n}\n\n/**\n * Renders the INNER content of a node. The outer `[data-cms]` wrapper is added\n * by {@link RenderNode}, so a renderer only returns what goes inside.\n */\nexport type ElementRenderer = (ctx: ElementContext) => ReactNode;\n\nexport type ElementRegistry = Record<string, ElementRenderer>;\n\n/** Resolve a literal prop to a string (bindings resolve in Phase 3). */\nfunction literal(v: Bound<Json> | undefined): string {\n  if (v === undefined || v === null) return \"\";\n  if (isBinding(v)) return \"\";\n  return String(v);\n}\n\n/** Built-in native elements. Containers render their children; leaves render content. */\nexport const defaultRegistry: ElementRegistry = {\n  section: ({ children }) => children,\n  stack: ({ children }) => children,\n  grid: ({ children }) => children,\n  frame: ({ children }) => children,\n  shape: ({ children }) => children,\n  text: ({ node }) => literal(node.props.content),\n  image: ({ node }) => (\n    <img\n      src={literal(node.props.src)}\n      alt={literal(node.props.alt)}\n      style={{ width: \"100%\", height: \"100%\", objectFit: \"cover\", display: \"block\" }}\n    />\n  ),\n};\n","import type { ReactElement } from \"react\";\nimport type { PageDoc } from \"../document/types\";\nimport { childrenOf } from \"../document/reduce\";\nimport { defaultRegistry, type ElementRegistry } from \"./registry\";\n\nexport interface RenderNodeProps {\n  doc: PageDoc;\n  id: string;\n  registry?: ElementRegistry;\n}\n\n/**\n * Render one node (and its subtree) to a `[data-cms]`-tagged element. The CSS\n * emitted by `emitDocCss` targets these `data-cms` handles. Interactive /\n * 3rd-party **islands** with no registered renderer become an empty, sized\n * placeholder the host hydrates client-side — mirroring the PHP renderer.\n */\nexport function RenderNode({ doc, id, registry = defaultRegistry }: RenderNodeProps): ReactElement | null {\n  const node = doc.nodes[id];\n  if (!node) return null;\n\n  const kids = childrenOf(doc, id).map((child) => (\n    <RenderNode key={child.id} doc={doc} id={child.id} registry={registry} />\n  ));\n\n  const renderer = registry[node.type];\n  const inner = renderer ? renderer({ node, doc, children: kids }) : node.island ? null : kids;\n\n  return (\n    <div data-cms={node.id} data-cms-island={node.island ? node.type : undefined}>\n      {inner}\n    </div>\n  );\n}\n","import { Fragment, type ReactElement } from \"react\";\nimport type { PageDoc } from \"../document/types\";\nimport { emitDocCss } from \"../render/css\";\nimport { RenderNode } from \"./RenderNode\";\nimport { defaultRegistry, type ElementRegistry } from \"./registry\";\n\nexport interface CmsPageProps {\n  doc: PageDoc;\n  registry?: ElementRegistry;\n  /** Inject the compiled stylesheet. Set false when the host emits CSS itself. */\n  includeStyles?: boolean;\n}\n\n/** Render a full page document: the compiled stylesheet + every section. */\nexport function CmsPage({\n  doc,\n  registry = defaultRegistry,\n  includeStyles = true,\n}: CmsPageProps): ReactElement {\n  return (\n    <Fragment>\n      {includeStyles ? <style data-cms-styles=\"\">{emitDocCss(doc)}</style> : null}\n      {doc.sections.map((id) => (\n        <RenderNode key={id} doc={doc} id={id} registry={registry} />\n      ))}\n    </Fragment>\n  );\n}\n"]}