@reacteditor/core 0.0.5 → 0.0.7

package/dist/no-external.js

@@ -199,7 +199,7 @@ var init_styles_module = __esm({
     "use strict";
     init_react_import();
     init_css_module_data();
-    styles_module_default = { "ActionBar": "_ActionBar_5kf61_1", "ActionBar-label": "_ActionBar-label_5kf61_19", "ActionBarAction": "_ActionBarAction_5kf61_32", "ActionBar-group": "_ActionBar-group_5kf61_40", "ActionBarAction--disabled": "_ActionBarAction--disabled_5kf61_75", "ActionBarAction--active": "_ActionBarAction--active_5kf61_98", "ActionBar-separator": "_ActionBar-separator_5kf61_108" };
+    styles_module_default = { "ActionBar": "_ActionBar_15hub_1", "ActionBar-label": "_ActionBar-label_15hub_19", "ActionBarAction": "_ActionBarAction_15hub_32", "ActionBar-group": "_ActionBar-group_15hub_40", "ActionBarAction--disabled": "_ActionBarAction--disabled_15hub_75", "ActionBarAction--active": "_ActionBarAction--active_15hub_98", "ActionBar-separator": "_ActionBar-separator_15hub_108" };
   }
 });
 
@@ -1227,7 +1227,7 @@ var init_IconButton_module = __esm({
     "use strict";
     init_react_import();
     init_css_module_data2();
-    IconButton_module_default = { "IconButton": "_IconButton_19x6h_1", "IconButton--active": "_IconButton--active_19x6h_15", "IconButton--disabled": "_IconButton--disabled_19x6h_26", "IconButton-title": "_IconButton-title_19x6h_39" };
+    IconButton_module_default = { "IconButton": "_IconButton_3u943_1", "IconButton--active": "_IconButton--active_3u943_15", "IconButton--disabled": "_IconButton--disabled_3u943_26", "IconButton-title": "_IconButton-title_3u943_39" };
   }
 });
 
@@ -1846,12 +1846,14 @@ function insertAction(state, action, appStore) {
   const componentConfig = appStore.config.components[action.componentType];
   const isGlobalType = (componentConfig == null ? void 0 : componentConfig.global) === true;
   const defaultProps = (componentConfig == null ? void 0 : componentConfig.defaultProps) || {};
+  const sourceData = action.data ? __spreadProps(__spreadValues({}, action.data), { props: __spreadProps(__spreadValues({}, action.data.props), { id }) }) : __spreadValues({
+    type: action.componentType,
+    props: __spreadProps(__spreadValues({}, defaultProps), { id })
+  }, isGlobalType ? { synced: true } : {});
   const emptyComponentData = populateIds(
-    __spreadValues({
-      type: action.componentType,
-      props: __spreadProps(__spreadValues({}, defaultProps), { id })
-    }, isGlobalType ? { synced: true } : {}),
-    appStore.config
+    sourceData,
+    appStore.config,
+    !!action.data
   );
   const [parentId] = action.destinationZone.split(":");
   const idsInPath = getIdsForParent(action.destinationZone, state);
@@ -3710,7 +3712,7 @@ var init_styles_module3 = __esm({
     "use strict";
     init_react_import();
     init_css_module_data4();
-    styles_module_default10 = { "RichTextMenu": "_RichTextMenu_7muaf_1", "RichTextMenu--form": "_RichTextMenu--form_7muaf_7", "RichTextMenu-group": "_RichTextMenu-group_7muaf_17", "RichTextMenu--inline": "_RichTextMenu--inline_7muaf_35" };
+    styles_module_default10 = { "RichTextMenu": "_RichTextMenu_1l3cr_1", "RichTextMenu--form": "_RichTextMenu--form_1l3cr_7", "RichTextMenu-group": "_RichTextMenu-group_1l3cr_17", "RichTextMenu--inline": "_RichTextMenu--inline_1l3cr_35" };
   }
 });
 
@@ -3921,7 +3923,7 @@ var init_styles_module5 = __esm({
     "use strict";
     init_react_import();
     init_css_module_data6();
-    styles_module_default12 = { "Select": "_Select_6nen1_1", "Select-button": "_Select-button_6nen1_6", "Select--hasOptions": "_Select--hasOptions_6nen1_21", "Select--disabled": "_Select--disabled_6nen1_25", "Select-buttonIcon": "_Select-buttonIcon_6nen1_29", "Select--standalone": "_Select--standalone_6nen1_35", "Select--actionBar": "_Select--actionBar_6nen1_40", "Select--hasValue": "_Select--hasValue_6nen1_46", "Select-items": "_Select-items_6nen1_63", "SelectItem": "_SelectItem_6nen1_75", "SelectItem--isSelected": "_SelectItem--isSelected_6nen1_92", "SelectItem-icon": "_SelectItem-icon_6nen1_98" };
+    styles_module_default12 = { "Select": "_Select_1hzg4_1", "Select-button": "_Select-button_1hzg4_6", "Select--hasOptions": "_Select--hasOptions_1hzg4_21", "Select--disabled": "_Select--disabled_1hzg4_25", "Select-buttonIcon": "_Select-buttonIcon_1hzg4_29", "Select--standalone": "_Select--standalone_1hzg4_35", "Select--actionBar": "_Select--actionBar_1hzg4_40", "Select--hasValue": "_Select--hasValue_1hzg4_46", "Select-items": "_Select-items_1hzg4_63", "SelectItem": "_SelectItem_1hzg4_75", "SelectItem--isSelected": "_SelectItem--isSelected_1hzg4_92", "SelectItem-icon": "_SelectItem-icon_1hzg4_98" };
   }
 });
 
@@ -4895,7 +4897,7 @@ var init_styles_module6 = __esm({
     "use strict";
     init_react_import();
     init_css_module_data7();
-    styles_module_default13 = { "RichTextEditor": "_RichTextEditor_1grt5_1", "RichTextEditor--editor": "_RichTextEditor--editor_1grt5_50", "RichTextEditor--disabled": "_RichTextEditor--disabled_1grt5_109", "RichTextEditor--isActive": "_RichTextEditor--isActive_1grt5_113", "RichTextEditor-menu": "_RichTextEditor-menu_1grt5_119" };
+    styles_module_default13 = { "RichTextEditor": "_RichTextEditor_150ed_1", "RichTextEditor--editor": "_RichTextEditor--editor_150ed_50", "RichTextEditor--disabled": "_RichTextEditor--disabled_150ed_109", "RichTextEditor--isActive": "_RichTextEditor--isActive_150ed_113", "RichTextEditor-menu": "_RichTextEditor-menu_150ed_119" };
   }
 });
 
