@wordpress/widget-dashboard 0.2.0 → 0.3.0
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/CHANGELOG.md +30 -0
- package/README.md +29 -16
- package/build/components/actions/actions.cjs +6 -23
- package/build/components/actions/actions.cjs.map +3 -3
- package/build/components/commands/commands.cjs +1 -60
- package/build/components/commands/commands.cjs.map +2 -2
- package/build/{utils/grid-model-change → components/widget-attribute-controls}/index.cjs +7 -9
- package/build/components/widget-attribute-controls/index.cjs.map +7 -0
- package/build/components/widget-attribute-controls/widget-attribute-controls.cjs +93 -0
- package/build/components/widget-attribute-controls/widget-attribute-controls.cjs.map +7 -0
- package/build/components/widget-chrome/widget-chrome.cjs +28 -69
- package/build/components/widget-chrome/widget-chrome.cjs.map +2 -2
- package/build/components/{layout-settings → widget-frame}/index.cjs +9 -7
- package/build/components/widget-frame/index.cjs.map +7 -0
- package/build/components/widget-frame/widget-frame.cjs +193 -0
- package/build/components/widget-frame/widget-frame.cjs.map +7 -0
- package/build/{utils/migrate-layout → components/widget-header}/index.cjs +7 -7
- package/build/components/widget-header/index.cjs.map +7 -0
- package/build/components/widget-header/widget-header-infotip.cjs +166 -0
- package/build/components/widget-header/widget-header-infotip.cjs.map +7 -0
- package/build/components/widget-header/widget-header.cjs +176 -0
- package/build/components/widget-header/widget-header.cjs.map +7 -0
- package/build/components/{widget-settings/utils/get-admin-menu-inset.cjs → widget-layout-controls/index.cjs} +8 -18
- package/build/components/widget-layout-controls/index.cjs.map +7 -0
- package/build/components/{widgets/widget-layout-toolbar.cjs → widget-layout-controls/widget-layout-controls.cjs} +9 -100
- package/build/components/widget-layout-controls/widget-layout-controls.cjs.map +7 -0
- package/build/components/widget-picker/widget-picker.cjs +5 -93
- package/build/components/widget-picker/widget-picker.cjs.map +3 -3
- package/build/components/widget-preview-chrome/index.cjs +31 -0
- package/build/components/widget-preview-chrome/index.cjs.map +7 -0
- package/build/components/{widget-settings/widget-settings-toolbar.cjs → widget-preview-chrome/widget-preview-chrome.cjs} +41 -23
- package/build/components/widget-preview-chrome/widget-preview-chrome.cjs.map +7 -0
- package/build/components/widget-settings/index.cjs +3 -3
- package/build/components/widget-settings/index.cjs.map +1 -1
- package/build/components/widget-settings/utils/index.cjs +0 -3
- package/build/components/widget-settings/utils/index.cjs.map +2 -2
- package/build/components/widget-settings/widget-settings-trigger.cjs +22 -28
- package/build/components/widget-settings/widget-settings-trigger.cjs.map +2 -2
- package/build/components/widget-settings/widget-settings.cjs +40 -57
- package/build/components/widget-settings/widget-settings.cjs.map +2 -2
- package/build/components/widget-toolbar/widget-toolbar.cjs +7 -4
- package/build/components/widget-toolbar/widget-toolbar.cjs.map +2 -2
- package/build/components/widgets/widget-resize-handle.cjs +4 -4
- package/build/components/widgets/widget-resize-handle.cjs.map +2 -2
- package/build/components/widgets/widgets.cjs +18 -11
- package/build/components/widgets/widgets.cjs.map +2 -2
- package/build/context/dashboard-context.cjs +31 -80
- package/build/context/dashboard-context.cjs.map +2 -2
- package/build/context/ui-context.cjs +2 -18
- package/build/context/ui-context.cjs.map +2 -2
- package/build/types.cjs.map +1 -1
- package/build/utils/index.cjs +2 -5
- package/build/utils/index.cjs.map +2 -2
- package/build/widget-dashboard.cjs +0 -4
- package/build/widget-dashboard.cjs.map +2 -2
- package/build-module/components/actions/actions.mjs +7 -24
- package/build-module/components/actions/actions.mjs.map +2 -2
- package/build-module/components/commands/commands.mjs +2 -67
- package/build-module/components/commands/commands.mjs.map +2 -2
- package/build-module/components/widget-attribute-controls/index.mjs +6 -0
- package/build-module/components/widget-attribute-controls/index.mjs.map +7 -0
- package/build-module/components/widget-attribute-controls/widget-attribute-controls.mjs +68 -0
- package/build-module/components/widget-attribute-controls/widget-attribute-controls.mjs.map +7 -0
- package/build-module/components/widget-chrome/widget-chrome.mjs +29 -76
- package/build-module/components/widget-chrome/widget-chrome.mjs.map +2 -2
- package/build-module/components/widget-frame/index.mjs +7 -0
- package/build-module/components/widget-frame/index.mjs.map +7 -0
- package/build-module/components/widget-frame/widget-frame.mjs +157 -0
- package/build-module/components/widget-frame/widget-frame.mjs.map +7 -0
- package/build-module/components/widget-header/index.mjs +6 -0
- package/build-module/components/widget-header/index.mjs.map +7 -0
- package/build-module/components/widget-header/widget-header-infotip.mjs +141 -0
- package/build-module/components/widget-header/widget-header-infotip.mjs.map +7 -0
- package/build-module/components/widget-header/widget-header.mjs +141 -0
- package/build-module/components/widget-header/widget-header.mjs.map +7 -0
- package/build-module/components/widget-layout-controls/index.mjs +6 -0
- package/build-module/components/widget-layout-controls/index.mjs.map +7 -0
- package/build-module/components/widget-layout-controls/widget-layout-controls.mjs +90 -0
- package/build-module/components/widget-layout-controls/widget-layout-controls.mjs.map +7 -0
- package/build-module/components/widget-picker/widget-picker.mjs +6 -94
- package/build-module/components/widget-picker/widget-picker.mjs.map +3 -3
- package/build-module/components/widget-preview-chrome/index.mjs +6 -0
- package/build-module/components/widget-preview-chrome/index.mjs.map +7 -0
- package/build-module/components/{widget-settings/widget-settings-toolbar.mjs → widget-preview-chrome/widget-preview-chrome.mjs} +37 -19
- package/build-module/components/widget-preview-chrome/widget-preview-chrome.mjs.map +7 -0
- package/build-module/components/widget-settings/index.mjs +2 -2
- package/build-module/components/widget-settings/index.mjs.map +1 -1
- package/build-module/components/widget-settings/utils/index.mjs +0 -2
- package/build-module/components/widget-settings/utils/index.mjs.map +2 -2
- package/build-module/components/widget-settings/widget-settings-trigger.mjs +23 -29
- package/build-module/components/widget-settings/widget-settings-trigger.mjs.map +2 -2
- package/build-module/components/widget-settings/widget-settings.mjs +40 -57
- package/build-module/components/widget-settings/widget-settings.mjs.map +2 -2
- package/build-module/components/widget-toolbar/widget-toolbar.mjs +7 -4
- package/build-module/components/widget-toolbar/widget-toolbar.mjs.map +2 -2
- package/build-module/components/widgets/widget-resize-handle.mjs +4 -4
- package/build-module/components/widgets/widget-resize-handle.mjs.map +2 -2
- package/build-module/components/widgets/widgets.mjs +18 -11
- package/build-module/components/widgets/widgets.mjs.map +2 -2
- package/build-module/context/dashboard-context.mjs +31 -80
- package/build-module/context/dashboard-context.mjs.map +2 -2
- package/build-module/context/ui-context.mjs +2 -18
- package/build-module/context/ui-context.mjs.map +2 -2
- package/build-module/types.mjs.map +1 -1
- package/build-module/utils/index.mjs +1 -3
- package/build-module/utils/index.mjs.map +2 -2
- package/build-module/widget-dashboard.mjs +0 -4
- package/build-module/widget-dashboard.mjs.map +2 -2
- package/build-types/components/actions/actions.d.ts.map +1 -1
- package/build-types/components/commands/commands.d.ts.map +1 -1
- package/build-types/components/commands/use-pending-when-edit-mode.d.ts +1 -1
- package/build-types/components/commands/use-pending-when-edit-mode.d.ts.map +1 -1
- package/build-types/components/no-widgets-state/no-widgets-state.d.ts +1 -1
- package/build-types/components/no-widgets-state/no-widgets-state.d.ts.map +1 -1
- package/build-types/components/widget-attribute-controls/index.d.ts +2 -0
- package/build-types/components/widget-attribute-controls/index.d.ts.map +1 -0
- package/build-types/components/widget-attribute-controls/widget-attribute-controls.d.ts +23 -0
- package/build-types/components/widget-attribute-controls/widget-attribute-controls.d.ts.map +1 -0
- package/build-types/components/widget-chrome/widget-chrome.d.ts +8 -8
- package/build-types/components/widget-chrome/widget-chrome.d.ts.map +1 -1
- package/build-types/components/widget-frame/index.d.ts +3 -0
- package/build-types/components/widget-frame/index.d.ts.map +1 -0
- package/build-types/components/widget-frame/widget-frame.d.ts +25 -0
- package/build-types/components/widget-frame/widget-frame.d.ts.map +1 -0
- package/build-types/components/widget-header/index.d.ts +3 -0
- package/build-types/components/widget-header/index.d.ts.map +1 -0
- package/build-types/components/widget-header/widget-header-infotip.d.ts +20 -0
- package/build-types/components/widget-header/widget-header-infotip.d.ts.map +1 -0
- package/build-types/components/widget-header/widget-header.d.ts +38 -0
- package/build-types/components/widget-header/widget-header.d.ts.map +1 -0
- package/build-types/components/widget-layout-controls/index.d.ts +3 -0
- package/build-types/components/widget-layout-controls/index.d.ts.map +1 -0
- package/build-types/components/widget-layout-controls/widget-layout-controls.d.ts +14 -0
- package/build-types/components/widget-layout-controls/widget-layout-controls.d.ts.map +1 -0
- package/build-types/components/widget-picker/widget-picker.d.ts +1 -1
- package/build-types/components/widget-picker/widget-picker.d.ts.map +1 -1
- package/build-types/components/widget-preview-chrome/index.d.ts +3 -0
- package/build-types/components/widget-preview-chrome/index.d.ts.map +1 -0
- package/build-types/components/widget-preview-chrome/widget-preview-chrome.d.ts +15 -0
- package/build-types/components/widget-preview-chrome/widget-preview-chrome.d.ts.map +1 -0
- package/build-types/components/widget-settings/index.d.ts +2 -2
- package/build-types/components/widget-settings/utils/index.d.ts +0 -1
- package/build-types/components/widget-settings/utils/index.d.ts.map +1 -1
- package/build-types/components/widget-settings/widget-settings-trigger.d.ts +7 -5
- package/build-types/components/widget-settings/widget-settings-trigger.d.ts.map +1 -1
- package/build-types/components/widget-settings/widget-settings.d.ts +5 -4
- package/build-types/components/widget-settings/widget-settings.d.ts.map +1 -1
- package/build-types/components/widget-toolbar/widget-toolbar.d.ts +10 -7
- package/build-types/components/widget-toolbar/widget-toolbar.d.ts.map +1 -1
- package/build-types/components/widgets/widgets.d.ts.map +1 -1
- package/build-types/context/dashboard-context.d.ts +23 -40
- package/build-types/context/dashboard-context.d.ts.map +1 -1
- package/build-types/context/ui-context.d.ts +0 -18
- package/build-types/context/ui-context.d.ts.map +1 -1
- package/build-types/context/widget-context.d.ts +1 -1
- package/build-types/context/widget-context.d.ts.map +1 -1
- package/build-types/types.d.ts +9 -15
- package/build-types/types.d.ts.map +1 -1
- package/build-types/utils/index.d.ts +0 -1
- package/build-types/utils/index.d.ts.map +1 -1
- package/build-types/widget-dashboard.d.ts +5 -5
- package/build-types/widget-dashboard.d.ts.map +1 -1
- package/package.json +20 -20
- package/src/components/actions/actions.module.css +7 -7
- package/src/components/actions/actions.tsx +5 -25
- package/src/components/commands/commands.tsx +3 -70
- package/src/components/widget-attribute-controls/index.ts +1 -0
- package/src/components/widget-attribute-controls/widget-attribute-controls.tsx +108 -0
- package/src/components/widget-chrome/widget-chrome.module.css +6 -71
- package/src/components/widget-chrome/widget-chrome.tsx +31 -136
- package/src/components/widget-frame/index.ts +2 -0
- package/src/components/widget-frame/widget-frame.module.css +17 -0
- package/src/components/widget-frame/widget-frame.tsx +138 -0
- package/src/components/widget-header/index.ts +2 -0
- package/src/components/widget-header/widget-header-infotip.tsx +82 -0
- package/src/components/widget-header/widget-header.module.css +59 -0
- package/src/components/widget-header/widget-header.tsx +104 -0
- package/src/components/widget-layout-controls/index.ts +2 -0
- package/src/components/{widgets/widget-layout-toolbar.tsx → widget-layout-controls/widget-layout-controls.tsx} +12 -13
- package/src/components/widget-picker/widget-picker.tsx +5 -10
- package/src/components/widget-preview-chrome/index.ts +2 -0
- package/src/components/widget-preview-chrome/widget-preview-chrome.module.css +22 -0
- package/src/components/widget-preview-chrome/widget-preview-chrome.tsx +65 -0
- package/src/components/widget-settings/index.ts +2 -2
- package/src/components/widget-settings/utils/index.ts +0 -1
- package/src/components/widget-settings/widget-settings-trigger.tsx +39 -44
- package/src/components/widget-settings/widget-settings.tsx +10 -28
- package/src/components/widget-toolbar/widget-toolbar.module.css +13 -10
- package/src/components/widget-toolbar/widget-toolbar.tsx +14 -8
- package/src/components/widgets/widget-resize-handle.module.css +21 -21
- package/src/components/widgets/widget-resize-handle.tsx +2 -2
- package/src/components/widgets/widgets.module.css +20 -11
- package/src/components/widgets/widgets.tsx +33 -10
- package/src/context/dashboard-context.tsx +70 -133
- package/src/context/ui-context.tsx +1 -39
- package/src/test/actions.test.tsx +7 -77
- package/src/test/commands.test.tsx +6 -45
- package/src/test/staging.test.tsx +82 -144
- package/src/test/widget-dashboard.test.tsx +24 -0
- package/src/types.ts +9 -16
- package/src/utils/index.ts +0 -1
- package/src/widget-dashboard.tsx +4 -8
- package/build/components/layout-settings/index.cjs.map +0 -7
- package/build/components/layout-settings/layout-model-edit-field/index.cjs +0 -186
- package/build/components/layout-settings/layout-model-edit-field/index.cjs.map +0 -7
- package/build/components/layout-settings/layout-model-edit-field/thumbnail-grid.cjs +0 -53
- package/build/components/layout-settings/layout-model-edit-field/thumbnail-grid.cjs.map +0 -7
- package/build/components/layout-settings/layout-model-edit-field/thumbnail-masonry.cjs +0 -53
- package/build/components/layout-settings/layout-model-edit-field/thumbnail-masonry.cjs.map +0 -7
- package/build/components/layout-settings/layout-settings.cjs +0 -207
- package/build/components/layout-settings/layout-settings.cjs.map +0 -7
- package/build/components/widget-settings/utils/get-admin-menu-inset.cjs.map +0 -7
- package/build/components/widget-settings/widget-settings-toolbar.cjs.map +0 -7
- package/build/components/widgets/widget-layout-toolbar.cjs.map +0 -7
- package/build/utils/grid-model-change/grid-model-change.cjs +0 -56
- package/build/utils/grid-model-change/grid-model-change.cjs.map +0 -7
- package/build/utils/grid-model-change/index.cjs.map +0 -7
- package/build/utils/migrate-layout/index.cjs.map +0 -7
- package/build/utils/migrate-layout/migrate-layout.cjs +0 -94
- package/build/utils/migrate-layout/migrate-layout.cjs.map +0 -7
- package/build-module/components/layout-settings/index.mjs +0 -6
- package/build-module/components/layout-settings/index.mjs.map +0 -7
- package/build-module/components/layout-settings/layout-model-edit-field/index.mjs +0 -151
- package/build-module/components/layout-settings/layout-model-edit-field/index.mjs.map +0 -7
- package/build-module/components/layout-settings/layout-model-edit-field/thumbnail-grid.mjs +0 -28
- package/build-module/components/layout-settings/layout-model-edit-field/thumbnail-grid.mjs.map +0 -7
- package/build-module/components/layout-settings/layout-model-edit-field/thumbnail-masonry.mjs +0 -28
- package/build-module/components/layout-settings/layout-model-edit-field/thumbnail-masonry.mjs.map +0 -7
- package/build-module/components/layout-settings/layout-settings.mjs +0 -187
- package/build-module/components/layout-settings/layout-settings.mjs.map +0 -7
- package/build-module/components/widget-settings/utils/get-admin-menu-inset.mjs +0 -16
- package/build-module/components/widget-settings/utils/get-admin-menu-inset.mjs.map +0 -7
- package/build-module/components/widget-settings/widget-settings-toolbar.mjs.map +0 -7
- package/build-module/components/widgets/widget-layout-toolbar.mjs +0 -181
- package/build-module/components/widgets/widget-layout-toolbar.mjs.map +0 -7
- package/build-module/utils/grid-model-change/grid-model-change.mjs +0 -30
- package/build-module/utils/grid-model-change/grid-model-change.mjs.map +0 -7
- package/build-module/utils/grid-model-change/index.mjs +0 -7
- package/build-module/utils/grid-model-change/index.mjs.map +0 -7
- package/build-module/utils/migrate-layout/index.mjs +0 -6
- package/build-module/utils/migrate-layout/index.mjs.map +0 -7
- package/build-module/utils/migrate-layout/migrate-layout.mjs +0 -69
- package/build-module/utils/migrate-layout/migrate-layout.mjs.map +0 -7
- package/build-types/components/layout-settings/index.d.ts +0 -2
- package/build-types/components/layout-settings/index.d.ts.map +0 -1
- package/build-types/components/layout-settings/layout-model-edit-field/index.d.ts +0 -17
- package/build-types/components/layout-settings/layout-model-edit-field/index.d.ts.map +0 -1
- package/build-types/components/layout-settings/layout-model-edit-field/thumbnail-grid.d.ts +0 -6
- package/build-types/components/layout-settings/layout-model-edit-field/thumbnail-grid.d.ts.map +0 -1
- package/build-types/components/layout-settings/layout-model-edit-field/thumbnail-masonry.d.ts +0 -6
- package/build-types/components/layout-settings/layout-model-edit-field/thumbnail-masonry.d.ts.map +0 -1
- package/build-types/components/layout-settings/layout-settings.d.ts +0 -14
- package/build-types/components/layout-settings/layout-settings.d.ts.map +0 -1
- package/build-types/components/widget-settings/utils/get-admin-menu-inset.d.ts +0 -17
- package/build-types/components/widget-settings/utils/get-admin-menu-inset.d.ts.map +0 -1
- package/build-types/components/widget-settings/widget-settings-toolbar.d.ts +0 -20
- package/build-types/components/widget-settings/widget-settings-toolbar.d.ts.map +0 -1
- package/build-types/components/widgets/widget-layout-toolbar.d.ts +0 -14
- package/build-types/components/widgets/widget-layout-toolbar.d.ts.map +0 -1
- package/build-types/utils/grid-model-change/grid-model-change.d.ts +0 -20
- package/build-types/utils/grid-model-change/grid-model-change.d.ts.map +0 -1
- package/build-types/utils/grid-model-change/index.d.ts +0 -2
- package/build-types/utils/grid-model-change/index.d.ts.map +0 -1
- package/build-types/utils/migrate-layout/index.d.ts +0 -2
- package/build-types/utils/migrate-layout/index.d.ts.map +0 -1
- package/build-types/utils/migrate-layout/migrate-layout.d.ts +0 -36
- package/build-types/utils/migrate-layout/migrate-layout.d.ts.map +0 -1
- package/src/components/layout-settings/index.ts +0 -1
- package/src/components/layout-settings/layout-model-edit-field/index.tsx +0 -98
- package/src/components/layout-settings/layout-model-edit-field/style.module.css +0 -34
- package/src/components/layout-settings/layout-model-edit-field/thumbnail-grid.tsx +0 -28
- package/src/components/layout-settings/layout-model-edit-field/thumbnail-masonry.tsx +0 -28
- package/src/components/layout-settings/layout-settings.tsx +0 -217
- package/src/components/widget-picker/widget-picker.module.css +0 -11
- package/src/components/widget-settings/utils/get-admin-menu-inset.ts +0 -30
- package/src/components/widget-settings/widget-settings-toolbar.module.css +0 -25
- package/src/components/widget-settings/widget-settings-toolbar.tsx +0 -45
- package/src/components/widgets/widget-layout-toolbar.module.css +0 -6
- package/src/utils/grid-model-change/grid-model-change.ts +0 -53
- package/src/utils/grid-model-change/index.ts +0 -1
- package/src/utils/migrate-layout/index.ts +0 -1
- package/src/utils/migrate-layout/migrate-layout.ts +0 -156
- package/src/utils/migrate-layout/test/migrate-layout.test.ts +0 -114
|
@@ -35,9 +35,9 @@ __export(dashboard_context_exports, {
|
|
|
35
35
|
});
|
|
36
36
|
module.exports = __toCommonJS(dashboard_context_exports);
|
|
37
37
|
var import_es6 = __toESM(require("fast-deep-equal/es6/index.js"));
|
|
38
|
+
var import_compose = require("@wordpress/compose");
|
|
38
39
|
var import_element = require("@wordpress/element");
|
|
39
40
|
var import_default_grid = require("../utils/default-grid/index.cjs");
|
|
40
|
-
var import_grid_model_change = require("../utils/grid-model-change/index.cjs");
|
|
41
41
|
var import_normalize_grid_settings = require("../utils/normalize-grid-settings/index.cjs");
|
|
42
42
|
var import_row_height_presets = require("../utils/row-height-presets/index.cjs");
|
|
43
43
|
var import_types = require("../types.cjs");
|
|
@@ -53,6 +53,7 @@ var DEFAULT_RESOLVE_WIDGET_MODULE = (moduleId) => import(
|
|
|
53
53
|
/* webpackIgnore: true */
|
|
54
54
|
moduleId
|
|
55
55
|
);
|
|
56
|
+
var AUTO_SAVE_DELAY_MS = 5e3;
|
|
56
57
|
function canonicalize(layout) {
|
|
57
58
|
const indexed = layout.map((widget, index) => ({
|
|
58
59
|
widget,
|
|
@@ -87,21 +88,16 @@ function WidgetDashboardProvider({
|
|
|
87
88
|
onEditChange,
|
|
88
89
|
resolveWidgetModule = DEFAULT_RESOLVE_WIDGET_MODULE,
|
|
89
90
|
gridSettings: committedGridSettings = import_default_grid.DEFAULT_GRID,
|
|
90
|
-
onGridSettingsChange,
|
|
91
91
|
children
|
|
92
92
|
}) {
|
|
93
93
|
const [stagingLayout, setStagingLayout] = (0, import_element.useState)(committedLayout);
|
|
94
94
|
(0, import_element.useEffect)(() => {
|
|
95
95
|
setStagingLayout(committedLayout);
|
|
96
96
|
}, [committedLayout]);
|
|
97
|
-
const
|
|
98
|
-
() => (
|
|
97
|
+
const gridSettings = (0, import_element.useMemo)(
|
|
98
|
+
() => resolveGridSettings(committedGridSettings),
|
|
99
|
+
[committedGridSettings]
|
|
99
100
|
);
|
|
100
|
-
(0, import_element.useEffect)(() => {
|
|
101
|
-
setStagingGridSettings(
|
|
102
|
-
(0, import_normalize_grid_settings.normalizeGridSettings)(committedGridSettings, import_row_height_presets.DEFAULT_ROW_HEIGHT)
|
|
103
|
-
);
|
|
104
|
-
}, [committedGridSettings]);
|
|
105
101
|
const hasLayoutChanges = (0, import_element.useMemo)(
|
|
106
102
|
() => !(0, import_es6.default)(
|
|
107
103
|
canonicalize(committedLayout),
|
|
@@ -109,85 +105,43 @@ function WidgetDashboardProvider({
|
|
|
109
105
|
),
|
|
110
106
|
[committedLayout, stagingLayout]
|
|
111
107
|
);
|
|
112
|
-
const
|
|
113
|
-
() => !(0, import_es6.default)(committedGridSettings, stagingGridSettings),
|
|
114
|
-
[committedGridSettings, stagingGridSettings]
|
|
115
|
-
);
|
|
116
|
-
const hasUncommittedChanges = hasLayoutChanges || hasGridSettingsChanges;
|
|
108
|
+
const hasUncommittedChanges = hasLayoutChanges;
|
|
117
109
|
const commit = (0, import_element.useCallback)(
|
|
118
110
|
(options) => {
|
|
119
111
|
if (hasLayoutChanges) {
|
|
120
112
|
onLayoutChange(canonicalize(stagingLayout));
|
|
121
113
|
}
|
|
122
|
-
if (hasGridSettingsChanges) {
|
|
123
|
-
onGridSettingsChange?.(
|
|
124
|
-
(0, import_normalize_grid_settings.normalizeGridSettings)(
|
|
125
|
-
stagingGridSettings,
|
|
126
|
-
import_row_height_presets.DEFAULT_ROW_HEIGHT
|
|
127
|
-
)
|
|
128
|
-
);
|
|
129
|
-
}
|
|
130
114
|
if (options?.exitEditMode !== false) {
|
|
131
115
|
onEditChange?.(false);
|
|
132
116
|
}
|
|
133
117
|
},
|
|
134
|
-
[
|
|
135
|
-
hasLayoutChanges,
|
|
136
|
-
hasGridSettingsChanges,
|
|
137
|
-
onLayoutChange,
|
|
138
|
-
onGridSettingsChange,
|
|
139
|
-
stagingLayout,
|
|
140
|
-
stagingGridSettings,
|
|
141
|
-
onEditChange
|
|
142
|
-
]
|
|
118
|
+
[hasLayoutChanges, onLayoutChange, stagingLayout, onEditChange]
|
|
143
119
|
);
|
|
144
|
-
const
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
}
|
|
149
|
-
setStagingGridSettings(committedGridSettings);
|
|
150
|
-
if (options?.exitEditMode !== false) {
|
|
151
|
-
onEditChange?.(false);
|
|
152
|
-
}
|
|
153
|
-
},
|
|
154
|
-
[committedLayout, committedGridSettings, onEditChange]
|
|
120
|
+
const publishAutoSave = (0, import_compose.useEvent)(() => commit({ exitEditMode: false }));
|
|
121
|
+
const scheduleAutoSave = (0, import_element.useMemo)(
|
|
122
|
+
() => (0, import_compose.debounce)(publishAutoSave, AUTO_SAVE_DELAY_MS),
|
|
123
|
+
[publishAutoSave]
|
|
155
124
|
);
|
|
156
|
-
const
|
|
157
|
-
(
|
|
158
|
-
|
|
159
|
-
layout: stagingLayout,
|
|
160
|
-
gridSettings: stagingGridSettings,
|
|
161
|
-
targetModel
|
|
162
|
-
});
|
|
163
|
-
if (!next) {
|
|
164
|
-
return;
|
|
165
|
-
}
|
|
166
|
-
setStagingLayout(next.layout);
|
|
167
|
-
setStagingGridSettings(next.gridSettings);
|
|
168
|
-
onLayoutChange(canonicalize(next.layout));
|
|
169
|
-
onGridSettingsChange?.(
|
|
170
|
-
(0, import_normalize_grid_settings.normalizeGridSettings)(next.gridSettings, import_row_height_presets.DEFAULT_ROW_HEIGHT)
|
|
171
|
-
);
|
|
172
|
-
onEditChange?.(false);
|
|
173
|
-
},
|
|
174
|
-
[
|
|
175
|
-
stagingLayout,
|
|
176
|
-
stagingGridSettings,
|
|
177
|
-
onLayoutChange,
|
|
178
|
-
onGridSettingsChange,
|
|
179
|
-
onEditChange
|
|
180
|
-
]
|
|
125
|
+
const flushAutoSave = (0, import_element.useCallback)(
|
|
126
|
+
() => scheduleAutoSave.flush(),
|
|
127
|
+
[scheduleAutoSave]
|
|
181
128
|
);
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
129
|
+
(0, import_element.useEffect)(() => {
|
|
130
|
+
if (!editMode) {
|
|
131
|
+
return;
|
|
132
|
+
}
|
|
133
|
+
scheduleAutoSave.flush();
|
|
134
|
+
}, [editMode, scheduleAutoSave]);
|
|
135
|
+
(0, import_element.useEffect)(() => () => scheduleAutoSave.flush(), [scheduleAutoSave]);
|
|
136
|
+
const cancel = (0, import_element.useCallback)(() => {
|
|
137
|
+
setStagingLayout(committedLayout);
|
|
138
|
+
onEditChange?.(false);
|
|
139
|
+
}, [committedLayout, onEditChange]);
|
|
185
140
|
(0, import_element.useEffect)(() => {
|
|
186
141
|
if (stagingLayout.length === 0) {
|
|
187
142
|
onEditChange?.(true);
|
|
188
143
|
}
|
|
189
144
|
}, [stagingLayout.length === 0]);
|
|
190
|
-
const canEditGridSettings = onGridSettingsChange !== void 0;
|
|
191
145
|
const value = (0, import_element.useMemo)(
|
|
192
146
|
() => ({
|
|
193
147
|
widgetTypes,
|
|
@@ -195,13 +149,11 @@ function WidgetDashboardProvider({
|
|
|
195
149
|
layout: stagingLayout,
|
|
196
150
|
onLayoutChange: setStagingLayout,
|
|
197
151
|
onLayoutReset,
|
|
198
|
-
gridSettings
|
|
199
|
-
onGridSettingsChange: setStagingGridSettings,
|
|
200
|
-
canEditGridSettings,
|
|
201
|
-
resetGridSettings,
|
|
152
|
+
gridSettings,
|
|
202
153
|
commit,
|
|
203
|
-
commitGridModelChange,
|
|
204
154
|
cancel,
|
|
155
|
+
scheduleAutoSave,
|
|
156
|
+
flushAutoSave,
|
|
205
157
|
hasUncommittedChanges,
|
|
206
158
|
editMode,
|
|
207
159
|
onEditChange,
|
|
@@ -212,12 +164,11 @@ function WidgetDashboardProvider({
|
|
|
212
164
|
isResolvingWidgetTypes,
|
|
213
165
|
stagingLayout,
|
|
214
166
|
onLayoutReset,
|
|
215
|
-
|
|
216
|
-
canEditGridSettings,
|
|
217
|
-
resetGridSettings,
|
|
167
|
+
gridSettings,
|
|
218
168
|
commit,
|
|
219
|
-
commitGridModelChange,
|
|
220
169
|
cancel,
|
|
170
|
+
scheduleAutoSave,
|
|
171
|
+
flushAutoSave,
|
|
221
172
|
hasUncommittedChanges,
|
|
222
173
|
editMode,
|
|
223
174
|
onEditChange,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/context/dashboard-context.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport fastDeepEqual from 'fast-deep-equal/es6/index.js';\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreateContext,\n\tuseCallback,\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseState,\n} from '@wordpress/element';\nimport type {\n\tResolveWidgetModule,\n\tWidgetType,\n} from '@wordpress/widget-primitives';\n\n/**\n * Internal dependencies\n */\nimport { DEFAULT_GRID } from '../utils/default-grid';\nimport { computeGridModelChange } from '../utils/grid-model-change';\nimport { normalizeGridSettings } from '../utils/normalize-grid-settings';\nimport { DEFAULT_ROW_HEIGHT } from '../utils/row-height-presets';\nimport type {\n\tWidgetGridModel,\n\tWidgetGridSettings,\n\tDashboardWidget,\n} from '../types';\nimport { WIDGET_DASHBOARD_COLUMN_COUNT } from '../types';\n\ntype GridSettingsWithColumns = WidgetGridSettings & { columns: number };\n\nfunction resolveGridSettings(\n\tsettings: WidgetGridSettings\n): GridSettingsWithColumns {\n\tconst normalized = normalizeGridSettings( settings, DEFAULT_ROW_HEIGHT );\n\treturn {\n\t\t...normalized,\n\t\tcolumns: WIDGET_DASHBOARD_COLUMN_COUNT,\n\t};\n}\n\nconst DEFAULT_RESOLVE_WIDGET_MODULE: ResolveWidgetModule = ( moduleId ) =>\n\timport( /* webpackIgnore: true */ moduleId );\n\n/**\n * Canonical form of `layout`: widgets sorted by `placement.order` (falling\n * back to array index), then `order` stripped since position now implies it.\n * Used both as the comparison form for `hasUncommittedChanges` (so a change\n * and its undo compare equal) and as the publish form, keeping persisted\n * payloads free of redundant `order` fields.\n *\n * @param {DashboardWidget[]} layout Layout to canonicalize.\n * @return {DashboardWidget[]} Canonicalized layout.\n */\nfunction canonicalize( layout: DashboardWidget[] ): DashboardWidget[] {\n\tconst indexed = layout.map( ( widget, index ) => ( {\n\t\twidget,\n\t\torder: widget.placement?.order ?? index,\n\t} ) );\n\n\tindexed.sort( ( a, b ) => a.order - b.order );\n\n\treturn indexed.map( ( { widget } ) => {\n\t\tif ( ! widget.placement ) {\n\t\t\treturn widget;\n\t\t}\n\t\tconst { order: _stripped, ...placement } = widget.placement;\n\t\treturn { ...widget, placement };\n\t} );\n}\n\n/**\n * Rich state distributed to every compound component inside `WidgetDashboard`.\n * Internal — compounds reach the full state via `useDashboardInternalContext()`.\n *\n * `layout`/`onLayoutChange` and `gridSettings`/`onGridSettingsChange` here\n * operate on the staging layer, not the committed props. Mutations from\n * compound children stay in staging until `commit` publishes them on the\n * consumer.\n */\ninterface InternalDashboardContextValue {\n\twidgetTypes: WidgetType[];\n\tisResolvingWidgetTypes: boolean;\n\tlayout: DashboardWidget[];\n\tonLayoutChange: ( layout: DashboardWidget[] ) => void;\n\tonLayoutReset?: () => void;\n\tgridSettings: GridSettingsWithColumns;\n\tonGridSettingsChange: ( gridSettings: WidgetGridSettings ) => void;\n\tcanEditGridSettings: boolean;\n\n\t/**\n\t * Restores the staging copy of `gridSettings` to the package's\n\t * built-in defaults. Does not touch the committed slice; the user\n\t * must `commit` to publish the reset, or `cancel` to discard it.\n\t */\n\tresetGridSettings: () => void;\n\n\t/**\n\t * Publishes staged slices that differ from their committed\n\t * counterparts. By default also exits edit mode; pass\n\t * `{ exitEditMode: false }` when committing from the layout\n\t * settings drawer so customize mode stays active.\n\t */\n\tcommit: ( options?: CommitOptions ) => void;\n\n\t/**\n\t * Switches the layout model, updates staging, and publishes\n\t * immediately — equivalent to changing the model in layout\n\t * settings and clicking Save.\n\t */\n\tcommitGridModelChange: ( targetModel: WidgetGridModel ) => void;\n\n\t/**\n\t * Reverts staging slices. By default reverts both layout and grid\n\t * settings and exits edit mode. Pass `{ exitEditMode: false }` when\n\t * dismissing the layout settings drawer. Pass `{ revertLayout: false }`\n\t * to revert only grid settings (preserves in-progress widget layout\n\t * edits while customize mode is active).\n\t */\n\tcancel: ( options?: CancelOptions ) => void;\n\n\thasUncommittedChanges: boolean;\n\teditMode: boolean;\n\tonEditChange?: ( next: boolean ) => void;\n\tresolveWidgetModule: ResolveWidgetModule;\n}\n\ninterface CommitOptions {\n\texitEditMode?: boolean;\n}\n\ninterface CancelOptions {\n\texitEditMode?: boolean;\n\trevertLayout?: boolean;\n}\n\nconst Context = createContext< InternalDashboardContextValue | null >( null );\n\n/**\n * Compound-internal hook — exposes the full provider state.\n * Not part of the public API; lives in the same module\n * so compound components can reach the state directly.\n */\nexport function useDashboardInternalContext(): InternalDashboardContextValue {\n\tconst ctx = useContext( Context );\n\tif ( ! ctx ) {\n\t\tthrow new Error(\n\t\t\t'Dashboard compound used outside a WidgetDashboard subtree.'\n\t\t);\n\t}\n\treturn ctx;\n}\n\ninterface ProviderProps {\n\twidgetTypes: WidgetType[];\n\tisResolvingWidgetTypes?: boolean;\n\tlayout: DashboardWidget[];\n\n\t/**\n\t * Fired on commit when the staged layout differs from `layout`.\n\t */\n\tonLayoutChange: ( layout: DashboardWidget[] ) => void;\n\n\t/**\n\t * Optional reset action surfaced by the bundled `Actions`.\n\t */\n\tonLayoutReset?: () => void;\n\n\teditMode?: boolean;\n\tonEditChange?: ( next: boolean ) => void;\n\n\t/**\n\t * Overrides the default `import()` resolution of\n\t * `WidgetType.renderModule`.\n\t */\n\tresolveWidgetModule?: ResolveWidgetModule;\n\n\tgridSettings?: WidgetGridSettings;\n\n\t/**\n\t * Fired on commit when the staged settings differ from\n\t * `gridSettings`.\n\t */\n\tonGridSettingsChange?: ( gridSettings: WidgetGridSettings ) => void;\n\n\tchildren: ReactNode;\n}\n\n/**\n * Provider for the dashboard's staging layer. Owns staging copies of\n * `layout` and `gridSettings`; `commit` publishes whichever slice\n * differs from its committed prop, `cancel` reverts both.\n *\n * Staging re-syncs from the committed props on prop change. In-flight\n * edits are dropped silently when an external update (cross-tab commit,\n * reset, websocket push) lands. Consumers that cannot tolerate this\n * loss should mediate the prop updates before forwarding them here.\n *\n * @param {ProviderProps} props Component props.\n */\nexport function WidgetDashboardProvider( {\n\twidgetTypes,\n\tisResolvingWidgetTypes = false,\n\tlayout: committedLayout,\n\tonLayoutChange,\n\tonLayoutReset,\n\teditMode = false,\n\tonEditChange,\n\tresolveWidgetModule = DEFAULT_RESOLVE_WIDGET_MODULE,\n\tgridSettings: committedGridSettings = DEFAULT_GRID,\n\tonGridSettingsChange,\n\tchildren,\n}: ProviderProps ): React.ReactNode {\n\tconst [ stagingLayout, setStagingLayout ] =\n\t\tuseState< DashboardWidget[] >( committedLayout );\n\n\t// External change in `layout` (consumer-side reset, cross-tab sync,\n\t// websocket push, etc.) drops any in-flight staging edits without\n\t// surfacing a warning. See the provider JSDoc for the trade-off.\n\tuseEffect( () => {\n\t\tsetStagingLayout( committedLayout );\n\t}, [ committedLayout ] );\n\n\tconst [ stagingGridSettings, setStagingGridSettings ] =\n\t\tuseState< WidgetGridSettings >( () =>\n\t\t\tnormalizeGridSettings( committedGridSettings, DEFAULT_ROW_HEIGHT )\n\t\t);\n\n\t// Same external-resync semantics as `stagingLayout`.\n\tuseEffect( () => {\n\t\tsetStagingGridSettings(\n\t\t\tnormalizeGridSettings( committedGridSettings, DEFAULT_ROW_HEIGHT )\n\t\t);\n\t}, [ committedGridSettings ] );\n\n\tconst hasLayoutChanges = useMemo(\n\t\t() =>\n\t\t\t! fastDeepEqual(\n\t\t\t\tcanonicalize( committedLayout ),\n\t\t\t\tcanonicalize( stagingLayout )\n\t\t\t),\n\t\t[ committedLayout, stagingLayout ]\n\t);\n\n\tconst hasGridSettingsChanges = useMemo(\n\t\t() => ! fastDeepEqual( committedGridSettings, stagingGridSettings ),\n\t\t[ committedGridSettings, stagingGridSettings ]\n\t);\n\n\tconst hasUncommittedChanges = hasLayoutChanges || hasGridSettingsChanges;\n\n\tconst commit = useCallback(\n\t\t( options?: CommitOptions ) => {\n\t\t\tif ( hasLayoutChanges ) {\n\t\t\t\tonLayoutChange( canonicalize( stagingLayout ) );\n\t\t\t}\n\n\t\t\tif ( hasGridSettingsChanges ) {\n\t\t\t\tonGridSettingsChange?.(\n\t\t\t\t\tnormalizeGridSettings(\n\t\t\t\t\t\tstagingGridSettings,\n\t\t\t\t\t\tDEFAULT_ROW_HEIGHT\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tif ( options?.exitEditMode !== false ) {\n\t\t\t\tonEditChange?.( false );\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\thasLayoutChanges,\n\t\t\thasGridSettingsChanges,\n\t\t\tonLayoutChange,\n\t\t\tonGridSettingsChange,\n\t\t\tstagingLayout,\n\t\t\tstagingGridSettings,\n\t\t\tonEditChange,\n\t\t]\n\t);\n\n\tconst cancel = useCallback(\n\t\t( options?: CancelOptions ) => {\n\t\t\tif ( options?.revertLayout !== false ) {\n\t\t\t\tsetStagingLayout( committedLayout );\n\t\t\t}\n\t\t\tsetStagingGridSettings( committedGridSettings );\n\t\t\tif ( options?.exitEditMode !== false ) {\n\t\t\t\tonEditChange?.( false );\n\t\t\t}\n\t\t},\n\t\t[ committedLayout, committedGridSettings, onEditChange ]\n\t);\n\n\tconst commitGridModelChange = useCallback(\n\t\t( targetModel: WidgetGridModel ) => {\n\t\t\tconst next = computeGridModelChange( {\n\t\t\t\tlayout: stagingLayout,\n\t\t\t\tgridSettings: stagingGridSettings,\n\t\t\t\ttargetModel,\n\t\t\t} );\n\n\t\t\tif ( ! next ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetStagingLayout( next.layout );\n\t\t\tsetStagingGridSettings( next.gridSettings );\n\t\t\tonLayoutChange( canonicalize( next.layout ) );\n\t\t\tonGridSettingsChange?.(\n\t\t\t\tnormalizeGridSettings( next.gridSettings, DEFAULT_ROW_HEIGHT )\n\t\t\t);\n\t\t\tonEditChange?.( false );\n\t\t},\n\t\t[\n\t\t\tstagingLayout,\n\t\t\tstagingGridSettings,\n\t\t\tonLayoutChange,\n\t\t\tonGridSettingsChange,\n\t\t\tonEditChange,\n\t\t]\n\t);\n\n\tconst resetGridSettings = useCallback( () => {\n\t\tsetStagingGridSettings( DEFAULT_GRID );\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tif ( stagingLayout.length === 0 ) {\n\t\t\tonEditChange?.( true );\n\t\t}\n\n\t\t// Only react to the layout count flipping to zero; firing on every\n\t\t// onEditChange identity change would also reopen edit mode after the\n\t\t// user explicitly closed it on a non-empty layout.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ stagingLayout.length === 0 ] );\n\n\tconst canEditGridSettings = onGridSettingsChange !== undefined;\n\n\tconst value = useMemo< InternalDashboardContextValue >(\n\t\t() => ( {\n\t\t\twidgetTypes,\n\t\t\tisResolvingWidgetTypes,\n\t\t\tlayout: stagingLayout,\n\t\t\tonLayoutChange: setStagingLayout,\n\t\t\tonLayoutReset,\n\t\t\tgridSettings: resolveGridSettings( stagingGridSettings ),\n\t\t\tonGridSettingsChange: setStagingGridSettings,\n\t\t\tcanEditGridSettings,\n\t\t\tresetGridSettings,\n\t\t\tcommit,\n\t\t\tcommitGridModelChange,\n\t\t\tcancel,\n\t\t\thasUncommittedChanges,\n\t\t\teditMode,\n\t\t\tonEditChange,\n\t\t\tresolveWidgetModule,\n\t\t} ),\n\t\t[\n\t\t\twidgetTypes,\n\t\t\tisResolvingWidgetTypes,\n\t\t\tstagingLayout,\n\t\t\tonLayoutReset,\n\t\t\tstagingGridSettings,\n\t\t\tcanEditGridSettings,\n\t\t\tresetGridSettings,\n\t\t\tcommit,\n\t\t\tcommitGridModelChange,\n\t\t\tcancel,\n\t\t\thasUncommittedChanges,\n\t\t\teditMode,\n\t\t\tonEditChange,\n\t\t\tresolveWidgetModule,\n\t\t]\n\t);\n\n\treturn <Context.Provider value={ value }>{ children }</Context.Provider>;\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,iBAA0B;AAM1B,qBAOO;AASP,0BAA6B;AAC7B
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport fastDeepEqual from 'fast-deep-equal/es6/index.js';\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { debounce, useEvent } from '@wordpress/compose';\nimport {\n\tcreateContext,\n\tuseCallback,\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseState,\n} from '@wordpress/element';\nimport type {\n\tResolveWidgetModule,\n\tWidgetType,\n} from '@wordpress/widget-primitives';\n\n/**\n * Internal dependencies\n */\nimport { DEFAULT_GRID } from '../utils/default-grid';\nimport { normalizeGridSettings } from '../utils/normalize-grid-settings';\nimport { DEFAULT_ROW_HEIGHT } from '../utils/row-height-presets';\nimport type { WidgetGridSettings, DashboardWidget } from '../types';\nimport { WIDGET_DASHBOARD_COLUMN_COUNT } from '../types';\n\ntype GridSettingsWithColumns = WidgetGridSettings & { columns: number };\n\nfunction resolveGridSettings(\n\tsettings: WidgetGridSettings\n): GridSettingsWithColumns {\n\tconst normalized = normalizeGridSettings( settings, DEFAULT_ROW_HEIGHT );\n\treturn {\n\t\t...normalized,\n\t\tcolumns: WIDGET_DASHBOARD_COLUMN_COUNT,\n\t};\n}\n\nconst DEFAULT_RESOLVE_WIDGET_MODULE: ResolveWidgetModule = ( moduleId ) =>\n\timport( /* webpackIgnore: true */ moduleId );\n\n/**\n * Inline widget-instance edits stage live, then publish once the user pauses.\n * A single global timer, so editing several widgets settles into one save.\n */\nconst AUTO_SAVE_DELAY_MS = 5000;\n\n/**\n * Canonical form of `layout`: widgets sorted by `placement.order` (falling\n * back to array index), then `order` stripped since position now implies it.\n * Used both as the comparison form for `hasUncommittedChanges` (so a change\n * and its undo compare equal) and as the publish form, keeping persisted\n * payloads free of redundant `order` fields.\n *\n * @param {DashboardWidget[]} layout Layout to canonicalize.\n * @return {DashboardWidget[]} Canonicalized layout.\n */\nfunction canonicalize( layout: DashboardWidget[] ): DashboardWidget[] {\n\tconst indexed = layout.map( ( widget, index ) => ( {\n\t\twidget,\n\t\torder: widget.placement?.order ?? index,\n\t} ) );\n\n\tindexed.sort( ( a, b ) => a.order - b.order );\n\n\treturn indexed.map( ( { widget } ) => {\n\t\tif ( ! widget.placement ) {\n\t\t\treturn widget;\n\t\t}\n\t\tconst { order: _stripped, ...placement } = widget.placement;\n\t\treturn { ...widget, placement };\n\t} );\n}\n\n/**\n * Rich state distributed to every compound component inside `WidgetDashboard`.\n * Internal — compounds reach the full state via `useDashboardInternalContext()`.\n *\n * `layout`/`onLayoutChange` here operate on the staging layer, not the\n * committed props. Mutations from compound children stay in staging until\n * `commit` publishes them on the consumer.\n */\ninterface InternalDashboardContextValue {\n\twidgetTypes: WidgetType[];\n\tisResolvingWidgetTypes: boolean;\n\tlayout: DashboardWidget[];\n\tonLayoutChange: ( layout: DashboardWidget[] ) => void;\n\tonLayoutReset?: () => void;\n\tgridSettings: GridSettingsWithColumns;\n\n\t/**\n\t * Publishes the staged layout when it differs from the committed\n\t * prop. By default also exits edit mode; pass `{ exitEditMode: false }`\n\t * for inline auto-saves that keep the current mode.\n\t */\n\tcommit: ( options?: CommitOptions ) => void;\n\n\t/**\n\t * Reverts the staged layout and exits edit mode.\n\t */\n\tcancel: () => void;\n\n\t/**\n\t * Debounced auto-save for inline widget-instance edits. Controls call it\n\t * after staging a change; a single global timer publishes once the edits\n\t * settle. The settings drawer does not use it (it commits on Save).\n\t */\n\tscheduleAutoSave: () => void;\n\n\t/**\n\t * Publishes any pending auto-save immediately. Called when leaving the\n\t * inline surface (opening the drawer, entering customize) so staged inline\n\t * edits do not commingle with the drawer's explicit-save flow.\n\t */\n\tflushAutoSave: () => void;\n\n\thasUncommittedChanges: boolean;\n\teditMode: boolean;\n\tonEditChange?: ( next: boolean ) => void;\n\tresolveWidgetModule: ResolveWidgetModule;\n}\n\ninterface CommitOptions {\n\texitEditMode?: boolean;\n}\n\nconst Context = createContext< InternalDashboardContextValue | null >( null );\n\n/**\n * Compound-internal hook — exposes the full provider state.\n * Not part of the public API; lives in the same module\n * so compound components can reach the state directly.\n */\nexport function useDashboardInternalContext(): InternalDashboardContextValue {\n\tconst ctx = useContext( Context );\n\tif ( ! ctx ) {\n\t\tthrow new Error(\n\t\t\t'Dashboard compound used outside a WidgetDashboard subtree.'\n\t\t);\n\t}\n\treturn ctx;\n}\n\ninterface ProviderProps {\n\twidgetTypes: WidgetType[];\n\tisResolvingWidgetTypes?: boolean;\n\tlayout: DashboardWidget[];\n\n\t/**\n\t * Fired on commit when the staged layout differs from `layout`.\n\t */\n\tonLayoutChange: ( layout: DashboardWidget[] ) => void;\n\n\t/**\n\t * Optional reset action surfaced by the bundled `Actions`.\n\t */\n\tonLayoutReset?: () => void;\n\n\teditMode?: boolean;\n\tonEditChange?: ( next: boolean ) => void;\n\n\t/**\n\t * Overrides the default `import()` resolution of\n\t * `WidgetType.renderModule`.\n\t */\n\tresolveWidgetModule?: ResolveWidgetModule;\n\n\tgridSettings?: WidgetGridSettings;\n\n\tchildren: ReactNode;\n}\n\n/**\n * Provider for the dashboard's staging layer. Owns the staging copy of\n * `layout`; `commit` publishes it when it differs from the committed\n * prop, `cancel` reverts it.\n *\n * Staging re-syncs from the committed prop on prop change. In-flight\n * edits are dropped silently when an external update (cross-tab commit,\n * reset, websocket push) lands. Consumers that cannot tolerate this\n * loss should mediate the prop updates before forwarding them here.\n *\n * @param {ProviderProps} props Component props.\n */\nexport function WidgetDashboardProvider( {\n\twidgetTypes,\n\tisResolvingWidgetTypes = false,\n\tlayout: committedLayout,\n\tonLayoutChange,\n\tonLayoutReset,\n\teditMode = false,\n\tonEditChange,\n\tresolveWidgetModule = DEFAULT_RESOLVE_WIDGET_MODULE,\n\tgridSettings: committedGridSettings = DEFAULT_GRID,\n\tchildren,\n}: ProviderProps ): React.ReactNode {\n\tconst [ stagingLayout, setStagingLayout ] =\n\t\tuseState< DashboardWidget[] >( committedLayout );\n\n\t// External change in `layout` (consumer-side reset, cross-tab sync,\n\t// websocket push, etc.) drops any in-flight staging edits without\n\t// surfacing a warning. See the provider JSDoc for the trade-off.\n\tuseEffect( () => {\n\t\tsetStagingLayout( committedLayout );\n\t}, [ committedLayout ] );\n\n\tconst gridSettings = useMemo(\n\t\t() => resolveGridSettings( committedGridSettings ),\n\t\t[ committedGridSettings ]\n\t);\n\n\tconst hasLayoutChanges = useMemo(\n\t\t() =>\n\t\t\t! fastDeepEqual(\n\t\t\t\tcanonicalize( committedLayout ),\n\t\t\t\tcanonicalize( stagingLayout )\n\t\t\t),\n\t\t[ committedLayout, stagingLayout ]\n\t);\n\n\tconst hasUncommittedChanges = hasLayoutChanges;\n\n\tconst commit = useCallback(\n\t\t( options?: CommitOptions ) => {\n\t\t\tif ( hasLayoutChanges ) {\n\t\t\t\tonLayoutChange( canonicalize( stagingLayout ) );\n\t\t\t}\n\n\t\t\tif ( options?.exitEditMode !== false ) {\n\t\t\t\tonEditChange?.( false );\n\t\t\t}\n\t\t},\n\t\t[ hasLayoutChanges, onLayoutChange, stagingLayout, onEditChange ]\n\t);\n\n\t// Auto-save for inline edits.\n\t// A single debounced timer publishes through `useEvent`, so it always\n\t// reads the latest `commit` (and so the current staging) without\n\t// resetting on staging re-renders.\n\tconst publishAutoSave = useEvent( () => commit( { exitEditMode: false } ) );\n\n\tconst scheduleAutoSave = useMemo(\n\t\t() => debounce( publishAutoSave, AUTO_SAVE_DELAY_MS ),\n\t\t[ publishAutoSave ]\n\t);\n\n\tconst flushAutoSave = useCallback(\n\t\t() => scheduleAutoSave.flush(),\n\t\t[ scheduleAutoSave ]\n\t);\n\n\t// Entering customize flushes any pending inline save first, so it does not\n\t// commingle with the layout edit flow.\n\tuseEffect( () => {\n\t\tif ( ! editMode ) {\n\t\t\treturn;\n\t\t}\n\n\t\tscheduleAutoSave.flush();\n\t}, [ editMode, scheduleAutoSave ] );\n\n\t// Flush, not cancel, on unmount: an edit still inside the debounce window\n\t// must persist when the user navigates away from the dashboard.\n\tuseEffect( () => () => scheduleAutoSave.flush(), [ scheduleAutoSave ] );\n\n\tconst cancel = useCallback( () => {\n\t\tsetStagingLayout( committedLayout );\n\t\tonEditChange?.( false );\n\t}, [ committedLayout, onEditChange ] );\n\n\tuseEffect( () => {\n\t\tif ( stagingLayout.length === 0 ) {\n\t\t\tonEditChange?.( true );\n\t\t}\n\n\t\t// Only react to the layout count flipping to zero; firing on every\n\t\t// onEditChange identity change would also reopen edit mode after the\n\t\t// user explicitly closed it on a non-empty layout.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ stagingLayout.length === 0 ] );\n\n\tconst value = useMemo< InternalDashboardContextValue >(\n\t\t() => ( {\n\t\t\twidgetTypes,\n\t\t\tisResolvingWidgetTypes,\n\t\t\tlayout: stagingLayout,\n\t\t\tonLayoutChange: setStagingLayout,\n\t\t\tonLayoutReset,\n\t\t\tgridSettings,\n\t\t\tcommit,\n\t\t\tcancel,\n\t\t\tscheduleAutoSave,\n\t\t\tflushAutoSave,\n\t\t\thasUncommittedChanges,\n\t\t\teditMode,\n\t\t\tonEditChange,\n\t\t\tresolveWidgetModule,\n\t\t} ),\n\t\t[\n\t\t\twidgetTypes,\n\t\t\tisResolvingWidgetTypes,\n\t\t\tstagingLayout,\n\t\t\tonLayoutReset,\n\t\t\tgridSettings,\n\t\t\tcommit,\n\t\t\tcancel,\n\t\t\tscheduleAutoSave,\n\t\t\tflushAutoSave,\n\t\t\thasUncommittedChanges,\n\t\t\teditMode,\n\t\t\tonEditChange,\n\t\t\tresolveWidgetModule,\n\t\t]\n\t);\n\n\treturn <Context.Provider value={ value }>{ children }</Context.Provider>;\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,iBAA0B;AAM1B,qBAAmC;AACnC,qBAOO;AASP,0BAA6B;AAC7B,qCAAsC;AACtC,gCAAmC;AAEnC,mBAA8C;AAmStC;AA/RR,SAAS,oBACR,UAC0B;AAC1B,QAAM,iBAAa,sDAAuB,UAAU,4CAAmB;AACvE,SAAO;AAAA,IACN,GAAG;AAAA,IACH,SAAS;AAAA,EACV;AACD;AAEA,IAAM,gCAAqD,CAAE,aAC5D;AAAA;AAAA,EAAkC;AAAA;AAMnC,IAAM,qBAAqB;AAY3B,SAAS,aAAc,QAA+C;AACrE,QAAM,UAAU,OAAO,IAAK,CAAE,QAAQ,WAAa;AAAA,IAClD;AAAA,IACA,OAAO,OAAO,WAAW,SAAS;AAAA,EACnC,EAAI;AAEJ,UAAQ,KAAM,CAAE,GAAG,MAAO,EAAE,QAAQ,EAAE,KAAM;AAE5C,SAAO,QAAQ,IAAK,CAAE,EAAE,OAAO,MAAO;AACrC,QAAK,CAAE,OAAO,WAAY;AACzB,aAAO;AAAA,IACR;AACA,UAAM,EAAE,OAAO,WAAW,GAAG,UAAU,IAAI,OAAO;AAClD,WAAO,EAAE,GAAG,QAAQ,UAAU;AAAA,EAC/B,CAAE;AACH;AAsDA,IAAM,cAAU,8BAAuD,IAAK;AAOrE,SAAS,8BAA6D;AAC5E,QAAM,UAAM,2BAAY,OAAQ;AAChC,MAAK,CAAE,KAAM;AACZ,UAAM,IAAI;AAAA,MACT;AAAA,IACD;AAAA,EACD;AACA,SAAO;AACR;AA2CO,SAAS,wBAAyB;AAAA,EACxC;AAAA,EACA,yBAAyB;AAAA,EACzB,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA,sBAAsB;AAAA,EACtB,cAAc,wBAAwB;AAAA,EACtC;AACD,GAAoC;AACnC,QAAM,CAAE,eAAe,gBAAiB,QACvC,yBAA+B,eAAgB;AAKhD,gCAAW,MAAM;AAChB,qBAAkB,eAAgB;AAAA,EACnC,GAAG,CAAE,eAAgB,CAAE;AAEvB,QAAM,mBAAe;AAAA,IACpB,MAAM,oBAAqB,qBAAsB;AAAA,IACjD,CAAE,qBAAsB;AAAA,EACzB;AAEA,QAAM,uBAAmB;AAAA,IACxB,MACC,KAAE,WAAAA;AAAA,MACD,aAAc,eAAgB;AAAA,MAC9B,aAAc,aAAc;AAAA,IAC7B;AAAA,IACD,CAAE,iBAAiB,aAAc;AAAA,EAClC;AAEA,QAAM,wBAAwB;AAE9B,QAAM,aAAS;AAAA,IACd,CAAE,YAA6B;AAC9B,UAAK,kBAAmB;AACvB,uBAAgB,aAAc,aAAc,CAAE;AAAA,MAC/C;AAEA,UAAK,SAAS,iBAAiB,OAAQ;AACtC,uBAAgB,KAAM;AAAA,MACvB;AAAA,IACD;AAAA,IACA,CAAE,kBAAkB,gBAAgB,eAAe,YAAa;AAAA,EACjE;AAMA,QAAM,sBAAkB,yBAAU,MAAM,OAAQ,EAAE,cAAc,MAAM,CAAE,CAAE;AAE1E,QAAM,uBAAmB;AAAA,IACxB,UAAM,yBAAU,iBAAiB,kBAAmB;AAAA,IACpD,CAAE,eAAgB;AAAA,EACnB;AAEA,QAAM,oBAAgB;AAAA,IACrB,MAAM,iBAAiB,MAAM;AAAA,IAC7B,CAAE,gBAAiB;AAAA,EACpB;AAIA,gCAAW,MAAM;AAChB,QAAK,CAAE,UAAW;AACjB;AAAA,IACD;AAEA,qBAAiB,MAAM;AAAA,EACxB,GAAG,CAAE,UAAU,gBAAiB,CAAE;AAIlC,gCAAW,MAAM,MAAM,iBAAiB,MAAM,GAAG,CAAE,gBAAiB,CAAE;AAEtE,QAAM,aAAS,4BAAa,MAAM;AACjC,qBAAkB,eAAgB;AAClC,mBAAgB,KAAM;AAAA,EACvB,GAAG,CAAE,iBAAiB,YAAa,CAAE;AAErC,gCAAW,MAAM;AAChB,QAAK,cAAc,WAAW,GAAI;AACjC,qBAAgB,IAAK;AAAA,IACtB;AAAA,EAMD,GAAG,CAAE,cAAc,WAAW,CAAE,CAAE;AAElC,QAAM,YAAQ;AAAA,IACb,OAAQ;AAAA,MACP;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,MACR,gBAAgB;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,IACA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,EACD;AAEA,SAAO,4CAAC,QAAQ,UAAR,EAAiB,OAAkB,UAAU;AACtD;",
|
|
6
6
|
"names": ["fastDeepEqual"]
|
|
7
7
|
}
|
|
@@ -38,34 +38,18 @@ function useDashboardUIContext() {
|
|
|
38
38
|
}
|
|
39
39
|
function WidgetDashboardUIProvider({ children }) {
|
|
40
40
|
const [inserterOpen, setInserterOpen] = (0, import_element.useState)(false);
|
|
41
|
-
const [layoutSettingsOpen, setLayoutSettingsOpen] = (0, import_element.useState)(false);
|
|
42
41
|
const [resetDialogOpen, setResetDialogOpen] = (0, import_element.useState)(false);
|
|
43
42
|
const [settingsWidgetUuid, setSettingsWidgetUuid] = (0, import_element.useState)(null);
|
|
44
|
-
const [settingsDrawerSide, setSettingsDrawerSide] = (0, import_element.useState)("right");
|
|
45
|
-
const [settingsDrawerInset, setSettingsDrawerInset] = (0, import_element.useState)(0);
|
|
46
43
|
const value = (0, import_element.useMemo)(
|
|
47
44
|
() => ({
|
|
48
45
|
inserterOpen,
|
|
49
46
|
setInserterOpen,
|
|
50
|
-
layoutSettingsOpen,
|
|
51
|
-
setLayoutSettingsOpen,
|
|
52
47
|
resetDialogOpen,
|
|
53
48
|
setResetDialogOpen,
|
|
54
49
|
settingsWidgetUuid,
|
|
55
|
-
setSettingsWidgetUuid
|
|
56
|
-
settingsDrawerSide,
|
|
57
|
-
setSettingsDrawerSide,
|
|
58
|
-
settingsDrawerInset,
|
|
59
|
-
setSettingsDrawerInset
|
|
50
|
+
setSettingsWidgetUuid
|
|
60
51
|
}),
|
|
61
|
-
[
|
|
62
|
-
inserterOpen,
|
|
63
|
-
layoutSettingsOpen,
|
|
64
|
-
resetDialogOpen,
|
|
65
|
-
settingsWidgetUuid,
|
|
66
|
-
settingsDrawerSide,
|
|
67
|
-
settingsDrawerInset
|
|
68
|
-
]
|
|
52
|
+
[inserterOpen, resetDialogOpen, settingsWidgetUuid]
|
|
69
53
|
);
|
|
70
54
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Context.Provider, { value, children });
|
|
71
55
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/context/ui-context.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreateContext,\n\tuseContext,\n\tuseMemo,\n\tuseState,\n} from '@wordpress/element';\n\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA,qBAKO;
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreateContext,\n\tuseContext,\n\tuseMemo,\n\tuseState,\n} from '@wordpress/element';\n\ninterface DashboardUIContextValue {\n\tinserterOpen: boolean;\n\tsetInserterOpen: ( next: boolean ) => void;\n\n\tresetDialogOpen: boolean;\n\tsetResetDialogOpen: ( next: boolean ) => void;\n\n\t/**\n\t * `uuid` of the instance whose settings drawer is open, or `null`\n\t * when no settings drawer is showing. The per-instance gear in the\n\t * chrome sets it; the single `WidgetSettings` at the root reads\n\t * it.\n\t */\n\tsettingsWidgetUuid: string | null;\n\tsetSettingsWidgetUuid: ( next: string | null ) => void;\n}\n\nconst Context = createContext< DashboardUIContextValue | null >( null );\n\n/**\n * Accesses the shared UI state: overlay open flags and the active settings\n * instance with its placement. Throws when called outside `WidgetDashboard`.\n */\nexport function useDashboardUIContext(): DashboardUIContextValue {\n\tconst ctx = useContext( Context );\n\tif ( ! ctx ) {\n\t\tthrow new Error(\n\t\t\t'Dashboard compound used outside a WidgetDashboard subtree.'\n\t\t);\n\t}\n\treturn ctx;\n}\n\ninterface ProviderProps {\n\tchildren: ReactNode;\n}\n\n/**\n * Holds transient UI state shared across compounds (the inserter modal and\n * the per-instance settings drawer). Kept separate from the data context so\n * that data mutations don't churn the UI state and vice-versa.\n *\n * @param {ProviderProps} props Component props.\n */\nexport function WidgetDashboardUIProvider( { children }: ProviderProps ) {\n\tconst [ inserterOpen, setInserterOpen ] = useState( false );\n\tconst [ resetDialogOpen, setResetDialogOpen ] = useState( false );\n\tconst [ settingsWidgetUuid, setSettingsWidgetUuid ] = useState<\n\t\tstring | null\n\t>( null );\n\n\tconst value = useMemo< DashboardUIContextValue >(\n\t\t() => ( {\n\t\t\tinserterOpen,\n\t\t\tsetInserterOpen,\n\t\t\tresetDialogOpen,\n\t\t\tsetResetDialogOpen,\n\t\t\tsettingsWidgetUuid,\n\t\t\tsetSettingsWidgetUuid,\n\t\t} ),\n\t\t[ inserterOpen, resetDialogOpen, settingsWidgetUuid ]\n\t);\n\n\treturn <Context.Provider value={ value }>{ children }</Context.Provider>;\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA,qBAKO;AAiEC;AA9CR,IAAM,cAAU,8BAAiD,IAAK;AAM/D,SAAS,wBAAiD;AAChE,QAAM,UAAM,2BAAY,OAAQ;AAChC,MAAK,CAAE,KAAM;AACZ,UAAM,IAAI;AAAA,MACT;AAAA,IACD;AAAA,EACD;AACA,SAAO;AACR;AAaO,SAAS,0BAA2B,EAAE,SAAS,GAAmB;AACxE,QAAM,CAAE,cAAc,eAAgB,QAAI,yBAAU,KAAM;AAC1D,QAAM,CAAE,iBAAiB,kBAAmB,QAAI,yBAAU,KAAM;AAChE,QAAM,CAAE,oBAAoB,qBAAsB,QAAI,yBAEnD,IAAK;AAER,QAAM,YAAQ;AAAA,IACb,OAAQ;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,IACA,CAAE,cAAc,iBAAiB,kBAAmB;AAAA,EACrD;AAEA,SAAO,4CAAC,QAAQ,UAAR,EAAiB,OAAkB,UAAU;AACtD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/build/types.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/types.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Dashboard-specific types: `DashboardWidget`, grid settings, and the\n * `WidgetDashboard` prop bag.\n *\n * The widget contract types (`WidgetName`, `WidgetType`, `WidgetRenderProps`,\n * `ResolveWidgetModule`) live in `@wordpress/widget-primitives` and are\n * imported from there directly; this module does not re-export them.\n */\n\n/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport type {\n\tDashboardGridLayoutItem,\n\tDashboardLanesLayoutItem,\n} from '@wordpress/grid';\nimport type {\n\tWidgetName,\n\tWidgetType,\n\tResolveWidgetModule,\n} from '@wordpress/widget-primitives';\n\nexport type GridTilePlacement = Omit< DashboardGridLayoutItem, 'key' >;\nexport type MasonryTilePlacement = Omit< DashboardLanesLayoutItem, 'key' >;\n\n/**\n * Storage shape for a widget's placement.\n *\n * Structurally a union of every supported per-model shape, but the\n * intended invariant is stronger than the type suggests: every\n * placement in a given layout must match the shape of the currently\n * active `gridSettings.model`.
|
|
4
|
+
"sourcesContent": ["/**\n * Dashboard-specific types: `DashboardWidget`, grid settings, and the\n * `WidgetDashboard` prop bag.\n *\n * The widget contract types (`WidgetName`, `WidgetType`, `WidgetRenderProps`,\n * `ResolveWidgetModule`) live in `@wordpress/widget-primitives` and are\n * imported from there directly; this module does not re-export them.\n */\n\n/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport type {\n\tDashboardGridLayoutItem,\n\tDashboardLanesLayoutItem,\n} from '@wordpress/grid';\nimport type {\n\tWidgetName,\n\tWidgetType,\n\tResolveWidgetModule,\n} from '@wordpress/widget-primitives';\n\nexport type GridTilePlacement = Omit< DashboardGridLayoutItem, 'key' >;\nexport type MasonryTilePlacement = Omit< DashboardLanesLayoutItem, 'key' >;\n\n/**\n * Storage shape for a widget's placement.\n *\n * Structurally a union of every supported per-model shape, but the\n * intended invariant is stronger than the type suggests: every\n * placement in a given layout must match the shape of the currently\n * active `gridSettings.model`. Consumers that switch the model must\n * supply placements in the new shape; the render layer is allowed to\n * trust the active model and treat each placement as the matching\n * shape.\n *\n * The type system cannot enforce that invariant on its own (there is\n * no discriminator on the placement itself), so consider this union a\n * declaration of which shapes are *valid*, not which shape any given\n * placement happens to be at runtime.\n */\nexport type DashboardTilePlacement = GridTilePlacement | MasonryTilePlacement;\n\n/**\n * A widget placed on the dashboard.\n *\n * A `WidgetType` describes the blueprint. A `DashboardWidget` is a\n * concrete placement of that type on a specific dashboard: its unique\n * id, the type it references, user-configured attributes, and its\n * `placement` in the grid.\n */\nexport interface DashboardWidget< Item = unknown > {\n\t/**\n\t * Unique instance identifier.\n\t */\n\tuuid: string;\n\n\t/**\n\t * Widget type name — must match a `WidgetType.name` in `widgetTypes`.\n\t */\n\ttype: WidgetName;\n\n\t/**\n\t * User-configured attributes for this instance.\n\t */\n\tattributes?: Item;\n\n\t/**\n\t * Grid-model-specific placement (column/row spans, ordering,\n\t * etc.). Must match the shape implied by the dashboard's active\n\t * `gridSettings.model`; see `DashboardTilePlacement` for the\n\t * invariant.\n\t */\n\tplacement?: DashboardTilePlacement;\n}\n\n/**\n * Identity of a widget within the rendering tree. Returned by\n * `useWidgetContext()`; `null` when called outside a widget render subtree.\n */\nexport interface WidgetContextValue {\n\t/**\n\t * Widget instance id.\n\t */\n\tuuid: string;\n\n\t/**\n\t * Widget type name.\n\t */\n\tname: WidgetName;\n\n\t/**\n\t * Index of the widget in the `layout` array.\n\t */\n\tindex: number;\n}\n\n/**\n * Identifier for the active grid model. Drives which `@wordpress/grid`\n * surface the dashboard mounts and which per-model settings the\n * `WidgetGridSettings` union admits.\n *\n * Model names describe user-facing concepts. The mapping to the\n * underlying `@wordpress/grid` component is an implementation detail\n * resolved in the render layer; `'masonry'` is rendered today through\n * `DashboardLanes` (skyline placement) but could swap to a future\n * native `display: grid-lanes` path without affecting the model name.\n */\nexport type WidgetGridModel = 'grid' | 'masonry';\n\n/**\n * Maximum column count for the widget dashboard on wide containers.\n * Not user-configurable; container width steps the count down to two\n * and one column at fixed breakpoints.\n */\nexport const WIDGET_DASHBOARD_COLUMN_COUNT = 4;\n\n/**\n * Settings common to every grid model. Column count is resolved from\n * the dashboard container width (see\n * `utils/resolve-dashboard-column-count`). `columns` and `minColumnWidth`\n * on this type remain for persisted payloads and `@wordpress/grid`\n * compatibility; the dashboard ignores user-facing values for both.\n *\n * `spacing` is intentionally absent: the gap between tiles is\n * presentational and lives with the design-system theme/density, not\n * with per-dashboard settings. The grid surface keeps the prop for\n * programmatic overrides, but the dashboard does not propagate it.\n */\ninterface BaseWidgetGridSettings {\n\t/**\n\t * Target column count (cap). The dashboard always uses\n\t * {@link WIDGET_DASHBOARD_COLUMN_COUNT}; persisted values are ignored.\n\t */\n\tcolumns?: number;\n\n\t/**\n\t * Per-tile minimum width in pixels. Unused by the dashboard; column\n\t * count is derived from container width instead.\n\t */\n\tminColumnWidth?: number;\n}\n\n/**\n * 2D packed grid settings. Items declare explicit width and height\n * spans; rows use a uniform track height via `rowHeight`.\n */\nexport interface WidgetGridLayoutSettings extends BaseWidgetGridSettings {\n\tmodel?: 'grid';\n\n\t/**\n\t * Row height in pixels (`200` small, `300` medium, `400` large). Every\n\t * tile in a row fills the row vertically.\n\t */\n\trowHeight?: number;\n}\n\n/**\n * Masonry settings. Heights are content-driven; resize is\n * horizontal-only. `flowTolerance` tunes how aggressively the placer\n * preserves source order vs. minimizing empty regions.\n */\nexport interface WidgetMasonryLayoutSettings extends BaseWidgetGridSettings {\n\tmodel: 'masonry';\n\n\t/**\n\t * Pixel tolerance for source-order tiebreaking when two candidate\n\t * columns have similar baselines.\n\t */\n\tflowTolerance?: number;\n}\n\n/**\n * Discriminated union of supported grid-model configurations.\n *\n * When `model` is omitted the dashboard treats the settings as the\n * 2D packed grid (`'grid'`) for backwards compatibility with the\n * pre-union shape.\n */\nexport type WidgetGridSettings =\n\t| WidgetGridLayoutSettings\n\t| WidgetMasonryLayoutSettings;\n\n/**\n * Props for `WidgetDashboard`.\n *\n * The consumer owns the committed layout state; the dashboard maintains\n * a staging copy internally for in-progress edits, and `onLayoutChange`\n * fires only when the user commits via the Done action.\n */\nexport interface WidgetDashboardProps {\n\t/**\n\t * Widget instances to render. Consumer owns this state.\n\t */\n\tlayout: DashboardWidget[];\n\n\t/**\n\t * Called when the user commits in-progress edits via the Done action.\n\t * Receives the full layout array as it should be persisted. In-progress\n\t * mutations (reorder, resize, add, remove, attribute edits) accumulate\n\t * in the dashboard's internal staging layer and do not fire this\n\t * callback until commit.\n\t */\n\tonLayoutChange: ( layout: DashboardWidget[] ) => void;\n\n\t/**\n\t * Called when the layout is reset to the default.\n\t */\n\tonLayoutReset?: () => void;\n\n\t/**\n\t * Widget types available for rendering. The dashboard never queries a\n\t * store directly — consumers scope and filter via this prop.\n\t */\n\twidgetTypes: WidgetType[];\n\n\t/**\n\t * When true, widget types are still loading. Instances whose type is\n\t * not yet in `widgetTypes` show a loading state instead of missing.\n\t */\n\tisResolvingWidgetTypes?: boolean;\n\n\t/**\n\t * Whether the dashboard is in edit mode (enables drag/resize).\n\t */\n\teditMode?: boolean;\n\n\t/**\n\t * Called when edit mode toggles via `WidgetDashboard.Actions`.\n\t */\n\tonEditChange?: ( next: boolean ) => void;\n\n\t/**\n\t * Overrides the default `import()` resolution of\n\t * `WidgetType.renderModule`. Useful for tests, Storybook, or future\n\t * remote-URL loading.\n\t */\n\tresolveWidgetModule?: ResolveWidgetModule;\n\n\t/**\n\t * Grid model configuration. See `WidgetGridSettings` for the shape.\n\t * Read-only for the dashboard: the consumer owns the settings and\n\t * their persistence.\n\t */\n\tgridSettings?: WidgetGridSettings;\n\n\tchildren?: ReactNode;\n}\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAwHO,IAAM,gCAAgC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/build/utils/index.cjs
CHANGED
|
@@ -20,15 +20,12 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
20
20
|
// packages/widget-dashboard/src/utils/index.ts
|
|
21
21
|
var utils_exports = {};
|
|
22
22
|
__export(utils_exports, {
|
|
23
|
-
createDashboardWidget: () => import_create_dashboard_widget.createDashboardWidget
|
|
24
|
-
migrateLayout: () => import_migrate_layout.migrateLayout
|
|
23
|
+
createDashboardWidget: () => import_create_dashboard_widget.createDashboardWidget
|
|
25
24
|
});
|
|
26
25
|
module.exports = __toCommonJS(utils_exports);
|
|
27
26
|
var import_create_dashboard_widget = require("./create-dashboard-widget/index.cjs");
|
|
28
|
-
var import_migrate_layout = require("./migrate-layout/index.cjs");
|
|
29
27
|
// Annotate the CommonJS export names for ESM import in node:
|
|
30
28
|
0 && (module.exports = {
|
|
31
|
-
createDashboardWidget
|
|
32
|
-
migrateLayout
|
|
29
|
+
createDashboardWidget
|
|
33
30
|
});
|
|
34
31
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/index.ts"],
|
|
4
|
-
"sourcesContent": ["export { createDashboardWidget } from './create-dashboard-widget';\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA
|
|
4
|
+
"sourcesContent": ["export { createDashboardWidget } from './create-dashboard-widget';\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qCAAsC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -27,7 +27,6 @@ var import_dashboard_context = require("./context/dashboard-context.cjs");
|
|
|
27
27
|
var import_ui_context = require("./context/ui-context.cjs");
|
|
28
28
|
var import_actions = require("./components/actions/index.cjs");
|
|
29
29
|
var import_commands = require("./components/commands/index.cjs");
|
|
30
|
-
var import_layout_settings = require("./components/layout-settings/index.cjs");
|
|
31
30
|
var import_no_widgets_state = require("./components/no-widgets-state/index.cjs");
|
|
32
31
|
var import_reset_confirmation = require("./components/reset-confirmation/index.cjs");
|
|
33
32
|
var import_widget_chrome = require("./components/widget-chrome/index.cjs");
|
|
@@ -46,7 +45,6 @@ var WidgetDashboard = Object.assign(
|
|
|
46
45
|
onEditChange,
|
|
47
46
|
resolveWidgetModule,
|
|
48
47
|
gridSettings,
|
|
49
|
-
onGridSettingsChange,
|
|
50
48
|
children
|
|
51
49
|
}) {
|
|
52
50
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -61,7 +59,6 @@ var WidgetDashboard = Object.assign(
|
|
|
61
59
|
onEditChange,
|
|
62
60
|
resolveWidgetModule,
|
|
63
61
|
gridSettings,
|
|
64
|
-
onGridSettingsChange,
|
|
65
62
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ui_context.WidgetDashboardUIProvider, { children: [
|
|
66
63
|
children ?? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
67
64
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_no_widgets_state.NoWidgetsState, {}),
|
|
@@ -70,7 +67,6 @@ var WidgetDashboard = Object.assign(
|
|
|
70
67
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_commands.Commands, {})
|
|
71
68
|
] }),
|
|
72
69
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_widget_inserter.WidgetInserter, {}),
|
|
73
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_layout_settings.LayoutSettings, {}),
|
|
74
70
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_widget_settings.WidgetSettings, {}),
|
|
75
71
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_reset_confirmation.ResetConfirmation, {})
|
|
76
72
|
] })
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/widget-dashboard.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport { WidgetDashboardProvider } from './context/dashboard-context';\nimport { WidgetDashboardUIProvider } from './context/ui-context';\nimport { Actions } from './components/actions';\nimport { Commands } from './components/commands';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,+BAAwC;AACxC,wBAA0C;AAC1C,qBAAwB;AACxB,sBAAyB;AACzB,
|
|
4
|
+
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport { WidgetDashboardProvider } from './context/dashboard-context';\nimport { WidgetDashboardUIProvider } from './context/ui-context';\nimport { Actions } from './components/actions';\nimport { Commands } from './components/commands';\nimport { NoWidgetsState } from './components/no-widgets-state';\nimport { ResetConfirmation } from './components/reset-confirmation';\nimport { WidgetChrome } from './components/widget-chrome';\nimport { WidgetInserter } from './components/widget-inserter';\nimport { WidgetSettings } from './components/widget-settings';\nimport { Widgets } from './components/widgets';\nimport type { WidgetDashboardProps } from './types';\n\n/**\n * Stateless rendering engine for widget dashboards.\n *\n * The consumer owns `layout` and `editMode` state; every mutation fires\n * `onLayoutChange` with the fully updated array. The engine never queries a\n * widget store; types flow in via the `widgetTypes` prop.\n *\n * ```tsx\n * import { WidgetDashboard } from '@wordpress/widget-dashboard';\n *\n * function MyDashboard() {\n * \tconst [ layout, setLayout ] = useState( defaultLayout );\n * \tconst [ editMode, setEditMode ] = useState( false );\n * \treturn (\n * \t\t<WidgetDashboard\n * \t\t\tlayout={ layout }\n * \t\t\tonLayoutChange={ setLayout }\n * \t\t\twidgetTypes={ widgetTypes }\n * \t\t\teditMode={ editMode }\n * \t\t\tonEditChange={ setEditMode }\n * \t\t>\n * \t\t\t<WidgetDashboard.NoWidgetsState>\n * \t\t\t\t<p>No widgets yet.</p>\n * \t\t\t</WidgetDashboard.NoWidgetsState>\n * \t\t\t<WidgetDashboard.Actions />\n * \t\t\t<WidgetDashboard.Widgets />\n * \t\t\t<WidgetDashboard.Commands />\n * \t\t</WidgetDashboard>\n * \t);\n * }\n * ```\n *\n * Children compose the dashboard's triggers and chrome: `Actions`,\n * `Widgets`, `Commands`, `NoWidgetsState`. The targets they open (the\n * widget inserter, the widget settings editor, the reset confirmation) are\n * mounted by the engine and driven by shared UI state, so a trigger works\n * wherever it is composed without a matching target in the tree. Omitting\n * `children` renders the default arrangement.\n */\nexport const WidgetDashboard = Object.assign(\n\tfunction WidgetDashboard( {\n\t\tlayout,\n\t\tonLayoutChange,\n\t\tonLayoutReset,\n\t\twidgetTypes,\n\t\tisResolvingWidgetTypes,\n\t\teditMode,\n\t\tonEditChange,\n\t\tresolveWidgetModule,\n\t\tgridSettings,\n\t\tchildren,\n\t}: WidgetDashboardProps ) {\n\t\treturn (\n\t\t\t<WidgetDashboardProvider\n\t\t\t\tlayout={ layout }\n\t\t\t\tonLayoutChange={ onLayoutChange }\n\t\t\t\tonLayoutReset={ onLayoutReset }\n\t\t\t\twidgetTypes={ widgetTypes }\n\t\t\t\tisResolvingWidgetTypes={ isResolvingWidgetTypes }\n\t\t\t\teditMode={ editMode }\n\t\t\t\tonEditChange={ onEditChange }\n\t\t\t\tresolveWidgetModule={ resolveWidgetModule }\n\t\t\t\tgridSettings={ gridSettings }\n\t\t\t>\n\t\t\t\t<WidgetDashboardUIProvider>\n\t\t\t\t\t{ children ?? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<NoWidgetsState />\n\t\t\t\t\t\t\t<Actions />\n\t\t\t\t\t\t\t<Widgets />\n\t\t\t\t\t\t\t<Commands />\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<WidgetInserter />\n\t\t\t\t\t<WidgetSettings />\n\t\t\t\t\t<ResetConfirmation />\n\t\t\t\t</WidgetDashboardUIProvider>\n\t\t\t</WidgetDashboardProvider>\n\t\t);\n\t},\n\t{ Actions, Widgets, WidgetChrome, NoWidgetsState, Commands }\n);\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,+BAAwC;AACxC,wBAA0C;AAC1C,qBAAwB;AACxB,sBAAyB;AACzB,8BAA+B;AAC/B,gCAAkC;AAClC,2BAA6B;AAC7B,6BAA+B;AAC/B,6BAA+B;AAC/B,qBAAwB;AAqElB;AA3BC,IAAM,kBAAkB,OAAO;AAAA,EACrC,SAASA,iBAAiB;AAAA,IACzB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,GAA0B;AACzB,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA,uDAAC,+CACE;AAAA,sBACD,4EACC;AAAA,wDAAC,0CAAe;AAAA,YAChB,4CAAC,0BAAQ;AAAA,YACT,4CAAC,0BAAQ;AAAA,YACT,4CAAC,4BAAS;AAAA,aACX;AAAA,UAGD,4CAAC,yCAAe;AAAA,UAChB,4CAAC,yCAAe;AAAA,UAChB,4CAAC,+CAAkB;AAAA,WACpB;AAAA;AAAA,IACD;AAAA,EAEF;AAAA,EACA,EAAE,iCAAS,iCAAS,iDAAc,wDAAgB,mCAAS;AAC5D;",
|
|
6
6
|
"names": ["WidgetDashboard"]
|
|
7
7
|
}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { useSelect } from "@wordpress/data";
|
|
3
3
|
import { useCallback, useEffect, useState } from "@wordpress/element";
|
|
4
4
|
import { __ } from "@wordpress/i18n";
|
|
5
|
-
import {
|
|
5
|
+
import { plus } from "@wordpress/icons";
|
|
6
6
|
import { store as viewportStore } from "@wordpress/viewport";
|
|
7
7
|
import { Button, Stack } from "@wordpress/ui";
|
|
8
8
|
import { useDashboardInternalContext } from "../../context/dashboard-context.mjs";
|
|
@@ -93,9 +93,9 @@ function registerStyle(hash, css) {
|
|
|
93
93
|
|
|
94
94
|
// packages/widget-dashboard/src/components/actions/actions.module.css
|
|
95
95
|
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") {
|
|
96
|
-
registerStyle("
|
|
96
|
+
registerStyle("fb18de5324", "._4cb74a57d7aea824__edit-actions-enter,._852c67c33a5780a8__edit-actions-exit{align-items:center;display:inline-flex;gap:var(--wp--preset--spacing--20);transform-origin:right center}._815569a4ac9877f6__edit-actions-divider{align-self:center;background-color:var(--wpds-color-stroke-surface-neutral,#dbdbdb);flex-shrink:0;height:var(--wpds-dimension-size-2xs,16px);width:1px}@media not (prefers-reduced-motion){._4cb74a57d7aea824__edit-actions-enter,._852c67c33a5780a8__edit-actions-exit{will-change:opacity,transform}._4cb74a57d7aea824__edit-actions-enter{animation:_332d3153b716aa20__actions-slide-in var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-expressive,cubic-bezier(.25,0,0,1)) forwards}._852c67c33a5780a8__edit-actions-exit{animation:_4dff70702a4b0f40__actions-fold-out var(--wpds-motion-duration-sm,.1s) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)) forwards}@keyframes _332d3153b716aa20__actions-slide-in{0%{opacity:0;transform:translateX(12px) scaleX(.92)}to{opacity:1;transform:translateX(0) scaleX(1)}}@keyframes _4dff70702a4b0f40__actions-fold-out{0%{opacity:1;transform:translateX(0) scaleX(1)}to{opacity:0;transform:translateX(12px) scaleX(.92)}}}");
|
|
97
97
|
}
|
|
98
|
-
var actions_default = { "
|
|
98
|
+
var actions_default = { "edit-actions-enter": "_4cb74a57d7aea824__edit-actions-enter", "edit-actions-exit": "_852c67c33a5780a8__edit-actions-exit", "edit-actions-divider": "_815569a4ac9877f6__edit-actions-divider", "actions-slide-in": "_332d3153b716aa20__actions-slide-in", "actions-fold-out": "_4dff70702a4b0f40__actions-fold-out" };
|
|
99
99
|
|
|
100
100
|
// packages/widget-dashboard/src/components/actions/actions.tsx
|
|
101
101
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -106,8 +106,7 @@ function Actions() {
|
|
|
106
106
|
onLayoutReset,
|
|
107
107
|
commit,
|
|
108
108
|
cancel: cancelStaging,
|
|
109
|
-
hasUncommittedChanges
|
|
110
|
-
canEditGridSettings
|
|
109
|
+
hasUncommittedChanges
|
|
111
110
|
} = useDashboardInternalContext();
|
|
112
111
|
const [isEditActionsMounted, setIsEditActionsMounted] = useState(editMode);
|
|
113
112
|
const [isExitingEditActions, setIsExitingEditActions] = useState(false);
|
|
@@ -127,7 +126,7 @@ function Actions() {
|
|
|
127
126
|
}, 220);
|
|
128
127
|
return () => clearTimeout(exitTimeout);
|
|
129
128
|
}, [editMode, isEditActionsMounted]);
|
|
130
|
-
const { setInserterOpen,
|
|
129
|
+
const { setInserterOpen, setResetDialogOpen } = useDashboardUIContext();
|
|
131
130
|
const isMobileViewport = useSelect(
|
|
132
131
|
(select) => select(viewportStore).isViewportMatch("< small"),
|
|
133
132
|
[]
|
|
@@ -144,9 +143,6 @@ function Actions() {
|
|
|
144
143
|
const done = useCallback(() => {
|
|
145
144
|
commit();
|
|
146
145
|
}, [commit]);
|
|
147
|
-
const openLayoutSettings = useCallback(() => {
|
|
148
|
-
setLayoutSettingsOpen(true);
|
|
149
|
-
}, [setLayoutSettingsOpen]);
|
|
150
146
|
const menuItems = [
|
|
151
147
|
{
|
|
152
148
|
label: __("Reset to default"),
|
|
@@ -163,7 +159,7 @@ function Actions() {
|
|
|
163
159
|
{
|
|
164
160
|
direction: "row",
|
|
165
161
|
gap: "sm",
|
|
166
|
-
className: isExitingEditActions ? actions_default
|
|
162
|
+
className: isExitingEditActions ? actions_default["edit-actions-exit"] : actions_default["edit-actions-enter"],
|
|
167
163
|
children: [
|
|
168
164
|
/* @__PURE__ */ jsxs(
|
|
169
165
|
Button,
|
|
@@ -178,23 +174,10 @@ function Actions() {
|
|
|
178
174
|
]
|
|
179
175
|
}
|
|
180
176
|
),
|
|
181
|
-
canEditGridSettings && /* @__PURE__ */ jsxs(
|
|
182
|
-
Button,
|
|
183
|
-
{
|
|
184
|
-
variant: "minimal",
|
|
185
|
-
tone: "brand",
|
|
186
|
-
size: "compact",
|
|
187
|
-
onClick: openLayoutSettings,
|
|
188
|
-
children: [
|
|
189
|
-
!isMobileViewport && /* @__PURE__ */ jsx(Button.Icon, { icon: layoutIcon }),
|
|
190
|
-
__("Layout settings")
|
|
191
|
-
]
|
|
192
|
-
}
|
|
193
|
-
),
|
|
194
177
|
/* @__PURE__ */ jsx(
|
|
195
178
|
"div",
|
|
196
179
|
{
|
|
197
|
-
className: actions_default
|
|
180
|
+
className: actions_default["edit-actions-divider"],
|
|
198
181
|
"aria-hidden": "true"
|
|
199
182
|
}
|
|
200
183
|
),
|