@puckeditor/core 0.21.1 → 0.21.2-canary.2fa198e1

package/dist/no-external.css

@@ -1,4 +1,146 @@
-@import "https://rsms.me/inter/inter.css";
+/* styles/color.css */
+:root {
+  --puck-color-rose-01: #4a001c;
+  --puck-color-rose-02: #670833;
+  --puck-color-rose-03: #87114c;
+  --puck-color-rose-04: #a81a66;
+  --puck-color-rose-05: #bc5089;
+  --puck-color-rose-06: #cc7ca5;
+  --puck-color-rose-07: #d89aba;
+  --puck-color-rose-08: #e3b8cf;
+  --puck-color-rose-09: #efd6e3;
+  --puck-color-rose-10: #f6eaf1;
+  --puck-color-rose-11: #faf4f8;
+  --puck-color-rose-12: #fef8fc;
+  --puck-color-azure-01: #00175d;
+  --puck-color-azure-02: #002c77;
+  --puck-color-azure-03: #014292;
+  --puck-color-azure-04: #0158ad;
+  --puck-color-azure-05: #3479be;
+  --puck-color-azure-06: #6499cf;
+  --puck-color-azure-07: #88b0da;
+  --puck-color-azure-08: #abc7e5;
+  --puck-color-azure-09: #cfdff0;
+  --puck-color-azure-10: #e7eef7;
+  --puck-color-azure-11: #f3f6fb;
+  --puck-color-azure-12: #f7faff;
+  --puck-color-green-01: #002000;
+  --puck-color-green-02: #043604;
+  --puck-color-green-03: #084e08;
+  --puck-color-green-04: #0c680c;
+  --puck-color-green-05: #1d882f;
+  --puck-color-green-06: #2faa53;
+  --puck-color-green-07: #56c16f;
+  --puck-color-green-08: #7dd78b;
+  --puck-color-green-09: #b8e8bf;
+  --puck-color-green-10: #ddf3e0;
+  --puck-color-green-11: #eff8f0;
+  --puck-color-green-12: #f3fcf4;
+  --puck-color-yellow-01: #211000;
+  --puck-color-yellow-02: #362700;
+  --puck-color-yellow-03: #4c4000;
+  --puck-color-yellow-04: #645a00;
+  --puck-color-yellow-05: #877614;
+  --puck-color-yellow-06: #ab9429;
+  --puck-color-yellow-07: #bfac4e;
+  --puck-color-yellow-08: #d4c474;
+  --puck-color-yellow-09: #e6deb1;
+  --puck-color-yellow-10: #f3efd9;
+  --puck-color-yellow-11: #f9f7ed;
+  --puck-color-yellow-12: #fcfaf0;
+  --puck-color-red-01: #4c0000;
+  --puck-color-red-02: #6a0a10;
+  --puck-color-red-03: #8a1422;
+  --puck-color-red-04: #ac1f35;
+  --puck-color-red-05: #bf5366;
+  --puck-color-red-06: #ce7e8e;
+  --puck-color-red-07: #d99ca8;
+  --puck-color-red-08: #e4b9c2;
+  --puck-color-red-09: #efd7db;
+  --puck-color-red-10: #f6eaec;
+  --puck-color-red-11: #faf4f5;
+  --puck-color-red-12: #fff9fa;
+  --puck-color-grey-01: #181818;
+  --puck-color-grey-02: #292929;
+  --puck-color-grey-03: #404040;
+  --puck-color-grey-04: #5a5a5a;
+  --puck-color-grey-05: #767676;
+  --puck-color-grey-06: #949494;
+  --puck-color-grey-07: #ababab;
+  --puck-color-grey-08: #c3c3c3;
+  --puck-color-grey-09: #dcdcdc;
+  --puck-color-grey-10: #efefef;
+  --puck-color-grey-11: #f5f5f5;
+  --puck-color-grey-12: #fafafa;
+  --puck-color-black: #000000;
+  --puck-color-white: #ffffff;
+}
+
+/* styles/typography.css */
+:root {
+  --puck-font-size-scale-base-unitless: 12;
+  --puck-font-size-xxxs-unitless: 12;
+  --puck-font-size-xxs-unitless: 14;
+  --puck-font-size-xs-unitless: 16;
+  --puck-font-size-s-unitless: 18;
+  --puck-font-size-m-unitless: 21;
+  --puck-font-size-l-unitless: 24;
+  --puck-font-size-xl-unitless: 28;
+  --puck-font-size-xxl-unitless: 36;
+  --puck-font-size-xxxl-unitless: 48;
+  --puck-font-size-xxxxl-unitless: 56;
+  --puck-font-size-xxxs: calc(1rem * var(--puck-font-size-xxxs-unitless) / 16);
+  --puck-font-size-xxs: calc(1rem * var(--puck-font-size-xxs-unitless) / 16);
+  --puck-font-size-xs: calc(1rem * var(--puck-font-size-xs-unitless) / 16);
+  --puck-font-size-s: calc(1rem * var(--puck-font-size-s-unitless) / 16);
+  --puck-font-size-m: calc(1rem * var(--puck-font-size-m-unitless) / 16);
+  --puck-font-size-l: calc(1rem * var(--puck-font-size-l-unitless) / 16);
+  --puck-font-size-xl: calc(1rem * var(--puck-font-size-xl-unitless) / 16);
+  --puck-font-size-xxl: calc(1rem * var(--puck-font-size-xxl-unitless) / 16);
+  --puck-font-size-xxxl: calc(1rem * var(--puck-font-size-xxxl-unitless) / 16);
+  --puck-font-size-xxxxl: calc( 1rem * var(--puck-font-size-xxxxl-unitless) / 16 );
+  --puck-font-size-base: var(--puck-font-size-xs);
+  --line-height-reset: 1;
+  --line-height-xs: calc( var(--space-m-unitless) / var(--puck-font-size-m-unitless) );
+  --line-height-s: calc( var(--space-m-unitless) / var(--puck-font-size-s-unitless) );
+  --line-height-m: calc( var(--space-m-unitless) / var(--puck-font-size-xs-unitless) );
+  --line-height-l: calc( var(--space-m-unitless) / var(--puck-font-size-xxs-unitless) );
+  --line-height-xl: calc( var(--space-m-unitless) / var(--puck-font-size-scale-base-unitless) );
+  --line-height-base: var(--line-height-m);
+  --fallback-font-stack:
+    -apple-system,
+    BlinkMacSystemFont,
+    Segoe UI,
+    Helvetica Neue,
+    sans-serif,
+    Apple Color Emoji,
+    Segoe UI Emoji,
+    Segoe UI Symbol;
+  --puck-font-family: Inter, var(--fallback-font-stack);
+  --puck-font-family-monospaced:
+    ui-monospace,
+    "Cascadia Code",
+    "Source Code Pro",
+    Menlo,
+    Consolas,
+    "DejaVu Sans Mono",
+    monospace;
+}
+@supports (font-variation-settings: normal) {
+  :root {
+    --puck-font-family: InterVariable, var(--fallback-font-stack);
+  }
+}
+
+/* bundle/core.css */
+#frame-root {
+  height: 1px;
+  min-height: 100vh;
+}
+[data-puck-entry] {
+  position: relative;
+  z-index: 0;
+}
 
 /* bundle/no-external.css */
 