@@ -5449,7 +5451,6 @@ __export(no_external_exports, {
   Button: () => Button,
   ComponentList: () => ComponentList,
   Drawer: () => Drawer,
-  DropZone: () => DropZone,
   Editor: () => Editor4,
   FieldLabel: () => FieldLabel,
   Group: () => Group,
@@ -5473,6 +5474,7 @@ __export(no_external_exports, {
   transformProps: () => transformProps,
   useEditor: () => useEditor2,
   useGetEditor: () => useGetEditor,
+  usePropsContext: () => usePropsContext,
   walkTree: () => walkTree
 });
 module.exports = __toCommonJS(no_external_exports);
@@ -5544,7 +5546,7 @@ init_get_class_name_factory();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/AutoField/styles.module.css#css-module
 init_react_import();
-var styles_module_default2 = { "InputWrapper": "_InputWrapper_yqqgz_1", "Input-label": "_Input-label_yqqgz_5", "Input-labelIcon": "_Input-labelIcon_yqqgz_15", "Input-disabledIcon": "_Input-disabledIcon_yqqgz_22", "Input-input": "_Input-input_yqqgz_27", "Input": "_Input_yqqgz_1", "Input--readOnly": "_Input--readOnly_yqqgz_87", "Input-radioGroupItems": "_Input-radioGroupItems_yqqgz_98", "Input-radio": "_Input-radio_yqqgz_98", "Input-radioInner": "_Input-radioInner_yqqgz_115", "Input-radioInput": "_Input-radioInput_yqqgz_147" };
+var styles_module_default2 = { "InputWrapper": "_InputWrapper_1hd99_1", "Input-label": "_Input-label_1hd99_5", "Input-labelIcon": "_Input-labelIcon_1hd99_15", "Input-disabledIcon": "_Input-disabledIcon_1hd99_22", "Input-input": "_Input-input_1hd99_27", "Input": "_Input_1hd99_1", "Input--readOnly": "_Input--readOnly_1hd99_87", "Input-radioGroupItems": "_Input-radioGroupItems_1hd99_98", "Input-radio": "_Input-radio_1hd99_98", "Input-radioInner": "_Input-radioInner_1hd99_115", "Input-radioInput": "_Input-radioInput_1hd99_147" };
 
 // components/AutoField/index.tsx
 var import_react48 = require("react");
@@ -5558,7 +5560,7 @@ init_get_class_name_factory();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/AutoField/fields/ArrayField/styles.module.css#css-module
 init_react_import();
-var styles_module_default3 = { "ArrayField": "_ArrayField_13xcf_5", "ArrayField--isDraggingFrom": "_ArrayField--isDraggingFrom_13xcf_14", "ArrayField-addButton": "_ArrayField-addButton_13xcf_19", "ArrayField--hasItems": "_ArrayField--hasItems_13xcf_35", "ArrayField-inner": "_ArrayField-inner_13xcf_61", "ArrayFieldItem": "_ArrayFieldItem_13xcf_69", "ArrayFieldItem--isDragging": "_ArrayFieldItem--isDragging_13xcf_78", "ArrayFieldItem--isExpanded": "_ArrayFieldItem--isExpanded_13xcf_82", "ArrayFieldItem-summary": "_ArrayFieldItem-summary_13xcf_97", "ArrayFieldItem--noFields": "_ArrayFieldItem--noFields_13xcf_118", "ArrayFieldItem-body": "_ArrayFieldItem-body_13xcf_147", "ArrayFieldItem-fieldset": "_ArrayFieldItem-fieldset_13xcf_156", "ArrayFieldItem-rhs": "_ArrayFieldItem-rhs_13xcf_164", "ArrayFieldItem-actions": "_ArrayFieldItem-actions_13xcf_170" };
+var styles_module_default3 = { "ArrayField": "_ArrayField_1tth0_5", "ArrayField--isDraggingFrom": "_ArrayField--isDraggingFrom_1tth0_14", "ArrayField-addButton": "_ArrayField-addButton_1tth0_19", "ArrayField--hasItems": "_ArrayField--hasItems_1tth0_35", "ArrayField-inner": "_ArrayField-inner_1tth0_61", "ArrayFieldItem": "_ArrayFieldItem_1tth0_69", "ArrayFieldItem--isDragging": "_ArrayFieldItem--isDragging_1tth0_78", "ArrayFieldItem--isExpanded": "_ArrayFieldItem--isExpanded_1tth0_82", "ArrayFieldItem-summary": "_ArrayFieldItem-summary_1tth0_97", "ArrayFieldItem--noFields": "_ArrayFieldItem--noFields_1tth0_118", "ArrayFieldItem-body": "_ArrayFieldItem-body_1tth0_147", "ArrayFieldItem-fieldset": "_ArrayFieldItem-fieldset_1tth0_156", "ArrayFieldItem-rhs": "_ArrayFieldItem-rhs_1tth0_164", "ArrayFieldItem-actions": "_ArrayFieldItem-actions_1tth0_170" };
 
 // components/AutoField/fields/ArrayField/index.tsx
 init_lucide_react();
@@ -5625,7 +5627,7 @@ init_lib();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/DragIcon/styles.module.css#css-module
 init_react_import();
-var styles_module_default5 = { "DragIcon": "_DragIcon_53afe_1", "DragIcon--disabled": "_DragIcon--disabled_53afe_8" };
+var styles_module_default5 = { "DragIcon": "_DragIcon_eapcz_1", "DragIcon--disabled": "_DragIcon--disabled_eapcz_8" };
 
 // components/DragIcon/index.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
@@ -6672,7 +6674,7 @@ var import_react21 = require("react");
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/ExternalInput/styles.module.css#css-module
 init_react_import();
-var styles_module_default6 = { "ExternalInput-actions": "_ExternalInput-actions_3fhqq_1", "ExternalInput-button": "_ExternalInput-button_3fhqq_5", "ExternalInput--dataSelected": "_ExternalInput--dataSelected_3fhqq_25", "ExternalInput--readOnly": "_ExternalInput--readOnly_3fhqq_32", "ExternalInput-detachButton": "_ExternalInput-detachButton_3fhqq_36", "ExternalInput": "_ExternalInput_3fhqq_1", "ExternalInputModal": "_ExternalInputModal_3fhqq_82", "ExternalInputModal-grid": "_ExternalInputModal-grid_3fhqq_92", "ExternalInputModal--filtersToggled": "_ExternalInputModal--filtersToggled_3fhqq_103", "ExternalInputModal-filters": "_ExternalInputModal-filters_3fhqq_108", "ExternalInputModal-masthead": "_ExternalInputModal-masthead_3fhqq_127", "ExternalInputModal-tableWrapper": "_ExternalInputModal-tableWrapper_3fhqq_136", "ExternalInputModal-table": "_ExternalInputModal-table_3fhqq_136", "ExternalInputModal-thead": "_ExternalInputModal-thead_3fhqq_152", "ExternalInputModal-th": "_ExternalInputModal-th_3fhqq_152", "ExternalInputModal-td": "_ExternalInputModal-td_3fhqq_167", "ExternalInputModal-tr": "_ExternalInputModal-tr_3fhqq_172", "ExternalInputModal-tbody": "_ExternalInputModal-tbody_3fhqq_179", "ExternalInputModal--hasData": "_ExternalInputModal--hasData_3fhqq_205", "ExternalInputModal-loadingBanner": "_ExternalInputModal-loadingBanner_3fhqq_209", "ExternalInputModal--isLoading": "_ExternalInputModal--isLoading_3fhqq_226", "ExternalInputModal-searchForm": "_ExternalInputModal-searchForm_3fhqq_230", "ExternalInputModal-search": "_ExternalInputModal-search_3fhqq_230", "ExternalInputModal-searchIcon": "_ExternalInputModal-searchIcon_3fhqq_267", "ExternalInputModal-searchIconText": "_ExternalInputModal-searchIconText_3fhqq_292", "ExternalInputModal-searchInput": "_ExternalInputModal-searchInput_3fhqq_302", "ExternalInputModal-searchActions": "_ExternalInputModal-searchActions_3fhqq_316", "ExternalInputModal-searchActionIcon": "_ExternalInputModal-searchActionIcon_3fhqq_329", "ExternalInputModal-footerContainer": "_ExternalInputModal-footerContainer_3fhqq_333", "ExternalInputModal-footer": "_ExternalInputModal-footer_3fhqq_333", "ExternalInputModal-field": "_ExternalInputModal-field_3fhqq_346" };
+var styles_module_default6 = { "ExternalInput-actions": "_ExternalInput-actions_142hz_1", "ExternalInput-button": "_ExternalInput-button_142hz_5", "ExternalInput--dataSelected": "_ExternalInput--dataSelected_142hz_25", "ExternalInput--readOnly": "_ExternalInput--readOnly_142hz_32", "ExternalInput-detachButton": "_ExternalInput-detachButton_142hz_36", "ExternalInput": "_ExternalInput_142hz_1", "ExternalInputModal": "_ExternalInputModal_142hz_82", "ExternalInputModal-grid": "_ExternalInputModal-grid_142hz_92", "ExternalInputModal--filtersToggled": "_ExternalInputModal--filtersToggled_142hz_103", "ExternalInputModal-filters": "_ExternalInputModal-filters_142hz_108", "ExternalInputModal-masthead": "_ExternalInputModal-masthead_142hz_127", "ExternalInputModal-tableWrapper": "_ExternalInputModal-tableWrapper_142hz_136", "ExternalInputModal-table": "_ExternalInputModal-table_142hz_136", "ExternalInputModal-thead": "_ExternalInputModal-thead_142hz_152", "ExternalInputModal-th": "_ExternalInputModal-th_142hz_152", "ExternalInputModal-td": "_ExternalInputModal-td_142hz_167", "ExternalInputModal-tr": "_ExternalInputModal-tr_142hz_172", "ExternalInputModal-tbody": "_ExternalInputModal-tbody_142hz_179", "ExternalInputModal--hasData": "_ExternalInputModal--hasData_142hz_205", "ExternalInputModal-loadingBanner": "_ExternalInputModal-loadingBanner_142hz_209", "ExternalInputModal--isLoading": "_ExternalInputModal--isLoading_142hz_226", "ExternalInputModal-searchForm": "_ExternalInputModal-searchForm_142hz_230", "ExternalInputModal-search": "_ExternalInputModal-search_142hz_230", "ExternalInputModal-searchIcon": "_ExternalInputModal-searchIcon_142hz_267", "ExternalInputModal-searchIconText": "_ExternalInputModal-searchIconText_142hz_292", "ExternalInputModal-searchInput": "_ExternalInputModal-searchInput_142hz_302", "ExternalInputModal-searchActions": "_ExternalInputModal-searchActions_142hz_316", "ExternalInputModal-searchActionIcon": "_ExternalInputModal-searchActionIcon_142hz_329", "ExternalInputModal-footerContainer": "_ExternalInputModal-footerContainer_142hz_333", "ExternalInputModal-footer": "_ExternalInputModal-footer_142hz_333", "ExternalInputModal-field": "_ExternalInputModal-field_142hz_346" };
 
 // components/ExternalInput/index.tsx
 init_get_class_name_factory();
@@ -6685,7 +6687,7 @@ init_get_class_name_factory();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Modal/styles.module.css#css-module
 init_react_import();
-var styles_module_default7 = { "Modal": "_Modal_1qmqa_1", "Modal--isOpen": "_Modal--isOpen_1qmqa_15", "Modal-inner": "_Modal-inner_1qmqa_19" };
+var styles_module_default7 = { "Modal": "_Modal_vim19_1", "Modal--isOpen": "_Modal--isOpen_vim19_15", "Modal-inner": "_Modal-inner_vim19_19" };
 
 // components/Modal/index.tsx
 var import_react_dom = require("react-dom");
@@ -6721,7 +6723,7 @@ init_react_import();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Heading/styles.module.css#css-module
 init_react_import();
-var styles_module_default8 = { "Heading": "_Heading_crcfw_1", "Heading--xxxxl": "_Heading--xxxxl_crcfw_13", "Heading--xxxl": "_Heading--xxxl_crcfw_19", "Heading--xxl": "_Heading--xxl_crcfw_23", "Heading--xl": "_Heading--xl_crcfw_27", "Heading--l": "_Heading--l_crcfw_31", "Heading--m": "_Heading--m_crcfw_35", "Heading--s": "_Heading--s_crcfw_39", "Heading--xs": "_Heading--xs_crcfw_43" };
+var styles_module_default8 = { "Heading": "_Heading_1537i_1", "Heading--xxxxl": "_Heading--xxxxl_1537i_13", "Heading--xxxl": "_Heading--xxxl_1537i_19", "Heading--xxl": "_Heading--xxl_1537i_23", "Heading--xl": "_Heading--xl_1537i_27", "Heading--l": "_Heading--l_1537i_31", "Heading--m": "_Heading--m_1537i_35", "Heading--s": "_Heading--s_1537i_39", "Heading--xs": "_Heading--xs_1537i_43" };
 
 // components/Heading/index.tsx
 init_get_class_name_factory();
@@ -6752,7 +6754,7 @@ var import_react20 = require("react");
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Button/Button.module.css#css-module
 init_react_import();
-var Button_module_default = { "Button": "_Button_1g3xu_1", "Button--medium": "_Button--medium_1g3xu_31", "Button--large": "_Button--large_1g3xu_39", "Button-icon": "_Button-icon_1g3xu_46", "Button--primary": "_Button--primary_1g3xu_50", "Button--secondary": "_Button--secondary_1g3xu_71", "Button--flush": "_Button--flush_1g3xu_88", "Button--disabled": "_Button--disabled_1g3xu_92", "Button--fullWidth": "_Button--fullWidth_1g3xu_100", "Button-spinner": "_Button-spinner_1g3xu_105" };
+var Button_module_default = { "Button": "_Button_rj9nn_1", "Button--medium": "_Button--medium_rj9nn_31", "Button--large": "_Button--large_rj9nn_39", "Button-icon": "_Button-icon_rj9nn_46", "Button--primary": "_Button--primary_rj9nn_50", "Button--secondary": "_Button--secondary_rj9nn_71", "Button--flush": "_Button--flush_rj9nn_88", "Button--disabled": "_Button--disabled_rj9nn_92", "Button--fullWidth": "_Button--fullWidth_rj9nn_100", "Button-spinner": "_Button-spinner_rj9nn_105" };
 
 // components/Button/Button.tsx
 init_get_class_name_factory();
@@ -7190,11 +7192,11 @@ init_lib();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/ui/Select/styles.module.css#css-module
 init_react_import();
-var styles_module_default9 = { "FeSelect-trigger": "_FeSelect-trigger_13era_3", "FeSelect-triggerIcon": "_FeSelect-triggerIcon_13era_54", "FeSelect-content": "_FeSelect-content_13era_61", "FeSelect-viewport": "_FeSelect-viewport_13era_84", "FeSelect-item": "_FeSelect-item_13era_93", "FeSelect-itemIndicator": "_FeSelect-itemIndicator_13era_119", "FeSelect-group": "_FeSelect-group_13era_131", "FeSelect-label": "_FeSelect-label_13era_135", "FeSelect-separator": "_FeSelect-separator_13era_144", "FeSelect-scrollButton": "_FeSelect-scrollButton_13era_152" };
+var styles_module_default9 = { "EditorSelect-trigger": "_EditorSelect-trigger_13s1k_3", "EditorSelect-triggerIcon": "_EditorSelect-triggerIcon_13s1k_54", "EditorSelect-content": "_EditorSelect-content_13s1k_61", "EditorSelect-viewport": "_EditorSelect-viewport_13s1k_84", "EditorSelect-item": "_EditorSelect-item_13s1k_93", "EditorSelect-itemIndicator": "_EditorSelect-itemIndicator_13s1k_119", "EditorSelect-group": "_EditorSelect-group_13s1k_131", "EditorSelect-label": "_EditorSelect-label_13s1k_135", "EditorSelect-separator": "_EditorSelect-separator_13s1k_144", "EditorSelect-scrollButton": "_EditorSelect-scrollButton_13s1k_152" };
 
 // components/ui/Select/index.tsx
 var import_jsx_runtime17 = require("react/jsx-runtime");
-var getClassName12 = get_class_name_factory_default("FeSelect", styles_module_default9);
+var getClassName12 = get_class_name_factory_default("EditorSelect", styles_module_default9);
 var joinClassNames = (...values) => values.filter(Boolean).join(" ");
 function Select(_a) {
   var props = __objRest(_a, []);
@@ -7482,7 +7484,7 @@ init_get_class_name_factory();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/AutoField/fields/ObjectField/styles.module.css#css-module
 init_react_import();
-var styles_module_default14 = { "ObjectField": "_ObjectField_1o8gv_5", "ObjectField-fieldset": "_ObjectField-fieldset_1o8gv_13" };
+var styles_module_default14 = { "ObjectField": "_ObjectField_1byjv_5", "ObjectField-fieldset": "_ObjectField-fieldset_1byjv_13" };
 
 // components/AutoField/fields/ObjectField/index.tsx
 init_store();
@@ -7801,7 +7803,7 @@ init_react_import();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/ComponentList/styles.module.css#css-module
 init_react_import();
-var styles_module_default15 = { "ComponentList": "_ComponentList_apsvr_1", "ComponentList--isExpanded": "_ComponentList--isExpanded_apsvr_5", "ComponentList-content": "_ComponentList-content_apsvr_9", "ComponentList-title": "_ComponentList-title_apsvr_17", "ComponentList-titleIcon": "_ComponentList-titleIcon_apsvr_54" };
+var styles_module_default15 = { "ComponentList": "_ComponentList_1mlcu_1", "ComponentList--isExpanded": "_ComponentList--isExpanded_1mlcu_5", "ComponentList-content": "_ComponentList-content_1mlcu_9", "ComponentList-title": "_ComponentList-title_1mlcu_17", "ComponentList-titleIcon": "_ComponentList-titleIcon_1mlcu_54" };
 
 // components/ComponentList/index.tsx
 init_get_class_name_factory();
@@ -7814,7 +7816,7 @@ init_react_import();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Drawer/styles.module.css#css-module
 init_react_import();
-var styles_module_default16 = { "Drawer": "_Drawer_rcm43_1", "Drawer--tile": "_Drawer--tile_rcm43_8", "Drawer-draggable": "_Drawer-draggable_rcm43_19", "Drawer-draggableBg": "_Drawer-draggableBg_rcm43_23", "DrawerItem-draggable": "_DrawerItem-draggable_rcm43_33", "DrawerItem-icon": "_DrawerItem-icon_rcm43_50", "DrawerItem--disabled": "_DrawerItem--disabled_rcm43_56", "DrawerItem": "_DrawerItem_rcm43_33", "Drawer--isDraggingFrom": "_Drawer--isDraggingFrom_rcm43_66", "DrawerItem-name": "_DrawerItem-name_rcm43_91" };
+var styles_module_default16 = { "Drawer": "_Drawer_146py_1", "Drawer--tile": "_Drawer--tile_146py_8", "Drawer-draggable": "_Drawer-draggable_146py_19", "Drawer-draggableBg": "_Drawer-draggableBg_146py_23", "DrawerItem-draggable": "_DrawerItem-draggable_146py_33", "DrawerItem-icon": "_DrawerItem-icon_146py_50", "DrawerItem--disabled": "_DrawerItem--disabled_146py_56", "DrawerItem": "_DrawerItem_146py_33", "Drawer--isDraggingFrom": "_Drawer--isDraggingFrom_146py_66", "DrawerItem-name": "_DrawerItem-name_146py_91" };
 
 // components/Drawer/index.tsx
 init_get_class_name_factory();
@@ -7838,7 +7840,7 @@ var import_react51 = require("react");
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/DraggableComponent/styles.module.css#css-module
 init_react_import();
-var styles_module_default17 = { "DraggableComponent": "_DraggableComponent_d90mv_1", "DraggableComponent-overlayWrapper": "_DraggableComponent-overlayWrapper_d90mv_12", "DraggableComponent-overlay": "_DraggableComponent-overlay_d90mv_12", "DraggableComponent-loadingOverlay": "_DraggableComponent-loadingOverlay_d90mv_36", "DraggableComponent--hover": "_DraggableComponent--hover_d90mv_53", "DraggableComponent--isSelected": "_DraggableComponent--isSelected_d90mv_60", "DraggableComponent--isGlobal": "_DraggableComponent--isGlobal_d90mv_69", "DraggableComponent-actionsOverlay": "_DraggableComponent-actionsOverlay_d90mv_105", "DraggableComponent-actions": "_DraggableComponent-actions_d90mv_105" };
+var styles_module_default17 = { "DraggableComponent": "_DraggableComponent_ie0on_1", "DraggableComponent-overlayWrapper": "_DraggableComponent-overlayWrapper_ie0on_12", "DraggableComponent-overlay": "_DraggableComponent-overlay_ie0on_12", "DraggableComponent-loadingOverlay": "_DraggableComponent-loadingOverlay_ie0on_36", "DraggableComponent--hover": "_DraggableComponent--hover_ie0on_53", "DraggableComponent--isSelected": "_DraggableComponent--isSelected_ie0on_60", "DraggableComponent--isGlobal": "_DraggableComponent--isGlobal_ie0on_69", "DraggableComponent-actionsOverlay": "_DraggableComponent-actionsOverlay_ie0on_105", "DraggableComponent-actions": "_DraggableComponent-actions_ie0on_105" };
 
 // components/DraggableComponent/index.tsx
 init_get_class_name_factory();
@@ -8587,7 +8589,7 @@ init_lib();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/DropZone/styles.module.css#css-module
 init_react_import();
-var styles_module_default18 = { "DropZone": "_DropZone_q9qsx_1", "DropZone--hasChildren": "_DropZone--hasChildren_q9qsx_11", "DropZone--isAreaSelected": "_DropZone--isAreaSelected_q9qsx_24", "DropZone--hoveringOverArea": "_DropZone--hoveringOverArea_q9qsx_25", "DropZone--isRootZone": "_DropZone--isRootZone_q9qsx_25", "DropZone--isDestination": "_DropZone--isDestination_q9qsx_39", "DropZone-item": "_DropZone-item_q9qsx_48", "DropZone-hitbox": "_DropZone-hitbox_q9qsx_52", "DropZone--isEnabled": "_DropZone--isEnabled_q9qsx_60", "DropZone--isAnimating": "_DropZone--isAnimating_q9qsx_70" };
+var styles_module_default18 = { "DropZone": "_DropZone_1h108_1", "DropZone--hasChildren": "_DropZone--hasChildren_1h108_11", "DropZone--isAreaSelected": "_DropZone--isAreaSelected_1h108_24", "DropZone--hoveringOverArea": "_DropZone--hoveringOverArea_1h108_25", "DropZone--isRootZone": "_DropZone--isRootZone_1h108_25", "DropZone--isDestination": "_DropZone--isDestination_1h108_39", "DropZone-item": "_DropZone-item_1h108_48", "DropZone-hitbox": "_DropZone-hitbox_1h108_52", "DropZone--isEnabled": "_DropZone--isEnabled_1h108_60", "DropZone--isAnimating": "_DropZone--isAnimating_1h108_70" };
 
 // components/DropZone/index.tsx
 init_store();
@@ -11274,7 +11276,7 @@ init_IconButton2();
 
 // components/Editor/index.tsx
 init_react_import();
-var import_react92 = require("react");
+var import_react94 = require("react");
 init_store();
 
 // components/Editor/components/Fields/index.tsx
@@ -11285,7 +11287,7 @@ init_store();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Fields/styles.module.css#css-module
 init_react_import();
-var styles_module_default20 = { "EditorFields": "_EditorFields_1di93_1", "EditorFields--isLoading": "_EditorFields--isLoading_1di93_6", "EditorFields-loadingOverlay": "_EditorFields-loadingOverlay_1di93_10", "EditorFields-loadingOverlayInner": "_EditorFields-loadingOverlayInner_1di93_25", "EditorFields-field": "_EditorFields-field_1di93_32", "EditorFields--wrapFields": "_EditorFields--wrapFields_1di93_36", "EditorFields-syncButton": "_EditorFields-syncButton_1di93_46", "EditorFields-syncButton--unlinked": "_EditorFields-syncButton--unlinked_1di93_78" };
+var styles_module_default20 = { "EditorFields": "_EditorFields_3dnua_1", "EditorFields--isLoading": "_EditorFields--isLoading_3dnua_6", "EditorFields-loadingOverlay": "_EditorFields-loadingOverlay_3dnua_10", "EditorFields-loadingOverlayInner": "_EditorFields-loadingOverlayInner_3dnua_25", "EditorFields-field": "_EditorFields-field_3dnua_32", "EditorFields--wrapFields": "_EditorFields--wrapFields_3dnua_36", "EditorFields-syncButton": "_EditorFields-syncButton_3dnua_46", "EditorFields-syncButton--unlinked": "_EditorFields-syncButton--unlinked_3dnua_78" };
 
 // components/Editor/components/Fields/index.tsx
 init_lib();
@@ -11486,7 +11488,7 @@ init_lucide_react();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Components/styles.module.css#css-module
 init_react_import();
-var styles_module_default21 = { "Components-search": "_Components-search_4hb2y_1", "Components-searchIcon": "_Components-searchIcon_4hb2y_8", "Components-searchInput": "_Components-searchInput_4hb2y_16", "Components-empty": "_Components-empty_4hb2y_39" };
+var styles_module_default21 = { "Components-search": "_Components-search_recer_1", "Components-searchIcon": "_Components-searchIcon_recer_8", "Components-searchInput": "_Components-searchInput_recer_16", "Components-empty": "_Components-empty_recer_39" };
 
 // components/Editor/components/Components/index.tsx
 init_get_class_name_factory();
@@ -11990,7 +11992,7 @@ init_react_import();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/LayerTree/styles.module.css#css-module
 init_react_import();
-var styles_module_default23 = { "LayerTree": "_LayerTree_1wyf0_1", "LayerTree-zoneTitle": "_LayerTree-zoneTitle_1wyf0_11", "LayerTree-helper": "_LayerTree-helper_1wyf0_17", "Layer": "_Layer_1wyf0_1", "Layer-inner": "_Layer-inner_1wyf0_34", "Layer--containsZone": "_Layer--containsZone_1wyf0_42", "Layer-clickable": "_Layer-clickable_1wyf0_46", "Layer--isSelected": "_Layer--isSelected_1wyf0_68", "Layer-icon": "_Layer-icon_1wyf0_80", "Layer-zoneIcon": "_Layer-zoneIcon_1wyf0_81", "Layer-chevron": "_Layer-chevron_1wyf0_85", "Layer--childIsSelected": "_Layer--childIsSelected_1wyf0_97", "Layer-zones": "_Layer-zones_1wyf0_101", "Layer-title": "_Layer-title_1wyf0_117", "Layer-name": "_Layer-name_1wyf0_130", "Layer--isGlobal": "_Layer--isGlobal_1wyf0_150", "Layer--isUnlinked": "_Layer--isUnlinked_1wyf0_171", "Layer-unlinkedGlyph": "_Layer-unlinkedGlyph_1wyf0_175" };
+var styles_module_default23 = { "LayerTree": "_LayerTree_3eixb_1", "LayerTree-zoneTitle": "_LayerTree-zoneTitle_3eixb_11", "LayerTree-helper": "_LayerTree-helper_3eixb_17", "Layer": "_Layer_3eixb_1", "Layer-inner": "_Layer-inner_3eixb_34", "Layer--containsZone": "_Layer--containsZone_3eixb_42", "Layer-clickable": "_Layer-clickable_3eixb_46", "Layer--isSelected": "_Layer--isSelected_3eixb_68", "Layer-icon": "_Layer-icon_3eixb_80", "Layer-zoneIcon": "_Layer-zoneIcon_3eixb_81", "Layer-chevron": "_Layer-chevron_3eixb_85", "Layer--childIsSelected": "_Layer--childIsSelected_3eixb_97", "Layer-zones": "_Layer-zones_3eixb_101", "Layer-title": "_Layer-title_3eixb_117", "Layer-name": "_Layer-name_3eixb_130", "Layer--isGlobal": "_Layer--isGlobal_3eixb_150", "Layer--isUnlinked": "_Layer--isUnlinked_3eixb_171", "Layer-unlinkedGlyph": "_Layer-unlinkedGlyph_3eixb_175" };
 
 // components/LayerTree/index.tsx
 init_get_class_name_factory();
@@ -12555,8 +12557,134 @@ function resolveDataBySelector(selector, getState, trigger) {
   });
 }
 
+// lib/editor-commands.ts
+init_react_import();
+init_get_item();
+init_generate_id();
+init_root_droppable_id();
+var parentToZone = (parent) => parent ? `${parent.id}:${parent.slot}` : rootDroppableId;
+var createEditorCommands = (appStore) => {
+  const { getState } = appStore;
+  const getZoneLength = (zone) => {
+    var _a, _b;
+    return (_b = (_a = getState().state.indexes.zones[zone]) == null ? void 0 : _a.contentIds.length) != null ? _b : 0;
+  };
+  const insertComponent2 = ({
+    type,
+    parent,
+    index,
+    data,
+    select = true
+  }) => {
+    var _a;
+    const id = (_a = data == null ? void 0 : data.props.id) != null ? _a : generateId(type);
+    const zone = parentToZone(parent);
+    const destIndex = index != null ? index : getZoneLength(zone);
+    const dispatch = getState().dispatch;
+    dispatch(__spreadValues({
+      type: "insert",
+      componentType: type,
+      destinationIndex: destIndex,
+      destinationZone: zone,
+      id
+    }, data ? { data: __spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { id }) }) } : {}));
+    if (select) {
+      dispatch({
+        type: "setUi",
+        ui: { itemSelector: { index: destIndex, zone } }
+      });
+    }
+    return { id };
+  };
+  const removeComponent = (id) => {
+    const sel = getSelectorForId(getState().state, id);
+    if (!(sel == null ? void 0 : sel.zone)) return;
+    getState().dispatch({ type: "remove", index: sel.index, zone: sel.zone });
+  };
+  const duplicateComponent = (id) => {
+    const sel = getSelectorForId(getState().state, id);
+    if (!(sel == null ? void 0 : sel.zone)) return;
+    getState().dispatch({
+      type: "duplicate",
+      sourceIndex: sel.index,
+      sourceZone: sel.zone
+    });
+  };
+  const moveComponent2 = (id, to) => {
+    const sel = getSelectorForId(getState().state, id);
+    if (!(sel == null ? void 0 : sel.zone)) return;
+    getState().dispatch({
+      type: "move",
+      sourceIndex: sel.index,
+      sourceZone: sel.zone,
+      destinationIndex: to.index,
+      destinationZone: parentToZone(to.parent)
+    });
+  };
+  const replaceComponent = (id, data) => {
+    const sel = getSelectorForId(getState().state, id);
+    if (!(sel == null ? void 0 : sel.zone)) return;
+    const existing = getItem(sel, getState().state);
+    if (!existing) return;
+    getState().dispatch({
+      type: "replace",
+      destinationIndex: sel.index,
+      destinationZone: sel.zone,
+      data: __spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { id: existing.props.id }) })
+    });
+  };
+  const updateProps = (id, updater) => {
+    const sel = getSelectorForId(getState().state, id);
+    if (!sel) return;
+    const existing = getItem(sel, getState().state);
+    if (!existing) return;
+    const patch = typeof updater === "function" ? updater(existing.props) : updater;
+    getState().dispatch({
+      type: "replace",
+      destinationIndex: sel.index,
+      destinationZone: sel.zone,
+      data: __spreadProps(__spreadValues({}, existing), {
+        props: __spreadProps(__spreadValues(__spreadValues({}, existing.props), patch), { id: existing.props.id })
+      })
+    });
+  };
+  const updateRoot = (updater) => {
+    var _a, _b;
+    const root = (_a = getState().state.data.root) != null ? _a : { props: {} };
+    const prevProps = (_b = root.props) != null ? _b : {};
+    const patch = typeof updater === "function" ? updater(prevProps) : updater;
+    getState().dispatch({
+      type: "replaceRoot",
+      root: __spreadProps(__spreadValues({}, root), { props: __spreadValues(__spreadValues({}, prevProps), patch) })
+    });
+  };
+  const selectComponent = (id) => {
+    const dispatch = getState().dispatch;
+    if (id === null) {
+      dispatch({ type: "setUi", ui: { itemSelector: null } });
+      return;
+    }
+    const sel = getSelectorForId(getState().state, id);
+    if (!(sel == null ? void 0 : sel.zone)) return;
+    dispatch({
+      type: "setUi",
+      ui: { itemSelector: { index: sel.index, zone: sel.zone } }
+    });
+  };
+  return {
+    insertComponent: insertComponent2,
+    removeComponent,
+    duplicateComponent,
+    moveComponent: moveComponent2,
+    replaceComponent,
+    updateProps,
+    updateRoot,
+    selectComponent
+  };
+};
+
 // lib/use-editor.ts
