@crediblemark/build 0.25.7 → 0.25.8

package/dist/rsc.mjs

@@ -1,13 +1,26 @@
 import {
+  ColorPickerField,
+  DropZone,
+  ResponsiveSliderField,
+  SliderField,
   SlotRenderPure,
   migrate,
   resolveAllData,
   transformProps,
   useRichtextProps,
   useSlots
-} from "./chunk-2RLA42JA.mjs";
+} from "./chunk-HHKM5MBJ.mjs";
+import "./chunk-Z7DDX2XU.mjs";
+import "./chunk-44PQTFGV.mjs";
+import "./chunk-P2AZFZ7Q.mjs";
+import "./chunk-T2LBDQLG.mjs";
+import "./chunk-E4F5M5JH.mjs";
 import "./chunk-ISXFLTBM.mjs";
-import "./chunk-SMAWAXVX.mjs";
+import "./chunk-AZFZRLP7.mjs";
+import "./chunk-XLRMLBFR.mjs";
+import "./chunk-PFHKXXSV.mjs";
+import "./chunk-S32JZ2HU.mjs";
+import "./chunk-KN26YZZJ.mjs";
 import "./chunk-BFHV72KK.mjs";
 import {
   rootAreaId,
@@ -15,7 +28,7 @@ import {
   rootZone,
   setupZone,
   walkTree
-} from "./chunk-7LXZOPYT.mjs";
+} from "./chunk-O44M27KT.mjs";
 import "./chunk-AFVEAZTD.mjs";
 
 // components/ServerRender/index.tsx
