@reacteditor/core 0.0.12 → 0.0.14

package/dist/index.css

@@ -2789,7 +2789,7 @@ body:has(._DropZone--isAnimating_1h108_70:empty) [data-editor-overlay] {
 }
 
 /* css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/BrowserBar/styles.module.css/#css-module-data */
-._BrowserBar_x10eb_1 {
+._BrowserBar_coofe_1 {
   align-items: center;
   background: var(--editor-surface-panel);
   border: 1px solid var(--editor-border-subtle);
@@ -2800,7 +2800,7 @@ body:has(._DropZone--isAnimating_1h108_70:empty) [data-editor-overlay] {
   padding: 8px 10px;
   width: 100%;
 }
-._BrowserBar-urlTrigger_x10eb_16 {
+._BrowserBar-urlTrigger_coofe_16 {
   align-items: center;
   background: var(--editor-surface-sunken);
   border: 1px solid var(--editor-border-subtle);
@@ -2817,21 +2817,21 @@ body:has(._DropZone--isAnimating_1h108_70:empty) [data-editor-overlay] {
   width: 100%;
 }
 @media (hover: hover) and (pointer: fine) {
-  ._BrowserBar-urlTrigger_x10eb_16:hover {
+  ._BrowserBar-urlTrigger_coofe_16:hover {
     background: var(--editor-surface-hover);
     border-color: var(--editor-border-default);
   }
 }
-._BrowserBar-urlTrigger_x10eb_16:focus-within {
+._BrowserBar-urlTrigger_coofe_16:focus-within {
   border-color: var(--editor-border-default);
   box-shadow: var(--editor-ring);
   outline: none;
 }
-._BrowserBar-urlIcon_x10eb_46 {
+._BrowserBar-urlIcon_coofe_46 {
   color: var(--editor-text-tertiary);
   flex-shrink: 0;
 }
-._BrowserBar-urlText_x10eb_51 {
+._BrowserBar-urlText_coofe_51 {
   color: var(--editor-text-primary);
   display: inline-flex;
   flex: 1;
@@ -2842,35 +2842,36 @@ body:has(._DropZone--isAnimating_1h108_70:empty) [data-editor-overlay] {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-._BrowserBar-urlInput_x10eb_63 {
+._BrowserBar-urlInput_coofe_63 {
   color: var(--editor-text-primary);
   flex: 1;
   min-width: 0;
 }
-._BrowserBar-itemPath_x10eb_69 {
+._BrowserBar-itemPath_coofe_69 {
   color: var(--editor-text-primary);
   flex-shrink: 0;
 }
-._BrowserBar-itemTitle_x10eb_74 {
+._BrowserBar-itemTitle_coofe_74 {
   color: var(--editor-text-tertiary);
   margin-left: auto;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-._BrowserBar-actions_x10eb_82 {
+._BrowserBar-actions_coofe_82 {
   align-items: center;
   display: flex;
   flex-shrink: 0;
   gap: 2px;
+  margin-left: auto;
 }
-._BrowserBar-deviceIcon_x10eb_89 {
+._BrowserBar-deviceIcon_coofe_92 {
   color: var(--editor-text-primary);
   display: inline-flex;
 }
 
 /* css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Canvas/styles.module.css/#css-module-data */
-._EditorCanvas_es8bv_1 {
+._EditorCanvas_1aq14_1 {
   background: var(--editor-surface-sunken);
   display: flex;
   grid-area: editor;
@@ -2880,24 +2881,30 @@ body:has(._DropZone--isAnimating_1h108_70:empty) [data-editor-overlay] {
   overflow: hidden;
 }
 @media (min-width: 1198px) {
-  ._EditorCanvas_es8bv_1 {
+  ._EditorCanvas_1aq14_1 {
     padding: calc(var(--editor-space-px) * 0.75);
     padding-top: calc(var(--editor-space-px) * 0.25);
   }
-  ._EditorCanvas_es8bv_1:not(._EditorCanvas_es8bv_1:has(._EditorCanvas-controls_es8bv_17)) {
+  ._EditorCanvas_1aq14_1:not(._EditorCanvas_1aq14_1:has(._EditorCanvas-controls_1aq14_17)) {
     padding-top: calc(var(--editor-space-px) * 0.75);
   }
 }
-._EditorCanvas--fullScreen_es8bv_22 {
+._EditorCanvas--fullScreen_1aq14_22 {
   padding: 0;
   overflow: hidden;
 }
 @media (min-width: 1198px) {
-  ._EditorCanvas--fullScreen_es8bv_22 {
+  ._EditorCanvas--fullScreen_1aq14_22 {
     padding: 0;
   }
 }
-._EditorCanvas-inner_es8bv_33 {
+._EditorCanvas--canvasFullScreen_1aq14_42 {
+  position: fixed;
+  inset: 0;
+  z-index: 1000;
+  padding: 0 !important;
+}
+._EditorCanvas-inner_1aq14_49 {
   display: flex;
   height: 100%;
   justify-content: center;
@@ -2905,7 +2912,7 @@ body:has(._DropZone--isAnimating_1h108_70:empty) [data-editor-overlay] {
   position: relative;
   width: 100%;
 }
-._EditorCanvas-rootColumn_es8bv_46 {
+._EditorCanvas-rootColumn_1aq14_62 {
   box-sizing: content-box;
   display: flex;
   flex-direction: column;
@@ -2914,16 +2921,16 @@ body:has(._DropZone--isAnimating_1h108_70:empty) [data-editor-overlay] {
   transform-origin: top;
 }
 @media (min-width: 1198px) {
-  ._EditorCanvas-rootColumn_es8bv_46 {
+  ._EditorCanvas-rootColumn_1aq14_62 {
     min-width: unset;
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  ._EditorCanvas-rootColumn_es8bv_46 {
+  ._EditorCanvas-rootColumn_1aq14_62 {
     transition: none !important;
   }
 }
-._EditorCanvas-root_es8bv_46 {
+._EditorCanvas-root_1aq14_62 {
   background: var(--editor-surface-panel);
   outline: 1px solid var(--editor-border-subtle);
   box-shadow: var(--editor-shadow-lg);
@@ -2933,15 +2940,15 @@ body:has(._DropZone--isAnimating_1h108_70:empty) [data-editor-overlay] {
   opacity: 0;
 }
 @media (prefers-reduced-motion: reduce) {
-  ._EditorCanvas-root_es8bv_46 {
+  ._EditorCanvas-root_1aq14_62 {
     transition: none !important;
   }
 }
-._EditorCanvas--ready_es8bv_83 ._EditorCanvas-root_es8bv_46 {
+._EditorCanvas--ready_1aq14_99 ._EditorCanvas-root_1aq14_62 {
   pointer-events: unset;
   opacity: 1;
 }
-._EditorCanvas-loader_es8bv_88 {
+._EditorCanvas-loader_1aq14_104 {
   align-items: center;
   color: var(--editor-text-tertiary);
   display: flex;
@@ -2952,18 +2959,18 @@ body:has(._DropZone--isAnimating_1h108_70:empty) [data-editor-overlay] {
   transition: opacity 250ms ease-out;
   opacity: 0;
 }
-._EditorCanvas--showLoader_es8bv_100 ._EditorCanvas-loader_es8bv_88 {
+._EditorCanvas--showLoader_1aq14_116 ._EditorCanvas-loader_1aq14_104 {
   opacity: 1;
 }
-._EditorCanvas--showLoader_es8bv_100._EditorCanvas--ready_es8bv_83 ._EditorCanvas-loader_es8bv_88 {
+._EditorCanvas--showLoader_1aq14_116._EditorCanvas--ready_1aq14_99 ._EditorCanvas-loader_1aq14_104 {
   opacity: 0;
   transition: none;
 }
-._EditorCanvas-browserBar_es8bv_109 {
+._EditorCanvas-browserBar_1aq14_125 {
   flex-shrink: 0;
   width: 100%;
 }
-._EditorCanvas-zoomControls_es8bv_114 {
+._EditorCanvas-zoomControls_1aq14_130 {
   align-items: center;
   background: var(--editor-surface-panel);
   border: 1px solid var(--editor-border-subtle);

package/dist/index.d.mts

@@ -1,10 +1,10 @@
-import { D as Data, o as Field, p as FieldProps, C as Config, U as UserGenerics, O as OnAction, f as UiState, d as Plugin, e as Overrides, h as FieldTransforms, M as Metadata, I as IframeConfig, V as Viewports, a as Permissions, E as EditorAction, q as InitialHistory, b as ComponentData, l as DefaultComponentProps, m as DefaultRootFieldProps, c as ResolveDataTrigger, r as ItemSelector, s as PluginInternal } from './actions-C0LX6bI4.mjs';
-export { t as Adaptor, A as AppState, u as ArrayField, v as ArrayState, w as AsFieldProps, B as BaseData, x as BaseField, y as CacheOpts, z as ColorField, g as ComponentConfig, G as ComponentConfigExtensions, J as ComponentConfigParams, K as ComponentDataMap, L as ComponentDataOptionalId, N as ComponentMetadata, Q as ConfigParams, j as Content, S as CustomField, T as CustomFieldRender, k as DefaultComponents, X as DefaultRootProps, Y as DefaultRootRenderProps, Z as Direction, _ as DragAxis, $ as EditorComponent, a0 as EditorContext, a1 as EditorMetadata, a2 as ExternalField, a3 as ExternalFieldWithAdaptor, a4 as ExtractConfigParams, a5 as ExtractField, a6 as FieldMetadata, a7 as FieldRenderFunctions, a8 as FieldTransformFn, a9 as FieldTransformFnParams, F as Fields, H as History, aa as ItemWithId, ab as MappedItem, ac as NumberField, ad as ObjectField, ae as OverrideKey, af as RadioField, ag as RichText, i as RichtextField, ah as RootConfig, n as RootData, R as RootDataWithProps, ai as RootDataWithoutProps, aj as SelectField, ak as Slot, al as SlotComponent, am as SlotField, an as TextField, ao as TextareaField, ap as Viewport, aq as WithChildren, ar as WithEditorProps, W as WithId, as as WithSlotProps, at as overrideKeys } from './actions-C0LX6bI4.mjs';
-export { G as GetRoutePropsOptions, g as getRouteProps, m as migrate, r as resolveAllData, a as resolveRouteFromString, t as transformProps, w as walkTree } from './walk-tree-5oDs6qOL.mjs';
+import { D as Data, o as Field, p as FieldProps, C as Config, U as UserGenerics, O as OnAction, f as UiState, q as EditorChromeConfig, d as Plugin, e as Overrides, h as FieldTransforms, M as Metadata, I as IframeConfig, V as Viewports, a as Permissions, E as EditorAction, r as InitialHistory, b as ComponentData, l as DefaultComponentProps, m as DefaultRootFieldProps, c as ResolveDataTrigger, s as ItemSelector, t as PluginInternal } from './actions-BxLinRKD.mjs';
+export { u as Adaptor, A as AppState, v as ArrayField, w as ArrayState, x as AsFieldProps, B as BaseData, y as BaseField, z as CacheOpts, G as ColorField, g as ComponentConfig, J as ComponentConfigExtensions, K as ComponentConfigParams, L as ComponentDataMap, N as ComponentDataOptionalId, Q as ComponentMetadata, S as ConfigParams, j as Content, T as CustomField, X as CustomFieldRender, k as DefaultComponents, Y as DefaultRootProps, Z as DefaultRootRenderProps, _ as Direction, $ as DragAxis, a0 as EditorComponent, a1 as EditorContext, a2 as EditorMetadata, a3 as ExternalField, a4 as ExternalFieldWithAdaptor, a5 as ExtractConfigParams, a6 as ExtractField, a7 as FieldMetadata, a8 as FieldRenderFunctions, a9 as FieldTransformFn, aa as FieldTransformFnParams, F as Fields, H as History, ab as ItemWithId, ac as MappedItem, ad as NumberField, ae as ObjectField, af as OverrideKey, ag as RadioField, ah as RichText, i as RichtextField, ai as RootConfig, n as RootData, R as RootDataWithProps, aj as RootDataWithoutProps, ak as SelectField, al as Slot, am as SlotComponent, an as SlotField, ao as TextField, ap as TextareaField, aq as Viewport, ar as WithChildren, as as WithEditorProps, W as WithId, at as WithSlotProps, au as overrideKeys } from './actions-BxLinRKD.mjs';
+export { G as GetRoutePropsOptions, g as getRouteProps, m as migrate, r as resolveAllData, a as resolveRouteFromString, t as transformProps, w as walkTree } from './walk-tree-BvYigWFL.mjs';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import react__default, { ReactNode, SyntheticEvent, ReactElement, CSSProperties } from 'react';
-import { A as AppStore, G as GetPermissions, R as RefreshPermissions, H as HistorySlice } from './index-DMbFEg8G.mjs';
+import { A as AppStore, G as GetPermissions, R as RefreshPermissions, H as HistorySlice } from './index-BZRpxcwy.mjs';
 import '@tiptap/react';
 import '@tiptap/extension-blockquote';
 import '@tiptap/extension-bold';
@@ -153,7 +153,7 @@ type EditorPassthroughProps<UserConfig extends Config = Config, G extends UserGe
     onPublish?: (data: G["UserData"], route?: string) => void;
     onChange?: (data: G["UserData"]) => void;
     onAction?: OnAction<G["UserData"]>;
-    ui?: Partial<UiState>;
+    ui?: Partial<UiState> & Partial<EditorChromeConfig>;
     plugins?: Plugin<UserConfig>[];
     overrides?: Partial<Overrides<UserConfig>>;
     fieldTransforms?: FieldTransforms<UserConfig>;
@@ -288,7 +288,13 @@ type EditorProps<UserConfig extends Config = Config, G extends UserGenerics<User
     children?: ReactNode;
     config: UserConfig;
     data: Partial<G["UserData"] | Data>;
-    ui?: Partial<UiState>;
+    /**
+     * Initial runtime UI state plus static chrome flags (`navBar`,
+     * `themeToggle`, `historyControls`, `urlBar`, `deviceToggle`,
+     * `fullScreenToggle`). Chrome flags are read once on mount and cannot be
+     * toggled via `dispatch` — they live on props, not in AppState.
+     */
+    ui?: Partial<UiState> & Partial<EditorChromeConfig>;
     onChange?: (data: G["UserData"]) => void;
     onPublish?: (data: G["UserData"], route?: string) => void;
     onAction?: OnAction<G["UserData"]>;
@@ -551,4 +557,4 @@ declare const outlinePlugin: () => Plugin;
 
 declare const legacySideBarPlugin: () => Plugin;
 
-export { Action, ActionBar, App, type AppContextValue, type AppEditorProps, type AppMatched, type AppProps, AppProvider, type AppProviderProps, type AppRenderProps, type AppRouterVariant, AutoField, Button, ComponentData, ComponentList, Config, Data, DefaultComponentProps, DefaultRootFieldProps, Drawer, Editor, EditorAction, type EditorApi, type EditorCommands, Field, FieldLabel, FieldProps, FieldTransforms, type GlobalsMap, Group, IconButton, IframeConfig, InitialHistory, type InsertComponentArgs, Label, Metadata, type MoveDestination, OnAction, Overrides, type PageMetadata, type Parent, Permissions, Plugin, Render, ResolveDataTrigger, RichTextMenu, type Route, type RouteKey, Separator, UiState, type UseEditorData, UserGenerics, Viewports, appConfigContext, blocksPlugin, createUseEditor, fieldsPlugin, legacySideBarPlugin, outlinePlugin, pageMetadata, registerOverlayPortal, renderContext, setDeep, useApp, useEditor, useGetEditor, usePropsContext, useRouteParams, useStableValue };
+export { Action, ActionBar, App, type AppContextValue, type AppEditorProps, type AppMatched, type AppProps, AppProvider, type AppProviderProps, type AppRenderProps, type AppRouterVariant, AutoField, Button, ComponentData, ComponentList, Config, Data, DefaultComponentProps, DefaultRootFieldProps, Drawer, Editor, EditorAction, type EditorApi, EditorChromeConfig, type EditorCommands, Field, FieldLabel, FieldProps, FieldTransforms, type GlobalsMap, Group, IconButton, IframeConfig, InitialHistory, type InsertComponentArgs, Label, Metadata, type MoveDestination, OnAction, Overrides, type PageMetadata, type Parent, Permissions, Plugin, Render, ResolveDataTrigger, RichTextMenu, type Route, type RouteKey, Separator, UiState, type UseEditorData, UserGenerics, Viewports, appConfigContext, blocksPlugin, createUseEditor, fieldsPlugin, legacySideBarPlugin, outlinePlugin, pageMetadata, registerOverlayPortal, renderContext, setDeep, useApp, useEditor, useGetEditor, usePropsContext, useRouteParams, useStableValue };

package/dist/index.d.ts

@@ -1,10 +1,10 @@
-import { D as Data, o as Field, p as FieldProps, C as Config, U as UserGenerics, O as OnAction, f as UiState, d as Plugin, e as Overrides, h as FieldTransforms, M as Metadata, I as IframeConfig, V as Viewports, a as Permissions, E as EditorAction, q as InitialHistory, b as ComponentData, l as DefaultComponentProps, m as DefaultRootFieldProps, c as ResolveDataTrigger, r as ItemSelector, s as PluginInternal } from './actions-C0LX6bI4.js';
-export { t as Adaptor, A as AppState, u as ArrayField, v as ArrayState, w as AsFieldProps, B as BaseData, x as BaseField, y as CacheOpts, z as ColorField, g as ComponentConfig, G as ComponentConfigExtensions, J as ComponentConfigParams, K as ComponentDataMap, L as ComponentDataOptionalId, N as ComponentMetadata, Q as ConfigParams, j as Content, S as CustomField, T as CustomFieldRender, k as DefaultComponents, X as DefaultRootProps, Y as DefaultRootRenderProps, Z as Direction, _ as DragAxis, $ as EditorComponent, a0 as EditorContext, a1 as EditorMetadata, a2 as ExternalField, a3 as ExternalFieldWithAdaptor, a4 as ExtractConfigParams, a5 as ExtractField, a6 as FieldMetadata, a7 as FieldRenderFunctions, a8 as FieldTransformFn, a9 as FieldTransformFnParams, F as Fields, H as History, aa as ItemWithId, ab as MappedItem, ac as NumberField, ad as ObjectField, ae as OverrideKey, af as RadioField, ag as RichText, i as RichtextField, ah as RootConfig, n as RootData, R as RootDataWithProps, ai as RootDataWithoutProps, aj as SelectField, ak as Slot, al as SlotComponent, am as SlotField, an as TextField, ao as TextareaField, ap as Viewport, aq as WithChildren, ar as WithEditorProps, W as WithId, as as WithSlotProps, at as overrideKeys } from './actions-C0LX6bI4.js';
-export { G as GetRoutePropsOptions, g as getRouteProps, m as migrate, r as resolveAllData, a as resolveRouteFromString, t as transformProps, w as walkTree } from './walk-tree-B1q6t5Jp.js';
+import { D as Data, o as Field, p as FieldProps, C as Config, U as UserGenerics, O as OnAction, f as UiState, q as EditorChromeConfig, d as Plugin, e as Overrides, h as FieldTransforms, M as Metadata, I as IframeConfig, V as Viewports, a as Permissions, E as EditorAction, r as InitialHistory, b as ComponentData, l as DefaultComponentProps, m as DefaultRootFieldProps, c as ResolveDataTrigger, s as ItemSelector, t as PluginInternal } from './actions-BxLinRKD.js';
+export { u as Adaptor, A as AppState, v as ArrayField, w as ArrayState, x as AsFieldProps, B as BaseData, y as BaseField, z as CacheOpts, G as ColorField, g as ComponentConfig, J as ComponentConfigExtensions, K as ComponentConfigParams, L as ComponentDataMap, N as ComponentDataOptionalId, Q as ComponentMetadata, S as ConfigParams, j as Content, T as CustomField, X as CustomFieldRender, k as DefaultComponents, Y as DefaultRootProps, Z as DefaultRootRenderProps, _ as Direction, $ as DragAxis, a0 as EditorComponent, a1 as EditorContext, a2 as EditorMetadata, a3 as ExternalField, a4 as ExternalFieldWithAdaptor, a5 as ExtractConfigParams, a6 as ExtractField, a7 as FieldMetadata, a8 as FieldRenderFunctions, a9 as FieldTransformFn, aa as FieldTransformFnParams, F as Fields, H as History, ab as ItemWithId, ac as MappedItem, ad as NumberField, ae as ObjectField, af as OverrideKey, ag as RadioField, ah as RichText, i as RichtextField, ai as RootConfig, n as RootData, R as RootDataWithProps, aj as RootDataWithoutProps, ak as SelectField, al as Slot, am as SlotComponent, an as SlotField, ao as TextField, ap as TextareaField, aq as Viewport, ar as WithChildren, as as WithEditorProps, W as WithId, at as WithSlotProps, au as overrideKeys } from './actions-BxLinRKD.js';
+export { G as GetRoutePropsOptions, g as getRouteProps, m as migrate, r as resolveAllData, a as resolveRouteFromString, t as transformProps, w as walkTree } from './walk-tree-Clklc1Ql.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import react__default, { ReactNode, SyntheticEvent, ReactElement, CSSProperties } from 'react';
-import { A as AppStore, G as GetPermissions, R as RefreshPermissions, H as HistorySlice } from './index-DmThy7vE.js';
+import { A as AppStore, G as GetPermissions, R as RefreshPermissions, H as HistorySlice } from './index-B_21fGrq.js';
 import '@tiptap/react';
 import '@tiptap/extension-blockquote';
 import '@tiptap/extension-bold';
@@ -153,7 +153,7 @@ type EditorPassthroughProps<UserConfig extends Config = Config, G extends UserGe
     onPublish?: (data: G["UserData"], route?: string) => void;
     onChange?: (data: G["UserData"]) => void;
     onAction?: OnAction<G["UserData"]>;
-    ui?: Partial<UiState>;
+    ui?: Partial<UiState> & Partial<EditorChromeConfig>;
     plugins?: Plugin<UserConfig>[];
     overrides?: Partial<Overrides<UserConfig>>;
     fieldTransforms?: FieldTransforms<UserConfig>;
@@ -288,7 +288,13 @@ type EditorProps<UserConfig extends Config = Config, G extends UserGenerics<User
     children?: ReactNode;
     config: UserConfig;
     data: Partial<G["UserData"] | Data>;
-    ui?: Partial<UiState>;
+    /**
+     * Initial runtime UI state plus static chrome flags (`navBar`,
+     * `themeToggle`, `historyControls`, `urlBar`, `deviceToggle`,
+     * `fullScreenToggle`). Chrome flags are read once on mount and cannot be
+     * toggled via `dispatch` — they live on props, not in AppState.
+     */
+    ui?: Partial<UiState> & Partial<EditorChromeConfig>;
     onChange?: (data: G["UserData"]) => void;
     onPublish?: (data: G["UserData"], route?: string) => void;
     onAction?: OnAction<G["UserData"]>;
@@ -551,4 +557,4 @@ declare const outlinePlugin: () => Plugin;
 
 declare const legacySideBarPlugin: () => Plugin;
 
-export { Action, ActionBar, App, type AppContextValue, type AppEditorProps, type AppMatched, type AppProps, AppProvider, type AppProviderProps, type AppRenderProps, type AppRouterVariant, AutoField, Button, ComponentData, ComponentList, Config, Data, DefaultComponentProps, DefaultRootFieldProps, Drawer, Editor, EditorAction, type EditorApi, type EditorCommands, Field, FieldLabel, FieldProps, FieldTransforms, type GlobalsMap, Group, IconButton, IframeConfig, InitialHistory, type InsertComponentArgs, Label, Metadata, type MoveDestination, OnAction, Overrides, type PageMetadata, type Parent, Permissions, Plugin, Render, ResolveDataTrigger, RichTextMenu, type Route, type RouteKey, Separator, UiState, type UseEditorData, UserGenerics, Viewports, appConfigContext, blocksPlugin, createUseEditor, fieldsPlugin, legacySideBarPlugin, outlinePlugin, pageMetadata, registerOverlayPortal, renderContext, setDeep, useApp, useEditor, useGetEditor, usePropsContext, useRouteParams, useStableValue };
+export { Action, ActionBar, App, type AppContextValue, type AppEditorProps, type AppMatched, type AppProps, AppProvider, type AppProviderProps, type AppRenderProps, type AppRouterVariant, AutoField, Button, ComponentData, ComponentList, Config, Data, DefaultComponentProps, DefaultRootFieldProps, Drawer, Editor, EditorAction, type EditorApi, EditorChromeConfig, type EditorCommands, Field, FieldLabel, FieldProps, FieldTransforms, type GlobalsMap, Group, IconButton, IframeConfig, InitialHistory, type InsertComponentArgs, Label, Metadata, type MoveDestination, OnAction, Overrides, type PageMetadata, type Parent, Permissions, Plugin, Render, ResolveDataTrigger, RichTextMenu, type Route, type RouteKey, Separator, UiState, type UseEditorData, UserGenerics, Viewports, appConfigContext, blocksPlugin, createUseEditor, fieldsPlugin, legacySideBarPlugin, outlinePlugin, pageMetadata, registerOverlayPortal, renderContext, setDeep, useApp, useEditor, useGetEditor, usePropsContext, useRouteParams, useStableValue };

package/dist/index.js

@@ -3165,7 +3165,7 @@ var init_default_app_state = __esm({
       ui: {
         leftSideBarVisible: true,
         rightSideBarVisible: true,
-        navBarVisible: true,
+        canvasFullScreen: false,
         arrayState: {},
         itemSelector: null,
         componentList: {},
@@ -13286,7 +13286,7 @@ function ComboboxEmpty(_a) {
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/BrowserBar/styles.module.css#css-module
 init_react_import();
-var styles_module_default29 = { "BrowserBar": "_BrowserBar_x10eb_1", "BrowserBar-urlTrigger": "_BrowserBar-urlTrigger_x10eb_16", "BrowserBar-urlIcon": "_BrowserBar-urlIcon_x10eb_46", "BrowserBar-urlText": "_BrowserBar-urlText_x10eb_51", "BrowserBar-urlInput": "_BrowserBar-urlInput_x10eb_63", "BrowserBar-itemPath": "_BrowserBar-itemPath_x10eb_69", "BrowserBar-itemTitle": "_BrowserBar-itemTitle_x10eb_74", "BrowserBar-actions": "_BrowserBar-actions_x10eb_82", "BrowserBar-deviceIcon": "_BrowserBar-deviceIcon_x10eb_89" };
+var styles_module_default29 = { "BrowserBar": "_BrowserBar_coofe_1", "BrowserBar-urlTrigger": "_BrowserBar-urlTrigger_coofe_16", "BrowserBar-urlIcon": "_BrowserBar-urlIcon_coofe_46", "BrowserBar-urlText": "_BrowserBar-urlText_coofe_51", "BrowserBar-urlInput": "_BrowserBar-urlInput_coofe_63", "BrowserBar-itemPath": "_BrowserBar-itemPath_coofe_69", "BrowserBar-itemTitle": "_BrowserBar-itemTitle_coofe_74", "BrowserBar-actions": "_BrowserBar-actions_coofe_82", "BrowserBar-deviceIcon": "_BrowserBar-deviceIcon_coofe_92" };
 
 // components/BrowserBar/index.tsx
 var import_jsx_runtime84 = require("react/jsx-runtime");
@@ -13304,21 +13304,19 @@ var BrowserBar = ({
   onViewportChange
 }) => {
   const { routes, currentRoute, onRouteChange } = usePropsContext();
+  const chrome = useChromeConfig();
   const viewports = useAppStore((s) => s.state.ui.viewports);
   const dispatch = useAppStore((s) => s.dispatch);
-  const leftSideBarVisible = useAppStore((s) => s.state.ui.leftSideBarVisible);
-  const rightSideBarVisible = useAppStore(
-    (s) => s.state.ui.rightSideBarVisible
+  const isFullScreen = useAppStore(
+    (s) => {
+      var _a;
+      return (_a = s.state.ui.canvasFullScreen) != null ? _a : false;
+    }
   );
-  const isFullScreen = !leftSideBarVisible && !rightSideBarVisible;
   const toggleFullScreen = () => {
-    const next = !isFullScreen;
     dispatch({
       type: "setUi",
-      ui: {
-        leftSideBarVisible: !next,
-        rightSideBarVisible: !next
-      }
+      ui: { canvasFullScreen: !isFullScreen }
     });
   };
   const activeDevice = (0, import_react87.useMemo)(() => {
@@ -13341,8 +13339,11 @@ var BrowserBar = ({
     if (!next || next === currentRoute) return;
     void (onRouteChange == null ? void 0 : onRouteChange(next));
   };
+  if (!chrome.showUrlBar && !chrome.showDeviceToggle && !chrome.showFullScreenToggle) {
+    return null;
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: getClassName36(), children: [
-    showRoutePicker ? /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(
+    chrome.showUrlBar && (showRoutePicker ? /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(
       Combobox,
       {
         items: routes,
@@ -13386,9 +13387,9 @@ var BrowserBar = ({
     ) : /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: getClassName36("urlTrigger"), children: [
       /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Globe, { className: getClassName36("urlIcon"), size: 14 }),
       /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: getClassName36("urlText"), children: "/" })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: getClassName36("actions"), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+    ] })),
+    (chrome.showDeviceToggle || chrome.showFullScreenToggle) && /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: getClassName36("actions"), children: [
+      chrome.showDeviceToggle && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
         IconButton,
         {
           type: "button",
@@ -13397,7 +13398,7 @@ var BrowserBar = ({
           children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: getClassName36("deviceIcon"), children: activeDevice === "desktop" ? /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Monitor, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Smartphone, { size: 16 }) })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+      chrome.showFullScreenToggle && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
         IconButton,
         {
           type: "button",
@@ -13412,7 +13413,7 @@ var BrowserBar = ({
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Canvas/styles.module.css#css-module
 init_react_import();
-var styles_module_default30 = { "EditorCanvas": "_EditorCanvas_es8bv_1", "EditorCanvas-controls": "_EditorCanvas-controls_es8bv_17", "EditorCanvas--fullScreen": "_EditorCanvas--fullScreen_es8bv_22", "EditorCanvas-inner": "_EditorCanvas-inner_es8bv_33", "EditorCanvas-rootColumn": "_EditorCanvas-rootColumn_es8bv_46", "EditorCanvas-root": "_EditorCanvas-root_es8bv_46", "EditorCanvas--ready": "_EditorCanvas--ready_es8bv_83", "EditorCanvas-loader": "_EditorCanvas-loader_es8bv_88", "EditorCanvas--showLoader": "_EditorCanvas--showLoader_es8bv_100", "EditorCanvas-browserBar": "_EditorCanvas-browserBar_es8bv_109", "EditorCanvas-zoomControls": "_EditorCanvas-zoomControls_es8bv_114" };
+var styles_module_default30 = { "EditorCanvas": "_EditorCanvas_1aq14_1", "EditorCanvas-controls": "_EditorCanvas-controls_1aq14_17", "EditorCanvas--fullScreen": "_EditorCanvas--fullScreen_1aq14_22", "EditorCanvas--canvasFullScreen": "_EditorCanvas--canvasFullScreen_1aq14_42", "EditorCanvas-inner": "_EditorCanvas-inner_1aq14_49", "EditorCanvas-rootColumn": "_EditorCanvas-rootColumn_1aq14_62", "EditorCanvas-root": "_EditorCanvas-root_1aq14_62", "EditorCanvas--ready": "_EditorCanvas--ready_1aq14_99", "EditorCanvas-loader": "_EditorCanvas-loader_1aq14_104", "EditorCanvas--showLoader": "_EditorCanvas--showLoader_1aq14_116", "EditorCanvas-browserBar": "_EditorCanvas-browserBar_1aq14_125", "EditorCanvas-zoomControls": "_EditorCanvas-zoomControls_1aq14_130" };
 
 // components/Editor/components/Canvas/index.tsx
 init_lib();
@@ -13483,6 +13484,12 @@ var Canvas = () => {
     }))
   );
   const viewports = useAppStore((s) => s.state.ui.viewports);
+  const canvasFullScreen = useAppStore(
+    (s) => {
+      var _a2;
+      return (_a2 = s.state.ui.canvasFullScreen) != null ? _a2 : false;
+    }
+  );
   const [canvasZoom, setCanvasZoom] = (0, import_react89.useState)(1);
   const zoomIn = () => setCanvasZoom((z) => Math.min(z + ZOOM_STEP, MAX_ZOOM));
   const zoomOut = () => setCanvasZoom((z) => Math.max(z - ZOOM_STEP, MIN_ZOOM));
@@ -13618,7 +13625,8 @@ var Canvas = () => {
       className: getClassName37({
         ready: status === "READY" || !iframe.enabled || !iframe.waitForStyles,
         showLoader,
-        fullScreen: fullScreenCanvas
+        fullScreen: fullScreenCanvas,
+        canvasFullScreen
       }),
       onClick: (e) => {
         const el = e.target;
@@ -14156,6 +14164,7 @@ var getPluginTabClassName = get_class_name_factory_default("EditorPluginTab", st
 var FieldSideBarToolbar = () => {
   const appStore = useAppStoreApi();
   const { onPublish, currentRoute } = usePropsContext();
+  const chrome = useChromeConfig();
   const back = useAppStore((s) => s.history.back);
   const forward = useAppStore((s) => s.history.forward);
   const hasFuture = useAppStore((s) => s.history.hasFuture());
@@ -14164,7 +14173,7 @@ var FieldSideBarToolbar = () => {
     (s) => s.overrides.headerActions || DefaultOverride
   );
   return /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)("div", { className: getClassName43("fieldSideBarToolbar"), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)("div", { className: getClassName43("fieldSideBarHistory"), children: [
+    chrome.showHistoryControls ? /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)("div", { className: getClassName43("fieldSideBarHistory"), children: [
       /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
         IconButton,
         {
@@ -14185,7 +14194,7 @@ var FieldSideBarToolbar = () => {
           children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Redo2, { size: 18 })
         }
       )
-    ] }),
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", {}),
     /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { className: getClassName43("fieldSideBarActions"), children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(CustomHeaderActions, { children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
       Button,
       {
@@ -14238,7 +14247,8 @@ var Layout = ({ children }) => {
   const rightSideBarVisible = useAppStore(
     (s) => s.state.ui.rightSideBarVisible
   );
-  const navBarVisible = useAppStore((s) => s.state.ui.navBarVisible);
+  const chrome = useChromeConfig();
+  const navBarVisible = chrome.showNavBar;
   const instanceId = useAppStore((s) => s.instanceId);
   const {
     width: leftWidth,
@@ -14480,7 +14490,7 @@ var Layout = ({ children }) => {
                     Nav,
                     {
                       items: pluginItems,
-                      footer: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
+                      footer: chrome.showThemeToggle ? /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
                         IconButton,
                         {
                           type: "button",
@@ -14488,7 +14498,7 @@ var Layout = ({ children }) => {
                           onClick: toggleTheme,
                           children: themeIcon
                         }
-                      )
+                      ) : void 0
                     }
                   ) }),
                   /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(
@@ -14577,11 +14587,45 @@ var Layout = ({ children }) => {
 
 // components/Editor/index.tsx
 var import_jsx_runtime93 = require("react/jsx-runtime");
+var CHROME_KEYS = [
+  "showNavBar",
+  "showThemeToggle",
+  "showHistoryControls",
+  "showUrlBar",
+  "showDeviceToggle",
+  "showFullScreenToggle"
+];
+var DEFAULT_CHROME = {
+  showNavBar: true,
+  showThemeToggle: true,
+  showHistoryControls: true,
+  showUrlBar: true,
+  showDeviceToggle: true,
+  showFullScreenToggle: true
+};
+var splitUiConfig = (ui) => {
+  const runtime = {};
+  const chrome = {};
+  if (!ui) return { runtime, chrome };
+  for (const [key, value] of Object.entries(ui)) {
+    if (CHROME_KEYS.includes(key)) {
+      chrome[key] = value;
+    } else {
+      runtime[key] = value;
+    }
+  }
+  return { runtime, chrome };
+};
 var propsContext = (0, import_react95.createContext)({});
 function PropsProvider(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(propsContext.Provider, { value: props, children: props.children });
 }
 var usePropsContext = () => (0, import_react95.useContext)(propsContext);
+var useChromeConfig = () => {
+  const { ui } = usePropsContext();
+  const { chrome } = splitUiConfig(ui);
+  return __spreadValues(__spreadValues({}, DEFAULT_CHROME), chrome);
+};
 function EditorProvider({ children }) {
   const {
     config,
@@ -14609,7 +14653,8 @@ function EditorProvider({ children }) {
   );
   const [generatedAppState] = (0, import_react95.useState)(() => {
     var _a, _b, _c, _d, _e, _f;
-    const initial = __spreadValues(__spreadValues({}, defaultAppState.ui), initialUi);
+    const { runtime: initialUiRuntime } = splitUiConfig(initialUi);
+    const initial = __spreadValues(__spreadValues({}, defaultAppState.ui), initialUiRuntime);
     let clientUiState = {};
     if (Object.keys((initialData == null ? void 0 : initialData.root) || {}).length > 0 && !((_a = initialData == null ? void 0 : initialData.root) == null ? void 0 : _a.props)) {
       console.warn(

package/dist/index.mjs

@@ -25,8 +25,8 @@ import {
   usePropsContext,
   useRouteParams,
   useStableValue
-} from "./chunk-OKTANBAI.mjs";
-import "./chunk-YBG2RYVF.mjs";
+} from "./chunk-IFFNAAXW.mjs";
+import "./chunk-5QKQ3LQJ.mjs";
 import {
   Action,
   ActionBar,
@@ -35,21 +35,21 @@ import {
   Label,
   RichTextMenu,
   Separator
-} from "./chunk-TGVAC3JP.mjs";
-import "./chunk-X4EUZIHA.mjs";
+} from "./chunk-Q667J2EG.mjs";
+import "./chunk-RQZQMS6E.mjs";
 import {
   getRouteProps,
   migrate,
   resolveAllData,
   resolveRouteFromString,
   transformProps
-} from "./chunk-II42EKFK.mjs";
+} from "./chunk-4L7H4JV4.mjs";
 import "./chunk-6QJ2HF4O.mjs";
-import "./chunk-XLVEWZWT.mjs";
-import "./chunk-MJJPWASL.mjs";
-import "./chunk-56I7ST5F.mjs";
+import "./chunk-RGC274VM.mjs";
+import "./chunk-TG2KTWSB.mjs";
+import "./chunk-JHURG5NN.mjs";
 import "./chunk-M4JDRFYB.mjs";
-import "./chunk-ERNSJXVF.mjs";
+import "./chunk-FTVOCMGV.mjs";
 import "./chunk-Y2EFNT5P.mjs";
 import {
   walkTree

package/dist/internal.d.mts

@@ -1,6 +1,6 @@
 import { Reducer } from 'react';
-import { D as Data, A as AppState, O as OnAction, P as PrivateAppState, E as EditorAction } from './actions-C0LX6bI4.mjs';
-import { A as AppStore } from './index-DMbFEg8G.mjs';
+import { D as Data, A as AppState, O as OnAction, P as PrivateAppState, E as EditorAction } from './actions-BxLinRKD.mjs';
+import { A as AppStore } from './index-BZRpxcwy.mjs';
 import '@tiptap/react';
 import '@tiptap/extension-blockquote';
 import '@tiptap/extension-bold';

package/dist/internal.d.ts

@@ -1,6 +1,6 @@
 import { Reducer } from 'react';
-import { D as Data, A as AppState, O as OnAction, P as PrivateAppState, E as EditorAction } from './actions-C0LX6bI4.js';
-import { A as AppStore } from './index-DmThy7vE.js';
+import { D as Data, A as AppState, O as OnAction, P as PrivateAppState, E as EditorAction } from './actions-BxLinRKD.js';
+import { A as AppStore } from './index-B_21fGrq.js';
 import '@tiptap/react';
 import '@tiptap/extension-blockquote';
 import '@tiptap/extension-bold';

package/dist/{loaded-YFYCF5F4.mjs → loaded-6YKSFCCD.mjs}

@@ -1,13 +1,13 @@
 import {
   useHeadingOptions
-} from "./chunk-MJJPWASL.mjs";
+} from "./chunk-TG2KTWSB.mjs";
 import {
   Heading,
   SelectControl,
   useControlContext
-} from "./chunk-56I7ST5F.mjs";
+} from "./chunk-JHURG5NN.mjs";
 import "./chunk-M4JDRFYB.mjs";
-import "./chunk-ERNSJXVF.mjs";
+import "./chunk-FTVOCMGV.mjs";
 import "./chunk-Y2EFNT5P.mjs";
 import "./chunk-JIXMPJZA.mjs";
 import {

package/dist/{loaded-HVOKDVC3.mjs → loaded-DUBT6SP5.mjs}

@@ -1,13 +1,13 @@
 import {
   useListOptions
-} from "./chunk-X4EUZIHA.mjs";
+} from "./chunk-RQZQMS6E.mjs";
 import {
   List,
   SelectControl,
   useControlContext
-} from "./chunk-56I7ST5F.mjs";
+} from "./chunk-JHURG5NN.mjs";
 import "./chunk-M4JDRFYB.mjs";
-import "./chunk-ERNSJXVF.mjs";
+import "./chunk-FTVOCMGV.mjs";
 import "./chunk-Y2EFNT5P.mjs";
 import "./chunk-JIXMPJZA.mjs";
 import {

package/dist/{loaded-BT7NIVEO.mjs → loaded-ZQCRSG65.mjs}

@@ -1,13 +1,13 @@
 import {
   useAlignOptions
-} from "./chunk-XLVEWZWT.mjs";
+} from "./chunk-RGC274VM.mjs";
 import {
   AlignLeft,
   SelectControl,
   useControlContext
-} from "./chunk-56I7ST5F.mjs";
+} from "./chunk-JHURG5NN.mjs";
 import "./chunk-M4JDRFYB.mjs";
-import "./chunk-ERNSJXVF.mjs";
+import "./chunk-FTVOCMGV.mjs";
 import "./chunk-Y2EFNT5P.mjs";
 import "./chunk-JIXMPJZA.mjs";
 import {