@puckeditor/core 0.22.1 → 0.22.3

package/dist/{Editor-MXSH3OSX.mjs → Editor-MLHOIEVM.mjs}

@@ -4,20 +4,20 @@ import {
 import {
   EditorInner,
   LoadedRichTextMenu
-} from "./chunk-VOB4L2BJ.mjs";
+} from "./chunk-PRZEIT36.mjs";
 import "./chunk-H635BA2V.mjs";
-import "./chunk-73XKHVBN.mjs";
-import "./chunk-2AATV7NG.mjs";
-import "./chunk-BVKXFA4V.mjs";
-import "./chunk-DATOBXTJ.mjs";
+import "./chunk-25O24MZR.mjs";
+import "./chunk-NKDMBWQC.mjs";
+import "./chunk-C2H4WQP2.mjs";
+import "./chunk-4I2WN43X.mjs";
 import {
   useAppStore,
   useAppStoreApi
-} from "./chunk-54LFCIWQ.mjs";
-import "./chunk-HRNJ42TO.mjs";
-import "./chunk-GR7NLT4T.mjs";
+} from "./chunk-KJQTOPIV.mjs";
+import "./chunk-25QAPMLH.mjs";
+import "./chunk-WUO7D6OQ.mjs";
 import "./chunk-Y2EFNT5P.mjs";
-import "./chunk-74HKFKJU.mjs";
+import "./chunk-QHQD3BMI.mjs";
 import {
   __spreadProps,
   __spreadValues,

package/dist/{chunk-73XKHVBN.mjs → chunk-25O24MZR.mjs}

@@ -1,12 +1,12 @@
 import {
   useAlignOptions
-} from "./chunk-2AATV7NG.mjs";
+} from "./chunk-NKDMBWQC.mjs";
 import {
   useHeadingOptions
-} from "./chunk-BVKXFA4V.mjs";
+} from "./chunk-C2H4WQP2.mjs";
 import {
   useListOptions
-} from "./chunk-DATOBXTJ.mjs";
+} from "./chunk-4I2WN43X.mjs";
 import {
   Action,
   AlignCenter,
@@ -28,7 +28,7 @@ import {
   Strikethrough,
   Underline,
   useControlContext
-} from "./chunk-54LFCIWQ.mjs";
+} from "./chunk-KJQTOPIV.mjs";
 import {
   get_class_name_factory_default
 } from "./chunk-Y2EFNT5P.mjs";
