@bettercms-ai/ui 0.14.0 → 0.15.0

package/dist/index.js

@@ -958,7 +958,7 @@ var BLOCK_REGISTRY = {
 var BLOCK_TYPES = Object.keys(BLOCK_REGISTRY);
 
 // src/renderer.tsx
-import { splitButtonStyle } from "@bettercms-ai/types";
+import { RESPONSIVE_CSS, hideOnAttr, splitButtonStyle, usesHideOn, visibleBlocks, windowState } from "@bettercms-ai/types";
 
 // src/blockStyle.ts
 import { blockStyleToCss } from "@bettercms-ai/types";
@@ -975,6 +975,12 @@ function styleOf(block) {
   const { placement, paint } = splitButtonStyle(block.style);
   return { wrapper: blockStyleToReactStyle(placement), paint: paint ? { style: paint } : {} };
 }
+function withHide(block, wrapperStyle, el, stampAt) {
+  const hide = hideOnAttr(block.style);
+  const state = stampAt ? windowState(block, stampAt) : "live";
+  if (!wrapperStyle && !hide && state === "live") return el;
+  return /* @__PURE__ */ jsx15("div", { style: wrapperStyle, ...hide ? { "data-bcms-hide": hide } : {}, ...state === "live" ? {} : { "data-bcms-window": state }, children: el });
+}
 function bindingProps(block, annotate) {
   if (!annotate || !block.id) return {};
   switch (block.type) {
@@ -990,7 +996,7 @@ function bindingProps(block, annotate) {
       return {};
   }
 }
-function resolveBlock(block, className, annotate = false) {
+function resolveBlock(block, className, annotate = false, stampAt) {
   const entry = BLOCK_REGISTRY[block.type];
   if (!entry) {
     return /* @__PURE__ */ jsxs11(
@@ -1007,13 +1013,14 @@ function resolveBlock(block, className, annotate = false) {
   const Component = entry.component;
   const { wrapper: blockStyle, paint } = styleOf(block);
   const el = /* @__PURE__ */ jsx15(Component, { ...block.props, ...paint, className, ...bindingProps(block, annotate) });
-  return blockStyle ? /* @__PURE__ */ jsx15("div", { style: blockStyle, children: el }) : el;
+  return withHide(block, blockStyle, el, stampAt);
 }
 function BlockRenderer({
   block,
   className = "",
   renderBlock,
-  annotate = false
+  annotate = false,
+  stampAt
 }) {
   const entry = BLOCK_REGISTRY[block.type];
   if (!entry) {
@@ -1029,7 +1036,7 @@ function BlockRenderer({
     );
   }
   const Component = entry.component;
-  const containerProps = CONTAINER_TYPES.has(block.type) ? { renderBlock: renderBlock ?? ((child) => resolveBlock(child, void 0, annotate)) } : {};
+  const containerProps = CONTAINER_TYPES.has(block.type) ? { renderBlock: renderBlock ?? ((child) => resolveBlock(child, void 0, annotate, stampAt)) } : {};
   const { wrapper: blockStyle, paint } = styleOf(block);
   const el = /* @__PURE__ */ jsx15(
     Component,
@@ -1041,24 +1048,31 @@ function BlockRenderer({
       ...bindingProps(block, annotate)
     }
   );
-  return blockStyle ? /* @__PURE__ */ jsx15("div", { style: blockStyle, children: el }) : el;
+  return withHide(block, blockStyle, el, stampAt);
 }
 function BlocksRenderer({
-  blocks,
+  blocks: all,
   className = "",
   renderBlock,
-  annotate = false
+  annotate = false,
+  now
 }) {
+  const at = now ?? /* @__PURE__ */ new Date();
+  const blocks = annotate ? all : visibleBlocks(all, at);
   if (blocks.length === 0) return null;
-  return /* @__PURE__ */ jsx15("div", { className, children: blocks.map((block) => /* @__PURE__ */ jsx15(
-    BlockRenderer,
-    {
-      block,
-      renderBlock,
-      annotate
-    },
-    block.id
-  )) });
+  return /* @__PURE__ */ jsxs11("div", { className, children: [
+    usesHideOn(blocks) && /* @__PURE__ */ jsx15("style", { dangerouslySetInnerHTML: { __html: RESPONSIVE_CSS } }),
+    blocks.map((block) => /* @__PURE__ */ jsx15(
+      BlockRenderer,
+      {
+        block,
+        renderBlock,
+        annotate,
+        stampAt: annotate ? at : void 0
+      },
+      block.id
+    ))
+  ] });
 }
 export {
   BLOCK_REGISTRY,