@@ -511,152 +653,6 @@ textarea._Input-input_bsxfo_26 {
   transition: none !important;
 }
 
-/* styles/color.css */
-:root {
-  --puck-color-rose-01: #4a001c;
-  --puck-color-rose-02: #670833;
-  --puck-color-rose-03: #87114c;
-  --puck-color-rose-04: #a81a66;
-  --puck-color-rose-05: #bc5089;
-  --puck-color-rose-06: #cc7ca5;
-  --puck-color-rose-07: #d89aba;
-  --puck-color-rose-08: #e3b8cf;
-  --puck-color-rose-09: #efd6e3;
-  --puck-color-rose-10: #f6eaf1;
-  --puck-color-rose-11: #faf4f8;
-  --puck-color-rose-12: #fef8fc;
-  --puck-color-azure-01: #00175d;
-  --puck-color-azure-02: #002c77;
-  --puck-color-azure-03: #014292;
-  --puck-color-azure-04: #0158ad;
-  --puck-color-azure-05: #3479be;
-  --puck-color-azure-06: #6499cf;
-  --puck-color-azure-07: #88b0da;
-  --puck-color-azure-08: #abc7e5;
-  --puck-color-azure-09: #cfdff0;
-  --puck-color-azure-10: #e7eef7;
-  --puck-color-azure-11: #f3f6fb;
-  --puck-color-azure-12: #f7faff;
-  --puck-color-green-01: #002000;
-  --puck-color-green-02: #043604;
-  --puck-color-green-03: #084e08;
-  --puck-color-green-04: #0c680c;
-  --puck-color-green-05: #1d882f;
-  --puck-color-green-06: #2faa53;
-  --puck-color-green-07: #56c16f;
-  --puck-color-green-08: #7dd78b;
-  --puck-color-green-09: #b8e8bf;
-  --puck-color-green-10: #ddf3e0;
-  --puck-color-green-11: #eff8f0;
-  --puck-color-green-12: #f3fcf4;
-  --puck-color-yellow-01: #211000;
-  --puck-color-yellow-02: #362700;
-  --puck-color-yellow-03: #4c4000;
-  --puck-color-yellow-04: #645a00;
-  --puck-color-yellow-05: #877614;
-  --puck-color-yellow-06: #ab9429;
-  --puck-color-yellow-07: #bfac4e;
-  --puck-color-yellow-08: #d4c474;
-  --puck-color-yellow-09: #e6deb1;
-  --puck-color-yellow-10: #f3efd9;
-  --puck-color-yellow-11: #f9f7ed;
-  --puck-color-yellow-12: #fcfaf0;
-  --puck-color-red-01: #4c0000;
-  --puck-color-red-02: #6a0a10;
-  --puck-color-red-03: #8a1422;
-  --puck-color-red-04: #ac1f35;
-  --puck-color-red-05: #bf5366;
-  --puck-color-red-06: #ce7e8e;
-  --puck-color-red-07: #d99ca8;
-  --puck-color-red-08: #e4b9c2;
-  --puck-color-red-09: #efd7db;
-  --puck-color-red-10: #f6eaec;
-  --puck-color-red-11: #faf4f5;
-  --puck-color-red-12: #fff9fa;
-  --puck-color-grey-01: #181818;
-  --puck-color-grey-02: #292929;
-  --puck-color-grey-03: #404040;
-  --puck-color-grey-04: #5a5a5a;
-  --puck-color-grey-05: #767676;
-  --puck-color-grey-06: #949494;
-  --puck-color-grey-07: #ababab;
-  --puck-color-grey-08: #c3c3c3;
-  --puck-color-grey-09: #dcdcdc;
-  --puck-color-grey-10: #efefef;
-  --puck-color-grey-11: #f5f5f5;
-  --puck-color-grey-12: #fafafa;
-  --puck-color-black: #000000;
-  --puck-color-white: #ffffff;
-}
-
-/* styles/typography.css */
-:root {
-  --puck-font-size-scale-base-unitless: 12;
-  --puck-font-size-xxxs-unitless: 12;
-  --puck-font-size-xxs-unitless: 14;
-  --puck-font-size-xs-unitless: 16;
-  --puck-font-size-s-unitless: 18;
-  --puck-font-size-m-unitless: 21;
-  --puck-font-size-l-unitless: 24;
-  --puck-font-size-xl-unitless: 28;
-  --puck-font-size-xxl-unitless: 36;
-  --puck-font-size-xxxl-unitless: 48;
-  --puck-font-size-xxxxl-unitless: 56;
-  --puck-font-size-xxxs: calc(1rem * var(--puck-font-size-xxxs-unitless) / 16);
-  --puck-font-size-xxs: calc(1rem * var(--puck-font-size-xxs-unitless) / 16);
-  --puck-font-size-xs: calc(1rem * var(--puck-font-size-xs-unitless) / 16);
-  --puck-font-size-s: calc(1rem * var(--puck-font-size-s-unitless) / 16);
-  --puck-font-size-m: calc(1rem * var(--puck-font-size-m-unitless) / 16);
-  --puck-font-size-l: calc(1rem * var(--puck-font-size-l-unitless) / 16);
-  --puck-font-size-xl: calc(1rem * var(--puck-font-size-xl-unitless) / 16);
-  --puck-font-size-xxl: calc(1rem * var(--puck-font-size-xxl-unitless) / 16);
-  --puck-font-size-xxxl: calc(1rem * var(--puck-font-size-xxxl-unitless) / 16);
-  --puck-font-size-xxxxl: calc( 1rem * var(--puck-font-size-xxxxl-unitless) / 16 );
-  --puck-font-size-base: var(--puck-font-size-xs);
-  --line-height-reset: 1;
-  --line-height-xs: calc( var(--space-m-unitless) / var(--puck-font-size-m-unitless) );
-  --line-height-s: calc( var(--space-m-unitless) / var(--puck-font-size-s-unitless) );
-  --line-height-m: calc( var(--space-m-unitless) / var(--puck-font-size-xs-unitless) );
-  --line-height-l: calc( var(--space-m-unitless) / var(--puck-font-size-xxs-unitless) );
-  --line-height-xl: calc( var(--space-m-unitless) / var(--puck-font-size-scale-base-unitless) );
-  --line-height-base: var(--line-height-m);
-  --fallback-font-stack:
-    -apple-system,
-    BlinkMacSystemFont,
-    Segoe UI,
-    Helvetica Neue,
-    sans-serif,
-    Apple Color Emoji,
-    Segoe UI Emoji,
-    Segoe UI Symbol;
-  --puck-font-family: Inter, var(--fallback-font-stack);
-  --puck-font-family-monospaced:
-    ui-monospace,
-    "Cascadia Code",
-    "Source Code Pro",
-    Menlo,
-    Consolas,
-    "DejaVu Sans Mono",
-    monospace;
-}
-@supports (font-variation-settings: normal) {
-  :root {
-    --puck-font-family: InterVariable, var(--fallback-font-stack);
-  }
-}
-
-/* bundle/core.css */
-#frame-root {
-  height: 1px;
-  min-height: 100vh;
-}
-[data-puck-entry] {
-  position: relative;
-  z-index: 0;
-}
-
-/* bundle/index.css */
-
 /* css-module:/home/runner/work/puck/puck/packages/core/components/ExternalInput/styles.module.css/#css-module-data */
 ._ExternalInput-actions_91ls0_1 {
   display: flex;

package/dist/no-external.d.mts

@@ -1,6 +1,6 @@
-export { ag as Adaptor, A as AppState, ae as ArrayField, N as ArrayState, ar as AsFieldProps, a0 as BaseData, a8 as BaseField, ai as CacheOpts, m as ComponentConfig, X as ComponentConfigExtensions, $ as ComponentConfigParams, c as ComponentData, a4 as ComponentDataMap, a2 as ComponentDataOptionalId, a6 as ComponentMetadata, C as Config, _ as ConfigParams, b as Content, al as CustomField, ak as CustomFieldRender, D as Data, e as DefaultComponentProps, d as DefaultComponents, f as DefaultRootFieldProps, ap as DefaultRootProps, ao as DefaultRootRenderProps, x as Direction, y as DragAxis, aj as ExternalField, ah as ExternalFieldWithAdaptor, Z as ExtractConfigParams, at as ExtractField, p as Field, a7 as FieldMetadata, q as FieldProps, K as FieldRenderFunctions, E as FieldTransformFn, B as FieldTransformFnParams, n as FieldTransforms, F as Fields, H as History, I as IframeConfig, s as InitialHistory, L as ItemWithId, a3 as MappedItem, M as Metadata, aa as NumberField, af as ObjectField, O as OnAction, J as OverrideKey, k as Overrides, g as Permissions, j as Plugin, a as PuckAction, T as PuckComponent, an as PuckContext, a5 as PuckMetadata, ad as RadioField, i as ResolveDataTrigger, w as RichText, o as RichtextField, Y as RootConfig, R as RootData, h as RootDataWithProps, a1 as RootDataWithoutProps, ac as SelectField, S as Slot, Q as SlotComponent, am as SlotField, a9 as TextField, ab as TextareaField, l as UiState, U as UserGenerics, z as Viewport, V as Viewports, as as WithChildren, W as WithId, aq as WithPuckProps, v as WithSlotProps, G as overrideKeys } from './actions-BkBoKAc5.mjs';
+export { v as Adaptor, A as AppState, w as ArrayField, x as ArrayState, y as AsFieldProps, B as BaseData, z as BaseField, E as CacheOpts, m as ComponentConfig, G as ComponentConfigExtensions, J as ComponentConfigParams, c as ComponentData, K as ComponentDataMap, L as ComponentDataOptionalId, N as ComponentMetadata, C as Config, Q as ConfigParams, b as Content, S as CustomField, T as CustomFieldRender, D as Data, e as DefaultComponentProps, d as DefaultComponents, f as DefaultRootFieldProps, X as DefaultRootProps, Y as DefaultRootRenderProps, Z as Direction, _ as DragAxis, $ as ExternalField, a0 as ExternalFieldWithAdaptor, a1 as ExtractConfigParams, a2 as ExtractField, p as Field, a3 as FieldMetadata, q as FieldProps, a4 as FieldRenderFunctions, a5 as FieldTransformFn, a6 as FieldTransformFnParams, n as FieldTransforms, F as Fields, H as History, I as IframeConfig, s as InitialHistory, a7 as ItemWithId, a8 as MappedItem, M as Metadata, a9 as NumberField, aa as ObjectField, O as OnAction, ab as OverrideKey, k as Overrides, g as Permissions, j as Plugin, a as PuckAction, ac as PuckComponent, ad as PuckContext, ae as PuckMetadata, af as RadioField, i as ResolveDataTrigger, ag as RichText, o as RichtextField, ah as RootConfig, R as RootData, h as RootDataWithProps, ai as RootDataWithoutProps, aj as SelectField, ak as Slot, al as SlotComponent, am as SlotField, an as TextField, ao as TextareaField, l as UiState, U as UserGenerics, ap as Viewport, V as Viewports, aq as WithChildren, W as WithId, ar as WithPuckProps, as as WithSlotProps, at as overrideKeys } from './actions-BRYM0ifH.mjs';
 export { Action, ActionBar, AutoField, Button, Drawer, DropZone, FieldLabel, Group, IconButton, Label, Puck, PuckApi, Render, RichTextMenu, Separator, UsePuckData, blocksPlugin, createUsePuck, fieldsPlugin, legacySideBarPlugin, outlinePlugin, registerOverlayPortal, renderContext, setDeep, useGetPuck, usePuck } from './index.mjs';
-export { m as migrate, r as resolveAllData, t as transformProps, w as walkTree } from './walk-tree-CRRDqx6_.mjs';
+export { m as migrate, r as resolveAllData, t as transformProps, w as walkTree } from './walk-tree-C1Zdgx7d.mjs';
 import 'react';
 import '@tiptap/react';
 import '@tiptap/extension-blockquote';
@@ -18,4 +18,4 @@ import '@tiptap/extension-strike';
 import '@tiptap/extension-text-align';
 import '@tiptap/extension-underline';
 import 'react/jsx-runtime';
-import './index-bqD1SEOb.mjs';
+import './index-BVLGipsj.mjs';

package/dist/no-external.d.ts

@@ -1,6 +1,6 @@
-export { ag as Adaptor, A as AppState, ae as ArrayField, N as ArrayState, ar as AsFieldProps, a0 as BaseData, a8 as BaseField, ai as CacheOpts, m as ComponentConfig, X as ComponentConfigExtensions, $ as ComponentConfigParams, c as ComponentData, a4 as ComponentDataMap, a2 as ComponentDataOptionalId, a6 as ComponentMetadata, C as Config, _ as ConfigParams, b as Content, al as CustomField, ak as CustomFieldRender, D as Data, e as DefaultComponentProps, d as DefaultComponents, f as DefaultRootFieldProps, ap as DefaultRootProps, ao as DefaultRootRenderProps, x as Direction, y as DragAxis, aj as ExternalField, ah as ExternalFieldWithAdaptor, Z as ExtractConfigParams, at as ExtractField, p as Field, a7 as FieldMetadata, q as FieldProps, K as FieldRenderFunctions, E as FieldTransformFn, B as FieldTransformFnParams, n as FieldTransforms, F as Fields, H as History, I as IframeConfig, s as InitialHistory, L as ItemWithId, a3 as MappedItem, M as Metadata, aa as NumberField, af as ObjectField, O as OnAction, J as OverrideKey, k as Overrides, g as Permissions, j as Plugin, a as PuckAction, T as PuckComponent, an as PuckContext, a5 as PuckMetadata, ad as RadioField, i as ResolveDataTrigger, w as RichText, o as RichtextField, Y as RootConfig, R as RootData, h as RootDataWithProps, a1 as RootDataWithoutProps, ac as SelectField, S as Slot, Q as SlotComponent, am as SlotField, a9 as TextField, ab as TextareaField, l as UiState, U as UserGenerics, z as Viewport, V as Viewports, as as WithChildren, W as WithId, aq as WithPuckProps, v as WithSlotProps, G as overrideKeys } from './actions-BkBoKAc5.js';
+export { v as Adaptor, A as AppState, w as ArrayField, x as ArrayState, y as AsFieldProps, B as BaseData, z as BaseField, E as CacheOpts, m as ComponentConfig, G as ComponentConfigExtensions, J as ComponentConfigParams, c as ComponentData, K as ComponentDataMap, L as ComponentDataOptionalId, N as ComponentMetadata, C as Config, Q as ConfigParams, b as Content, S as CustomField, T as CustomFieldRender, D as Data, e as DefaultComponentProps, d as DefaultComponents, f as DefaultRootFieldProps, X as DefaultRootProps, Y as DefaultRootRenderProps, Z as Direction, _ as DragAxis, $ as ExternalField, a0 as ExternalFieldWithAdaptor, a1 as ExtractConfigParams, a2 as ExtractField, p as Field, a3 as FieldMetadata, q as FieldProps, a4 as FieldRenderFunctions, a5 as FieldTransformFn, a6 as FieldTransformFnParams, n as FieldTransforms, F as Fields, H as History, I as IframeConfig, s as InitialHistory, a7 as ItemWithId, a8 as MappedItem, M as Metadata, a9 as NumberField, aa as ObjectField, O as OnAction, ab as OverrideKey, k as Overrides, g as Permissions, j as Plugin, a as PuckAction, ac as PuckComponent, ad as PuckContext, ae as PuckMetadata, af as RadioField, i as ResolveDataTrigger, ag as RichText, o as RichtextField, ah as RootConfig, R as RootData, h as RootDataWithProps, ai as RootDataWithoutProps, aj as SelectField, ak as Slot, al as SlotComponent, am as SlotField, an as TextField, ao as TextareaField, l as UiState, U as UserGenerics, ap as Viewport, V as Viewports, aq as WithChildren, W as WithId, ar as WithPuckProps, as as WithSlotProps, at as overrideKeys } from './actions-BRYM0ifH.js';
 export { Action, ActionBar, AutoField, Button, Drawer, DropZone, FieldLabel, Group, IconButton, Label, Puck, PuckApi, Render, RichTextMenu, Separator, UsePuckData, blocksPlugin, createUsePuck, fieldsPlugin, legacySideBarPlugin, outlinePlugin, registerOverlayPortal, renderContext, setDeep, useGetPuck, usePuck } from './index.js';
-export { m as migrate, r as resolveAllData, t as transformProps, w as walkTree } from './walk-tree-CS7sEpfG.js';
+export { m as migrate, r as resolveAllData, t as transformProps, w as walkTree } from './walk-tree-DQyC1GA7.js';
 import 'react';
 import '@tiptap/react';
 import '@tiptap/extension-blockquote';
@@ -18,4 +18,4 @@ import '@tiptap/extension-strike';
 import '@tiptap/extension-text-align';
 import '@tiptap/extension-underline';
 import 'react/jsx-runtime';
-import './index-lt1zf5WR.js';
+import './index-D_Idfrfb.js';

package/dist/no-external.js

@@ -1651,6 +1651,21 @@ var init_flatten_node = __esm({
   }
 });
 