@@ -199,7 +199,7 @@ function AlignSelectFallback() {
 // components/RichTextMenu/controls/AlignSelect/index.tsx
 import { jsx as jsx7 } from "react/jsx-runtime";
 var AlignSelectLoaded = lazy(
-  () => import("./loaded-EFZRGV2Y.mjs").then((m) => ({
+  () => import("./loaded-LMF4JLYG.mjs").then((m) => ({
     default: m.AlignSelectLoaded
   }))
 );
@@ -430,7 +430,7 @@ function HeadingSelectFallback() {
 // components/RichTextMenu/controls/HeadingSelect/index.tsx
 import { jsx as jsx19 } from "react/jsx-runtime";
 var HeadingSelectLoaded = lazy2(
-  () => import("./loaded-B7563MDT.mjs").then((m) => ({
+  () => import("./loaded-SJJPEREQ.mjs").then((m) => ({
     default: m.HeadingSelectLoaded
   }))
 );
@@ -462,7 +462,7 @@ function ListSelectFallback() {
 // components/RichTextMenu/controls/ListSelect/index.tsx
 import { jsx as jsx21 } from "react/jsx-runtime";
 var ListSelectLoaded = lazy3(
-  () => import("./loaded-HECCGJKO.mjs").then((m) => ({
+  () => import("./loaded-IFFZACEG.mjs").then((m) => ({
     default: m.ListSelectLoaded
   }))
 );

package/dist/{chunk-HRNJ42TO.mjs → chunk-25QAPMLH.mjs}

@@ -3,7 +3,7 @@ import {
   setupZone,
   walkAppState,
   walkTree
-} from "./chunk-74HKFKJU.mjs";
+} from "./chunk-QHQD3BMI.mjs";
 import {
   __spreadProps,
   __spreadValues,

package/dist/{chunk-DATOBXTJ.mjs → chunk-4I2WN43X.mjs}

@@ -1,7 +1,7 @@
 import {
   List,
   ListOrdered
-} from "./chunk-54LFCIWQ.mjs";
+} from "./chunk-KJQTOPIV.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{chunk-BVKXFA4V.mjs → chunk-C2H4WQP2.mjs}

@@ -5,7 +5,7 @@ import {
   Heading4,
   Heading5,
   Heading6
-} from "./chunk-54LFCIWQ.mjs";
+} from "./chunk-KJQTOPIV.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{chunk-FKYOVZNF.mjs → chunk-JNJJ2M57.mjs}

@@ -4,7 +4,7 @@ import {
 import {
   defaultAppState,
   resolveComponentData
-} from "./chunk-GR7NLT4T.mjs";
+} from "./chunk-WUO7D6OQ.mjs";
 import {
   get_class_name_factory_default
 } from "./chunk-Y2EFNT5P.mjs";
@@ -14,7 +14,7 @@ import {
   toComponent,
   walkAppState,
   walkTree
-} from "./chunk-74HKFKJU.mjs";
+} from "./chunk-QHQD3BMI.mjs";
 import {
   __async,
   __objRest,

package/dist/{chunk-54LFCIWQ.mjs → chunk-KJQTOPIV.mjs}

@@ -3,19 +3,19 @@ import {
   generateId,
   getItem,
   makeStatePublic
-} from "./chunk-HRNJ42TO.mjs";
+} from "./chunk-25QAPMLH.mjs";
 import {
   defaultAppState,
   defaultViewports,
   getChanged,
   resolveComponentData
-} from "./chunk-GR7NLT4T.mjs";
+} from "./chunk-WUO7D6OQ.mjs";
 import {
   get_class_name_factory_default
 } from "./chunk-Y2EFNT5P.mjs";
 import {
   walkAppState
-} from "./chunk-74HKFKJU.mjs";
+} from "./chunk-QHQD3BMI.mjs";
 import {
   __async,
   __objRest,

package/dist/{chunk-2AATV7NG.mjs → chunk-NKDMBWQC.mjs}

@@ -3,7 +3,7 @@ import {
   AlignJustify,
   AlignLeft,
   AlignRight
-} from "./chunk-54LFCIWQ.mjs";
+} from "./chunk-KJQTOPIV.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{chunk-VOB4L2BJ.mjs → chunk-PRZEIT36.mjs}

@@ -3,11 +3,11 @@ import {
 } from "./chunk-H635BA2V.mjs";
 import {
   LoadedRichTextMenuInner
-} from "./chunk-73XKHVBN.mjs";
+} from "./chunk-25O24MZR.mjs";
 import {
   useAppStore,
   useAppStoreApi
-} from "./chunk-54LFCIWQ.mjs";
+} from "./chunk-KJQTOPIV.mjs";
 import {
   get_class_name_factory_default
 } from "./chunk-Y2EFNT5P.mjs";
@@ -100,7 +100,7 @@ init_react_import();
 import { lazy, Suspense } from "react";
 import { jsx as jsx2 } from "react/jsx-runtime";
 var LoadedRichTextMenuFull = lazy(
-  () => import("./full-7JVAMOPS.mjs").then((m) => ({
+  () => import("./full-YXSOFDYM.mjs").then((m) => ({
     default: m.LoadedRichTextMenuFull
   }))
 );

package/dist/{chunk-74HKFKJU.mjs → chunk-QHQD3BMI.mjs}

@@ -108,10 +108,11 @@ var walkObject = ({
   getPropPath,
   config,
   recurseSlots,
-  ownedFields
+  ownedFields,
+  keysToWalk: providedKeys
 }) => {
-  const keys = Object.keys(value);
-  if (ownedFields) {
+  const keys = providedKeys != null ? providedKeys : Object.keys(value);
+  if (!providedKeys && ownedFields) {
     for (const fieldName in fields) {
       const fieldType = fields[fieldName].type;
       if (fieldType !== "slot" && mappers[fieldType] && !(fieldName in value)) {
@@ -145,7 +146,7 @@ var walkObject = ({
   }
   return flatten(newProps);
 };
-function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlots = true) {
+function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlots = true, fieldsToMap) {
   var _a, _b, _c, _d, _e;
   const itemType = "type" in item ? item.type : "root";
   const componentConfig = itemType === "root" ? config.root : (_a = config.components) == null ? void 0 : _a[itemType];
@@ -157,7 +158,8 @@ function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlo
     getPropPath: (k) => k,
     config,
     recurseSlots,
-    ownedFields: true
+    ownedFields: true,
+    keysToWalk: fieldsToMap
   });
   if (isPromise(newProps)) {
     return newProps.then((resolvedProps) => __spreadProps(__spreadValues({}, item), {

package/dist/{chunk-6PIQFZBM.mjs → chunk-WH6PO5ND.mjs}

@@ -1,7 +1,7 @@
 import {
   EditorInner,
   LoadedRichTextMenu
-} from "./chunk-VOB4L2BJ.mjs";
+} from "./chunk-PRZEIT36.mjs";
 import {
   RichTextRenderFallback,
   SlotRender,
@@ -10,10 +10,10 @@ import {
   getSlotTransform,
   useRichtextProps,
   useSlots
-} from "./chunk-FKYOVZNF.mjs";
+} from "./chunk-JNJJ2M57.mjs";
 import {
   LoadedRichTextMenuInner
-} from "./chunk-73XKHVBN.mjs";
+} from "./chunk-25O24MZR.mjs";
 import {
   ActionBar,
   ChevronDown,
@@ -68,7 +68,7 @@ import {
   useRegisterHistorySlice,
   useRegisterPermissionsSlice,
   useResetAutoZoom
-} from "./chunk-54LFCIWQ.mjs";
+} from "./chunk-KJQTOPIV.mjs";
 import {
   generateId,
   getItem,
@@ -76,11 +76,11 @@ import {
   insertAction,
   makeStatePublic,
   populateIds
-} from "./chunk-HRNJ42TO.mjs";
+} from "./chunk-25QAPMLH.mjs";
 import {
   defaultAppState,
   defaultViewports
-} from "./chunk-GR7NLT4T.mjs";
+} from "./chunk-WUO7D6OQ.mjs";
 import {
   get_class_name_factory_default
 } from "./chunk-Y2EFNT5P.mjs";
@@ -95,7 +95,7 @@ import {
   toComponent,
   walkAppState,
   walkField
-} from "./chunk-74HKFKJU.mjs";
+} from "./chunk-QHQD3BMI.mjs";
 import {
   __async,
   __objRest,
@@ -1999,7 +1999,7 @@ EditorFallback.displayName = "EditorFallback";
 // components/AutoField/fields/RichtextField/index.tsx
 import { Fragment as Fragment5, jsx as jsx18 } from "react/jsx-runtime";
 var Editor = lazy(
-  () => import("./Editor-MXSH3OSX.mjs").then((m) => ({
+  () => import("./Editor-MLHOIEVM.mjs").then((m) => ({
     default: m.Editor
   }))
 );
@@ -4240,6 +4240,7 @@ var ContextSlotRender = ({
 init_react_import();
 import { useMemo as useMemo10, useRef as useRef5 } from "react";
 function useFieldTransformsTracked(config, item, transforms, readOnly, forceReadOnly) {
+  const prevMappers = useRef5(null);
   const prevProps = useRef5(null);
   const prevResult = useRef5(item.props);
   const mappers = useMemo10(
@@ -4247,29 +4248,44 @@ function useFieldTransformsTracked(config, item, transforms, readOnly, forceRead
     [transforms, readOnly, forceReadOnly]
   );
   const transformedProps = useMemo10(() => {
-    var _a, _b, _c;
-    const changedProps = {};
+    var _a, _b, _c, _d;
     const componentConfig = item.type === "root" ? config.root : (_a = config.components) == null ? void 0 : _a[item.type];
+    const componentFields = (_b = componentConfig == null ? void 0 : componentConfig.fields) != null ? _b : {};
+    const fullRemap = prevMappers.current !== mappers;
+    let changedFields;
     let changeIncludesSlot = false;
-    for (const fieldName in item.props) {
-      const fieldType = (_c = (_b = componentConfig == null ? void 0 : componentConfig.fields) == null ? void 0 : _b[fieldName]) == null ? void 0 : _c.type;
-      if (!prevProps.current || item.props[fieldName] !== prevProps.current[fieldName]) {
-        changedProps[fieldName] = item.props[fieldName];
-        if (fieldType === "slot") {
+    if (!prevProps.current || fullRemap) {
+      for (const fieldName in item.props) {
+        if (((_c = componentFields[fieldName]) == null ? void 0 : _c.type) === "slot") {
           changeIncludesSlot = true;
         }
       }
+    } else {
+      changedFields = ["id"];
+      const allFieldNames = /* @__PURE__ */ new Set([
+        ...Object.keys(item.props),
+        ...Object.keys(prevProps.current)
+      ]);
+      for (const fieldName of allFieldNames) {
+        if (item.props[fieldName] !== prevProps.current[fieldName]) {
+          changedFields.push(fieldName);
+          if (((_d = componentFields[fieldName]) == null ? void 0 : _d.type) === "slot") {
+            changeIncludesSlot = true;
+          }
+        }
+      }
     }
-    changedProps.id = item.props.id;
-    prevProps.current = item.props;
     const mapped = mapFields(
-      __spreadProps(__spreadValues({}, item), { props: changedProps }),
+      item,
       mappers,
       config,
       false,
-      changeIncludesSlot
+      changeIncludesSlot,
+      changedFields
     ).props;
-    prevResult.current = __spreadValues(__spreadValues({}, prevResult.current), mapped);
+    prevProps.current = item.props;
+    prevMappers.current = mappers;
+    prevResult.current = changedFields ? __spreadValues(__spreadValues({}, prevResult.current), mapped) : mapped;
     return prevResult.current;
   }, [config, item, mappers]);
   const mergedProps = useMemo10(
@@ -4499,7 +4515,7 @@ import {
 } from "react";
 import { jsx as jsx28 } from "react/jsx-runtime";
 var Editor2 = lazy2(
-  () => import("./Editor-MXSH3OSX.mjs").then((m) => ({
+  () => import("./Editor-MLHOIEVM.mjs").then((m) => ({
     default: m.Editor
   }))
 );
@@ -11023,6 +11039,7 @@ var PluginTab = ({
   return /* @__PURE__ */ jsx55("div", { className: getPluginTabClassName({ visible, mobileOnly }), children: /* @__PURE__ */ jsx55("div", { className: getPluginTabClassName("body"), children }) });
 };
 var Layout = ({ children }) => {
+  var _a, _b;
   const {
     iframe: _iframe,
     dnd,
@@ -11106,11 +11123,10 @@ var Layout = ({ children }) => {
   }
   const setUi = useAppStore((s) => s.setUi);
   const currentPlugin = useAppStore((s) => {
-    var _a;
-    return (_a = s.state.ui.plugin) == null ? void 0 : _a.current;
+    var _a2;
+    return (_a2 = s.state.ui.plugin) == null ? void 0 : _a2.current;
   });
   const appStoreApi = useAppStoreApi();
-  const [mobilePanelHeightMode, setMobilePanelHeightMode] = useState23("toggle");
   const hasLegacySideBarPlugin = useMemo24(
     () => !!(plugins == null ? void 0 : plugins.find((p) => p.name === "legacy-side-bar")),
     [plugins]
@@ -11127,17 +11143,15 @@ var Layout = ({ children }) => {
       combinedPlugins.push(fieldsPlugin());
     }
     combinedPlugins == null ? void 0 : combinedPlugins.forEach((plugin) => {
-      var _a, _b;
+      var _a2, _b2, _c;
       if (plugin.name && plugin.render) {
         if (details[plugin.name]) {
           delete details[plugin.name];
         }
         details[plugin.name] = {
-          label: (_a = plugin.label) != null ? _a : plugin.name,
-          icon: (_b = plugin.icon) != null ? _b : /* @__PURE__ */ jsx55(ToyBrick, {}),
+          label: (_a2 = plugin.label) != null ? _a2 : plugin.name,
+          icon: (_b2 = plugin.icon) != null ? _b2 : /* @__PURE__ */ jsx55(ToyBrick, {}),
           onClick: () => {
-            var _a2;
-            setMobilePanelHeightMode((_a2 = plugin.mobilePanelHeight) != null ? _a2 : "toggle");
             if (plugin.name === currentPlugin) {
               if (leftSideBarVisible) {
                 setUi({ leftSideBarVisible: false });
@@ -11155,6 +11169,7 @@ var Layout = ({ children }) => {
           },
           isActive: leftSideBarVisible && currentPlugin === plugin.name,
           render: plugin.render,
+          mobilePanelHeight: (_c = plugin.mobilePanelHeight) != null ? _c : "toggle",
           mobileOnly: hasLegacySideBarPlugin || plugin.mobileOnly,
           desktopOnly: plugin.name === "legacy-side-bar" || plugin.desktopOnly
         };
@@ -11162,6 +11177,8 @@ var Layout = ({ children }) => {
     });
     return details;
   }, [plugins, currentPlugin, appStoreApi, leftSideBarVisible]);
+  const activePlugin = currentPlugin != null ? currentPlugin : Object.keys(pluginItems)[0];
+  const mobilePanelHeightMode = (_b = (_a = pluginItems[activePlugin]) == null ? void 0 : _a.mobilePanelHeight) != null ? _b : "toggle";
   useEffect28(() => {
     if (!currentPlugin) {
       const names = Object.keys(pluginItems);
@@ -11171,8 +11188,8 @@ var Layout = ({ children }) => {
   const hasDesktopFieldsPlugin = pluginItems["fields"] && pluginItems["fields"].mobileOnly === false;
   const mobilePanelExpanded = useAppStore(
     (s) => {
-      var _a;
-      return (_a = s.state.ui.mobilePanelExpanded) != null ? _a : false;
+      var _a2;
+      return (_a2 = s.state.ui.mobilePanelExpanded) != null ? _a2 : false;
     }
   );
   return /* @__PURE__ */ jsxs23(

package/dist/{chunk-GR7NLT4T.mjs → chunk-WUO7D6OQ.mjs}

@@ -1,7 +1,7 @@
 import {
   mapFields,
   toComponent
-} from "./chunk-74HKFKJU.mjs";
+} from "./chunk-QHQD3BMI.mjs";
 import {
   __async,
   __spreadProps,

package/dist/{full-7JVAMOPS.mjs → full-YXSOFDYM.mjs}

@@ -1,14 +1,14 @@
 import {
   LoadedRichTextMenuInner
-} from "./chunk-73XKHVBN.mjs";
-import "./chunk-2AATV7NG.mjs";
-import "./chunk-BVKXFA4V.mjs";
-import "./chunk-DATOBXTJ.mjs";
-import "./chunk-54LFCIWQ.mjs";
-import "./chunk-HRNJ42TO.mjs";
-import "./chunk-GR7NLT4T.mjs";
+} from "./chunk-25O24MZR.mjs";
+import "./chunk-NKDMBWQC.mjs";
+import "./chunk-C2H4WQP2.mjs";
+import "./chunk-4I2WN43X.mjs";
+import "./chunk-KJQTOPIV.mjs";
+import "./chunk-25QAPMLH.mjs";
+import "./chunk-WUO7D6OQ.mjs";
 import "./chunk-Y2EFNT5P.mjs";
-import "./chunk-74HKFKJU.mjs";
+import "./chunk-QHQD3BMI.mjs";
 import {
   __spreadValues,
   init_react_import

package/dist/index.js

@@ -1427,7 +1427,7 @@ var init_default_slots = __esm({
 });
 
 // lib/data/map-fields.ts
-function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlots = true) {
+function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlots = true, fieldsToMap) {
   var _a, _b, _c, _d, _e;
   const itemType = "type" in item ? item.type : "root";
   const componentConfig = itemType === "root" ? config.root : (_a = config.components) == null ? void 0 : _a[itemType];
@@ -1439,7 +1439,8 @@ function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlo
     getPropPath: (k) => k,
     config,
     recurseSlots,
-    ownedFields: true
+    ownedFields: true,
+    keysToWalk: fieldsToMap
   });
   if (isPromise(newProps)) {
     return newProps.then((resolvedProps) => __spreadProps(__spreadValues({}, item), {
@@ -1546,10 +1547,11 @@ var init_map_fields = __esm({
       getPropPath,
       config,
       recurseSlots,
-      ownedFields
+      ownedFields,
+      keysToWalk: providedKeys
     }) => {
-      const keys = Object.keys(value);
-      if (ownedFields) {
+      const keys = providedKeys != null ? providedKeys : Object.keys(value);
+      if (!providedKeys && ownedFields) {
         for (const fieldName in fields) {
           const fieldType = fields[fieldName].type;
           if (fieldType !== "slot" && mappers[fieldType] && !(fieldName in value)) {
@@ -9235,6 +9237,7 @@ init_react_import();
 var import_react63 = require("react");
 init_map_fields();
 function useFieldTransformsTracked(config, item, transforms, readOnly, forceReadOnly) {
+  const prevMappers = (0, import_react63.useRef)(null);
   const prevProps = (0, import_react63.useRef)(null);
   const prevResult = (0, import_react63.useRef)(item.props);
   const mappers = (0, import_react63.useMemo)(
@@ -9242,29 +9245,44 @@ function useFieldTransformsTracked(config, item, transforms, readOnly, forceRead
     [transforms, readOnly, forceReadOnly]
   );
   const transformedProps = (0, import_react63.useMemo)(() => {
-    var _a, _b, _c;
-    const changedProps = {};
+    var _a, _b, _c, _d;
     const componentConfig = item.type === "root" ? config.root : (_a = config.components) == null ? void 0 : _a[item.type];
+    const componentFields = (_b = componentConfig == null ? void 0 : componentConfig.fields) != null ? _b : {};
+    const fullRemap = prevMappers.current !== mappers;
+    let changedFields;
     let changeIncludesSlot = false;
-    for (const fieldName in item.props) {
-      const fieldType = (_c = (_b = componentConfig == null ? void 0 : componentConfig.fields) == null ? void 0 : _b[fieldName]) == null ? void 0 : _c.type;
-      if (!prevProps.current || item.props[fieldName] !== prevProps.current[fieldName]) {
-        changedProps[fieldName] = item.props[fieldName];
-        if (fieldType === "slot") {
+    if (!prevProps.current || fullRemap) {
+      for (const fieldName in item.props) {
+        if (((_c = componentFields[fieldName]) == null ? void 0 : _c.type) === "slot") {
           changeIncludesSlot = true;
         }
       }
+    } else {
+      changedFields = ["id"];
+      const allFieldNames = /* @__PURE__ */ new Set([
+        ...Object.keys(item.props),
+        ...Object.keys(prevProps.current)
+      ]);
+      for (const fieldName of allFieldNames) {
+        if (item.props[fieldName] !== prevProps.current[fieldName]) {
+          changedFields.push(fieldName);
+          if (((_d = componentFields[fieldName]) == null ? void 0 : _d.type) === "slot") {
+            changeIncludesSlot = true;
+          }
+        }
+      }
     }
-    changedProps.id = item.props.id;
-    prevProps.current = item.props;
     const mapped = mapFields(
-      __spreadProps(__spreadValues({}, item), { props: changedProps }),
+      item,
       mappers,
       config,
       false,
-      changeIncludesSlot
+      changeIncludesSlot,
+      changedFields
     ).props;
-    prevResult.current = __spreadValues(__spreadValues({}, prevResult.current), mapped);
+    prevProps.current = item.props;
+    prevMappers.current = mappers;
+    prevResult.current = changedFields ? __spreadValues(__spreadValues({}, prevResult.current), mapped) : mapped;
     return prevResult.current;
   }, [config, item, mappers]);
   const mergedProps = (0, import_react63.useMemo)(
@@ -16955,6 +16973,7 @@ var PluginTab = ({
   return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)("div", { className: getPluginTabClassName({ visible, mobileOnly }), children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)("div", { className: getPluginTabClassName("body"), children }) });
 };
 var Layout = ({ children }) => {
+  var _a, _b;
   const {
     iframe: _iframe,
     dnd,
@@ -17038,11 +17057,10 @@ var Layout = ({ children }) => {
   }
   const setUi = useAppStore((s) => s.setUi);
   const currentPlugin = useAppStore((s) => {
-    var _a;
-    return (_a = s.state.ui.plugin) == null ? void 0 : _a.current;
+    var _a2;
+    return (_a2 = s.state.ui.plugin) == null ? void 0 : _a2.current;
   });
   const appStoreApi = useAppStoreApi();
-  const [mobilePanelHeightMode, setMobilePanelHeightMode] = (0, import_react94.useState)("toggle");
   const hasLegacySideBarPlugin = (0, import_react94.useMemo)(
     () => !!(plugins == null ? void 0 : plugins.find((p) => p.name === "legacy-side-bar")),
     [plugins]
@@ -17059,17 +17077,15 @@ var Layout = ({ children }) => {
       combinedPlugins.push(fieldsPlugin());
     }
     combinedPlugins == null ? void 0 : combinedPlugins.forEach((plugin) => {
-      var _a, _b;
+      var _a2, _b2, _c;
       if (plugin.name && plugin.render) {
         if (details[plugin.name]) {
           delete details[plugin.name];
         }
         details[plugin.name] = {
-          label: (_a = plugin.label) != null ? _a : plugin.name,
-          icon: (_b = plugin.icon) != null ? _b : /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(ToyBrick, {}),
+          label: (_a2 = plugin.label) != null ? _a2 : plugin.name,
+          icon: (_b2 = plugin.icon) != null ? _b2 : /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(ToyBrick, {}),
           onClick: () => {
-            var _a2;
-            setMobilePanelHeightMode((_a2 = plugin.mobilePanelHeight) != null ? _a2 : "toggle");
             if (plugin.name === currentPlugin) {
               if (leftSideBarVisible) {
                 setUi({ leftSideBarVisible: false });
@@ -17087,6 +17103,7 @@ var Layout = ({ children }) => {
           },
           isActive: leftSideBarVisible && currentPlugin === plugin.name,
           render: plugin.render,
+          mobilePanelHeight: (_c = plugin.mobilePanelHeight) != null ? _c : "toggle",
           mobileOnly: hasLegacySideBarPlugin || plugin.mobileOnly,
           desktopOnly: plugin.name === "legacy-side-bar" || plugin.desktopOnly
         };
@@ -17094,6 +17111,8 @@ var Layout = ({ children }) => {
     });
     return details;
   }, [plugins, currentPlugin, appStoreApi, leftSideBarVisible]);
+  const activePlugin = currentPlugin != null ? currentPlugin : Object.keys(pluginItems)[0];
+  const mobilePanelHeightMode = (_b = (_a = pluginItems[activePlugin]) == null ? void 0 : _a.mobilePanelHeight) != null ? _b : "toggle";
   (0, import_react94.useEffect)(() => {
     if (!currentPlugin) {
       const names = Object.keys(pluginItems);
@@ -17103,8 +17122,8 @@ var Layout = ({ children }) => {
   const hasDesktopFieldsPlugin = pluginItems["fields"] && pluginItems["fields"].mobileOnly === false;
   const mobilePanelExpanded = useAppStore(
     (s) => {
-      var _a;
-      return (_a = s.state.ui.mobilePanelExpanded) != null ? _a : false;
+      var _a2;
+      return (_a2 = s.state.ui.mobilePanelExpanded) != null ? _a2 : false;
     }
   );
   return /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)(

package/dist/index.mjs

@@ -17,20 +17,20 @@ import {
   setDeep,
   useGetPuck,
   usePuck
-} from "./chunk-6PIQFZBM.mjs";
-import "./chunk-VOB4L2BJ.mjs";
+} from "./chunk-WH6PO5ND.mjs";
+import "./chunk-PRZEIT36.mjs";
 import {
   migrate,
   resolveAllData,
   transformProps
-} from "./chunk-FKYOVZNF.mjs";
+} from "./chunk-JNJJ2M57.mjs";
 import "./chunk-H635BA2V.mjs";
 import {
   RichTextMenu
-} from "./chunk-73XKHVBN.mjs";
-import "./chunk-2AATV7NG.mjs";
-import "./chunk-BVKXFA4V.mjs";
-import "./chunk-DATOBXTJ.mjs";
+} from "./chunk-25O24MZR.mjs";
+import "./chunk-NKDMBWQC.mjs";
+import "./chunk-C2H4WQP2.mjs";
+import "./chunk-4I2WN43X.mjs";
 import {
   Action,
   ActionBar,
@@ -38,13 +38,13 @@ import {
   IconButton,
   Label,
   Separator
-} from "./chunk-54LFCIWQ.mjs";
-import "./chunk-HRNJ42TO.mjs";
-import "./chunk-GR7NLT4T.mjs";
+} from "./chunk-KJQTOPIV.mjs";
+import "./chunk-25QAPMLH.mjs";
+import "./chunk-WUO7D6OQ.mjs";
 import "./chunk-Y2EFNT5P.mjs";
 import {
   walkTree
-} from "./chunk-74HKFKJU.mjs";
+} from "./chunk-QHQD3BMI.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/internal.js

@@ -177,10 +177,11 @@ var walkObject = ({
   getPropPath,
   config,
   recurseSlots,
-  ownedFields
+  ownedFields,
+  keysToWalk: providedKeys
 }) => {
-  const keys = Object.keys(value);
-  if (ownedFields) {
+  const keys = providedKeys != null ? providedKeys : Object.keys(value);
+  if (!providedKeys && ownedFields) {
     for (const fieldName in fields) {
       const fieldType = fields[fieldName].type;
       if (fieldType !== "slot" && mappers[fieldType] && !(fieldName in value)) {
@@ -214,7 +215,7 @@ var walkObject = ({
   }
   return flatten(newProps);
 };
-function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlots = true) {
+function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlots = true, fieldsToMap) {
   var _a, _b, _c, _d, _e;
   const itemType = "type" in item ? item.type : "root";
   const componentConfig = itemType === "root" ? config.root : (_a = config.components) == null ? void 0 : _a[itemType];
@@ -226,7 +227,8 @@ function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlo
     getPropPath: (k) => k,
     config,
     recurseSlots,
-    ownedFields: true
+    ownedFields: true,
+    keysToWalk: fieldsToMap
   });
   if (isPromise(newProps)) {
     return newProps.then((resolvedProps) => __spreadProps(__spreadValues({}, item), {

package/dist/internal.mjs

@@ -1,7 +1,7 @@
 import {
   createReducer
-} from "./chunk-HRNJ42TO.mjs";
-import "./chunk-74HKFKJU.mjs";
+} from "./chunk-25QAPMLH.mjs";
+import "./chunk-QHQD3BMI.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{loaded-HECCGJKO.mjs → loaded-IFFZACEG.mjs}

@@ -1,15 +1,15 @@
 import {
   useListOptions
-} from "./chunk-DATOBXTJ.mjs";
+} from "./chunk-4I2WN43X.mjs";
 import {
   List,
   SelectControl,
   useControlContext
-} from "./chunk-54LFCIWQ.mjs";
-import "./chunk-HRNJ42TO.mjs";
-import "./chunk-GR7NLT4T.mjs";
+} from "./chunk-KJQTOPIV.mjs";
+import "./chunk-25QAPMLH.mjs";
+import "./chunk-WUO7D6OQ.mjs";
 import "./chunk-Y2EFNT5P.mjs";
-import "./chunk-74HKFKJU.mjs";
+import "./chunk-QHQD3BMI.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{loaded-EFZRGV2Y.mjs → loaded-LMF4JLYG.mjs}

@@ -1,15 +1,15 @@
 import {
   useAlignOptions
-} from "./chunk-2AATV7NG.mjs";
+} from "./chunk-NKDMBWQC.mjs";
 import {
   AlignLeft,
   SelectControl,
   useControlContext
-} from "./chunk-54LFCIWQ.mjs";
-import "./chunk-HRNJ42TO.mjs";
-import "./chunk-GR7NLT4T.mjs";
+} from "./chunk-KJQTOPIV.mjs";
+import "./chunk-25QAPMLH.mjs";
+import "./chunk-WUO7D6OQ.mjs";
 import "./chunk-Y2EFNT5P.mjs";
-import "./chunk-74HKFKJU.mjs";
+import "./chunk-QHQD3BMI.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{loaded-B7563MDT.mjs → loaded-SJJPEREQ.mjs}

@@ -1,15 +1,15 @@
 import {
   useHeadingOptions
-} from "./chunk-BVKXFA4V.mjs";
+} from "./chunk-C2H4WQP2.mjs";
 import {
   Heading,
   SelectControl,
   useControlContext
-} from "./chunk-54LFCIWQ.mjs";
-import "./chunk-HRNJ42TO.mjs";
-import "./chunk-GR7NLT4T.mjs";
+} from "./chunk-KJQTOPIV.mjs";
+import "./chunk-25QAPMLH.mjs";
+import "./chunk-WUO7D6OQ.mjs";
 import "./chunk-Y2EFNT5P.mjs";
-import "./chunk-74HKFKJU.mjs";
+import "./chunk-QHQD3BMI.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/no-external.js

@@ -1427,7 +1427,7 @@ var init_default_slots = __esm({
 });
 
 // lib/data/map-fields.ts
-function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlots = true) {
+function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlots = true, fieldsToMap) {
   var _a, _b, _c, _d, _e;
   const itemType = "type" in item ? item.type : "root";
   const componentConfig = itemType === "root" ? config.root : (_a = config.components) == null ? void 0 : _a[itemType];
@@ -1439,7 +1439,8 @@ function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlo
     getPropPath: (k) => k,
     config,
     recurseSlots,
-    ownedFields: true
+    ownedFields: true,
+    keysToWalk: fieldsToMap
   });
   if (isPromise(newProps)) {
     return newProps.then((resolvedProps) => __spreadProps(__spreadValues({}, item), {
@@ -1546,10 +1547,11 @@ var init_map_fields = __esm({
       getPropPath,
       config,
       recurseSlots,
-      ownedFields
+      ownedFields,
+      keysToWalk: providedKeys
     }) => {
-      const keys = Object.keys(value);
-      if (ownedFields) {
+      const keys = providedKeys != null ? providedKeys : Object.keys(value);
+      if (!providedKeys && ownedFields) {
         for (const fieldName in fields) {
           const fieldType = fields[fieldName].type;
           if (fieldType !== "slot" && mappers[fieldType] && !(fieldName in value)) {
@@ -9235,6 +9237,7 @@ init_react_import();
 var import_react63 = require("react");
 init_map_fields();
 function useFieldTransformsTracked(config, item, transforms, readOnly, forceReadOnly) {
+  const prevMappers = (0, import_react63.useRef)(null);
   const prevProps = (0, import_react63.useRef)(null);
   const prevResult = (0, import_react63.useRef)(item.props);
   const mappers = (0, import_react63.useMemo)(
@@ -9242,29 +9245,44 @@ function useFieldTransformsTracked(config, item, transforms, readOnly, forceRead
     [transforms, readOnly, forceReadOnly]
   );
   const transformedProps = (0, import_react63.useMemo)(() => {
-    var _a, _b, _c;
-    const changedProps = {};
+    var _a, _b, _c, _d;
     const componentConfig = item.type === "root" ? config.root : (_a = config.components) == null ? void 0 : _a[item.type];
+    const componentFields = (_b = componentConfig == null ? void 0 : componentConfig.fields) != null ? _b : {};
+    const fullRemap = prevMappers.current !== mappers;
+    let changedFields;
     let changeIncludesSlot = false;
-    for (const fieldName in item.props) {
-      const fieldType = (_c = (_b = componentConfig == null ? void 0 : componentConfig.fields) == null ? void 0 : _b[fieldName]) == null ? void 0 : _c.type;
-      if (!prevProps.current || item.props[fieldName] !== prevProps.current[fieldName]) {
-        changedProps[fieldName] = item.props[fieldName];
-        if (fieldType === "slot") {
+    if (!prevProps.current || fullRemap) {
+      for (const fieldName in item.props) {
+        if (((_c = componentFields[fieldName]) == null ? void 0 : _c.type) === "slot") {
           changeIncludesSlot = true;
         }
       }
+    } else {
+      changedFields = ["id"];
+      const allFieldNames = /* @__PURE__ */ new Set([
+        ...Object.keys(item.props),
+        ...Object.keys(prevProps.current)
+      ]);
+      for (const fieldName of allFieldNames) {
+        if (item.props[fieldName] !== prevProps.current[fieldName]) {
+          changedFields.push(fieldName);
+          if (((_d = componentFields[fieldName]) == null ? void 0 : _d.type) === "slot") {
+            changeIncludesSlot = true;
+          }
+        }
+      }
     }
-    changedProps.id = item.props.id;
-    prevProps.current = item.props;
     const mapped = mapFields(
-      __spreadProps(__spreadValues({}, item), { props: changedProps }),
+      item,
       mappers,
       config,
       false,
-      changeIncludesSlot
+      changeIncludesSlot,
+      changedFields
     ).props;
-    prevResult.current = __spreadValues(__spreadValues({}, prevResult.current), mapped);
+    prevProps.current = item.props;
+    prevMappers.current = mappers;
+    prevResult.current = changedFields ? __spreadValues(__spreadValues({}, prevResult.current), mapped) : mapped;
     return prevResult.current;
   }, [config, item, mappers]);
   const mergedProps = (0, import_react63.useMemo)(
@@ -16955,6 +16973,7 @@ var PluginTab = ({
   return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)("div", { className: getPluginTabClassName({ visible, mobileOnly }), children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)("div", { className: getPluginTabClassName("body"), children }) });
 };
 var Layout = ({ children }) => {
+  var _a, _b;
   const {
     iframe: _iframe,
     dnd,
@@ -17038,11 +17057,10 @@ var Layout = ({ children }) => {
   }
   const setUi = useAppStore((s) => s.setUi);
   const currentPlugin = useAppStore((s) => {
-    var _a;
-    return (_a = s.state.ui.plugin) == null ? void 0 : _a.current;
+    var _a2;
+    return (_a2 = s.state.ui.plugin) == null ? void 0 : _a2.current;
   });
   const appStoreApi = useAppStoreApi();
-  const [mobilePanelHeightMode, setMobilePanelHeightMode] = (0, import_react94.useState)("toggle");
   const hasLegacySideBarPlugin = (0, import_react94.useMemo)(
     () => !!(plugins == null ? void 0 : plugins.find((p) => p.name === "legacy-side-bar")),
     [plugins]
@@ -17059,17 +17077,15 @@ var Layout = ({ children }) => {
       combinedPlugins.push(fieldsPlugin());
     }
     combinedPlugins == null ? void 0 : combinedPlugins.forEach((plugin) => {
-      var _a, _b;
+      var _a2, _b2, _c;
       if (plugin.name && plugin.render) {
         if (details[plugin.name]) {
           delete details[plugin.name];
         }
         details[plugin.name] = {
-          label: (_a = plugin.label) != null ? _a : plugin.name,
-          icon: (_b = plugin.icon) != null ? _b : /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(ToyBrick, {}),
+          label: (_a2 = plugin.label) != null ? _a2 : plugin.name,
+          icon: (_b2 = plugin.icon) != null ? _b2 : /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(ToyBrick, {}),
           onClick: () => {
-            var _a2;
-            setMobilePanelHeightMode((_a2 = plugin.mobilePanelHeight) != null ? _a2 : "toggle");
             if (plugin.name === currentPlugin) {
               if (leftSideBarVisible) {
                 setUi({ leftSideBarVisible: false });
@@ -17087,6 +17103,7 @@ var Layout = ({ children }) => {
           },
           isActive: leftSideBarVisible && currentPlugin === plugin.name,
           render: plugin.render,
+          mobilePanelHeight: (_c = plugin.mobilePanelHeight) != null ? _c : "toggle",
           mobileOnly: hasLegacySideBarPlugin || plugin.mobileOnly,
           desktopOnly: plugin.name === "legacy-side-bar" || plugin.desktopOnly
         };
@@ -17094,6 +17111,8 @@ var Layout = ({ children }) => {
     });
     return details;
   }, [plugins, currentPlugin, appStoreApi, leftSideBarVisible]);
+  const activePlugin = currentPlugin != null ? currentPlugin : Object.keys(pluginItems)[0];
+  const mobilePanelHeightMode = (_b = (_a = pluginItems[activePlugin]) == null ? void 0 : _a.mobilePanelHeight) != null ? _b : "toggle";
   (0, import_react94.useEffect)(() => {
     if (!currentPlugin) {
       const names = Object.keys(pluginItems);
@@ -17103,8 +17122,8 @@ var Layout = ({ children }) => {
   const hasDesktopFieldsPlugin = pluginItems["fields"] && pluginItems["fields"].mobileOnly === false;
   const mobilePanelExpanded = useAppStore(
     (s) => {
-      var _a;
-      return (_a = s.state.ui.mobilePanelExpanded) != null ? _a : false;
+      var _a2;
+      return (_a2 = s.state.ui.mobilePanelExpanded) != null ? _a2 : false;
     }
   );
   return /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)(

package/dist/no-external.mjs

@@ -17,20 +17,20 @@ import {
   setDeep,
   useGetPuck,
   usePuck
-} from "./chunk-6PIQFZBM.mjs";
-import "./chunk-VOB4L2BJ.mjs";
+} from "./chunk-WH6PO5ND.mjs";
+import "./chunk-PRZEIT36.mjs";
 import {
   migrate,
   resolveAllData,
   transformProps
-} from "./chunk-FKYOVZNF.mjs";
+} from "./chunk-JNJJ2M57.mjs";
 import "./chunk-H635BA2V.mjs";
 import {
   RichTextMenu
-} from "./chunk-73XKHVBN.mjs";
-import "./chunk-2AATV7NG.mjs";
-import "./chunk-BVKXFA4V.mjs";
-import "./chunk-DATOBXTJ.mjs";
+} from "./chunk-25O24MZR.mjs";
+import "./chunk-NKDMBWQC.mjs";
+import "./chunk-C2H4WQP2.mjs";
+import "./chunk-4I2WN43X.mjs";
 import {
   Action,
   ActionBar,
@@ -38,13 +38,13 @@ import {
   IconButton,
   Label,
   Separator
-} from "./chunk-54LFCIWQ.mjs";
-import "./chunk-HRNJ42TO.mjs";
-import "./chunk-GR7NLT4T.mjs";
+} from "./chunk-KJQTOPIV.mjs";
+import "./chunk-25QAPMLH.mjs";
+import "./chunk-WUO7D6OQ.mjs";
 import "./chunk-Y2EFNT5P.mjs";
 import {
   walkTree
-} from "./chunk-74HKFKJU.mjs";
+} from "./chunk-QHQD3BMI.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/rsc.js

@@ -497,10 +497,11 @@ var walkObject = ({
   getPropPath,
   config,
   recurseSlots,
-  ownedFields
+  ownedFields,
+  keysToWalk: providedKeys
 }) => {
-  const keys = Object.keys(value);
-  if (ownedFields) {
+  const keys = providedKeys != null ? providedKeys : Object.keys(value);
+  if (!providedKeys && ownedFields) {
     for (const fieldName in fields) {
       const fieldType = fields[fieldName].type;
       if (fieldType !== "slot" && mappers[fieldType] && !(fieldName in value)) {
@@ -534,7 +535,7 @@ var walkObject = ({
   }
   return flatten(newProps);
 };
-function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlots = true) {
+function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlots = true, fieldsToMap) {
   var _a, _b, _c, _d, _e;
   const itemType = "type" in item ? item.type : "root";
   const componentConfig = itemType === "root" ? config.root : (_a = config.components) == null ? void 0 : _a[itemType];
@@ -546,7 +547,8 @@ function mapFields(item, mappers, config, recurseSlots = false, shouldDefaultSlo
     getPropPath: (k) => k,
     config,
     recurseSlots,
-    ownedFields: true
+    ownedFields: true,
+    keysToWalk: fieldsToMap
   });
   if (isPromise(newProps)) {
     return newProps.then((resolvedProps) => __spreadProps(__spreadValues({}, item), {

package/dist/rsc.mjs

@@ -5,9 +5,9 @@ import {
   transformProps,
   useRichtextProps,
   useSlots
-} from "./chunk-FKYOVZNF.mjs";
+} from "./chunk-JNJJ2M57.mjs";
 import "./chunk-H635BA2V.mjs";
-import "./chunk-GR7NLT4T.mjs";
+import "./chunk-WUO7D6OQ.mjs";
 import "./chunk-Y2EFNT5P.mjs";
 import {
   rootAreaId,
@@ -15,7 +15,7 @@ import {
   rootZone,
   setupZone,
   walkTree
-} from "./chunk-74HKFKJU.mjs";
+} from "./chunk-QHQD3BMI.mjs";
 import {
   __spreadProps,
   __spreadValues,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@puckeditor/core",
-  "version": "0.22.1",
+  "version": "0.22.3",
   "description": "The open-source visual editor for React",
   "author": "Chris Villa <chris@puckeditor.com>",
   "repository": "puckeditor/puck",