@reacteditor/core 0.0.5 → 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Editor-4LPVLYSU.css +415 -0
- package/dist/{Editor-POJT3RA2.mjs → Editor-YNFB7B6Z.mjs} +7 -7
- package/dist/{Render-JNABKPAF.mjs → Render-STFB5CNO.mjs} +1 -1
- package/dist/Render-ZTUTUUAH.css +103 -0
- package/dist/{chunk-YFRH22NT.mjs → chunk-275EJPEB.mjs} +2 -2
- package/dist/{chunk-DCL4UC2H.mjs → chunk-6LG4Q4HO.mjs} +1 -1
- package/dist/{chunk-KC727YFW.mjs → chunk-6QJ2HF4O.mjs} +1 -1
- package/dist/{chunk-43G2QHSV.mjs → chunk-BRDUM7MJ.mjs} +10 -10
- package/dist/{chunk-IUOWXGYR.mjs → chunk-CRF2GWQA.mjs} +1 -1
- package/dist/{chunk-X7IRHSQN.mjs → chunk-DB4R5IWG.mjs} +4 -4
- package/dist/{chunk-QB3US7UE.mjs → chunk-HCFEY5Y7.mjs} +337 -177
- package/dist/{chunk-JEDWXGVP.mjs → chunk-WGPCLAZR.mjs} +1 -1
- package/dist/{chunk-5N6RK26Z.mjs → chunk-Z6IIVDFY.mjs} +1 -1
- package/dist/{full-HZMEMWCN.mjs → full-24FOTNTB.mjs} +5 -5
- package/dist/full-7ABPY2WA.css +311 -0
- package/dist/index.css +1268 -1165
- package/dist/index.js +393 -231
- package/dist/index.mjs +9 -9
- package/dist/{loaded-U6ZILQXM.mjs → loaded-6IBSSOXD.mjs} +2 -2
- package/dist/{loaded-35JQLXSA.mjs → loaded-6NPDD7SF.mjs} +2 -2
- package/dist/{loaded-QJMKRN35.mjs → loaded-BQVZGQG2.mjs} +2 -2
- package/dist/loaded-N4KWL7FV.css +90 -0
- package/dist/no-external.css +1268 -1165
- package/dist/no-external.js +393 -231
- package/dist/no-external.mjs +9 -9
- package/dist/rsc.css +40 -40
- package/dist/rsc.js +1 -1
- package/dist/rsc.mjs +2 -2
- package/package.json +2 -1
- package/dist/Editor-WYZZDKT3.css +0 -415
- package/dist/Render-WBTAN6PO.css +0 -103
- package/dist/full-5442HPZH.css +0 -311
- package/dist/loaded-KZZU4RNL.css +0 -90
package/dist/no-external.js
CHANGED
|
@@ -199,7 +199,7 @@ var init_styles_module = __esm({
|
|
|
199
199
|
"use strict";
|
|
200
200
|
init_react_import();
|
|
201
201
|
init_css_module_data();
|
|
202
|
-
styles_module_default = { "ActionBar": "
|
|
202
|
+
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" };
|
|
203
203
|
}
|
|
204
204
|
});
|
|
205
205
|
|
|
@@ -1227,7 +1227,7 @@ var init_IconButton_module = __esm({
|
|
|
1227
1227
|
"use strict";
|
|
1228
1228
|
init_react_import();
|
|
1229
1229
|
init_css_module_data2();
|
|
1230
|
-
IconButton_module_default = { "IconButton": "
|
|
1230
|
+
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" };
|
|
1231
1231
|
}
|
|
1232
1232
|
});
|
|
1233
1233
|
|
|
@@ -3710,7 +3710,7 @@ var init_styles_module3 = __esm({
|
|
|
3710
3710
|
"use strict";
|
|
3711
3711
|
init_react_import();
|
|
3712
3712
|
init_css_module_data4();
|
|
3713
|
-
styles_module_default10 = { "RichTextMenu": "
|
|
3713
|
+
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" };
|
|
3714
3714
|
}
|
|
3715
3715
|
});
|
|
3716
3716
|
|
|
@@ -3921,7 +3921,7 @@ var init_styles_module5 = __esm({
|
|
|
3921
3921
|
"use strict";
|
|
3922
3922
|
init_react_import();
|
|
3923
3923
|
init_css_module_data6();
|
|
3924
|
-
styles_module_default12 = { "Select": "
|
|
3924
|
+
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" };
|
|
3925
3925
|
}
|
|
3926
3926
|
});
|
|
3927
3927
|
|
|
@@ -4895,7 +4895,7 @@ var init_styles_module6 = __esm({
|
|
|
4895
4895
|
"use strict";
|
|
4896
4896
|
init_react_import();
|
|
4897
4897
|
init_css_module_data7();
|
|
4898
|
-
styles_module_default13 = { "RichTextEditor": "
|
|
4898
|
+
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" };
|
|
4899
4899
|
}
|
|
4900
4900
|
});
|
|
4901
4901
|
|
|
@@ -5544,7 +5544,7 @@ init_get_class_name_factory();
|
|
|
5544
5544
|
|
|
5545
5545
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/AutoField/styles.module.css#css-module
|
|
5546
5546
|
init_react_import();
|
|
5547
|
-
var styles_module_default2 = { "InputWrapper": "
|
|
5547
|
+
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" };
|
|
5548
5548
|
|
|
5549
5549
|
// components/AutoField/index.tsx
|
|
5550
5550
|
var import_react48 = require("react");
|
|
@@ -5558,7 +5558,7 @@ init_get_class_name_factory();
|
|
|
5558
5558
|
|
|
5559
5559
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/AutoField/fields/ArrayField/styles.module.css#css-module
|
|
5560
5560
|
init_react_import();
|
|
5561
|
-
var styles_module_default3 = { "ArrayField": "
|
|
5561
|
+
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" };
|
|
5562
5562
|
|
|
5563
5563
|
// components/AutoField/fields/ArrayField/index.tsx
|
|
5564
5564
|
init_lucide_react();
|
|
@@ -5625,7 +5625,7 @@ init_lib();
|
|
|
5625
5625
|
|
|
5626
5626
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/DragIcon/styles.module.css#css-module
|
|
5627
5627
|
init_react_import();
|
|
5628
|
-
var styles_module_default5 = { "DragIcon": "
|
|
5628
|
+
var styles_module_default5 = { "DragIcon": "_DragIcon_eapcz_1", "DragIcon--disabled": "_DragIcon--disabled_eapcz_8" };
|
|
5629
5629
|
|
|
5630
5630
|
// components/DragIcon/index.tsx
|
|
5631
5631
|
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
@@ -6672,7 +6672,7 @@ var import_react21 = require("react");
|
|
|
6672
6672
|
|
|
6673
6673
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/ExternalInput/styles.module.css#css-module
|
|
6674
6674
|
init_react_import();
|
|
6675
|
-
var styles_module_default6 = { "ExternalInput-actions": "_ExternalInput-
|
|
6675
|
+
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" };
|
|
6676
6676
|
|
|
6677
6677
|
// components/ExternalInput/index.tsx
|
|
6678
6678
|
init_get_class_name_factory();
|
|
@@ -6685,7 +6685,7 @@ init_get_class_name_factory();
|
|
|
6685
6685
|
|
|
6686
6686
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Modal/styles.module.css#css-module
|
|
6687
6687
|
init_react_import();
|
|
6688
|
-
var styles_module_default7 = { "Modal": "
|
|
6688
|
+
var styles_module_default7 = { "Modal": "_Modal_vim19_1", "Modal--isOpen": "_Modal--isOpen_vim19_15", "Modal-inner": "_Modal-inner_vim19_19" };
|
|
6689
6689
|
|
|
6690
6690
|
// components/Modal/index.tsx
|
|
6691
6691
|
var import_react_dom = require("react-dom");
|
|
@@ -6721,7 +6721,7 @@ init_react_import();
|
|
|
6721
6721
|
|
|
6722
6722
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Heading/styles.module.css#css-module
|
|
6723
6723
|
init_react_import();
|
|
6724
|
-
var styles_module_default8 = { "Heading": "
|
|
6724
|
+
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" };
|
|
6725
6725
|
|
|
6726
6726
|
// components/Heading/index.tsx
|
|
6727
6727
|
init_get_class_name_factory();
|
|
@@ -6752,7 +6752,7 @@ var import_react20 = require("react");
|
|
|
6752
6752
|
|
|
6753
6753
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Button/Button.module.css#css-module
|
|
6754
6754
|
init_react_import();
|
|
6755
|
-
var Button_module_default = { "Button": "
|
|
6755
|
+
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" };
|
|
6756
6756
|
|
|
6757
6757
|
// components/Button/Button.tsx
|
|
6758
6758
|
init_get_class_name_factory();
|
|
@@ -7190,11 +7190,11 @@ init_lib();
|
|
|
7190
7190
|
|
|
7191
7191
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/ui/Select/styles.module.css#css-module
|
|
7192
7192
|
init_react_import();
|
|
7193
|
-
var styles_module_default9 = { "
|
|
7193
|
+
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" };
|
|
7194
7194
|
|
|
7195
7195
|
// components/ui/Select/index.tsx
|
|
7196
7196
|
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
7197
|
-
var getClassName12 = get_class_name_factory_default("
|
|
7197
|
+
var getClassName12 = get_class_name_factory_default("EditorSelect", styles_module_default9);
|
|
7198
7198
|
var joinClassNames = (...values) => values.filter(Boolean).join(" ");
|
|
7199
7199
|
function Select(_a) {
|
|
7200
7200
|
var props = __objRest(_a, []);
|
|
@@ -7482,7 +7482,7 @@ init_get_class_name_factory();
|
|
|
7482
7482
|
|
|
7483
7483
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/AutoField/fields/ObjectField/styles.module.css#css-module
|
|
7484
7484
|
init_react_import();
|
|
7485
|
-
var styles_module_default14 = { "ObjectField": "
|
|
7485
|
+
var styles_module_default14 = { "ObjectField": "_ObjectField_1byjv_5", "ObjectField-fieldset": "_ObjectField-fieldset_1byjv_13" };
|
|
7486
7486
|
|
|
7487
7487
|
// components/AutoField/fields/ObjectField/index.tsx
|
|
7488
7488
|
init_store();
|
|
@@ -7801,7 +7801,7 @@ init_react_import();
|
|
|
7801
7801
|
|
|
7802
7802
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/ComponentList/styles.module.css#css-module
|
|
7803
7803
|
init_react_import();
|
|
7804
|
-
var styles_module_default15 = { "ComponentList": "
|
|
7804
|
+
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" };
|
|
7805
7805
|
|
|
7806
7806
|
// components/ComponentList/index.tsx
|
|
7807
7807
|
init_get_class_name_factory();
|
|
@@ -7814,7 +7814,7 @@ init_react_import();
|
|
|
7814
7814
|
|
|
7815
7815
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Drawer/styles.module.css#css-module
|
|
7816
7816
|
init_react_import();
|
|
7817
|
-
var styles_module_default16 = { "Drawer": "
|
|
7817
|
+
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" };
|
|
7818
7818
|
|
|
7819
7819
|
// components/Drawer/index.tsx
|
|
7820
7820
|
init_get_class_name_factory();
|
|
@@ -7838,7 +7838,7 @@ var import_react51 = require("react");
|
|
|
7838
7838
|
|
|
7839
7839
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/DraggableComponent/styles.module.css#css-module
|
|
7840
7840
|
init_react_import();
|
|
7841
|
-
var styles_module_default17 = { "DraggableComponent": "
|
|
7841
|
+
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" };
|
|
7842
7842
|
|
|
7843
7843
|
// components/DraggableComponent/index.tsx
|
|
7844
7844
|
init_get_class_name_factory();
|
|
@@ -8587,7 +8587,7 @@ init_lib();
|
|
|
8587
8587
|
|
|
8588
8588
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/DropZone/styles.module.css#css-module
|
|
8589
8589
|
init_react_import();
|
|
8590
|
-
var styles_module_default18 = { "DropZone": "
|
|
8590
|
+
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" };
|
|
8591
8591
|
|
|
8592
8592
|
// components/DropZone/index.tsx
|
|
8593
8593
|
init_store();
|
|
@@ -11274,7 +11274,7 @@ init_IconButton2();
|
|
|
11274
11274
|
|
|
11275
11275
|
// components/Editor/index.tsx
|
|
11276
11276
|
init_react_import();
|
|
11277
|
-
var
|
|
11277
|
+
var import_react93 = require("react");
|
|
11278
11278
|
init_store();
|
|
11279
11279
|
|
|
11280
11280
|
// components/Editor/components/Fields/index.tsx
|
|
@@ -11285,7 +11285,7 @@ init_store();
|
|
|
11285
11285
|
|
|
11286
11286
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Fields/styles.module.css#css-module
|
|
11287
11287
|
init_react_import();
|
|
11288
|
-
var styles_module_default20 = { "EditorFields": "
|
|
11288
|
+
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" };
|
|
11289
11289
|
|
|
11290
11290
|
// components/Editor/components/Fields/index.tsx
|
|
11291
11291
|
init_lib();
|
|
@@ -11486,7 +11486,7 @@ init_lucide_react();
|
|
|
11486
11486
|
|
|
11487
11487
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Components/styles.module.css#css-module
|
|
11488
11488
|
init_react_import();
|
|
11489
|
-
var styles_module_default21 = { "Components-search": "_Components-
|
|
11489
|
+
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" };
|
|
11490
11490
|
|
|
11491
11491
|
// components/Editor/components/Components/index.tsx
|
|
11492
11492
|
init_get_class_name_factory();
|
|
@@ -11990,7 +11990,7 @@ init_react_import();
|
|
|
11990
11990
|
|
|
11991
11991
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/LayerTree/styles.module.css#css-module
|
|
11992
11992
|
init_react_import();
|
|
11993
|
-
var styles_module_default23 = { "LayerTree": "
|
|
11993
|
+
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" };
|
|
11994
11994
|
|
|
11995
11995
|
// components/LayerTree/index.tsx
|
|
11996
11996
|
init_get_class_name_factory();
|
|
@@ -12708,12 +12708,12 @@ init_to_component();
|
|
|
12708
12708
|
|
|
12709
12709
|
// components/Editor/components/Layout/index.tsx
|
|
12710
12710
|
init_react_import();
|
|
12711
|
-
var
|
|
12711
|
+
var import_react92 = require("react");
|
|
12712
12712
|
init_lib();
|
|
12713
12713
|
|
|
12714
12714
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Layout/styles.module.css#css-module
|
|
12715
12715
|
init_react_import();
|
|
12716
|
-
var styles_module_default24 = { "Editor": "
|
|
12716
|
+
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" };
|
|
12717
12717
|
|
|
12718
12718
|
// lib/use-inject-css.ts
|
|
12719
12719
|
init_react_import();
|
|
@@ -12778,7 +12778,7 @@ init_react_import();
|
|
|
12778
12778
|
|
|
12779
12779
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/SidebarSection/styles.module.css#css-module
|
|
12780
12780
|
init_react_import();
|
|
12781
|
-
var styles_module_default25 = { "SidebarSection": "
|
|
12781
|
+
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" };
|
|
12782
12782
|
|
|
12783
12783
|
// components/SidebarSection/index.tsx
|
|
12784
12784
|
init_get_class_name_factory();
|
|
@@ -12789,7 +12789,7 @@ init_react_import();
|
|
|
12789
12789
|
|
|
12790
12790
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Breadcrumbs/styles.module.css#css-module
|
|
12791
12791
|
init_react_import();
|
|
12792
|
-
var styles_module_default26 = { "Breadcrumbs": "
|
|
12792
|
+
var styles_module_default26 = { "Breadcrumbs": "_Breadcrumbs_1cjxk_1", "Breadcrumbs-breadcrumb": "_Breadcrumbs-breadcrumb_1cjxk_10", "Breadcrumbs-breadcrumbLabel": "_Breadcrumbs-breadcrumbLabel_1cjxk_17" };
|
|
12793
12793
|
|
|
12794
12794
|
// components/Breadcrumbs/index.tsx
|
|
12795
12795
|
init_get_class_name_factory();
|
|
@@ -12891,25 +12891,152 @@ var SidebarSection = ({
|
|
|
12891
12891
|
// components/Editor/components/Canvas/index.tsx
|
|
12892
12892
|
init_react_import();
|
|
12893
12893
|
init_css_box_model_esm();
|
|
12894
|
-
var
|
|
12894
|
+
var import_react88 = require("react");
|
|
12895
12895
|
init_lucide_react();
|
|
12896
12896
|
init_store();
|
|
12897
12897
|
|
|
12898
12898
|
// components/BrowserBar/index.tsx
|
|
12899
12899
|
init_react_import();
|
|
12900
12900
|
init_lucide_react();
|
|
12901
|
-
var
|
|
12901
|
+
var import_react86 = require("react");
|
|
12902
12902
|
init_store();
|
|
12903
12903
|
init_lib();
|
|
12904
12904
|
init_IconButton2();
|
|
12905
12905
|
|
|
12906
|
+
// components/ui/Combobox/index.tsx
|
|
12907
|
+
init_react_import();
|
|
12908
|
+
var import_react85 = require("@base-ui/react");
|
|
12909
|
+
init_lucide_react();
|
|
12910
|
+
init_lib();
|
|
12911
|
+
|
|
12912
|
+
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/ui/Combobox/styles.module.css#css-module
|
|
12913
|
+
init_react_import();
|
|
12914
|
+
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" };
|
|
12915
|
+
|
|
12916
|
+
// components/ui/Combobox/index.tsx
|
|
12917
|
+
var import_jsx_runtime82 = require("react/jsx-runtime");
|
|
12918
|
+
var getClassName34 = get_class_name_factory_default("EditorCombobox", styles_module_default27);
|
|
12919
|
+
var join = (...values) => values.filter(Boolean).join(" ");
|
|
12920
|
+
var mergeClassName = (base, override) => {
|
|
12921
|
+
if (!override) return base;
|
|
12922
|
+
if (typeof override === "function") {
|
|
12923
|
+
return (state) => join(base, override(state));
|
|
12924
|
+
}
|
|
12925
|
+
return join(base, override);
|
|
12926
|
+
};
|
|
12927
|
+
var Combobox = import_react85.Combobox.Root;
|
|
12928
|
+
function ComboboxInput(_a) {
|
|
12929
|
+
var _b = _a, {
|
|
12930
|
+
className
|
|
12931
|
+
} = _b, props = __objRest(_b, [
|
|
12932
|
+
"className"
|
|
12933
|
+
]);
|
|
12934
|
+
return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
|
|
12935
|
+
import_react85.Combobox.Input,
|
|
12936
|
+
__spreadValues({
|
|
12937
|
+
"data-slot": "combobox-input",
|
|
12938
|
+
className: mergeClassName(getClassName34("input"), className)
|
|
12939
|
+
}, props)
|
|
12940
|
+
);
|
|
12941
|
+
}
|
|
12942
|
+
function ComboboxContent(_a) {
|
|
12943
|
+
var _b = _a, {
|
|
12944
|
+
className,
|
|
12945
|
+
side = "bottom",
|
|
12946
|
+
sideOffset = 4,
|
|
12947
|
+
align = "start",
|
|
12948
|
+
alignOffset = 0,
|
|
12949
|
+
children
|
|
12950
|
+
} = _b, props = __objRest(_b, [
|
|
12951
|
+
"className",
|
|
12952
|
+
"side",
|
|
12953
|
+
"sideOffset",
|
|
12954
|
+
"align",
|
|
12955
|
+
"alignOffset",
|
|
12956
|
+
"children"
|
|
12957
|
+
]);
|
|
12958
|
+
return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(import_react85.Combobox.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
|
|
12959
|
+
import_react85.Combobox.Positioner,
|
|
12960
|
+
{
|
|
12961
|
+
side,
|
|
12962
|
+
sideOffset,
|
|
12963
|
+
align,
|
|
12964
|
+
alignOffset,
|
|
12965
|
+
className: getClassName34("positioner"),
|
|
12966
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
|
|
12967
|
+
import_react85.Combobox.Popup,
|
|
12968
|
+
__spreadProps(__spreadValues({
|
|
12969
|
+
"data-slot": "combobox-content",
|
|
12970
|
+
className: mergeClassName(getClassName34("content"), className)
|
|
12971
|
+
}, props), {
|
|
12972
|
+
children
|
|
12973
|
+
})
|
|
12974
|
+
)
|
|
12975
|
+
}
|
|
12976
|
+
) });
|
|
12977
|
+
}
|
|
12978
|
+
function ComboboxList(_a) {
|
|
12979
|
+
var _b = _a, {
|
|
12980
|
+
className
|
|
12981
|
+
} = _b, props = __objRest(_b, [
|
|
12982
|
+
"className"
|
|
12983
|
+
]);
|
|
12984
|
+
return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
|
|
12985
|
+
import_react85.Combobox.List,
|
|
12986
|
+
__spreadValues({
|
|
12987
|
+
"data-slot": "combobox-list",
|
|
12988
|
+
className: mergeClassName(getClassName34("list"), className)
|
|
12989
|
+
}, props)
|
|
12990
|
+
);
|
|
12991
|
+
}
|
|
12992
|
+
function ComboboxItem(_a) {
|
|
12993
|
+
var _b = _a, {
|
|
12994
|
+
className,
|
|
12995
|
+
children
|
|
12996
|
+
} = _b, props = __objRest(_b, [
|
|
12997
|
+
"className",
|
|
12998
|
+
"children"
|
|
12999
|
+
]);
|
|
13000
|
+
return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
|
|
13001
|
+
import_react85.Combobox.Item,
|
|
13002
|
+
__spreadProps(__spreadValues({
|
|
13003
|
+
"data-slot": "combobox-item",
|
|
13004
|
+
className: mergeClassName(getClassName34("item"), className)
|
|
13005
|
+
}, props), {
|
|
13006
|
+
children: [
|
|
13007
|
+
/* @__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 }) }) }),
|
|
13008
|
+
children
|
|
13009
|
+
]
|
|
13010
|
+
})
|
|
13011
|
+
);
|
|
13012
|
+
}
|
|
13013
|
+
function ComboboxEmpty(_a) {
|
|
13014
|
+
var _b = _a, {
|
|
13015
|
+
className
|
|
13016
|
+
} = _b, props = __objRest(_b, [
|
|
13017
|
+
"className"
|
|
13018
|
+
]);
|
|
13019
|
+
return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
|
|
13020
|
+
import_react85.Combobox.Empty,
|
|
13021
|
+
__spreadValues({
|
|
13022
|
+
"data-slot": "combobox-empty",
|
|
13023
|
+
className: mergeClassName(getClassName34("empty"), className)
|
|
13024
|
+
}, props)
|
|
13025
|
+
);
|
|
13026
|
+
}
|
|
13027
|
+
|
|
12906
13028
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/BrowserBar/styles.module.css#css-module
|
|
12907
13029
|
init_react_import();
|
|
12908
|
-
var
|
|
13030
|
+
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" };
|
|
12909
13031
|
|
|
12910
13032
|
// components/BrowserBar/index.tsx
|
|
12911
|
-
var
|
|
12912
|
-
var
|
|
13033
|
+
var import_jsx_runtime83 = require("react/jsx-runtime");
|
|
13034
|
+
var normalizeRoute = (raw) => {
|
|
13035
|
+
const trimmed = raw.trim();
|
|
13036
|
+
if (!trimmed) return trimmed;
|
|
13037
|
+
return trimmed.startsWith("/") ? trimmed : `/${trimmed}`;
|
|
13038
|
+
};
|
|
13039
|
+
var getClassName35 = get_class_name_factory_default("BrowserBar", styles_module_default28);
|
|
12913
13040
|
var DEVICE_VIEWPORTS = {
|
|
12914
13041
|
desktop: { width: "100%", height: "auto", icon: "Monitor", label: "Desktop" },
|
|
12915
13042
|
mobile: { width: 360, height: "auto", icon: "Smartphone", label: "Mobile" }
|
|
@@ -12917,7 +13044,6 @@ var DEVICE_VIEWPORTS = {
|
|
|
12917
13044
|
var BrowserBar = ({
|
|
12918
13045
|
onViewportChange
|
|
12919
13046
|
}) => {
|
|
12920
|
-
var _a;
|
|
12921
13047
|
const { routes, currentPath, onRouteChange } = usePropsContext();
|
|
12922
13048
|
const viewports = useAppStore((s) => s.state.ui.viewports);
|
|
12923
13049
|
const dispatch = useAppStore((s) => s.dispatch);
|
|
@@ -12936,7 +13062,7 @@ var BrowserBar = ({
|
|
|
12936
13062
|
}
|
|
12937
13063
|
});
|
|
12938
13064
|
};
|
|
12939
|
-
const activeDevice = (0,
|
|
13065
|
+
const activeDevice = (0, import_react86.useMemo)(() => {
|
|
12940
13066
|
const w = viewports.current.width;
|
|
12941
13067
|
if (typeof w === "number" && w <= 640) return "mobile";
|
|
12942
13068
|
return "desktop";
|
|
@@ -12945,50 +13071,86 @@ var BrowserBar = ({
|
|
|
12945
13071
|
onViewportChange == null ? void 0 : onViewportChange(DEVICE_VIEWPORTS[device]);
|
|
12946
13072
|
};
|
|
12947
13073
|
const showRoutePicker = !!routes && currentPath !== void 0 && !!onRouteChange;
|
|
12948
|
-
const
|
|
12949
|
-
|
|
12950
|
-
|
|
12951
|
-
|
|
13074
|
+
const [inputValue, setInputValue] = (0, import_react86.useState)(currentPath != null ? currentPath : "");
|
|
13075
|
+
const lastSyncedPath = (0, import_react86.useRef)(currentPath);
|
|
13076
|
+
if (lastSyncedPath.current !== currentPath) {
|
|
13077
|
+
lastSyncedPath.current = currentPath;
|
|
13078
|
+
setInputValue(currentPath != null ? currentPath : "");
|
|
13079
|
+
}
|
|
13080
|
+
const submit = (raw) => {
|
|
13081
|
+
const next = normalizeRoute(raw);
|
|
13082
|
+
if (!next || next === currentPath) return;
|
|
13083
|
+
void (onRouteChange == null ? void 0 : onRouteChange(next));
|
|
13084
|
+
};
|
|
13085
|
+
return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: getClassName35(), children: [
|
|
13086
|
+
showRoutePicker ? /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(
|
|
13087
|
+
Combobox,
|
|
12952
13088
|
{
|
|
13089
|
+
items: routes.map((r) => r.path),
|
|
12953
13090
|
value: currentPath,
|
|
12954
13091
|
onValueChange: (next) => {
|
|
12955
|
-
|
|
13092
|
+
if (typeof next === "string") submit(next);
|
|
12956
13093
|
},
|
|
13094
|
+
inputValue,
|
|
13095
|
+
onInputValueChange: (next) => setInputValue(next),
|
|
13096
|
+
autoHighlight: false,
|
|
12957
13097
|
children: [
|
|
12958
|
-
/* @__PURE__ */ (0,
|
|
12959
|
-
|
|
12960
|
-
|
|
12961
|
-
|
|
12962
|
-
|
|
12963
|
-
|
|
12964
|
-
|
|
12965
|
-
|
|
12966
|
-
|
|
12967
|
-
|
|
13098
|
+
/* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(
|
|
13099
|
+
"form",
|
|
13100
|
+
{
|
|
13101
|
+
className: getClassName35("urlTrigger"),
|
|
13102
|
+
onSubmit: (event) => {
|
|
13103
|
+
event.preventDefault();
|
|
13104
|
+
submit(inputValue);
|
|
13105
|
+
},
|
|
13106
|
+
children: [
|
|
13107
|
+
/* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Globe, { className: getClassName35("urlIcon"), size: 14 }),
|
|
13108
|
+
/* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
|
|
13109
|
+
ComboboxInput,
|
|
13110
|
+
{
|
|
13111
|
+
className: getClassName35("urlInput"),
|
|
13112
|
+
placeholder: "/",
|
|
13113
|
+
spellCheck: false,
|
|
13114
|
+
autoCorrect: "off",
|
|
13115
|
+
autoCapitalize: "off"
|
|
13116
|
+
}
|
|
13117
|
+
)
|
|
13118
|
+
]
|
|
13119
|
+
}
|
|
13120
|
+
),
|
|
13121
|
+
/* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(ComboboxContent, { children: [
|
|
13122
|
+
/* @__PURE__ */ (0, import_jsx_runtime83.jsx)(ComboboxEmpty, { children: "Press Enter to go to this path" }),
|
|
13123
|
+
/* @__PURE__ */ (0, import_jsx_runtime83.jsx)(ComboboxList, { children: (path) => {
|
|
13124
|
+
const route = routes.find((r) => r.path === path);
|
|
13125
|
+
return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(ComboboxItem, { value: path, children: [
|
|
13126
|
+
/* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: getClassName35("itemPath"), children: path }),
|
|
13127
|
+
(route == null ? void 0 : route.title) ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: getClassName35("itemTitle"), children: route.title }) : null
|
|
13128
|
+
] }, path);
|
|
13129
|
+
} })
|
|
12968
13130
|
] })
|
|
12969
13131
|
]
|
|
12970
13132
|
}
|
|
12971
|
-
) : /* @__PURE__ */ (0,
|
|
12972
|
-
/* @__PURE__ */ (0,
|
|
12973
|
-
/* @__PURE__ */ (0,
|
|
13133
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: getClassName35("urlTrigger"), children: [
|
|
13134
|
+
/* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Globe, { className: getClassName35("urlIcon"), size: 14 }),
|
|
13135
|
+
/* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: getClassName35("urlText"), children: "/" })
|
|
12974
13136
|
] }),
|
|
12975
|
-
/* @__PURE__ */ (0,
|
|
12976
|
-
/* @__PURE__ */ (0,
|
|
13137
|
+
/* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: getClassName35("actions"), children: [
|
|
13138
|
+
/* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
|
|
12977
13139
|
IconButton,
|
|
12978
13140
|
{
|
|
12979
13141
|
type: "button",
|
|
12980
13142
|
title: activeDevice === "desktop" ? "Switch to mobile viewport" : "Switch to desktop viewport",
|
|
12981
13143
|
onClick: () => setDevice(activeDevice === "desktop" ? "mobile" : "desktop"),
|
|
12982
|
-
children: /* @__PURE__ */ (0,
|
|
13144
|
+
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 }) })
|
|
12983
13145
|
}
|
|
12984
13146
|
),
|
|
12985
|
-
/* @__PURE__ */ (0,
|
|
13147
|
+
/* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
|
|
12986
13148
|
IconButton,
|
|
12987
13149
|
{
|
|
12988
13150
|
type: "button",
|
|
12989
13151
|
title: isFullScreen ? "Exit full screen" : "Enter full screen",
|
|
12990
13152
|
onClick: toggleFullScreen,
|
|
12991
|
-
children: /* @__PURE__ */ (0,
|
|
13153
|
+
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 }) })
|
|
12992
13154
|
}
|
|
12993
13155
|
)
|
|
12994
13156
|
] })
|
|
@@ -12997,7 +13159,7 @@ var BrowserBar = ({
|
|
|
12997
13159
|
|
|
12998
13160
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Canvas/styles.module.css#css-module
|
|
12999
13161
|
init_react_import();
|
|
13000
|
-
var
|
|
13162
|
+
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" };
|
|
13001
13163
|
|
|
13002
13164
|
// components/Editor/components/Canvas/index.tsx
|
|
13003
13165
|
init_lib();
|
|
@@ -13007,23 +13169,23 @@ var import_shallow9 = require("zustand/react/shallow");
|
|
|
13007
13169
|
|
|
13008
13170
|
// lib/frame-context.tsx
|
|
13009
13171
|
init_react_import();
|
|
13010
|
-
var
|
|
13011
|
-
var
|
|
13012
|
-
var FrameContext = (0,
|
|
13172
|
+
var import_react87 = require("react");
|
|
13173
|
+
var import_jsx_runtime84 = require("react/jsx-runtime");
|
|
13174
|
+
var FrameContext = (0, import_react87.createContext)(null);
|
|
13013
13175
|
var FrameProvider = ({
|
|
13014
13176
|
children
|
|
13015
13177
|
}) => {
|
|
13016
|
-
const frameRef = (0,
|
|
13017
|
-
const value = (0,
|
|
13178
|
+
const frameRef = (0, import_react87.useRef)(null);
|
|
13179
|
+
const value = (0, import_react87.useMemo)(
|
|
13018
13180
|
() => ({
|
|
13019
13181
|
frameRef
|
|
13020
13182
|
}),
|
|
13021
13183
|
[]
|
|
13022
13184
|
);
|
|
13023
|
-
return /* @__PURE__ */ (0,
|
|
13185
|
+
return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(FrameContext.Provider, { value, children });
|
|
13024
13186
|
};
|
|
13025
13187
|
var useCanvasFrame = () => {
|
|
13026
|
-
const context = (0,
|
|
13188
|
+
const context = (0, import_react87.useContext)(FrameContext);
|
|
13027
13189
|
if (context === null) {
|
|
13028
13190
|
throw new Error("useCanvasFrame must be used within a FrameProvider");
|
|
13029
13191
|
}
|
|
@@ -13032,8 +13194,8 @@ var useCanvasFrame = () => {
|
|
|
13032
13194
|
|
|
13033
13195
|
// components/Editor/components/Canvas/index.tsx
|
|
13034
13196
|
init_default_viewports();
|
|
13035
|
-
var
|
|
13036
|
-
var
|
|
13197
|
+
var import_jsx_runtime85 = require("react/jsx-runtime");
|
|
13198
|
+
var getClassName36 = get_class_name_factory_default("EditorCanvas", styles_module_default29);
|
|
13037
13199
|
var ZOOM_STEP = 0.15;
|
|
13038
13200
|
var MIN_ZOOM = 0.25;
|
|
13039
13201
|
var MAX_ZOOM = 3;
|
|
@@ -13068,21 +13230,21 @@ var Canvas = () => {
|
|
|
13068
13230
|
}))
|
|
13069
13231
|
);
|
|
13070
13232
|
const viewports = useAppStore((s) => s.state.ui.viewports);
|
|
13071
|
-
const [canvasZoom, setCanvasZoom] = (0,
|
|
13233
|
+
const [canvasZoom, setCanvasZoom] = (0, import_react88.useState)(1);
|
|
13072
13234
|
const zoomIn = () => setCanvasZoom((z) => Math.min(z + ZOOM_STEP, MAX_ZOOM));
|
|
13073
13235
|
const zoomOut = () => setCanvasZoom((z) => Math.max(z - ZOOM_STEP, MIN_ZOOM));
|
|
13074
13236
|
const resetZoom = () => setCanvasZoom(1);
|
|
13075
|
-
const [showTransition, setShowTransition] = (0,
|
|
13076
|
-
const isResizingRef = (0,
|
|
13077
|
-
const defaultRender = (0,
|
|
13078
|
-
const EditorDefault = ({ children }) => /* @__PURE__ */ (0,
|
|
13237
|
+
const [showTransition, setShowTransition] = (0, import_react88.useState)(false);
|
|
13238
|
+
const isResizingRef = (0, import_react88.useRef)(false);
|
|
13239
|
+
const defaultRender = (0, import_react88.useMemo)(() => {
|
|
13240
|
+
const EditorDefault = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(import_jsx_runtime85.Fragment, { children });
|
|
13079
13241
|
return EditorDefault;
|
|
13080
13242
|
}, []);
|
|
13081
|
-
const CustomPreview = (0,
|
|
13243
|
+
const CustomPreview = (0, import_react88.useMemo)(
|
|
13082
13244
|
() => overrides.preview || defaultRender,
|
|
13083
13245
|
[overrides]
|
|
13084
13246
|
);
|
|
13085
|
-
const getFrameDimensions = (0,
|
|
13247
|
+
const getFrameDimensions = (0, import_react88.useCallback)(() => {
|
|
13086
13248
|
if (frameRef.current) {
|
|
13087
13249
|
const frame = frameRef.current;
|
|
13088
13250
|
const box = getBox(frame);
|
|
@@ -13090,21 +13252,21 @@ var Canvas = () => {
|
|
|
13090
13252
|
}
|
|
13091
13253
|
return { width: 0, height: 0 };
|
|
13092
13254
|
}, [frameRef]);
|
|
13093
|
-
(0,
|
|
13255
|
+
(0, import_react88.useEffect)(() => {
|
|
13094
13256
|
const { height: frameHeight } = getFrameDimensions();
|
|
13095
13257
|
if (viewports.current.height === "auto") {
|
|
13096
13258
|
setZoomConfig(__spreadProps(__spreadValues({}, zoomConfig), { zoom: 1, rootHeight: frameHeight }));
|
|
13097
13259
|
}
|
|
13098
13260
|
}, [getFrameDimensions, setZoomConfig, viewports.current.height]);
|
|
13099
|
-
const [showLoader, setShowLoader] = (0,
|
|
13100
|
-
(0,
|
|
13261
|
+
const [showLoader, setShowLoader] = (0, import_react88.useState)(false);
|
|
13262
|
+
(0, import_react88.useEffect)(() => {
|
|
13101
13263
|
setTimeout(() => {
|
|
13102
13264
|
setShowLoader(true);
|
|
13103
13265
|
}, 500);
|
|
13104
13266
|
}, []);
|
|
13105
13267
|
const appStoreApi = useAppStoreApi();
|
|
13106
|
-
const autoSelectingRef = (0,
|
|
13107
|
-
const pickClosestViewport = (0,
|
|
13268
|
+
const autoSelectingRef = (0, import_react88.useRef)(true);
|
|
13269
|
+
const pickClosestViewport = (0, import_react88.useCallback)(() => {
|
|
13108
13270
|
var _a2, _b2;
|
|
13109
13271
|
if (typeof window === "undefined") return null;
|
|
13110
13272
|
const viewportWidth = window.innerWidth;
|
|
@@ -13129,7 +13291,7 @@ var Canvas = () => {
|
|
|
13129
13291
|
}
|
|
13130
13292
|
return closestViewport;
|
|
13131
13293
|
}, [viewportOptions, frameRef]);
|
|
13132
|
-
(0,
|
|
13294
|
+
(0, import_react88.useEffect)(() => {
|
|
13133
13295
|
var _a2;
|
|
13134
13296
|
if (typeof window === "undefined") return;
|
|
13135
13297
|
if ((_a2 = uiProp == null ? void 0 : uiProp.viewports) == null ? void 0 : _a2.current) return;
|
|
@@ -13162,7 +13324,7 @@ var Canvas = () => {
|
|
|
13162
13324
|
appStoreApi,
|
|
13163
13325
|
(_a = uiProp == null ? void 0 : uiProp.viewports) == null ? void 0 : _a.current
|
|
13164
13326
|
]);
|
|
13165
|
-
(0,
|
|
13327
|
+
(0, import_react88.useEffect)(() => {
|
|
13166
13328
|
var _a2;
|
|
13167
13329
|
if (typeof window === "undefined") return;
|
|
13168
13330
|
if (!iframe.enabled) return;
|
|
@@ -13197,10 +13359,10 @@ var Canvas = () => {
|
|
|
13197
13359
|
appStoreApi,
|
|
13198
13360
|
setUi
|
|
13199
13361
|
]);
|
|
13200
|
-
return /* @__PURE__ */ (0,
|
|
13362
|
+
return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
|
|
13201
13363
|
"div",
|
|
13202
13364
|
{
|
|
13203
|
-
className:
|
|
13365
|
+
className: getClassName36({
|
|
13204
13366
|
ready: status === "READY" || !iframe.enabled || !iframe.waitForStyles,
|
|
13205
13367
|
showLoader,
|
|
13206
13368
|
fullScreen: fullScreenCanvas
|
|
@@ -13215,16 +13377,16 @@ var Canvas = () => {
|
|
|
13215
13377
|
});
|
|
13216
13378
|
}
|
|
13217
13379
|
},
|
|
13218
|
-
children: /* @__PURE__ */ (0,
|
|
13219
|
-
!disableZoomControls && /* @__PURE__ */ (0,
|
|
13220
|
-
/* @__PURE__ */ (0,
|
|
13221
|
-
/* @__PURE__ */ (0,
|
|
13222
|
-
/* @__PURE__ */ (0,
|
|
13380
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: getClassName36("inner"), ref: frameRef, children: [
|
|
13381
|
+
!disableZoomControls && /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: getClassName36("zoomControls"), children: [
|
|
13382
|
+
/* @__PURE__ */ (0, import_jsx_runtime85.jsx)(IconButton, { type: "button", title: "Zoom out", onClick: zoomOut, children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Minus, { size: 14 }) }),
|
|
13383
|
+
/* @__PURE__ */ (0, import_jsx_runtime85.jsx)(IconButton, { type: "button", title: "Reset zoom", onClick: resetZoom, children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(RotateCcw, { size: 14 }) }),
|
|
13384
|
+
/* @__PURE__ */ (0, import_jsx_runtime85.jsx)(IconButton, { type: "button", title: "Zoom in", onClick: zoomIn, children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Plus, { size: 14 }) })
|
|
13223
13385
|
] }),
|
|
13224
|
-
/* @__PURE__ */ (0,
|
|
13386
|
+
/* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(
|
|
13225
13387
|
"div",
|
|
13226
13388
|
{
|
|
13227
|
-
className:
|
|
13389
|
+
className: getClassName36("rootColumn"),
|
|
13228
13390
|
style: {
|
|
13229
13391
|
width: iframe.enabled ? viewports.current.width : "100%",
|
|
13230
13392
|
transform: disableZoomControls ? void 0 : `scale(${canvasZoom})`,
|
|
@@ -13232,7 +13394,7 @@ var Canvas = () => {
|
|
|
13232
13394
|
transition: showTransition ? `width ${TRANSITION_DURATION}ms ease-out, transform ${TRANSITION_DURATION}ms ease-out` : disableZoomControls ? void 0 : "transform 150ms ease-out"
|
|
13233
13395
|
},
|
|
13234
13396
|
children: [
|
|
13235
|
-
iframe.enabled && /* @__PURE__ */ (0,
|
|
13397
|
+
iframe.enabled && /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("div", { className: getClassName36("browserBar"), children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
|
|
13236
13398
|
BrowserBar,
|
|
13237
13399
|
{
|
|
13238
13400
|
onViewportChange: (viewport) => {
|
|
@@ -13249,23 +13411,23 @@ var Canvas = () => {
|
|
|
13249
13411
|
}
|
|
13250
13412
|
}
|
|
13251
13413
|
) }),
|
|
13252
|
-
/* @__PURE__ */ (0,
|
|
13414
|
+
/* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
|
|
13253
13415
|
"div",
|
|
13254
13416
|
{
|
|
13255
|
-
className:
|
|
13417
|
+
className: getClassName36("root"),
|
|
13256
13418
|
suppressHydrationWarning: true,
|
|
13257
13419
|
id: "editor-canvas-root",
|
|
13258
13420
|
onTransitionEnd: () => {
|
|
13259
13421
|
setShowTransition(false);
|
|
13260
13422
|
isResizingRef.current = false;
|
|
13261
13423
|
},
|
|
13262
|
-
children: /* @__PURE__ */ (0,
|
|
13424
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(CustomPreview, { children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Preview2, {}) })
|
|
13263
13425
|
}
|
|
13264
13426
|
)
|
|
13265
13427
|
]
|
|
13266
13428
|
}
|
|
13267
13429
|
),
|
|
13268
|
-
/* @__PURE__ */ (0,
|
|
13430
|
+
/* @__PURE__ */ (0, import_jsx_runtime85.jsx)("div", { className: getClassName36("loader"), children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Loader, { size: 24 }) })
|
|
13269
13431
|
] })
|
|
13270
13432
|
}
|
|
13271
13433
|
);
|
|
@@ -13273,15 +13435,15 @@ var Canvas = () => {
|
|
|
13273
13435
|
|
|
13274
13436
|
// lib/use-sidebar-resize.ts
|
|
13275
13437
|
init_react_import();
|
|
13276
|
-
var
|
|
13438
|
+
var import_react89 = require("react");
|
|
13277
13439
|
init_store();
|
|
13278
13440
|
function useSidebarResize(position, dispatch) {
|
|
13279
|
-
const [width, setWidth] = (0,
|
|
13280
|
-
const sidebarRef = (0,
|
|
13441
|
+
const [width, setWidth] = (0, import_react89.useState)(null);
|
|
13442
|
+
const sidebarRef = (0, import_react89.useRef)(null);
|
|
13281
13443
|
const storeWidth = useAppStore(
|
|
13282
13444
|
(s) => position === "left" ? s.state.ui.leftSideBarWidth : s.state.ui.rightSideBarWidth
|
|
13283
13445
|
);
|
|
13284
|
-
(0,
|
|
13446
|
+
(0, import_react89.useEffect)(() => {
|
|
13285
13447
|
if (typeof window !== "undefined" && !storeWidth) {
|
|
13286
13448
|
try {
|
|
13287
13449
|
const savedWidths = localStorage.getItem("editor-sidebar-widths");
|
|
@@ -13306,12 +13468,12 @@ function useSidebarResize(position, dispatch) {
|
|
|
13306
13468
|
}
|
|
13307
13469
|
}
|
|
13308
13470
|
}, [dispatch, position, storeWidth]);
|
|
13309
|
-
(0,
|
|
13471
|
+
(0, import_react89.useEffect)(() => {
|
|
13310
13472
|
if (storeWidth !== void 0) {
|
|
13311
13473
|
setWidth(storeWidth);
|
|
13312
13474
|
}
|
|
13313
13475
|
}, [storeWidth]);
|
|
13314
|
-
const handleResizeEnd = (0,
|
|
13476
|
+
const handleResizeEnd = (0, import_react89.useCallback)(
|
|
13315
13477
|
(width2) => {
|
|
13316
13478
|
dispatch({
|
|
13317
13479
|
type: "setUi",
|
|
@@ -13358,27 +13520,27 @@ init_react_import();
|
|
|
13358
13520
|
|
|
13359
13521
|
// components/Editor/components/ResizeHandle/index.tsx
|
|
13360
13522
|
init_react_import();
|
|
13361
|
-
var
|
|
13523
|
+
var import_react90 = require("react");
|
|
13362
13524
|
init_get_class_name_factory();
|
|
13363
13525
|
|
|
13364
13526
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/ResizeHandle/styles.module.css#css-module
|
|
13365
13527
|
init_react_import();
|
|
13366
|
-
var
|
|
13528
|
+
var styles_module_default30 = { "ResizeHandle": "_ResizeHandle_1u3rv_2", "ResizeHandle--left": "_ResizeHandle--left_1u3rv_16", "ResizeHandle--right": "_ResizeHandle--right_1u3rv_20" };
|
|
13367
13529
|
|
|
13368
13530
|
// components/Editor/components/ResizeHandle/index.tsx
|
|
13369
|
-
var
|
|
13370
|
-
var
|
|
13531
|
+
var import_jsx_runtime86 = require("react/jsx-runtime");
|
|
13532
|
+
var getClassName37 = get_class_name_factory_default("ResizeHandle", styles_module_default30);
|
|
13371
13533
|
var ResizeHandle = ({
|
|
13372
13534
|
position,
|
|
13373
13535
|
sidebarRef,
|
|
13374
13536
|
onResize,
|
|
13375
13537
|
onResizeEnd
|
|
13376
13538
|
}) => {
|
|
13377
|
-
const handleRef = (0,
|
|
13378
|
-
const isDragging = (0,
|
|
13379
|
-
const startX = (0,
|
|
13380
|
-
const startWidth = (0,
|
|
13381
|
-
const handleMouseMove = (0,
|
|
13539
|
+
const handleRef = (0, import_react90.useRef)(null);
|
|
13540
|
+
const isDragging = (0, import_react90.useRef)(false);
|
|
13541
|
+
const startX = (0, import_react90.useRef)(0);
|
|
13542
|
+
const startWidth = (0, import_react90.useRef)(0);
|
|
13543
|
+
const handleMouseMove = (0, import_react90.useCallback)(
|
|
13382
13544
|
(e) => {
|
|
13383
13545
|
if (!isDragging.current) return;
|
|
13384
13546
|
const delta = e.clientX - startX.current;
|
|
@@ -13389,7 +13551,7 @@ var ResizeHandle = ({
|
|
|
13389
13551
|
},
|
|
13390
13552
|
[onResize, position]
|
|
13391
13553
|
);
|
|
13392
|
-
const handleMouseUp = (0,
|
|
13554
|
+
const handleMouseUp = (0, import_react90.useCallback)(() => {
|
|
13393
13555
|
var _a;
|
|
13394
13556
|
if (!isDragging.current) return;
|
|
13395
13557
|
isDragging.current = false;
|
|
@@ -13404,7 +13566,7 @@ var ResizeHandle = ({
|
|
|
13404
13566
|
const finalWidth = ((_a = sidebarRef.current) == null ? void 0 : _a.getBoundingClientRect().width) || 0;
|
|
13405
13567
|
onResizeEnd(finalWidth);
|
|
13406
13568
|
}, [onResizeEnd]);
|
|
13407
|
-
const handleMouseDown = (0,
|
|
13569
|
+
const handleMouseDown = (0, import_react90.useCallback)(
|
|
13408
13570
|
(e) => {
|
|
13409
13571
|
var _a;
|
|
13410
13572
|
isDragging.current = true;
|
|
@@ -13422,11 +13584,11 @@ var ResizeHandle = ({
|
|
|
13422
13584
|
},
|
|
13423
13585
|
[position, handleMouseMove, handleMouseUp]
|
|
13424
13586
|
);
|
|
13425
|
-
return /* @__PURE__ */ (0,
|
|
13587
|
+
return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
|
|
13426
13588
|
"div",
|
|
13427
13589
|
{
|
|
13428
13590
|
ref: handleRef,
|
|
13429
|
-
className:
|
|
13591
|
+
className: getClassName37({ [position]: true }),
|
|
13430
13592
|
onMouseDown: handleMouseDown
|
|
13431
13593
|
}
|
|
13432
13594
|
);
|
|
@@ -13437,11 +13599,11 @@ init_get_class_name_factory();
|
|
|
13437
13599
|
|
|
13438
13600
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Sidebar/styles.module.css#css-module
|
|
13439
13601
|
init_react_import();
|
|
13440
|
-
var
|
|
13602
|
+
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" };
|
|
13441
13603
|
|
|
13442
13604
|
// components/Editor/components/Sidebar/index.tsx
|
|
13443
|
-
var
|
|
13444
|
-
var
|
|
13605
|
+
var import_jsx_runtime87 = require("react/jsx-runtime");
|
|
13606
|
+
var getClassName38 = get_class_name_factory_default("Sidebar", styles_module_default31);
|
|
13445
13607
|
var Sidebar = ({
|
|
13446
13608
|
position,
|
|
13447
13609
|
sidebarRef,
|
|
@@ -13450,16 +13612,16 @@ var Sidebar = ({
|
|
|
13450
13612
|
onResizeEnd,
|
|
13451
13613
|
children
|
|
13452
13614
|
}) => {
|
|
13453
|
-
return /* @__PURE__ */ (0,
|
|
13454
|
-
/* @__PURE__ */ (0,
|
|
13615
|
+
return /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(import_jsx_runtime87.Fragment, { children: [
|
|
13616
|
+
/* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
|
|
13455
13617
|
"div",
|
|
13456
13618
|
{
|
|
13457
13619
|
ref: sidebarRef,
|
|
13458
|
-
className:
|
|
13620
|
+
className: getClassName38({ [position]: true, isVisible }),
|
|
13459
13621
|
children
|
|
13460
13622
|
}
|
|
13461
13623
|
),
|
|
13462
|
-
/* @__PURE__ */ (0,
|
|
13624
|
+
/* @__PURE__ */ (0, import_jsx_runtime87.jsx)("div", { className: `${getClassName38("resizeHandle")}`, children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
|
|
13463
13625
|
ResizeHandle,
|
|
13464
13626
|
{
|
|
13465
13627
|
position,
|
|
@@ -13473,7 +13635,7 @@ var Sidebar = ({
|
|
|
13473
13635
|
|
|
13474
13636
|
// lib/use-delete-hotkeys.ts
|
|
13475
13637
|
init_react_import();
|
|
13476
|
-
var
|
|
13638
|
+
var import_react91 = require("react");
|
|
13477
13639
|
init_use_hotkey();
|
|
13478
13640
|
init_store();
|
|
13479
13641
|
var isElementVisible = (element) => {
|
|
@@ -13510,7 +13672,7 @@ var shouldBlockDeleteHotkey = (e) => {
|
|
|
13510
13672
|
};
|
|
13511
13673
|
var useDeleteHotkeys = () => {
|
|
13512
13674
|
const appStore = useAppStoreApi();
|
|
13513
|
-
const deleteSelectedComponent = (0,
|
|
13675
|
+
const deleteSelectedComponent = (0, import_react91.useCallback)(
|
|
13514
13676
|
(e) => {
|
|
13515
13677
|
var _a;
|
|
13516
13678
|
if (shouldBlockDeleteHotkey(e)) {
|
|
@@ -13539,13 +13701,13 @@ init_react_import();
|
|
|
13539
13701
|
|
|
13540
13702
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Editor/components/Nav/styles.module.css#css-module
|
|
13541
13703
|
init_react_import();
|
|
13542
|
-
var
|
|
13704
|
+
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" };
|
|
13543
13705
|
|
|
13544
13706
|
// components/Editor/components/Nav/index.tsx
|
|
13545
13707
|
init_lib();
|
|
13546
|
-
var
|
|
13547
|
-
var
|
|
13548
|
-
var getClassNameItem3 = get_class_name_factory_default("NavItem",
|
|
13708
|
+
var import_jsx_runtime88 = require("react/jsx-runtime");
|
|
13709
|
+
var getClassName39 = get_class_name_factory_default("Nav", styles_module_default32);
|
|
13710
|
+
var getClassNameItem3 = get_class_name_factory_default("NavItem", styles_module_default32);
|
|
13549
13711
|
var MenuItem = ({
|
|
13550
13712
|
label,
|
|
13551
13713
|
icon,
|
|
@@ -13554,7 +13716,7 @@ var MenuItem = ({
|
|
|
13554
13716
|
mobileOnly,
|
|
13555
13717
|
desktopOnly
|
|
13556
13718
|
}) => {
|
|
13557
|
-
return /* @__PURE__ */ (0,
|
|
13719
|
+
return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
|
|
13558
13720
|
"li",
|
|
13559
13721
|
{
|
|
13560
13722
|
className: getClassNameItem3({
|
|
@@ -13562,9 +13724,9 @@ var MenuItem = ({
|
|
|
13562
13724
|
mobileOnly,
|
|
13563
13725
|
desktopOnly
|
|
13564
13726
|
}),
|
|
13565
|
-
children: onClick && /* @__PURE__ */ (0,
|
|
13566
|
-
icon && /* @__PURE__ */ (0,
|
|
13567
|
-
/* @__PURE__ */ (0,
|
|
13727
|
+
children: onClick && /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { className: getClassNameItem3("link"), onClick, children: [
|
|
13728
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: getClassNameItem3("linkIcon"), children: icon }),
|
|
13729
|
+
/* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: getClassNameItem3("linkLabel"), children: label })
|
|
13568
13730
|
] })
|
|
13569
13731
|
}
|
|
13570
13732
|
);
|
|
@@ -13573,9 +13735,9 @@ var Nav = ({
|
|
|
13573
13735
|
items,
|
|
13574
13736
|
footer
|
|
13575
13737
|
}) => {
|
|
13576
|
-
return /* @__PURE__ */ (0,
|
|
13577
|
-
/* @__PURE__ */ (0,
|
|
13578
|
-
footer && /* @__PURE__ */ (0,
|
|
13738
|
+
return /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("nav", { className: getClassName39(), children: [
|
|
13739
|
+
/* @__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)) }),
|
|
13740
|
+
footer && /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: getClassName39("footer"), children: footer })
|
|
13579
13741
|
] });
|
|
13580
13742
|
};
|
|
13581
13743
|
|
|
@@ -13589,17 +13751,17 @@ init_lucide_react();
|
|
|
13589
13751
|
|
|
13590
13752
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/plugins/blocks/styles.module.css#css-module
|
|
13591
13753
|
init_react_import();
|
|
13592
|
-
var
|
|
13754
|
+
var styles_module_default33 = { "BlocksPlugin": "_BlocksPlugin_15ud0_1" };
|
|
13593
13755
|
|
|
13594
13756
|
// plugins/blocks/index.tsx
|
|
13595
13757
|
init_lib();
|
|
13596
|
-
var
|
|
13597
|
-
var
|
|
13758
|
+
var import_jsx_runtime89 = require("react/jsx-runtime");
|
|
13759
|
+
var getClassName40 = get_class_name_factory_default("BlocksPlugin", styles_module_default33);
|
|
13598
13760
|
var blocksPlugin = () => ({
|
|
13599
13761
|
name: "blocks",
|
|
13600
13762
|
label: "Blocks",
|
|
13601
|
-
render: () => /* @__PURE__ */ (0,
|
|
13602
|
-
icon: /* @__PURE__ */ (0,
|
|
13763
|
+
render: () => /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: getClassName40(), children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(Components, {}) }),
|
|
13764
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(Plus, {})
|
|
13603
13765
|
});
|
|
13604
13766
|
|
|
13605
13767
|
// plugins/outline/index.tsx
|
|
@@ -13608,17 +13770,17 @@ init_lucide_react();
|
|
|
13608
13770
|
|
|
13609
13771
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/plugins/outline/styles.module.css#css-module
|
|
13610
13772
|
init_react_import();
|
|
13611
|
-
var
|
|
13773
|
+
var styles_module_default34 = { "OutlinePlugin": "_OutlinePlugin_q92j6_1" };
|
|
13612
13774
|
|
|
13613
13775
|
// plugins/outline/index.tsx
|
|
13614
13776
|
init_lib();
|
|
13615
|
-
var
|
|
13616
|
-
var
|
|
13777
|
+
var import_jsx_runtime90 = require("react/jsx-runtime");
|
|
13778
|
+
var getClassName41 = get_class_name_factory_default("OutlinePlugin", styles_module_default34);
|
|
13617
13779
|
var outlinePlugin = () => ({
|
|
13618
13780
|
name: "outline",
|
|
13619
13781
|
label: "Outline",
|
|
13620
|
-
render: () => /* @__PURE__ */ (0,
|
|
13621
|
-
icon: /* @__PURE__ */ (0,
|
|
13782
|
+
render: () => /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("div", { className: getClassName41(), children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(Outline, {}) }),
|
|
13783
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(Layers, {})
|
|
13622
13784
|
});
|
|
13623
13785
|
|
|
13624
13786
|
// plugins/fields/index.tsx
|
|
@@ -13628,12 +13790,12 @@ init_store();
|
|
|
13628
13790
|
|
|
13629
13791
|
// css-module:/Users/rami/Documents/apps/react-editor/packages/core/plugins/fields/styles.module.css#css-module
|
|
13630
13792
|
init_react_import();
|
|
13631
|
-
var
|
|
13793
|
+
var styles_module_default35 = { "FieldsPlugin": "_FieldsPlugin_262zt_1", "FieldsPlugin-header": "_FieldsPlugin-header_262zt_7" };
|
|
13632
13794
|
|
|
13633
13795
|
// plugins/fields/index.tsx
|
|
13634
13796
|
init_lib();
|
|
13635
|
-
var
|
|
13636
|
-
var
|
|
13797
|
+
var import_jsx_runtime91 = require("react/jsx-runtime");
|
|
13798
|
+
var getClassName42 = get_class_name_factory_default("FieldsPlugin", styles_module_default35);
|
|
13637
13799
|
var CurrentTitle = () => {
|
|
13638
13800
|
const label = useAppStore((s) => {
|
|
13639
13801
|
var _a, _b;
|
|
@@ -13645,17 +13807,17 @@ var CurrentTitle = () => {
|
|
|
13645
13807
|
var fieldsPlugin = ({ desktopSideBar = "right" } = {}) => ({
|
|
13646
13808
|
name: "fields",
|
|
13647
13809
|
label: "Fields",
|
|
13648
|
-
render: () => /* @__PURE__ */ (0,
|
|
13649
|
-
/* @__PURE__ */ (0,
|
|
13650
|
-
/* @__PURE__ */ (0,
|
|
13810
|
+
render: () => /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("div", { className: getClassName42(), children: [
|
|
13811
|
+
/* @__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, {}) }) }),
|
|
13812
|
+
/* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Fields, {})
|
|
13651
13813
|
] }),
|
|
13652
|
-
icon: /* @__PURE__ */ (0,
|
|
13814
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(RectangleEllipsis, {}),
|
|
13653
13815
|
mobileOnly: desktopSideBar === "right"
|
|
13654
13816
|
});
|
|
13655
13817
|
|
|
13656
13818
|
// components/Editor/components/Layout/index.tsx
|
|
13657
|
-
var
|
|
13658
|
-
var
|
|
13819
|
+
var import_jsx_runtime92 = require("react/jsx-runtime");
|
|
13820
|
+
var getClassName43 = get_class_name_factory_default("Editor", styles_module_default24);
|
|
13659
13821
|
var getLayoutClassName = get_class_name_factory_default("EditorLayout", styles_module_default24);
|
|
13660
13822
|
var getPluginTabClassName = get_class_name_factory_default("EditorPluginTab", styles_module_default24);
|
|
13661
13823
|
var FieldSideBarToolbar = () => {
|
|
@@ -13668,30 +13830,30 @@ var FieldSideBarToolbar = () => {
|
|
|
13668
13830
|
const CustomHeaderActions = useAppStore(
|
|
13669
13831
|
(s) => s.overrides.headerActions || DefaultOverride
|
|
13670
13832
|
);
|
|
13671
|
-
return /* @__PURE__ */ (0,
|
|
13672
|
-
/* @__PURE__ */ (0,
|
|
13673
|
-
/* @__PURE__ */ (0,
|
|
13833
|
+
return /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)("div", { className: getClassName43("fieldSideBarToolbar"), children: [
|
|
13834
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsxs)("div", { className: getClassName43("fieldSideBarHistory"), children: [
|
|
13835
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
13674
13836
|
IconButton,
|
|
13675
13837
|
{
|
|
13676
13838
|
type: "button",
|
|
13677
13839
|
title: "undo",
|
|
13678
13840
|
disabled: !hasPast,
|
|
13679
13841
|
onClick: back,
|
|
13680
|
-
children: /* @__PURE__ */ (0,
|
|
13842
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Undo2, { size: 18 })
|
|
13681
13843
|
}
|
|
13682
13844
|
),
|
|
13683
|
-
/* @__PURE__ */ (0,
|
|
13845
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
13684
13846
|
IconButton,
|
|
13685
13847
|
{
|
|
13686
13848
|
type: "button",
|
|
13687
13849
|
title: "redo",
|
|
13688
13850
|
disabled: !hasFuture,
|
|
13689
13851
|
onClick: forward,
|
|
13690
|
-
children: /* @__PURE__ */ (0,
|
|
13852
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Redo2, { size: 18 })
|
|
13691
13853
|
}
|
|
13692
13854
|
)
|
|
13693
13855
|
] }),
|
|
13694
|
-
/* @__PURE__ */ (0,
|
|
13856
|
+
/* @__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)(
|
|
13695
13857
|
Button,
|
|
13696
13858
|
{
|
|
13697
13859
|
onClick: () => {
|
|
@@ -13710,9 +13872,9 @@ var FieldSideBar = () => {
|
|
|
13710
13872
|
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";
|
|
13711
13873
|
}
|
|
13712
13874
|
);
|
|
13713
|
-
return /* @__PURE__ */ (0,
|
|
13714
|
-
/* @__PURE__ */ (0,
|
|
13715
|
-
/* @__PURE__ */ (0,
|
|
13875
|
+
return /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(import_jsx_runtime92.Fragment, { children: [
|
|
13876
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)(FieldSideBarToolbar, {}),
|
|
13877
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)(SidebarSection, { noBorderTop: true, showBreadcrumbs: true, title, children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Fields, {}) })
|
|
13716
13878
|
] });
|
|
13717
13879
|
};
|
|
13718
13880
|
var PluginTab = ({
|
|
@@ -13720,7 +13882,7 @@ var PluginTab = ({
|
|
|
13720
13882
|
visible,
|
|
13721
13883
|
mobileOnly
|
|
13722
13884
|
}) => {
|
|
13723
|
-
return /* @__PURE__ */ (0,
|
|
13885
|
+
return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { className: getPluginTabClassName({ visible, mobileOnly }), children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { className: getPluginTabClassName("body"), children }) });
|
|
13724
13886
|
};
|
|
13725
13887
|
var Layout = ({ children }) => {
|
|
13726
13888
|
const {
|
|
@@ -13730,7 +13892,7 @@ var Layout = ({ children }) => {
|
|
|
13730
13892
|
plugins,
|
|
13731
13893
|
height
|
|
13732
13894
|
} = usePropsContext();
|
|
13733
|
-
const iframe = (0,
|
|
13895
|
+
const iframe = (0, import_react92.useMemo)(
|
|
13734
13896
|
() => __spreadValues({
|
|
13735
13897
|
enabled: true,
|
|
13736
13898
|
waitForStyles: true
|
|
@@ -13756,7 +13918,7 @@ var Layout = ({ children }) => {
|
|
|
13756
13918
|
sidebarRef: rightSidebarRef,
|
|
13757
13919
|
handleResizeEnd: handleRightSidebarResizeEnd
|
|
13758
13920
|
} = useSidebarResize("right", dispatch);
|
|
13759
|
-
(0,
|
|
13921
|
+
(0, import_react92.useEffect)(() => {
|
|
13760
13922
|
if (!window.matchMedia("(min-width: 638px)").matches) {
|
|
13761
13923
|
dispatch({
|
|
13762
13924
|
type: "setUi",
|
|
@@ -13780,17 +13942,17 @@ var Layout = ({ children }) => {
|
|
|
13780
13942
|
};
|
|
13781
13943
|
}, []);
|
|
13782
13944
|
const overrides = useAppStore((s) => s.overrides);
|
|
13783
|
-
const CustomEditor = (0,
|
|
13945
|
+
const CustomEditor = (0, import_react92.useMemo)(
|
|
13784
13946
|
() => overrides.editor || DefaultOverride,
|
|
13785
13947
|
[overrides]
|
|
13786
13948
|
);
|
|
13787
|
-
const [mounted, setMounted] = (0,
|
|
13788
|
-
(0,
|
|
13949
|
+
const [mounted, setMounted] = (0, import_react92.useState)(false);
|
|
13950
|
+
(0, import_react92.useEffect)(() => {
|
|
13789
13951
|
setMounted(true);
|
|
13790
13952
|
}, []);
|
|
13791
13953
|
const ready = useAppStore((s) => s.status === "READY");
|
|
13792
13954
|
useMonitorHotkeys();
|
|
13793
|
-
(0,
|
|
13955
|
+
(0, import_react92.useEffect)(() => {
|
|
13794
13956
|
if (ready && iframe.enabled) {
|
|
13795
13957
|
const frameDoc = getFrame();
|
|
13796
13958
|
if (frameDoc) {
|
|
@@ -13802,10 +13964,10 @@ var Layout = ({ children }) => {
|
|
|
13802
13964
|
useDeleteHotkeys();
|
|
13803
13965
|
const layoutOptions = {};
|
|
13804
13966
|
if (leftWidth) {
|
|
13805
|
-
layoutOptions["--
|
|
13967
|
+
layoutOptions["--editor-user-left-side-bar-width"] = `${leftWidth}px`;
|
|
13806
13968
|
}
|
|
13807
13969
|
if (rightWidth) {
|
|
13808
|
-
layoutOptions["--
|
|
13970
|
+
layoutOptions["--editor-user-right-side-bar-width"] = `${rightWidth}px`;
|
|
13809
13971
|
}
|
|
13810
13972
|
const setUi = useAppStore((s) => s.setUi);
|
|
13811
13973
|
const currentPlugin = useAppStore((s) => {
|
|
@@ -13813,15 +13975,15 @@ var Layout = ({ children }) => {
|
|
|
13813
13975
|
return (_a = s.state.ui.plugin) == null ? void 0 : _a.current;
|
|
13814
13976
|
});
|
|
13815
13977
|
const appStoreApi = useAppStoreApi();
|
|
13816
|
-
const [mobilePanelHeightMode, setMobilePanelHeightMode] = (0,
|
|
13817
|
-
const [mobilePanelHeight, setMobilePanelHeight] = (0,
|
|
13978
|
+
const [mobilePanelHeightMode, setMobilePanelHeightMode] = (0, import_react92.useState)("toggle");
|
|
13979
|
+
const [mobilePanelHeight, setMobilePanelHeight] = (0, import_react92.useState)(
|
|
13818
13980
|
null
|
|
13819
13981
|
);
|
|
13820
|
-
const mobilePanelRef = (0,
|
|
13821
|
-
const isDraggingMobile = (0,
|
|
13822
|
-
const dragStartY = (0,
|
|
13823
|
-
const dragStartHeight = (0,
|
|
13824
|
-
const handleMobileDragStart = (0,
|
|
13982
|
+
const mobilePanelRef = (0, import_react92.useRef)(null);
|
|
13983
|
+
const isDraggingMobile = (0, import_react92.useRef)(false);
|
|
13984
|
+
const dragStartY = (0, import_react92.useRef)(0);
|
|
13985
|
+
const dragStartHeight = (0, import_react92.useRef)(0);
|
|
13986
|
+
const handleMobileDragStart = (0, import_react92.useCallback)(
|
|
13825
13987
|
(clientY) => {
|
|
13826
13988
|
isDraggingMobile.current = true;
|
|
13827
13989
|
dragStartY.current = clientY;
|
|
@@ -13832,7 +13994,7 @@ var Layout = ({ children }) => {
|
|
|
13832
13994
|
},
|
|
13833
13995
|
[]
|
|
13834
13996
|
);
|
|
13835
|
-
const handleMobileDragMove = (0,
|
|
13997
|
+
const handleMobileDragMove = (0, import_react92.useCallback)((clientY) => {
|
|
13836
13998
|
if (!isDraggingMobile.current) return;
|
|
13837
13999
|
const delta = dragStartY.current - clientY;
|
|
13838
14000
|
const viewportHeight = window.innerHeight;
|
|
@@ -13841,13 +14003,13 @@ var Layout = ({ children }) => {
|
|
|
13841
14003
|
const newH = Math.min(maxH, Math.max(minH, dragStartHeight.current + delta));
|
|
13842
14004
|
setMobilePanelHeight(newH);
|
|
13843
14005
|
}, []);
|
|
13844
|
-
const handleMobileDragEnd = (0,
|
|
14006
|
+
const handleMobileDragEnd = (0, import_react92.useCallback)(() => {
|
|
13845
14007
|
if (!isDraggingMobile.current) return;
|
|
13846
14008
|
isDraggingMobile.current = false;
|
|
13847
14009
|
document.body.style.userSelect = "";
|
|
13848
14010
|
document.body.style.touchAction = "";
|
|
13849
14011
|
}, []);
|
|
13850
|
-
(0,
|
|
14012
|
+
(0, import_react92.useEffect)(() => {
|
|
13851
14013
|
const onTouchMove = (e) => {
|
|
13852
14014
|
if (isDraggingMobile.current) {
|
|
13853
14015
|
e.preventDefault();
|
|
@@ -13873,26 +14035,26 @@ var Layout = ({ children }) => {
|
|
|
13873
14035
|
document.removeEventListener("mouseup", onMouseUp);
|
|
13874
14036
|
};
|
|
13875
14037
|
}, [handleMobileDragMove, handleMobileDragEnd]);
|
|
13876
|
-
const [theme, setTheme] = (0,
|
|
14038
|
+
const [theme, setTheme] = (0, import_react92.useState)(() => {
|
|
13877
14039
|
if (typeof window === "undefined") return "light";
|
|
13878
14040
|
const stored = window.localStorage.getItem("editor-theme");
|
|
13879
14041
|
if (stored === "light" || stored === "dark") return stored;
|
|
13880
14042
|
return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
|
|
13881
14043
|
});
|
|
13882
|
-
(0,
|
|
14044
|
+
(0, import_react92.useEffect)(() => {
|
|
13883
14045
|
if (typeof window === "undefined") return;
|
|
13884
14046
|
window.localStorage.setItem("editor-theme", theme);
|
|
13885
14047
|
}, [theme]);
|
|
13886
14048
|
const toggleTheme = () => {
|
|
13887
14049
|
setTheme((t) => t === "dark" ? "light" : "dark");
|
|
13888
14050
|
};
|
|
13889
|
-
const themeIcon = theme === "dark" ? /* @__PURE__ */ (0,
|
|
14051
|
+
const themeIcon = theme === "dark" ? /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Sun, { size: 18 }) : /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Moon, { size: 18 });
|
|
13890
14052
|
const themeLabel = theme === "dark" ? "Switch to light mode" : "Switch to dark mode";
|
|
13891
|
-
const hasLegacySideBarPlugin = (0,
|
|
14053
|
+
const hasLegacySideBarPlugin = (0, import_react92.useMemo)(
|
|
13892
14054
|
() => !!(plugins == null ? void 0 : plugins.find((p) => p.name === "legacy-side-bar")),
|
|
13893
14055
|
[plugins]
|
|
13894
14056
|
);
|
|
13895
|
-
const pluginItems = (0,
|
|
14057
|
+
const pluginItems = (0, import_react92.useMemo)(() => {
|
|
13896
14058
|
const details = {};
|
|
13897
14059
|
const defaultPlugins = [blocksPlugin(), outlinePlugin()];
|
|
13898
14060
|
const isLegacy = (plugin) => plugin.name === "legacy-side-bar" ? -1 : 0;
|
|
@@ -13911,7 +14073,7 @@ var Layout = ({ children }) => {
|
|
|
13911
14073
|
}
|
|
13912
14074
|
details[plugin.name] = {
|
|
13913
14075
|
label: (_a = plugin.label) != null ? _a : plugin.name,
|
|
13914
|
-
icon: (_b = plugin.icon) != null ? _b : /* @__PURE__ */ (0,
|
|
14076
|
+
icon: (_b = plugin.icon) != null ? _b : /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(ToyBrick, {}),
|
|
13915
14077
|
onClick: () => {
|
|
13916
14078
|
var _a2;
|
|
13917
14079
|
setMobilePanelHeightMode((_a2 = plugin.mobilePanelHeight) != null ? _a2 : "toggle");
|
|
@@ -13939,7 +14101,7 @@ var Layout = ({ children }) => {
|
|
|
13939
14101
|
});
|
|
13940
14102
|
return details;
|
|
13941
14103
|
}, [plugins, currentPlugin, appStoreApi, leftSideBarVisible]);
|
|
13942
|
-
(0,
|
|
14104
|
+
(0, import_react92.useEffect)(() => {
|
|
13943
14105
|
if (!currentPlugin) {
|
|
13944
14106
|
const names = Object.keys(pluginItems);
|
|
13945
14107
|
setUi({ plugin: { current: names[0] } });
|
|
@@ -13948,19 +14110,19 @@ var Layout = ({ children }) => {
|
|
|
13948
14110
|
const hasDesktopFieldsPlugin = pluginItems["fields"] && pluginItems["fields"].mobileOnly === false;
|
|
13949
14111
|
const mobilePanelStyle = {};
|
|
13950
14112
|
if (mobilePanelHeight && leftSideBarVisible) {
|
|
13951
|
-
mobilePanelStyle["--
|
|
14113
|
+
mobilePanelStyle["--editor-mobile-panel-height"] = `${mobilePanelHeight}px`;
|
|
13952
14114
|
}
|
|
13953
|
-
return /* @__PURE__ */ (0,
|
|
14115
|
+
return /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(
|
|
13954
14116
|
"div",
|
|
13955
14117
|
{
|
|
13956
|
-
className: `Editor ${
|
|
14118
|
+
className: `Editor ${getClassName43({
|
|
13957
14119
|
hidePlugins: hasLegacySideBarPlugin
|
|
13958
14120
|
})}`,
|
|
13959
14121
|
id: instanceId,
|
|
13960
14122
|
"data-theme": theme,
|
|
13961
14123
|
style: { height },
|
|
13962
14124
|
children: [
|
|
13963
|
-
/* @__PURE__ */ (0,
|
|
14125
|
+
/* @__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)(
|
|
13964
14126
|
"div",
|
|
13965
14127
|
{
|
|
13966
14128
|
className: getLayoutClassName({
|
|
@@ -13972,17 +14134,17 @@ var Layout = ({ children }) => {
|
|
|
13972
14134
|
mobilePanelCustomHeight: mobilePanelHeight !== null && leftSideBarVisible
|
|
13973
14135
|
}),
|
|
13974
14136
|
style: { height },
|
|
13975
|
-
children: /* @__PURE__ */ (0,
|
|
14137
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(
|
|
13976
14138
|
"div",
|
|
13977
14139
|
{
|
|
13978
14140
|
className: getLayoutClassName("inner"),
|
|
13979
14141
|
style: __spreadValues(__spreadValues({}, layoutOptions), mobilePanelStyle),
|
|
13980
14142
|
children: [
|
|
13981
|
-
/* @__PURE__ */ (0,
|
|
14143
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { className: getLayoutClassName("nav"), children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
13982
14144
|
Nav,
|
|
13983
14145
|
{
|
|
13984
14146
|
items: pluginItems,
|
|
13985
|
-
footer: /* @__PURE__ */ (0,
|
|
14147
|
+
footer: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
13986
14148
|
IconButton,
|
|
13987
14149
|
{
|
|
13988
14150
|
type: "button",
|
|
@@ -13993,19 +14155,19 @@ var Layout = ({ children }) => {
|
|
|
13993
14155
|
)
|
|
13994
14156
|
}
|
|
13995
14157
|
) }),
|
|
13996
|
-
/* @__PURE__ */ (0,
|
|
14158
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(
|
|
13997
14159
|
"div",
|
|
13998
14160
|
{
|
|
13999
14161
|
ref: mobilePanelRef,
|
|
14000
14162
|
className: getLayoutClassName("mobilePanel"),
|
|
14001
14163
|
children: [
|
|
14002
|
-
/* @__PURE__ */ (0,
|
|
14164
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
14003
14165
|
"div",
|
|
14004
14166
|
{
|
|
14005
14167
|
className: getLayoutClassName("mobileDragHandle"),
|
|
14006
14168
|
onTouchStart: (e) => handleMobileDragStart(e.touches[0].clientY),
|
|
14007
14169
|
onMouseDown: (e) => handleMobileDragStart(e.clientY),
|
|
14008
|
-
children: /* @__PURE__ */ (0,
|
|
14170
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
14009
14171
|
"div",
|
|
14010
14172
|
{
|
|
14011
14173
|
className: getLayoutClassName("mobileDragHandlePill")
|
|
@@ -14013,17 +14175,17 @@ var Layout = ({ children }) => {
|
|
|
14013
14175
|
)
|
|
14014
14176
|
}
|
|
14015
14177
|
),
|
|
14016
|
-
/* @__PURE__ */ (0,
|
|
14178
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
14017
14179
|
"div",
|
|
14018
14180
|
{
|
|
14019
14181
|
className: getLayoutClassName("mobilePanelContent"),
|
|
14020
14182
|
children: Object.entries(pluginItems).map(
|
|
14021
|
-
([id, { mobileOnly, render: Render2 }]) => /* @__PURE__ */ (0,
|
|
14183
|
+
([id, { mobileOnly, render: Render2 }]) => /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
14022
14184
|
PluginTab,
|
|
14023
14185
|
{
|
|
14024
14186
|
visible: currentPlugin === id,
|
|
14025
14187
|
mobileOnly,
|
|
14026
|
-
children: /* @__PURE__ */ (0,
|
|
14188
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Render2, {})
|
|
14027
14189
|
},
|
|
14028
14190
|
id
|
|
14029
14191
|
)
|
|
@@ -14033,7 +14195,7 @@ var Layout = ({ children }) => {
|
|
|
14033
14195
|
]
|
|
14034
14196
|
}
|
|
14035
14197
|
),
|
|
14036
|
-
/* @__PURE__ */ (0,
|
|
14198
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
14037
14199
|
Sidebar,
|
|
14038
14200
|
{
|
|
14039
14201
|
position: "left",
|
|
@@ -14042,20 +14204,20 @@ var Layout = ({ children }) => {
|
|
|
14042
14204
|
onResize: setLeftWidth,
|
|
14043
14205
|
onResizeEnd: handleLeftSidebarResizeEnd,
|
|
14044
14206
|
children: Object.entries(pluginItems).map(
|
|
14045
|
-
([id, { mobileOnly, render: Render2, label }]) => /* @__PURE__ */ (0,
|
|
14207
|
+
([id, { mobileOnly, render: Render2, label }]) => /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
14046
14208
|
PluginTab,
|
|
14047
14209
|
{
|
|
14048
14210
|
visible: currentPlugin === id,
|
|
14049
14211
|
mobileOnly,
|
|
14050
|
-
children: /* @__PURE__ */ (0,
|
|
14212
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Render2, {})
|
|
14051
14213
|
},
|
|
14052
14214
|
id
|
|
14053
14215
|
)
|
|
14054
14216
|
)
|
|
14055
14217
|
}
|
|
14056
14218
|
),
|
|
14057
|
-
/* @__PURE__ */ (0,
|
|
14058
|
-
!hasDesktopFieldsPlugin && /* @__PURE__ */ (0,
|
|
14219
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Canvas, {}),
|
|
14220
|
+
!hasDesktopFieldsPlugin && /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
14059
14221
|
Sidebar,
|
|
14060
14222
|
{
|
|
14061
14223
|
position: "right",
|
|
@@ -14063,7 +14225,7 @@ var Layout = ({ children }) => {
|
|
|
14063
14225
|
isVisible: rightSideBarVisible,
|
|
14064
14226
|
onResize: setRightWidth,
|
|
14065
14227
|
onResizeEnd: handleRightSidebarResizeEnd,
|
|
14066
|
-
children: /* @__PURE__ */ (0,
|
|
14228
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(FieldSideBar, {})
|
|
14067
14229
|
}
|
|
14068
14230
|
)
|
|
14069
14231
|
]
|
|
@@ -14071,19 +14233,19 @@ var Layout = ({ children }) => {
|
|
|
14071
14233
|
)
|
|
14072
14234
|
}
|
|
14073
14235
|
) }) }) }),
|
|
14074
|
-
/* @__PURE__ */ (0,
|
|
14236
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { id: "editor-portal-root", className: getClassName43("portal") })
|
|
14075
14237
|
]
|
|
14076
14238
|
}
|
|
14077
14239
|
);
|
|
14078
14240
|
};
|
|
14079
14241
|
|
|
14080
14242
|
// components/Editor/index.tsx
|
|
14081
|
-
var
|
|
14082
|
-
var propsContext = (0,
|
|
14243
|
+
var import_jsx_runtime93 = require("react/jsx-runtime");
|
|
14244
|
+
var propsContext = (0, import_react93.createContext)({});
|
|
14083
14245
|
function PropsProvider(props) {
|
|
14084
|
-
return /* @__PURE__ */ (0,
|
|
14246
|
+
return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(propsContext.Provider, { value: props, children: props.children });
|
|
14085
14247
|
}
|
|
14086
|
-
var usePropsContext = () => (0,
|
|
14248
|
+
var usePropsContext = () => (0, import_react93.useContext)(propsContext);
|
|
14087
14249
|
function EditorProvider({ children }) {
|
|
14088
14250
|
const {
|
|
14089
14251
|
config,
|
|
@@ -14102,14 +14264,14 @@ function EditorProvider({ children }) {
|
|
|
14102
14264
|
fullScreenCanvas,
|
|
14103
14265
|
_experimentalVirtualization
|
|
14104
14266
|
} = usePropsContext();
|
|
14105
|
-
const iframe = (0,
|
|
14267
|
+
const iframe = (0, import_react93.useMemo)(
|
|
14106
14268
|
() => __spreadValues({
|
|
14107
14269
|
enabled: true,
|
|
14108
14270
|
waitForStyles: true
|
|
14109
14271
|
}, _iframe),
|
|
14110
14272
|
[_iframe]
|
|
14111
14273
|
);
|
|
14112
|
-
const [generatedAppState] = (0,
|
|
14274
|
+
const [generatedAppState] = (0, import_react93.useState)(() => {
|
|
14113
14275
|
var _a, _b, _c, _d, _e, _f;
|
|
14114
14276
|
const initial = __spreadValues(__spreadValues({}, defaultAppState.ui), initialUi);
|
|
14115
14277
|
let clientUiState = {};
|
|
@@ -14161,7 +14323,7 @@ function EditorProvider({ children }) {
|
|
|
14161
14323
|
return walkAppState(newAppState, config);
|
|
14162
14324
|
});
|
|
14163
14325
|
const { appendData = true } = _initialHistory || {};
|
|
14164
|
-
const [blendedHistories] = (0,
|
|
14326
|
+
const [blendedHistories] = (0, import_react93.useState)(
|
|
14165
14327
|
[
|
|
14166
14328
|
...(_initialHistory == null ? void 0 : _initialHistory.histories) || [],
|
|
14167
14329
|
...appendData ? [{ state: generatedAppState }] : []
|
|
@@ -14175,7 +14337,7 @@ function EditorProvider({ children }) {
|
|
|
14175
14337
|
});
|
|
14176
14338
|
})
|
|
14177
14339
|
);
|
|
14178
|
-
const initialHistoryIndex = (0,
|
|
14340
|
+
const initialHistoryIndex = (0, import_react93.useMemo)(() => {
|
|
14179
14341
|
if ((_initialHistory == null ? void 0 : _initialHistory.index) !== void 0 && (_initialHistory == null ? void 0 : _initialHistory.index) >= 0 && (_initialHistory == null ? void 0 : _initialHistory.index) < blendedHistories.length) {
|
|
14180
14342
|
return _initialHistory == null ? void 0 : _initialHistory.index;
|
|
14181
14343
|
}
|
|
@@ -14186,7 +14348,7 @@ function EditorProvider({ children }) {
|
|
|
14186
14348
|
overrides,
|
|
14187
14349
|
plugins
|
|
14188
14350
|
});
|
|
14189
|
-
const loadedFieldTransforms = (0,
|
|
14351
|
+
const loadedFieldTransforms = (0, import_react93.useMemo)(() => {
|
|
14190
14352
|
const _plugins = plugins || [];
|
|
14191
14353
|
const pluginFieldTransforms = _plugins.reduce(
|
|
14192
14354
|
(acc, plugin) => __spreadValues(__spreadValues({}, acc), plugin.fieldTransforms),
|
|
@@ -14195,7 +14357,7 @@ function EditorProvider({ children }) {
|
|
|
14195
14357
|
return __spreadValues(__spreadValues({}, pluginFieldTransforms), fieldTransforms);
|
|
14196
14358
|
}, [fieldTransforms, plugins]);
|
|
14197
14359
|
const instanceId = useSafeId();
|
|
14198
|
-
const generateAppStore = (0,
|
|
14360
|
+
const generateAppStore = (0, import_react93.useCallback)(
|
|
14199
14361
|
(state) => {
|
|
14200
14362
|
return {
|
|
14201
14363
|
instanceId,
|
|
@@ -14227,15 +14389,15 @@ function EditorProvider({ children }) {
|
|
|
14227
14389
|
loadedFieldTransforms
|
|
14228
14390
|
]
|
|
14229
14391
|
);
|
|
14230
|
-
const [appStore] = (0,
|
|
14392
|
+
const [appStore] = (0, import_react93.useState)(
|
|
14231
14393
|
() => createAppStore(generateAppStore(initialAppState))
|
|
14232
14394
|
);
|
|
14233
|
-
(0,
|
|
14395
|
+
(0, import_react93.useEffect)(() => {
|
|
14234
14396
|
if (process.env.NODE_ENV !== "production") {
|
|
14235
14397
|
window.__PUCK_INTERNAL_DO_NOT_USE = { appStore };
|
|
14236
14398
|
}
|
|
14237
14399
|
}, [appStore]);
|
|
14238
|
-
(0,
|
|
14400
|
+
(0, import_react93.useEffect)(() => {
|
|
14239
14401
|
const state = appStore.getState().state;
|
|
14240
14402
|
appStore.setState(__spreadValues({}, generateAppStore(state)));
|
|
14241
14403
|
}, [generateAppStore]);
|
|
@@ -14244,8 +14406,8 @@ function EditorProvider({ children }) {
|
|
|
14244
14406
|
index: initialHistoryIndex,
|
|
14245
14407
|
initialAppState
|
|
14246
14408
|
});
|
|
14247
|
-
const previousData = (0,
|
|
14248
|
-
(0,
|
|
14409
|
+
const previousData = (0, import_react93.useRef)(null);
|
|
14410
|
+
(0, import_react93.useEffect)(() => {
|
|
14249
14411
|
return appStore.subscribe(
|
|
14250
14412
|
(s) => s.state.data,
|
|
14251
14413
|
(data) => {
|
|
@@ -14259,16 +14421,16 @@ function EditorProvider({ children }) {
|
|
|
14259
14421
|
}, [onChange, config]);
|
|
14260
14422
|
useRegisterPermissionsSlice(appStore, permissions);
|
|
14261
14423
|
const uEditorStore = useRegisterUseEditorStore(appStore);
|
|
14262
|
-
(0,
|
|
14424
|
+
(0, import_react93.useEffect)(() => {
|
|
14263
14425
|
const { resolveAndCommitData } = appStore.getState();
|
|
14264
14426
|
setTimeout(() => {
|
|
14265
14427
|
resolveAndCommitData();
|
|
14266
14428
|
}, 0);
|
|
14267
14429
|
}, []);
|
|
14268
|
-
return /* @__PURE__ */ (0,
|
|
14430
|
+
return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(appStoreContext.Provider, { value: appStore, children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(UseEditorStoreContext.Provider, { value: uEditorStore, children }) });
|
|
14269
14431
|
}
|
|
14270
14432
|
function Editor4(props) {
|
|
14271
|
-
return /* @__PURE__ */ (0,
|
|
14433
|
+
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 }) })) }));
|
|
14272
14434
|
}
|
|
14273
14435
|
Editor4.Components = Components;
|
|
14274
14436
|
Editor4.Fields = Fields;
|
|
@@ -14554,12 +14716,12 @@ init_walk_tree();
|
|
|
14554
14716
|
|
|
14555
14717
|
// plugins/legacy-side-bar/index.tsx
|
|
14556
14718
|
init_react_import();
|
|
14557
|
-
var
|
|
14719
|
+
var import_jsx_runtime94 = require("react/jsx-runtime");
|
|
14558
14720
|
var legacySideBarPlugin = () => ({
|
|
14559
14721
|
name: "legacy-side-bar",
|
|
14560
|
-
render: () => /* @__PURE__ */ (0,
|
|
14561
|
-
/* @__PURE__ */ (0,
|
|
14562
|
-
/* @__PURE__ */ (0,
|
|
14722
|
+
render: () => /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { style: { overflowY: "auto" }, children: [
|
|
14723
|
+
/* @__PURE__ */ (0, import_jsx_runtime94.jsx)(SidebarSection, { title: "Components", noBorderTop: true, children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(Components, {}) }),
|
|
14724
|
+
/* @__PURE__ */ (0, import_jsx_runtime94.jsx)(SidebarSection, { title: "Outline", children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(Outline, {}) })
|
|
14563
14725
|
] })
|
|
14564
14726
|
});
|
|
14565
14727
|
// Annotate the CommonJS export names for ESM import in node:
|