+// lib/data/to-component.ts
+var toComponent;
+var init_to_component = __esm({
+  "lib/data/to-component.ts"() {
+    "use strict";
+    init_react_import();
+    toComponent = (item) => {
+      return "type" in item ? item : __spreadProps(__spreadValues({}, item), {
+        props: __spreadProps(__spreadValues({}, item.props), { id: "root" }),
+        type: "root"
+      });
+    };
+  }
+});
+
 // lib/data/walk-app-state.ts
 function walkAppState(state, config, mapContent = (content) => content, mapNodeOrSkip = (item) => item) {
   var _a;
@@ -1714,7 +1729,7 @@ function walkAppState(state, config, mapContent = (content) => content, mapNodeO
       id
     });
     processRelatedZones(item, id, path);
-    const newItem = __spreadProps(__spreadValues({}, item), { props: newProps });
+    const newItem = __spreadProps(__spreadValues({}, mappedItem), { props: newProps });
     const thisZoneCompound = path[path.length - 1];
     const [parentId, zone] = thisZoneCompound ? thisZoneCompound.split(":") : [null, ""];
     newNodeIndex[id] = {
@@ -1754,17 +1769,14 @@ function walkAppState(state, config, mapContent = (content) => content, mapNodeO
     );
     newZones[zoneCompound] = newContent2;
   }, newZones);