-var generateUseEditor = (store, getState) => {
+var generateUseEditor = (store, getState, commands) => {
   const history = {
     back: store.history.back,
     forward: store.history.forward,
@@ -12567,7 +12695,7 @@ var generateUseEditor = (store, getState) => {
     histories: store.history.histories,
     index: store.history.index
   };
-  const storeData = {
+  const storeData = __spreadProps(__spreadValues({}, commands), {
     appState: makeStatePublic(store.state),
     config: store.config,
     dispatch: store.dispatch,
@@ -12588,7 +12716,7 @@ var generateUseEditor = (store, getState) => {
       if (!parentNode) return;
       return parentNode.data;
     }
-  };
+  });
   storeData.__private = {
     appState: store.state
   };
@@ -12608,11 +12736,13 @@ var convertToPickedStore = (store) => {
   };
 };
 var useRegisterUseEditorStore = (appStore) => {
+  const [commands] = (0, import_react81.useState)(() => createEditorCommands(appStore));
   const [useEditorStore] = (0, import_react81.useState)(
     () => (0, import_zustand7.createStore)(
       () => generateUseEditor(
         convertToPickedStore(appStore.getState()),
-        appStore.getState
+        appStore.getState,
+        commands
       )
     )
   );
@@ -12620,10 +12750,12 @@ var useRegisterUseEditorStore = (appStore) => {
     return appStore.subscribe(
       (store) => convertToPickedStore(store),
       (pickedStore) => {
-        useEditorStore.setState(generateUseEditor(pickedStore, appStore.getState));
+        useEditorStore.setState(
+          generateUseEditor(pickedStore, appStore.getState, commands)
+        );
       }
     );
-  }, []);
+  }, [commands]);
   return useEditorStore;
 };
 function createUseEditor() {
@@ -12708,12 +12840,12 @@ init_to_component();
 
 // components/Editor/components/Layout/index.tsx
 init_react_import();
-var import_react91 = require("react");
+var import_react93 = require("react");
 init_lib();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Layout/styles.module.css#css-module
 init_react_import();
-var styles_module_default24 = { "Editor": "_Editor_17yd6_19", "Editor-portal": "_Editor-portal_17yd6_32", "EditorLayout": "_EditorLayout_17yd6_37", "EditorLayout-inner": "_EditorLayout-inner_17yd6_41", "Editor--hidePlugins": "_Editor--hidePlugins_17yd6_73", "EditorLayout--mounted": "_EditorLayout--mounted_17yd6_78", "EditorLayout--mobilePanelHeightToggle": "_EditorLayout--mobilePanelHeightToggle_17yd6_82", "EditorLayout--leftSideBarVisible": "_EditorLayout--leftSideBarVisible_17yd6_82", "EditorLayout--mobilePanelCustomHeight": "_EditorLayout--mobilePanelCustomHeight_17yd6_87", "EditorLayout--mobilePanelHeightMinContent": "_EditorLayout--mobilePanelHeightMinContent_17yd6_105", "EditorLayout--rightSideBarVisible": "_EditorLayout--rightSideBarVisible_17yd6_127", "EditorLayout-mounted": "_EditorLayout-mounted_17yd6_146", "EditorLayout-nav": "_EditorLayout-nav_17yd6_187", "Editor-fieldSideBarToolbar": "_Editor-fieldSideBarToolbar_17yd6_203", "Editor-fieldSideBarHistory": "_Editor-fieldSideBarHistory_17yd6_213", "Editor-fieldSideBarActions": "_Editor-fieldSideBarActions_17yd6_219", "EditorLayout-mobilePanel": "_EditorLayout-mobilePanel_17yd6_225", "EditorLayout-mobilePanelContent": "_EditorLayout-mobilePanelContent_17yd6_245", "EditorLayout-mobileDragHandle": "_EditorLayout-mobileDragHandle_17yd6_252", "EditorLayout-mobileDragHandlePill": "_EditorLayout-mobileDragHandlePill_17yd6_266", "EditorPluginTab": "_EditorPluginTab_17yd6_273", "EditorPluginTab--visible": "_EditorPluginTab--visible_17yd6_279", "EditorPluginTab-body": "_EditorPluginTab-body_17yd6_284" };
+var styles_module_default24 = { "Editor": "_Editor_1ty8s_19", "Editor-portal": "_Editor-portal_1ty8s_32", "EditorLayout": "_EditorLayout_1ty8s_37", "EditorLayout-inner": "_EditorLayout-inner_1ty8s_41", "Editor--hidePlugins": "_Editor--hidePlugins_1ty8s_73", "EditorLayout--mounted": "_EditorLayout--mounted_1ty8s_78", "EditorLayout--mobilePanelHeightToggle": "_EditorLayout--mobilePanelHeightToggle_1ty8s_82", "EditorLayout--leftSideBarVisible": "_EditorLayout--leftSideBarVisible_1ty8s_82", "EditorLayout--mobilePanelCustomHeight": "_EditorLayout--mobilePanelCustomHeight_1ty8s_87", "EditorLayout--mobilePanelHeightMinContent": "_EditorLayout--mobilePanelHeightMinContent_1ty8s_105", "EditorLayout--rightSideBarVisible": "_EditorLayout--rightSideBarVisible_1ty8s_127", "EditorLayout-mounted": "_EditorLayout-mounted_1ty8s_146", "EditorLayout-nav": "_EditorLayout-nav_1ty8s_187", "Editor-fieldSideBarToolbar": "_Editor-fieldSideBarToolbar_1ty8s_203", "Editor-fieldSideBarHistory": "_Editor-fieldSideBarHistory_1ty8s_213", "Editor-fieldSideBarActions": "_Editor-fieldSideBarActions_1ty8s_219", "EditorLayout-mobilePanel": "_EditorLayout-mobilePanel_1ty8s_225", "EditorLayout-mobilePanelContent": "_EditorLayout-mobilePanelContent_1ty8s_245", "EditorLayout-mobileDragHandle": "_EditorLayout-mobileDragHandle_1ty8s_252", "EditorLayout-mobileDragHandlePill": "_EditorLayout-mobileDragHandlePill_1ty8s_266", "EditorPluginTab": "_EditorPluginTab_1ty8s_273", "EditorPluginTab--visible": "_EditorPluginTab--visible_1ty8s_279", "EditorPluginTab-body": "_EditorPluginTab-body_1ty8s_284" };
 
 // lib/use-inject-css.ts
 init_react_import();
@@ -12778,7 +12910,7 @@ init_react_import();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/SidebarSection/styles.module.css#css-module
 init_react_import();
-var styles_module_default25 = { "SidebarSection": "_SidebarSection_1jefg_1", "SidebarSection-title": "_SidebarSection-title_1jefg_12", "SidebarSection--noBorderTop": "_SidebarSection--noBorderTop_1jefg_20", "SidebarSection-content": "_SidebarSection-content_1jefg_24", "SidebarSection-breadcrumbLabel": "_SidebarSection-breadcrumbLabel_1jefg_33", "SidebarSection-breadcrumbs": "_SidebarSection-breadcrumbs_1jefg_62", "SidebarSection-breadcrumb": "_SidebarSection-breadcrumb_1jefg_33", "SidebarSection-heading": "_SidebarSection-heading_1jefg_74", "SidebarSection-loadingOverlay": "_SidebarSection-loadingOverlay_1jefg_88" };
+var styles_module_default25 = { "SidebarSection": "_SidebarSection_tt2oy_1", "SidebarSection-title": "_SidebarSection-title_tt2oy_12", "SidebarSection--noBorderTop": "_SidebarSection--noBorderTop_tt2oy_20", "SidebarSection-content": "_SidebarSection-content_tt2oy_24", "SidebarSection-breadcrumbLabel": "_SidebarSection-breadcrumbLabel_tt2oy_33", "SidebarSection-breadcrumbs": "_SidebarSection-breadcrumbs_tt2oy_62", "SidebarSection-breadcrumb": "_SidebarSection-breadcrumb_tt2oy_33", "SidebarSection-heading": "_SidebarSection-heading_tt2oy_74", "SidebarSection-loadingOverlay": "_SidebarSection-loadingOverlay_tt2oy_88" };
 
 // components/SidebarSection/index.tsx
 init_get_class_name_factory();
@@ -12789,7 +12921,7 @@ init_react_import();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Breadcrumbs/styles.module.css#css-module
 init_react_import();
-var styles_module_default26 = { "Breadcrumbs": "_Breadcrumbs_cvmoz_1", "Breadcrumbs-breadcrumb": "_Breadcrumbs-breadcrumb_cvmoz_10", "Breadcrumbs-breadcrumbLabel": "_Breadcrumbs-breadcrumbLabel_cvmoz_17" };
+var styles_module_default26 = { "Breadcrumbs": "_Breadcrumbs_1cjxk_1", "Breadcrumbs-breadcrumb": "_Breadcrumbs-breadcrumb_1cjxk_10", "Breadcrumbs-breadcrumbLabel": "_Breadcrumbs-breadcrumbLabel_1cjxk_17" };
 
 // components/Breadcrumbs/index.tsx
 init_get_class_name_factory();
@@ -12891,25 +13023,152 @@ var SidebarSection = ({
 // components/Editor/components/Canvas/index.tsx
 init_react_import();
 init_css_box_model_esm();
-var import_react87 = require("react");
+var import_react88 = require("react");
 init_lucide_react();
 init_store();
 
 // components/BrowserBar/index.tsx
 init_react_import();
 init_lucide_react();
-var import_react85 = require("react");
+var import_react86 = require("react");
 init_store();
 init_lib();
 init_IconButton2();
 
+// components/ui/Combobox/index.tsx
+init_react_import();
+var import_react85 = require("@base-ui/react");
+init_lucide_react();
+init_lib();
+
+// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/ui/Combobox/styles.module.css#css-module
+init_react_import();
+var styles_module_default27 = { "EditorCombobox-input": "_EditorCombobox-input_12a2a_4", "EditorCombobox-trigger": "_EditorCombobox-trigger_12a2a_21", "EditorCombobox-triggerIcon": "_EditorCombobox-triggerIcon_12a2a_42", "EditorCombobox-positioner": "_EditorCombobox-positioner_12a2a_46", "EditorCombobox-content": "_EditorCombobox-content_12a2a_50", "EditorCombobox-list": "_EditorCombobox-list_12a2a_65", "EditorCombobox-item": "_EditorCombobox-item_12a2a_71", "EditorCombobox-itemIndicator": "_EditorCombobox-itemIndicator_12a2a_97", "EditorCombobox-empty": "_EditorCombobox-empty_12a2a_110" };
+
+// components/ui/Combobox/index.tsx
+var import_jsx_runtime82 = require("react/jsx-runtime");
+var getClassName34 = get_class_name_factory_default("EditorCombobox", styles_module_default27);
+var join = (...values) => values.filter(Boolean).join(" ");
+var mergeClassName = (base, override) => {
+  if (!override) return base;
+  if (typeof override === "function") {
+    return (state) => join(base, override(state));
+  }
+  return join(base, override);
+};
+var Combobox = import_react85.Combobox.Root;
+function ComboboxInput(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+    import_react85.Combobox.Input,
+    __spreadValues({
+      "data-slot": "combobox-input",
+      className: mergeClassName(getClassName34("input"), className)
+    }, props)
+  );
+}
+function ComboboxContent(_a) {
+  var _b = _a, {
+    className,
+    side = "bottom",
+    sideOffset = 4,
+    align = "start",
+    alignOffset = 0,
+    children
+  } = _b, props = __objRest(_b, [
+    "className",
+    "side",
+    "sideOffset",
+    "align",
+    "alignOffset",
+    "children"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(import_react85.Combobox.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+    import_react85.Combobox.Positioner,
+    {
+      side,
+      sideOffset,
+      align,
+      alignOffset,
+      className: getClassName34("positioner"),
+      children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+        import_react85.Combobox.Popup,
+        __spreadProps(__spreadValues({
+          "data-slot": "combobox-content",
+          className: mergeClassName(getClassName34("content"), className)
+        }, props), {
+          children
+        })
+      )
+    }
+  ) });
+}
+function ComboboxList(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+    import_react85.Combobox.List,
+    __spreadValues({
+      "data-slot": "combobox-list",
+      className: mergeClassName(getClassName34("list"), className)
+    }, props)
+  );
+}
+function ComboboxItem(_a) {
+  var _b = _a, {
+    className,
+    children
+  } = _b, props = __objRest(_b, [
+    "className",
+    "children"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
+    import_react85.Combobox.Item,
+    __spreadProps(__spreadValues({
+      "data-slot": "combobox-item",
+      className: mergeClassName(getClassName34("item"), className)
+    }, props), {
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: getClassName34("itemIndicator"), children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(import_react85.Combobox.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Check, { size: 14 }) }) }),
+        children
+      ]
+    })
+  );
+}
+function ComboboxEmpty(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+    import_react85.Combobox.Empty,
+    __spreadValues({
+      "data-slot": "combobox-empty",
+      className: mergeClassName(getClassName34("empty"), className)
+    }, props)
+  );
+}
+
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/BrowserBar/styles.module.css#css-module
 init_react_import();