@@ -133,7 +146,11 @@ function Render({
   );
 }
 export {
+  ColorPickerField,
+  DropZone,
   Render,
+  ResponsiveSliderField,
+  SliderField,
   migrate,
   resolveAllData,
   transformProps,

package/dist/{walk-tree-BEw6kTXm.d.ts → walk-tree-B_jHFa3L.d.mts}

@@ -1,4 +1,41 @@
-import { a as Config, D as Data, W as WithId, U as UserGenerics, b as Content, c as ComponentData, d as DefaultComponents, e as DefaultComponentProps, f as DefaultRootFieldProps, M as Metadata, R as RootData } from './actions-LaZpJ1KE.js';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+import react__default from 'react';
+import { k as ResponsiveValue, l as DropZoneProps, a as Config, D as Data, W as WithId, U as UserGenerics, m as Content, c as ComponentData, n as DefaultComponents, o as DefaultComponentProps, p as DefaultRootFieldProps, M as Metadata, q as RootData } from './actions-CKSDxt4l.mjs';
+
+type SliderFieldProps = {
+    value: string | number;
+    onChange: (value: string | number) => void;
+    label?: string;
+    min?: number;
+    max?: number;
+    step?: number;
+    unit?: string;
+    defaultValue?: string | number;
+    useUnits?: boolean;
+    style?: react__default.CSSProperties;
+};
+declare const SliderField: ({ value, onChange, min, max, step, unit, defaultValue, useUnits, style }: SliderFieldProps) => react_jsx_runtime.JSX.Element;
+
+type ResponsiveSliderFieldProps = {
+    value: ResponsiveValue;
+    onChange: (value: ResponsiveValue) => void;
+    label?: string;
+    unit?: string;
+    max?: number;
+    min?: number;
+    step?: number;
+    defaultValue?: number | ResponsiveValue;
+};
+declare const ResponsiveSliderField: ({ value, onChange, label, unit, max, min, step, defaultValue }: ResponsiveSliderFieldProps) => react_jsx_runtime.JSX.Element;
+
+type ColorPickerFieldProps = {
+    value: string;
+    onChange: (value: string) => void;
+};
+declare const ColorPickerField: ({ value, onChange }: ColorPickerFieldProps) => react_jsx_runtime.JSX.Element;
+
+declare const DropZone: react.ForwardRefExoticComponent<Omit<DropZoneProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
 
 type MigrationOptions<UserConfig extends Config> = {
     migrateDynamicZonesForComponent?: {
@@ -26,4 +63,4 @@ type WalkTreeOptions = {
 };
 declare function walkTree<T extends ComponentData | RootData | G["UserData"], UserConfig extends Config = Config, G extends UserGenerics<UserConfig> = UserGenerics<UserConfig>>(data: T, config: UserConfig, callbackFn: (data: Content, options: WalkTreeOptions) => Content | null | void): T;
 
-export { migrate as m, resolveAllData as r, transformProps as t, walkTree as w };
+export { ColorPickerField as C, DropZone as D, ResponsiveSliderField as R, SliderField as S, migrate as m, resolveAllData as r, transformProps as t, walkTree as w };

package/dist/{walk-tree-BO8uRNcW.d.mts → walk-tree-DHMRjk5Z.d.ts}

@@ -1,4 +1,41 @@
-import { a as Config, D as Data, W as WithId, U as UserGenerics, b as Content, c as ComponentData, d as DefaultComponents, e as DefaultComponentProps, f as DefaultRootFieldProps, M as Metadata, R as RootData } from './actions-LaZpJ1KE.mjs';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+import react__default from 'react';
+import { k as ResponsiveValue, l as DropZoneProps, a as Config, D as Data, W as WithId, U as UserGenerics, m as Content, c as ComponentData, n as DefaultComponents, o as DefaultComponentProps, p as DefaultRootFieldProps, M as Metadata, q as RootData } from './actions-CKSDxt4l.js';
+
+type SliderFieldProps = {
+    value: string | number;
+    onChange: (value: string | number) => void;
+    label?: string;
+    min?: number;
+    max?: number;
+    step?: number;
+    unit?: string;
+    defaultValue?: string | number;
+    useUnits?: boolean;
+    style?: react__default.CSSProperties;
+};
+declare const SliderField: ({ value, onChange, min, max, step, unit, defaultValue, useUnits, style }: SliderFieldProps) => react_jsx_runtime.JSX.Element;
+
+type ResponsiveSliderFieldProps = {
+    value: ResponsiveValue;
+    onChange: (value: ResponsiveValue) => void;
+    label?: string;
+    unit?: string;
+    max?: number;
+    min?: number;
+    step?: number;
+    defaultValue?: number | ResponsiveValue;
+};
+declare const ResponsiveSliderField: ({ value, onChange, label, unit, max, min, step, defaultValue }: ResponsiveSliderFieldProps) => react_jsx_runtime.JSX.Element;
+
+type ColorPickerFieldProps = {
+    value: string;
+    onChange: (value: string) => void;
+};
+declare const ColorPickerField: ({ value, onChange }: ColorPickerFieldProps) => react_jsx_runtime.JSX.Element;
+
+declare const DropZone: react.ForwardRefExoticComponent<Omit<DropZoneProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
 
 type MigrationOptions<UserConfig extends Config> = {
     migrateDynamicZonesForComponent?: {
@@ -26,4 +63,4 @@ type WalkTreeOptions = {
 };
 declare function walkTree<T extends ComponentData | RootData | G["UserData"], UserConfig extends Config = Config, G extends UserGenerics<UserConfig> = UserGenerics<UserConfig>>(data: T, config: UserConfig, callbackFn: (data: Content, options: WalkTreeOptions) => Content | null | void): T;
 
-export { migrate as m, resolveAllData as r, transformProps as t, walkTree as w };
+export { ColorPickerField as C, DropZone as D, ResponsiveSliderField as R, SliderField as S, migrate as m, resolveAllData as r, transformProps as t, walkTree as w };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crediblemark/build",
-  "version": "0.25.7",
+  "version": "0.25.8",
   "description": "The open-source visual editor for React",
   "author": "Rasyiqi Crediblemark",
   "repository": {

package/dist/ArrayField-OIQQLS2B.mjs

@@ -1,19 +0,0 @@
-import {
-  ArrayField
-} from "./chunk-J2UWT4L6.mjs";
-import "./chunk-35OY5UFR.mjs";
-import "./chunk-ETN6FGIH.mjs";
-import "./chunk-ISXFLTBM.mjs";
-import "./chunk-23V3TMNT.mjs";
-import "./chunk-EWOJLVHT.mjs";
-import "./chunk-GUUI5HW3.mjs";
-import "./chunk-JERQUUM4.mjs";
-import "./chunk-M4S65TWW.mjs";
-import "./chunk-64A37UUC.mjs";
-import "./chunk-SMAWAXVX.mjs";
-import "./chunk-BFHV72KK.mjs";
-import "./chunk-7LXZOPYT.mjs";
-import "./chunk-AFVEAZTD.mjs";
-export {
-  ArrayField
-};

package/dist/ObjectField-WOW3T2WS.mjs

@@ -1,19 +0,0 @@
-import {
-  ObjectField
-} from "./chunk-EDTYTRV5.mjs";
-import "./chunk-35OY5UFR.mjs";
-import "./chunk-ETN6FGIH.mjs";
-import "./chunk-ISXFLTBM.mjs";
-import "./chunk-23V3TMNT.mjs";
-import "./chunk-EWOJLVHT.mjs";
-import "./chunk-GUUI5HW3.mjs";
-import "./chunk-JERQUUM4.mjs";
-import "./chunk-M4S65TWW.mjs";
-import "./chunk-64A37UUC.mjs";
-import "./chunk-SMAWAXVX.mjs";
-import "./chunk-BFHV72KK.mjs";
-import "./chunk-7LXZOPYT.mjs";
-import "./chunk-AFVEAZTD.mjs";
-export {
-  ObjectField
-};

package/dist/chunk-2RLA42JA.mjs

@@ -1,455 +0,0 @@
-import {
-  styles_module_default
-} from "./chunk-ISXFLTBM.mjs";
-import {
-  defaultAppState,
-  resolveComponentData
-} from "./chunk-SMAWAXVX.mjs";
-import {
-  get_class_name_factory_default
-} from "./chunk-BFHV72KK.mjs";
-import {
-  generateId,
-  getZoneId,
-  mapFields,
-  toComponent,
-  walkAppState,
-  walkTree
-} from "./chunk-7LXZOPYT.mjs";
-
-// lib/migrate.ts
-var migrations = [
-  // Migrate root to root.props
-  (data) => {
-    const rootProps = data.root.props || data.root;
-    if (Object.keys(data.root).length > 0 && !data.root.props) {
-      console.warn(
-        "Migration applied: Root props moved from `root` to `root.props`."
-      );
-      return {
-        ...data,
-        root: {
-          props: {
-            ...rootProps
-          }
-        }
-      };
-    }
-    return data;
-  },
-  // Migrate zones to slots
-  (data, config, migrationOptions) => {
-    if (!config) return data;
-    console.log("Migrating DropZones to slots...");
-    const updatedItems = {};
-    const appState = { ...defaultAppState, data };
-    const { indexes } = walkAppState(appState, config);
-    const deletedCompounds = [];
-    walkAppState(appState, config, (content, zoneCompound, zoneType) => {
-      if (zoneType === "dropzone") {
-        const [id, slotName] = zoneCompound.split(":");
-        const nodeData = indexes.nodes[id].data;
-        const componentType = nodeData.type;
-        const configForComponent = id === "root" ? config.root : config.components[componentType];
-        if (configForComponent?.fields?.[slotName]?.type === "slot") {
-          updatedItems[id] = {
-            ...nodeData,
-            props: {
-              ...nodeData.props,
-              ...updatedItems[id]?.props,
-              [slotName]: content
-            }
-          };
-          deletedCompounds.push(zoneCompound);
-        }
-        return content;
-      }
-      return content;
-    });
-    const updated = walkAppState(
-      appState,
-      config,
-      (content) => content,
-      (item) => {
-        return updatedItems[item.props.id] ?? item;
-      }
-    );
-    deletedCompounds.forEach((zoneCompound) => {
-      const [_, propName] = zoneCompound.split(":");
-      console.log(
-        `\u2713 Success: Migrated "${zoneCompound}" from DropZone to slot field "${propName}"`
-      );
-      delete updated.data.zones?.[zoneCompound];
-    });
-    if (migrationOptions?.migrateDynamicZonesForComponent) {
-      const unmigratedZonesGrouped = {};
-      Object.keys(updated.data.zones ?? {}).forEach((zoneCompound) => {
-        const [componentId, propName] = zoneCompound.split(":");
-        const content = updated.data.zones?.[zoneCompound];
-        if (!content) {
-          return;
-        }
-        if (!unmigratedZonesGrouped[componentId]) {
-          unmigratedZonesGrouped[componentId] = {};
-        }
-        if (!unmigratedZonesGrouped[componentId][propName]) {
-          unmigratedZonesGrouped[componentId][propName] = content;
-        }
-      });
-      Object.keys(unmigratedZonesGrouped).forEach((componentId) => {
-        updated.data = walkTree(updated.data, config, (content) => {
-          return content.map((child) => {
-            if (child.props.id !== componentId) {
-              return child;
-            }
-            const migrateFn = migrationOptions?.migrateDynamicZonesForComponent?.[child.type];
-            if (!migrateFn) {
-              return child;
-            }
-            const zones = unmigratedZonesGrouped[componentId];
-            const migratedProps = migrateFn(child.props, zones);
-            Object.keys(zones).forEach((propName) => {
-              const zoneCompound = `${componentId}:${propName}`;
-              console.log(`\u2713 Success: Migrated "${zoneCompound}" DropZone`);
-              delete updated.data.zones?.[zoneCompound];
-            });
-            return {
-              ...child,
-              props: migratedProps
-            };
-          });
-        });
-      });
-    }
-    Object.keys(updated.data.zones ?? {}).forEach((zoneCompound) => {
-      const [_, propName] = zoneCompound.split(":");
-      throw new Error(
-        `Could not migrate DropZone "${zoneCompound}" to slot field. No slot exists with the name "${propName}".`
-      );
-    });
-    delete updated.data.zones;
-    return updated.data;
-  }
-];
-function migrate(data, config, migrationOptions) {
-  return migrations?.reduce(
-    (acc, migration) => migration(acc, config, migrationOptions),
-    data
-  );
-}
-
-// lib/data/default-data.ts
-var defaultData = (data) => ({
-  ...data,
-  root: data.root || {},
-  content: data.content || []
-});
-
-// lib/transform-props.ts
-function transformProps(data, propTransforms, config = { components: {} }) {
-  const mapItem = (item) => {
-    if (propTransforms[item.type]) {
-      return {
-        ...item,
-        props: {
-          id: item.props.id,
-          ...propTransforms[item.type](item.props)
-        }
-      };
-    }
-    return item;
-  };
-  const defaultedData = defaultData(data);
-  const rootProps = defaultedData.root.props || defaultedData.root;
-  let newRoot = { ...defaultedData.root };
-  if (propTransforms["root"]) {
-    newRoot.props = propTransforms["root"](rootProps);
-  }
-  const dataWithUpdatedRoot = { ...defaultedData, root: newRoot };
-  const updatedData = walkTree(
-    dataWithUpdatedRoot,
-    config,
-    (content) => content.map(mapItem)
-  );
-  if (!defaultedData.root.props) {
-    updatedData.root = updatedData.root.props;
-  }
-  return updatedData;
-}
-
-// lib/group-zones-by-component.ts
-var groupZonesByComponent = (data) => {
-  const zoneEntries = Object.entries(data.zones ?? {});
-  return zoneEntries.reduce((acc, [zoneCompound, zoneContent]) => {
-    const [componentId, zoneName] = getZoneId(zoneCompound);
-    if (!componentId.length || !zoneName.length) return acc;
-    if (!acc[componentId]) {
-      acc[componentId] = [];
-    }
-    acc[componentId].push({ zoneCompound, content: zoneContent });
-    return acc;
-  }, {});
-};
-
-// lib/resolve-all-data.ts
-async function resolveAllData(data, config, metadata = {}, onResolveStart, onResolveEnd) {
-  const defaultedData = defaultData(data);
-  const zonesByComponent = groupZonesByComponent(defaultedData);
-  let resolvedZones = {};
-  const resolveNode = async (_node, parent) => {
-    const node = toComponent(_node);
-    onResolveStart?.(node);
-    const resolved = (await resolveComponentData(
-      node,
-      config,
-      metadata,
-      () => {
-      },
-      () => {
-      },
-      "force",
-      parent
-    )).node;
-    const resolvedAsComponent = toComponent(resolved);
-    const resolvedDeepPromise = mapFields(
-      resolved,
-      {
-        slot: ({ value }) => processContent(value, resolvedAsComponent)
-      },
-      config
-    );
-    let resolveZonePromises = [];
-    if (zonesByComponent[resolvedAsComponent.props.id]) {
-      resolveZonePromises = zonesByComponent[resolvedAsComponent.props.id].map(
-        async ({ zoneCompound, content }) => {
-          resolvedZones[zoneCompound] = await processContent(
-            content,
-            resolvedAsComponent
-          );
-        }
-      );
-    }
-    const resolvedDeep = await resolvedDeepPromise;
-    await Promise.all(resolveZonePromises);
-    onResolveEnd?.(toComponent(resolvedDeep));
-    return resolvedDeep;
-  };
-  const processContent = async (content, parent) => {
-    return Promise.all(content.map((item) => resolveNode(item, parent)));
-  };
-  const result = defaultData({});
-  result.root = await resolveNode(defaultedData.root, null);
-  result.content = await processContent(
-    defaultedData.content,
-    toComponent(result.root)
-  );
-  result.zones = resolvedZones;
-  return result;
-}
-
-// lib/field-transforms/default-transforms/slot-transform.tsx
-var getSlotTransform = (renderSlotEdit, renderSlotRender = renderSlotEdit) => ({
-  slot: ({ value: content, propName, field, isReadOnly }) => {
-    const render = isReadOnly ? renderSlotRender : renderSlotEdit;
-    const Slot = (dzProps) => render({
-      allow: field?.type === "slot" ? field.allow : [],
-      disallow: field?.type === "slot" ? field.disallow : [],
-      ...dzProps,
-      zone: propName,
-      content
-    });
-    return Slot;
-  }
-});
-
-// lib/field-transforms/use-field-transforms.tsx
-import { useMemo } from "react";
-
-// lib/field-transforms/build-mappers.ts
-function buildMappers(transforms, readOnly, forceReadOnly) {
-  return Object.keys(transforms).reduce((acc, _fieldType) => {
-    const fieldType = _fieldType;
-    return {
-      ...acc,
-      [fieldType]: ({
-        parentId,
-        ...params
-      }) => {
-        const wildcardPath = params.propPath.replace(/\[\d+\]/g, "[*]");
-        const isReadOnly = readOnly?.[params.propPath] || readOnly?.[wildcardPath] || forceReadOnly || false;
-        const fn = transforms[fieldType];
-        return fn?.({
-          ...params,
-          isReadOnly,
-          componentId: parentId
-        });
-      }
-    };
-  }, {});
-}
-
-// lib/field-transforms/use-field-transforms.tsx
-function useFieldTransforms(config, item, transforms, readOnly, forceReadOnly) {
-  const mappers = useMemo(
-    () => buildMappers(transforms, readOnly, forceReadOnly),
-    [transforms, readOnly, forceReadOnly]
-  );
-  const transformedProps = useMemo(() => {
-    return mapFields(item, mappers, config).props;
-  }, [config, item, mappers]);
-  const mergedProps = useMemo(
-    () => ({ ...item.props, ...transformedProps }),
-    [item.props, transformedProps]
-  );
-  return mergedProps;
-}
-
-// lib/use-slots.tsx
-function useSlots(config, item, renderSlotEdit, renderSlotRender = renderSlotEdit, readOnly, forceReadOnly) {
-  return useFieldTransforms(
-    config,
-    item,
-    getSlotTransform(renderSlotEdit, renderSlotRender),
-    readOnly,
-    forceReadOnly
-  );
-}
-
-// components/RichTextEditor/lib/use-richtext-props.tsx
-import { lazy, Suspense, useMemo as useMemo2 } from "react";
-
-// components/RichTextEditor/components/RenderFallback.tsx
-import DOMPurify from "isomorphic-dompurify";
-import { jsx } from "react/jsx-runtime";
-var getClassName = get_class_name_factory_default("RichTextEditor", styles_module_default);
-function RichTextRenderFallback({ content }) {
-  return /* @__PURE__ */ jsx("div", { className: getClassName(), children: /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: "rich-text",
-      dangerouslySetInnerHTML: { __html: DOMPurify.sanitize(content) }
-    }
-  ) });
-}
-
-// components/RichTextEditor/lib/mapDeep.ts
-var mapDeep = (source, path, render) => {
-  if (!source) {
-    return null;
-  }
-  if (path.length === 0) {
-    return render(source);
-  }
-  const [key, ...rest] = path;
-  if (Array.isArray(source)) {
-    return source.map((item) => mapDeep(item, path, render));
-  }
-  return {
-    ...source,
-    [key]: mapDeep(source[key], rest, render)
-  };
-};
-
-// components/RichTextEditor/lib/use-richtext-props.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-var findAllRichtextKeys = (fields, path = []) => {
-  if (!fields) return [];
-  const result = [];
-  for (const [key, field] of Object.entries(fields)) {
-    const currentPath = [...path, key];
-    if (field.type === "richtext") {
-      result.push({
-        path: currentPath,
-        field
-      });
-    }
-    if (field.type === "array" && "arrayFields" in field) {
-      result.push(...findAllRichtextKeys(field.arrayFields, currentPath));
-    }
-    if (field.type === "object" && "objectFields" in field) {
-      result.push(...findAllRichtextKeys(field.objectFields, currentPath));
-    }
-  }
-  return result;
-};
-function useRichtextProps(fields, props) {
-  const richtextKeys = useMemo2(() => findAllRichtextKeys(fields), [fields]);
-  const richtextProps = useMemo2(() => {
-    if (!richtextKeys?.length) return {};
-    const RichTextRender = lazy(
-      () => import("./Render-I6PZ5MEA.mjs").then((m) => ({
-        default: m.RichTextRender
-      }))
-    );
-    let result = { ...props };
-    for (const { path, field } of richtextKeys) {
-      result = mapDeep(result, path, (content) => /* @__PURE__ */ jsx2(
-        Suspense,
-        {
-          fallback: /* @__PURE__ */ jsx2(RichTextRenderFallback, { content }),
-          children: /* @__PURE__ */ jsx2(RichTextRender, { content, field })
-        },
-        generateId()
-      ));
-    }
-    return result;
-  }, [richtextKeys, props]);
-  return richtextProps;
-}
-
-// components/SlotRender/server.tsx
-import { forwardRef } from "react";
-import { jsx as jsx3 } from "react/jsx-runtime";
-var SlotRenderPure = (props) => /* @__PURE__ */ jsx3(SlotRender, { ...props });
-var Item = ({
-  config,
-  item,
-  metadata
-}) => {
-  const Component = config.components[item.type];
-  const props = useSlots(config, item, (slotProps) => /* @__PURE__ */ jsx3(SlotRenderPure, { ...slotProps, config, metadata }));
-  const richtextProps = useRichtextProps(Component.fields, props);
-  return /* @__PURE__ */ jsx3(
-    Component.render,
-    {
-      ...props,
-      ...richtextProps,
-      credbuild: {
-        ...props.credbuild,
-        metadata: metadata || {}
-      }
-    }
-  );
-};
-var SlotRender = forwardRef(
-  function SlotRenderInternal({ className, style, content, config, metadata, as }, ref) {
-    const El = as ?? "div";
-    return /* @__PURE__ */ jsx3(El, { className, style, ref, children: content.map((item) => {
-      if (!config.components[item.type]) {
-        return null;
-      }
-      return /* @__PURE__ */ jsx3(
-        Item,
-        {
-          config,
-          item,
-          metadata
-        },
-        item.props.id
-      );
-    }) });
-  }
-);
-
-export {
-  buildMappers,
-  getSlotTransform,
-  useSlots,
-  RichTextRenderFallback,
-  useRichtextProps,
-  SlotRenderPure,
-  SlotRender,
-  migrate,
-  transformProps,
-  resolveAllData
-};