{"$schema":"https:\/\/ui.particle.academy\/schema\/registry-item.json","name":"cms-region","type":"registry:ui","title":"CmsRegion","description":"An editable \/ per-surface region within a CMS page.","package":"fancy-cms-ui","dependencies":[],"registryDependencies":["document","render"],"files":[{"path":"components\/fancy\/cms-region\/CmsRegion.tsx","content":"import { Fragment, type ReactElement } from \"react\";\r\nimport type { PageDoc } from \"..\/document\/types\";\r\nimport { emitDocCss } from \"..\/render\/css\";\r\nimport { RenderNode } from \".\/RenderNode\";\r\nimport { defaultRegistry, type ElementRegistry } from \".\/registry\";\r\n\r\nexport interface CmsRegionProps {\r\n  doc: PageDoc;\r\n  \/** Root node id of the region to render (a section, or any node). *\/\r\n  root: string;\r\n  registry?: ElementRegistry;\r\n  includeStyles?: boolean;\r\n}\r\n\r\n\/**\r\n * Render a single subtree \u2014 drop into a hand-coded page so the CMS owns just\r\n * that region (the \"guest, not host\" mounting mode). Phase 0\/1 emits the whole\r\n * document's CSS; scoping it to the subtree is a later optimization.\r\n *\/\r\nexport function CmsRegion({\r\n  doc,\r\n  root,\r\n  registry = defaultRegistry,\r\n  includeStyles = true,\r\n}: CmsRegionProps): ReactElement {\r\n  return (\r\n    <Fragment>\r\n      {includeStyles ? <style data-cms-styles=\"\">{emitDocCss(doc)}<\/style> : null}\r\n      <RenderNode doc={doc} id={root} registry={registry} \/>\r\n    <\/Fragment>\r\n  );\r\n}\r\n","type":"registry:ui","target":"components\/fancy\/cms-region\/CmsRegion.tsx"}]}