-var styles_module_default27 = { "BrowserBar": "_BrowserBar_oz0sq_1", "BrowserBar-urlTrigger": "_BrowserBar-urlTrigger_oz0sq_16", "BrowserBar-urlIcon": "_BrowserBar-urlIcon_oz0sq_47", "BrowserBar-urlText": "_BrowserBar-urlText_oz0sq_52", "BrowserBar-urlPath": "_BrowserBar-urlPath_oz0sq_64", "BrowserBar-urlTitle": "_BrowserBar-urlTitle_oz0sq_69", "BrowserBar-actions": "_BrowserBar-actions_oz0sq_82", "BrowserBar-deviceIcon": "_BrowserBar-deviceIcon_oz0sq_89" };
+var styles_module_default28 = { "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" };
 
 // components/BrowserBar/index.tsx
-var import_jsx_runtime82 = require("react/jsx-runtime");
-var getClassName34 = get_class_name_factory_default("BrowserBar", styles_module_default27);
+var import_jsx_runtime83 = require("react/jsx-runtime");
+var normalizeRoute = (raw) => {
+  const trimmed = raw.trim();
+  if (!trimmed) return trimmed;
+  return trimmed.startsWith("/") ? trimmed : `/${trimmed}`;
+};
+var getClassName35 = get_class_name_factory_default("BrowserBar", styles_module_default28);
 var DEVICE_VIEWPORTS = {
   desktop: { width: "100%", height: "auto", icon: "Monitor", label: "Desktop" },
   mobile: { width: 360, height: "auto", icon: "Smartphone", label: "Mobile" }
@@ -12917,7 +13176,6 @@ var DEVICE_VIEWPORTS = {
 var BrowserBar = ({
   onViewportChange
 }) => {
-  var _a;
   const { routes, currentPath, onRouteChange } = usePropsContext();
   const viewports = useAppStore((s) => s.state.ui.viewports);
   const dispatch = useAppStore((s) => s.dispatch);
@@ -12936,7 +13194,7 @@ var BrowserBar = ({
       }
     });
   };
-  const activeDevice = (0, import_react85.useMemo)(() => {
+  const activeDevice = (0, import_react86.useMemo)(() => {
     const w = viewports.current.width;
     if (typeof w === "number" && w <= 640) return "mobile";
     return "desktop";
@@ -12945,50 +13203,86 @@ var BrowserBar = ({
     onViewportChange == null ? void 0 : onViewportChange(DEVICE_VIEWPORTS[device]);
   };
   const showRoutePicker = !!routes && currentPath !== void 0 && !!onRouteChange;
-  const selectedTitle = (_a = routes == null ? void 0 : routes.find((r) => r.path === currentPath)) == null ? void 0 : _a.title;
-  return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: getClassName34(), children: [
-    showRoutePicker ? /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
-      Select,
+  const [inputValue, setInputValue] = (0, import_react86.useState)(currentPath != null ? currentPath : "");
+  const lastSyncedPath = (0, import_react86.useRef)(currentPath);
+  if (lastSyncedPath.current !== currentPath) {
+    lastSyncedPath.current = currentPath;
+    setInputValue(currentPath != null ? currentPath : "");
+  }
+  const submit = (raw) => {
+    const next = normalizeRoute(raw);
+    if (!next || next === currentPath) return;
+    void (onRouteChange == null ? void 0 : onRouteChange(next));
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: getClassName35(), children: [
+    showRoutePicker ? /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(
+      Combobox,
       {
+        items: routes.map((r) => r.path),
         value: currentPath,
         onValueChange: (next) => {
-          void (onRouteChange == null ? void 0 : onRouteChange(next));
+          if (typeof next === "string") submit(next);
         },
+        inputValue,
+        onInputValueChange: (next) => setInputValue(next),
+        autoHighlight: false,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(SelectTrigger, { className: getClassName34("urlTrigger"), children: [
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Globe, { className: getClassName34("urlIcon"), size: 14 }),
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("span", { className: getClassName34("urlText"), children: [
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: getClassName34("urlPath"), children: currentPath }),
-              selectedTitle ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: getClassName34("urlTitle"), children: selectedTitle }) : null
-            ] })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(SelectContent, { children: [
-            routes.some((r) => r.path === currentPath) ? null : /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SelectItem, { value: currentPath, children: currentPath }),
-            routes.map((route) => /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SelectItem, { value: route.path, children: route.title }, route.path))
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(
+            "form",
+            {
+              className: getClassName35("urlTrigger"),
+              onSubmit: (event) => {
+                event.preventDefault();
+                submit(inputValue);
+              },
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Globe, { className: getClassName35("urlIcon"), size: 14 }),
+                /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+                  ComboboxInput,
+                  {
+                    className: getClassName35("urlInput"),
+                    placeholder: "/",
+                    spellCheck: false,
+                    autoCorrect: "off",
+                    autoCapitalize: "off"
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(ComboboxContent, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(ComboboxEmpty, { children: "Press Enter to go to this path" }),
+            /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(ComboboxList, { children: (path) => {
+              const route = routes.find((r) => r.path === path);
+              return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(ComboboxItem, { value: path, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: getClassName35("itemPath"), children: path }),
+                (route == null ? void 0 : route.title) ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: getClassName35("itemTitle"), children: route.title }) : null
+              ] }, path);
+            } })
           ] })
         ]
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: getClassName34("urlTrigger"), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Globe, { className: getClassName34("urlIcon"), size: 14 }),
-      /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: getClassName34("urlText"), children: "/" })
+    ) : /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: getClassName35("urlTrigger"), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Globe, { className: getClassName35("urlIcon"), size: 14 }),
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: getClassName35("urlText"), children: "/" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: getClassName34("actions"), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: getClassName35("actions"), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
         IconButton,
         {
           type: "button",
           title: activeDevice === "desktop" ? "Switch to mobile viewport" : "Switch to desktop viewport",
           onClick: () => setDevice(activeDevice === "desktop" ? "mobile" : "desktop"),
-          children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: getClassName34("deviceIcon"), children: activeDevice === "desktop" ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Monitor, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Smartphone, { size: 16 }) })
+          children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: getClassName35("deviceIcon"), children: activeDevice === "desktop" ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Monitor, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Smartphone, { size: 16 }) })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
         IconButton,
         {
           type: "button",
           title: isFullScreen ? "Exit full screen" : "Enter full screen",
           onClick: toggleFullScreen,
-          children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: getClassName34("deviceIcon"), children: isFullScreen ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Minimize, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Maximize, { size: 16 }) })
+          children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: getClassName35("deviceIcon"), children: isFullScreen ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Minimize, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Maximize, { size: 16 }) })
         }
       )
     ] })
