@netlisian/softconfig 0.1.3 → 0.1.5

package/dist/puck/index.mjs

@@ -18,18 +18,6 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
 var __async = (__this, __arguments, generator) => {
   return new Promise((resolve, reject) => {
     var fulfilled = (value) => {
@@ -64,6 +52,8 @@ import {
 var getRootProps = (appState) => appState.data.root.props;
 
 // src/puck/lib/builder/root-config.tsx
+import { useEffect } from "react";
+import equal2 from "react-fast-compare";
 import {
   createUsePuck,
   walkTree
@@ -71,59 +61,352 @@ import {
 
 // src/puck/lib/get-field-settings.tsx
 import { AutoField } from "@measured/puck";
+
+// src/puck/lib/get-settings-by-path.ts
+function getFieldSettingsByPath(fieldSettings, path) {
+  return path.split(".").reduce((o, key) => o ? o[key] : void 0, fieldSettings);
+}
+
+// src/puck/lib/array-field-utils.ts
+var primitiveFieldTypes = /* @__PURE__ */ new Set([
+  "text",
+  "textarea",
+  "number",
+  "select",
+  "radio",
+  "reference"
+]);
+var isPrimitiveValue = (value) => ["string", "number", "boolean"].includes(typeof value);
+var getFallbackValueForField = (type) => {
+  switch (type) {
+    case "number":
+      return 0;
+    case "array":
+      return [];
+    case "object":
+      return {};
+    default:
+      return "";
+  }
+};
+var resolveExpressionSummary = (item, index, expression) => {
+  if (!expression) return "";
+  let isValid = true;
+  const result = expression.replace(/\{([^}]+)\}/g, (_match, token) => {
+    if (token === "index") {
+      return String(index);
+    }
+    if (token.startsWith("item.")) {
+      const value = getFieldSettingsByPath(item, token.slice(5));
+      if (isPrimitiveValue(value)) {
+        return String(value);
+      }
+    }
+    isValid = false;
+    return "";
+  });
+  return isValid ? result : "";
+};
+var isPrimitiveFieldType = (type) => primitiveFieldTypes.has(type);
+var buildArrayDefaultItemProps = (subFields = [], subFieldSettings = {}) => {
+  if (!subFields.length) return void 0;
+  const item = {};
+  let hasValue = false;
+  subFields.forEach((subField) => {
+    const settings = subFieldSettings[subField.name];
+    if (settings && Object.prototype.hasOwnProperty.call(settings, "defaultValue") && settings.defaultValue !== void 0) {
+      item[subField.name] = settings.defaultValue;
+      hasValue = true;
+      return;
+    }
+    item[subField.name] = getFallbackValueForField(subField.type);
+    hasValue = true;
+  });
+  return hasValue ? item : void 0;
+};
+var buildArrayDefaultValue = (subFields = [], subFieldSettings = {}) => {
+  const item = buildArrayDefaultItemProps(subFields, subFieldSettings);
+  return item ? [item] : [];
+};
+var getArrayItemSummary = (item, index = 0, settings) => {
+  if ((settings == null ? void 0 : settings.summary) === "field" && settings.summaryField) {
+    const value = getFieldSettingsByPath(item, settings.summaryField);
+    if (isPrimitiveValue(value) && String(value).length > 0) {
+      return String(value);
+    }
+    return `Item ${(index || 0) + 1}`;
+  }
+  if ((settings == null ? void 0 : settings.summary) === "expression") {
+    const summary = resolveExpressionSummary(
+      item,
+      index,
+      settings.summaryExpression
+    );
+    return summary || `Item ${(index || 0) + 1}`;
+  }
+  return `Item ${(index || 0) + 1}`;
+};
+var isArrayMappingPath = (path) => {
+  return typeof path === "string" && /^[^.]+\[\]\.[^.]+$/.test(path);
+};
+var getArrayBasePath = (arrayPath) => {
+  if (!isArrayMappingPath(arrayPath)) return null;
+  const match = arrayPath.match(/^([^.]+)\[\]\./);
+  return match ? match[1] : null;
+};
+var getArrayItemSubPath = (arrayPath) => {
+  if (!isArrayMappingPath(arrayPath)) return null;
+  const match = arrayPath.match(/\[\]\.(.+)$/);
+  return match ? match[1] : null;
+};
+
+// src/puck/lib/custom-fields.ts
+var builtInSoftFieldTypes = /* @__PURE__ */ new Set([
+  "text",
+  "textarea",
+  "number",
+  "select",
+  "radio",
+  "array",
+  "object",
+  "reference"
+]);
+var warnedMessages = /* @__PURE__ */ new Set();
+var warnOnce = (message) => {
+  if (warnedMessages.has(message)) {
+    return;
+  }
+  warnedMessages.add(message);
+  console.warn(message);
+};
+var isBuiltInSoftFieldType = (fieldType) => {
+  return builtInSoftFieldTypes.has(fieldType);
+};
+var resolveCustomFieldDefinition = (fieldType, customFields) => {
+  if (isBuiltInSoftFieldType(fieldType)) {
+    return void 0;
+  }
+  return customFields == null ? void 0 : customFields[fieldType];
+};
+var resolveCustomFieldReturnType = (fieldType, customFields) => {
+  const customField = resolveCustomFieldDefinition(fieldType, customFields);
+  if (!customField) {
+    return null;
+  }
+  if (!customField.returnType) {
+    warnOnce(
+      `[soft-config] Custom field "${fieldType}" is missing a required returnType and will be skipped from mapping options.`
+    );
+    return null;
+  }
+  return customField.returnType;
+};
+var resolveCustomFieldSchema = (fieldType, customFields) => {
+  const customField = resolveCustomFieldDefinition(fieldType, customFields);
+  if (!customField) {
+    return null;
+  }
+  const returnType = resolveCustomFieldReturnType(fieldType, customFields);
+  if (!returnType) {
+    return null;
+  }
+  if (returnType !== "array" && returnType !== "object") {
+    return null;
+  }
+  const subFields = customField.subFields || [];
+  if (!subFields.length) {
+    warnOnce(
+      `[soft-config] Custom field "${fieldType}" returns ${returnType} but does not define subFields. It will be skipped from mapping options.`
+    );
+    return null;
+  }
+  return {
+    subFields,
+    subFieldSettings: customField.subFieldSettings || {}
+  };
+};
+var getCustomFieldTypeOptions = (customFields) => {
+  if (!customFields) {
+    return [];
+  }
+  return Object.entries(customFields).filter(([fieldType]) => !isBuiltInSoftFieldType(fieldType)).map(([fieldType, definition]) => ({
+    label: typeof definition.field.label === "string" && definition.field.label ? definition.field.label : fieldType,
+    value: fieldType
+  }));
+};
+var mapCustomReturnTypeToMappingType = (returnType) => {
+  switch (returnType) {
+    case "string":
+      return "textarea";
+    case "number":
+      return "number";
+    case "boolean":
+      return "select";
+    case "array":
+      return "array";
+    case "object":
+      return "object";
+    default:
+      return "textarea";
+  }
+};
+
+// src/puck/lib/get-field-settings.tsx
 import { jsx } from "react/jsx-runtime";
-var getFieldSettings = (_fields, _fieldSettings, deep) => {
+var buildPuckField = (field, fieldSettings, customFields) => {
+  const customFieldDefinition = resolveCustomFieldDefinition(
+    field.type,
+    customFields
+  );
+  const customReturnType = resolveCustomFieldReturnType(field.type, customFields);
+  if (customFieldDefinition && customReturnType) {
+    return __spreadProps(__spreadValues({}, customFieldDefinition.field), {
+      type: "custom",
+      label: customFieldDefinition.field.label || field.name
+    });
+  }
+  const resolvedType = field.type;
+  switch (resolvedType) {
+    case "text":
+    case "textarea":
+      return { type: resolvedType, label: field.name };
+    case "number":
+      return {
+        type: resolvedType,
+        label: field.name,
+        min: fieldSettings == null ? void 0 : fieldSettings.min,
+        max: fieldSettings == null ? void 0 : fieldSettings.max,
+        step: fieldSettings == null ? void 0 : fieldSettings.step
+      };
+    case "select":
+    case "radio":
+      return {
+        type: resolvedType,
+        label: field.name,
+        options: (fieldSettings == null ? void 0 : fieldSettings.options) || []
+      };
+    case "array": {
+      const subFields = (fieldSettings == null ? void 0 : fieldSettings.subFields) || [];
+      const subFieldSettings = (fieldSettings == null ? void 0 : fieldSettings.subFieldSettings) || {};
+      return {
+        type: "array",
+        label: field.name,
+        min: fieldSettings == null ? void 0 : fieldSettings.min,
+        max: fieldSettings == null ? void 0 : fieldSettings.max,
+        arrayFields: buildDefaultEditorFields(
+          subFields,
+          subFieldSettings,
+          customFields
+        ),
+        defaultItemProps: buildArrayDefaultItemProps(subFields, subFieldSettings),
+        getItemSummary(item, index) {
+          return getArrayItemSummary(item, index, fieldSettings);
+        }
+      };
+    }
+    case "object":
+      return {
+        type: "object",
+        label: field.name,
+        objectFields: buildDefaultEditorFields(
+          (fieldSettings == null ? void 0 : fieldSettings.subFields) || [],
+          (fieldSettings == null ? void 0 : fieldSettings.subFieldSettings) || {},
+          customFields
+        )
+      };
+    default:
+      return { type: "text", label: field.name };
+  }
+};
+var buildDefaultEditorFields = (fields = [], fieldSettings = {}, customFields) => {
+  return fields.reduce((acc, field) => {
+    acc[field.name] = buildPuckField(
+      field,
+      fieldSettings[field.name],
+      customFields
+    );
+    return acc;
+  }, {});
+};
+var getFieldSettings = (_fields, _fieldSettings, customFields, deep) => {
+  const customTypeOptions = getCustomFieldTypeOptions(customFields);
   return (_fields || []).reduce((fields, field) => {
     const fieldSettings = {
       // placeholder: { type: "text", label: "Placeholder" },
     };
     const currentFieldSettings = _fieldSettings == null ? void 0 : _fieldSettings[field.name];
-    switch (field.type) {
+    const customFieldDefinition = resolveCustomFieldDefinition(
+      field.type,
+      customFields
+    );
+    const customReturnType = resolveCustomFieldReturnType(
+      field.type,
+      customFields
+    );
+    const resolvedType = field.type;
+    const customSchema = resolveCustomFieldSchema(field.type, customFields);
+    const resolvedSubFields = (customSchema == null ? void 0 : customSchema.subFields) || (currentFieldSettings == null ? void 0 : currentFieldSettings.subFields) || [];
+    const resolvedSubFieldSettings = (customSchema == null ? void 0 : customSchema.subFieldSettings) || (currentFieldSettings == null ? void 0 : currentFieldSettings.subFieldSettings) || {};
+    const customDefaultValueField = customFieldDefinition && customReturnType ? __spreadProps(__spreadValues({}, customFieldDefinition.field), {
+      type: "custom",
+      label: customFieldDefinition.field.label || "Default Value"
+    }) : null;
+    if (customDefaultValueField) {
+      fieldSettings.defaultValue = customDefaultValueField;
+    }
+    switch (resolvedType) {
       case "text":
       case "textarea":
-        fieldSettings.defaultValue = {
-          type: field.type,
-          label: "Default Value"
-        };
+        if (!customDefaultValueField) {
+          fieldSettings.defaultValue = {
+            type: resolvedType,
+            label: "Default Value"
+          };
+        }
         break;
       case "number":
-        fieldSettings.defaultValue = {
-          type: field.type,
-          label: "Default Value"
-        };
+        if (!customDefaultValueField) {
+          fieldSettings.defaultValue = {
+            type: resolvedType,
+            label: "Default Value"
+          };
+        }
         fieldSettings.min = {
-          type: field.type,
+          type: resolvedType,
           label: "Minimum Value"
         };
         fieldSettings.max = {
-          type: field.type,
+          type: resolvedType,
           label: "Maximum Value"
         };
         fieldSettings.step = {
-          type: field.type,
+          type: resolvedType,
           label: "Step Size"
         };
         break;
       case "radio":
-      case "select":
-        fieldSettings.defaultValue = {
-          type: "custom",
-          label: "Default Value",
-          render: ({ value, onChange, id }) => /* @__PURE__ */ jsx(
-            AutoField,
-            {
-              field: {
-                type: field.type,
-                label: "Default Value",
-                options: (currentFieldSettings == null ? void 0 : currentFieldSettings.options) || []
-              },
-              value,
-              onChange,
-              readOnly: false,
-              id
-            }
-          )
-        };
+      case "select": {
+        const selectOptions = (currentFieldSettings == null ? void 0 : currentFieldSettings.options) || [];
+        if (!customDefaultValueField) {
+          fieldSettings.defaultValue = {
+            type: "custom",
+            label: "Default Value",
+            render: ({ value, onChange, id }) => /* @__PURE__ */ jsx(
+              AutoField,
+              {
+                field: {
+                  type: resolvedType,
+                  label: "Default Value",
+                  options: selectOptions
+                },
+                value,
+                onChange,
+                readOnly: false,
+                id
+              }
+            )
+          };
+        }
         fieldSettings.options = {
           type: "array",
           label: "Options",
@@ -143,21 +426,8 @@ var getFieldSettings = (_fields, _fieldSettings, deep) => {
           }
         };
         break;
+      }
       case "array":
-        fieldSettings.summary = {
-          type: "select",
-          label: "Summary Field",
-          options: [
-            {
-              label: "Default Numbering",
-              value: ""
-            },
-            ...((currentFieldSettings == null ? void 0 : currentFieldSettings.subFields) || []).map((f) => ({
-              label: f.name,
-              value: f.name
-            }))
-          ]
-        };
       case "object":
         fieldSettings.subFields = {
           type: "array",
@@ -186,7 +456,8 @@ var getFieldSettings = (_fields, _fieldSettings, deep) => {
                 {
                   label: "Radio",
                   value: "radio"
-                }
+                },
+                ...customTypeOptions
               ] : [
                 {
                   label: "Text",
@@ -215,7 +486,8 @@ var getFieldSettings = (_fields, _fieldSettings, deep) => {
                 {
                   label: "Reference",
                   value: "reference"
-                }
+                },
+                ...customTypeOptions
               ]
             }
           },
@@ -227,44 +499,99 @@ var getFieldSettings = (_fields, _fieldSettings, deep) => {
           fieldSettings.subFieldSettings = {
             type: "object",
             label: "Sub Field Settings",
-            objectFields: (currentFieldSettings == null ? void 0 : currentFieldSettings.subFields) ? getFieldSettings(
-              currentFieldSettings.subFields,
-              currentFieldSettings.subFieldSettings,
+            objectFields: resolvedSubFields ? getFieldSettings(
+              resolvedSubFields,
+              resolvedSubFieldSettings,
+              customFields,
               true
             ) : {}
           };
+        if (resolvedType === "array") {
+          if (!customDefaultValueField) {
+            fieldSettings.defaultValue = {
+              type: "array",
+              label: "Default Items",
+              arrayFields: buildDefaultEditorFields(
+                resolvedSubFields,
+                resolvedSubFieldSettings,
+                customFields
+              ),
+              defaultItemProps: buildArrayDefaultItemProps(
+                resolvedSubFields,
+                resolvedSubFieldSettings
+              ),
+              getItemSummary(item, index) {
+                return getArrayItemSummary(item, index, currentFieldSettings);
+              }
+            };
+          }
+          fieldSettings.min = {
+            type: "number",
+            label: "Minimum Items"
+          };
+          fieldSettings.max = {
+            type: "number",
+            label: "Maximum Items"
+          };
+          fieldSettings.summary = {
+            type: "select",
+            label: "Summary",
+            options: [
+              {
+                label: "Default Numbering / Count",
+                value: "count"
+              },
+              {
+                label: "Field",
+                value: "field"
+              },
+              {
+                label: "Expression",
+                value: "expression"
+              }
+            ]
+          };
+          if ((currentFieldSettings == null ? void 0 : currentFieldSettings.summary) === "field") {
+            fieldSettings.summaryField = {
+              type: "select",
+              label: "Summary Field",
+              options: [
+                {
+                  label: "Select a field",
+                  value: ""
+                },
+                ...resolvedSubFields.filter((subField) => isPrimitiveFieldType(subField.type)).map((subField) => ({
+                  label: subField.name,
+                  value: subField.name
+                }))
+              ]
+            };
+          }
+          if ((currentFieldSettings == null ? void 0 : currentFieldSettings.summary) === "expression") {
+            fieldSettings.summaryExpression = {
+              type: "text",
+              label: "Summary Expression"
+            };
+          }
+        }
         break;
     }
+    const overriddenFieldSettings = (customFieldDefinition == null ? void 0 : customFieldDefinition.fieldSettingsOverride) ? customFieldDefinition.fieldSettingsOverride({
+      fieldName: field.name,
+      fieldType: field.type,
+      fieldSettings: currentFieldSettings,
+      originalFieldSettings: fieldSettings
+    }) : fieldSettings;
     fields[field.name] = {
       type: "object",
       label: field.name,
-      objectFields: fieldSettings
+      objectFields: overriddenFieldSettings
     };
     return fields;
   }, {});
 };
 var get_field_settings_default = getFieldSettings;
 
-// src/puck/lib/get-settings-by-path.ts
-function getFieldSettingsByPath(fieldSettings, path) {
-  return path.split(".").reduce((o, key) => o ? o[key] : void 0, fieldSettings);
-}
-
-// src/puck/lib/set-prop-by-path.ts
-function setPropertyByPath(props, path, value) {
-  const parts = path.split(".");
-  const last = parts.pop();
-  let cur = props;
-  for (const p of parts) {
-    if (typeof cur[p] !== "object" || cur[p] === null) cur[p] = {};
-    cur = cur[p];
-  }
-  cur[last] = value;
-}
-
-// src/puck/lib/builder/root-config.tsx
-import { useEffect } from "react";
-
 // src/puck/context/useStore.ts
 import { createContext, useContext } from "react";
 import { useStore } from "zustand";
@@ -285,224 +612,356 @@ var createUseSoftConfig = () => {
 };
 var useSoftConfig = createUseSoftConfig();
 
-// src/puck/lib/builder/root-config.tsx
-import { useDebounce } from "use-debounce";
-import { Fragment, jsx as jsx2 } from "react/jsx-runtime";
-var useCustomPuck = createUsePuck();
-var breakVersion = (version) => {
-  const [major, minor, patch] = version.split(".").map((v) => parseInt(v));
-  return [major, minor, patch];
-};
-var updateVersion = (version, increment) => {
-  let [major, minor, patch] = breakVersion(version);
-  if (increment === "major") {
-    major += 1;
-    minor = 0;
-    patch = 0;
-  } else if (increment === "minor") {
-    minor += 1;
-    patch = 0;
-  } else {
-    patch += 1;
+// src/puck/lib/apply-mapping.ts
+import equal from "react-fast-compare";
+
+// src/puck/lib/set-prop-by-path.ts
+function setPropertyByPath(props, path, value) {
+  const parts = path.split(".");
+  const last = parts.pop();
+  let cur = props;
+  for (const p of parts) {
+    if (typeof cur[p] !== "object" || cur[p] === null) cur[p] = {};
+    cur = cur[p];
   }
-  return `${major}.${minor}.${patch}`;
+  cur[last] = value;
+}
+
+// src/puck/lib/apply-mapping.ts
+var resolveValueByPath = (source, path) => {
+  if (!path) return source;
+  const segments = path.split(".");
+  const resolveSegments = (current, index) => {
+    if (current === null || current === void 0) return void 0;
+    if (index >= segments.length) return current;
+    const segment = segments[index];
+    if (segment.endsWith("[]")) {
+      const arrayKey = segment.slice(0, -2);
+      const arraySource = arrayKey ? current == null ? void 0 : current[arrayKey] : current;
+      const resolvedArray = Array.isArray(arraySource) ? arraySource : Array.isArray(arraySource == null ? void 0 : arraySource.defaultValue) ? arraySource.defaultValue : void 0;
+      if (!resolvedArray) return void 0;
+      if (index === segments.length - 1) return resolvedArray;
+      return resolvedArray.map((item) => resolveSegments(item, index + 1));
+    }
+    return resolveSegments(current[segment], index + 1);
+  };
+  return resolveSegments(source, 0);
 };
-var builderRootConfig = (config, overrides, editingComponent, showVersionFields = true) => ({
-  fields: {
-    _name: overrides.name || {
-      type: "text",
-      label: "Soft Component Name"
-    },
-    _category: overrides.categories || {
-      type: "select",
-      label: "Category",
-      options: [
-        ...Object.keys(config.categories || {}).map((cat) => {
-          var _a;
-          return {
-            label: ((_a = config.categories) == null ? void 0 : _a[cat].title) || cat,
-            value: cat
-          };
-        }) || [],
-        {
-          label: Object.keys(config.categories || {}).length ? "Other" : "Uncategorized",
-          value: void 0
+var resolveFieldSettingEntryByPath = (settings, path) => {
+  if (!path) return void 0;
+  const segments = path.split(".");
+  let currentSettings = settings;
+  let currentEntry;
+  for (const segmentWithArraySuffix of segments) {
+    const segment = segmentWithArraySuffix.endsWith("[]") ? segmentWithArraySuffix.slice(0, -2) : segmentWithArraySuffix;
+    if (!currentSettings || typeof currentSettings !== "object") {
+      return void 0;
+    }
+    currentEntry = currentSettings[segment];
+    if (currentEntry === void 0) {
+      return void 0;
+    }
+    currentSettings = currentEntry == null ? void 0 : currentEntry.subFieldSettings;
+  }
+  return currentEntry;
+};
+function applyMapping(props, fieldSettings, map, resolveInput = "fieldSettings", options) {
+  var _a, _b, _c;
+  const newProps = __spreadValues({}, props);
+  const sourceProps = (_a = options == null ? void 0 : options.sourceProps) != null ? _a : props;
+  const mappedArrayPaths = /* @__PURE__ */ new Set();
+  let changed = false;
+  const changedArrayBases = /* @__PURE__ */ new Set();
+  for (const entry of map) {
+    const { from, to, transform } = entry;
+    if (!from || !to) continue;
+    const fromPaths = Array.isArray(from) ? from : [from];
+    const toPaths = Array.isArray(to) ? to : [to];
+    const hasInvalidPair = fromPaths.some((fp, idx) => {
+      const tp = toPaths[idx] || toPaths[0];
+      if (typeof fp !== "string" || typeof tp !== "string") return false;
+      return isArrayMappingPath(fp) && !isArrayMappingPath(tp);
+    });
+    if (hasInvalidPair) continue;
+    const inputValues = fromPaths.map((f) => {
+      if (resolveInput === "propsFirst") {
+        const propVal = resolveValueByPath(sourceProps, f);
+        if (propVal !== void 0) return propVal;
+        const setting = resolveValueByPath(fieldSettings, f);
+        if (setting && Object.prototype.hasOwnProperty.call(setting, "defaultValue")) {
+          return setting.defaultValue;
         }
-      ]
-    },
-    _fields: {
-      type: "array",
-      label: "Fields",
-      defaultItemProps: {
-        name: "New Field",
-        type: "text"
-      },
-      getItemSummary(item, index) {
-        return item.name || `Field ${(index || 0) + 1}`;
-      },
-      arrayFields: {
-        name: { type: "text", label: "Name" },
-        type: {
-          type: "select",
-          label: "Type",
-          options: [
-            { label: "Text", value: "text" },
-            { label: "Textarea", value: "textarea" },
-            { label: "Number", value: "number" },
-            { label: "Select", value: "select" },
-            { label: "Radio", value: "radio" },
-            { label: "Array", value: "array" },
-            { label: "Object", value: "object" }
-            // { label: "Reference", value: "reference" },
-          ]
+        return propVal;
+      }
+      const directValue = resolveValueByPath(fieldSettings, f);
+      if (directValue !== void 0) {
+        return directValue;
+      }
+      return resolveFieldSettingEntryByPath(fieldSettings, f);
+    });
+    const resolvedInputs = inputValues.map(
+      (v) => resolveInput === "fieldSettings" ? v == null ? void 0 : v.defaultValue : v
+    );
+    let result = transform ? transform(resolvedInputs, newProps) : inputValues[0];
+    if (resolveInput === "fieldSettings" && !transform && result !== void 0 && typeof result === "object" && result !== null && "defaultValue" in result) {
+      result = result.defaultValue;
+    }
+    const isSingleArrayTarget = toPaths.length === 1 && typeof toPaths[0] === "string" && isArrayMappingPath(toPaths[0]);
+    if (isSingleArrayTarget) {
+      const toPath = toPaths[0];
+      const arrayBase = getArrayBasePath(toPath);
+      const subProp = getArrayItemSubPath(toPath) || "";
+      if (!arrayBase) continue;
+      const defaultArray = Array.isArray((_b = options == null ? void 0 : options.arrayDefaults) == null ? void 0 : _b[arrayBase]) ? (_c = options == null ? void 0 : options.arrayDefaults) == null ? void 0 : _c[arrayBase] : [];
+      const currentArrayAtPath = resolveValueByPath(newProps, arrayBase);
+      const currentArray = Array.isArray(currentArrayAtPath) ? currentArrayAtPath : [];
+      const isFromArrayPath = typeof fromPaths[0] === "string" && isArrayMappingPath(fromPaths[0]);
+      const sourceArray = isFromArrayPath ? Array.isArray(result) ? result : result !== void 0 ? [result] : [] : Array.isArray(result) ? result : defaultArray.map(() => result);
+      let defaults = entry.unmappedArrayItemDefaultValues || entry.defaultOverrides || {};
+      if (typeof defaults === "string") {
+        try {
+          defaults = JSON.parse(defaults);
+        } catch (e) {
+          defaults = {};
+        }
+      }
+      const targetLength = sourceArray.length;
+      const constructed = Array.from({ length: targetLength }).map((_, idx) => {
+        const mappedValue = sourceArray[idx];
+        const defaultItem = defaultArray[idx] && typeof defaultArray[idx] === "object" ? defaultArray[idx] : {};
+        const currentItem = currentArray[idx] && typeof currentArray[idx] === "object" ? currentArray[idx] : {};
+        const item = __spreadValues(__spreadValues(__spreadValues({}, defaultItem), defaults), currentItem);
+        if (subProp && mappedValue !== void 0) {
+          setPropertyByPath(item, subProp, mappedValue);
+        }
+        return item;
+      });
+      const originalArray = resolveValueByPath(newProps, arrayBase);
+      if (!equal(originalArray, constructed)) {
+        setPropertyByPath(newProps, arrayBase, constructed);
+        changedArrayBases.add(arrayBase);
+      }
+      mappedArrayPaths.add(arrayBase);
+    } else if (toPaths.length === 1 && Array.isArray(result) && toPaths[0].includes("array")) {
+      const toPath = toPaths[0];
+      const original = resolveValueByPath(newProps, toPath);
+      if (!equal(original, result)) {
+        setPropertyByPath(newProps, toPath, result);
+        changed = true;
+      }
+    } else if (Array.isArray(result) && toPaths.length > 1) {
+      result.forEach((val, idx) => {
+        if (toPaths[idx]) {
+          const orig = resolveValueByPath(newProps, toPaths[idx]);
+          if (!equal(orig, val)) {
+            setPropertyByPath(newProps, toPaths[idx], val);
+            changed = true;
+          }
         }
+      });
+    } else if (toPaths[0]) {
+      const finalValue = result;
+      const originalValue = resolveValueByPath(newProps, toPaths[0]);
+      if (!equal(originalValue, finalValue)) {
+        setPropertyByPath(newProps, toPaths[0], finalValue);
+        changed = true;
       }
     }
-  },
-  resolveFields({ props: data }, { fields, changed }) {
-    var _a, _b;
-    if (!(data == null ? void 0 : data._fields) || changed._fields || changed._fieldSettings)
-      if ((_a = data == null ? void 0 : data._fields) == null ? void 0 : _a.length)
-        fields._fieldSettings = {
-          type: "object",
-          label: "Field Settings",
-          objectFields: get_field_settings_default(
-            data._fields || [],
-            data._fieldSettings || {}
-          )
-        };
-      else delete fields._fieldSettings;
-    if (showVersionFields && ((_b = data == null ? void 0 : data._versions) == null ? void 0 : _b.length)) {
-      const latestVersion = data._versions[data._versions.length - 1] || "1.0.0";
-      delete fields._version;
-      fields._version = {
+  }
+  const hasNetArrayChanges = Array.from(changedArrayBases).some(
+    (arrayBase) => !equal(resolveValueByPath(props, arrayBase), resolveValueByPath(newProps, arrayBase))
+  );
+  return { newProps, mappedArrayPaths, changed: changed || hasNetArrayChanges };
+}
+
+// src/puck/lib/builder/root-config.tsx
+import { Fragment, jsx as jsx2 } from "react/jsx-runtime";
+var useCustomPuck = createUsePuck();
+var getSerializableProps = (props) => {
+  const cleanProps = {
+    id: props.id
+  };
+  for (const key in props) {
+    const value = props[key];
+    if (["children", "puck", "editMode"].includes(key)) continue;
+    if (value && typeof value === "object" && value.$$typeof) continue;
+    if (typeof value === "function") continue;
+    cleanProps[key] = value;
+  }
+  return cleanProps;
+};
+var builderRootConfig = (config, overrides, editingComponent, showVersionFields = true, customFields) => {
+  const customTypeOptions = getCustomFieldTypeOptions(customFields);
+  return {
+    fields: __spreadValues({
+      _name: overrides.name || {
+        type: "text",
+        label: "Soft Component Name"
+      },
+      _category: overrides.categories || {
         type: "select",
-        label: "Version",
+        label: "Category",
         options: [
-          ...data._versions.map((v) => ({ label: v, value: v })),
-          {
-            label: `${updateVersion(latestVersion, "patch")} (Patch)`,
-            value: updateVersion(latestVersion, "patch")
-          },
-          {
-            label: `${updateVersion(latestVersion, "minor")} (Minor)`,
-            value: updateVersion(latestVersion, "minor")
-          },
+          ...Object.keys(config.categories || {}).map((cat) => {
+            var _a;
+            return {
+              label: ((_a = config.categories) == null ? void 0 : _a[cat].title) || cat,
+              value: cat
+            };
+          }) || [],
           {
-            label: `${updateVersion(latestVersion, "major")} (Major)`,
-            value: updateVersion(latestVersion, "major")
+            label: Object.keys(config.categories || {}).length ? "Other" : "Uncategorized",
+            value: void 0
           }
         ]
-      };
-    } else {
-      delete fields._version;
-    }
-    return fields;
-  },
-  resolveData: (props, params) => {
-    if (overrides.onRootsDataChange)
-      overrides.onRootsDataChange(props, params);
-    return {
-      props,
-      readOnly: Boolean(editingComponent) ? {
-        _name: true
-      } : void 0
-    };
-  },
-  render: (props) => {
-    const fieldSettings = props == null ? void 0 : props._fieldSettings;
-    const data = useCustomPuck((s) => s.appState.data);
-    const dispatch = useCustomPuck((s) => s.dispatch);
-    const getSelectorForId = useCustomPuck((s) => s.getSelectorForId);
-    const setVersion = useSoftConfig((s) => s.builder.setVersion);
-    const state = useSoftConfig((s) => s.state);
-    const [debouncedFieldSettings] = useDebounce(fieldSettings, 500);
-    useEffect(() => {
-      if (!debouncedFieldSettings || Object.keys(debouncedFieldSettings).length === 0) return;
-      walkTree(
-        data,
-        {
-          components: config.components
+      },
+      _fields: {
+        type: "array",
+        label: "Fields",
+        defaultItemProps: {
+          name: "New Field",
+          type: "text"
         },
-        (content) => content.map((child) => {
-          var _a;
-          const map = ((_a = child.props) == null ? void 0 : _a._map) || [];
-          if (map.length) {
-            map.forEach(({ from, to, transform }) => {
-              if (!from || !to) return;
-              const fromPaths = Array.isArray(from) ? from : [from];
-              const toPaths = Array.isArray(to) ? to : [to];
-              const inputValues = fromPaths.map(
-                (f) => getFieldSettingsByPath(props._fieldSettings || {}, f)
-              );
-              let value = transform ? transform(
-                inputValues.map((v) => v == null ? void 0 : v.defaultValue),
-                child.props
-              ) : inputValues[0];
-              if (Array.isArray(value)) {
-                value.forEach((val, i) => {
-                  if (toPaths[i]) {
-                    const originalValue = getFieldSettingsByPath(
-                      child.props,
-                      toPaths[i]
-                    );
-                    if (originalValue !== val) {
-                      const itemSelector = getSelectorForId(child.props.id);
-                      if (!itemSelector) return;
-                      setPropertyByPath(child.props, toPaths[i], val);
-                      dispatch({
-                        type: "replace",
-                        data: child,
-                        destinationIndex: itemSelector == null ? void 0 : itemSelector.index,
-                        destinationZone: itemSelector == null ? void 0 : itemSelector.zone
-                      });
-                    }
-                  }
-                });
-              } else if (toPaths[0]) {
-                const setting = getFieldSettingsByPath(
-                  debouncedFieldSettings,
-                  fromPaths.length === 1 ? fromPaths[0] : fromPaths.join(".")
-                );
-                const defaultValue = setting == null ? void 0 : setting.defaultValue;
-                const originalValue = getFieldSettingsByPath(
-                  child.props,
-                  toPaths[0]
-                );
-                const finalValue = transform !== void 0 && value !== void 0 ? value : defaultValue !== void 0 ? defaultValue : value;
-                if (originalValue !== finalValue) {
-                  const itemSelector = getSelectorForId(child.props.id);
-                  if (!itemSelector) return;
-                  setPropertyByPath(child.props, toPaths[0], finalValue);
-                  dispatch({
-                    type: "replace",
-                    data: child,
-                    destinationIndex: itemSelector == null ? void 0 : itemSelector.index,
-                    destinationZone: itemSelector == null ? void 0 : itemSelector.zone
-                  });
-                }
-              }
-            });
+        getItemSummary(item, index) {
+          return item.name || `Field ${(index || 0) + 1}`;
+        },
+        arrayFields: {
+          name: { type: "text", label: "Name" },
+          type: {
+            type: "select",
+            label: "Type",
+            options: [
+              { label: "Text", value: "text" },
+              { label: "Textarea", value: "textarea" },
+              { label: "Number", value: "number" },
+              { label: "Select", value: "select" },
+              { label: "Radio", value: "radio" },
+              { label: "Array", value: "array" },
+              { label: "Object", value: "object" },
+              // { label: "Reference", value: "reference" },
+              ...customTypeOptions
+            ]
           }
-          return child;
-        })
-      );
-    }, [debouncedFieldSettings, data, dispatch, getSelectorForId, props._fieldSettings]);
-    useEffect(() => {
-      var _a;
-      if (state !== "remodeling") return;
-      if (!(props == null ? void 0 : props._version) || !(props == null ? void 0 : props._name)) return;
-      const currentVersion = props == null ? void 0 : props._version;
-      if (((_a = props._versions) == null ? void 0 : _a.includes(currentVersion)) && props._versions.length > 1) {
-        setVersion(props._name, currentVersion, props, dispatch);
+        }
       }
-    }, [props == null ? void 0 : props._version]);
-    return /* @__PURE__ */ jsx2(Fragment, { children: props.children });
-  }
-});
+    }, overrides.additionalRootFields || {}),
+    resolveFields({ props: data }, { fields, changed }) {
+      const newFields = __spreadValues({}, fields);
+      const rootFields = Array.isArray(
+        data == null ? void 0 : data._fields
+      ) ? (data == null ? void 0 : data._fields) || [] : [];
+      const rootFieldSettings = (data == null ? void 0 : data._fieldSettings) || {};
+      if (changed._fields || changed._fieldSettings) {
+        if (rootFields.length) {
+          newFields._fieldSettings = {
+            type: "object",
+            label: "Field Settings",
+            objectFields: get_field_settings_default(
+              rootFields,
+              rootFieldSettings,
+              customFields
+            )
+          };
+        } else {
+          delete newFields._fieldSettings;
+        }
+      }
+      return newFields;
+    },
+    // resolveData: (props, params) => {
+    //   if (overrides.resolveRootData) {
+    //     return overrides.resolveRootData(props, params, { editingComponent });
+    //   }
+    //   const result: {
+    //     props: RootData<AsFieldProps<WithChildren<BuilderRootConfig>>>;
+    //     readOnly: Readonly<Record<string, boolean>> | undefined;
+    //   } = {
+    //     props,
+    //     readOnly: undefined,
+    //   };
+    //   return result;
+    // },
+    render: (props) => {
+      const fieldSettings = props == null ? void 0 : props._fieldSettings;
+      const data = useCustomPuck((s) => s.appState.data);
+      const dispatch = useCustomPuck((s) => s.dispatch);
+      const getSelectorForId = useCustomPuck((s) => s.getSelectorForId);
+      const setVersion = useSoftConfig((s) => s.builder.setVersion);
+      const state = useSoftConfig((s) => s.state);
+      useEffect(() => {
+        if (!fieldSettings || Object.keys(fieldSettings).length === 0) return;
+        const replacements = [];
+        walkTree(
+          {
+            content: (data == null ? void 0 : data.content) || [],
+            root: (data == null ? void 0 : data.root) || {}
+          },
+          {
+            components: config.components
+          },
+          (content) => content.map((child) => {
+            var _a;
+            const map = ((_a = child.props) == null ? void 0 : _a._map) || [];
+            if (!map.length) return child;
+            const cleanProps = getSerializableProps(child.props);
+            const { newProps, changed } = applyMapping(
+              cleanProps,
+              fieldSettings,
+              map,
+              "fieldSettings"
+            );
+            if (!changed || equal2(cleanProps, newProps)) return child;
+            replacements.push({
+              id: child.props.id,
+              data: __spreadProps(__spreadValues({}, child), { props: newProps })
+            });
+            return child;
+          })
+        );
+        if (!replacements.length) return;
+        replacements.forEach((replacement) => {
+          const itemSelector = getSelectorForId(replacement.id);
+          if (!itemSelector) return;
+          dispatch({
+            type: "replace",
+            data: replacement.data,
+            destinationIndex: itemSelector.index,
+            destinationZone: itemSelector.zone
+          });
+        });
+      }, [fieldSettings, data, dispatch, getSelectorForId]);
+      useEffect(() => {
+        var _a;
+        if (state !== "remodeling" || !(props == null ? void 0 : props._version) || !(props == null ? void 0 : props._name)) return;
+        const currentVersion = props._version;
+        if (((_a = props._versions) == null ? void 0 : _a.includes(currentVersion)) && props._versions.length > 1) {
+          setVersion(props._name, currentVersion, props, dispatch);
+        }
+      }, [props == null ? void 0 : props._version]);
+      return /* @__PURE__ */ jsx2(Fragment, { children: props.children });
+    }
+  };
+};
 
 // src/puck/lib/builder/generate-field-options.ts
-function generateFieldOptions(fields, selectedFields, prefix = "") {
+var hasArrayMappingPath = (value) => value.includes("[]");
+var isBareArrayPath = (value) => !hasArrayMappingPath(value) && !value.includes(".");
+function filterToOptionsForFrom(fromPath, toOptions) {
+  if (!fromPath) return toOptions;
+  const fromHasArrayMapping = hasArrayMappingPath(fromPath);
+  const fromIsBareArray = isBareArrayPath(fromPath);
+  return toOptions.filter((option) => {
+    const optionHasArrayMapping = hasArrayMappingPath(option.value);
+    if (fromHasArrayMapping) {
+      return optionHasArrayMapping;
+    }
+    if (fromIsBareArray) {
+      return isBareArrayPath(option.value);
+    }
+    return !optionHasArrayMapping;
+  });
+}
+function generateFieldOptions(fields, prefix = "") {
   const opts = [];
   function recurse(current, prefix2) {
     Object.entries(current).forEach(([key, fld]) => {
@@ -510,36 +969,68 @@ function generateFieldOptions(fields, selectedFields, prefix = "") {
       if (key === "_map") return;
       if (key === "_slotEnabled") return;
       const path = prefix2 ? `${prefix2}.${key}` : key;
-      if (selectedFields.includes(path)) {
-        return;
-      }
-      opts.push({ label: path, value: path, type: fld.type });
       if (fld.type === "object" && fld.objectFields) {
         recurse(fld.objectFields, path);
-      }
-      if (fld.type === "array" && fld.arrayFields) {
-        recurse(fld.arrayFields, path);
+      } else if (fld.type === "array" && fld.arrayFields) {
+        recurse(
+          fld.arrayFields,
+          path + "[]"
+        );
+      } else {
+        opts.push({ label: path, value: path, type: fld.type });
       }
     });
   }
   recurse(fields, prefix);
   return opts;
 }
-function generateDynamicFieldOptions(_fields, _fieldSettings, prefix = "") {
+function generateDynamicFieldOptions(_fields, _fieldSettings, customFields, prefix = "") {
   const opts = [];
-  if (!_fields || !_fieldSettings) return opts;
+  if (!_fields) return opts;
   function recurse(fields, fieldSettings, currentPrefix) {
     fields.forEach((field) => {
       var _a;
       const settings = fieldSettings[field.name];
+      const customReturnType = resolveCustomFieldReturnType(
+        field.type,
+        customFields
+      );
       const path = currentPrefix ? `${currentPrefix}.${field.name}` : field.name;
-      opts.push({ label: path, value: path, type: field.type });
+      if (customReturnType) {
+        if (customReturnType === "array" || customReturnType === "object") {
+          const customSchema = resolveCustomFieldSchema(field.type, customFields);
+          if (!customSchema) {
+            return;
+          }
+          recurse(
+            customSchema.subFields,
+            customSchema.subFieldSettings,
+            path + (customReturnType === "array" ? "[]" : "")
+          );
+          return;
+        }
+        opts.push({
+          label: path,
+          value: path,
+          type: mapCustomReturnTypeToMappingType(customReturnType)
+        });
+        return;
+      }
+      if (!isBuiltInSoftFieldType(field.type)) {
+        return;
+      }
       if ((_a = settings == null ? void 0 : settings.subFields) == null ? void 0 : _a.length) {
-        recurse(settings.subFields, settings.subFieldSettings || {}, path);
+        recurse(
+          settings.subFields,
+          settings.subFieldSettings || {},
+          path + (field.type === "array" ? "[]" : "")
+        );
+      } else if (field.type !== "array" && field.type !== "object") {
+        opts.push({ label: path, value: path, type: field.type });
       }
     });
   }
-  recurse(_fields, _fieldSettings, prefix);
+  recurse(_fields, _fieldSettings || {}, prefix);
   return opts;
 }
 
@@ -631,8 +1122,14 @@ var ErrorBoundary = class extends Component {
 
 // src/puck/lib/builder/builder-config.tsx
 import { jsx as jsx4 } from "react/jsx-runtime";
-var builderConfig = (config, overrides, editingComponent, showVersionFields = true, dependents) => ({
-  root: builderRootConfig(config, overrides, editingComponent, showVersionFields),
+var builderConfig = (config, overrides, editingComponent, showVersionFields = true, dependents, customFields) => ({
+  root: builderRootConfig(
+    config,
+    overrides,
+    editingComponent,
+    showVersionFields,
+    customFields
+  ),
   components: Object.entries(__spreadValues({}, config.components)).reduce(
     (acc, [name, component]) => {
       const tempComponent = __spreadProps(__spreadValues({}, component), {
@@ -641,6 +1138,7 @@ var builderConfig = (config, overrides, editingComponent, showVersionFields = tr
         },
         resolveFields(data, params) {
           return __async(this, null, function* () {
+            var _a2;
             let fields = {};
             if (!fields._slot) {
               const slotFields = Object.entries(params.fields).filter(
@@ -661,8 +1159,8 @@ var builderConfig = (config, overrides, editingComponent, showVersionFields = tr
                         { label: "Select a slot", value: "" },
                         ...slotFields.filter(
                           ([fieldName, field]) => {
-                            var _a2;
-                            return field.type === "slot" && !(((_a2 = data.props) == null ? void 0 : _a2._slot) || []).some(
+                            var _a3;
+                            return field.type === "slot" && !(((_a3 = data.props) == null ? void 0 : _a3._slot) || []).some(
                               (s) => s.slot === fieldName
                             );
                           }
@@ -681,17 +1179,21 @@ var builderConfig = (config, overrides, editingComponent, showVersionFields = tr
                 };
             }
             const defaultFields = component.resolveFields ? yield component.resolveFields(data, params) : component.fields || {};
-            if (!fields._map) {
+            if (!fields._map || params.changed._map) {
               const rootProps = getRootProps(params.appState);
               const fromOptions = generateDynamicFieldOptions(
                 (rootProps == null ? void 0 : rootProps._fields) || [],
-                (rootProps == null ? void 0 : rootProps._fieldSettings) || {}
+                (rootProps == null ? void 0 : rootProps._fieldSettings) || {},
+                customFields
               );
-              const toOptions = generateFieldOptions(defaultFields, []);
+              const toOptionsFields = component.resolveFields && ((_a2 = data.props) == null ? void 0 : _a2._map) ? yield component.resolveFields(
+                __spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { _map: void 0 }) }),
+                params
+              ) : defaultFields;
+              const toOptions = generateFieldOptions(toOptionsFields);
               fields._map = overrides.map ? {
                 type: "custom",
                 render: ({ value, onChange, id }) => {
-                  const toOptions2 = generateFieldOptions(defaultFields, []);
                   const rootProps2 = getRootProps(params.appState);
                   return overrides.map({
                     rootProps: rootProps2,
@@ -700,13 +1202,39 @@ var builderConfig = (config, overrides, editingComponent, showVersionFields = tr
                     id,
                     props: data.props || {},
                     fromOptions,
-                    toOptions: toOptions2
+                    toOptions
                   });
                 }
-              } : {
-                type: "array",
-                label: "Dynamic Field Map",
-                arrayFields: {
+              } : (() => {
+                var _a3;
+                const mapEntries = ((_a3 = data.props) == null ? void 0 : _a3._map) || [];
+                const toPaths = mapEntries.flatMap(
+                  (entry) => Array.isArray(entry.to) ? entry.to : entry.to ? [entry.to] : []
+                );
+                const toPath = toPaths.find(
+                  (path) => typeof path === "string" && isArrayMappingPath(path)
+                );
+                const arrayBaseName = toPath ? getArrayBasePath(toPath) : null;
+                const targetArrayField = arrayBaseName ? defaultFields[arrayBaseName] : null;
+                const mappedSubProps = /* @__PURE__ */ new Set();
+                if (arrayBaseName) {
+                  toPaths.forEach((path) => {
+                    if (typeof path !== "string") return;
+                    if (getArrayBasePath(path) !== arrayBaseName) return;
+                    const subProp = getArrayItemSubPath(path);
+                    if (subProp) mappedSubProps.add(subProp);
+                  });
+                }
+                const defaultValueFields = {};
+                if (targetArrayField && targetArrayField.type === "array" && targetArrayField.arrayFields) {
+                  const arrayFields = targetArrayField.arrayFields;
+                  Object.entries(arrayFields).forEach(([key, fld]) => {
+                    if (mappedSubProps.has(key)) return;
+                    if (fld.type === "array" || fld.type === "object" || fld.type === "slot") return;
+                    defaultValueFields[key] = __spreadProps(__spreadValues({}, fld), { label: fld.label || key });
+                  });
+                }
+                const baseArrayFields = {
                   from: {
                     type: "select",
                     label: "From",
@@ -729,47 +1257,57 @@ var builderConfig = (config, overrides, editingComponent, showVersionFields = tr
                       }))
                     ]
                   }
+                };
+                if (arrayBaseName && Object.keys(defaultValueFields).length > 0) {
+                  baseArrayFields.unmappedArrayItemDefaultValues = {
+                    type: "object",
+                    label: "Default Item Values",
+                    objectFields: defaultValueFields
+                  };
                 }
-              };
+                return {
+                  type: "array",
+                  label: "Dynamic Field Map",
+                  arrayFields: baseArrayFields
+                };
+              })();
             }
             fields = __spreadValues(__spreadValues({}, fields), defaultFields);
             return fields;
           });
         },
         resolveData: ({ props }, { lastData }) => {
-          var _a2;
-          const _map = props._map || [];
+          const _map = (props._map || []).map((item) => {
+            const newItem = __spreadValues({}, item);
+            if (typeof newItem.unmappedArrayItemDefaultValues === "string") {
+              try {
+                newItem.unmappedArrayItemDefaultValues = JSON.parse(
+                  newItem.unmappedArrayItemDefaultValues
+                );
+              } catch (e) {
+                newItem.unmappedArrayItemDefaultValues = {};
+              }
+            } else if (!newItem.unmappedArrayItemDefaultValues) {
+              newItem.unmappedArrayItemDefaultValues = {};
+            }
+            return newItem;
+          });
           const readOnlyFields = _map.flatMap((item) => item.to);
+          const readOnlyArrayBases = readOnlyFields.filter((field) => typeof field === "string").map(getArrayBasePath).filter((base) => base !== null);
           if (_map.length) {
             return {
-              props,
-              readOnly: readOnlyFields.reduce(
+              props: __spreadProps(__spreadValues({}, props), { _map }),
+              readOnly: [
+                ...readOnlyFields.map((f) => String(f)),
+                ...readOnlyArrayBases
+              ].reduce(
                 (acc2, field) => __spreadProps(__spreadValues({}, acc2), { [field]: true }),
                 {}
               )
             };
           }
-          const prevMap = (_a2 = lastData == null ? void 0 : lastData.props) == null ? void 0 : _a2._map;
-          if (prevMap && prevMap.length === 1) {
-            const lastField = prevMap[0].to;
-            if (typeof lastField === "string") {
-              return {
-                props,
-                readOnly: { [lastField]: false }
-              };
-            }
-            if (Array.isArray(lastField)) {
-              return {
-                props,
-                readOnly: lastField.reduce(
-                  (acc2, field) => __spreadProps(__spreadValues({}, acc2), { [String(field)]: false }),
-                  {}
-                )
-              };
-            }
-          }
           return {
-            props,
+            props: __spreadProps(__spreadValues({}, props), { _map }),
             readOnly: {}
           };
         },
@@ -785,6 +1323,9 @@ var builderConfig = (config, overrides, editingComponent, showVersionFields = tr
   categories: config.categories || {}
 });
 
+// src/puck/lib/soft-component-constants.ts
+var TECHNICAL_KEYS = /* @__PURE__ */ new Set(["_map", "_slot", "id", "_version"]);
+
 // src/puck/lib/strip-id.ts
 var stripIdFromProps = (components, allowedTypes) => {
   return components.map((component) => sanitizeComponent(component, allowedTypes));
@@ -808,7 +1349,7 @@ var sanitizeComponent = (component, allowedTypes) => {
 var getSubComponents = (content, componentConfigs, fieldSettings, slots) => {
   if (!content || !Array.isArray(content)) return [];
   return content.map((componentProps) => {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     const componentConfig = componentConfigs[componentProps.type];
     const enabledSlotNames = new Set(
       (((_a = componentProps.props) == null ? void 0 : _a._slot) || []).map((s) => s.slot)
@@ -829,7 +1370,27 @@ var getSubComponents = (content, componentConfigs, fieldSettings, slots) => {
       },
       {}
     ) || {};
-    const fixedProps = __spreadValues(__spreadValues({}, componentConfig == null ? void 0 : componentConfig.defaultProps), componentProps.props);
+    const map = ((_b = componentProps.props) == null ? void 0 : _b._map) || [];
+    const mappedPaths = /* @__PURE__ */ new Set();
+    map.forEach((item) => {
+      const to = Array.isArray(item.to) ? item.to : [item.to];
+      to.forEach((path) => {
+        if (path) {
+          if (isArrayMappingPath(path)) {
+            const basePath = getArrayBasePath(path);
+            if (basePath) mappedPaths.add(basePath);
+          } else {
+            mappedPaths.add(path);
+          }
+        }
+      });
+    });
+    const fixedProps = Object.entries(__spreadValues(__spreadValues({}, componentConfig == null ? void 0 : componentConfig.defaultProps), componentProps.props)).reduce((acc, [key, value]) => {
+      if (!TECHNICAL_KEYS.has(key) && !mappedPaths.has(key)) {
+        acc[key] = value;
+      }
+      return acc;
+    }, {});
     (componentProps.props._slot || []).forEach(
       (s) => {
         var _a2;
@@ -843,19 +1404,34 @@ var getSubComponents = (content, componentConfigs, fieldSettings, slots) => {
       }
     );
     const subComponent = {
-      map: ((_b = componentProps.props) == null ? void 0 : _b._map) || [],
+      map: ((_c = componentProps.props) == null ? void 0 : _c._map) || [],
       fixedProps,
       type: componentProps.type,
       components,
-      enabledSlots: ((_c = componentProps.props) == null ? void 0 : _c._slot) || []
+      enabledSlots: ((_d = componentProps.props) == null ? void 0 : _d._slot) || []
     };
     return subComponent;
   });
 };
-var softFieldsToPuckFields = (fields, fieldSettings) => {
+var softFieldsToPuckFields = (fields, fieldSettings, customFields) => {
   return (fields == null ? void 0 : fields.reduce(
     (acc, field) => {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
+      var _a, _b, _c, _d, _e, _f;
+      const customFieldDefinition = resolveCustomFieldDefinition(
+        field.type,
+        customFields
+      );
+      const customReturnType = resolveCustomFieldReturnType(
+        field.type,
+        customFields
+      );
+      if (customFieldDefinition && customReturnType) {
+        acc[field.name] = __spreadProps(__spreadValues({}, customFieldDefinition.field), {
+          type: "custom",
+          label: customFieldDefinition.field.label || field.name
+        });
+        return acc;
+      }
       switch (field.type) {
         case "text":
         case "textarea":
@@ -880,13 +1456,24 @@ var softFieldsToPuckFields = (fields, fieldSettings) => {
           break;
         // TODO: Default item props
         case "array":
+          const currentArraySettings = (fieldSettings == null ? void 0 : fieldSettings[field.name]) || {};
           acc[field.name] = {
             type: field.type,
             label: field.name,
+            min: currentArraySettings.min,
+            max: currentArraySettings.max,
             arrayFields: softFieldsToPuckFields(
-              ((_e = fieldSettings == null ? void 0 : fieldSettings[field.name]) == null ? void 0 : _e.subFields) || [],
-              ((_f = fieldSettings == null ? void 0 : fieldSettings[field.name]) == null ? void 0 : _f.subFieldSettings) || {}
-            )
+              currentArraySettings.subFields || [],
+              currentArraySettings.subFieldSettings || {},
+              customFields
+            ),
+            defaultItemProps: buildArrayDefaultItemProps(
+              currentArraySettings.subFields,
+              currentArraySettings.subFieldSettings
+            ),
+            getItemSummary(item, index) {
+              return getArrayItemSummary(item, index, currentArraySettings);
+            }
           };
           break;
         // TODO: Needs testing to see if it works
@@ -895,8 +1482,9 @@ var softFieldsToPuckFields = (fields, fieldSettings) => {
             type: field.type,
             label: field.name,
             objectFields: softFieldsToPuckFields(
-              ((_g = fieldSettings == null ? void 0 : fieldSettings[field.name]) == null ? void 0 : _g.subFields) || [],
-              ((_h = fieldSettings == null ? void 0 : fieldSettings[field.name]) == null ? void 0 : _h.subFieldSettings) || {}
+              ((_e = fieldSettings == null ? void 0 : fieldSettings[field.name]) == null ? void 0 : _e.subFields) || [],
+              ((_f = fieldSettings == null ? void 0 : fieldSettings[field.name]) == null ? void 0 : _f.subFieldSettings) || {},
+              customFields
             )
           };
           break;
@@ -908,21 +1496,69 @@ var softFieldsToPuckFields = (fields, fieldSettings) => {
     {}
   )) || {};
 };
-var softComponentFromAppState = (appState, configComponents, editedItem, metadata) => {
+var softComponentFromAppState = (appState, configComponents, editedItem, metadata, customFields) => {
   var _a;
   const rootProps = ((_a = appState.data.root) == null ? void 0 : _a.props) || {};
   const fields = rootProps._fields || [];
   const field_settings = rootProps._fieldSettings || {};
+  const normalizedFieldSettings = __spreadValues({}, field_settings);
+  (fields || []).forEach((field) => {
+    const customFieldDefinition = resolveCustomFieldDefinition(
+      field.type,
+      customFields
+    );
+    const customReturnType = resolveCustomFieldReturnType(
+      field.type,
+      customFields
+    );
+    if (!customFieldDefinition || !customReturnType) {
+      return;
+    }
+    const schema = resolveCustomFieldSchema(field.type, customFields);
+    const existingSettings = normalizedFieldSettings[field.name] || {};
+    normalizedFieldSettings[field.name] = __spreadValues(__spreadProps(__spreadValues({}, existingSettings), {
+      customFieldType: field.type,
+      customFieldReturnType: customReturnType
+    }), schema ? {
+      subFields: schema.subFields,
+      subFieldSettings: schema.subFieldSettings
+    } : {});
+  });
+  const builtInRootProps = /* @__PURE__ */ new Set([
+    "_name",
+    "_category",
+    "_version",
+    "_versions",
+    "_fields",
+    "_fieldSettings"
+  ]);
+  const customRootProps = Object.keys(rootProps).filter((key) => key.startsWith("_") && !builtInRootProps.has(key)).reduce(
+    (acc, key) => {
+      acc[key] = rootProps[key];
+      return acc;
+    },
+    {}
+  );
   const slots = {};
   const components = getSubComponents(
     [editedItem],
     configComponents,
-    field_settings,
+    normalizedFieldSettings,
     slots
   );
-  const defaultProps = __spreadValues(__spreadValues({}, Object.keys(field_settings).reduce(
+  const defaultProps = __spreadValues(__spreadValues({}, Object.keys(normalizedFieldSettings).reduce(
     (acc, field) => {
-      acc[field] = field_settings[field].defaultValue;
+      var _a2;
+      const fieldDefinition = (fields || []).find((item) => item.name === field);
+      const customFieldReturnType = (_a2 = normalizedFieldSettings[field]) == null ? void 0 : _a2.customFieldReturnType;
+      if ((fieldDefinition == null ? void 0 : fieldDefinition.type) === "array" || customFieldReturnType === "array") {
+        acc[field] = normalizedFieldSettings[field].defaultValue !== void 0 ? normalizedFieldSettings[field].defaultValue : buildArrayDefaultValue(
+          normalizedFieldSettings[field].subFields,
+          normalizedFieldSettings[field].subFieldSettings
+        );
+        return acc;
+      }
+      acc[field] = normalizedFieldSettings[field].defaultValue;
       return acc;
     },
     {}
@@ -931,12 +1567,13 @@ var softComponentFromAppState = (appState, configComponents, editedItem, metadat
     {
       name: metadata.name,
       category: metadata.category,
-      fields: __spreadValues(__spreadValues({}, softFieldsToPuckFields(fields, field_settings)), Object.keys(slots).reduce((acc, slot) => {
+      fields: __spreadValues(__spreadValues({}, softFieldsToPuckFields(fields, normalizedFieldSettings, customFields)), Object.keys(slots).reduce((acc, slot) => {
         acc[slot] = { type: "slot", label: slot };
         return acc;
       }, {})),
-      fieldSettings: field_settings,
+      fieldSettings: normalizedFieldSettings,
       defaultProps,
+      rootProps: customRootProps,
       components,
       slots
     },
@@ -948,17 +1585,67 @@ var softComponentFromAppState = (appState, configComponents, editedItem, metadat
 import { v4 as uuidv4 } from "uuid";
 var generateId = (type) => type ? `${type}-${uuidv4()}` : uuidv4();
 
+// src/puck/lib/component-key.ts
+var defaultToCamelCase = (value) => {
+  const tokens = value.trim().replace(/[^a-zA-Z0-9\s_-]/g, " ").split(/[\s_-]+/).filter(Boolean);
+  if (tokens.length === 0) return "";
+  const [first, ...rest] = tokens;
+  return `${first.toLowerCase()}${rest.map((token) => token.charAt(0).toUpperCase() + token.slice(1).toLowerCase()).join("")}`;
+};
+var createComponentKeyFromName = (displayName, overrides, context) => {
+  const key = overrides.componentNameToKey ? overrides.componentNameToKey(displayName, context) : defaultToCamelCase(displayName);
+  return key.trim();
+};
+var getComponentNameFromKey = (key, overrides) => {
+  if (overrides == null ? void 0 : overrides.componentKeyToName) {
+    return overrides.componentKeyToName(key);
+  }
+  return key;
+};
+
 // src/puck/lib/soft-component-to-appstate.ts
-var puckFieldsToSoftFields = (fields, slots) => {
+var mergeFieldSettings = (generated = {}, persisted = {}) => {
+  return Object.entries(persisted).reduce((acc, [fieldName, value]) => {
+    const current = acc[fieldName] || {};
+    acc[fieldName] = __spreadProps(__spreadValues(__spreadValues({}, current), value), {
+      subFieldSettings: current.subFieldSettings || (value == null ? void 0 : value.subFieldSettings) ? mergeFieldSettings(
+        current.subFieldSettings || {},
+        (value == null ? void 0 : value.subFieldSettings) || {}
+      ) : void 0
+    });
+    return acc;
+  }, __spreadValues({}, generated));
+};
+var puckFieldsToSoftFields = (fields, slots, persistedFieldSettings = {}, customFields) => {
   const softFields = [];
   const fieldSettings = {};
   Object.entries(fields).forEach(([fieldName, field]) => {
+    var _a;
+    const persistedSettings = persistedFieldSettings == null ? void 0 : persistedFieldSettings[fieldName];
+    const fieldWithMeta = field;
+    const customFieldType = fieldWithMeta.customFieldType || (persistedSettings == null ? void 0 : persistedSettings.customFieldType);
+    const customFieldReturnType = fieldWithMeta.customFieldReturnType || (persistedSettings == null ? void 0 : persistedSettings.customFieldReturnType) || (customFieldType ? (_a = customFields == null ? void 0 : customFields[customFieldType]) == null ? void 0 : _a.returnType : void 0);
     if (slots.has(fieldName)) {
       return;
     }
     if (fieldName === "_version") {
       return;
     }
+    if (field.type === "custom" && customFieldType) {
+      softFields.push({ name: fieldName, type: customFieldType });
+      const customSchema = resolveCustomFieldSchema(customFieldType, customFields);
+      fieldSettings[fieldName] = __spreadValues(__spreadProps(__spreadValues({}, persistedSettings || {}), {
+        customFieldType,
+        customFieldReturnType
+      }), customSchema ? {
+        subFields: customSchema.subFields,
+        subFieldSettings: customSchema.subFieldSettings
+      } : {});
+      if (!Object.prototype.hasOwnProperty.call(fieldSettings[fieldName], "defaultValue")) {
+        fieldSettings[fieldName].defaultValue = void 0;
+      }
+      return;
+    }
     switch (field.type) {
       case "text":
       case "textarea":
@@ -976,67 +1663,81 @@ var puckFieldsToSoftFields = (fields, slots) => {
       case "radio":
         softFields.push({ name: fieldName, type: field.type });
         fieldSettings[fieldName] = {
-          options: field.options || []
+          options: field.options ? [...field.options] : []
         };
         break;
       case "array":
         softFields.push({ name: fieldName, type: "array" });
         const arrayFieldsResult = puckFieldsToSoftFields(
           field.arrayFields || {},
-          /* @__PURE__ */ new Set()
+          /* @__PURE__ */ new Set(),
+          persistedSettings == null ? void 0 : persistedSettings.subFieldSettings,
+          customFields
         );
-        fieldSettings[fieldName] = {
+        fieldSettings[fieldName] = __spreadProps(__spreadValues({}, persistedSettings || {}), {
           subFields: arrayFieldsResult.fields,
           subFieldSettings: arrayFieldsResult.fieldSettings
-        };
+        });
         break;
       case "object":
         softFields.push({ name: fieldName, type: "object" });
         const objectFieldsResult = puckFieldsToSoftFields(
           field.objectFields || {},
-          /* @__PURE__ */ new Set()
+          /* @__PURE__ */ new Set(),
+          persistedSettings == null ? void 0 : persistedSettings.subFieldSettings,
+          customFields
         );
-        fieldSettings[fieldName] = {
+        fieldSettings[fieldName] = __spreadProps(__spreadValues({}, persistedSettings || {}), {
           subFields: objectFieldsResult.fields,
           subFieldSettings: objectFieldsResult.fieldSettings
-        };
+        });
         break;
       default:
         softFields.push({ name: fieldName, type: "text" });
     }
-    if (fieldSettings[fieldName]) {
-      fieldSettings[fieldName].defaultValue = void 0;
-    } else {
-      fieldSettings[fieldName] = { defaultValue: void 0 };
-    }
+    fieldSettings[fieldName] = __spreadProps(__spreadValues({}, fieldSettings[fieldName] || persistedSettings || {}), {
+      defaultValue: Object.prototype.hasOwnProperty.call(
+        fieldSettings[fieldName] || persistedSettings || {},
+        "defaultValue"
+      ) ? (fieldSettings[fieldName] || persistedSettings || {}).defaultValue : void 0
+    });
   });
   return { fields: softFields, fieldSettings };
 };
 var reconstructComponents = (subComponents, componentConfigs, softComponentProps) => {
   return subComponents.map((subComponent) => {
-    var _a;
-    const props = __spreadValues({}, subComponent.fixedProps);
-    (_a = subComponent.map) == null ? void 0 : _a.forEach((mapItem, i) => {
-      var _a2;
-      const { from, to, transform } = mapItem || {};
-      const fromPaths = Array.isArray(from) ? from : from ? [from] : [];
-      const toPaths = Array.isArray(to) ? to : to ? [to] : [];
-      const inputs = fromPaths.map(
-        (path) => getFieldSettingsByPath(softComponentProps || {}, path)
-      );
-      const runner = transform;
-      const result = runner ? runner(inputs, softComponentProps) : inputs[0];
-      if (Array.isArray(result)) {
-        result.forEach((val, idx) => {
-          if (toPaths[idx]) setPropertyByPath(props, toPaths[idx], val);
+    const componentConfig = componentConfigs[subComponent.type];
+    const props = __spreadProps(__spreadValues({}, subComponent.fixedProps), {
+      _map: subComponent.map
+    });
+    const arrayDefaults = (subComponent.map || []).reduce(
+      (acc, mapEntry) => {
+        const toPaths = Array.isArray(mapEntry.to) ? mapEntry.to : [mapEntry.to];
+        toPaths.forEach((path) => {
+          var _a;
+          if (typeof path !== "string" || !isArrayMappingPath(path)) return;
+          const arrayBase = getArrayBasePath(path);
+          if (!arrayBase || acc[arrayBase]) return;
+          const defaultValue = (_a = componentConfig == null ? void 0 : componentConfig.defaultProps) == null ? void 0 : _a[arrayBase];
+          if (Array.isArray(defaultValue)) acc[arrayBase] = defaultValue;
         });
-      } else {
-        toPaths.forEach((toPath) => setPropertyByPath(props, toPath, result));
-      }
-      if (transform && ((_a2 = props._map) == null ? void 0 : _a2[i])) {
-        props._map[i].transform = transform;
+        return acc;
+      },
+      {}
+    );
+    const sourceProps = __spreadValues(__spreadValues(__spreadValues({}, (componentConfig == null ? void 0 : componentConfig.defaultProps) || {}), softComponentProps), props);
+    const { newProps } = applyMapping(
+      props,
+      {},
+      // fieldSettings not needed for "propsFirst" mode as it resolves from propsFirst
+      subComponent.map || [],
+      "propsFirst",
+      {
+        sourceProps,
+        arrayDefaults
       }
-    });
+    );
+    Object.assign(props, newProps);
     if (subComponent.enabledSlots.length > 0) {
       props._slot = subComponent.enabledSlots;
       subComponent.enabledSlots.forEach(({ slot, name }) => {
@@ -1066,25 +1767,45 @@ var reconstructComponents = (subComponents, componentConfigs, softComponentProps
     return componentData;
   });
 };
-var softComponentToAppState = (softComponent, componentName, version, versions, componentProps, componentConfigs, displayName, category) => {
+var softComponentToAppState = (softComponent, componentName, version, versions, componentProps, componentConfigs, overrides, displayName, category, customFields) => {
   const slots = new Set(Object.keys(softComponent.slots));
   const { fields, fieldSettings } = puckFieldsToSoftFields(
     softComponent.fields,
-    slots
+    slots,
+    softComponent.fieldSettings,
+    customFields
   );
+  const mergedFieldSettings = mergeFieldSettings(
+    fieldSettings,
+    softComponent.fieldSettings || {}
+  ) || {};
   Object.entries(softComponent.defaultProps).forEach(([key, value]) => {
-    if (fieldSettings && fieldSettings[key] && !slots.has(key)) {
-      fieldSettings[key].defaultValue = value;
+    if (mergedFieldSettings && mergedFieldSettings[key] && !slots.has(key)) {
+      mergedFieldSettings[key].defaultValue = value;
+    }
+  });
+  (fields || []).forEach((field) => {
+    if (field.type !== "array" || slots.has(field.name)) return;
+    const settings = mergedFieldSettings[field.name] || {};
+    if (settings.defaultValue === void 0) {
+      settings.defaultValue = buildArrayDefaultValue(
+        settings.subFields,
+        settings.subFieldSettings
+      );
     }
+    mergedFieldSettings[field.name] = settings;
   });
-  const rootProps = {
-    _name: displayName || componentName,
+  let rootProps = __spreadValues({
+    _name: displayName || getComponentNameFromKey(componentName, overrides),
     _category: category,
     _version: version,
     _versions: versions,
     _fields: fields,
-    _fieldSettings: fieldSettings
-  };
+    _fieldSettings: mergedFieldSettings
+  }, softComponent.rootProps || {});
+  if (overrides.onRemodel) {
+    rootProps = __spreadValues(__spreadValues({}, rootProps), overrides.onRemodel(componentName));
+  }
   const content = reconstructComponents(
     softComponent.components,
     componentConfigs,
@@ -1106,114 +1827,102 @@ var rootZone = "default-zone";
 var rootDroppableId = `${rootAreaId}:${rootZone}`;
 
 // src/puck/components/soft-render/index.tsx
-import { useMemo, useRef } from "react";
-import { v4 as uuidv42 } from "uuid";
-import equal from "fast-deep-equal";
+import React3, { useMemo, memo } from "react";
+import equal3 from "react-fast-compare";
 import { Fragment as Fragment2, jsx as jsx5 } from "react/jsx-runtime";
-function SoftRender({
-  softComponentFields,
-  softComponentFieldSettings,
-  softSubComponent,
-  configComponents,
-  props,
-  depth = 0
-}) {
-  const _a = props, { id, puck, editMode } = _a, rest = __objRest(_a, ["id", "puck", "editMode"]);
-  const mapCacheRef = useRef(/* @__PURE__ */ new Map());
-  const prevPropsRef = useRef(null);
-  if (!equal(prevPropsRef.current, props)) {
-    mapCacheRef.current.clear();
-    prevPropsRef.current = props;
-  }
-  const subComponentRootProps = useMemo(
-    () => Object.entries(softComponentFields || {}).filter(([_, field]) => field.type !== "slot").reduce(
-      (acc, [fieldKey]) => {
-        acc[fieldKey] = props[fieldKey];
-        return acc;
-      },
-      {}
-    ),
-    [softComponentFields, props]
+function isPlainObject(val) {
+  if (typeof val !== "object" || val === null) return false;
+  if (React3.isValidElement(val)) return false;
+  if ("$$typeof" in val) return false;
+  const proto = Object.getPrototypeOf(val);
+  return proto === Object.prototype || proto === null;
+}
+function cloneData(value) {
+  if (value === null || value === void 0) return value;
+  if (typeof value === "function") return value;
+  if (Array.isArray(value)) return value.map(cloneData);
+  if (!isPlainObject(value)) return value;
+  return Object.fromEntries(
+    Object.entries(value).map(([k, v]) => [k, cloneData(v)])
   );
-  return /* @__PURE__ */ jsx5(Fragment2, { children: (softSubComponent == null ? void 0 : softSubComponent.length) > 0 && softSubComponent.map((subComponent, index) => {
-    var _a2;
+}
+var SubComponentRenderer = memo(
+  ({
+    subComponent,
+    softComponentFields,
+    softComponentFieldSettings,
+    configComponents,
+    props,
+    depth,
+    index
+  }) => {
+    const { id, puck, editMode } = props;
     const componentConfig = configComponents[subComponent == null ? void 0 : subComponent.type];
-    if (!componentConfig) return null;
-    const resolvedProps = subComponent.fixedProps || {};
     const stableId = useMemo(
-      () => depth === 0 ? id : `${subComponent.type}-${id}-d${depth}-${uuidv42()}`,
-      [id, depth, subComponent.type]
+      () => depth === 0 ? id : `${subComponent.type}-${id}-d${depth}-i${index}`,
+      [id, depth, subComponent.type, index]
     );
-    if ((_a2 = subComponent.map) == null ? void 0 : _a2.length) {
-      subComponent.map.forEach((mapItem) => {
-        const { from, to, transform } = mapItem || {};
-        const fromPaths = Array.isArray(from) ? from : from ? [from] : [];
-        const toPaths = Array.isArray(to) ? to : to ? [to] : [];
-        const inputValues = fromPaths.map((f) => {
-          const propValue = getFieldSettingsByPath(props || {}, f);
-          if (propValue !== void 0) return propValue;
-          const setting = getFieldSettingsByPath(
-            softComponentFieldSettings || {},
-            f
-          );
-          if (setting && Object.prototype.hasOwnProperty.call(setting, "defaultValue")) {
-            return setting.defaultValue;
+    const finalProps = useMemo(() => {
+      var _a;
+      if (!componentConfig) return {};
+      const clonedProps = cloneData(subComponent.fixedProps || {});
+      if ((_a = subComponent.map) == null ? void 0 : _a.length) {
+        const mergedInput = __spreadValues(__spreadValues({}, clonedProps), props);
+        const { newProps } = applyMapping(
+          mergedInput,
+          softComponentFieldSettings || {},
+          subComponent.map,
+          "propsFirst"
+        );
+        const parentKeys = new Set(Object.keys(props));
+        for (const [key, value] of Object.entries(newProps)) {
+          if (!parentKeys.has(key) || key in clonedProps) {
+            clonedProps[key] = value;
           }
-          return propValue;
-        });
-        const cacheKey = inputValues.map((v, i) => `${i}:${typeof v === "object" ? JSON.stringify(v) : v}`).join("|");
-        let result = mapCacheRef.current.get(cacheKey);
-        if (!result) {
-          const runner = transform;
-          result = runner ? runner(inputValues, props) : inputValues[0];
-          mapCacheRef.current.set(cacheKey, result);
         }
-        if (Array.isArray(result)) {
-          result.forEach(
-            (val, i) => toPaths[i] && setPropertyByPath(resolvedProps, toPaths[i], val)
-          );
-        } else if (toPaths[0]) {
-          setPropertyByPath(resolvedProps, toPaths[0], result);
-        }
-      });
-    }
-    Object.entries(componentConfig.fields || {}).forEach(
-      ([slotKey, field]) => {
-        var _a3, _b;
-        if (field.type === "slot") {
-          const enabledSlot = (_a3 = subComponent == null ? void 0 : subComponent.enabledSlots) == null ? void 0 : _a3.find(
+      }
+      Object.entries(componentConfig.fields || {}).forEach(
+        ([slotKey, field]) => {
+          var _a2, _b, _c;
+          if (field.type !== "slot") return;
+          const enabledSlot = (_a2 = subComponent == null ? void 0 : subComponent.enabledSlots) == null ? void 0 : _a2.find(
             (s) => s.slot === slotKey
           );
           if (enabledSlot) {
             const slotName = enabledSlot.name || `${(_b = subComponent.fixedProps) == null ? void 0 : _b.id}-${slotKey}`;
-            resolvedProps[slotKey] = useMemo(
-              () => rest[slotName] || (() => null),
-              [slotName, rest[slotName]]
-            );
+            clonedProps[slotKey] = (_c = props[slotName]) != null ? _c : (() => null);
           } else {
-            resolvedProps[slotKey] = useMemo(() => {
-              return ({
-                className,
-                style
-              }) => {
-                var _a4, _b2;
-                return /* @__PURE__ */ jsx5("div", { className, style, children: /* @__PURE__ */ jsx5(
-                  SoftRender,
-                  {
-                    softComponentFields,
-                    softSubComponent: (_b2 = (_a4 = subComponent == null ? void 0 : subComponent.components) == null ? void 0 : _a4[slotKey]) != null ? _b2 : [],
-                    configComponents,
-                    props,
-                    depth: depth + 1
-                  },
-                  slotKey
-                ) });
-              };
-            }, [slotKey, subComponentRootProps]);
+            clonedProps[slotKey] = ({
+              className,
+              style
+            }) => {
+              var _a3, _b2;
+              return /* @__PURE__ */ jsx5("div", { className, style, children: /* @__PURE__ */ jsx5(
+                SoftRender,
+                {
+                  softComponentFields,
+                  softComponentFieldSettings,
+                  softSubComponent: (_b2 = (_a3 = subComponent == null ? void 0 : subComponent.components) == null ? void 0 : _a3[slotKey]) != null ? _b2 : [],
+                  configComponents,
+                  props,
+                  depth: depth + 1
+                }
+              ) });
+            };
           }
         }
-      }
-    );
+      );
+      return clonedProps;
+    }, [
+      componentConfig,
+      subComponent,
+      props,
+      softComponentFields,
+      softComponentFieldSettings,
+      configComponents,
+      depth
+    ]);
+    if (!componentConfig) return null;
     const ComponentRender = componentConfig.render;
     return /* @__PURE__ */ jsx5(ErrorBoundary, { children: /* @__PURE__ */ jsx5(
       ComponentRender,
@@ -1221,14 +1930,76 @@ function SoftRender({
         id: stableId,
         editMode,
         puck
-      }, resolvedProps)
-    ) }, index);
-  }) });
-}
+      }, finalProps)
+    ) });
+  },
+  // Custom comparator for SubComponentRenderer.
+  //
+  // Uses deep equality on subComponent (it may be a new reference even when
+  // semantically unchanged if the parent SoftRender array is reconstructed)
+  // and on props (the primary driver of field-mapping changes).
+  // configComponents and softComponentFields are treated as stable config
+  // references — reference equality is intentional and fast here.
+  (prev, next) => prev.depth === next.depth && prev.index === next.index && prev.configComponents === next.configComponents && prev.softComponentFields === next.softComponentFields && equal3(prev.props, next.props) && equal3(prev.subComponent, next.subComponent) && equal3(prev.softComponentFieldSettings, next.softComponentFieldSettings)
+);
+SubComponentRenderer.displayName = "SubComponentRenderer";
+var SoftRender = memo(
+  ({
+    softComponentFields,
+    softComponentFieldSettings,
+    softSubComponent,
+    configComponents,
+    props,
+    depth = 0
+  }) => {
+    if (!(softSubComponent == null ? void 0 : softSubComponent.length)) return null;
+    return /* @__PURE__ */ jsx5(Fragment2, { children: softSubComponent.map((subComponent, index) => {
+      var _a;
+      return /* @__PURE__ */ jsx5(
+        SubComponentRenderer,
+        {
+          subComponent,
+          softComponentFields,
+          softComponentFieldSettings: softComponentFieldSettings || {},
+          configComponents,
+          props,
+          depth,
+          index
+        },
+        `${(_a = subComponent == null ? void 0 : subComponent.type) != null ? _a : "comp"}-${index}-${depth}`
+      );
+    }) });
+  },
+  // Covers all five props — not just `props` and `softSubComponent`.
+  // configComponents / softComponentFields: reference equality (stable config).
+  // softComponentFieldSettings: deep equality (may carry dynamic defaults).
+  // props / softSubComponent: deep equality (primary render drivers).
+  (prev, next) => prev.configComponents === next.configComponents && prev.softComponentFields === next.softComponentFields && equal3(prev.props, next.props) && equal3(prev.softSubComponent, next.softSubComponent) && equal3(prev.softComponentFieldSettings, next.softComponentFieldSettings)
+);
+SoftRender.displayName = "SoftRender";
 
 // src/puck/lib/create-versioned-component-config.tsx
 import { jsx as jsx6 } from "react/jsx-runtime";
-var createVersionedComponentConfig = (componentName, displayName, version, allVersions, config, softComponents, defaultProps, showVersioning = true) => {
+var hydrateCustomField = (fieldName, field, fieldSettings, customFields) => {
+  var _a;
+  if (field.type !== "custom") {
+    return field;
+  }
+  const fieldWithMeta = field;
+  const customFieldType = fieldWithMeta.customFieldType || ((_a = fieldSettings == null ? void 0 : fieldSettings[fieldName]) == null ? void 0 : _a.customFieldType);
+  if (!customFieldType) {
+    return field;
+  }
+  const customField = customFields == null ? void 0 : customFields[customFieldType];
+  if (!customField) {
+    return field;
+  }
+  return __spreadProps(__spreadValues(__spreadValues({}, field), customField.field), {
+    type: "custom",
+    label: field.label || customField.field.label || fieldName
+  });
+};
+var createVersionedComponentConfig = (componentName, displayName, version, allVersions, config, softComponents, defaultProps, showVersioning = true, customFields) => {
   var _a, _b;
   const softConfig = config;
   return {
@@ -1256,7 +2027,12 @@ var createVersionedComponentConfig = (componentName, displayName, version, allVe
         };
       }
       Object.entries((versionedComponent == null ? void 0 : versionedComponent.fields) || {}).filter(([, field]) => field.type !== "slot").forEach(([key, field]) => {
-        fields[key] = field;
+        fields[key] = hydrateCustomField(
+          key,
+          field,
+          versionedComponent == null ? void 0 : versionedComponent.fieldSettings,
+          customFields
+        );
       });
       return fields;
     },
@@ -1283,21 +2059,16 @@ var subComponentDecomposer = (componentRootData, softSubComponent) => {
   var _a;
   const resolvedProps = __spreadValues({}, softSubComponent.fixedProps);
   (_a = softSubComponent.map) == null ? void 0 : _a.forEach((mapItem) => {
-    const { from, to, transform } = mapItem || {};
-    const fromPaths = Array.isArray(from) ? from : from ? [from] : [];
-    const toPaths = Array.isArray(to) ? to : to ? [to] : [];
-    const inputs = fromPaths.map(
-      (path) => getFieldSettingsByPath(componentRootData.props || {}, path)
+    const { newProps } = applyMapping(
+      resolvedProps,
+      {},
+      [mapItem],
+      "propsFirst",
+      {
+        sourceProps: componentRootData.props || {}
+      }
     );
-    const runner = transform;
-    const result = runner ? runner(inputs, componentRootData.props) : inputs[0];
-    if (Array.isArray(result)) {
-      result.forEach((val, idx) => {
-        if (toPaths[idx]) setPropertyByPath(resolvedProps, toPaths[idx], val);
-      });
-    } else if (toPaths[0]) {
-      setPropertyByPath(resolvedProps, toPaths[0], result);
-    }
+    Object.assign(resolvedProps, newProps);
   });
   softSubComponent.enabledSlots.forEach(({ slot, name }) => {
     var _a2, _b;
@@ -1320,9 +2091,22 @@ var subComponentDecomposer = (componentRootData, softSubComponent) => {
   return accItem;
 };
 
+// src/puck/lib/builder/resolve-soft-component-data.ts
+var resolveSoftComponentData = (props, _fieldSettings = {}) => {
+  const map = props._map;
+  if (!(map == null ? void 0 : map.length)) return __spreadValues({}, props);
+  const { newProps } = applyMapping(
+    props,
+    _fieldSettings,
+    map,
+    "propsFirst"
+  );
+  return newProps;
+};
+
 // src/puck/lib/decompose-soft-component.ts
-function decomposeSoftComponent(componentData, softComponents) {
-  var _a, _b;
+function decomposeSoftComponent(componentData, softComponents, fieldSettings) {
+  var _a, _b, _c, _d;
   if (!(componentData == null ? void 0 : componentData.type) || !(componentData == null ? void 0 : componentData.props.id)) {
     throw new Error("Component data must have type and id to decompose.");
   }
@@ -1333,9 +2117,19 @@ function decomposeSoftComponent(componentData, softComponents) {
       `Soft component "${componentData.type}" version "${version}" not found.`
     );
   }
+  let resolvedComponentData = componentData;
+  if (fieldSettings && ((_d = (_c = componentData.props) == null ? void 0 : _c._map) == null ? void 0 : _d.length)) {
+    const resolvedProps = resolveSoftComponentData(
+      componentData.props,
+      fieldSettings
+    );
+    resolvedComponentData = __spreadProps(__spreadValues({}, componentData), {
+      props: resolvedProps
+    });
+  }
   const decomposedComponentData = softComponent.components.map(
     (softSubComponent) => {
-      return subComponentDecomposer(componentData, softSubComponent);
+      return subComponentDecomposer(resolvedComponentData, softSubComponent);
     }
   );
   return decomposedComponentData;
@@ -1378,18 +2172,6 @@ function demolishSoftComponent(componentName, data, config, softComponents) {
   };
 }
 
-// src/puck/lib/component-key.ts
-var defaultToCamelCase = (value) => {
-  const tokens = value.trim().replace(/[^a-zA-Z0-9\s_-]/g, " ").split(/[\s_-]+/).filter(Boolean);
-  if (tokens.length === 0) return "";
-  const [first, ...rest] = tokens;
-  return `${first.toLowerCase()}${rest.map((token) => token.charAt(0).toUpperCase() + token.slice(1).toLowerCase()).join("")}`;
-};
-var createComponentKeyFromName = (displayName, overrides, context) => {
-  const key = overrides.componentNameToKey ? overrides.componentNameToKey(displayName, context) : defaultToCamelCase(displayName);
-  return key.trim();
-};
-
 // src/puck/store/slices/builder.tsx
 var createBuildersSlice = (set, get, initialConfig) => ({
   build: (history, selectedItem, itemSelector, puckDispatch, name) => {
@@ -1417,7 +2199,14 @@ var createBuildersSlice = (set, get, initialConfig) => ({
     });
     const config = __spreadValues({}, get().softConfig);
     const overrides = get().overrides;
-    const buildConfig = builderConfig(config, overrides, void 0, get().showVersionFields);
+    const buildConfig = builderConfig(
+      config,
+      overrides,
+      void 0,
+      get().showVersionFields,
+      void 0,
+      get().customFields
+    );
     const editableIds = /* @__PURE__ */ new Set([selectedItem.props.id]);
     const initialContent = [__spreadValues({}, selectedItem)];
     walkTree3(
@@ -1489,13 +2278,22 @@ var createBuildersSlice = (set, get, initialConfig) => ({
       versions,
       selectedItem.props,
       get().softConfig.components,
+      get().overrides,
       (softComponentMeta == null ? void 0 : softComponentMeta.name) || softComponentName,
-      softComponentMeta == null ? void 0 : softComponentMeta.category
+      softComponentMeta == null ? void 0 : softComponentMeta.category,
+      get().customFields
     );
     const config = __spreadValues({}, get().softConfig);
     const overrides = get().overrides;
     const dependents = get().dependencyGraph.get(softComponentName) || /* @__PURE__ */ new Set();
-    const buildConfig = builderConfig(config, overrides, softComponentName, get().showVersionFields, dependents);
+    const buildConfig = builderConfig(
+      config,
+      overrides,
+      softComponentName,
+      get().showVersionFields,
+      dependents,
+      get().customFields
+    );
     const editableIds = /* @__PURE__ */ new Set([]);
     const decomposedComponents = get().builder.decompose(selectedItem);
     walkTree3(
@@ -1541,6 +2339,7 @@ var createBuildersSlice = (set, get, initialConfig) => ({
         zone: itemSelector.zone || rootDroppableId
       },
       editingComponentId: selectedItem.props.id,
+      editingComponent: softComponentName,
       editableComponentIds: editableIds,
       state: "remodeling"
     }));
@@ -1557,7 +2356,7 @@ var createBuildersSlice = (set, get, initialConfig) => ({
     );
   },
   complete: (appState, setHistories, getItemBySelector) => {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g;
     if (get().state === "ready") {
       throw new Error("Not building or remodeling a component.");
     }
@@ -1576,10 +2375,11 @@ var createBuildersSlice = (set, get, initialConfig) => ({
       throw new Error("Cannot find item being edited");
     }
     const rootCategory = (_e = (_d = appState.data.root) == null ? void 0 : _d.props) == null ? void 0 : _e._category;
-    const componentName = createComponentKeyFromName(displayName, get().overrides, {
+    const rootProps = (_f = appState.data.root) == null ? void 0 : _f.props;
+    const componentName = createComponentKeyFromName(displayName, get().overrides, __spreadProps(__spreadValues({}, rootProps || {}), {
       existingKeys: Object.keys(get().softComponents),
       state: get().state
-    });
+    }));
     if (!componentName) {
       throw new Error("Failed to generate component key from name.");
     }
@@ -1638,6 +2438,7 @@ var createBuildersSlice = (set, get, initialConfig) => ({
         storedConfig: void 0,
         state: "inspecting",
         originalHistory: [],
+        editingComponent: null,
         editingComponentId: null,
         editableComponentIds: /* @__PURE__ */ new Set()
       });
@@ -1645,7 +2446,7 @@ var createBuildersSlice = (set, get, initialConfig) => ({
     if (!version) {
       throw new Error("Failed to resolve completed component version.");
     }
-    const completedSoftComponent = (_f = get().softComponents[componentName]) == null ? void 0 : _f.versions[version];
+    const completedSoftComponent = (_g = get().softComponents[componentName]) == null ? void 0 : _g.versions[version];
     if (!completedSoftComponent) {
       throw new Error(
         `Completed soft component "${componentName}" version "${version}" not found.`
@@ -1697,6 +2498,7 @@ var createBuildersSlice = (set, get, initialConfig) => ({
       itemSelector: null,
       originalItem: null,
       state: "ready",
+      editingComponent: null,
       editingComponentId: null,
       editableComponentIds: /* @__PURE__ */ new Set()
     }));
@@ -1718,7 +2520,8 @@ var createBuildersSlice = (set, get, initialConfig) => ({
       {
         name: displayName,
         category
-      }
+      },
+      get().customFields
     );
     const existingComponent = get().softComponents[componentName];
     const allVersions = Object.keys((existingComponent == null ? void 0 : existingComponent.versions) || {});
@@ -1737,7 +2540,8 @@ var createBuildersSlice = (set, get, initialConfig) => ({
         })
       }),
       softComponent.defaultProps,
-      get().showVersionFields
+      get().showVersionFields,
+      get().customFields
     );
     get().setSoftComponent(componentName, version, softComponent);
     return [newSoftComponentConfig, version];
@@ -1789,8 +2593,10 @@ var createBuildersSlice = (set, get, initialConfig) => ({
       versions,
       currentProps,
       get().softConfig.components,
+      get().overrides,
       (softComponentMeta == null ? void 0 : softComponentMeta.name) || componentName,
-      softComponentMeta == null ? void 0 : softComponentMeta.category
+      softComponentMeta == null ? void 0 : softComponentMeta.category,
+      get().customFields
     );
     puckDispatch({
       type: "setData",
@@ -1937,7 +2743,7 @@ function topologicalSort(softComponents, hardComponentNames) {
   }
   return sorted;
 }
-function buildInitialSoftComponents(hardConfig, softComponents, overrides, showVersioning = false) {
+function buildInitialSoftComponents(hardConfig, softComponents, overrides, showVersioning = false, customFields) {
   var _a, _b;
   if (!softComponents || Object.keys(softComponents).length === 0) {
     return {};
@@ -1973,7 +2779,8 @@ function buildInitialSoftComponents(hardConfig, softComponents, overrides, showV
         // Pass the accumulating config
         hydratedSoftComponents,
         versionedComponent.defaultProps,
-        showVersioning
+        showVersioning,
+        customFields
       );
       componentConfigs[name] = newSoftComponentConfig;
       buildingConfig.components[name] = newSoftComponentConfig;
@@ -2001,7 +2808,8 @@ function buildInitialSoftComponents(hardConfig, softComponents, overrides, showV
         hardConfig,
         hydratedSoftComponents,
         versionedComponent.defaultProps,
-        showVersioning
+        showVersioning,
+        customFields
       );
       componentConfigs[name] = newSoftComponentConfig;
     }
@@ -2067,9 +2875,9 @@ var clearEditVisibility = (doc) => {
 // src/puck/store/index.tsx
 var createSoftConfigStore = (hardConfig = {
   components: {}
-}, softComponents = {}, overrides = {}, onActions, showVersionFields = true) => {
+}, softComponents = {}, overrides = {}, onActions, showVersionFields = true, customFields = {}) => {
   const normalizedSoftComponents = Object.fromEntries(
-    Object.entries(softComponents || {}).map(([key, value]) => [
+    Object.entries(softComponents || {}).filter(([key]) => !hardConfig.components || !hardConfig.components[key]).map(([key, value]) => [
       key,
       __spreadProps(__spreadValues({}, value), {
         name: value.name || key
@@ -2090,9 +2898,11 @@ var createSoftConfigStore = (hardConfig = {
         state: "ready",
         originalHistory: [],
         overrides,
+        customFields,
         onActions,
         iframeDocRef,
         showVersionFields,
+        editingComponent: null,
         setShowVersionFields: (show) => set({ showVersionFields: show }),
         getIframeDoc: () => iframeDocRef.current,
         setIframeDoc: (doc) => {
@@ -2130,11 +2940,17 @@ var createSoftConfigStore = (hardConfig = {
           components: __spreadValues(__spreadValues({}, hardConfig.components), buildInitialSoftComponents(
             hardConfig,
             hydratedSoftComponents,
-            overrides
+            overrides,
+            showVersionFields,
+            customFields
           )),
           categories: __spreadValues({}, hardConfig.categories || {})
         }),
         setSoftComponent: (name, version, component) => {
+          if (hardConfig.components && hardConfig.components[name]) {
+            console.warn(`Cannot set soft component "${name}" because it conflicts with a base hardConfig component.`);
+            return;
+          }
           const existing = get().softComponents[name];
           set((state) => {
             var _a, _b;
@@ -2157,6 +2973,9 @@ var createSoftConfigStore = (hardConfig = {
           const nextSoftComponents = __spreadValues({}, state.softComponents);
           const nextConfigComponents = __spreadValues({}, state.softConfig.components);
           Object.entries(incomingComponents).forEach(([name, data]) => {
+            if (hardConfig.components && hardConfig.components[name]) {
+              return;
+            }
             const existing = nextSoftComponents[name];
             const finalComponentData = existing ? __spreadProps(__spreadValues(__spreadValues({}, existing), data), {
               name: data.name || existing.name || name,
@@ -2175,7 +2994,8 @@ var createSoftConfigStore = (hardConfig = {
                 state.softConfig,
                 nextSoftComponents,
                 activeVersionData.defaultProps,
-                state.showVersionFields
+                state.showVersionFields,
+                state.customFields
               );
             }
           });
@@ -2206,7 +3026,8 @@ var createSoftConfigStore = (hardConfig = {
                 softConfig,
                 hydratedComponents,
                 activeVersionData.defaultProps,
-                get().showVersionFields
+                get().showVersionFields,
+                get().customFields
               );
             }
           });
@@ -2237,7 +3058,8 @@ var createSoftConfigStore = (hardConfig = {
             get().softConfig,
             get().softComponents,
             softComponent.defaultProps,
-            get().showVersionFields
+            get().showVersionFields,
+            get().customFields
           );
           set((state) => ({
             softConfig: __spreadProps(__spreadValues({}, state.softConfig), {
@@ -2374,7 +3196,8 @@ var createSoftConfigStore = (hardConfig = {
               config,
               softComponents2,
               versionedComponent.defaultProps,
-              state.showVersionFields
+              state.showVersionFields,
+              state.customFields
             );
             config.components[dependentName] = newConfig;
           }
@@ -2386,25 +3209,40 @@ var createSoftConfigStore = (hardConfig = {
 };
 
 // src/puck/context/storeProvider.tsx
-import { useEffect as useEffect2, useMemo as useMemo2, useState as useState2 } from "react";
+import { useEffect as useEffect2, useMemo as useMemo2, useState } from "react";
 import { jsx as jsx7 } from "react/jsx-runtime";
 var SoftConfigProvider = ({
   children,
   hardConfig,
   softComponents,
+  customFields,
   overrides,
   value,
   onActions,
   useVersioning = false
 }) => {
   const store = value != null ? value : useMemo2(
-    () => createSoftConfigStore(hardConfig, softComponents, overrides, onActions, useVersioning),
-    [hardConfig, softComponents, overrides, onActions, useVersioning]
+    () => createSoftConfigStore(
+      hardConfig,
+      softComponents,
+      overrides,
+      onActions,
+      useVersioning,
+      customFields
+    ),
+    [
+      hardConfig,
+      softComponents,
+      overrides,
+      onActions,
+      useVersioning,
+      customFields
+    ]
   );
-  const [softConfig, setSoftConfig] = useState2(
+  const [softConfig, setSoftConfig] = useState(
     () => store.getState().softConfig
   );
-  const [internalSoftComponents, setSoftComponents] = useState2(
+  const [internalSoftComponents, setSoftComponents] = useState(
     () => store.getState().softComponents
   );
   const storeSetIframeDoc = useMemo2(
@@ -2413,14 +3251,19 @@ var SoftConfigProvider = ({
   );
   const validateAction = useMemo2(
     () => (action) => {
+      var _a;
       const currentState = store.getState();
       if (currentState.state === "ready") {
         return true;
       }
       const editableIds = currentState.editableComponentIds;
       if (action.type === "replace") {
+        const parentId = (_a = action.destinationZone) == null ? void 0 : _a.split(":")[0];
         if (action.data.props.id && editableIds.has(action.data.props.id)) {
           return true;
+        } else if (parentId && editableIds.has(parentId)) {
+          currentState.addEditableComponentId(action.data.props.id);
+          return true;
         }
         return false;
       }
@@ -2633,7 +3476,7 @@ var useRemodel = () => {
 
 // src/puck/actions/useComplete.tsx
 import { createUsePuck as createUsePuck4 } from "@measured/puck";
-import { useState as useState3, useCallback as useCallback2 } from "react";
+import { useState as useState2, useCallback as useCallback2 } from "react";
 var useCustomPuck4 = createUsePuck4();
 var useComplete = () => {
   const complete = useSoftConfig((s) => s.builder.complete);
@@ -2641,7 +3484,7 @@ var useComplete = () => {
   const setHistories = useCustomPuck4((s) => s.history.setHistories);
   const getItemBySelector = useCustomPuck4((s) => s.getItemBySelector);
   const status = useSoftConfig((s) => s.state);
-  const [newComponent, setNewComponent] = useState3(null);
+  const [newComponent, setNewComponent] = useState2(null);
   const { triggerAction } = useActionEvent();
   const handleComplete = useCallback2(() => {
     if (status === "ready") {
@@ -2989,32 +3832,50 @@ import { Fragment as Fragment4, jsx as jsx9, jsxs as jsxs3 } from "react/jsx-run
 var getClassName3 = get_class_name_factory_default("ActionBar", ActionBar_module_default);
 var usePuck2 = createUsePuck11();
 var ActionBarOverride = (props) => {
-  var _a;
-  const { handleBuild } = useBuild("Custom Name");
+  var _a, _b;
+  const { handleBuild } = useBuild(props.label ? props.label + " Soft Component" : "New Soft Component");
   const { handleRemodel } = useRemodel();
   const { handleDecompose } = useDecompose();
   const overrides = useSoftConfig((s) => s.overrides);
   const softComponents = useSoftConfig((s) => s.softComponents, shallow);
   const editableIds = useSoftConfig((s) => s.editableComponentIds);
   const selectedItem = usePuck2((s) => s.selectedItem);
+  const rootProps = usePuck2((s) => s.appState.data.root.props);
   const status = useSoftConfig((s) => s.state);
+  const itemSelector = usePuck2((s) => s.appState.ui.itemSelector);
   const softKeys = Object.keys(softComponents);
-  const key = useMemo3(() => createComponentKeyFromName(props.label || "", overrides, {
-    existingKeys: softKeys,
-    state: status
-  }), [
+  const key = useMemo3(() => {
+    const selectedType = selectedItem == null ? void 0 : selectedItem.type;
+    if (selectedType && softKeys.includes(selectedType)) {
+      return selectedType;
+    }
+    return createComponentKeyFromName(props.label || "", overrides, __spreadProps(__spreadValues({}, rootProps || {}), {
+      existingKeys: softKeys,
+      state: status
+    }));
+  }, [
     props.label,
     overrides,
+    selectedItem == null ? void 0 : selectedItem.type,
     softKeys,
-    status
+    status,
+    rootProps
   ]);
   const isSoftComponent2 = softKeys.includes(key);
   const selectedId = (_a = selectedItem == null ? void 0 : selectedItem.props) == null ? void 0 : _a.id;
-  const isEditable = Boolean(selectedId && editableIds.has(selectedId));
+  const parentId = (_b = itemSelector == null ? void 0 : itemSelector.zone) == null ? void 0 : _b.split(":")[0];
+  const isEditable = Boolean(selectedId && (editableIds.has(selectedId) || parentId && editableIds.has(parentId)));
+  const displayName = useMemo3(() => {
+    var _a2;
+    if (isSoftComponent2) {
+      return ((_a2 = softComponents[key]) == null ? void 0 : _a2.name) || getComponentNameFromKey(key, overrides);
+    }
+    return props.label || "";
+  }, [isSoftComponent2, key, props.label, overrides, softComponents]);
   return /* @__PURE__ */ jsx9("div", { className: getClassName3(), children: /* @__PURE__ */ jsxs3(ActionBar, { children: [
     /* @__PURE__ */ jsxs3(ActionBar.Group, { children: [
       props.parentAction,
-      /* @__PURE__ */ jsx9(ActionBar.Label, { label: props.label })
+      /* @__PURE__ */ jsx9(ActionBar.Label, { label: displayName })
     ] }),
     /* @__PURE__ */ jsxs3(ActionBar.Group, { children: [
       status === "ready" ? isSoftComponent2 ? /* @__PURE__ */ jsxs3(Fragment4, { children: [
@@ -3048,7 +3909,7 @@ var ActionBarOverride = (props) => {
 };
 
 // src/puck/overrides/DrawerItem.tsx
-import { useState as useState5 } from "react";
+import { useState as useState4 } from "react";
 import { Button as Button2, IconButton, createUsePuck as createUsePuck12 } from "@measured/puck";
 import { GripVertical, Check, X, Trash2, Cog } from "lucide-react";
 
@@ -3073,7 +3934,7 @@ var confirm = (message) => __async(null, null, function* () {
 var DrawerItem_module_default = { "DrawerItem": "_DrawerItem_182aj_1", "DrawerItem--insertDisabled": "_DrawerItem--insertDisabled_182aj_14", "DrawerItem-content": "_DrawerItem-content_182aj_21", "DrawerItem-name": "_DrawerItem-name_182aj_31", "DrawerItem-version": "_DrawerItem-version_182aj_35", "DrawerItem-actions": "_DrawerItem-actions_182aj_40", "DrawerItem-settingsButton": "_DrawerItem-settingsButton_182aj_46", "DrawerItem-grip": "_DrawerItem-grip_182aj_56", "DrawerItem-modal": "_DrawerItem-modal_182aj_63", "DrawerItem-modalHeader": "_DrawerItem-modalHeader_182aj_71", "DrawerItem-modalTitle": "_DrawerItem-modalTitle_182aj_77", "DrawerItem-modalSubtitle": "_DrawerItem-modalSubtitle_182aj_84", "DrawerItem-modalBody": "_DrawerItem-modalBody_182aj_90", "DrawerItem-section": "_DrawerItem-section_182aj_100", "DrawerItem-sectionTitle": "_DrawerItem-sectionTitle_182aj_106", "DrawerItem-sectionDescription": "_DrawerItem-sectionDescription_182aj_113", "DrawerItem-versionList": "_DrawerItem-versionList_182aj_119", "DrawerItem-versionRow": "_DrawerItem-versionRow_182aj_125", "DrawerItem-versionRow--isDefault": "_DrawerItem-versionRow--isDefault_182aj_136", "DrawerItem-versionRow--isMarkedForDeletion": "_DrawerItem-versionRow--isMarkedForDeletion_182aj_141", "DrawerItem-versionInfo": "_DrawerItem-versionInfo_182aj_146", "DrawerItem-versionNumber": "_DrawerItem-versionNumber_182aj_153", "DrawerItem-defaultBadge": "_DrawerItem-defaultBadge_182aj_159", "DrawerItem-deleteBadge": "_DrawerItem-deleteBadge_182aj_170", "DrawerItem-versionActions": "_DrawerItem-versionActions_182aj_181", "DrawerItem-migrationOptions": "_DrawerItem-migrationOptions_182aj_187", "DrawerItem-migrationList": "_DrawerItem-migrationList_182aj_191", "DrawerItem-migrationOption": "_DrawerItem-migrationOption_182aj_187", "DrawerItem-migrationOption--isSelected": "_DrawerItem-migrationOption--isSelected_182aj_229", "DrawerItem-migrationOptionLabel": "_DrawerItem-migrationOptionLabel_182aj_234", "DrawerItem-modalFooter": "_DrawerItem-modalFooter_182aj_240", "DrawerItem-footerLeft": "_DrawerItem-footerLeft_182aj_250", "DrawerItem-footerRight": "_DrawerItem-footerRight_182aj_255" };
 
 // src/puck/components/modal/index.tsx
-import { useEffect as useEffect4, useState as useState4 } from "react";
+import { useEffect as useEffect4, useState as useState3 } from "react";
 import { createPortal } from "react-dom";
 
 // css-module:/media/manual_mount/osamuProjects/netlisian/packages/soft-config/src/puck/components/modal/styles.module.css#css-module
@@ -3087,7 +3948,7 @@ var Modal = ({
   onClose,
   isOpen
 }) => {
-  const [rootEl, setRootEl] = useState4(null);
+  const [rootEl, setRootEl] = useState3(null);
   useEffect4(() => {
     setRootEl(document.getElementById("puck-portal-root"));
   }, []);
@@ -3139,7 +4000,7 @@ var getClassName5 = get_class_name_factory_default("DrawerItem", DrawerItem_modu
 var usePuck3 = createUsePuck12();
 var DrawerItem = (props) => {
   const componentMeta = useSoftConfig((s) => s.softComponents[props.name]);
-  const displayName = (componentMeta == null ? void 0 : componentMeta.name) || props.name;
+  const displayName = props.label || (componentMeta == null ? void 0 : componentMeta.name) || props.name;
   const softComponents = new Set(
     Object.keys(useSoftConfig((s) => s.softComponents, shallow2))
   );
@@ -3151,13 +4012,13 @@ var DrawerItem = (props) => {
   const { handleDemolish } = useDemolish();
   const { handleSetDefaultVersion, getVersions, getDefaultVersion } = useSetDefaultVersion();
   const { triggerAction } = useActionEvent();
-  const [isEditing, setIsEditing] = useState5(false);
-  const [isHovering, setIsHovering] = useState5(false);
-  const [selectedVersion, setSelectedVersion] = useState5("");
-  const [versionsToDelete, setVersionsToDelete] = useState5(
+  const [isEditing, setIsEditing] = useState4(false);
+  const [isHovering, setIsHovering] = useState4(false);
+  const [selectedVersion, setSelectedVersion] = useState4("");
+  const [versionsToDelete, setVersionsToDelete] = useState4(
     /* @__PURE__ */ new Set()
   );
-  const [migrationTarget, setMigrationTarget] = useState5("decompose");
+  const [migrationTarget, setMigrationTarget] = useState4("decompose");
   const useVersioning = useSoftConfig((s) => s.showVersionFields);
   const versions = getVersions(props.name);
   const defaultVersion = getDefaultVersion(props.name);
@@ -3235,6 +4096,7 @@ var DrawerItem = (props) => {
           onMouseEnter: () => setIsHovering(true),
           onMouseLeave: () => setIsHovering(false),
           children: [
+            props.label,
             /* @__PURE__ */ jsxs4("div", { className: getClassName5("content"), children: [
               /* @__PURE__ */ jsx11("div", { className: getClassName5("name"), children: displayName }),
               useVersioning && /* @__PURE__ */ jsxs4("div", { className: getClassName5("version"), children: [
@@ -3356,7 +4218,7 @@ var DrawerItem = (props) => {
 var ComponentItem = DrawerItem;
 
 // src/puck/overrides/Drawer.tsx
-import { useState as useState6 } from "react";
+import { useState as useState5 } from "react";
 import { createUsePuck as createUsePuck13, Drawer as PuckDrawer } from "@measured/puck";
 import { ChevronDown, ChevronUp } from "lucide-react";
 
@@ -3411,11 +4273,15 @@ var Drawer = (_props) => {
     })
   );
   const allKeys = Object.keys(config.components);
+  const labels = Object.entries(config.components).reduce((acc, [key, comp]) => {
+    acc[key] = comp.label || key;
+    return acc;
+  }, {});
   const otherKeys = allKeys.filter((k) => !categorised.has(k));
   const categoryEntries = Object.entries(categories).filter(
     ([, cat]) => cat.visible !== false
   );
-  const [expanded, setExpanded] = useState6(() => {
+  const [expanded, setExpanded] = useState5(() => {
     const init = {};
     categoryEntries.forEach(([id, cat]) => {
       init[id] = cat.defaultExpanded !== false;
@@ -3429,6 +4295,7 @@ var Drawer = (_props) => {
       PuckDrawer.Item,
       {
         name: key,
+        label: labels[key],
         isDragDisabled: !getPermissions({ type: key }).insert,
         children: DrawerItem
       },
@@ -3513,9 +4380,6 @@ function extractDependencies2(softComponents, componentName, version) {
   return dependencies;
 }
 function reverseTopologicalSort(softComponents, hardComponentNames) {
-  const sorted = [];
-  const visiting = /* @__PURE__ */ new Set();
-  const visited = /* @__PURE__ */ new Set();
   const dependencyGraph = /* @__PURE__ */ new Map();
   const dependents = /* @__PURE__ */ new Map();
   for (const [componentName, component] of Object.entries(softComponents)) {
@@ -3563,7 +4427,7 @@ function reverseTopologicalSort(softComponents, hardComponentNames) {
   const sortedByDepth = [...depths.entries()].sort(([, depthA], [, depthB]) => depthB - depthA).map(([name]) => name);
   return sortedByDepth;
 }
-function dissolveComponentRecursively(componentData, softComponents, hardComponentNames, depth = 0) {
+function dissolveComponentRecursively(componentData, softComponents, hardComponentNames, depth = 0, fieldSettings) {
   const MAX_DEPTH = 50;
   if (depth > MAX_DEPTH) {
     console.error(
@@ -3573,11 +4437,11 @@ function dissolveComponentRecursively(componentData, softComponents, hardCompone
   }
   const componentType = componentData.type;
   if (!isSoftComponent(componentType, softComponents)) {
-    return [dissolveComponentSlots(componentData, softComponents, hardComponentNames, depth)];
+    return [dissolveComponentSlots(componentData, softComponents, hardComponentNames, depth, fieldSettings)];
   }
   let decomposed;
   try {
-    decomposed = decomposeSoftComponent(componentData, softComponents);
+    decomposed = decomposeSoftComponent(componentData, softComponents, fieldSettings);
   } catch (error) {
     console.warn(
       `Failed to decompose soft component "${componentType}":`,
@@ -3591,13 +4455,14 @@ function dissolveComponentRecursively(componentData, softComponents, hardCompone
       component,
       softComponents,
       hardComponentNames,
-      depth + 1
+      depth + 1,
+      fieldSettings
     );
     fullyDissolved.push(...dissolved);
   }
   return fullyDissolved;
 }
-function dissolveComponentSlots(componentData, softComponents, hardComponentNames, depth) {
+function dissolveComponentSlots(componentData, softComponents, hardComponentNames, depth, fieldSettings) {
   const newProps = __spreadValues({}, componentData.props);
   Object.entries(newProps).forEach(([key, value]) => {
     var _a;
@@ -3607,7 +4472,8 @@ function dissolveComponentSlots(componentData, softComponents, hardComponentName
           slotComponent,
           softComponents,
           hardComponentNames,
-          depth
+          depth,
+          fieldSettings
         )
       );
     }
@@ -3617,22 +4483,23 @@ function dissolveComponentSlots(componentData, softComponents, hardComponentName
   });
 }
 function dissolveAllSoftComponents(data, softComponents, config) {
+  var _a;
   const hardComponentNames = new Set(
     Object.keys(config.components || {}).filter(
       (name) => !isSoftComponent(name, softComponents)
     )
   );
-  const dissolutionOrder = reverseTopologicalSort(
-    softComponents,
-    hardComponentNames
-  );
+  reverseTopologicalSort(softComponents, hardComponentNames);
+  const rootParams = ((_a = data.root) == null ? void 0 : _a.props) || {};
+  const fieldSettings = __spreadValues(__spreadValues({}, rootParams._fieldSettings || {}), rootParams);
   const dissolveComponents = (components) => {
     return components.flatMap((componentData) => {
       return dissolveComponentRecursively(
         componentData,
         softComponents,
         hardComponentNames,
-        0
+        0,
+        fieldSettings
       );
     });
   };
@@ -3698,12 +4565,18 @@ export {
   Header,
   Modal,
   SoftConfigProvider,
+  applyMapping,
   confirm,
   createActionCallback,
   createSoftConfigStore,
   createUseSoftConfig,
+  filterToOptionsForFrom,
+  getArrayBasePath,
+  getArrayItemSubPath,
+  isArrayMappingPath,
   notify,
   resolveSoftConfig,
+  resolveValueByPath,
   setConfirmHandler,
   setNotificationHandler,
   useBuild,