-  const processedRoot = processItem(
-    {
-      type: "root",
-      props: __spreadProps(__spreadValues({}, (_a = state.data.root.props) != null ? _a : state.data.root), { id: "root" })
-    },
-    [],
-    -1
-  );
-  const root = __spreadProps(__spreadValues({}, state.data.root), {
-    props: processedRoot.props
+  let rootAsComponent = toComponent({
+    props: __spreadValues({}, (_a = state.data.root.props) != null ? _a : state.data.root)
   });
+  if (state.data.root.readOnly) {
+    rootAsComponent.readOnly = state.data.root.readOnly;
+  }
+  const processedRoot = processItem(rootAsComponent, [], -1);
+  const root = __spreadValues(__spreadValues({}, state.data.root), processedRoot);
   return __spreadProps(__spreadValues({}, state), {
     data: {
       root,
@@ -1785,6 +1797,7 @@ var init_walk_app_state = __esm({
     init_root_droppable_id();
     init_map_fields();
     init_flatten_node();
+    init_to_component();
   }
 });
 
@@ -2566,7 +2579,8 @@ var init_use_hotkey = __esm({
       KeyY: "y",
       KeyZ: "z",
       Delete: "delete",
-      Backspace: "backspace"
+      Backspace: "backspace",
+      AltRight: "altRight"
     };
     useHotkeyStore = (0, import_zustand3.create)()(
       (0, import_middleware2.subscribeWithSelector)((set) => ({
@@ -2579,6 +2593,10 @@ var init_use_hotkey = __esm({
     );
     monitorHotkeys = (doc) => {
       const onKeyDown = (e) => {
+        if (e.getModifierState("AltGraph")) {
+          useHotkeyStore.getState().hold("altRight");
+          return;
+        }
         const key = keyCodeMap[e.code];
         if (key) {
           useHotkeyStore.getState().hold(key);
@@ -2602,6 +2620,10 @@ var init_use_hotkey = __esm({
         }
       };
       const onKeyUp = (e) => {
+        if (!e.getModifierState("AltGraph") && e.code === "ControlRight") {
+          useHotkeyStore.getState().release("altRight");
+          return;
+        }
         const key = keyCodeMap[e.code];
         if (key) {
           if (key === "meta") {
@@ -2677,12 +2699,12 @@ function useRegisterHistorySlice(appStore, {
   const forward = () => {
     appStore.getState().history.forward();
   };
-  useHotkey({ meta: true, z: true }, back);
-  useHotkey({ meta: true, shift: true, z: true }, forward);
-  useHotkey({ meta: true, y: true }, forward);
-  useHotkey({ ctrl: true, z: true }, back);
-  useHotkey({ ctrl: true, shift: true, z: true }, forward);
-  useHotkey({ ctrl: true, y: true }, forward);
+  useHotkey({ altRight: false, meta: true, z: true }, back);
+  useHotkey({ altRight: false, meta: true, shift: true, z: true }, forward);
+  useHotkey({ altRight: false, meta: true, y: true }, forward);
+  useHotkey({ altRight: false, ctrl: true, z: true }, back);
+  useHotkey({ altRight: false, ctrl: true, shift: true, z: true }, forward);
+  useHotkey({ altRight: false, ctrl: true, y: true }, forward);
 }
 var import_react7, EMPTY_HISTORY_INDEX, tidyState, createHistorySlice;
 var init_history = __esm({
@@ -3110,21 +3132,6 @@ var init_fields = __esm({
   }
 });
 
-// lib/data/to-component.ts
-var toComponent;
-var init_to_component = __esm({
-  "lib/data/to-component.ts"() {
-    "use strict";
-    init_react_import();
-    toComponent = (item) => {
-      return "type" in item ? item : __spreadProps(__spreadValues({}, item), {
-        props: __spreadProps(__spreadValues({}, item.props), { id: "root" }),
-        type: "root"
-      });
-    };
-  }
-});
-
 // lib/resolve-component-data.ts
 var import_fast_equals2, cache, resolveComponentData;
 var init_resolve_component_data = __esm({
@@ -6298,8 +6305,39 @@ var SubFieldInternal = ({
 };
 var SubField = (0, import_react16.memo)(SubFieldInternal);
 
-// bundle/index.ts
+// lib/data/set-deep.ts
 init_react_import();
+function setDeep(node, path, newVal) {
+  const parts = path.split(".");
+  const newNode = __spreadValues({}, node);
+  let cur = newNode;
+  for (let i = 0; i < parts.length; i++) {
+    const [prop, idxStr] = parts[i].replace("]", "").split("[");
+    const isLast = i === parts.length - 1;
+    if (idxStr !== void 0) {
+      if (!Array.isArray(cur[prop])) {
+        cur[prop] = [];
+      }
+      const idx = Number(idxStr);
+      if (isLast) {
+        cur[prop][idx] = newVal;
+        continue;
+      }
+      if (cur[prop][idx] === void 0) cur[prop][idx] = {};
+      cur = cur[prop][idx];
+      continue;
+    }
+    if (isLast) {
+      cur[prop] = newVal;
+      continue;
+    }
+    if (cur[prop] === void 0) {
+      cur[prop] = {};
+    }
+    cur = cur[prop];
+  }
+  return __spreadValues(__spreadValues({}, node), newNode);
+}
 
 // components/AutoField/fields/ArrayField/index.tsx
 var import_jsx_runtime9 = require("react/jsx-runtime");
@@ -6368,9 +6406,10 @@ var ArrayFieldItemInternal = ({
           {
             ref: handleRef,
             onClick: (e) => {
-              if (isDragging || !hasVisibleFields) return;
+              if (isDragging) return;
               e.preventDefault();
               e.stopPropagation();
+              if (!hasVisibleFields) return;
               onToggleExpand(id, isExpanded);
             },
             className: getClassNameItem("summary"),
@@ -9118,40 +9157,6 @@ var styles_module_default17 = { "InlineTextField": "_InlineTextField_104qp_1" };
 // components/InlineTextField/index.tsx
 init_lib();
 
-// lib/data/set-deep.ts
-init_react_import();
-function setDeep(node, path, newVal) {
-  const parts = path.split(".");
-  const newNode = __spreadValues({}, node);
-  let cur = newNode;
-  for (let i = 0; i < parts.length; i++) {
-    const [prop, idxStr] = parts[i].replace("]", "").split("[");
-    const isLast = i === parts.length - 1;
-    if (idxStr !== void 0) {
-      if (!Array.isArray(cur[prop])) {
-        cur[prop] = [];
-      }
-      const idx = Number(idxStr);
-      if (isLast) {
-        cur[prop][idx] = newVal;
-        continue;
-      }
-      if (cur[prop][idx] === void 0) cur[prop][idx] = {};
-      cur = cur[prop][idx];
-      continue;
-    }
-    if (isLast) {
-      cur[prop] = newVal;
-      continue;
-    }
-    if (cur[prop] === void 0) {
-      cur[prop] = {};
-    }
-    cur = cur[prop];
-  }
-  return __spreadValues(__spreadValues({}, node), newNode);
-}
-
 // lib/get-selector-for-id.ts
 init_react_import();
 var getSelectorForId = (state, id) => {
@@ -11406,20 +11411,28 @@ var CopyHostStyles = ({
       filtered.forEach((mirror) => {
         mirror.onload = () => {
           stylesLoaded = stylesLoaded + 1;
-          if (stylesLoaded >= elements.length) {
+          if (stylesLoaded >= filtered.length) {
             onStylesLoaded();
           }
         };
         mirror.onerror = () => {
           console.warn(`AutoFrame couldn't load a stylesheet`);
           stylesLoaded = stylesLoaded + 1;
-          if (stylesLoaded >= elements.length) {
+          if (stylesLoaded >= filtered.length) {
             onStylesLoaded();
           }
         };
       });
       doc.head.innerHTML = "";
       doc.head.append(...filtered);
+      filtered.forEach((mirror) => {
+        if (mirror.nodeName === "STYLE") {
+          stylesLoaded = stylesLoaded + 1;
+        }
+      });
+      if (stylesLoaded >= filtered.length) {
+        onStylesLoaded();
+      }
       observer.observe(parentDocument.head, { childList: true, subtree: true });
       filtered.forEach((el) => {
         const elHash = (0, import_object_hash.default)(el.outerHTML);
@@ -12776,11 +12789,13 @@ var getClassName36 = get_class_name_factory_default("PuckCanvas", styles_module_
 var ZOOM_ON_CHANGE = true;
 var TRANSITION_DURATION = 150;
 var Canvas = () => {
+  var _a;
   const { frameRef } = useCanvasFrame();
   const resetAutoZoom = useResetAutoZoom(frameRef);
   const {
     _experimentalFullScreenCanvas,
-    viewports: viewportOptions = defaultViewports
+    viewports: viewportOptions = defaultViewports,
+    ui: uiProp
   } = usePropsContext();
   const {
     dispatch,
@@ -12877,10 +12892,11 @@ var Canvas = () => {
   }, []);
   const appStoreApi = useAppStoreApi();
   (0, import_react88.useEffect)(() => {
-    var _a;
+    var _a2, _b;
     if (typeof window === "undefined") return;
+    if ((_a2 = uiProp == null ? void 0 : uiProp.viewports) == null ? void 0 : _a2.current) return;
     const viewportWidth = window.innerWidth;
-    const frameWidth = (_a = frameRef.current) == null ? void 0 : _a.getBoundingClientRect().width;
+    const frameWidth = (_b = frameRef.current) == null ? void 0 : _b.getBoundingClientRect().width;
     if (!viewportWidth) return;
     if (!frameWidth) return;
     if (viewportOptions.length === 0) return;
@@ -12919,7 +12935,13 @@ var Canvas = () => {
       }
       appStoreApi.setState(__spreadProps(__spreadValues({}, appState), { history }));
     }
-  }, [viewportOptions, frameRef.current, iframe, appStoreApi]);
+  }, [
+    viewportOptions,
+    frameRef.current,
+    iframe,
+    appStoreApi,
+    (_a = uiProp == null ? void 0 : uiProp.viewports) == null ? void 0 : _a.current
+  ]);
   return /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(
     "div",
     {

package/dist/no-external.mjs

@@ -17,13 +17,13 @@ import {
   setDeep,
   useGetPuck,
   usePuck
-} from "./chunk-EBISZQTK.mjs";
-import "./chunk-RHVK562Z.mjs";
+} from "./chunk-LBGOSTI5.mjs";
+import "./chunk-GYDP2UKB.mjs";
 import {
   migrate,
   resolveAllData,
   transformProps
-} from "./chunk-TNORMHZU.mjs";
+} from "./chunk-FOGDNETJ.mjs";
 import "./chunk-AOEDIUVK.mjs";
 import {
   Action,
@@ -33,17 +33,17 @@ import {
   Label,
   RichTextMenu,
   Separator
-} from "./chunk-5V242HXR.mjs";
-import "./chunk-MSZPUXZP.mjs";
-import "./chunk-KOUWDQ4Q.mjs";
-import "./chunk-SKJTJUWU.mjs";
-import "./chunk-UMTU6EA7.mjs";
-import "./chunk-37HTE4KO.mjs";
-import "./chunk-MDUBGHWF.mjs";
+} from "./chunk-46RDHJGL.mjs";
+import "./chunk-JGZBBNEW.mjs";
+import "./chunk-BSAENBPL.mjs";
+import "./chunk-TVE6QYBR.mjs";
+import "./chunk-AFOEZCNE.mjs";
+import "./chunk-YLLE6KXH.mjs";
+import "./chunk-BOKX3EBR.mjs";
 import "./chunk-Y2EFNT5P.mjs";
 import {
   walkTree
-} from "./chunk-PMXRXC2B.mjs";
+} from "./chunk-754HNMU2.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";