@@ -12997,7 +13291,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_default28 = { "EditorCanvas": "_EditorCanvas_k9klu_1", "EditorCanvas-controls": "_EditorCanvas-controls_k9klu_17", "EditorCanvas--fullScreen": "_EditorCanvas--fullScreen_k9klu_22", "EditorCanvas-inner": "_EditorCanvas-inner_k9klu_33", "EditorCanvas-rootColumn": "_EditorCanvas-rootColumn_k9klu_46", "EditorCanvas-root": "_EditorCanvas-root_k9klu_46", "EditorCanvas--ready": "_EditorCanvas--ready_k9klu_83", "EditorCanvas-loader": "_EditorCanvas-loader_k9klu_88", "EditorCanvas--showLoader": "_EditorCanvas--showLoader_k9klu_100", "EditorCanvas-browserBar": "_EditorCanvas-browserBar_k9klu_109", "EditorCanvas-zoomControls": "_EditorCanvas-zoomControls_k9klu_114" };
+var styles_module_default29 = { "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" };
 
 // components/Editor/components/Canvas/index.tsx
 init_lib();
@@ -13007,23 +13301,23 @@ var import_shallow9 = require("zustand/react/shallow");
 
 // lib/frame-context.tsx
 init_react_import();
-var import_react86 = require("react");
-var import_jsx_runtime83 = require("react/jsx-runtime");
-var FrameContext = (0, import_react86.createContext)(null);
+var import_react87 = require("react");
+var import_jsx_runtime84 = require("react/jsx-runtime");
+var FrameContext = (0, import_react87.createContext)(null);
 var FrameProvider = ({
   children
 }) => {
-  const frameRef = (0, import_react86.useRef)(null);
-  const value = (0, import_react86.useMemo)(
+  const frameRef = (0, import_react87.useRef)(null);
+  const value = (0, import_react87.useMemo)(
     () => ({
       frameRef
     }),
     []
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(FrameContext.Provider, { value, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(FrameContext.Provider, { value, children });
 };
 var useCanvasFrame = () => {
-  const context = (0, import_react86.useContext)(FrameContext);
+  const context = (0, import_react87.useContext)(FrameContext);
   if (context === null) {
     throw new Error("useCanvasFrame must be used within a FrameProvider");
   }
@@ -13032,8 +13326,8 @@ var useCanvasFrame = () => {
 
 // components/Editor/components/Canvas/index.tsx
 init_default_viewports();
-var import_jsx_runtime84 = require("react/jsx-runtime");
-var getClassName35 = get_class_name_factory_default("EditorCanvas", styles_module_default28);
+var import_jsx_runtime85 = require("react/jsx-runtime");
+var getClassName36 = get_class_name_factory_default("EditorCanvas", styles_module_default29);
 var ZOOM_STEP = 0.15;
 var MIN_ZOOM = 0.25;
 var MAX_ZOOM = 3;
@@ -13068,21 +13362,21 @@ var Canvas = () => {
     }))
   );
   const viewports = useAppStore((s) => s.state.ui.viewports);
-  const [canvasZoom, setCanvasZoom] = (0, import_react87.useState)(1);
+  const [canvasZoom, setCanvasZoom] = (0, import_react88.useState)(1);
   const zoomIn = () => setCanvasZoom((z) => Math.min(z + ZOOM_STEP, MAX_ZOOM));
   const zoomOut = () => setCanvasZoom((z) => Math.max(z - ZOOM_STEP, MIN_ZOOM));
   const resetZoom = () => setCanvasZoom(1);
-  const [showTransition, setShowTransition] = (0, import_react87.useState)(false);
-  const isResizingRef = (0, import_react87.useRef)(false);
-  const defaultRender = (0, import_react87.useMemo)(() => {
-    const EditorDefault = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_jsx_runtime84.Fragment, { children });
+  const [showTransition, setShowTransition] = (0, import_react88.useState)(false);
+  const isResizingRef = (0, import_react88.useRef)(false);
+  const defaultRender = (0, import_react88.useMemo)(() => {
+    const EditorDefault = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(import_jsx_runtime85.Fragment, { children });
     return EditorDefault;
   }, []);
-  const CustomPreview = (0, import_react87.useMemo)(
+  const CustomPreview = (0, import_react88.useMemo)(
     () => overrides.preview || defaultRender,
     [overrides]
   );
-  const getFrameDimensions = (0, import_react87.useCallback)(() => {
+  const getFrameDimensions = (0, import_react88.useCallback)(() => {
     if (frameRef.current) {
       const frame = frameRef.current;
       const box = getBox(frame);
@@ -13090,21 +13384,21 @@ var Canvas = () => {
     }
     return { width: 0, height: 0 };
   }, [frameRef]);
-  (0, import_react87.useEffect)(() => {
+  (0, import_react88.useEffect)(() => {
     const { height: frameHeight } = getFrameDimensions();
     if (viewports.current.height === "auto") {
       setZoomConfig(__spreadProps(__spreadValues({}, zoomConfig), { zoom: 1, rootHeight: frameHeight }));
     }
   }, [getFrameDimensions, setZoomConfig, viewports.current.height]);
-  const [showLoader, setShowLoader] = (0, import_react87.useState)(false);
-  (0, import_react87.useEffect)(() => {
+  const [showLoader, setShowLoader] = (0, import_react88.useState)(false);
+  (0, import_react88.useEffect)(() => {
     setTimeout(() => {
       setShowLoader(true);
     }, 500);
   }, []);
   const appStoreApi = useAppStoreApi();
-  const autoSelectingRef = (0, import_react87.useRef)(true);
-  const pickClosestViewport = (0, import_react87.useCallback)(() => {
+  const autoSelectingRef = (0, import_react88.useRef)(true);
+  const pickClosestViewport = (0, import_react88.useCallback)(() => {
     var _a2, _b2;
     if (typeof window === "undefined") return null;
     const viewportWidth = window.innerWidth;
@@ -13129,7 +13423,7 @@ var Canvas = () => {
     }
     return closestViewport;
   }, [viewportOptions, frameRef]);
-  (0, import_react87.useEffect)(() => {
+  (0, import_react88.useEffect)(() => {
     var _a2;
     if (typeof window === "undefined") return;
     if ((_a2 = uiProp == null ? void 0 : uiProp.viewports) == null ? void 0 : _a2.current) return;
@@ -13162,7 +13456,7 @@ var Canvas = () => {
     appStoreApi,
     (_a = uiProp == null ? void 0 : uiProp.viewports) == null ? void 0 : _a.current
   ]);
-  (0, import_react87.useEffect)(() => {
+  (0, import_react88.useEffect)(() => {
     var _a2;
     if (typeof window === "undefined") return;
     if (!iframe.enabled) return;
@@ -13197,10 +13491,10 @@ var Canvas = () => {
     appStoreApi,
     setUi
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
     "div",
     {
-      className: getClassName35({
+      className: getClassName36({
         ready: status === "READY" || !iframe.enabled || !iframe.waitForStyles,
         showLoader,
         fullScreen: fullScreenCanvas
@@ -13215,16 +13509,16 @@ var Canvas = () => {
           });
         }
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: getClassName35("inner"), ref: frameRef, children: [
-        !disableZoomControls && /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: getClassName35("zoomControls"), children: [
-          /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(IconButton, { type: "button", title: "Zoom out", onClick: zoomOut, children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Minus, { size: 14 }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(IconButton, { type: "button", title: "Reset zoom", onClick: resetZoom, children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(RotateCcw, { size: 14 }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(IconButton, { type: "button", title: "Zoom in", onClick: zoomIn, children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Plus, { size: 14 }) })
+      children: /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: getClassName36("inner"), ref: frameRef, children: [
+        !disableZoomControls && /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: getClassName36("zoomControls"), children: [
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(IconButton, { type: "button", title: "Zoom out", onClick: zoomOut, children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Minus, { size: 14 }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(IconButton, { type: "button", title: "Reset zoom", onClick: resetZoom, children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(RotateCcw, { size: 14 }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(IconButton, { type: "button", title: "Zoom in", onClick: zoomIn, children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Plus, { size: 14 }) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(
           "div",
           {
-            className: getClassName35("rootColumn"),
+            className: getClassName36("rootColumn"),
             style: {
               width: iframe.enabled ? viewports.current.width : "100%",
               transform: disableZoomControls ? void 0 : `scale(${canvasZoom})`,
@@ -13232,7 +13526,7 @@ var Canvas = () => {
               transition: showTransition ? `width ${TRANSITION_DURATION}ms ease-out, transform ${TRANSITION_DURATION}ms ease-out` : disableZoomControls ? void 0 : "transform 150ms ease-out"
             },
             children: [
-              iframe.enabled && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: getClassName35("browserBar"), children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+              iframe.enabled && /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("div", { className: getClassName36("browserBar"), children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
                 BrowserBar,
                 {
                   onViewportChange: (viewport) => {
@@ -13249,23 +13543,23 @@ var Canvas = () => {
                   }
                 }
               ) }),
-              /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
                 "div",
                 {
-                  className: getClassName35("root"),
+                  className: getClassName36("root"),
                   suppressHydrationWarning: true,
                   id: "editor-canvas-root",
                   onTransitionEnd: () => {
                     setShowTransition(false);
                     isResizingRef.current = false;
                   },
-                  children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(CustomPreview, { children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Preview2, {}) })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(CustomPreview, { children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Preview2, {}) })
                 }
               )
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: getClassName35("loader"), children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Loader, { size: 24 }) })
+        /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("div", { className: getClassName36("loader"), children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Loader, { size: 24 }) })
       ] })
     }
   );
@@ -13273,15 +13567,15 @@ var Canvas = () => {
 
 // lib/use-sidebar-resize.ts
 init_react_import();
-var import_react88 = require("react");
+var import_react89 = require("react");
 init_store();
 function useSidebarResize(position, dispatch) {
-  const [width, setWidth] = (0, import_react88.useState)(null);
-  const sidebarRef = (0, import_react88.useRef)(null);
+  const [width, setWidth] = (0, import_react89.useState)(null);
+  const sidebarRef = (0, import_react89.useRef)(null);
   const storeWidth = useAppStore(
     (s) => position === "left" ? s.state.ui.leftSideBarWidth : s.state.ui.rightSideBarWidth
   );
-  (0, import_react88.useEffect)(() => {
+  (0, import_react89.useEffect)(() => {
     if (typeof window !== "undefined" && !storeWidth) {
       try {
         const savedWidths = localStorage.getItem("editor-sidebar-widths");
@@ -13306,12 +13600,12 @@ function useSidebarResize(position, dispatch) {
       }
     }
   }, [dispatch, position, storeWidth]);
-  (0, import_react88.useEffect)(() => {
+  (0, import_react89.useEffect)(() => {
     if (storeWidth !== void 0) {
       setWidth(storeWidth);
     }
   }, [storeWidth]);
-  const handleResizeEnd = (0, import_react88.useCallback)(
+  const handleResizeEnd = (0, import_react89.useCallback)(
     (width2) => {
       dispatch({
         type: "setUi",
@@ -13358,27 +13652,27 @@ init_react_import();
 
 // components/Editor/components/ResizeHandle/index.tsx
 init_react_import();
-var import_react89 = require("react");
+var import_react90 = require("react");
 init_get_class_name_factory();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/ResizeHandle/styles.module.css#css-module
 init_react_import();
-var styles_module_default29 = { "ResizeHandle": "_ResizeHandle_s0ymy_2", "ResizeHandle--left": "_ResizeHandle--left_s0ymy_16", "ResizeHandle--right": "_ResizeHandle--right_s0ymy_20" };
+var styles_module_default30 = { "ResizeHandle": "_ResizeHandle_1u3rv_2", "ResizeHandle--left": "_ResizeHandle--left_1u3rv_16", "ResizeHandle--right": "_ResizeHandle--right_1u3rv_20" };
 
 // components/Editor/components/ResizeHandle/index.tsx
-var import_jsx_runtime85 = require("react/jsx-runtime");
-var getClassName36 = get_class_name_factory_default("ResizeHandle", styles_module_default29);
+var import_jsx_runtime86 = require("react/jsx-runtime");
+var getClassName37 = get_class_name_factory_default("ResizeHandle", styles_module_default30);
 var ResizeHandle = ({
   position,
   sidebarRef,
   onResize,
   onResizeEnd
 }) => {
-  const handleRef = (0, import_react89.useRef)(null);
-  const isDragging = (0, import_react89.useRef)(false);
-  const startX = (0, import_react89.useRef)(0);
-  const startWidth = (0, import_react89.useRef)(0);
-  const handleMouseMove = (0, import_react89.useCallback)(
+  const handleRef = (0, import_react90.useRef)(null);
+  const isDragging = (0, import_react90.useRef)(false);
+  const startX = (0, import_react90.useRef)(0);
+  const startWidth = (0, import_react90.useRef)(0);
+  const handleMouseMove = (0, import_react90.useCallback)(
     (e) => {
       if (!isDragging.current) return;
       const delta = e.clientX - startX.current;
@@ -13389,7 +13683,7 @@ var ResizeHandle = ({
     },
     [onResize, position]
   );
-  const handleMouseUp = (0, import_react89.useCallback)(() => {
+  const handleMouseUp = (0, import_react90.useCallback)(() => {
     var _a;
     if (!isDragging.current) return;
     isDragging.current = false;
@@ -13404,7 +13698,7 @@ var ResizeHandle = ({
     const finalWidth = ((_a = sidebarRef.current) == null ? void 0 : _a.getBoundingClientRect().width) || 0;
     onResizeEnd(finalWidth);
   }, [onResizeEnd]);
-  const handleMouseDown = (0, import_react89.useCallback)(
+  const handleMouseDown = (0, import_react90.useCallback)(
     (e) => {
       var _a;
       isDragging.current = true;
@@ -13422,11 +13716,11 @@ var ResizeHandle = ({
     },
     [position, handleMouseMove, handleMouseUp]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
     "div",
     {
       ref: handleRef,
-      className: getClassName36({ [position]: true }),
+      className: getClassName37({ [position]: true }),
       onMouseDown: handleMouseDown
     }
   );
@@ -13437,11 +13731,11 @@ init_get_class_name_factory();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Sidebar/styles.module.css#css-module
 init_react_import();
-var styles_module_default30 = { "Sidebar": "_Sidebar_6tp4l_1", "Sidebar--isVisible": "_Sidebar--isVisible_6tp4l_9", "Sidebar--left": "_Sidebar--left_6tp4l_13", "Sidebar--right": "_Sidebar--right_6tp4l_25", "Sidebar-resizeHandle": "_Sidebar-resizeHandle_6tp4l_37" };
+var styles_module_default31 = { "Sidebar": "_Sidebar_14k7q_1", "Sidebar--isVisible": "_Sidebar--isVisible_14k7q_9", "Sidebar--left": "_Sidebar--left_14k7q_13", "Sidebar--right": "_Sidebar--right_14k7q_25", "Sidebar-resizeHandle": "_Sidebar-resizeHandle_14k7q_37" };
 
 // components/Editor/components/Sidebar/index.tsx
-var import_jsx_runtime86 = require("react/jsx-runtime");
-var getClassName37 = get_class_name_factory_default("Sidebar", styles_module_default30);
+var import_jsx_runtime87 = require("react/jsx-runtime");
+var getClassName38 = get_class_name_factory_default("Sidebar", styles_module_default31);
 var Sidebar = ({
   position,
   sidebarRef,
@@ -13450,16 +13744,16 @@ var Sidebar = ({
   onResizeEnd,
   children
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(import_jsx_runtime86.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(import_jsx_runtime87.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
       "div",
       {
         ref: sidebarRef,
-        className: getClassName37({ [position]: true, isVisible }),
+        className: getClassName38({ [position]: true, isVisible }),
         children
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("div", { className: `${getClassName37("resizeHandle")}`, children: /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("div", { className: `${getClassName38("resizeHandle")}`, children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
       ResizeHandle,
       {
         position,
@@ -13473,9 +13767,12 @@ var Sidebar = ({
 
 // lib/use-delete-hotkeys.ts
 init_react_import();
-var import_react90 = require("react");
+var import_react91 = require("react");
 init_use_hotkey();
 init_store();
+
+// lib/should-block-editing-hotkey.ts
+init_react_import();
 var isElementVisible = (element) => {
   let current = element;
   while (current && current !== document.body) {
@@ -13487,7 +13784,7 @@ var isElementVisible = (element) => {
   }
   return true;
 };
-var shouldBlockDeleteHotkey = (e) => {
+var shouldBlockEditingHotkey = (e) => {
   var _a;
   if (e == null ? void 0 : e.defaultPrevented) return true;
   const origin = ((_a = e == null ? void 0 : e.composedPath) == null ? void 0 : _a.call(e)[0]) || (e == null ? void 0 : e.target) || document.activeElement;
@@ -13508,12 +13805,14 @@ var shouldBlockDeleteHotkey = (e) => {
   }
   return false;
 };
+
+// lib/use-delete-hotkeys.ts
 var useDeleteHotkeys = () => {
   const appStore = useAppStoreApi();
-  const deleteSelectedComponent = (0, import_react90.useCallback)(
+  const deleteSelectedComponent = (0, import_react91.useCallback)(
     (e) => {
       var _a;
-      if (shouldBlockDeleteHotkey(e)) {
+      if (shouldBlockEditingHotkey(e)) {
         return false;
       }
       const { state, dispatch, permissions, selectedItem } = appStore.getState();
@@ -13534,18 +13833,112 @@ var useDeleteHotkeys = () => {
   useHotkey({ backspace: true }, deleteSelectedComponent);
 };
 
+// lib/use-clipboard-hotkeys.ts
+init_react_import();
+var import_react92 = require("react");
+init_use_hotkey();
+init_store();
+var CLIPBOARD_MARKER = "reacteditor/component";
+var isComponentData = (value) => {
+  var _a;
+  if (!value || typeof value !== "object") return false;
+  const v = value;
+  return typeof v.type === "string" && typeof ((_a = v.props) == null ? void 0 : _a.id) === "string";
+};
+var parsePayload = (text) => {
+  try {
+    const parsed = JSON.parse(text);
+    if (parsed && typeof parsed === "object" && parsed.__reactEditor === CLIPBOARD_MARKER && isComponentData(parsed.data)) {
+      return parsed.data;
+    }
+  } catch (e) {
+  }
+  return null;
+};
+var useClipboardHotkeys = () => {
+  const appStore = useAppStoreApi();
+  const writeSelectionToClipboard = (0, import_react92.useCallback)(() => {
+    var _a;
+    const { selectedItem } = appStore.getState();
+    if (!selectedItem) return false;
+    const payload = {
+      __reactEditor: CLIPBOARD_MARKER,
+      data: selectedItem
+    };
+    (_a = navigator.clipboard) == null ? void 0 : _a.writeText(JSON.stringify(payload)).catch(() => {
+    });
+    return true;
+  }, [appStore]);
+  const copySelectedComponent = (0, import_react92.useCallback)(
+    (e) => {
+      if (shouldBlockEditingHotkey(e)) return false;
+      return writeSelectionToClipboard();
+    },
+    [writeSelectionToClipboard]
+  );
+  const cutSelectedComponent = (0, import_react92.useCallback)(
+    (e) => {
+      var _a;
+      if (shouldBlockEditingHotkey(e)) return false;
+      const { state, dispatch, permissions, selectedItem } = appStore.getState();
+      const sel = (_a = state.ui) == null ? void 0 : _a.itemSelector;
+      if (!(sel == null ? void 0 : sel.zone) || !selectedItem) return false;
+      if (!permissions.getPermissions({ item: selectedItem }).delete)
+        return true;
+      if (!writeSelectionToClipboard()) return false;
+      dispatch({
+        type: "remove",
+        index: sel.index,
+        zone: sel.zone
+      });
+      return true;
+    },
+    [appStore, writeSelectionToClipboard]
+  );
+  const pasteComponent = (0, import_react92.useCallback)(
+    (e) => {
+      var _a, _b;
+      if (shouldBlockEditingHotkey(e)) return false;
+      const { state, dispatch, config } = appStore.getState();
+      const sel = (_a = state.ui) == null ? void 0 : _a.itemSelector;
+      if (!(sel == null ? void 0 : sel.zone)) return false;
+      (_b = navigator.clipboard) == null ? void 0 : _b.readText().then((text) => {
+        const data = parsePayload(text);
+        if (!data) return;
+        if (!config.components[data.type]) return;
+        dispatch({
+          type: "insert",
+          componentType: data.type,
+          destinationIndex: sel.index + 1,
+          destinationZone: sel.zone,
+          data
+        });
+      }).catch(() => {
+      });
+      return true;
+    },
+    [appStore]
+  );
+  useHotkey({ meta: true, c: true }, copySelectedComponent);
+  useHotkey({ ctrl: true, c: true }, copySelectedComponent);
+  useHotkey({ meta: true, v: true }, pasteComponent);
+  useHotkey({ ctrl: true, v: true }, pasteComponent);
+  useHotkey({ meta: true, x: true }, cutSelectedComponent);
+  useHotkey({ ctrl: true, x: true }, cutSelectedComponent);
+};
+
 // components/Editor/components/Nav/index.tsx
 init_react_import();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Nav/styles.module.css#css-module
 init_react_import();
-var styles_module_default31 = { "Nav": "_Nav_kjoi9_1", "Nav-list": "_Nav-list_kjoi9_18", "Nav-footer": "_Nav-footer_kjoi9_42", "NavItem-link": "_NavItem-link_kjoi9_55", "NavItem-linkLabel": "_NavItem-linkLabel_kjoi9_83", "NavItem": "_NavItem_kjoi9_55", "NavItem-linkIcon": "_NavItem-linkIcon_kjoi9_108", "NavItem--active": "_NavItem--active_kjoi9_121", "NavItem--mobileOnly": "_NavItem--mobileOnly_kjoi9_132", "NavItem--desktopOnly": "_NavItem--desktopOnly_kjoi9_137" };
+var styles_module_default32 = { "Nav": "_Nav_1g4tk_1", "Nav-list": "_Nav-list_1g4tk_18", "Nav-footer": "_Nav-footer_1g4tk_42", "NavItem-link": "_NavItem-link_1g4tk_55", "NavItem-linkLabel": "_NavItem-linkLabel_1g4tk_83", "NavItem": "_NavItem_1g4tk_55", "NavItem-linkIcon": "_NavItem-linkIcon_1g4tk_108", "NavItem--active": "_NavItem--active_1g4tk_121", "NavItem--mobileOnly": "_NavItem--mobileOnly_1g4tk_132", "NavItem--desktopOnly": "_NavItem--desktopOnly_1g4tk_137" };
 
 // components/Editor/components/Nav/index.tsx
 init_lib();
-var import_jsx_runtime87 = require("react/jsx-runtime");
-var getClassName38 = get_class_name_factory_default("Nav", styles_module_default31);
-var getClassNameItem3 = get_class_name_factory_default("NavItem", styles_module_default31);
+var import_jsx_runtime88 = require("react/jsx-runtime");
+var getClassName39 = get_class_name_factory_default("Nav", styles_module_default32);
+var getClassNameItem3 = get_class_name_factory_default("NavItem", styles_module_default32);
 var MenuItem = ({
   label,
   icon,
@@ -13554,7 +13947,7 @@ var MenuItem = ({
   mobileOnly,
   desktopOnly
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
     "li",
     {
       className: getClassNameItem3({
@@ -13562,9 +13955,9 @@ var MenuItem = ({
         mobileOnly,
         desktopOnly
       }),
-      children: onClick && /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("div", { className: getClassNameItem3("link"), onClick, children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("span", { className: getClassNameItem3("linkIcon"), children: icon }),
-        /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("span", { className: getClassNameItem3("linkLabel"), children: label })
+      children: onClick && /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { className: getClassNameItem3("link"), onClick, children: [
+        icon && /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: getClassNameItem3("linkIcon"), children: icon }),
+        /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: getClassNameItem3("linkLabel"), children: label })
       ] })
     }
   );
@@ -13573,9 +13966,9 @@ var Nav = ({
   items,
   footer
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("nav", { className: getClassName38(), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("ul", { className: getClassName38("list"), children: Object.entries(items).map(([key, item]) => /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(MenuItem, __spreadValues({}, item), key)) }),
-    footer && /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("div", { className: getClassName38("footer"), children: footer })
+  return /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("nav", { className: getClassName39(), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("ul", { className: getClassName39("list"), children: Object.entries(items).map(([key, item]) => /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(MenuItem, __spreadValues({}, item), key)) }),
+    footer && /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: getClassName39("footer"), children: footer })
   ] });
 };
 
@@ -13589,17 +13982,17 @@ init_lucide_react();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/plugins/blocks/styles.module.css#css-module
 init_react_import();
-var styles_module_default32 = { "BlocksPlugin": "_BlocksPlugin_15ud0_1" };
+var styles_module_default33 = { "BlocksPlugin": "_BlocksPlugin_15ud0_1" };
 
 // plugins/blocks/index.tsx
 init_lib();
-var import_jsx_runtime88 = require("react/jsx-runtime");
-var getClassName39 = get_class_name_factory_default("BlocksPlugin", styles_module_default32);
+var import_jsx_runtime89 = require("react/jsx-runtime");
+var getClassName40 = get_class_name_factory_default("BlocksPlugin", styles_module_default33);
 var blocksPlugin = () => ({
   name: "blocks",
   label: "Blocks",
-  render: () => /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: getClassName39(), children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Components, {}) }),
-  icon: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Plus, {})
+  render: () => /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: getClassName40(), children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(Components, {}) }),
+  icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(Plus, {})
 });
 
 // plugins/outline/index.tsx
@@ -13608,17 +14001,17 @@ init_lucide_react();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/plugins/outline/styles.module.css#css-module
 init_react_import();
-var styles_module_default33 = { "OutlinePlugin": "_OutlinePlugin_q92j6_1" };
+var styles_module_default34 = { "OutlinePlugin": "_OutlinePlugin_q92j6_1" };
 
 // plugins/outline/index.tsx
 init_lib();
-var import_jsx_runtime89 = require("react/jsx-runtime");
-var getClassName40 = get_class_name_factory_default("OutlinePlugin", styles_module_default33);
+var import_jsx_runtime90 = require("react/jsx-runtime");
+var getClassName41 = get_class_name_factory_default("OutlinePlugin", styles_module_default34);
 var outlinePlugin = () => ({
   name: "outline",
   label: "Outline",
-  render: () => /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: getClassName40(), children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(Outline, {}) }),
-  icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(Layers, {})
+  render: () => /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("div", { className: getClassName41(), children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(Outline, {}) }),
+  icon: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(Layers, {})
 });
 
 // plugins/fields/index.tsx
@@ -13628,12 +14021,12 @@ init_store();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/plugins/fields/styles.module.css#css-module
 init_react_import();
-var styles_module_default34 = { "FieldsPlugin": "_FieldsPlugin_l8h4q_1", "FieldsPlugin-header": "_FieldsPlugin-header_l8h4q_7" };
+var styles_module_default35 = { "FieldsPlugin": "_FieldsPlugin_262zt_1", "FieldsPlugin-header": "_FieldsPlugin-header_262zt_7" };
 
 // plugins/fields/index.tsx
 init_lib();
-var import_jsx_runtime90 = require("react/jsx-runtime");
-var getClassName41 = get_class_name_factory_default("FieldsPlugin", styles_module_default34);
+var import_jsx_runtime91 = require("react/jsx-runtime");
+var getClassName42 = get_class_name_factory_default("FieldsPlugin", styles_module_default35);
 var CurrentTitle = () => {
   const label = useAppStore((s) => {
     var _a, _b;
@@ -13645,17 +14038,17 @@ var CurrentTitle = () => {
 var fieldsPlugin = ({ desktopSideBar = "right" } = {}) => ({
   name: "fields",
   label: "Fields",
-  render: () => /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)("div", { className: getClassName41(), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("div", { className: getClassName41("header"), children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(Breadcrumbs, { numParents: 2, children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(CurrentTitle, {}) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(Fields, {})
+  render: () => /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("div", { className: getClassName42(), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("div", { className: getClassName42("header"), children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Breadcrumbs, { numParents: 2, children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(CurrentTitle, {}) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Fields, {})
   ] }),
-  icon: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(RectangleEllipsis, {}),
+  icon: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(RectangleEllipsis, {}),
   mobileOnly: desktopSideBar === "right"
 });
 
 // components/Editor/components/Layout/index.tsx
-var import_jsx_runtime91 = require("react/jsx-runtime");
-var getClassName42 = get_class_name_factory_default("Editor", styles_module_default24);
+var import_jsx_runtime92 = require("react/jsx-runtime");
+var getClassName43 = get_class_name_factory_default("Editor", styles_module_default24);
 var getLayoutClassName = get_class_name_factory_default("EditorLayout", styles_module_default24);
 var getPluginTabClassName = get_class_name_factory_default("EditorPluginTab", styles_module_default24);
 var FieldSideBarToolbar = () => {
@@ -13668,30 +14061,30 @@ var FieldSideBarToolbar = () => {
   const CustomHeaderActions = useAppStore(
     (s) => s.overrides.headerActions || DefaultOverride
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("div", { className: getClassName42("fieldSideBarToolbar"), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("div", { className: getClassName42("fieldSideBarHistory"), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)("div", { className: getClassName43("fieldSideBarToolbar"), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)("div", { className: getClassName43("fieldSideBarHistory"), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
         IconButton,
         {
           type: "button",
           title: "undo",
           disabled: !hasPast,
           onClick: back,
-          children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Undo2, { size: 18 })
+          children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Undo2, { size: 18 })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
         IconButton,
         {
           type: "button",
           title: "redo",
           disabled: !hasFuture,
           onClick: forward,
-          children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Redo2, { size: 18 })
+          children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Redo2, { size: 18 })
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("div", { className: getClassName42("fieldSideBarActions"), children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(CustomHeaderActions, { children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+    /* @__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,
       {
         onClick: () => {
@@ -13710,9 +14103,9 @@ var FieldSideBar = () => {
       return s.selectedItem ? (_b = (_a = s.config.components[s.selectedItem.type]) == null ? void 0 : _a["label"]) != null ? _b : s.selectedItem.type.toString() : ((_c = s.config.root) == null ? void 0 : _c.label) || "Page";
     }
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(import_jsx_runtime91.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(FieldSideBarToolbar, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(SidebarSection, { noBorderTop: true, showBreadcrumbs: true, title, children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Fields, {}) })
+  return /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(import_jsx_runtime92.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(FieldSideBarToolbar, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(SidebarSection, { noBorderTop: true, showBreadcrumbs: true, title, children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Fields, {}) })
   ] });
 };
 var PluginTab = ({
@@ -13720,7 +14113,7 @@ var PluginTab = ({
   visible,
   mobileOnly
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("div", { className: getPluginTabClassName({ visible, mobileOnly }), children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("div", { className: getPluginTabClassName("body"), children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { className: getPluginTabClassName({ visible, mobileOnly }), children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { className: getPluginTabClassName("body"), children }) });
 };
 var Layout = ({ children }) => {
   const {
@@ -13730,7 +14123,7 @@ var Layout = ({ children }) => {
     plugins,
     height
   } = usePropsContext();
-  const iframe = (0, import_react91.useMemo)(
+  const iframe = (0, import_react93.useMemo)(
     () => __spreadValues({
       enabled: true,
       waitForStyles: true
@@ -13756,7 +14149,7 @@ var Layout = ({ children }) => {
     sidebarRef: rightSidebarRef,
     handleResizeEnd: handleRightSidebarResizeEnd
   } = useSidebarResize("right", dispatch);
-  (0, import_react91.useEffect)(() => {
+  (0, import_react93.useEffect)(() => {
     if (!window.matchMedia("(min-width: 638px)").matches) {
       dispatch({
         type: "setUi",
@@ -13780,17 +14173,17 @@ var Layout = ({ children }) => {
     };
   }, []);
   const overrides = useAppStore((s) => s.overrides);
-  const CustomEditor = (0, import_react91.useMemo)(
+  const CustomEditor = (0, import_react93.useMemo)(
     () => overrides.editor || DefaultOverride,
     [overrides]
   );
-  const [mounted, setMounted] = (0, import_react91.useState)(false);
-  (0, import_react91.useEffect)(() => {
+  const [mounted, setMounted] = (0, import_react93.useState)(false);
+  (0, import_react93.useEffect)(() => {
     setMounted(true);
   }, []);
   const ready = useAppStore((s) => s.status === "READY");
   useMonitorHotkeys();
-  (0, import_react91.useEffect)(() => {
+  (0, import_react93.useEffect)(() => {
     if (ready && iframe.enabled) {
       const frameDoc = getFrame();
       if (frameDoc) {
@@ -13800,12 +14193,13 @@ var Layout = ({ children }) => {
   }, [ready, iframe.enabled]);
   usePreviewModeHotkeys();
   useDeleteHotkeys();
+  useClipboardHotkeys();
   const layoutOptions = {};
   if (leftWidth) {
-    layoutOptions["--re-user-left-side-bar-width"] = `${leftWidth}px`;
+    layoutOptions["--editor-user-left-side-bar-width"] = `${leftWidth}px`;
   }
   if (rightWidth) {
-    layoutOptions["--re-user-right-side-bar-width"] = `${rightWidth}px`;
+    layoutOptions["--editor-user-right-side-bar-width"] = `${rightWidth}px`;
   }
   const setUi = useAppStore((s) => s.setUi);
   const currentPlugin = useAppStore((s) => {
@@ -13813,15 +14207,15 @@ var Layout = ({ children }) => {
     return (_a = s.state.ui.plugin) == null ? void 0 : _a.current;
   });
   const appStoreApi = useAppStoreApi();
-  const [mobilePanelHeightMode, setMobilePanelHeightMode] = (0, import_react91.useState)("toggle");
-  const [mobilePanelHeight, setMobilePanelHeight] = (0, import_react91.useState)(
+  const [mobilePanelHeightMode, setMobilePanelHeightMode] = (0, import_react93.useState)("toggle");
+  const [mobilePanelHeight, setMobilePanelHeight] = (0, import_react93.useState)(
     null
   );
-  const mobilePanelRef = (0, import_react91.useRef)(null);
-  const isDraggingMobile = (0, import_react91.useRef)(false);
-  const dragStartY = (0, import_react91.useRef)(0);
-  const dragStartHeight = (0, import_react91.useRef)(0);
-  const handleMobileDragStart = (0, import_react91.useCallback)(
+  const mobilePanelRef = (0, import_react93.useRef)(null);
+  const isDraggingMobile = (0, import_react93.useRef)(false);
+  const dragStartY = (0, import_react93.useRef)(0);
+  const dragStartHeight = (0, import_react93.useRef)(0);
+  const handleMobileDragStart = (0, import_react93.useCallback)(
     (clientY) => {
       isDraggingMobile.current = true;
       dragStartY.current = clientY;
@@ -13832,7 +14226,7 @@ var Layout = ({ children }) => {
     },
     []
   );
-  const handleMobileDragMove = (0, import_react91.useCallback)((clientY) => {
+  const handleMobileDragMove = (0, import_react93.useCallback)((clientY) => {
     if (!isDraggingMobile.current) return;
     const delta = dragStartY.current - clientY;
     const viewportHeight = window.innerHeight;
@@ -13841,13 +14235,13 @@ var Layout = ({ children }) => {
     const newH = Math.min(maxH, Math.max(minH, dragStartHeight.current + delta));
     setMobilePanelHeight(newH);
   }, []);
-  const handleMobileDragEnd = (0, import_react91.useCallback)(() => {
+  const handleMobileDragEnd = (0, import_react93.useCallback)(() => {
     if (!isDraggingMobile.current) return;
     isDraggingMobile.current = false;
     document.body.style.userSelect = "";
     document.body.style.touchAction = "";
   }, []);
-  (0, import_react91.useEffect)(() => {
+  (0, import_react93.useEffect)(() => {
     const onTouchMove = (e) => {
       if (isDraggingMobile.current) {
         e.preventDefault();
@@ -13873,26 +14267,26 @@ var Layout = ({ children }) => {
       document.removeEventListener("mouseup", onMouseUp);
     };
   }, [handleMobileDragMove, handleMobileDragEnd]);
-  const [theme, setTheme] = (0, import_react91.useState)(() => {
+  const [theme, setTheme] = (0, import_react93.useState)(() => {
     if (typeof window === "undefined") return "light";
     const stored = window.localStorage.getItem("editor-theme");
     if (stored === "light" || stored === "dark") return stored;
     return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
   });
-  (0, import_react91.useEffect)(() => {
+  (0, import_react93.useEffect)(() => {
     if (typeof window === "undefined") return;
     window.localStorage.setItem("editor-theme", theme);
   }, [theme]);
   const toggleTheme = () => {
     setTheme((t) => t === "dark" ? "light" : "dark");
   };
-  const themeIcon = theme === "dark" ? /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Sun, { size: 18 }) : /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Moon, { size: 18 });
+  const themeIcon = theme === "dark" ? /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Sun, { size: 18 }) : /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Moon, { size: 18 });
   const themeLabel = theme === "dark" ? "Switch to light mode" : "Switch to dark mode";
-  const hasLegacySideBarPlugin = (0, import_react91.useMemo)(
+  const hasLegacySideBarPlugin = (0, import_react93.useMemo)(
     () => !!(plugins == null ? void 0 : plugins.find((p) => p.name === "legacy-side-bar")),
     [plugins]
   );
-  const pluginItems = (0, import_react91.useMemo)(() => {
+  const pluginItems = (0, import_react93.useMemo)(() => {
     const details = {};
     const defaultPlugins = [blocksPlugin(), outlinePlugin()];
     const isLegacy = (plugin) => plugin.name === "legacy-side-bar" ? -1 : 0;
@@ -13911,7 +14305,7 @@ var Layout = ({ children }) => {
         }
         details[plugin.name] = {
           label: (_a = plugin.label) != null ? _a : plugin.name,
-          icon: (_b = plugin.icon) != null ? _b : /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(ToyBrick, {}),
+          icon: (_b = plugin.icon) != null ? _b : /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(ToyBrick, {}),
           onClick: () => {
             var _a2;
             setMobilePanelHeightMode((_a2 = plugin.mobilePanelHeight) != null ? _a2 : "toggle");
@@ -13939,7 +14333,7 @@ var Layout = ({ children }) => {
     });
     return details;
   }, [plugins, currentPlugin, appStoreApi, leftSideBarVisible]);
-  (0, import_react91.useEffect)(() => {
+  (0, import_react93.useEffect)(() => {
     if (!currentPlugin) {
       const names = Object.keys(pluginItems);
       setUi({ plugin: { current: names[0] } });
@@ -13948,19 +14342,19 @@ var Layout = ({ children }) => {
   const hasDesktopFieldsPlugin = pluginItems["fields"] && pluginItems["fields"].mobileOnly === false;
   const mobilePanelStyle = {};
   if (mobilePanelHeight && leftSideBarVisible) {
-    mobilePanelStyle["--re-mobile-panel-height"] = `${mobilePanelHeight}px`;
+    mobilePanelStyle["--editor-mobile-panel-height"] = `${mobilePanelHeight}px`;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(
     "div",
     {
-      className: `Editor ${getClassName42({
+      className: `Editor ${getClassName43({
         hidePlugins: hasLegacySideBarPlugin
       })}`,
       id: instanceId,
       "data-theme": theme,
       style: { height },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(DragDropContext, { disableAutoScroll: dnd == null ? void 0 : dnd.disableAutoScroll, children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(CustomEditor, { children: children || /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(FrameProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(DragDropContext, { disableAutoScroll: dnd == null ? void 0 : dnd.disableAutoScroll, children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(CustomEditor, { children: children || /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(FrameProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
           "div",
           {
             className: getLayoutClassName({
@@ -13972,17 +14366,17 @@ var Layout = ({ children }) => {
               mobilePanelCustomHeight: mobilePanelHeight !== null && leftSideBarVisible
             }),
             style: { height },
-            children: /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(
               "div",
               {
                 className: getLayoutClassName("inner"),
                 style: __spreadValues(__spreadValues({}, layoutOptions), mobilePanelStyle),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("div", { className: getLayoutClassName("nav"), children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { className: getLayoutClassName("nav"), children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
                     Nav,
                     {
                       items: pluginItems,
-                      footer: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+                      footer: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
                         IconButton,
                         {
                           type: "button",
@@ -13993,19 +14387,19 @@ var Layout = ({ children }) => {
                       )
                     }
                   ) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(
+                  /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(
                     "div",
                     {
                       ref: mobilePanelRef,
                       className: getLayoutClassName("mobilePanel"),
                       children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+                        /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
                           "div",
                           {
                             className: getLayoutClassName("mobileDragHandle"),
                             onTouchStart: (e) => handleMobileDragStart(e.touches[0].clientY),
                             onMouseDown: (e) => handleMobileDragStart(e.clientY),
-                            children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+                            children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
                               "div",
                               {
                                 className: getLayoutClassName("mobileDragHandlePill")
@@ -14013,17 +14407,17 @@ var Layout = ({ children }) => {
                             )
                           }
                         ),
-                        /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+                        /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
                           "div",
                           {
                             className: getLayoutClassName("mobilePanelContent"),
                             children: Object.entries(pluginItems).map(
-                              ([id, { mobileOnly, render: Render2 }]) => /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+                              ([id, { mobileOnly, render: Render2 }]) => /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
                                 PluginTab,
                                 {
                                   visible: currentPlugin === id,
                                   mobileOnly,
-                                  children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Render2, {})
+                                  children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Render2, {})
                                 },
                                 id
                               )
@@ -14033,7 +14427,7 @@ var Layout = ({ children }) => {
                       ]
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
                     Sidebar,
                     {
                       position: "left",
@@ -14042,20 +14436,20 @@ var Layout = ({ children }) => {
                       onResize: setLeftWidth,
                       onResizeEnd: handleLeftSidebarResizeEnd,
                       children: Object.entries(pluginItems).map(
-                        ([id, { mobileOnly, render: Render2, label }]) => /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+                        ([id, { mobileOnly, render: Render2, label }]) => /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
                           PluginTab,
                           {
                             visible: currentPlugin === id,
                             mobileOnly,
-                            children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Render2, {})
+                            children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Render2, {})
                           },
                           id
                         )
                       )
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Canvas, {}),
-                  !hasDesktopFieldsPlugin && /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Canvas, {}),
+                  !hasDesktopFieldsPlugin && /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
                     Sidebar,
                     {
                       position: "right",
@@ -14063,7 +14457,7 @@ var Layout = ({ children }) => {
                       isVisible: rightSideBarVisible,
                       onResize: setRightWidth,
                       onResizeEnd: handleRightSidebarResizeEnd,
-                      children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(FieldSideBar, {})
+                      children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(FieldSideBar, {})
                     }
                   )
                 ]
@@ -14071,19 +14465,19 @@ var Layout = ({ children }) => {
             )
           }
         ) }) }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("div", { id: "editor-portal-root", className: getClassName42("portal") })
+        /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { id: "editor-portal-root", className: getClassName43("portal") })
       ]
     }
   );
 };
 
 // components/Editor/index.tsx
-var import_jsx_runtime92 = require("react/jsx-runtime");
-var propsContext = (0, import_react92.createContext)({});
+var import_jsx_runtime93 = require("react/jsx-runtime");
+var propsContext = (0, import_react94.createContext)({});
 function PropsProvider(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(propsContext.Provider, { value: props, children: props.children });
+  return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(propsContext.Provider, { value: props, children: props.children });
 }
-var usePropsContext = () => (0, import_react92.useContext)(propsContext);
+var usePropsContext = () => (0, import_react94.useContext)(propsContext);
 function EditorProvider({ children }) {
   const {
     config,
@@ -14102,14 +14496,14 @@ function EditorProvider({ children }) {
     fullScreenCanvas,
     _experimentalVirtualization
   } = usePropsContext();
-  const iframe = (0, import_react92.useMemo)(
+  const iframe = (0, import_react94.useMemo)(
     () => __spreadValues({
       enabled: true,
       waitForStyles: true
     }, _iframe),
     [_iframe]
   );
-  const [generatedAppState] = (0, import_react92.useState)(() => {
+  const [generatedAppState] = (0, import_react94.useState)(() => {
     var _a, _b, _c, _d, _e, _f;
     const initial = __spreadValues(__spreadValues({}, defaultAppState.ui), initialUi);
     let clientUiState = {};
@@ -14161,7 +14555,7 @@ function EditorProvider({ children }) {
     return walkAppState(newAppState, config);
   });
   const { appendData = true } = _initialHistory || {};
-  const [blendedHistories] = (0, import_react92.useState)(
+  const [blendedHistories] = (0, import_react94.useState)(
     [
       ...(_initialHistory == null ? void 0 : _initialHistory.histories) || [],
       ...appendData ? [{ state: generatedAppState }] : []
@@ -14175,7 +14569,7 @@ function EditorProvider({ children }) {
       });
     })
   );
-  const initialHistoryIndex = (0, import_react92.useMemo)(() => {
+  const initialHistoryIndex = (0, import_react94.useMemo)(() => {
     if ((_initialHistory == null ? void 0 : _initialHistory.index) !== void 0 && (_initialHistory == null ? void 0 : _initialHistory.index) >= 0 && (_initialHistory == null ? void 0 : _initialHistory.index) < blendedHistories.length) {
       return _initialHistory == null ? void 0 : _initialHistory.index;
     }
@@ -14186,7 +14580,7 @@ function EditorProvider({ children }) {
     overrides,
     plugins
   });
-  const loadedFieldTransforms = (0, import_react92.useMemo)(() => {
+  const loadedFieldTransforms = (0, import_react94.useMemo)(() => {
     const _plugins = plugins || [];
     const pluginFieldTransforms = _plugins.reduce(
       (acc, plugin) => __spreadValues(__spreadValues({}, acc), plugin.fieldTransforms),
@@ -14195,7 +14589,7 @@ function EditorProvider({ children }) {
     return __spreadValues(__spreadValues({}, pluginFieldTransforms), fieldTransforms);
   }, [fieldTransforms, plugins]);
   const instanceId = useSafeId();
-  const generateAppStore = (0, import_react92.useCallback)(
+  const generateAppStore = (0, import_react94.useCallback)(
     (state) => {
       return {
         instanceId,
@@ -14227,15 +14621,15 @@ function EditorProvider({ children }) {
       loadedFieldTransforms
     ]
   );
-  const [appStore] = (0, import_react92.useState)(
+  const [appStore] = (0, import_react94.useState)(
     () => createAppStore(generateAppStore(initialAppState))
   );
-  (0, import_react92.useEffect)(() => {
+  (0, import_react94.useEffect)(() => {
     if (process.env.NODE_ENV !== "production") {
       window.__PUCK_INTERNAL_DO_NOT_USE = { appStore };
     }
   }, [appStore]);
-  (0, import_react92.useEffect)(() => {
+  (0, import_react94.useEffect)(() => {
     const state = appStore.getState().state;
     appStore.setState(__spreadValues({}, generateAppStore(state)));
   }, [generateAppStore]);
@@ -14244,8 +14638,8 @@ function EditorProvider({ children }) {
     index: initialHistoryIndex,
     initialAppState
   });
-  const previousData = (0, import_react92.useRef)(null);
-  (0, import_react92.useEffect)(() => {
+  const previousData = (0, import_react94.useRef)(null);
+  (0, import_react94.useEffect)(() => {
     return appStore.subscribe(
       (s) => s.state.data,
       (data) => {
@@ -14259,16 +14653,16 @@ function EditorProvider({ children }) {
   }, [onChange, config]);
   useRegisterPermissionsSlice(appStore, permissions);
   const uEditorStore = useRegisterUseEditorStore(appStore);
-  (0, import_react92.useEffect)(() => {
+  (0, import_react94.useEffect)(() => {
     const { resolveAndCommitData } = appStore.getState();
     setTimeout(() => {
       resolveAndCommitData();
     }, 0);
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(appStoreContext.Provider, { value: appStore, children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(UseEditorStoreContext.Provider, { value: uEditorStore, children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(appStoreContext.Provider, { value: appStore, children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(UseEditorStoreContext.Provider, { value: uEditorStore, children }) });
 }
 function Editor4(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(PropsProvider, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(EditorProvider, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Layout, { children: props.children }) })) }));
+  return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(PropsProvider, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(EditorProvider, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(Layout, { children: props.children }) })) }));
 }
 Editor4.Components = Components;
 Editor4.Fields = Fields;
@@ -14554,12 +14948,12 @@ init_walk_tree();
 
 // plugins/legacy-side-bar/index.tsx
 init_react_import();
-var import_jsx_runtime93 = require("react/jsx-runtime");
+var import_jsx_runtime94 = require("react/jsx-runtime");
 var legacySideBarPlugin = () => ({
   name: "legacy-side-bar",
-  render: () => /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)("div", { style: { overflowY: "auto" }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(SidebarSection, { title: "Components", noBorderTop: true, children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(Components, {}) }),
-    /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(SidebarSection, { title: "Outline", children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(Outline, {}) })
+  render: () => /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { style: { overflowY: "auto" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(SidebarSection, { title: "Components", noBorderTop: true, children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(Components, {}) }),
+    /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(SidebarSection, { title: "Outline", children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(Outline, {}) })
   ] })
 });
 // Annotate the CommonJS export names for ESM import in node:
@@ -14570,7 +14964,6 @@ var legacySideBarPlugin = () => ({
   Button,
   ComponentList,
   Drawer,
-  DropZone,
   Editor,
   FieldLabel,
   Group,
@@ -14594,6 +14987,7 @@ var legacySideBarPlugin = () => ({
   transformProps,
   useEditor,
   useGetEditor,
+  usePropsContext,
   walkTree
 });
 /*! Bundled license information: