@wordpress/block-editor 15.18.1-next.v.202604201441.0 → 15.19.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 +7 -1
- package/build/components/autocomplete/index.cjs.map +3 -3
- package/build/components/background-image-control/index.cjs +2 -1
- package/build/components/background-image-control/index.cjs.map +2 -2
- package/build/components/block-allowed-blocks/modal.cjs.map +2 -2
- package/build/components/block-bindings/attribute-control.cjs.map +3 -3
- package/build/components/block-card/index.cjs +2 -2
- package/build/components/block-card/index.cjs.map +3 -3
- package/build/components/block-controls/fill.cjs.map +2 -2
- package/build/components/block-inspector/edit-contents.cjs +7 -1
- package/build/components/block-inspector/edit-contents.cjs.map +2 -2
- package/build/components/block-mover/button.cjs +9 -3
- package/build/components/block-mover/button.cjs.map +2 -2
- package/build/components/block-pattern-setup/index.cjs +3 -2
- package/build/components/block-pattern-setup/index.cjs.map +2 -2
- package/build/components/block-patterns-list/index.cjs +2 -1
- package/build/components/block-patterns-list/index.cjs.map +2 -2
- package/build/components/block-patterns-paging/index.cjs.map +3 -3
- package/build/components/block-settings-menu/block-settings-dropdown.cjs +2 -2
- package/build/components/block-settings-menu/block-settings-dropdown.cjs.map +3 -3
- package/build/components/block-settings-menu/index.cjs +2 -2
- package/build/components/block-settings-menu/index.cjs.map +3 -3
- package/build/components/block-styles/menu-items.cjs.map +3 -3
- package/build/components/block-switcher/index.cjs.map +3 -3
- package/build/components/block-switcher/pattern-transformations-menu.cjs +2 -1
- package/build/components/block-switcher/pattern-transformations-menu.cjs.map +2 -2
- package/build/components/block-toolbar/edit-section-button.cjs +7 -1
- package/build/components/block-toolbar/edit-section-button.cjs.map +2 -2
- package/build/components/block-toolbar/pattern-overrides-dropdown.cjs.map +3 -3
- package/build/components/block-variation-transforms/index.cjs +4 -3
- package/build/components/block-variation-transforms/index.cjs.map +2 -2
- package/build/components/block-visibility/modal.cjs +0 -10
- package/build/components/block-visibility/modal.cjs.map +3 -3
- package/build/components/block-visibility/viewport-visibility-info.cjs +2 -2
- package/build/components/block-visibility/viewport-visibility-info.cjs.map +3 -3
- package/build/components/collab/{block-comment-icon-slot.cjs → note-icon-slot.cjs} +8 -8
- package/build/components/collab/note-icon-slot.cjs.map +7 -0
- package/build/components/collab/{block-comment-icon-toolbar-slot.cjs → note-icon-toolbar-slot.cjs} +9 -9
- package/build/components/collab/note-icon-toolbar-slot.cjs.map +7 -0
- package/build/components/date-format-picker/index.cjs +2 -1
- package/build/components/date-format-picker/index.cjs.map +2 -2
- package/build/components/dimensions-tool/scale-tool.cjs +2 -2
- package/build/components/dimensions-tool/scale-tool.cjs.map +2 -2
- package/build/components/global-styles/state-control.cjs +111 -37
- package/build/components/global-styles/state-control.cjs.map +3 -3
- package/build/components/gradients/use-gradient.cjs +2 -2
- package/build/components/gradients/use-gradient.cjs.map +2 -2
- package/build/components/grid/grid-item-movers.cjs +2 -1
- package/build/components/grid/grid-item-movers.cjs.map +2 -2
- package/build/components/iframe/use-scale-canvas.cjs.map +2 -2
- package/build/components/inserter/block-patterns-tab/pattern-category-previews.cjs.map +2 -2
- package/build/components/inserter/index.cjs +41 -43
- package/build/components/inserter/index.cjs.map +2 -2
- package/build/components/inserter/menu.cjs +32 -3
- package/build/components/inserter/menu.cjs.map +3 -3
- package/build/components/inserter/search-results.cjs +3 -3
- package/build/components/inserter/search-results.cjs.map +2 -2
- package/build/components/inserter/tips.cjs +1 -1
- package/build/components/inserter/tips.cjs.map +2 -2
- package/build/components/inspector-popover-header/index.cjs.map +3 -3
- package/build/components/link-control/link-preview.cjs +2 -2
- package/build/components/link-control/link-preview.cjs.map +2 -2
- package/build/components/link-control/settings.cjs +2 -1
- package/build/components/link-control/settings.cjs.map +2 -2
- package/build/components/link-picker/link-picker.cjs +3 -2
- package/build/components/link-picker/link-picker.cjs.map +2 -2
- package/build/components/link-picker/link-preview.cjs +2 -2
- package/build/components/link-picker/link-preview.cjs.map +2 -2
- package/build/components/list-view/block-select-button.cjs +2 -2
- package/build/components/list-view/block-select-button.cjs.map +2 -2
- package/build/components/list-view/index.cjs +2 -1
- package/build/components/list-view/index.cjs.map +2 -2
- package/build/components/provider/index.cjs +80 -7
- package/build/components/provider/index.cjs.map +2 -2
- package/build/components/responsive-block-control/label.cjs +9 -2
- package/build/components/responsive-block-control/label.cjs.map +2 -2
- package/build/components/rich-text/event-listeners/index.cjs.map +2 -2
- package/build/components/rich-text/event-listeners/paste-handler.cjs +12 -5
- package/build/components/rich-text/event-listeners/paste-handler.cjs.map +3 -3
- package/build/hooks/block-bindings.cjs.map +3 -3
- package/build/hooks/custom-css.cjs +1 -1
- package/build/hooks/custom-css.cjs.map +2 -2
- package/build/layouts/flex.cjs +5 -8
- package/build/layouts/flex.cjs.map +3 -3
- package/build/layouts/grid.cjs +5 -5
- package/build/layouts/grid.cjs.map +2 -2
- package/build/private-apis.cjs +5 -4
- package/build/private-apis.cjs.map +3 -3
- package/build/store/actions.cjs +2 -2
- package/build/store/actions.cjs.map +2 -2
- package/build/store/private-keys.cjs +3 -0
- package/build/store/private-keys.cjs.map +2 -2
- package/build/store/reducer.cjs +8 -30
- package/build/store/reducer.cjs.map +2 -2
- package/build/store/selectors.cjs.map +2 -2
- package/build/utils/dom.cjs +3 -1
- package/build/utils/dom.cjs.map +2 -2
- package/build-module/components/autocomplete/index.mjs +2 -2
- package/build-module/components/autocomplete/index.mjs.map +2 -2
- package/build-module/components/background-image-control/index.mjs +2 -2
- package/build-module/components/background-image-control/index.mjs.map +2 -2
- package/build-module/components/block-allowed-blocks/modal.mjs +2 -2
- package/build-module/components/block-allowed-blocks/modal.mjs.map +2 -2
- package/build-module/components/block-bindings/attribute-control.mjs +3 -3
- package/build-module/components/block-bindings/attribute-control.mjs.map +2 -2
- package/build-module/components/block-card/index.mjs +4 -4
- package/build-module/components/block-card/index.mjs.map +2 -2
- package/build-module/components/block-controls/fill.mjs.map +2 -2
- package/build-module/components/block-inspector/edit-contents.mjs +7 -1
- package/build-module/components/block-inspector/edit-contents.mjs.map +2 -2
- package/build-module/components/block-mover/button.mjs +11 -5
- package/build-module/components/block-mover/button.mjs.map +2 -2
- package/build-module/components/block-pattern-setup/index.mjs +2 -1
- package/build-module/components/block-pattern-setup/index.mjs.map +2 -2
- package/build-module/components/block-patterns-list/index.mjs +1 -1
- package/build-module/components/block-patterns-list/index.mjs.map +2 -2
- package/build-module/components/block-patterns-paging/index.mjs +3 -3
- package/build-module/components/block-patterns-paging/index.mjs.map +2 -2
- package/build-module/components/block-settings-menu/block-settings-dropdown.mjs +2 -2
- package/build-module/components/block-settings-menu/block-settings-dropdown.mjs.map +2 -2
- package/build-module/components/block-settings-menu/index.mjs +2 -2
- package/build-module/components/block-settings-menu/index.mjs.map +2 -2
- package/build-module/components/block-styles/menu-items.mjs +2 -2
- package/build-module/components/block-styles/menu-items.mjs.map +2 -2
- package/build-module/components/block-switcher/index.mjs +2 -2
- package/build-module/components/block-switcher/index.mjs.map +2 -2
- package/build-module/components/block-switcher/pattern-transformations-menu.mjs +2 -7
- package/build-module/components/block-switcher/pattern-transformations-menu.mjs.map +2 -2
- package/build-module/components/block-toolbar/edit-section-button.mjs +7 -1
- package/build-module/components/block-toolbar/edit-section-button.mjs.map +2 -2
- package/build-module/components/block-toolbar/pattern-overrides-dropdown.mjs +2 -2
- package/build-module/components/block-toolbar/pattern-overrides-dropdown.mjs.map +2 -2
- package/build-module/components/block-variation-transforms/index.mjs +4 -4
- package/build-module/components/block-variation-transforms/index.mjs.map +2 -2
- package/build-module/components/block-visibility/modal.mjs +0 -10
- package/build-module/components/block-visibility/modal.mjs.map +3 -3
- package/build-module/components/block-visibility/viewport-visibility-info.mjs +4 -4
- package/build-module/components/block-visibility/viewport-visibility-info.mjs.map +2 -2
- package/build-module/components/collab/note-icon-slot.mjs +8 -0
- package/build-module/components/collab/note-icon-slot.mjs.map +7 -0
- package/build-module/components/collab/note-icon-toolbar-slot.mjs +10 -0
- package/build-module/components/collab/note-icon-toolbar-slot.mjs.map +7 -0
- package/build-module/components/date-format-picker/index.mjs +2 -2
- package/build-module/components/date-format-picker/index.mjs.map +2 -2
- package/build-module/components/dimensions-tool/scale-tool.mjs +2 -2
- package/build-module/components/dimensions-tool/scale-tool.mjs.map +2 -2
- package/build-module/components/global-styles/state-control.mjs +119 -40
- package/build-module/components/global-styles/state-control.mjs.map +2 -2
- package/build-module/components/gradients/use-gradient.mjs +2 -2
- package/build-module/components/gradients/use-gradient.mjs.map +2 -2
- package/build-module/components/grid/grid-item-movers.mjs +2 -5
- package/build-module/components/grid/grid-item-movers.mjs.map +2 -2
- package/build-module/components/iframe/use-scale-canvas.mjs.map +2 -2
- package/build-module/components/inserter/block-patterns-tab/pattern-category-previews.mjs +3 -3
- package/build-module/components/inserter/block-patterns-tab/pattern-category-previews.mjs.map +1 -1
- package/build-module/components/inserter/index.mjs +41 -43
- package/build-module/components/inserter/index.mjs.map +2 -2
- package/build-module/components/inserter/menu.mjs +34 -4
- package/build-module/components/inserter/menu.mjs.map +2 -2
- package/build-module/components/inserter/search-results.mjs +1 -1
- package/build-module/components/inserter/search-results.mjs.map +1 -1
- package/build-module/components/inserter/tips.mjs +1 -1
- package/build-module/components/inserter/tips.mjs.map +2 -2
- package/build-module/components/inspector-popover-header/index.mjs +2 -2
- package/build-module/components/inspector-popover-header/index.mjs.map +2 -2
- package/build-module/components/link-control/link-preview.mjs +2 -2
- package/build-module/components/link-control/link-preview.mjs.map +2 -2
- package/build-module/components/link-control/settings.mjs +3 -2
- package/build-module/components/link-control/settings.mjs.map +2 -2
- package/build-module/components/link-picker/link-picker.mjs +1 -1
- package/build-module/components/link-picker/link-picker.mjs.map +2 -2
- package/build-module/components/link-picker/link-preview.mjs +2 -2
- package/build-module/components/link-picker/link-preview.mjs.map +2 -2
- package/build-module/components/list-view/block-select-button.mjs +2 -2
- package/build-module/components/list-view/block-select-button.mjs.map +2 -2
- package/build-module/components/list-view/index.mjs +2 -4
- package/build-module/components/list-view/index.mjs.map +2 -2
- package/build-module/components/provider/index.mjs +82 -8
- package/build-module/components/provider/index.mjs.map +2 -2
- package/build-module/components/responsive-block-control/label.mjs +9 -2
- package/build-module/components/responsive-block-control/label.mjs.map +2 -2
- package/build-module/components/rich-text/event-listeners/index.mjs.map +2 -2
- package/build-module/components/rich-text/event-listeners/paste-handler.mjs +12 -5
- package/build-module/components/rich-text/event-listeners/paste-handler.mjs.map +2 -2
- package/build-module/hooks/block-bindings.mjs +2 -2
- package/build-module/hooks/block-bindings.mjs.map +2 -2
- package/build-module/hooks/custom-css.mjs +1 -1
- package/build-module/hooks/custom-css.mjs.map +2 -2
- package/build-module/layouts/flex.mjs +4 -7
- package/build-module/layouts/flex.mjs.map +2 -2
- package/build-module/layouts/grid.mjs +4 -4
- package/build-module/layouts/grid.mjs.map +2 -2
- package/build-module/private-apis.mjs +7 -5
- package/build-module/private-apis.mjs.map +2 -2
- package/build-module/store/actions.mjs +2 -2
- package/build-module/store/actions.mjs.map +2 -2
- package/build-module/store/private-keys.mjs +2 -0
- package/build-module/store/private-keys.mjs.map +2 -2
- package/build-module/store/reducer.mjs +8 -30
- package/build-module/store/reducer.mjs.map +2 -2
- package/build-module/store/selectors.mjs.map +2 -2
- package/build-module/utils/dom.mjs +2 -1
- package/build-module/utils/dom.mjs.map +2 -2
- package/build-style/content-rtl.css +0 -3
- package/build-style/content.css +0 -3
- package/build-style/style-rtl.css +29 -3
- package/build-style/style.css +29 -3
- package/build-types/components/block-context/index.d.ts +9 -16
- package/build-types/components/block-context/index.d.ts.map +1 -1
- package/build-types/utils/dom.d.ts +13 -6
- package/build-types/utils/dom.d.ts.map +1 -1
- package/package.json +39 -38
- package/src/components/autocomplete/index.js +4 -2
- package/src/components/background-image-control/index.js +2 -2
- package/src/components/block-allowed-blocks/modal.js +3 -3
- package/src/components/block-bindings/attribute-control.js +4 -4
- package/src/components/block-card/index.js +5 -5
- package/src/components/block-controls/fill.js +1 -0
- package/src/components/block-inspector/edit-contents.js +4 -2
- package/src/components/block-list/content.scss +0 -4
- package/src/components/block-manager/style.scss +3 -2
- package/src/components/block-mover/button.js +17 -7
- package/src/components/block-pattern-setup/index.js +2 -1
- package/src/components/block-patterns-list/index.js +1 -1
- package/src/components/block-patterns-paging/index.js +5 -6
- package/src/components/block-settings-menu/block-settings-dropdown.js +2 -2
- package/src/components/block-settings-menu/index.js +2 -2
- package/src/components/block-styles/menu-items.js +3 -3
- package/src/components/block-switcher/index.js +3 -3
- package/src/components/block-switcher/pattern-transformations-menu.js +2 -7
- package/src/components/block-toolbar/edit-section-button.js +5 -1
- package/src/components/block-toolbar/pattern-overrides-dropdown.js +2 -2
- package/src/components/block-variation-transforms/index.js +4 -4
- package/src/components/block-visibility/modal.js +0 -1
- package/src/components/block-visibility/viewport-visibility-info.js +5 -5
- package/src/components/collab/note-icon-slot.js +8 -0
- package/src/components/collab/note-icon-toolbar-slot.js +10 -0
- package/src/components/date-format-picker/index.js +4 -2
- package/src/components/dimensions-tool/scale-tool.js +2 -2
- package/src/components/global-styles/state-control.js +152 -49
- package/src/components/global-styles/style.scss +9 -0
- package/src/components/gradients/use-gradient.js +3 -1
- package/src/components/grid/grid-item-movers.js +2 -5
- package/src/components/iframe/use-scale-canvas.js +0 -4
- package/src/components/inner-blocks/README.md +5 -1
- package/src/components/inner-blocks/index.native.js +1 -1
- package/src/components/inserter/block-patterns-tab/pattern-category-previews.js +5 -5
- package/src/components/inserter/index.js +58 -69
- package/src/components/inserter/menu.js +35 -3
- package/src/components/inserter/search-results.js +1 -1
- package/src/components/inserter/style.scss +18 -3
- package/src/components/inserter/tips.js +1 -1
- package/src/components/inspector-popover-header/index.js +2 -2
- package/src/components/link-control/link-preview.js +3 -3
- package/src/components/link-control/settings.js +3 -2
- package/src/components/link-picker/link-picker.js +1 -1
- package/src/components/link-picker/link-preview.js +3 -3
- package/src/components/list-view/block-select-button.js +3 -3
- package/src/components/list-view/index.js +2 -4
- package/src/components/provider/index.js +149 -8
- package/src/components/responsive-block-control/label.js +5 -2
- package/src/components/rich-text/event-listeners/index.js +0 -1
- package/src/components/rich-text/event-listeners/paste-handler.js +18 -4
- package/src/hooks/block-bindings.js +3 -3
- package/src/hooks/custom-css.js +1 -8
- package/src/layouts/flex.js +7 -9
- package/src/layouts/grid.js +7 -4
- package/src/private-apis.js +6 -4
- package/src/store/actions.js +12 -6
- package/src/store/private-keys.js +1 -0
- package/src/store/reducer.js +11 -39
- package/src/store/selectors.js +6 -0
- package/src/store/test/reducer.js +39 -0
- package/src/utils/dom.js +3 -3
- package/src/utils/test/dom.js +47 -4
- package/build/components/collab/block-comment-icon-slot.cjs.map +0 -7
- package/build/components/collab/block-comment-icon-toolbar-slot.cjs.map +0 -7
- package/build-module/components/collab/block-comment-icon-slot.mjs +0 -8
- package/build-module/components/collab/block-comment-icon-slot.mjs.map +0 -7
- package/build-module/components/collab/block-comment-icon-toolbar-slot.mjs +0 -10
- package/build-module/components/collab/block-comment-icon-toolbar-slot.mjs.map +0 -7
- package/src/components/collab/block-comment-icon-slot.js +0 -8
- package/src/components/collab/block-comment-icon-toolbar-slot.js +0 -10
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/global-styles/state-control.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { check, chevronDown } from '@wordpress/icons';\nimport {\n\tDropdownMenu,\n\tMenuGroup,\n\tMenuItem,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\n\nconst { Badge: WCBadge } = unlock( componentsPrivateApis );\n\n/**\n * State control for managing viewport and pseudo-state styles.\n * Displays a dropdown menu with separate groups for each selector.\n *\n * @param {Object} props Component props.\n * @param {Array} props.viewportStates Array of available viewport states.\n * @param {Array} props.pseudoStates Array of available pseudo states.\n * @param {string} props.viewportValue Currently selected viewport value.\n * @param {string} props.pseudoStateValue Currently selected pseudo state value.\n * @param {Function} props.onChangeViewport Callback when viewport selection changes.\n * @param {Function} props.onChangePseudoState Callback when pseudo state selection changes.\n * @return {Element|null} State control component.\n */\nexport default function StateControl( {\n\tviewportStates = [],\n\tpseudoStates = [],\n\tviewportValue = 'default',\n\tpseudoStateValue = 'default',\n\tonChangeViewport,\n\tonChangePseudoState,\n} ) {\n\tif ( ! viewportStates.length && ! pseudoStates.length ) {\n\t\treturn null;\n\t}\n\n\tconst viewportOptions = [\n\t\t{ label: __( 'Default' ), value: 'default' },\n\t\t...viewportStates.map( ( state ) => ( {\n\t\t\tlabel: state.label,\n\t\t\tvalue: state.value,\n\t\t} ) ),\n\t];\n\tconst pseudoStateOptions = [\n\t\t{ label: __( 'Default' ), value: 'default' },\n\t\t...pseudoStates.map( ( state ) => ( {\n\t\t\tlabel: state.label,\n\t\t\tvalue: state.value,\n\t\t} ) ),\n\t];\n\n\tconst hasViewportOptions = viewportStates.length > 0;\n\tconst hasPseudoStateOptions = pseudoStates.length > 0;\n\tconst triggerLabel = __( 'States' );\n\tconst activeStates = [];\n\n\tif ( hasViewportOptions && viewportValue !== 'default' ) {\n\t\tconst selectedViewport = viewportOptions.find(\n\t\t\t( option ) => option.value === viewportValue\n\t\t);\n\n\t\tif ( selectedViewport ) {\n\t\t\tactiveStates.push( {\n\t\t\t\tkey: `viewport-${ selectedViewport.value }`,\n\t\t\t\tlabel: selectedViewport.label,\n\t\t\t} );\n\t\t}\n\t}\n\n\tif ( hasPseudoStateOptions && pseudoStateValue !== 'default' ) {\n\t\tconst selectedPseudoState = pseudoStateOptions.find(\n\t\t\t( option ) => option.value === pseudoStateValue\n\t\t);\n\n\t\tif ( selectedPseudoState ) {\n\t\t\tactiveStates.push( {\n\t\t\t\tkey: `pseudo-${ selectedPseudoState.value }`,\n\t\t\t\tlabel: selectedPseudoState.label,\n\t\t\t} );\n\t\t}\n\t}\n\n\treturn (\n\t\t<Stack\n\t\t\tdirection=\"column\"\n\t\t\tgap=\"sm\"\n\t\t\talign=\"flex-end\"\n\t\t\tclassName=\"block-editor-global-styles-state-control\"\n\t\t>\n\t\t\t<DropdownMenu\n\t\t\t\ticon={ chevronDown }\n\t\t\t\tlabel={ triggerLabel }\n\t\t\t\tpopoverProps={ {\n\t\t\t\t\tplacement: 'right-start',\n\t\t\t\t} }\n\t\t\t\ttext={ triggerLabel }\n\t\t\t\ttoggleProps={ {\n\t\t\t\t\tsize: 'compact',\n\t\t\t\t\tvariant: 'tertiary',\n\t\t\t\t\ticonPosition: 'right',\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ ( { onClose } ) => (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{ hasViewportOptions && (\n\t\t\t\t\t\t\t<MenuGroup label={ __( 'Viewport' ) }>\n\t\t\t\t\t\t\t\t{ viewportOptions.map( ( option ) => (\n\t\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\t\tkey={ `viewport-${ option.value }` }\n\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\tonChangeViewport?.( option.value );\n\t\t\t\t\t\t\t\t\t\t\tif ( ! hasPseudoStateOptions ) {\n\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tviewportValue === option.value\n\t\t\t\t\t\t\t\t\t\t\t\t? check\n\t\t\t\t\t\t\t\t\t\t\t\t: null\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ option.label }\n\t\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ hasPseudoStateOptions && (\n\t\t\t\t\t\t\t<MenuGroup label={ __( 'Pseudo state' ) }>\n\t\t\t\t\t\t\t\t{ pseudoStateOptions.map( ( option ) => (\n\t\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\t\tkey={ `pseudo-${ option.value }` }\n\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\tonChangePseudoState?.(\n\t\t\t\t\t\t\t\t\t\t\t\toption.value\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\tif ( ! hasViewportOptions ) {\n\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tpseudoStateValue === option.value\n\t\t\t\t\t\t\t\t\t\t\t\t? check\n\t\t\t\t\t\t\t\t\t\t\t\t: null\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ option.label }\n\t\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</>\n\t\t\t\t) }\n\t\t\t</DropdownMenu>\n\t\t\t<Stack\n\t\t\t\tclassName=\"block-editor-global-styles-state-control__badges\"\n\t\t\t\tdirection=\"row\"\n\t\t\t\tjustify=\"flex-start\"\n\t\t\t\tgap=\"xs\"\n\t\t\t\twrap=\"wrap\"\n\t\t\t>\n\t\t\t\t{ activeStates.map( ( activeState ) => (\n\t\t\t\t\t<WCBadge key={ activeState.key } intent=\"info\">\n\t\t\t\t\t\t{ activeState.label }\n\t\t\t\t\t</WCBadge>\n\t\t\t\t) ) }\n\t\t\t</Stack>\n\t\t</Stack>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["componentsPrivateApis"]
|
|
7
7
|
}
|
|
@@ -22,7 +22,7 @@ var use_gradient_exports = {};
|
|
|
22
22
|
__export(use_gradient_exports, {
|
|
23
23
|
__experimentalGetGradientClass: () => __experimentalGetGradientClass,
|
|
24
24
|
__experimentalGetGradientObjectByGradientValue: () => __experimentalGetGradientObjectByGradientValue,
|
|
25
|
-
__experimentalUseGradient: () =>
|
|
25
|
+
__experimentalUseGradient: () => useGradient,
|
|
26
26
|
getGradientSlugByValue: () => getGradientSlugByValue,
|
|
27
27
|
getGradientValueBySlug: () => getGradientValueBySlug
|
|
28
28
|
});
|
|
@@ -53,7 +53,7 @@ function getGradientSlugByValue(gradients, value) {
|
|
|
53
53
|
);
|
|
54
54
|
return gradient && gradient.slug;
|
|
55
55
|
}
|
|
56
|
-
function
|
|
56
|
+
function useGradient({
|
|
57
57
|
gradientAttribute = "gradient",
|
|
58
58
|
customGradientAttribute = "customGradient"
|
|
59
59
|
} = {}) {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/gradients/use-gradient.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { useBlockEditContext } from '../block-edit';\nimport { useSettings } from '../use-settings';\nimport { store as blockEditorStore } from '../../store';\n\nexport function __experimentalGetGradientClass( gradientSlug ) {\n\tif ( ! gradientSlug ) {\n\t\treturn undefined;\n\t}\n\treturn `has-${ gradientSlug }-gradient-background`;\n}\n\n/**\n * Retrieves the gradient value per slug.\n *\n * @param {Array} gradients Gradient Palette\n * @param {string} slug Gradient slug\n *\n * @return {string} Gradient value.\n */\nexport function getGradientValueBySlug( gradients, slug ) {\n\tconst gradient = gradients?.find( ( g ) => g.slug === slug );\n\treturn gradient && gradient.gradient;\n}\n\nexport function __experimentalGetGradientObjectByGradientValue(\n\tgradients,\n\tvalue\n) {\n\tconst gradient = gradients?.find( ( g ) => g.gradient === value );\n\treturn gradient;\n}\n\n/**\n * Retrieves the gradient slug per slug.\n *\n * @param {Array} gradients Gradient Palette\n * @param {string} value Gradient value\n * @return {string} Gradient slug.\n */\nexport function getGradientSlugByValue( gradients, value ) {\n\tconst gradient = __experimentalGetGradientObjectByGradientValue(\n\t\tgradients,\n\t\tvalue\n\t);\n\treturn gradient && gradient.slug;\n}\n\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAqC;AACrC,kBAAuC;AAKvC,wBAAoC;AACpC,0BAA4B;AAC5B,mBAA0C;AAEnC,SAAS,+BAAgC,cAAe;AAC9D,MAAK,CAAE,cAAe;AACrB,WAAO;AAAA,EACR;AACA,SAAO,OAAQ,YAAa;AAC7B;AAUO,SAAS,uBAAwB,WAAW,MAAO;AACzD,QAAM,WAAW,WAAW,KAAM,CAAE,MAAO,EAAE,SAAS,IAAK;AAC3D,SAAO,YAAY,SAAS;AAC7B;AAEO,SAAS,+CACf,WACA,OACC;AACD,QAAM,WAAW,WAAW,KAAM,CAAE,MAAO,EAAE,aAAa,KAAM;AAChE,SAAO;AACR;AASO,SAAS,uBAAwB,WAAW,OAAQ;AAC1D,QAAM,WAAW;AAAA,IAChB;AAAA,IACA;AAAA,EACD;AACA,SAAO,YAAY,SAAS;AAC7B;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { useBlockEditContext } from '../block-edit';\nimport { useSettings } from '../use-settings';\nimport { store as blockEditorStore } from '../../store';\n\nexport function __experimentalGetGradientClass( gradientSlug ) {\n\tif ( ! gradientSlug ) {\n\t\treturn undefined;\n\t}\n\treturn `has-${ gradientSlug }-gradient-background`;\n}\n\n/**\n * Retrieves the gradient value per slug.\n *\n * @param {Array} gradients Gradient Palette\n * @param {string} slug Gradient slug\n *\n * @return {string} Gradient value.\n */\nexport function getGradientValueBySlug( gradients, slug ) {\n\tconst gradient = gradients?.find( ( g ) => g.slug === slug );\n\treturn gradient && gradient.gradient;\n}\n\nexport function __experimentalGetGradientObjectByGradientValue(\n\tgradients,\n\tvalue\n) {\n\tconst gradient = gradients?.find( ( g ) => g.gradient === value );\n\treturn gradient;\n}\n\n/**\n * Retrieves the gradient slug per slug.\n *\n * @param {Array} gradients Gradient Palette\n * @param {string} value Gradient value\n * @return {string} Gradient slug.\n */\nexport function getGradientSlugByValue( gradients, value ) {\n\tconst gradient = __experimentalGetGradientObjectByGradientValue(\n\t\tgradients,\n\t\tvalue\n\t);\n\treturn gradient && gradient.slug;\n}\n\nfunction useGradient( {\n\tgradientAttribute = 'gradient',\n\tcustomGradientAttribute = 'customGradient',\n} = {} ) {\n\tconst { clientId } = useBlockEditContext();\n\n\tconst [\n\t\tuserGradientPalette,\n\t\tthemeGradientPalette,\n\t\tdefaultGradientPalette,\n\t] = useSettings(\n\t\t'color.gradients.custom',\n\t\t'color.gradients.theme',\n\t\t'color.gradients.default'\n\t);\n\tconst allGradients = useMemo(\n\t\t() => [\n\t\t\t...( userGradientPalette || [] ),\n\t\t\t...( themeGradientPalette || [] ),\n\t\t\t...( defaultGradientPalette || [] ),\n\t\t],\n\t\t[ userGradientPalette, themeGradientPalette, defaultGradientPalette ]\n\t);\n\tconst { gradient, customGradient } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockAttributes } = select( blockEditorStore );\n\t\t\tconst attributes = getBlockAttributes( clientId ) || {};\n\t\t\treturn {\n\t\t\t\tcustomGradient: attributes[ customGradientAttribute ],\n\t\t\t\tgradient: attributes[ gradientAttribute ],\n\t\t\t};\n\t\t},\n\t\t[ clientId, gradientAttribute, customGradientAttribute ]\n\t);\n\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\tconst setGradient = useCallback(\n\t\t( newGradientValue ) => {\n\t\t\tconst slug = getGradientSlugByValue(\n\t\t\t\tallGradients,\n\t\t\t\tnewGradientValue\n\t\t\t);\n\t\t\tif ( slug ) {\n\t\t\t\tupdateBlockAttributes( clientId, {\n\t\t\t\t\t[ gradientAttribute ]: slug,\n\t\t\t\t\t[ customGradientAttribute ]: undefined,\n\t\t\t\t} );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tupdateBlockAttributes( clientId, {\n\t\t\t\t[ gradientAttribute ]: undefined,\n\t\t\t\t[ customGradientAttribute ]: newGradientValue,\n\t\t\t} );\n\t\t},\n\t\t[ allGradients, clientId, updateBlockAttributes ]\n\t);\n\n\tconst gradientClass = __experimentalGetGradientClass( gradient );\n\tlet gradientValue;\n\tif ( gradient ) {\n\t\tgradientValue = getGradientValueBySlug( allGradients, gradient );\n\t} else {\n\t\tgradientValue = customGradient;\n\t}\n\treturn { gradientClass, gradientValue, setGradient };\n}\n\nexport { useGradient as __experimentalUseGradient };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAqC;AACrC,kBAAuC;AAKvC,wBAAoC;AACpC,0BAA4B;AAC5B,mBAA0C;AAEnC,SAAS,+BAAgC,cAAe;AAC9D,MAAK,CAAE,cAAe;AACrB,WAAO;AAAA,EACR;AACA,SAAO,OAAQ,YAAa;AAC7B;AAUO,SAAS,uBAAwB,WAAW,MAAO;AACzD,QAAM,WAAW,WAAW,KAAM,CAAE,MAAO,EAAE,SAAS,IAAK;AAC3D,SAAO,YAAY,SAAS;AAC7B;AAEO,SAAS,+CACf,WACA,OACC;AACD,QAAM,WAAW,WAAW,KAAM,CAAE,MAAO,EAAE,aAAa,KAAM;AAChE,SAAO;AACR;AASO,SAAS,uBAAwB,WAAW,OAAQ;AAC1D,QAAM,WAAW;AAAA,IAChB;AAAA,IACA;AAAA,EACD;AACA,SAAO,YAAY,SAAS;AAC7B;AAEA,SAAS,YAAa;AAAA,EACrB,oBAAoB;AAAA,EACpB,0BAA0B;AAC3B,IAAI,CAAC,GAAI;AACR,QAAM,EAAE,SAAS,QAAI,uCAAoB;AAEzC,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACD,QAAI;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,EACD;AACA,QAAM,mBAAe;AAAA,IACpB,MAAM;AAAA,MACL,GAAK,uBAAuB,CAAC;AAAA,MAC7B,GAAK,wBAAwB,CAAC;AAAA,MAC9B,GAAK,0BAA0B,CAAC;AAAA,IACjC;AAAA,IACA,CAAE,qBAAqB,sBAAsB,sBAAuB;AAAA,EACrE;AACA,QAAM,EAAE,UAAU,eAAe,QAAI;AAAA,IACpC,CAAE,WAAY;AACb,YAAM,EAAE,mBAAmB,IAAI,OAAQ,aAAAA,KAAiB;AACxD,YAAM,aAAa,mBAAoB,QAAS,KAAK,CAAC;AACtD,aAAO;AAAA,QACN,gBAAgB,WAAY,uBAAwB;AAAA,QACpD,UAAU,WAAY,iBAAkB;AAAA,MACzC;AAAA,IACD;AAAA,IACA,CAAE,UAAU,mBAAmB,uBAAwB;AAAA,EACxD;AAEA,QAAM,EAAE,sBAAsB,QAAI,yBAAa,aAAAA,KAAiB;AAChE,QAAM,kBAAc;AAAA,IACnB,CAAE,qBAAsB;AACvB,YAAM,OAAO;AAAA,QACZ;AAAA,QACA;AAAA,MACD;AACA,UAAK,MAAO;AACX,8BAAuB,UAAU;AAAA,UAChC,CAAE,iBAAkB,GAAG;AAAA,UACvB,CAAE,uBAAwB,GAAG;AAAA,QAC9B,CAAE;AACF;AAAA,MACD;AACA,4BAAuB,UAAU;AAAA,QAChC,CAAE,iBAAkB,GAAG;AAAA,QACvB,CAAE,uBAAwB,GAAG;AAAA,MAC9B,CAAE;AAAA,IACH;AAAA,IACA,CAAE,cAAc,UAAU,qBAAsB;AAAA,EACjD;AAEA,QAAM,gBAAgB,+BAAgC,QAAS;AAC/D,MAAI;AACJ,MAAK,UAAW;AACf,oBAAgB,uBAAwB,cAAc,QAAS;AAAA,EAChE,OAAO;AACN,oBAAgB;AAAA,EACjB;AACA,SAAO,EAAE,eAAe,eAAe,YAAY;AACpD;",
|
|
6
6
|
"names": ["blockEditorStore"]
|
|
7
7
|
}
|
|
@@ -36,6 +36,7 @@ module.exports = __toCommonJS(grid_item_movers_exports);
|
|
|
36
36
|
var import_clsx = __toESM(require("clsx"));
|
|
37
37
|
var import_i18n = require("@wordpress/i18n");
|
|
38
38
|
var import_components = require("@wordpress/components");
|
|
39
|
+
var import_ui = require("@wordpress/ui");
|
|
39
40
|
var import_icons = require("@wordpress/icons");
|
|
40
41
|
var import_data = require("@wordpress/data");
|
|
41
42
|
var import_compose = require("@wordpress/compose");
|
|
@@ -192,7 +193,7 @@ function GridItemMover({
|
|
|
192
193
|
accessibleWhenDisabled: true
|
|
193
194
|
}
|
|
194
195
|
),
|
|
195
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
196
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.VisuallyHidden, { id: descriptionId, children: description })
|
|
196
197
|
] });
|
|
197
198
|
}
|
|
198
199
|
// Annotate the CommonJS export names for ESM import in node:
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/grid/grid-item-movers.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,kBAA0B;AAC1B,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport { ToolbarButton, ToolbarGroup } from '@wordpress/components';\nimport { VisuallyHidden } from '@wordpress/ui';\nimport {\n\tchevronLeft,\n\tchevronUp,\n\tchevronDown,\n\tchevronRight,\n} from '@wordpress/icons';\nimport { useDispatch } from '@wordpress/data';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BlockControls from '../block-controls';\nimport { useGetNumberOfBlocksBeforeCell } from './use-get-number-of-blocks-before-cell';\nimport { store as blockEditorStore } from '../../store';\n\nexport function GridItemMovers( {\n\tlayout,\n\tparentLayout,\n\tonChange,\n\tgridClientId,\n\tblockClientId,\n} ) {\n\tconst { moveBlocksToPosition, __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\n\tconst columnStart = layout?.columnStart ?? 1;\n\tconst rowStart = layout?.rowStart ?? 1;\n\tconst columnSpan = layout?.columnSpan ?? 1;\n\tconst rowSpan = layout?.rowSpan ?? 1;\n\tconst columnEnd = columnStart + columnSpan - 1;\n\tconst rowEnd = rowStart + rowSpan - 1;\n\tconst columnCount = parentLayout?.columnCount;\n\tconst rowCount = parentLayout?.rowCount;\n\n\tconst getNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell(\n\t\tgridClientId,\n\t\tcolumnCount\n\t);\n\n\treturn (\n\t\t<BlockControls group=\"parent\">\n\t\t\t<ToolbarGroup className=\"block-editor-grid-item-mover__move-button-container\">\n\t\t\t\t<div className=\"block-editor-grid-item-mover__move-horizontal-button-container is-left\">\n\t\t\t\t\t<GridItemMover\n\t\t\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\t\t\tlabel={ __( 'Move left' ) }\n\t\t\t\t\t\tdescription={ __( 'Move left' ) }\n\t\t\t\t\t\tisDisabled={ columnStart <= 1 }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\tcolumnStart: columnStart - 1,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\t\t\t\t[ blockClientId ],\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgetNumberOfBlocksBeforeCell(\n\t\t\t\t\t\t\t\t\tcolumnStart - 1,\n\t\t\t\t\t\t\t\t\trowStart\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"block-editor-grid-item-mover__move-vertical-button-container\">\n\t\t\t\t\t<GridItemMover\n\t\t\t\t\t\tclassName=\"is-up-button\"\n\t\t\t\t\t\ticon={ chevronUp }\n\t\t\t\t\t\tlabel={ __( 'Move up' ) }\n\t\t\t\t\t\tdescription={ __( 'Move up' ) }\n\t\t\t\t\t\tisDisabled={ rowStart <= 1 }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\trowStart: rowStart - 1,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\t\t\t\t[ blockClientId ],\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgetNumberOfBlocksBeforeCell(\n\t\t\t\t\t\t\t\t\tcolumnStart,\n\t\t\t\t\t\t\t\t\trowStart - 1\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t<GridItemMover\n\t\t\t\t\t\tclassName=\"is-down-button\"\n\t\t\t\t\t\ticon={ chevronDown }\n\t\t\t\t\t\tlabel={ __( 'Move down' ) }\n\t\t\t\t\t\tdescription={ __( 'Move down' ) }\n\t\t\t\t\t\tisDisabled={ rowCount && rowEnd >= rowCount }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\trowStart: rowStart + 1,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\t\t\t\t[ blockClientId ],\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgetNumberOfBlocksBeforeCell(\n\t\t\t\t\t\t\t\t\tcolumnStart,\n\t\t\t\t\t\t\t\t\trowStart + 1\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"block-editor-grid-item-mover__move-horizontal-button-container is-right\">\n\t\t\t\t\t<GridItemMover\n\t\t\t\t\t\ticon={ isRTL() ? chevronLeft : chevronRight }\n\t\t\t\t\t\tlabel={ __( 'Move right' ) }\n\t\t\t\t\t\tdescription={ __( 'Move right' ) }\n\t\t\t\t\t\tisDisabled={ columnCount && columnEnd >= columnCount }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\tcolumnStart: columnStart + 1,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\t\t\t\t[ blockClientId ],\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgetNumberOfBlocksBeforeCell(\n\t\t\t\t\t\t\t\t\tcolumnStart + 1,\n\t\t\t\t\t\t\t\t\trowStart\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</ToolbarGroup>\n\t\t</BlockControls>\n\t);\n}\n\nfunction GridItemMover( {\n\tclassName,\n\ticon,\n\tlabel,\n\tisDisabled,\n\tonClick,\n\tdescription,\n} ) {\n\tconst instanceId = useInstanceId( GridItemMover );\n\tconst descriptionId = `block-editor-grid-item-mover-button__description-${ instanceId }`;\n\treturn (\n\t\t<>\n\t\t\t<ToolbarButton\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'block-editor-grid-item-mover-button',\n\t\t\t\t\tclassName\n\t\t\t\t) }\n\t\t\t\ticon={ icon }\n\t\t\t\tlabel={ label }\n\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\tonClick={ isDisabled ? null : onClick }\n\t\t\t\tdisabled={ isDisabled }\n\t\t\t\taccessibleWhenDisabled\n\t\t\t/>\n\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t{ description }\n\t\t\t</VisuallyHidden>\n\t\t</>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["blockEditorStore", "BlockControls", "clsx"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/iframe/use-scale-canvas.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useCallback } from '@wordpress/element';\nimport { useReducedMotion, useResizeObserver } from '@wordpress/compose';\n\n/**\n * @typedef {Object} TransitionState\n * @property {number} scaleValue Scale of the canvas.\n * @property {number} frameSize Size of the frame/offset around the canvas.\n * @property {number} containerHeight containerHeight of the iframe.\n * @property {number} scrollTop ScrollTop of the iframe.\n * @property {number} scrollHeight ScrollHeight of the iframe.\n */\n\n/**\n * Calculate the scale of the canvas.\n *\n * @param {Object} options Object of options\n * @param {number} options.frameSize Size of the frame/offset around the canvas\n * @param {number} options.containerWidth Actual width of the canvas container\n * @param {number} options.maxContainerWidth Maximum width of the container to use for the scale calculation. This locks the canvas to a maximum width when zooming out.\n * @param {number} options.scaleContainerWidth Width the of the container wrapping the canvas container\n * @return {number} Scale value between 0 and/or equal to 1\n */\nfunction calculateScale( {\n\tframeSize,\n\tcontainerWidth,\n\tmaxContainerWidth,\n\tscaleContainerWidth,\n} ) {\n\treturn (\n\t\t( Math.min( containerWidth, maxContainerWidth ) - frameSize * 2 ) /\n\t\tscaleContainerWidth\n\t);\n}\n\n/**\n * Compute the next scrollHeight based on the transition states.\n *\n * @param {TransitionState} transitionFrom Starting point of the transition\n * @param {TransitionState} transitionTo Ending state of the transition\n * @return {number} Next scrollHeight based on scale and frame value changes.\n */\nfunction computeScrollHeightNext( transitionFrom, transitionTo ) {\n\tconst { scaleValue: prevScale, scrollHeight: prevScrollHeight } =\n\t\ttransitionFrom;\n\tconst { frameSize, scaleValue } = transitionTo;\n\n\treturn prevScrollHeight * ( scaleValue / prevScale ) + frameSize * 2;\n}\n\n/**\n * Compute the next scrollTop position after scaling the iframe content.\n *\n * @param {TransitionState} transitionFrom Starting point of the transition\n * @param {TransitionState} transitionTo Ending state of the transition\n * @return {number} Next scrollTop position after scaling the iframe content.\n */\nfunction computeScrollTopNext( transitionFrom, transitionTo ) {\n\tconst {\n\t\tcontainerHeight: prevContainerHeight,\n\t\tframeSize: prevFrameSize,\n\t\tscaleValue: prevScale,\n\t\tscrollTop: prevScrollTop,\n\t} = transitionFrom;\n\tconst { containerHeight, frameSize, scaleValue, scrollHeight } =\n\t\ttransitionTo;\n\t// Step 0: Start with the current scrollTop.\n\tlet scrollTopNext = prevScrollTop;\n\t// Step 1: Undo the effects of the previous scale and frame around the\n\t// midpoint of the visible area.\n\tscrollTopNext =\n\t\t( scrollTopNext + prevContainerHeight / 2 - prevFrameSize ) /\n\t\t\tprevScale -\n\t\tprevContainerHeight / 2;\n\n\t// Step 2: Apply the new scale and frame around the midpoint of the\n\t// visible area.\n\tscrollTopNext =\n\t\t( scrollTopNext + containerHeight / 2 ) * scaleValue +\n\t\tframeSize -\n\t\tcontainerHeight / 2;\n\n\t// Step 3: Handle an edge case so that you scroll to the top of the\n\t// iframe if the top of the iframe content is visible in the container.\n\t// The same edge case for the bottom is skipped because changing content\n\t// makes calculating it impossible.\n\tscrollTopNext = prevScrollTop <= prevFrameSize ? 0 : scrollTopNext;\n\n\t// This is the scrollTop value if you are scrolled to the bottom of the\n\t// iframe. We can't just let the browser handle it because we need to\n\t// animate the scaling.\n\tconst maxScrollTop = scrollHeight - containerHeight;\n\n\t// Step 4: Clamp the scrollTopNext between the minimum and maximum\n\t// possible scrollTop positions. Round the value to avoid subpixel\n\t// truncation by the browser which sometimes causes a 1px error.\n\treturn Math.round(\n\t\tMath.min( Math.max( 0, scrollTopNext ), Math.max( 0, maxScrollTop ) )\n\t);\n}\n\n/**\n * Generate the keyframes to use for the zoom out animation.\n *\n * @param {TransitionState} transitionFrom Starting transition state.\n * @param {TransitionState} transitionTo Ending transition state.\n * @return {Object[]} An array of keyframes to use for the animation.\n */\nfunction getAnimationKeyframes( transitionFrom, transitionTo ) {\n\tconst {\n\t\tscaleValue: prevScale,\n\t\tframeSize: prevFrameSize,\n\t\tscrollTop,\n\t} = transitionFrom;\n\tconst { scaleValue, frameSize, scrollTop: scrollTopNext } = transitionTo;\n\n\treturn [\n\t\t{\n\t\t\ttranslate: `0 0`,\n\t\t\tscale: prevScale,\n\t\t\tpaddingTop: `${ prevFrameSize / prevScale }px`,\n\t\t\tpaddingBottom: `${ prevFrameSize / prevScale }px`,\n\t\t},\n\t\t{\n\t\t\ttranslate: `0 ${ scrollTop - scrollTopNext }px`,\n\t\t\tscale: scaleValue,\n\t\t\tpaddingTop: `${ frameSize / scaleValue }px`,\n\t\t\tpaddingBottom: `${ frameSize / scaleValue }px`,\n\t\t},\n\t];\n}\n\n/**\n * @typedef {Object} ScaleCanvasResult\n * @property {boolean} isZoomedOut A boolean indicating if the canvas is zoomed out.\n * @property {number} scaleContainerWidth The width of the container used to calculate the scale.\n * @property {Object} contentResizeListener A resize observer for the content.\n * @property {Object} containerResizeListener A resize observer for the container.\n */\n\n/**\n * Handles scaling the canvas for the zoom out mode and animating between\n * the states.\n *\n * @param {Object} options Object of options.\n * @param {number} options.frameSize Size of the frame around the content.\n * @param {Document} options.iframeDocument Document of the iframe.\n * @param {number} options.maxContainerWidth Max width of the canvas to use as the starting scale point. Defaults to 750.\n * @param {number|string} options.scale Scale of the canvas. Can be an decimal between 0 and 1, 1, or 'auto-scaled'.\n * @return {ScaleCanvasResult} Properties of the result.\n */\nexport function useScaleCanvas( {\n\tframeSize,\n\tiframeDocument,\n\tmaxContainerWidth = 750,\n\tscale,\n} ) {\n\tconst [ contentResizeListener, { height: contentHeight } ] =\n\t\tuseResizeObserver();\n\tconst [\n\t\tcontainerResizeListener,\n\t\t{ width: containerWidth, height: containerHeight },\n\t] = useResizeObserver();\n\n\tconst initialContainerWidthRef = useRef( 0 );\n\tconst isZoomedOut = scale !== 1;\n\tconst prefersReducedMotion = useReducedMotion();\n\tconst isAutoScaled = scale === 'auto-scaled';\n\t// Track if the animation should start when the useEffect runs.\n\tconst startAnimationRef = useRef( false );\n\t// Track the animation so we know if we have an animation running,\n\t// and can cancel it, reverse it, call a finish event, etc.\n\tconst animationRef = useRef( null );\n\n\tuseEffect( () => {\n\t\tif ( ! isZoomedOut ) {\n\t\t\tinitialContainerWidthRef.current = containerWidth;\n\t\t}\n\t}, [ containerWidth, isZoomedOut ] );\n\n\tconst scaleContainerWidth = Math.max(\n\t\tinitialContainerWidthRef.current,\n\t\tcontainerWidth\n\t);\n\n\tconst scaleValue = isAutoScaled\n\t\t? calculateScale( {\n\t\t\t\tframeSize,\n\t\t\t\tcontainerWidth,\n\t\t\t\tmaxContainerWidth,\n\t\t\t\tscaleContainerWidth,\n\t\t } )\n\t\t: scale;\n\n\t/**\n\t * The starting transition state for the zoom out animation.\n\t * @type {React.RefObject<TransitionState>}\n\t */\n\tconst transitionFromRef = useRef( {\n\t\tscaleValue,\n\t\tframeSize,\n\t\tcontainerHeight: 0,\n\t\tscrollTop: 0,\n\t\tscrollHeight: 0,\n\t} );\n\n\t/**\n\t * The ending transition state for the zoom out animation.\n\t * @type {React.RefObject<TransitionState>}\n\t */\n\tconst transitionToRef = useRef( {\n\t\tscaleValue,\n\t\tframeSize,\n\t\tcontainerHeight: 0,\n\t\tscrollTop: 0,\n\t\tscrollHeight: 0,\n\t} );\n\n\t/**\n\t * Start the zoom out animation. This sets the necessary CSS variables\n\t * for animating the canvas and returns the Animation object.\n\t *\n\t * @return {Animation} The animation object for the zoom out animation.\n\t */\n\tconst startZoomOutAnimation = useCallback( () => {\n\t\tconst { scrollTop } = transitionFromRef.current;\n\t\tconst { scrollTop: scrollTopNext } = transitionToRef.current;\n\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top',\n\t\t\t`${ scrollTop }px`\n\t\t);\n\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top-next',\n\t\t\t`${ scrollTopNext }px`\n\t\t);\n\n\t\t// If the container has a scrolllbar, force a scrollbar to prevent the content from shifting while animating.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-overflow-behavior',\n\t\t\ttransitionFromRef.current.scrollHeight ===\n\t\t\t\ttransitionFromRef.current.containerHeight\n\t\t\t\t? 'auto'\n\t\t\t\t: 'scroll'\n\t\t);\n\n\t\tiframeDocument.documentElement.classList.add( 'zoom-out-animation' );\n\n\t\treturn iframeDocument.documentElement.animate(\n\t\t\tgetAnimationKeyframes(\n\t\t\t\ttransitionFromRef.current,\n\t\t\t\ttransitionToRef.current\n\t\t\t),\n\t\t\t{\n\t\t\t\teasing: 'cubic-bezier(0.46, 0.03, 0.52, 0.96)',\n\t\t\t\tduration: 400,\n\t\t\t}\n\t\t);\n\t}, [ iframeDocument ] );\n\n\t/**\n\t * Callback when the zoom out animation is finished.\n\t * - Cleans up animations refs.\n\t * - Adds final CSS vars for scale and frame size to preserve the state.\n\t * - Removes the 'zoom-out-animation' class (which has the fixed positioning).\n\t * - Sets the final scroll position after the canvas is no longer in fixed position.\n\t * - Removes CSS vars related to the animation.\n\t * - Sets the transitionFrom to the transitionTo state to be ready for the next animation.\n\t */\n\tconst finishZoomOutAnimation = useCallback( () => {\n\t\tstartAnimationRef.current = false;\n\t\tanimationRef.current = null;\n\n\t\t// Add our final scale and frame size now that the animation is done.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\ttransitionToRef.current.scaleValue\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\t`${ transitionToRef.current.frameSize }px`\n\t\t);\n\n\t\tiframeDocument.documentElement.classList.remove( 'zoom-out-animation' );\n\n\t\t// Set the final scroll position that was just animated to.\n\t\t// Disable reason: Eslint isn't smart enough to know that this is a\n\t\t// DOM element. https://github.com/facebook/react/issues/31483\n\t\t// eslint-disable-next-line react-compiler/react-compiler\n\t\tiframeDocument.documentElement.scrollTop =\n\t\t\ttransitionToRef.current.scrollTop;\n\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top'\n\t\t);\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top-next'\n\t\t);\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-overflow-behavior'\n\t\t);\n\n\t\t// Update previous values.\n\t\ttransitionFromRef.current = transitionToRef.current;\n\t}, [ iframeDocument ] );\n\n\tconst previousIsZoomedOut = useRef( false );\n\n\t/**\n\t * Runs when zoom out mode is toggled, and sets the startAnimation flag\n\t * so the animation will start when the next useEffect runs. We _only_\n\t * want to animate when the zoom out mode is toggled, not when the scale\n\t * changes due to the container resizing.\n\t */\n\tuseEffect( () => {\n\t\tconst trigger =\n\t\t\tiframeDocument && previousIsZoomedOut.current !== isZoomedOut;\n\n\t\tpreviousIsZoomedOut.current = isZoomedOut;\n\n\t\tif ( ! trigger ) {\n\t\t\treturn;\n\t\t}\n\n\t\tstartAnimationRef.current = true;\n\n\t\tif ( ! isZoomedOut ) {\n\t\t\treturn;\n\t\t}\n\n\t\tiframeDocument.documentElement.classList.add( 'is-zoomed-out' );\n\t\treturn () => {\n\t\t\tiframeDocument.documentElement.classList.remove( 'is-zoomed-out' );\n\t\t};\n\t}, [ iframeDocument, isZoomedOut ] );\n\n\t/**\n\t * This handles:\n\t * 1. Setting the correct scale and vars of the canvas when zoomed out\n\t * 2. If zoom out mode has been toggled, runs the animation of zooming in/out\n\t */\n\tuseEffect( () => {\n\t\tif ( ! iframeDocument ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We need to update the appropriate scale to exit from. If sidebars have been opened since setting the\n\t\t// original scale, we will snap to a much smaller scale due to the scale container immediately changing sizes when exiting.\n\t\tif ( isAutoScaled && transitionFromRef.current.scaleValue !== 1 ) {\n\t\t\t// We use containerWidth as the divisor, as scaleContainerWidth will always match the containerWidth when\n\t\t\t// exiting.\n\t\t\ttransitionFromRef.current.scaleValue = calculateScale( {\n\t\t\t\tframeSize: transitionFromRef.current.frameSize,\n\t\t\t\tcontainerWidth,\n\t\t\t\tmaxContainerWidth,\n\t\t\t\tscaleContainerWidth: containerWidth,\n\t\t\t} );\n\t\t}\n\n\t\tif ( scaleValue < 1 ) {\n\t\t\t// If we are not going to animate the transition, set the scale and frame size directly.\n\t\t\t// If we are animating, these values will be set when the animation is finished.\n\t\t\t// Example: Opening sidebars that reduce the scale of the canvas, but we don't want to\n\t\t\t// animate the transition.\n\t\t\tif ( ! startAnimationRef.current ) {\n\t\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\t\t\tscaleValue\n\t\t\t\t);\n\t\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\t\t\t`${ frameSize }px`\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-content-height',\n\t\t\t\t`${ contentHeight }px`\n\t\t\t);\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-inner-height',\n\t\t\t\t`${ containerHeight }px`\n\t\t\t);\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-container-width',\n\t\t\t\t`${ containerWidth }px`\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width',\n\t\t\t\t`${ scaleContainerWidth }px`\n\t\t\t);\n\t\t}\n\n\t\t/**\n\t\t * Handle the zoom out animation:\n\t\t *\n\t\t * - Get the current scrollTop position.\n\t\t * - Calculate where the same scroll position is after scaling.\n\t\t * - Apply fixed positioning to the canvas with a transform offset\n\t\t * to keep the canvas centered.\n\t\t * - Animate the scale and padding to the new scale and frame size.\n\t\t * - After the animation is complete, remove the fixed positioning\n\t\t * and set the scroll position that keeps everything centered.\n\t\t */\n\t\tif ( startAnimationRef.current ) {\n\t\t\t// Don't allow a new transition to start again unless it was started by the zoom out mode changing.\n\t\t\tstartAnimationRef.current = false;\n\n\t\t\t/**\n\t\t\t * If we already have an animation running, reverse it.\n\t\t\t */\n\t\t\tif ( animationRef.current ) {\n\t\t\t\tanimationRef.current.reverse();\n\t\t\t\t// Swap the transition to/from refs so that we set the correct values when\n\t\t\t\t// finishZoomOutAnimation runs.\n\t\t\t\tconst tempTransitionFrom = transitionFromRef.current;\n\t\t\t\tconst tempTransitionTo = transitionToRef.current;\n\t\t\t\ttransitionFromRef.current = tempTransitionTo;\n\t\t\t\ttransitionToRef.current = tempTransitionFrom;\n\t\t\t} else {\n\t\t\t\t/**\n\t\t\t\t * Start a new zoom animation.\n\t\t\t\t */\n\n\t\t\t\t// We can't trust the set value from contentHeight, as it was measured\n\t\t\t\t// before the zoom out mode was changed. After zoom out mode is changed,\n\t\t\t\t// appenders may appear or disappear, so we need to get the height from\n\t\t\t\t// the iframe at this point when we're about to animate the zoom out.\n\t\t\t\t// The iframe scrollTop, scrollHeight, and clientHeight will all be\n\t\t\t\t// the most accurate.\n\t\t\t\ttransitionFromRef.current.scrollTop =\n\t\t\t\t\tiframeDocument.documentElement.scrollTop;\n\t\t\t\ttransitionFromRef.current.scrollHeight =\n\t\t\t\t\tiframeDocument.documentElement.scrollHeight;\n\t\t\t\t// Use containerHeight, as it's the previous container height before the zoom out animation starts.\n\t\t\t\ttransitionFromRef.current.containerHeight = containerHeight;\n\n\t\t\t\ttransitionToRef.current = {\n\t\t\t\t\tscaleValue,\n\t\t\t\t\tframeSize,\n\t\t\t\t\tcontainerHeight:\n\t\t\t\t\t\tiframeDocument.documentElement.clientHeight, // use clientHeight to get the actual height of the new container after zoom state changes have rendered, as it will be the most up-to-date.\n\t\t\t\t};\n\n\t\t\t\ttransitionToRef.current.scrollHeight = computeScrollHeightNext(\n\t\t\t\t\ttransitionFromRef.current,\n\t\t\t\t\ttransitionToRef.current\n\t\t\t\t);\n\t\t\t\ttransitionToRef.current.scrollTop = computeScrollTopNext(\n\t\t\t\t\ttransitionFromRef.current,\n\t\t\t\t\ttransitionToRef.current\n\t\t\t\t);\n\n\t\t\t\tanimationRef.current = startZoomOutAnimation();\n\n\t\t\t\t// If the user prefers reduced motion, finish the animation immediately and set the final state.\n\t\t\t\tif ( prefersReducedMotion ) {\n\t\t\t\t\tfinishZoomOutAnimation();\n\t\t\t\t} else {\n\t\t\t\t\tanimationRef.current.onfinish = finishZoomOutAnimation;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}, [\n\t\tstartZoomOutAnimation,\n\t\tfinishZoomOutAnimation,\n\t\tprefersReducedMotion,\n\t\tisAutoScaled,\n\t\tscaleValue,\n\t\tframeSize,\n\t\tiframeDocument,\n\t\tcontentHeight,\n\t\tcontainerWidth,\n\t\tcontainerHeight,\n\t\tmaxContainerWidth,\n\t\tscaleContainerWidth,\n\t] );\n\n\treturn {\n\t\tisZoomedOut,\n\t\tscaleContainerWidth,\n\t\tcontentResizeListener,\n\t\tcontainerResizeListener,\n\t};\n}\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useCallback } from '@wordpress/element';\nimport { useReducedMotion, useResizeObserver } from '@wordpress/compose';\n\n/**\n * @typedef {Object} TransitionState\n * @property {number} scaleValue Scale of the canvas.\n * @property {number} frameSize Size of the frame/offset around the canvas.\n * @property {number} containerHeight containerHeight of the iframe.\n * @property {number} scrollTop ScrollTop of the iframe.\n * @property {number} scrollHeight ScrollHeight of the iframe.\n */\n\n/**\n * Calculate the scale of the canvas.\n *\n * @param {Object} options Object of options\n * @param {number} options.frameSize Size of the frame/offset around the canvas\n * @param {number} options.containerWidth Actual width of the canvas container\n * @param {number} options.maxContainerWidth Maximum width of the container to use for the scale calculation. This locks the canvas to a maximum width when zooming out.\n * @param {number} options.scaleContainerWidth Width the of the container wrapping the canvas container\n * @return {number} Scale value between 0 and/or equal to 1\n */\nfunction calculateScale( {\n\tframeSize,\n\tcontainerWidth,\n\tmaxContainerWidth,\n\tscaleContainerWidth,\n} ) {\n\treturn (\n\t\t( Math.min( containerWidth, maxContainerWidth ) - frameSize * 2 ) /\n\t\tscaleContainerWidth\n\t);\n}\n\n/**\n * Compute the next scrollHeight based on the transition states.\n *\n * @param {TransitionState} transitionFrom Starting point of the transition\n * @param {TransitionState} transitionTo Ending state of the transition\n * @return {number} Next scrollHeight based on scale and frame value changes.\n */\nfunction computeScrollHeightNext( transitionFrom, transitionTo ) {\n\tconst { scaleValue: prevScale, scrollHeight: prevScrollHeight } =\n\t\ttransitionFrom;\n\tconst { frameSize, scaleValue } = transitionTo;\n\n\treturn prevScrollHeight * ( scaleValue / prevScale ) + frameSize * 2;\n}\n\n/**\n * Compute the next scrollTop position after scaling the iframe content.\n *\n * @param {TransitionState} transitionFrom Starting point of the transition\n * @param {TransitionState} transitionTo Ending state of the transition\n * @return {number} Next scrollTop position after scaling the iframe content.\n */\nfunction computeScrollTopNext( transitionFrom, transitionTo ) {\n\tconst {\n\t\tcontainerHeight: prevContainerHeight,\n\t\tframeSize: prevFrameSize,\n\t\tscaleValue: prevScale,\n\t\tscrollTop: prevScrollTop,\n\t} = transitionFrom;\n\tconst { containerHeight, frameSize, scaleValue, scrollHeight } =\n\t\ttransitionTo;\n\t// Step 0: Start with the current scrollTop.\n\tlet scrollTopNext = prevScrollTop;\n\t// Step 1: Undo the effects of the previous scale and frame around the\n\t// midpoint of the visible area.\n\tscrollTopNext =\n\t\t( scrollTopNext + prevContainerHeight / 2 - prevFrameSize ) /\n\t\t\tprevScale -\n\t\tprevContainerHeight / 2;\n\n\t// Step 2: Apply the new scale and frame around the midpoint of the\n\t// visible area.\n\tscrollTopNext =\n\t\t( scrollTopNext + containerHeight / 2 ) * scaleValue +\n\t\tframeSize -\n\t\tcontainerHeight / 2;\n\n\t// Step 3: Handle an edge case so that you scroll to the top of the\n\t// iframe if the top of the iframe content is visible in the container.\n\t// The same edge case for the bottom is skipped because changing content\n\t// makes calculating it impossible.\n\tscrollTopNext = prevScrollTop <= prevFrameSize ? 0 : scrollTopNext;\n\n\t// This is the scrollTop value if you are scrolled to the bottom of the\n\t// iframe. We can't just let the browser handle it because we need to\n\t// animate the scaling.\n\tconst maxScrollTop = scrollHeight - containerHeight;\n\n\t// Step 4: Clamp the scrollTopNext between the minimum and maximum\n\t// possible scrollTop positions. Round the value to avoid subpixel\n\t// truncation by the browser which sometimes causes a 1px error.\n\treturn Math.round(\n\t\tMath.min( Math.max( 0, scrollTopNext ), Math.max( 0, maxScrollTop ) )\n\t);\n}\n\n/**\n * Generate the keyframes to use for the zoom out animation.\n *\n * @param {TransitionState} transitionFrom Starting transition state.\n * @param {TransitionState} transitionTo Ending transition state.\n * @return {Object[]} An array of keyframes to use for the animation.\n */\nfunction getAnimationKeyframes( transitionFrom, transitionTo ) {\n\tconst {\n\t\tscaleValue: prevScale,\n\t\tframeSize: prevFrameSize,\n\t\tscrollTop,\n\t} = transitionFrom;\n\tconst { scaleValue, frameSize, scrollTop: scrollTopNext } = transitionTo;\n\n\treturn [\n\t\t{\n\t\t\ttranslate: `0 0`,\n\t\t\tscale: prevScale,\n\t\t\tpaddingTop: `${ prevFrameSize / prevScale }px`,\n\t\t\tpaddingBottom: `${ prevFrameSize / prevScale }px`,\n\t\t},\n\t\t{\n\t\t\ttranslate: `0 ${ scrollTop - scrollTopNext }px`,\n\t\t\tscale: scaleValue,\n\t\t\tpaddingTop: `${ frameSize / scaleValue }px`,\n\t\t\tpaddingBottom: `${ frameSize / scaleValue }px`,\n\t\t},\n\t];\n}\n\n/**\n * @typedef {Object} ScaleCanvasResult\n * @property {boolean} isZoomedOut A boolean indicating if the canvas is zoomed out.\n * @property {number} scaleContainerWidth The width of the container used to calculate the scale.\n * @property {Object} contentResizeListener A resize observer for the content.\n * @property {Object} containerResizeListener A resize observer for the container.\n */\n\n/**\n * Handles scaling the canvas for the zoom out mode and animating between\n * the states.\n *\n * @param {Object} options Object of options.\n * @param {number} options.frameSize Size of the frame around the content.\n * @param {Document} options.iframeDocument Document of the iframe.\n * @param {number} options.maxContainerWidth Max width of the canvas to use as the starting scale point. Defaults to 750.\n * @param {number|string} options.scale Scale of the canvas. Can be an decimal between 0 and 1, 1, or 'auto-scaled'.\n * @return {ScaleCanvasResult} Properties of the result.\n */\nexport function useScaleCanvas( {\n\tframeSize,\n\tiframeDocument,\n\tmaxContainerWidth = 750,\n\tscale,\n} ) {\n\tconst [ contentResizeListener, { height: contentHeight } ] =\n\t\tuseResizeObserver();\n\tconst [\n\t\tcontainerResizeListener,\n\t\t{ width: containerWidth, height: containerHeight },\n\t] = useResizeObserver();\n\n\tconst initialContainerWidthRef = useRef( 0 );\n\tconst isZoomedOut = scale !== 1;\n\tconst prefersReducedMotion = useReducedMotion();\n\tconst isAutoScaled = scale === 'auto-scaled';\n\t// Track if the animation should start when the useEffect runs.\n\tconst startAnimationRef = useRef( false );\n\t// Track the animation so we know if we have an animation running,\n\t// and can cancel it, reverse it, call a finish event, etc.\n\tconst animationRef = useRef( null );\n\n\tuseEffect( () => {\n\t\tif ( ! isZoomedOut ) {\n\t\t\tinitialContainerWidthRef.current = containerWidth;\n\t\t}\n\t}, [ containerWidth, isZoomedOut ] );\n\n\tconst scaleContainerWidth = Math.max(\n\t\tinitialContainerWidthRef.current,\n\t\tcontainerWidth\n\t);\n\n\tconst scaleValue = isAutoScaled\n\t\t? calculateScale( {\n\t\t\t\tframeSize,\n\t\t\t\tcontainerWidth,\n\t\t\t\tmaxContainerWidth,\n\t\t\t\tscaleContainerWidth,\n\t\t } )\n\t\t: scale;\n\n\t/**\n\t * The starting transition state for the zoom out animation.\n\t * @type {React.RefObject<TransitionState>}\n\t */\n\tconst transitionFromRef = useRef( {\n\t\tscaleValue,\n\t\tframeSize,\n\t\tcontainerHeight: 0,\n\t\tscrollTop: 0,\n\t\tscrollHeight: 0,\n\t} );\n\n\t/**\n\t * The ending transition state for the zoom out animation.\n\t * @type {React.RefObject<TransitionState>}\n\t */\n\tconst transitionToRef = useRef( {\n\t\tscaleValue,\n\t\tframeSize,\n\t\tcontainerHeight: 0,\n\t\tscrollTop: 0,\n\t\tscrollHeight: 0,\n\t} );\n\n\t/**\n\t * Start the zoom out animation. This sets the necessary CSS variables\n\t * for animating the canvas and returns the Animation object.\n\t *\n\t * @return {Animation} The animation object for the zoom out animation.\n\t */\n\tconst startZoomOutAnimation = useCallback( () => {\n\t\tconst { scrollTop } = transitionFromRef.current;\n\t\tconst { scrollTop: scrollTopNext } = transitionToRef.current;\n\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top',\n\t\t\t`${ scrollTop }px`\n\t\t);\n\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top-next',\n\t\t\t`${ scrollTopNext }px`\n\t\t);\n\n\t\t// If the container has a scrolllbar, force a scrollbar to prevent the content from shifting while animating.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-overflow-behavior',\n\t\t\ttransitionFromRef.current.scrollHeight ===\n\t\t\t\ttransitionFromRef.current.containerHeight\n\t\t\t\t? 'auto'\n\t\t\t\t: 'scroll'\n\t\t);\n\n\t\tiframeDocument.documentElement.classList.add( 'zoom-out-animation' );\n\n\t\treturn iframeDocument.documentElement.animate(\n\t\t\tgetAnimationKeyframes(\n\t\t\t\ttransitionFromRef.current,\n\t\t\t\ttransitionToRef.current\n\t\t\t),\n\t\t\t{\n\t\t\t\teasing: 'cubic-bezier(0.46, 0.03, 0.52, 0.96)',\n\t\t\t\tduration: 400,\n\t\t\t}\n\t\t);\n\t}, [ iframeDocument ] );\n\n\t/**\n\t * Callback when the zoom out animation is finished.\n\t * - Cleans up animations refs.\n\t * - Adds final CSS vars for scale and frame size to preserve the state.\n\t * - Removes the 'zoom-out-animation' class (which has the fixed positioning).\n\t * - Sets the final scroll position after the canvas is no longer in fixed position.\n\t * - Removes CSS vars related to the animation.\n\t * - Sets the transitionFrom to the transitionTo state to be ready for the next animation.\n\t */\n\tconst finishZoomOutAnimation = useCallback( () => {\n\t\tstartAnimationRef.current = false;\n\t\tanimationRef.current = null;\n\n\t\t// Add our final scale and frame size now that the animation is done.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\ttransitionToRef.current.scaleValue\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\t`${ transitionToRef.current.frameSize }px`\n\t\t);\n\n\t\tiframeDocument.documentElement.classList.remove( 'zoom-out-animation' );\n\n\t\tiframeDocument.documentElement.scrollTop =\n\t\t\ttransitionToRef.current.scrollTop;\n\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top'\n\t\t);\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top-next'\n\t\t);\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-overflow-behavior'\n\t\t);\n\n\t\t// Update previous values.\n\t\ttransitionFromRef.current = transitionToRef.current;\n\t}, [ iframeDocument ] );\n\n\tconst previousIsZoomedOut = useRef( false );\n\n\t/**\n\t * Runs when zoom out mode is toggled, and sets the startAnimation flag\n\t * so the animation will start when the next useEffect runs. We _only_\n\t * want to animate when the zoom out mode is toggled, not when the scale\n\t * changes due to the container resizing.\n\t */\n\tuseEffect( () => {\n\t\tconst trigger =\n\t\t\tiframeDocument && previousIsZoomedOut.current !== isZoomedOut;\n\n\t\tpreviousIsZoomedOut.current = isZoomedOut;\n\n\t\tif ( ! trigger ) {\n\t\t\treturn;\n\t\t}\n\n\t\tstartAnimationRef.current = true;\n\n\t\tif ( ! isZoomedOut ) {\n\t\t\treturn;\n\t\t}\n\n\t\tiframeDocument.documentElement.classList.add( 'is-zoomed-out' );\n\t\treturn () => {\n\t\t\tiframeDocument.documentElement.classList.remove( 'is-zoomed-out' );\n\t\t};\n\t}, [ iframeDocument, isZoomedOut ] );\n\n\t/**\n\t * This handles:\n\t * 1. Setting the correct scale and vars of the canvas when zoomed out\n\t * 2. If zoom out mode has been toggled, runs the animation of zooming in/out\n\t */\n\tuseEffect( () => {\n\t\tif ( ! iframeDocument ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We need to update the appropriate scale to exit from. If sidebars have been opened since setting the\n\t\t// original scale, we will snap to a much smaller scale due to the scale container immediately changing sizes when exiting.\n\t\tif ( isAutoScaled && transitionFromRef.current.scaleValue !== 1 ) {\n\t\t\t// We use containerWidth as the divisor, as scaleContainerWidth will always match the containerWidth when\n\t\t\t// exiting.\n\t\t\ttransitionFromRef.current.scaleValue = calculateScale( {\n\t\t\t\tframeSize: transitionFromRef.current.frameSize,\n\t\t\t\tcontainerWidth,\n\t\t\t\tmaxContainerWidth,\n\t\t\t\tscaleContainerWidth: containerWidth,\n\t\t\t} );\n\t\t}\n\n\t\tif ( scaleValue < 1 ) {\n\t\t\t// If we are not going to animate the transition, set the scale and frame size directly.\n\t\t\t// If we are animating, these values will be set when the animation is finished.\n\t\t\t// Example: Opening sidebars that reduce the scale of the canvas, but we don't want to\n\t\t\t// animate the transition.\n\t\t\tif ( ! startAnimationRef.current ) {\n\t\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\t\t\tscaleValue\n\t\t\t\t);\n\t\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\t\t\t`${ frameSize }px`\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-content-height',\n\t\t\t\t`${ contentHeight }px`\n\t\t\t);\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-inner-height',\n\t\t\t\t`${ containerHeight }px`\n\t\t\t);\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-container-width',\n\t\t\t\t`${ containerWidth }px`\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width',\n\t\t\t\t`${ scaleContainerWidth }px`\n\t\t\t);\n\t\t}\n\n\t\t/**\n\t\t * Handle the zoom out animation:\n\t\t *\n\t\t * - Get the current scrollTop position.\n\t\t * - Calculate where the same scroll position is after scaling.\n\t\t * - Apply fixed positioning to the canvas with a transform offset\n\t\t * to keep the canvas centered.\n\t\t * - Animate the scale and padding to the new scale and frame size.\n\t\t * - After the animation is complete, remove the fixed positioning\n\t\t * and set the scroll position that keeps everything centered.\n\t\t */\n\t\tif ( startAnimationRef.current ) {\n\t\t\t// Don't allow a new transition to start again unless it was started by the zoom out mode changing.\n\t\t\tstartAnimationRef.current = false;\n\n\t\t\t/**\n\t\t\t * If we already have an animation running, reverse it.\n\t\t\t */\n\t\t\tif ( animationRef.current ) {\n\t\t\t\tanimationRef.current.reverse();\n\t\t\t\t// Swap the transition to/from refs so that we set the correct values when\n\t\t\t\t// finishZoomOutAnimation runs.\n\t\t\t\tconst tempTransitionFrom = transitionFromRef.current;\n\t\t\t\tconst tempTransitionTo = transitionToRef.current;\n\t\t\t\ttransitionFromRef.current = tempTransitionTo;\n\t\t\t\ttransitionToRef.current = tempTransitionFrom;\n\t\t\t} else {\n\t\t\t\t/**\n\t\t\t\t * Start a new zoom animation.\n\t\t\t\t */\n\n\t\t\t\t// We can't trust the set value from contentHeight, as it was measured\n\t\t\t\t// before the zoom out mode was changed. After zoom out mode is changed,\n\t\t\t\t// appenders may appear or disappear, so we need to get the height from\n\t\t\t\t// the iframe at this point when we're about to animate the zoom out.\n\t\t\t\t// The iframe scrollTop, scrollHeight, and clientHeight will all be\n\t\t\t\t// the most accurate.\n\t\t\t\ttransitionFromRef.current.scrollTop =\n\t\t\t\t\tiframeDocument.documentElement.scrollTop;\n\t\t\t\ttransitionFromRef.current.scrollHeight =\n\t\t\t\t\tiframeDocument.documentElement.scrollHeight;\n\t\t\t\t// Use containerHeight, as it's the previous container height before the zoom out animation starts.\n\t\t\t\ttransitionFromRef.current.containerHeight = containerHeight;\n\n\t\t\t\ttransitionToRef.current = {\n\t\t\t\t\tscaleValue,\n\t\t\t\t\tframeSize,\n\t\t\t\t\tcontainerHeight:\n\t\t\t\t\t\tiframeDocument.documentElement.clientHeight, // use clientHeight to get the actual height of the new container after zoom state changes have rendered, as it will be the most up-to-date.\n\t\t\t\t};\n\n\t\t\t\ttransitionToRef.current.scrollHeight = computeScrollHeightNext(\n\t\t\t\t\ttransitionFromRef.current,\n\t\t\t\t\ttransitionToRef.current\n\t\t\t\t);\n\t\t\t\ttransitionToRef.current.scrollTop = computeScrollTopNext(\n\t\t\t\t\ttransitionFromRef.current,\n\t\t\t\t\ttransitionToRef.current\n\t\t\t\t);\n\n\t\t\t\tanimationRef.current = startZoomOutAnimation();\n\n\t\t\t\t// If the user prefers reduced motion, finish the animation immediately and set the final state.\n\t\t\t\tif ( prefersReducedMotion ) {\n\t\t\t\t\tfinishZoomOutAnimation();\n\t\t\t\t} else {\n\t\t\t\t\tanimationRef.current.onfinish = finishZoomOutAnimation;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}, [\n\t\tstartZoomOutAnimation,\n\t\tfinishZoomOutAnimation,\n\t\tprefersReducedMotion,\n\t\tisAutoScaled,\n\t\tscaleValue,\n\t\tframeSize,\n\t\tiframeDocument,\n\t\tcontentHeight,\n\t\tcontainerWidth,\n\t\tcontainerHeight,\n\t\tmaxContainerWidth,\n\t\tscaleContainerWidth,\n\t] );\n\n\treturn {\n\t\tisZoomedOut,\n\t\tscaleContainerWidth,\n\t\tcontentResizeListener,\n\t\tcontainerResizeListener,\n\t};\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/inserter/block-patterns-tab/pattern-category-previews.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tuseMemo,\n\tuseState,\n\tuseCallback,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalHeading as Heading,\n\t__experimentalText as
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tuseMemo,\n\tuseState,\n\tuseCallback,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalHeading as Heading,\n\t__experimentalText as WCText,\n\tFlexBlock,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport usePatternsState from '../hooks/use-patterns-state';\nimport BlockPatternsList from '../../block-patterns-list';\nimport usePatternsPaging from '../hooks/use-patterns-paging';\nimport { PatternsFilter } from './patterns-filter';\nimport { usePatternCategories } from './use-pattern-categories';\nimport {\n\tisPatternFiltered,\n\tallPatternsCategory,\n\tmyPatternsCategory,\n\tstarterPatternsCategory,\n\tINSERTER_PATTERN_TYPES,\n} from './utils';\n\nconst noop = () => {};\n\nexport function PatternCategoryPreviews( {\n\trootClientId,\n\tonInsert,\n\tonHover = noop,\n\tcategory,\n\tshowTitlesAsTooltip,\n} ) {\n\tconst [ allPatterns, , onClickPattern ] = usePatternsState(\n\t\tonInsert,\n\t\trootClientId,\n\t\tcategory?.name\n\t);\n\tconst [ patternSyncFilter, setPatternSyncFilter ] = useState( 'all' );\n\tconst [ patternSourceFilter, setPatternSourceFilter ] = useState( 'all' );\n\n\tconst availableCategories = usePatternCategories(\n\t\trootClientId,\n\t\tpatternSourceFilter\n\t);\n\tconst scrollContainerRef = useRef();\n\tconst currentCategoryPatterns = useMemo(\n\t\t() =>\n\t\t\tallPatterns.filter( ( pattern ) => {\n\t\t\t\tif (\n\t\t\t\t\tisPatternFiltered(\n\t\t\t\t\t\tpattern,\n\t\t\t\t\t\tpatternSourceFilter,\n\t\t\t\t\t\tpatternSyncFilter\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\tif ( category.name === allPatternsCategory.name ) {\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\tcategory.name === myPatternsCategory.name &&\n\t\t\t\t\tpattern.type === INSERTER_PATTERN_TYPES.user\n\t\t\t\t) {\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\tcategory.name === starterPatternsCategory.name &&\n\t\t\t\t\tpattern.blockTypes?.includes( 'core/post-content' )\n\t\t\t\t) {\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\tif ( category.name === 'uncategorized' ) {\n\t\t\t\t\t// The uncategorized category should show all the patterns without any category...\n\t\t\t\t\tif ( ! pattern.categories ) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\n\t\t\t\t\t// ...or with no available category.\n\t\t\t\t\treturn ! pattern.categories.some( ( catName ) =>\n\t\t\t\t\t\tavailableCategories.some( ( c ) => c.name === catName )\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn pattern.categories?.includes( category.name );\n\t\t\t} ),\n\t\t[\n\t\t\tallPatterns,\n\t\t\tavailableCategories,\n\t\t\tcategory.name,\n\t\t\tpatternSourceFilter,\n\t\t\tpatternSyncFilter,\n\t\t]\n\t);\n\n\tconst pagingProps = usePatternsPaging(\n\t\tcurrentCategoryPatterns,\n\t\tcategory,\n\t\tscrollContainerRef\n\t);\n\tconst { changePage } = pagingProps;\n\n\t// Hide block pattern preview on unmount.\n\tuseEffect( () => () => onHover( null ), [] );\n\n\tconst onSetPatternSyncFilter = useCallback(\n\t\t( value ) => {\n\t\t\tsetPatternSyncFilter( value );\n\t\t\tchangePage( 1 );\n\t\t},\n\t\t[ setPatternSyncFilter, changePage ]\n\t);\n\tconst onSetPatternSourceFilter = useCallback(\n\t\t( value ) => {\n\t\t\tsetPatternSourceFilter( value );\n\t\t\tchangePage( 1 );\n\t\t},\n\t\t[ setPatternSourceFilter, changePage ]\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t<VStack\n\t\t\t\tspacing={ 2 }\n\t\t\t\tclassName=\"block-editor-inserter__patterns-category-panel-header\"\n\t\t\t>\n\t\t\t\t<HStack>\n\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\tclassName=\"block-editor-inserter__patterns-category-panel-title\"\n\t\t\t\t\t\t\tsize={ 13 }\n\t\t\t\t\t\t\tlevel={ 4 }\n\t\t\t\t\t\t\tas=\"div\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ category.label }\n\t\t\t\t\t\t</Heading>\n\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t<PatternsFilter\n\t\t\t\t\t\tpatternSyncFilter={ patternSyncFilter }\n\t\t\t\t\t\tpatternSourceFilter={ patternSourceFilter }\n\t\t\t\t\t\tsetPatternSyncFilter={ onSetPatternSyncFilter }\n\t\t\t\t\t\tsetPatternSourceFilter={ onSetPatternSourceFilter }\n\t\t\t\t\t\tscrollContainerRef={ scrollContainerRef }\n\t\t\t\t\t\tcategory={ category }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t\t{ ! currentCategoryPatterns.length && (\n\t\t\t\t\t<WCText\n\t\t\t\t\t\tvariant=\"muted\"\n\t\t\t\t\t\tclassName=\"block-editor-inserter__patterns-category-no-results\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'No results found' ) }\n\t\t\t\t\t</WCText>\n\t\t\t\t) }\n\t\t\t</VStack>\n\t\t\t{ currentCategoryPatterns.length > 0 && (\n\t\t\t\t<>\n\t\t\t\t\t<WCText\n\t\t\t\t\t\tsize=\"12\"\n\t\t\t\t\t\tas=\"p\"\n\t\t\t\t\t\tclassName=\"block-editor-inserter__help-text\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Drag and drop patterns into the canvas.' ) }\n\t\t\t\t\t</WCText>\n\t\t\t\t\t<BlockPatternsList\n\t\t\t\t\t\tref={ scrollContainerRef }\n\t\t\t\t\t\tblockPatterns={ pagingProps.categoryPatterns }\n\t\t\t\t\t\tonClickPattern={ onClickPattern }\n\t\t\t\t\t\tonHover={ onHover }\n\t\t\t\t\t\tlabel={ category.label }\n\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t\tcategory={ category.name }\n\t\t\t\t\t\tisDraggable\n\t\t\t\t\t\tshowTitlesAsTooltip={ showTitlesAsTooltip }\n\t\t\t\t\t\tpatternFilter={ patternSourceFilter }\n\t\t\t\t\t\tpagingProps={ pagingProps }\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],
|
|
5
5
|
"mappings": "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",
|
|
6
|
-
"names": ["usePatternsState", "usePatternsPaging", "VStack", "HStack", "Heading", "
|
|
6
|
+
"names": ["usePatternsState", "usePatternsPaging", "VStack", "HStack", "Heading", "WCText", "BlockPatternsList"]
|
|
7
7
|
}
|
|
@@ -198,12 +198,12 @@ var Inserter = class extends import_element.Component {
|
|
|
198
198
|
const {
|
|
199
199
|
position,
|
|
200
200
|
hasSingleBlockType,
|
|
201
|
-
|
|
201
|
+
blockToInsert,
|
|
202
202
|
insertOnlyAllowedBlock,
|
|
203
203
|
__experimentalIsQuick: isQuick,
|
|
204
204
|
onSelectOrClose
|
|
205
205
|
} = this.props;
|
|
206
|
-
if (hasSingleBlockType ||
|
|
206
|
+
if (hasSingleBlockType || blockToInsert) {
|
|
207
207
|
return this.renderToggle({ onToggle: insertOnlyAllowedBlock });
|
|
208
208
|
}
|
|
209
209
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -231,16 +231,19 @@ var inserter_default = (0, import_compose.compose)([
|
|
|
231
231
|
getBlockRootClientId,
|
|
232
232
|
hasInserterItems,
|
|
233
233
|
getAllowedBlocks,
|
|
234
|
-
getDirectInsertBlock
|
|
234
|
+
getDirectInsertBlock,
|
|
235
|
+
getBlockListSettings
|
|
235
236
|
} = select(import_store.store);
|
|
236
237
|
const { getBlockVariations, getBlockType } = select(import_blocks.store);
|
|
237
238
|
rootClientId = rootClientId || getBlockRootClientId(clientId) || void 0;
|
|
238
239
|
const allowedBlocks = getAllowedBlocks(rootClientId);
|
|
239
240
|
const directInsertBlock = shouldDirectInsert && getDirectInsertBlock(rootClientId);
|
|
241
|
+
const { defaultBlock } = getBlockListSettings(rootClientId) ?? {};
|
|
240
242
|
const hasSingleBlockType = allowedBlocks?.length === 1 && getBlockVariations(allowedBlocks[0].name, "inserter")?.length === 0;
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
243
|
+
const allowedBlockType = hasSingleBlockType ? allowedBlocks[0] : null;
|
|
244
|
+
let blockToInsert = directInsertBlock || null;
|
|
245
|
+
if (!blockToInsert && hasSingleBlockType && defaultBlock?.name === allowedBlockType.name) {
|
|
246
|
+
blockToInsert = defaultBlock;
|
|
244
247
|
}
|
|
245
248
|
const defaultBlockType = directInsertBlock ? getBlockType(directInsertBlock.name) : null;
|
|
246
249
|
const appenderLabel = (0, import_get_appender_label.getAppenderLabel)(
|
|
@@ -252,7 +255,7 @@ var inserter_default = (0, import_compose.compose)([
|
|
|
252
255
|
hasSingleBlockType,
|
|
253
256
|
blockTitle: allowedBlockType ? allowedBlockType.title : "",
|
|
254
257
|
allowedBlockType,
|
|
255
|
-
|
|
258
|
+
blockToInsert,
|
|
256
259
|
appenderLabel,
|
|
257
260
|
rootClientId
|
|
258
261
|
};
|
|
@@ -267,43 +270,43 @@ var inserter_default = (0, import_compose.compose)([
|
|
|
267
270
|
isAppender,
|
|
268
271
|
hasSingleBlockType,
|
|
269
272
|
allowedBlockType,
|
|
270
|
-
|
|
273
|
+
blockToInsert,
|
|
271
274
|
onSelectOrClose,
|
|
272
275
|
selectBlockOnInsert
|
|
273
276
|
} = ownProps;
|
|
274
|
-
if (!hasSingleBlockType && !
|
|
277
|
+
if (!hasSingleBlockType && !blockToInsert) {
|
|
275
278
|
return;
|
|
276
279
|
}
|
|
280
|
+
const blockName = blockToInsert?.name ?? allowedBlockType.name;
|
|
277
281
|
function getAdjacentBlockAttributes(attributesToCopy) {
|
|
278
|
-
|
|
279
|
-
if (!attributesToCopy || !clientId && !rootClientId) {
|
|
282
|
+
if (!attributesToCopy?.length) {
|
|
280
283
|
return {};
|
|
281
284
|
}
|
|
282
|
-
const
|
|
283
|
-
let adjacentAttributes
|
|
284
|
-
if (
|
|
285
|
-
const parentBlock = getBlock(rootClientId);
|
|
286
|
-
if (parentBlock?.innerBlocks?.length) {
|
|
287
|
-
const lastInnerBlock = parentBlock.innerBlocks[parentBlock.innerBlocks.length - 1];
|
|
288
|
-
if (directInsertBlock && directInsertBlock?.name === lastInnerBlock.name) {
|
|
289
|
-
adjacentAttributes = lastInnerBlock.attributes;
|
|
290
|
-
}
|
|
291
|
-
}
|
|
292
|
-
} else {
|
|
285
|
+
const { getBlock, getPreviousBlockClientId } = select(import_store.store);
|
|
286
|
+
let adjacentAttributes;
|
|
287
|
+
if (clientId) {
|
|
293
288
|
const currentBlock = getBlock(clientId);
|
|
294
289
|
const previousBlock = getBlock(
|
|
295
290
|
getPreviousBlockClientId(clientId)
|
|
296
291
|
);
|
|
297
292
|
if (currentBlock?.name === previousBlock?.name) {
|
|
298
|
-
adjacentAttributes = previousBlock?.attributes
|
|
293
|
+
adjacentAttributes = previousBlock?.attributes;
|
|
299
294
|
}
|
|
300
|
-
}
|
|
301
|
-
|
|
302
|
-
if (
|
|
303
|
-
|
|
295
|
+
} else if (rootClientId) {
|
|
296
|
+
const lastInnerBlock = getBlock(rootClientId)?.innerBlocks?.at(-1);
|
|
297
|
+
if (lastInnerBlock?.name === blockName) {
|
|
298
|
+
adjacentAttributes = lastInnerBlock.attributes;
|
|
304
299
|
}
|
|
305
|
-
}
|
|
306
|
-
|
|
300
|
+
}
|
|
301
|
+
if (!adjacentAttributes) {
|
|
302
|
+
return {};
|
|
303
|
+
}
|
|
304
|
+
return Object.fromEntries(
|
|
305
|
+
attributesToCopy.filter((attr) => attr in adjacentAttributes).map((attr) => [
|
|
306
|
+
attr,
|
|
307
|
+
adjacentAttributes[attr]
|
|
308
|
+
])
|
|
309
|
+
);
|
|
307
310
|
}
|
|
308
311
|
function getInsertionIndex() {
|
|
309
312
|
const {
|
|
@@ -322,26 +325,21 @@ var inserter_default = (0, import_compose.compose)([
|
|
|
322
325
|
return getBlockOrder(rootClientId).length;
|
|
323
326
|
}
|
|
324
327
|
const { insertBlock } = dispatch(import_store.store);
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
...newAttributes
|
|
333
|
-
});
|
|
334
|
-
} else {
|
|
335
|
-
blockToInsert = (0, import_blocks.createBlock)(allowedBlockType.name);
|
|
336
|
-
}
|
|
328
|
+
const newAttributes = getAdjacentBlockAttributes(
|
|
329
|
+
blockToInsert?.attributesToCopy
|
|
330
|
+
);
|
|
331
|
+
const newBlock = (0, import_blocks.createBlock)(blockName, {
|
|
332
|
+
...blockToInsert?.attributes || {},
|
|
333
|
+
...newAttributes
|
|
334
|
+
});
|
|
337
335
|
insertBlock(
|
|
338
|
-
|
|
336
|
+
newBlock,
|
|
339
337
|
getInsertionIndex(),
|
|
340
338
|
rootClientId,
|
|
341
339
|
selectBlockOnInsert
|
|
342
340
|
);
|
|
343
341
|
if (onSelectOrClose) {
|
|
344
|
-
onSelectOrClose(
|
|
342
|
+
onSelectOrClose(newBlock);
|
|
345
343
|
}
|
|
346
344
|
const message = (0, import_i18n.sprintf)(
|
|
347
345
|
// translators: %s: the name of the block that has been added
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/inserter/index.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { speak } from '@wordpress/a11y';\nimport { __, _x, sprintf } from '@wordpress/i18n';\nimport { Dropdown, Button } from '@wordpress/components';\nimport { Component } from '@wordpress/element';\nimport { withDispatch, withSelect } from '@wordpress/data';\nimport { compose, ifCondition } from '@wordpress/compose';\nimport { createBlock, store as blocksStore } from '@wordpress/blocks';\nimport { plus } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport InserterMenu from './menu';\nimport QuickInserter from './quick-inserter';\nimport { store as blockEditorStore } from '../../store';\nimport { getAppenderLabel } from './get-appender-label';\n\nconst defaultRenderToggle = ( {\n\tonToggle,\n\tdisabled,\n\tisOpen,\n\tblockTitle,\n\thasSingleBlockType,\n\tappenderLabel,\n\ttoggleProps = {},\n} ) => {\n\tconst {\n\t\tas: Wrapper = Button,\n\t\tlabel: labelProp,\n\t\tonClick,\n\t\t...rest\n\t} = toggleProps;\n\n\tlet label = labelProp;\n\tif ( ! label && appenderLabel ) {\n\t\t// Block returns the full label; use directly (consistent with getBlockLabel).\n\t\tlabel = appenderLabel;\n\t} else if ( ! label && hasSingleBlockType ) {\n\t\tlabel = sprintf(\n\t\t\t// translators: %s: the name of the block when there is only one\n\t\t\t_x( 'Add %s', 'directly add the only allowed block' ),\n\t\t\tblockTitle.toLowerCase()\n\t\t);\n\t} else if ( ! label ) {\n\t\tlabel = _x( 'Add block', 'Generic label for block inserter button' );\n\t}\n\n\t// Handle both onClick functions from the toggle and the parent component.\n\tfunction handleClick( event ) {\n\t\tif ( onToggle ) {\n\t\t\tonToggle( event );\n\t\t}\n\t\tif ( onClick ) {\n\t\t\tonClick( event );\n\t\t}\n\t}\n\n\treturn (\n\t\t<Wrapper\n\t\t\t__next40pxDefaultSize={ toggleProps.as ? undefined : true }\n\t\t\ticon={ plus }\n\t\t\tlabel={ label }\n\t\t\ttooltipPosition=\"bottom\"\n\t\t\tonClick={ handleClick }\n\t\t\tclassName=\"block-editor-inserter__toggle\"\n\t\t\taria-haspopup={ ! hasSingleBlockType ? 'true' : false }\n\t\t\taria-expanded={ ! hasSingleBlockType ? isOpen : false }\n\t\t\tdisabled={ disabled }\n\t\t\t{ ...rest }\n\t\t/>\n\t);\n};\n\nclass Inserter extends Component {\n\tconstructor() {\n\t\tsuper( ...arguments );\n\n\t\tthis.onToggle = this.onToggle.bind( this );\n\t\tthis.renderToggle = this.renderToggle.bind( this );\n\t\tthis.renderContent = this.renderContent.bind( this );\n\t}\n\n\tonToggle( isOpen ) {\n\t\tconst { onToggle } = this.props;\n\n\t\t// Surface toggle callback to parent component.\n\t\tif ( onToggle ) {\n\t\t\tonToggle( isOpen );\n\t\t}\n\t}\n\n\t/**\n\t * Render callback to display Dropdown toggle element.\n\t *\n\t * @param {Object} options\n\t * @param {Function} options.onToggle Callback to invoke when toggle is\n\t * pressed.\n\t * @param {boolean} options.isOpen Whether dropdown is currently open.\n\t *\n\t * @return {Element} Dropdown toggle element.\n\t */\n\trenderToggle( { onToggle, isOpen } ) {\n\t\tconst {\n\t\t\tdisabled,\n\t\t\tblockTitle,\n\t\t\thasSingleBlockType,\n\t\t\tappenderLabel,\n\t\t\ttoggleProps,\n\t\t\thasItems,\n\t\t\trenderToggle = defaultRenderToggle,\n\t\t} = this.props;\n\n\t\treturn renderToggle( {\n\t\t\tonToggle,\n\t\t\tisOpen,\n\t\t\tdisabled: disabled || ! hasItems,\n\t\t\tblockTitle,\n\t\t\thasSingleBlockType,\n\t\t\tappenderLabel,\n\t\t\ttoggleProps,\n\t\t} );\n\t}\n\n\t/**\n\t * Render callback to display Dropdown content element.\n\t *\n\t * @param {Object} options\n\t * @param {Function} options.onClose Callback to invoke when dropdown is\n\t * closed.\n\t *\n\t * @return {Element} Dropdown content element.\n\t */\n\trenderContent( { onClose } ) {\n\t\tconst {\n\t\t\trootClientId,\n\t\t\tclientId,\n\t\t\tisAppender,\n\t\t\tshowInserterHelpPanel,\n\n\t\t\t// This prop is experimental to give some time for the quick inserter to mature\n\t\t\t// Feel free to make them stable after a few releases.\n\t\t\t__experimentalIsQuick: isQuick,\n\t\t\tonSelectOrClose,\n\t\t\tselectBlockOnInsert,\n\t\t} = this.props;\n\n\t\tif ( isQuick ) {\n\t\t\treturn (\n\t\t\t\t<QuickInserter\n\t\t\t\t\tonSelect={ ( blocks ) => {\n\t\t\t\t\t\tconst firstBlock =\n\t\t\t\t\t\t\tArray.isArray( blocks ) && blocks?.length\n\t\t\t\t\t\t\t\t? blocks[ 0 ]\n\t\t\t\t\t\t\t\t: blocks;\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tonSelectOrClose &&\n\t\t\t\t\t\t\ttypeof onSelectOrClose === 'function'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonSelectOrClose( firstBlock );\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\tisAppender={ isAppender }\n\t\t\t\t\tselectBlockOnInsert={ selectBlockOnInsert }\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<InserterMenu\n\t\t\t\tonSelect={ () => {\n\t\t\t\t\tonClose();\n\t\t\t\t} }\n\t\t\t\tonClose={ onClose }\n\t\t\t\trootClientId={ rootClientId }\n\t\t\t\tclientId={ clientId }\n\t\t\t\tisAppender={ isAppender }\n\t\t\t\tshowInserterHelpPanel={ showInserterHelpPanel }\n\t\t\t/>\n\t\t);\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tposition,\n\t\t\thasSingleBlockType,\n\t\t\tdirectInsertBlock,\n\t\t\tinsertOnlyAllowedBlock,\n\t\t\t__experimentalIsQuick: isQuick,\n\t\t\tonSelectOrClose,\n\t\t} = this.props;\n\n\t\tif ( hasSingleBlockType || directInsertBlock ) {\n\t\t\treturn this.renderToggle( { onToggle: insertOnlyAllowedBlock } );\n\t\t}\n\n\t\treturn (\n\t\t\t<Dropdown\n\t\t\t\tclassName=\"block-editor-inserter\"\n\t\t\t\tcontentClassName={ clsx( 'block-editor-inserter__popover', {\n\t\t\t\t\t'is-quick': isQuick,\n\t\t\t\t} ) }\n\t\t\t\tpopoverProps={ { position, shift: true } }\n\t\t\t\tonToggle={ this.onToggle }\n\t\t\t\texpandOnMobile\n\t\t\t\theaderTitle={ __( 'Add a block' ) }\n\t\t\t\trenderToggle={ this.renderToggle }\n\t\t\t\trenderContent={ this.renderContent }\n\t\t\t\tonClose={ onSelectOrClose }\n\t\t\t/>\n\t\t);\n\t}\n}\n\nexport default compose( [\n\twithSelect(\n\t\t( select, { clientId, rootClientId, shouldDirectInsert = true } ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\thasInserterItems,\n\t\t\t\tgetAllowedBlocks,\n\t\t\t\tgetDirectInsertBlock,\n\t\t\t} = select( blockEditorStore );\n\n\t\t\tconst { getBlockVariations, getBlockType } = select( blocksStore );\n\n\t\t\trootClientId =\n\t\t\t\trootClientId || getBlockRootClientId( clientId ) || undefined;\n\n\t\t\tconst allowedBlocks = getAllowedBlocks( rootClientId );\n\n\t\t\tconst directInsertBlock =\n\t\t\t\tshouldDirectInsert && getDirectInsertBlock( rootClientId );\n\n\t\t\tconst hasSingleBlockType =\n\t\t\t\tallowedBlocks?.length === 1 &&\n\t\t\t\tgetBlockVariations( allowedBlocks[ 0 ].name, 'inserter' )\n\t\t\t\t\t?.length === 0;\n\n\t\t\tlet allowedBlockType = false;\n\t\t\tif ( hasSingleBlockType ) {\n\t\t\t\tallowedBlockType = allowedBlocks[ 0 ];\n\t\t\t}\n\n\t\t\tconst defaultBlockType = directInsertBlock\n\t\t\t\t? getBlockType( directInsertBlock.name )\n\t\t\t\t: null;\n\t\t\tconst appenderLabel = getAppenderLabel(\n\t\t\t\tdirectInsertBlock,\n\t\t\t\tdefaultBlockType\n\t\t\t);\n\n\t\t\treturn {\n\t\t\t\thasItems: hasInserterItems( rootClientId ),\n\t\t\t\thasSingleBlockType,\n\t\t\t\tblockTitle: allowedBlockType ? allowedBlockType.title : '',\n\t\t\t\tallowedBlockType,\n\t\t\t\tdirectInsertBlock,\n\t\t\t\tappenderLabel,\n\t\t\t\trootClientId,\n\t\t\t};\n\t\t}\n\t),\n\twithDispatch( ( dispatch, ownProps, { select } ) => {\n\t\treturn {\n\t\t\tinsertOnlyAllowedBlock() {\n\t\t\t\tconst {\n\t\t\t\t\trootClientId,\n\t\t\t\t\tclientId,\n\t\t\t\t\tisAppender,\n\t\t\t\t\thasSingleBlockType,\n\t\t\t\t\tallowedBlockType,\n\t\t\t\t\tdirectInsertBlock,\n\t\t\t\t\tonSelectOrClose,\n\t\t\t\t\tselectBlockOnInsert,\n\t\t\t\t} = ownProps;\n\n\t\t\t\tif ( ! hasSingleBlockType && ! directInsertBlock ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tfunction getAdjacentBlockAttributes( attributesToCopy ) {\n\t\t\t\t\tconst { getBlock, getPreviousBlockClientId } =\n\t\t\t\t\t\tselect( blockEditorStore );\n\n\t\t\t\t\tif (\n\t\t\t\t\t\t! attributesToCopy ||\n\t\t\t\t\t\t( ! clientId && ! rootClientId )\n\t\t\t\t\t) {\n\t\t\t\t\t\treturn {};\n\t\t\t\t\t}\n\n\t\t\t\t\tconst result = {};\n\t\t\t\t\tlet adjacentAttributes = {};\n\n\t\t\t\t\t// If there is no clientId, then attempt to get attributes\n\t\t\t\t\t// from the last block within innerBlocks of the root block.\n\t\t\t\t\tif ( ! clientId ) {\n\t\t\t\t\t\tconst parentBlock = getBlock( rootClientId );\n\n\t\t\t\t\t\tif ( parentBlock?.innerBlocks?.length ) {\n\t\t\t\t\t\t\tconst lastInnerBlock =\n\t\t\t\t\t\t\t\tparentBlock.innerBlocks[\n\t\t\t\t\t\t\t\t\tparentBlock.innerBlocks.length - 1\n\t\t\t\t\t\t\t\t];\n\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tdirectInsertBlock &&\n\t\t\t\t\t\t\t\tdirectInsertBlock?.name === lastInnerBlock.name\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tadjacentAttributes = lastInnerBlock.attributes;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// Otherwise, attempt to get attributes from the\n\t\t\t\t\t\t// previous block relative to the current clientId.\n\t\t\t\t\t\tconst currentBlock = getBlock( clientId );\n\t\t\t\t\t\tconst previousBlock = getBlock(\n\t\t\t\t\t\t\tgetPreviousBlockClientId( clientId )\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\tif ( currentBlock?.name === previousBlock?.name ) {\n\t\t\t\t\t\t\tadjacentAttributes =\n\t\t\t\t\t\t\t\tpreviousBlock?.attributes || {};\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Copy over only those attributes flagged to be copied.\n\t\t\t\t\tattributesToCopy.forEach( ( attribute ) => {\n\t\t\t\t\t\tif ( adjacentAttributes.hasOwnProperty( attribute ) ) {\n\t\t\t\t\t\t\tresult[ attribute ] =\n\t\t\t\t\t\t\t\tadjacentAttributes[ attribute ];\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\n\t\t\t\t\treturn result;\n\t\t\t\t}\n\n\t\t\t\tfunction getInsertionIndex() {\n\t\t\t\t\tconst {\n\t\t\t\t\t\tgetBlockIndex,\n\t\t\t\t\t\tgetBlockSelectionEnd,\n\t\t\t\t\t\tgetBlockOrder,\n\t\t\t\t\t\tgetBlockRootClientId,\n\t\t\t\t\t} = select( blockEditorStore );\n\n\t\t\t\t\t// If the clientId is defined, we insert at the position of the block.\n\t\t\t\t\tif ( clientId ) {\n\t\t\t\t\t\treturn getBlockIndex( clientId );\n\t\t\t\t\t}\n\n\t\t\t\t\t// If there a selected block, we insert after the selected block.\n\t\t\t\t\tconst end = getBlockSelectionEnd();\n\t\t\t\t\tif (\n\t\t\t\t\t\t! isAppender &&\n\t\t\t\t\t\tend &&\n\t\t\t\t\t\tgetBlockRootClientId( end ) === rootClientId\n\t\t\t\t\t) {\n\t\t\t\t\t\treturn getBlockIndex( end ) + 1;\n\t\t\t\t\t}\n\n\t\t\t\t\t// Otherwise, we insert at the end of the current rootClientId.\n\t\t\t\t\treturn getBlockOrder( rootClientId ).length;\n\t\t\t\t}\n\n\t\t\t\tconst { insertBlock } = dispatch( blockEditorStore );\n\n\t\t\t\tlet blockToInsert;\n\n\t\t\t\t// Attempt to augment the directInsertBlock with attributes from an adjacent block.\n\t\t\t\t// This ensures styling from nearby blocks is preserved in the newly inserted block.\n\t\t\t\t// See: https://github.com/WordPress/gutenberg/issues/37904\n\t\t\t\tif ( directInsertBlock ) {\n\t\t\t\t\tconst newAttributes = getAdjacentBlockAttributes(\n\t\t\t\t\t\tdirectInsertBlock.attributesToCopy\n\t\t\t\t\t);\n\n\t\t\t\t\tblockToInsert = createBlock( directInsertBlock.name, {\n\t\t\t\t\t\t...( directInsertBlock.attributes || {} ),\n\t\t\t\t\t\t...newAttributes,\n\t\t\t\t\t} );\n\t\t\t\t} else {\n\t\t\t\t\tblockToInsert = createBlock( allowedBlockType.name );\n\t\t\t\t}\n\n\t\t\t\tinsertBlock(\n\t\t\t\t\tblockToInsert,\n\t\t\t\t\tgetInsertionIndex(),\n\t\t\t\t\trootClientId,\n\t\t\t\t\tselectBlockOnInsert\n\t\t\t\t);\n\n\t\t\t\tif ( onSelectOrClose ) {\n\t\t\t\t\tonSelectOrClose( blockToInsert );\n\t\t\t\t}\n\n\t\t\t\tconst message = sprintf(\n\t\t\t\t\t// translators: %s: the name of the block that has been added\n\t\t\t\t\t__( '%s block added' ),\n\t\t\t\t\tallowedBlockType.title\n\t\t\t\t);\n\t\t\t\tspeak( message );\n\t\t\t},\n\t\t};\n\t} ),\n\t// The global inserter should always be visible, we are using ( ! isAppender && ! rootClientId && ! clientId ) as\n\t// a way to detect the global Inserter.\n\tifCondition(\n\t\t( { hasItems, isAppender, rootClientId, clientId } ) =>\n\t\t\thasItems || ( ! isAppender && ! rootClientId && ! clientId )\n\t),\n] )( Inserter );\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,kBAAsB;AACtB,kBAAgC;AAChC,wBAAiC;AACjC,qBAA0B;AAC1B,kBAAyC;AACzC,qBAAqC;AACrC,oBAAkD;AAClD,mBAAqB;AAKrB,kBAAyB;AACzB,4BAA0B;AAC1B,mBAA0C;AAC1C,gCAAiC;AA2C/B;AAzCF,IAAM,sBAAsB,CAAE;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc,CAAC;AAChB,MAAO;AACN,QAAM;AAAA,IACL,IAAI,UAAU;AAAA,IACd,OAAO;AAAA,IACP;AAAA,IACA,GAAG;AAAA,EACJ,IAAI;AAEJ,MAAI,QAAQ;AACZ,MAAK,CAAE,SAAS,eAAgB;AAE/B,YAAQ;AAAA,EACT,WAAY,CAAE,SAAS,oBAAqB;AAC3C,gBAAQ;AAAA;AAAA,UAEP,gBAAI,UAAU,qCAAsC;AAAA,MACpD,WAAW,YAAY;AAAA,IACxB;AAAA,EACD,WAAY,CAAE,OAAQ;AACrB,gBAAQ,gBAAI,aAAa,yCAA0C;AAAA,EACpE;AAGA,WAAS,YAAa,OAAQ;AAC7B,QAAK,UAAW;AACf,eAAU,KAAM;AAAA,IACjB;AACA,QAAK,SAAU;AACd,cAAS,KAAM;AAAA,IAChB;AAAA,EACD;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,uBAAwB,YAAY,KAAK,SAAY;AAAA,MACrD,MAAO;AAAA,MACP;AAAA,MACA,iBAAgB;AAAA,MAChB,SAAU;AAAA,MACV,WAAU;AAAA,MACV,iBAAgB,CAAE,qBAAqB,SAAS;AAAA,MAChD,iBAAgB,CAAE,qBAAqB,SAAS;AAAA,MAChD;AAAA,MACE,GAAG;AAAA;AAAA,EACN;AAEF;AAEA,IAAM,WAAN,cAAuB,yBAAU;AAAA,EAChC,cAAc;AACb,UAAO,GAAG,SAAU;AAEpB,SAAK,WAAW,KAAK,SAAS,KAAM,IAAK;AACzC,SAAK,eAAe,KAAK,aAAa,KAAM,IAAK;AACjD,SAAK,gBAAgB,KAAK,cAAc,KAAM,IAAK;AAAA,EACpD;AAAA,EAEA,SAAU,QAAS;AAClB,UAAM,EAAE,SAAS,IAAI,KAAK;AAG1B,QAAK,UAAW;AACf,eAAU,MAAO;AAAA,IAClB;AAAA,EACD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYA,aAAc,EAAE,UAAU,OAAO,GAAI;AACpC,UAAM;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe;AAAA,IAChB,IAAI,KAAK;AAET,WAAO,aAAc;AAAA,MACpB;AAAA,MACA;AAAA,MACA,UAAU,YAAY,CAAE;AAAA,MACxB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD,CAAE;AAAA,EACH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWA,cAAe,EAAE,QAAQ,GAAI;AAC5B,UAAM;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { speak } from '@wordpress/a11y';\nimport { __, _x, sprintf } from '@wordpress/i18n';\nimport { Dropdown, Button } from '@wordpress/components';\nimport { Component } from '@wordpress/element';\nimport { withDispatch, withSelect } from '@wordpress/data';\nimport { compose, ifCondition } from '@wordpress/compose';\nimport { createBlock, store as blocksStore } from '@wordpress/blocks';\nimport { plus } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport InserterMenu from './menu';\nimport QuickInserter from './quick-inserter';\nimport { store as blockEditorStore } from '../../store';\nimport { getAppenderLabel } from './get-appender-label';\n\nconst defaultRenderToggle = ( {\n\tonToggle,\n\tdisabled,\n\tisOpen,\n\tblockTitle,\n\thasSingleBlockType,\n\tappenderLabel,\n\ttoggleProps = {},\n} ) => {\n\tconst {\n\t\tas: Wrapper = Button,\n\t\tlabel: labelProp,\n\t\tonClick,\n\t\t...rest\n\t} = toggleProps;\n\n\tlet label = labelProp;\n\tif ( ! label && appenderLabel ) {\n\t\t// Block returns the full label; use directly (consistent with getBlockLabel).\n\t\tlabel = appenderLabel;\n\t} else if ( ! label && hasSingleBlockType ) {\n\t\tlabel = sprintf(\n\t\t\t// translators: %s: the name of the block when there is only one\n\t\t\t_x( 'Add %s', 'directly add the only allowed block' ),\n\t\t\tblockTitle.toLowerCase()\n\t\t);\n\t} else if ( ! label ) {\n\t\tlabel = _x( 'Add block', 'Generic label for block inserter button' );\n\t}\n\n\t// Handle both onClick functions from the toggle and the parent component.\n\tfunction handleClick( event ) {\n\t\tif ( onToggle ) {\n\t\t\tonToggle( event );\n\t\t}\n\t\tif ( onClick ) {\n\t\t\tonClick( event );\n\t\t}\n\t}\n\n\treturn (\n\t\t<Wrapper\n\t\t\t__next40pxDefaultSize={ toggleProps.as ? undefined : true }\n\t\t\ticon={ plus }\n\t\t\tlabel={ label }\n\t\t\ttooltipPosition=\"bottom\"\n\t\t\tonClick={ handleClick }\n\t\t\tclassName=\"block-editor-inserter__toggle\"\n\t\t\taria-haspopup={ ! hasSingleBlockType ? 'true' : false }\n\t\t\taria-expanded={ ! hasSingleBlockType ? isOpen : false }\n\t\t\tdisabled={ disabled }\n\t\t\t{ ...rest }\n\t\t/>\n\t);\n};\n\nclass Inserter extends Component {\n\tconstructor() {\n\t\tsuper( ...arguments );\n\n\t\tthis.onToggle = this.onToggle.bind( this );\n\t\tthis.renderToggle = this.renderToggle.bind( this );\n\t\tthis.renderContent = this.renderContent.bind( this );\n\t}\n\n\tonToggle( isOpen ) {\n\t\tconst { onToggle } = this.props;\n\n\t\t// Surface toggle callback to parent component.\n\t\tif ( onToggle ) {\n\t\t\tonToggle( isOpen );\n\t\t}\n\t}\n\n\t/**\n\t * Render callback to display Dropdown toggle element.\n\t *\n\t * @param {Object} options\n\t * @param {Function} options.onToggle Callback to invoke when toggle is\n\t * pressed.\n\t * @param {boolean} options.isOpen Whether dropdown is currently open.\n\t *\n\t * @return {Element} Dropdown toggle element.\n\t */\n\trenderToggle( { onToggle, isOpen } ) {\n\t\tconst {\n\t\t\tdisabled,\n\t\t\tblockTitle,\n\t\t\thasSingleBlockType,\n\t\t\tappenderLabel,\n\t\t\ttoggleProps,\n\t\t\thasItems,\n\t\t\trenderToggle = defaultRenderToggle,\n\t\t} = this.props;\n\n\t\treturn renderToggle( {\n\t\t\tonToggle,\n\t\t\tisOpen,\n\t\t\tdisabled: disabled || ! hasItems,\n\t\t\tblockTitle,\n\t\t\thasSingleBlockType,\n\t\t\tappenderLabel,\n\t\t\ttoggleProps,\n\t\t} );\n\t}\n\n\t/**\n\t * Render callback to display Dropdown content element.\n\t *\n\t * @param {Object} options\n\t * @param {Function} options.onClose Callback to invoke when dropdown is\n\t * closed.\n\t *\n\t * @return {Element} Dropdown content element.\n\t */\n\trenderContent( { onClose } ) {\n\t\tconst {\n\t\t\trootClientId,\n\t\t\tclientId,\n\t\t\tisAppender,\n\t\t\tshowInserterHelpPanel,\n\t\t\t// This prop is experimental to give some time for the quick inserter to mature\n\t\t\t// Feel free to make them stable after a few releases.\n\t\t\t__experimentalIsQuick: isQuick,\n\t\t\tonSelectOrClose,\n\t\t\tselectBlockOnInsert,\n\t\t} = this.props;\n\n\t\tif ( isQuick ) {\n\t\t\treturn (\n\t\t\t\t<QuickInserter\n\t\t\t\t\tonSelect={ ( blocks ) => {\n\t\t\t\t\t\tconst firstBlock =\n\t\t\t\t\t\t\tArray.isArray( blocks ) && blocks?.length\n\t\t\t\t\t\t\t\t? blocks[ 0 ]\n\t\t\t\t\t\t\t\t: blocks;\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tonSelectOrClose &&\n\t\t\t\t\t\t\ttypeof onSelectOrClose === 'function'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonSelectOrClose( firstBlock );\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\tisAppender={ isAppender }\n\t\t\t\t\tselectBlockOnInsert={ selectBlockOnInsert }\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<InserterMenu\n\t\t\t\tonSelect={ () => {\n\t\t\t\t\tonClose();\n\t\t\t\t} }\n\t\t\t\tonClose={ onClose }\n\t\t\t\trootClientId={ rootClientId }\n\t\t\t\tclientId={ clientId }\n\t\t\t\tisAppender={ isAppender }\n\t\t\t\tshowInserterHelpPanel={ showInserterHelpPanel }\n\t\t\t/>\n\t\t);\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tposition,\n\t\t\thasSingleBlockType,\n\t\t\tblockToInsert,\n\t\t\tinsertOnlyAllowedBlock,\n\t\t\t__experimentalIsQuick: isQuick,\n\t\t\tonSelectOrClose,\n\t\t} = this.props;\n\n\t\tif ( hasSingleBlockType || blockToInsert ) {\n\t\t\treturn this.renderToggle( { onToggle: insertOnlyAllowedBlock } );\n\t\t}\n\n\t\treturn (\n\t\t\t<Dropdown\n\t\t\t\tclassName=\"block-editor-inserter\"\n\t\t\t\tcontentClassName={ clsx( 'block-editor-inserter__popover', {\n\t\t\t\t\t'is-quick': isQuick,\n\t\t\t\t} ) }\n\t\t\t\tpopoverProps={ { position, shift: true } }\n\t\t\t\tonToggle={ this.onToggle }\n\t\t\t\texpandOnMobile\n\t\t\t\theaderTitle={ __( 'Add a block' ) }\n\t\t\t\trenderToggle={ this.renderToggle }\n\t\t\t\trenderContent={ this.renderContent }\n\t\t\t\tonClose={ onSelectOrClose }\n\t\t\t/>\n\t\t);\n\t}\n}\n\nexport default compose( [\n\twithSelect(\n\t\t( select, { clientId, rootClientId, shouldDirectInsert = true } ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\thasInserterItems,\n\t\t\t\tgetAllowedBlocks,\n\t\t\t\tgetDirectInsertBlock,\n\t\t\t\tgetBlockListSettings,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst { getBlockVariations, getBlockType } = select( blocksStore );\n\n\t\t\trootClientId =\n\t\t\t\trootClientId || getBlockRootClientId( clientId ) || undefined;\n\n\t\t\tconst allowedBlocks = getAllowedBlocks( rootClientId );\n\t\t\tconst directInsertBlock =\n\t\t\t\tshouldDirectInsert && getDirectInsertBlock( rootClientId );\n\t\t\tconst { defaultBlock } = getBlockListSettings( rootClientId ) ?? {};\n\n\t\t\tconst hasSingleBlockType =\n\t\t\t\tallowedBlocks?.length === 1 &&\n\t\t\t\tgetBlockVariations( allowedBlocks[ 0 ].name, 'inserter' )\n\t\t\t\t\t?.length === 0;\n\t\t\tconst allowedBlockType = hasSingleBlockType\n\t\t\t\t? allowedBlocks[ 0 ]\n\t\t\t\t: null;\n\n\t\t\t// Single-block-type parents get adjacent-attribute copying\n\t\t\t// without needing to set `directInsert: true`.\n\t\t\tlet blockToInsert = directInsertBlock || null;\n\t\t\tif (\n\t\t\t\t! blockToInsert &&\n\t\t\t\thasSingleBlockType &&\n\t\t\t\tdefaultBlock?.name === allowedBlockType.name\n\t\t\t) {\n\t\t\t\tblockToInsert = defaultBlock;\n\t\t\t}\n\n\t\t\tconst defaultBlockType = directInsertBlock\n\t\t\t\t? getBlockType( directInsertBlock.name )\n\t\t\t\t: null;\n\t\t\tconst appenderLabel = getAppenderLabel(\n\t\t\t\tdirectInsertBlock,\n\t\t\t\tdefaultBlockType\n\t\t\t);\n\n\t\t\treturn {\n\t\t\t\thasItems: hasInserterItems( rootClientId ),\n\t\t\t\thasSingleBlockType,\n\t\t\t\tblockTitle: allowedBlockType ? allowedBlockType.title : '',\n\t\t\t\tallowedBlockType,\n\t\t\t\tblockToInsert,\n\t\t\t\tappenderLabel,\n\t\t\t\trootClientId,\n\t\t\t};\n\t\t}\n\t),\n\twithDispatch( ( dispatch, ownProps, { select } ) => {\n\t\treturn {\n\t\t\tinsertOnlyAllowedBlock() {\n\t\t\t\tconst {\n\t\t\t\t\trootClientId,\n\t\t\t\t\tclientId,\n\t\t\t\t\tisAppender,\n\t\t\t\t\thasSingleBlockType,\n\t\t\t\t\tallowedBlockType,\n\t\t\t\t\tblockToInsert,\n\t\t\t\t\tonSelectOrClose,\n\t\t\t\t\tselectBlockOnInsert,\n\t\t\t\t} = ownProps;\n\n\t\t\t\tif ( ! hasSingleBlockType && ! blockToInsert ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst blockName = blockToInsert?.name ?? allowedBlockType.name;\n\n\t\t\t\tfunction getAdjacentBlockAttributes( attributesToCopy ) {\n\t\t\t\t\tif ( ! attributesToCopy?.length ) {\n\t\t\t\t\t\treturn {};\n\t\t\t\t\t}\n\n\t\t\t\t\tconst { getBlock, getPreviousBlockClientId } =\n\t\t\t\t\t\tselect( blockEditorStore );\n\n\t\t\t\t\t// Find the adjacent block of the same type whose attributes\n\t\t\t\t\t// should be copied: previous sibling when inserting next to\n\t\t\t\t\t// an existing block, otherwise the last child of the root.\n\t\t\t\t\tlet adjacentAttributes;\n\t\t\t\t\tif ( clientId ) {\n\t\t\t\t\t\tconst currentBlock = getBlock( clientId );\n\t\t\t\t\t\tconst previousBlock = getBlock(\n\t\t\t\t\t\t\tgetPreviousBlockClientId( clientId )\n\t\t\t\t\t\t);\n\t\t\t\t\t\tif ( currentBlock?.name === previousBlock?.name ) {\n\t\t\t\t\t\t\tadjacentAttributes = previousBlock?.attributes;\n\t\t\t\t\t\t}\n\t\t\t\t\t} else if ( rootClientId ) {\n\t\t\t\t\t\tconst lastInnerBlock =\n\t\t\t\t\t\t\tgetBlock( rootClientId )?.innerBlocks?.at( -1 );\n\t\t\t\t\t\tif ( lastInnerBlock?.name === blockName ) {\n\t\t\t\t\t\t\tadjacentAttributes = lastInnerBlock.attributes;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( ! adjacentAttributes ) {\n\t\t\t\t\t\treturn {};\n\t\t\t\t\t}\n\n\t\t\t\t\treturn Object.fromEntries(\n\t\t\t\t\t\tattributesToCopy\n\t\t\t\t\t\t\t.filter( ( attr ) => attr in adjacentAttributes )\n\t\t\t\t\t\t\t.map( ( attr ) => [\n\t\t\t\t\t\t\t\tattr,\n\t\t\t\t\t\t\t\tadjacentAttributes[ attr ],\n\t\t\t\t\t\t\t] )\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\tfunction getInsertionIndex() {\n\t\t\t\t\tconst {\n\t\t\t\t\t\tgetBlockIndex,\n\t\t\t\t\t\tgetBlockSelectionEnd,\n\t\t\t\t\t\tgetBlockOrder,\n\t\t\t\t\t\tgetBlockRootClientId,\n\t\t\t\t\t} = select( blockEditorStore );\n\n\t\t\t\t\t// If the clientId is defined, we insert at the position of the block.\n\t\t\t\t\tif ( clientId ) {\n\t\t\t\t\t\treturn getBlockIndex( clientId );\n\t\t\t\t\t}\n\n\t\t\t\t\t// If there a selected block, we insert after the selected block.\n\t\t\t\t\tconst end = getBlockSelectionEnd();\n\t\t\t\t\tif (\n\t\t\t\t\t\t! isAppender &&\n\t\t\t\t\t\tend &&\n\t\t\t\t\t\tgetBlockRootClientId( end ) === rootClientId\n\t\t\t\t\t) {\n\t\t\t\t\t\treturn getBlockIndex( end ) + 1;\n\t\t\t\t\t}\n\n\t\t\t\t\t// Otherwise, we insert at the end of the current rootClientId.\n\t\t\t\t\treturn getBlockOrder( rootClientId ).length;\n\t\t\t\t}\n\n\t\t\t\tconst { insertBlock } = dispatch( blockEditorStore );\n\n\t\t\t\t// Attempt to augment the inserted block with attributes from an adjacent block.\n\t\t\t\t// This ensures styling from nearby blocks is preserved in the newly inserted block.\n\t\t\t\t// See: https://github.com/WordPress/gutenberg/issues/37904\n\t\t\t\tconst newAttributes = getAdjacentBlockAttributes(\n\t\t\t\t\tblockToInsert?.attributesToCopy\n\t\t\t\t);\n\n\t\t\t\tconst newBlock = createBlock( blockName, {\n\t\t\t\t\t...( blockToInsert?.attributes || {} ),\n\t\t\t\t\t...newAttributes,\n\t\t\t\t} );\n\n\t\t\t\tinsertBlock(\n\t\t\t\t\tnewBlock,\n\t\t\t\t\tgetInsertionIndex(),\n\t\t\t\t\trootClientId,\n\t\t\t\t\tselectBlockOnInsert\n\t\t\t\t);\n\n\t\t\t\tif ( onSelectOrClose ) {\n\t\t\t\t\tonSelectOrClose( newBlock );\n\t\t\t\t}\n\n\t\t\t\tconst message = sprintf(\n\t\t\t\t\t// translators: %s: the name of the block that has been added\n\t\t\t\t\t__( '%s block added' ),\n\t\t\t\t\tallowedBlockType.title\n\t\t\t\t);\n\t\t\t\tspeak( message );\n\t\t\t},\n\t\t};\n\t} ),\n\t// The global inserter should always be visible, we are using ( ! isAppender && ! rootClientId && ! clientId ) as\n\t// a way to detect the global Inserter.\n\tifCondition(\n\t\t( { hasItems, isAppender, rootClientId, clientId } ) =>\n\t\t\thasItems || ( ! isAppender && ! rootClientId && ! clientId )\n\t),\n] )( Inserter );\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["QuickInserter", "InserterMenu", "clsx", "blockEditorStore", "blocksStore"]
|
|
7
7
|
}
|