@chaibuilder/sdk 1.3.0-beta.7 → 1.3.0-beta.8

package/dist/render.js

@@ -1,163 +1,209 @@
-import { last as T, flattenDeep as $, memoize as N, filter as _, isEmpty as d, omit as R, isString as j, get as l, each as J, cloneDeep as P, forEach as I, keys as x, has as K, includes as C, replace as L } from "lodash-es";
-import { S as f, a as B } from "./STRINGS-eiGM83kj.js";
-import { j as u } from "./jsx-runtime-DGlMoOmv.js";
-import w from "react";
-import { twMerge as W } from "tailwind-merge";
-import { getBlockComponent as Y } from "@chaibuilder/runtime";
-import { createTailwindcss as v } from "@mhsdesign/jit-browser-tailwindcss";
-import F from "@tailwindcss/forms";
-import U from "@tailwindcss/typography";
-import z from "@tailwindcss/aspect-ratio";
-import { g as M, c as q } from "./plugin-BOEoR5jk.js";
-const D = (t, r = "") => {
-  const s = t.replace(f, "").split(",").map((n) => n.split(" ").map((a) => {
-    if (a === "") return "";
-    if (a.includes(":")) {
-      const c = a.split(":");
-      return c[c.length - 1] = r + T(c), c.join(":");
-    }
-    return `${r}${a}`;
-  }).join(" "));
-  return $(s).join(" ");
-}, ft = (t) => {
-  if (!t) return [];
+import { last, flattenDeep, memoize, filter, isEmpty, omit, isString, get, each, cloneDeep, forEach, keys, has, includes, replace } from "lodash-es";
+import { S as STYLES_KEY, a as SLOT_KEY } from "./STRINGS-DdpfVlsV.js";
+import { j as jsxRuntimeExports } from "./jsx-runtime-ClFauRgV.js";
+import React__default from "react";
+import { twMerge } from "tailwind-merge";
+import { getBlockComponent } from "@chaibuilder/runtime";
+import { createTailwindcss } from "@mhsdesign/jit-browser-tailwindcss";
+import forms from "@tailwindcss/forms";
+import typography from "@tailwindcss/typography";
+import aspectRatio from "@tailwindcss/aspect-ratio";
+import { g as getChaiBuilderTheme, c as chaiBuilderPlugin } from "./plugin-tVAEvXiS.js";
+const addPrefixToClasses = (classes, prefix = "") => {
+  const classesArray = classes.replace(STYLES_KEY, "").split(",");
+  const array = classesArray.map((item) => {
+    const classes2 = item.split(" ");
+    const newClasses = classes2.map((item2) => {
+      if (item2 === "") return "";
+      if (item2.includes(":")) {
+        const values = item2.split(":");
+        values[values.length - 1] = prefix + last(values);
+        return values.join(":");
+      }
+      return `${prefix}${item2}`;
+    });
+    return newClasses.join(" ");
+  });
+  return flattenDeep(array).join(" ");
+};
+const convertToBlocks = (chaiFormatContent) => {
+  if (!chaiFormatContent) return [];
   try {
-    return JSON.parse(G(t)).filter((e) => !e._type.startsWith("@chai"));
-  } catch {
+    const blocks = JSON.parse(removeAssetPrefix(chaiFormatContent));
+    return blocks.filter((block) => !block._type.startsWith("@chai"));
+  } catch (error) {
     return [{ _type: "Paragraph", _id: "error", content: "Invalid JSON. Please check the JSON string." }];
   }
 };
-function G(t) {
-  const r = /(asset:\/\/|https:\/\/asset\.localhost\/)(?:localhost\/)?[^"']+/g;
-  return t.replace(r, (e) => {
-    const s = decodeURIComponent(e), n = s.indexOf("public");
-    return n !== -1 ? s.substring(n + 6) : s;
+function removeAssetPrefix(input) {
+  const regex = /(asset:\/\/|https:\/\/asset\.localhost\/)(?:localhost\/)?[^"']+/g;
+  return input.replace(regex, (match) => {
+    const decodedUrl = decodeURIComponent(match);
+    const publicIndex = decodedUrl.indexOf("public");
+    if (publicIndex !== -1) {
+      return decodedUrl.substring(publicIndex + 6);
+    }
+    return decodedUrl;
   });
 }
-const H = (t) => {
-  const r = {};
-  return Object.keys(t).forEach((e) => {
-    j(t[e]) && t[e].startsWith(B) && (r[e] = t[e].replace(B, "").split(","));
-  }), r;
-}, Q = N((t, r) => {
-  const e = t.replace(f, "").split(","), s = W(e[0], e[1]);
-  return r === "" ? s.replace(f, "").trim() : D(s, r).replace(f, "").trim();
+const getSlots = (block) => {
+  const slots = {};
+  Object.keys(block).forEach((key) => {
+    if (isString(block[key]) && block[key].startsWith(SLOT_KEY)) {
+      slots[key] = block[key].replace(SLOT_KEY, "").split(",");
+    }
+  });
+  return slots;
+};
+const generateClassNames = memoize((styles, classPrefix) => {
+  const stylesArray = styles.replace(STYLES_KEY, "").split(",");
+  const classes = twMerge(stylesArray[0], stylesArray[1]);
+  if (classPrefix === "") return classes.replace(STYLES_KEY, "").trim();
+  return addPrefixToClasses(classes, classPrefix).replace(STYLES_KEY, "").trim();
 });
-function V(t, r) {
-  const e = l(t, `${r}_attrs`, {});
-  K(e, "data-ai-key") && delete e["data-ai-key"];
-  const s = x(e).join(" ");
-  return C(s, "x-show") && !C(s, "x-transition") && (e["x-transition"] = ""), e;
+function getElementAttrs(block, key) {
+  const attrs = get(block, `${key}_attrs`, {});
+  if (has(attrs, "data-ai-key")) {
+    delete attrs["data-ai-key"];
+  }
+  const attrsKeys = keys(attrs).join(" ");
+  if (includes(attrsKeys, "x-show") && !includes(attrsKeys, "x-transition")) {
+    attrs["x-transition"] = "";
+  }
+  return attrs;
 }
-function X(t, r) {
-  const e = {};
-  return Object.keys(t).forEach((s) => {
-    if (j(t[s]) && t[s].startsWith(f)) {
-      const n = Q(t[s], r);
-      e[s] = {
-        className: n,
-        ...V(t, s)
+function getStyleAttrs(block, classPrefix) {
+  const styles = {};
+  Object.keys(block).forEach((key) => {
+    if (isString(block[key]) && block[key].startsWith(STYLES_KEY)) {
+      const classes = generateClassNames(block[key], classPrefix);
+      styles[key] = {
+        className: classes,
+        ...getElementAttrs(block, key)
       };
     }
-  }), e;
+  });
+  return styles;
 }
-function Z(t, r) {
-  const e = l(t, "_bindings", {});
-  return d(e) ? { ...t } : (J(e, (s, n) => {
-    j(s) && l(r, s, null) && (t[n] = l(r, s, null));
-  }), t);
+function applyBindings(block, chaiData) {
+  const bindings = get(block, "_bindings", {});
+  if (isEmpty(bindings)) return { ...block };
+  each(bindings, (value, key) => {
+    if (isString(value) && get(chaiData, value, null)) {
+      block[key] = get(chaiData, value, null);
+    }
+  });
+  return block;
 }
-function b(t, r, e) {
-  if (d(r)) return t;
-  const s = P(t);
-  return I(x(s), (n) => {
-    l(e, ["props", n, "i18n"]) && !d(r) && (s[n] = l(s, `${n}-${r}`, s[n]));
-  }), s;
+function applyLanguage(_block, lang, blockDefinition) {
+  if (isEmpty(lang)) return _block;
+  const block = cloneDeep(_block);
+  forEach(keys(block), (key) => {
+    if (get(blockDefinition, ["props", key, "i18n"]) && !isEmpty(lang)) {
+      block[key] = get(block, `${key}-${lang}`, block[key]);
+    }
+  });
+  return block;
 }
-function E({
-  blocks: t,
-  parent: r,
-  classPrefix: e = "",
-  externalData: s = {},
-  blockModifierCallback: n,
-  lang: p
+function RenderChaiBlocks({
+  blocks,
+  parent,
+  classPrefix = "",
+  externalData = {},
+  blockModifierCallback,
+  lang
 }) {
-  const m = t, a = (i) => X(i, e), c = r ? _(t, { _parent: r }) : _(t, (i) => d(i._parent));
-  return /* @__PURE__ */ u.jsx(u.Fragment, { children: w.Children.toArray(
-    c.map((i, O) => {
-      const h = H(i), y = {};
-      d(h) || Object.keys(h).forEach((o) => {
-        y[o] = w.Children.toArray(
-          h[o].map((S) => /* @__PURE__ */ u.jsx(
-            E,
-            {
-              externalData: s,
-              classPrefix: e,
-              blocks: m,
-              parent: S,
-              lang: p
-            }
-          ))
-        );
-      });
-      const A = _(m, { _parent: i._id });
-      y.children = A.length > 0 ? /* @__PURE__ */ u.jsx(
-        E,
+  const allBlocks = blocks;
+  const getStyles = (block) => getStyleAttrs(block, classPrefix);
+  const filteredBlocks = parent ? filter(blocks, { _parent: parent }) : filter(blocks, (block) => isEmpty(block._parent));
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: React__default.Children.toArray(
+    filteredBlocks.map((block, index) => {
+      const slots = getSlots(block);
+      const attrs = {};
+      if (!isEmpty(slots)) {
+        Object.keys(slots).forEach((key) => {
+          attrs[key] = React__default.Children.toArray(
+            slots[key].map((slotId) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+              RenderChaiBlocks,
+              {
+                externalData,
+                classPrefix,
+                blocks: allBlocks,
+                parent: slotId,
+                lang
+              }
+            ))
+          );
+        });
+      }
+      const blocks2 = filter(allBlocks, { _parent: block._id });
+      attrs.children = blocks2.length > 0 ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+        RenderChaiBlocks,
         {
-          externalData: s,
-          classPrefix: e,
-          parent: i._id,
-          blocks: m,
-          lang: p
+          externalData,
+          classPrefix,
+          parent: block._id,
+          blocks: allBlocks,
+          lang
         }
       ) : null;
-      const g = Y(i._type);
-      if (g !== null) {
-        let o = i;
-        const S = g.component;
-        return o = { ...g.defaults, ...i }, n && (o = n(o)), w.createElement(
-          S,
-          R(
+      const blockDefinition = getBlockComponent(block._type);
+      if (blockDefinition !== null) {
+        let syncedBlock = block;
+        const Component = blockDefinition.component;
+        syncedBlock = { ...blockDefinition.defaults, ...block };
+        if (blockModifierCallback) {
+          syncedBlock = blockModifierCallback(syncedBlock);
+        }
+        return React__default.createElement(
+          Component,
+          omit(
             {
               blockProps: {},
-              inBuilder: !1,
-              ...o,
-              index: O,
-              ...Z(b(i, p, g), s),
-              ...a(o),
-              ...y
+              inBuilder: false,
+              ...syncedBlock,
+              index,
+              ...applyBindings(applyLanguage(block, lang, blockDefinition), externalData),
+              ...getStyles(syncedBlock),
+              ...attrs
             },
             ["_parent"]
           )
         );
       }
-      return /* @__PURE__ */ u.jsxs("noscript", { children: [
-        i._type,
+      return /* @__PURE__ */ jsxRuntimeExports.jsxs("noscript", { children: [
+        block._type,
         " not found"
       ] });
     })
   ) });
 }
-async function k(t, r, e = [], s = "", n = !1) {
-  return await v({
+async function getTailwindCSS(theme, markupString, safelist = [], prefix = "", includeBaseStyles = false) {
+  const tailwind = createTailwindcss({
     tailwindConfig: {
       darkMode: "class",
-      safelist: e,
-      theme: { extend: M(t) },
-      plugins: [F, U, z, q],
-      corePlugins: { preflight: n },
-      ...s ? { prefix: `${s}` } : {}
+      safelist,
+      theme: { extend: getChaiBuilderTheme(theme) },
+      plugins: [forms, typography, aspectRatio, chaiBuilderPlugin],
+      corePlugins: { preflight: includeBaseStyles },
+      ...prefix ? { prefix: `${prefix}` } : {}
     }
-  }).generateStylesFromContent(
-    ` ${n ? "@tailwind base;" : ""}
+  });
+  return await tailwind.generateStylesFromContent(
+    ` ${includeBaseStyles ? "@tailwind base;" : ""}
       @tailwind components;
       @tailwind utilities;`,
-    r
+    markupString
   );
 }
-const tt = (t, r, e = !1) => k(r, [L(JSON.stringify(t), /#styles:,?/g, "")], [], "", e), dt = async (t, r = {}, e = !0) => await tt(t, r, e);
+const getBlocksTailwindCSS = (blocks, theme, includeBaseStyles = false) => {
+  return getTailwindCSS(theme, [replace(JSON.stringify(blocks), /#styles:,?/g, "")], [], "", includeBaseStyles);
+};
+const getStylesForBlocks = async (blocks, theme = {}, includeBaseStyles = true) => {
+  return await getBlocksTailwindCSS(blocks, theme, includeBaseStyles);
+};
 export {
-  E as RenderChaiBlocks,
-  ft as convertToBlocks,
-  dt as getStylesForBlocks
+  RenderChaiBlocks,
+  convertToBlocks,
+  getStylesForBlocks
 };

package/dist/runtime.cjs

@@ -1 +1,26 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("@chaibuilder/runtime"),e=require("./controls-C4n5ycp4.cjs");exports.Checkbox=e.c;exports.Code=e.l;exports.Color=e.h;exports.Icon=e.q;exports.Image=e.x;exports.InfoField=e.u;exports.Link=e.w;exports.List=e.S;exports.Model=e.b;exports.MultilineText=e.f;exports.Numeric=e.s;exports.RichText=e.m;exports.SelectOption=e.y;exports.SingleLineText=e.g;exports.Slot=e.r;exports.Styles=e.T;Object.keys(o).forEach(t=>{t!=="default"&&!Object.prototype.hasOwnProperty.call(exports,t)&&Object.defineProperty(exports,t,{enumerable:!0,get:()=>o[t]})});
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const runtime = require("@chaibuilder/runtime");
+const controls = require("./controls-DaW52RjX.cjs");
+exports.Checkbox = controls.c;
+exports.Code = controls.l;
+exports.Color = controls.h;
+exports.Icon = controls.q;
+exports.Image = controls.x;
+exports.InfoField = controls.u;
+exports.Link = controls.w;
+exports.List = controls.S;
+exports.Model = controls.b;
+exports.MultilineText = controls.f;
+exports.Numeric = controls.s;
+exports.RichText = controls.m;
+exports.SelectOption = controls.y;
+exports.SingleLineText = controls.g;
+exports.Slot = controls.r;
+exports.Styles = controls.T;
+Object.keys(runtime).forEach((k) => {
+  if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+    enumerable: true,
+    get: () => runtime[k]
+  });
+});

package/dist/runtime.js

@@ -1,20 +1,20 @@
 export * from "@chaibuilder/runtime";
-import { c as o, l as t, h as i, q as l, x as n, u as r, w as x, S as c, b as m, f as S, s as f, m as T, y as d, g, r as h, T as p } from "./controls-Com-zYCq.js";
+import { c, l, h, q, x, u, w, S, b, f, s, m, y, g, r, T } from "./controls-8EZmm0Ns.js";
 export {
-  o as Checkbox,
-  t as Code,
-  i as Color,
-  l as Icon,
-  n as Image,
-  r as InfoField,
-  x as Link,
-  c as List,
-  m as Model,
-  S as MultilineText,
-  f as Numeric,
-  T as RichText,
-  d as SelectOption,
+  c as Checkbox,
+  l as Code,
+  h as Color,
+  q as Icon,
+  x as Image,
+  u as InfoField,
+  w as Link,
+  S as List,
+  b as Model,
+  f as MultilineText,
+  s as Numeric,
+  m as RichText,
+  y as SelectOption,
   g as SingleLineText,
-  h as Slot,
-  p as Styles
+  r as Slot,
+  T as Styles
 };