@wordpress/block-editor 15.7.1-next.2f1c7c01b.0 → 15.8.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 +2 -0
- package/build/components/block-card/index.js +76 -34
- package/build/components/block-card/index.js.map +2 -2
- package/build/components/block-inspector/edit-contents.js +72 -0
- package/build/components/block-inspector/edit-contents.js.map +7 -0
- package/build/components/block-inspector/index.js +32 -9
- package/build/components/block-inspector/index.js.map +3 -3
- package/build/components/block-list/index.js +9 -9
- package/build/components/block-list/index.js.map +2 -2
- package/build/components/block-switcher/index.js +24 -123
- package/build/components/block-switcher/index.js.map +3 -3
- package/build/components/block-toolbar/block-toolbar-icon.js +175 -0
- package/build/components/block-toolbar/block-toolbar-icon.js.map +7 -0
- package/build/components/block-toolbar/index.js +51 -53
- package/build/components/block-toolbar/index.js.map +3 -3
- package/build/components/block-toolbar/pattern-overrides-dropdown.js +93 -0
- package/build/components/block-toolbar/pattern-overrides-dropdown.js.map +7 -0
- package/build/components/block-tools/index.js +10 -3
- package/build/components/block-tools/index.js.map +2 -2
- package/build/components/border-radius-control/utils.js +7 -3
- package/build/components/border-radius-control/utils.js.map +2 -2
- package/build/components/content-lock/modify-content-lock-menu-item.js +3 -3
- package/build/components/content-lock/modify-content-lock-menu-item.js.map +2 -2
- package/build/components/global-styles/border-panel.js +11 -7
- package/build/components/global-styles/border-panel.js.map +2 -2
- package/build/components/global-styles/color-panel.js +35 -27
- package/build/components/global-styles/color-panel.js.map +2 -2
- package/build/components/global-styles/typography-panel.js +3 -2
- package/build/components/global-styles/typography-panel.js.map +2 -2
- package/build/components/inserter/media-tab/media-tab.js +2 -1
- package/build/components/inserter/media-tab/media-tab.js.map +2 -2
- package/build/components/inspector-controls-tabs/index.js +2 -1
- package/build/components/inspector-controls-tabs/index.js.map +2 -2
- package/build/components/inspector-controls-tabs/styles-tab.js +55 -1
- package/build/components/inspector-controls-tabs/styles-tab.js.map +3 -3
- package/build/components/inspector-controls-tabs/use-inspector-controls-tabs.js +1 -1
- package/build/components/inspector-controls-tabs/use-inspector-controls-tabs.js.map +2 -2
- package/build/components/keyboard-shortcuts/index.js +8 -0
- package/build/components/keyboard-shortcuts/index.js.map +2 -2
- package/build/components/rich-text/index.js +1 -0
- package/build/components/rich-text/index.js.map +2 -2
- package/build/hooks/border.js +10 -5
- package/build/hooks/border.js.map +3 -3
- package/build/hooks/color.js +31 -9
- package/build/hooks/color.js.map +3 -3
- package/build/hooks/content-lock-ui.js +4 -5
- package/build/hooks/content-lock-ui.js.map +2 -2
- package/build/hooks/dimensions.js +9 -4
- package/build/hooks/dimensions.js.map +2 -2
- package/build/hooks/fit-text.js +19 -75
- package/build/hooks/fit-text.js.map +3 -3
- package/build/hooks/font-size.js +5 -2
- package/build/hooks/font-size.js.map +2 -2
- package/build/hooks/layout.js +4 -1
- package/build/hooks/layout.js.map +2 -2
- package/build/hooks/spacing-visualizer.js +5 -0
- package/build/hooks/spacing-visualizer.js.map +2 -2
- package/build/hooks/typography.js +23 -14
- package/build/hooks/typography.js.map +3 -3
- package/build/store/private-selectors.js +21 -1
- package/build/store/private-selectors.js.map +2 -2
- package/build/store/reducer.js +4 -0
- package/build/store/reducer.js.map +2 -2
- package/build/store/selectors.js +9 -3
- package/build/store/selectors.js.map +2 -2
- package/build/utils/fit-text-frontend.js +1 -0
- package/build/utils/fit-text-frontend.js.map +2 -2
- package/build/utils/fit-text-utils.js +1 -1
- package/build/utils/fit-text-utils.js.map +1 -1
- package/build-module/components/block-card/index.js +82 -32
- package/build-module/components/block-card/index.js.map +2 -2
- package/build-module/components/block-inspector/edit-contents.js +51 -0
- package/build-module/components/block-inspector/edit-contents.js.map +7 -0
- package/build-module/components/block-inspector/index.js +32 -9
- package/build-module/components/block-inspector/index.js.map +2 -2
- package/build-module/components/block-list/index.js +11 -11
- package/build-module/components/block-list/index.js.map +2 -2
- package/build-module/components/block-switcher/index.js +24 -124
- package/build-module/components/block-switcher/index.js.map +2 -2
- package/build-module/components/block-toolbar/block-toolbar-icon.js +144 -0
- package/build-module/components/block-toolbar/block-toolbar-icon.js.map +7 -0
- package/build-module/components/block-toolbar/index.js +51 -53
- package/build-module/components/block-toolbar/index.js.map +2 -2
- package/build-module/components/block-toolbar/pattern-overrides-dropdown.js +76 -0
- package/build-module/components/block-toolbar/pattern-overrides-dropdown.js.map +7 -0
- package/build-module/components/block-tools/index.js +10 -3
- package/build-module/components/block-tools/index.js.map +2 -2
- package/build-module/components/border-radius-control/utils.js +7 -3
- package/build-module/components/border-radius-control/utils.js.map +2 -2
- package/build-module/components/content-lock/modify-content-lock-menu-item.js +3 -3
- package/build-module/components/content-lock/modify-content-lock-menu-item.js.map +2 -2
- package/build-module/components/global-styles/border-panel.js +11 -7
- package/build-module/components/global-styles/border-panel.js.map +2 -2
- package/build-module/components/global-styles/color-panel.js +34 -27
- package/build-module/components/global-styles/color-panel.js.map +2 -2
- package/build-module/components/global-styles/typography-panel.js +3 -2
- package/build-module/components/global-styles/typography-panel.js.map +2 -2
- package/build-module/components/inserter/media-tab/media-tab.js +2 -1
- package/build-module/components/inserter/media-tab/media-tab.js.map +2 -2
- package/build-module/components/inspector-controls-tabs/index.js +2 -1
- package/build-module/components/inspector-controls-tabs/index.js.map +2 -2
- package/build-module/components/inspector-controls-tabs/styles-tab.js +55 -1
- package/build-module/components/inspector-controls-tabs/styles-tab.js.map +2 -2
- package/build-module/components/inspector-controls-tabs/use-inspector-controls-tabs.js +1 -1
- package/build-module/components/inspector-controls-tabs/use-inspector-controls-tabs.js.map +2 -2
- package/build-module/components/keyboard-shortcuts/index.js +8 -0
- package/build-module/components/keyboard-shortcuts/index.js.map +2 -2
- package/build-module/components/rich-text/index.js +1 -0
- package/build-module/components/rich-text/index.js.map +2 -2
- package/build-module/hooks/border.js +10 -5
- package/build-module/hooks/border.js.map +3 -3
- package/build-module/hooks/color.js +31 -9
- package/build-module/hooks/color.js.map +3 -3
- package/build-module/hooks/content-lock-ui.js +4 -5
- package/build-module/hooks/content-lock-ui.js.map +2 -2
- package/build-module/hooks/dimensions.js +9 -4
- package/build-module/hooks/dimensions.js.map +2 -2
- package/build-module/hooks/fit-text.js +18 -66
- package/build-module/hooks/fit-text.js.map +2 -2
- package/build-module/hooks/font-size.js +5 -2
- package/build-module/hooks/font-size.js.map +2 -2
- package/build-module/hooks/layout.js +4 -1
- package/build-module/hooks/layout.js.map +2 -2
- package/build-module/hooks/spacing-visualizer.js +5 -0
- package/build-module/hooks/spacing-visualizer.js.map +2 -2
- package/build-module/hooks/typography.js +23 -14
- package/build-module/hooks/typography.js.map +3 -3
- package/build-module/store/private-selectors.js +20 -1
- package/build-module/store/private-selectors.js.map +2 -2
- package/build-module/store/reducer.js +4 -0
- package/build-module/store/reducer.js.map +2 -2
- package/build-module/store/selectors.js +9 -3
- package/build-module/store/selectors.js.map +2 -2
- package/build-module/utils/fit-text-frontend.js +1 -0
- package/build-module/utils/fit-text-frontend.js.map +2 -2
- package/build-module/utils/fit-text-utils.js +1 -1
- package/build-module/utils/fit-text-utils.js.map +1 -1
- package/build-style/style-rtl.css +31 -71
- package/build-style/style.css +31 -71
- package/package.json +37 -37
- package/src/components/block-card/index.js +95 -38
- package/src/components/block-card/style.scss +17 -1
- package/src/components/block-inspector/edit-contents.js +64 -0
- package/src/components/block-inspector/index.js +35 -13
- package/src/components/block-inspector/style.scss +6 -3
- package/src/components/block-list/index.js +11 -9
- package/src/components/block-switcher/index.js +51 -180
- package/src/components/block-switcher/style.scss +0 -70
- package/src/components/block-switcher/test/index.js +17 -18
- package/src/components/block-toolbar/block-toolbar-icon.js +173 -0
- package/src/components/block-toolbar/index.js +50 -52
- package/src/components/block-toolbar/pattern-overrides-dropdown.js +99 -0
- package/src/components/block-toolbar/style.scss +21 -21
- package/src/components/block-toolbar/test/block-toolbar-icon.js +182 -0
- package/src/components/block-tools/index.js +11 -1
- package/src/components/border-radius-control/test/utils.js +90 -0
- package/src/components/border-radius-control/utils.js +7 -3
- package/src/components/content-lock/modify-content-lock-menu-item.js +9 -3
- package/src/components/global-styles/border-panel.js +11 -7
- package/src/components/global-styles/color-panel.js +32 -26
- package/src/components/global-styles/typography-panel.js +2 -1
- package/src/components/inserter/media-tab/media-tab.js +7 -1
- package/src/components/inspector-controls-tabs/index.js +1 -0
- package/src/components/inspector-controls-tabs/styles-tab.js +58 -0
- package/src/components/inspector-controls-tabs/use-inspector-controls-tabs.js +5 -1
- package/src/components/keyboard-shortcuts/index.js +9 -0
- package/src/components/rich-text/index.js +1 -0
- package/src/hooks/border.js +12 -6
- package/src/hooks/color.js +40 -13
- package/src/hooks/content-lock-ui.js +9 -6
- package/src/hooks/dimensions.js +25 -17
- package/src/hooks/fit-text.js +23 -84
- package/src/hooks/font-size.js +7 -2
- package/src/hooks/layout.js +11 -7
- package/src/hooks/spacing-visualizer.js +9 -1
- package/src/hooks/typography.js +24 -18
- package/src/store/private-selectors.js +26 -1
- package/src/store/reducer.js +6 -0
- package/src/store/selectors.js +17 -3
- package/src/utils/fit-text-frontend.js +1 -0
- package/src/utils/fit-text-utils.js +1 -1
- package/tsconfig.tsbuildinfo +1 -1
- package/build/components/block-inspector/edit-contents-button.js +0 -61
- package/build/components/block-inspector/edit-contents-button.js.map +0 -7
- package/build-module/components/block-inspector/edit-contents-button.js +0 -40
- package/build-module/components/block-inspector/edit-contents-button.js.map +0 -7
- package/src/components/block-inspector/edit-contents-button.js +0 -46
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/hooks/color.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { getBlockSupport } from '@wordpress/blocks';\nimport { useMemo, Platform, useCallback } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetColorClassName,\n\tgetColorObjectByAttributeValues,\n} from '../components/colors';\nimport { __experimentalGetGradientClass } from '../components/gradients';\nimport {\n\tcleanEmptyObject,\n\ttransformStyles,\n\tshouldSkipSerialization,\n} from './utils';\nimport { getBackgroundImageClasses } from './background';\nimport { useSettings } from '../components/use-settings';\nimport InspectorControls from '../components/inspector-controls';\nimport {\n\tuseHasColorPanel,\n\tdefault as StylesColorPanel,\n} from '../components/global-styles/color-panel';\nimport BlockColorContrastChecker from './contrast-checker';\nimport { store as blockEditorStore } from '../store';\n\nexport const COLOR_SUPPORT_KEY = 'color';\n\nconst hasColorSupport = ( blockNameOrType ) => {\n\tconst colorSupport = getBlockSupport( blockNameOrType, COLOR_SUPPORT_KEY );\n\treturn (\n\t\tcolorSupport &&\n\t\t( colorSupport.link === true ||\n\t\t\tcolorSupport.gradient === true ||\n\t\t\tcolorSupport.background !== false ||\n\t\t\tcolorSupport.text !== false )\n\t);\n};\n\nconst hasLinkColorSupport = ( blockType ) => {\n\tif ( Platform.OS !== 'web' ) {\n\t\treturn false;\n\t}\n\n\tconst colorSupport = getBlockSupport( blockType, COLOR_SUPPORT_KEY );\n\n\treturn (\n\t\tcolorSupport !== null &&\n\t\ttypeof colorSupport === 'object' &&\n\t\t!! colorSupport.link\n\t);\n};\n\nconst hasGradientSupport = ( blockNameOrType ) => {\n\tconst colorSupport = getBlockSupport( blockNameOrType, COLOR_SUPPORT_KEY );\n\n\treturn (\n\t\tcolorSupport !== null &&\n\t\ttypeof colorSupport === 'object' &&\n\t\t!! colorSupport.gradients\n\t);\n};\n\nconst hasBackgroundColorSupport = ( blockType ) => {\n\tconst colorSupport = getBlockSupport( blockType, COLOR_SUPPORT_KEY );\n\n\treturn colorSupport && colorSupport.background !== false;\n};\n\nconst hasTextColorSupport = ( blockType ) => {\n\tconst colorSupport = getBlockSupport( blockType, COLOR_SUPPORT_KEY );\n\n\treturn colorSupport && colorSupport.text !== false;\n};\n\n/**\n * Filters registered block settings, extending attributes to include\n * `backgroundColor` and `textColor` attribute.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nfunction addAttributes( settings ) {\n\tif ( ! hasColorSupport( settings ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify their own attribute definition with default values if needed.\n\tif ( ! settings.attributes.backgroundColor ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tbackgroundColor: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\tif ( ! settings.attributes.textColor ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\ttextColor: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\n\tif ( hasGradientSupport( settings ) && ! settings.attributes.gradient ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tgradient: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\n\treturn settings;\n}\n\n/**\n * Override props assigned to save component to inject colors classnames.\n *\n * @param {Object} props Additional props applied to save element.\n * @param {Object|string} blockNameOrType Block type.\n * @param {Object} attributes Block attributes.\n *\n * @return {Object} Filtered props applied to save element.\n */\nexport function addSaveProps( props, blockNameOrType, attributes ) {\n\tif (\n\t\t! hasColorSupport( blockNameOrType ) ||\n\t\tshouldSkipSerialization( blockNameOrType, COLOR_SUPPORT_KEY )\n\t) {\n\t\treturn props;\n\t}\n\n\tconst hasGradient = hasGradientSupport( blockNameOrType );\n\n\t// I'd have preferred to avoid the \"style\" attribute usage here\n\tconst { backgroundColor, textColor, gradient, style } = attributes;\n\n\tconst shouldSerialize = ( feature ) =>\n\t\t! shouldSkipSerialization(\n\t\t\tblockNameOrType,\n\t\t\tCOLOR_SUPPORT_KEY,\n\t\t\tfeature\n\t\t);\n\n\t// Primary color classes must come before the `has-text-color`,\n\t// `has-background` and `has-link-color` classes to maintain backwards\n\t// compatibility and avoid block invalidations.\n\tconst textClass = shouldSerialize( 'text' )\n\t\t? getColorClassName( 'color', textColor )\n\t\t: undefined;\n\n\tconst gradientClass = shouldSerialize( 'gradients' )\n\t\t? __experimentalGetGradientClass( gradient )\n\t\t: undefined;\n\n\tconst backgroundClass = shouldSerialize( 'background' )\n\t\t? getColorClassName( 'background-color', backgroundColor )\n\t\t: undefined;\n\n\tconst serializeHasBackground =\n\t\tshouldSerialize( 'background' ) || shouldSerialize( 'gradients' );\n\tconst hasBackground =\n\t\tbackgroundColor ||\n\t\tstyle?.color?.background ||\n\t\t( hasGradient && ( gradient || style?.color?.gradient ) );\n\n\tconst newClassName = clsx( props.className, textClass, gradientClass, {\n\t\t// Don't apply the background class if there's a custom gradient.\n\t\t[ backgroundClass ]:\n\t\t\t( ! hasGradient || ! style?.color?.gradient ) && !! backgroundClass,\n\t\t'has-text-color':\n\t\t\tshouldSerialize( 'text' ) && ( textColor || style?.color?.text ),\n\t\t'has-background': serializeHasBackground && hasBackground,\n\t\t'has-link-color':\n\t\t\tshouldSerialize( 'link' ) && style?.elements?.link?.color,\n\t} );\n\tprops.className = newClassName ? newClassName : undefined;\n\n\treturn props;\n}\n\nfunction styleToAttributes( style ) {\n\tconst textColorValue = style?.color?.text;\n\tconst textColorSlug = textColorValue?.startsWith( 'var:preset|color|' )\n\t\t? textColorValue.substring( 'var:preset|color|'.length )\n\t\t: undefined;\n\tconst backgroundColorValue = style?.color?.background;\n\tconst backgroundColorSlug = backgroundColorValue?.startsWith(\n\t\t'var:preset|color|'\n\t)\n\t\t? backgroundColorValue.substring( 'var:preset|color|'.length )\n\t\t: undefined;\n\tconst gradientValue = style?.color?.gradient;\n\tconst gradientSlug = gradientValue?.startsWith( 'var:preset|gradient|' )\n\t\t? gradientValue.substring( 'var:preset|gradient|'.length )\n\t\t: undefined;\n\tconst updatedStyle = { ...style };\n\tupdatedStyle.color = {\n\t\t...updatedStyle.color,\n\t\ttext: textColorSlug ? undefined : textColorValue,\n\t\tbackground: backgroundColorSlug ? undefined : backgroundColorValue,\n\t\tgradient: gradientSlug ? undefined : gradientValue,\n\t};\n\treturn {\n\t\tstyle: cleanEmptyObject( updatedStyle ),\n\t\ttextColor: textColorSlug,\n\t\tbackgroundColor: backgroundColorSlug,\n\t\tgradient: gradientSlug,\n\t};\n}\n\nfunction attributesToStyle( attributes ) {\n\treturn {\n\t\t...attributes.style,\n\t\tcolor: {\n\t\t\t...attributes.style?.color,\n\t\t\ttext: attributes.textColor\n\t\t\t\t? 'var:preset|color|' + attributes.textColor\n\t\t\t\t: attributes.style?.color?.text,\n\t\t\tbackground: attributes.backgroundColor\n\t\t\t\t? 'var:preset|color|' + attributes.backgroundColor\n\t\t\t\t: attributes.style?.color?.background,\n\t\t\tgradient: attributes.gradient\n\t\t\t\t? 'var:preset|gradient|' + attributes.gradient\n\t\t\t\t: attributes.style?.color?.gradient,\n\t\t},\n\t};\n}\n\nfunction ColorInspectorControl( { children, resetAllFilter } ) {\n\tconst attributesResetAllFilter = useCallback(\n\t\t( attributes ) => {\n\t\t\tconst existingStyle = attributesToStyle( attributes );\n\t\t\tconst updatedStyle = resetAllFilter( existingStyle );\n\t\t\treturn {\n\t\t\t\t...attributes,\n\t\t\t\t...styleToAttributes( updatedStyle ),\n\t\t\t};\n\t\t},\n\t\t[ resetAllFilter ]\n\t);\n\n\treturn (\n\t\t<InspectorControls\n\t\t\tgroup=\"color\"\n\t\t\tresetAllFilter={ attributesResetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</InspectorControls>\n\t);\n}\n\nexport function ColorEdit( { clientId, name, setAttributes, settings } ) {\n\tconst isEnabled = useHasColorPanel( settings );\n\tfunction selector( select ) {\n\t\tconst { style, textColor, backgroundColor, gradient } =\n\t\t\tselect( blockEditorStore ).getBlockAttributes( clientId ) || {};\n\t\treturn { style, textColor, backgroundColor, gradient };\n\t}\n\tconst { style, textColor, backgroundColor, gradient } = useSelect(\n\t\tselector,\n\t\t[ clientId ]\n\t);\n\tconst value = useMemo( () => {\n\t\treturn attributesToStyle( {\n\t\t\tstyle,\n\t\t\ttextColor,\n\t\t\tbackgroundColor,\n\t\t\tgradient,\n\t\t} );\n\t}, [ style, textColor, backgroundColor, gradient ] );\n\n\tconst onChange = ( newStyle ) => {\n\t\tsetAttributes( styleToAttributes( newStyle ) );\n\t};\n\n\tif ( ! isEnabled ) {\n\t\treturn null;\n\t}\n\n\tconst defaultControls = getBlockSupport( name, [\n\t\tCOLOR_SUPPORT_KEY,\n\t\t'__experimentalDefaultControls',\n\t] );\n\n\tconst enableContrastChecking =\n\t\tPlatform.OS === 'web' &&\n\t\t! value?.color?.gradient &&\n\t\t( settings?.color?.text || settings?.color?.link ) &&\n\t\t// Contrast checking is enabled by default.\n\t\t// Deactivating it requires `enableContrastChecker` to have\n\t\t// an explicit value of `false`.\n\t\tfalse !==\n\t\t\tgetBlockSupport( name, [\n\t\t\t\tCOLOR_SUPPORT_KEY,\n\t\t\t\t'enableContrastChecker',\n\t\t\t] );\n\n\treturn (\n\t\t<StylesColorPanel\n\t\t\tas={ ColorInspectorControl }\n\t\t\tpanelId={ clientId }\n\t\t\tsettings={ settings }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tdefaultControls={ defaultControls }\n\t\t\tenableContrastChecker={\n\t\t\t\tfalse !==\n\t\t\t\tgetBlockSupport( name, [\n\t\t\t\t\tCOLOR_SUPPORT_KEY,\n\t\t\t\t\t'enableContrastChecker',\n\t\t\t\t] )\n\t\t\t}\n\t\t>\n\t\t\t{ enableContrastChecking && (\n\t\t\t\t<BlockColorContrastChecker clientId={ clientId } />\n\t\t\t) }\n\t\t</StylesColorPanel>\n\t);\n}\n\nfunction useBlockProps( {\n\tname,\n\tbackgroundColor,\n\ttextColor,\n\tgradient,\n\tstyle,\n} ) {\n\tconst [ userPalette, themePalette, defaultPalette ] = useSettings(\n\t\t'color.palette.custom',\n\t\t'color.palette.theme',\n\t\t'color.palette.default'\n\t);\n\n\tconst colors = useMemo(\n\t\t() => [\n\t\t\t...( userPalette || [] ),\n\t\t\t...( themePalette || [] ),\n\t\t\t...( defaultPalette || [] ),\n\t\t],\n\t\t[ userPalette, themePalette, defaultPalette ]\n\t);\n\tif (\n\t\t! hasColorSupport( name ) ||\n\t\tshouldSkipSerialization( name, COLOR_SUPPORT_KEY )\n\t) {\n\t\treturn {};\n\t}\n\tconst extraStyles = {};\n\n\tif (\n\t\ttextColor &&\n\t\t! shouldSkipSerialization( name, COLOR_SUPPORT_KEY, 'text' )\n\t) {\n\t\textraStyles.color = getColorObjectByAttributeValues(\n\t\t\tcolors,\n\t\t\ttextColor\n\t\t)?.color;\n\t}\n\tif (\n\t\tbackgroundColor &&\n\t\t! shouldSkipSerialization( name, COLOR_SUPPORT_KEY, 'background' )\n\t) {\n\t\textraStyles.backgroundColor = getColorObjectByAttributeValues(\n\t\t\tcolors,\n\t\t\tbackgroundColor\n\t\t)?.color;\n\t}\n\n\tconst saveProps = addSaveProps( { style: extraStyles }, name, {\n\t\ttextColor,\n\t\tbackgroundColor,\n\t\tgradient,\n\t\tstyle,\n\t} );\n\n\tconst hasBackgroundValue =\n\t\tbackgroundColor ||\n\t\tstyle?.color?.background ||\n\t\tgradient ||\n\t\tstyle?.color?.gradient;\n\n\treturn {\n\t\t...saveProps,\n\t\tclassName: clsx(\n\t\t\tsaveProps.className,\n\t\t\t// Add background image classes in the editor, if not already handled by background color values.\n\t\t\t! hasBackgroundValue && getBackgroundImageClasses( style )\n\t\t),\n\t};\n}\n\nexport default {\n\tuseBlockProps,\n\taddSaveProps,\n\tattributeKeys: [ 'backgroundColor', 'textColor', 'gradient', 'style' ],\n\thasSupport: hasColorSupport,\n};\n\nconst MIGRATION_PATHS = {\n\tlinkColor: [ [ 'style', 'elements', 'link', 'color', 'text' ] ],\n\ttextColor: [ [ 'textColor' ], [ 'style', 'color', 'text' ] ],\n\tbackgroundColor: [\n\t\t[ 'backgroundColor' ],\n\t\t[ 'style', 'color', 'background' ],\n\t],\n\tgradient: [ [ 'gradient' ], [ 'style', 'color', 'gradient' ] ],\n};\n\nexport function addTransforms( result, source, index, results ) {\n\tconst destinationBlockType = result.name;\n\tconst activeSupports = {\n\t\tlinkColor: hasLinkColorSupport( destinationBlockType ),\n\t\ttextColor: hasTextColorSupport( destinationBlockType ),\n\t\tbackgroundColor: hasBackgroundColorSupport( destinationBlockType ),\n\t\tgradient: hasGradientSupport( destinationBlockType ),\n\t};\n\treturn transformStyles(\n\t\tactiveSupports,\n\t\tMIGRATION_PATHS,\n\t\tresult,\n\t\tsource,\n\t\tindex,\n\t\tresults\n\t);\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/color/addAttribute',\n\taddAttributes\n);\n\naddFilter(\n\t'blocks.switchToBlockType.transformedBlock',\n\t'core/color/addTransforms',\n\taddTransforms\n);\n"],
|
|
5
|
-
"mappings": "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
|
|
6
|
-
"names": [
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { getBlockSupport } from '@wordpress/blocks';\nimport { useMemo, Platform, useCallback } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetColorClassName,\n\tgetColorObjectByAttributeValues,\n} from '../components/colors';\nimport { __experimentalGetGradientClass } from '../components/gradients';\nimport {\n\tcleanEmptyObject,\n\ttransformStyles,\n\tshouldSkipSerialization,\n} from './utils';\nimport { getBackgroundImageClasses } from './background';\nimport { useSettings } from '../components/use-settings';\nimport InspectorControls from '../components/inspector-controls';\nimport {\n\tuseHasColorPanel,\n\tdefault as StylesColorPanel,\n} from '../components/global-styles/color-panel';\nimport BlockColorContrastChecker from './contrast-checker';\nimport { store as blockEditorStore } from '../store';\n\nexport const COLOR_SUPPORT_KEY = 'color';\n\nconst hasColorSupport = ( blockNameOrType ) => {\n\tconst colorSupport = getBlockSupport( blockNameOrType, COLOR_SUPPORT_KEY );\n\treturn (\n\t\tcolorSupport &&\n\t\t( colorSupport.link === true ||\n\t\t\tcolorSupport.gradient === true ||\n\t\t\tcolorSupport.background !== false ||\n\t\t\tcolorSupport.text !== false )\n\t);\n};\n\nconst hasLinkColorSupport = ( blockType ) => {\n\tif ( Platform.OS !== 'web' ) {\n\t\treturn false;\n\t}\n\n\tconst colorSupport = getBlockSupport( blockType, COLOR_SUPPORT_KEY );\n\n\treturn (\n\t\tcolorSupport !== null &&\n\t\ttypeof colorSupport === 'object' &&\n\t\t!! colorSupport.link\n\t);\n};\n\nconst hasGradientSupport = ( blockNameOrType ) => {\n\tconst colorSupport = getBlockSupport( blockNameOrType, COLOR_SUPPORT_KEY );\n\n\treturn (\n\t\tcolorSupport !== null &&\n\t\ttypeof colorSupport === 'object' &&\n\t\t!! colorSupport.gradients\n\t);\n};\n\nconst hasBackgroundColorSupport = ( blockType ) => {\n\tconst colorSupport = getBlockSupport( blockType, COLOR_SUPPORT_KEY );\n\n\treturn colorSupport && colorSupport.background !== false;\n};\n\nconst hasTextColorSupport = ( blockType ) => {\n\tconst colorSupport = getBlockSupport( blockType, COLOR_SUPPORT_KEY );\n\n\treturn colorSupport && colorSupport.text !== false;\n};\n\n/**\n * Filters registered block settings, extending attributes to include\n * `backgroundColor` and `textColor` attribute.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nfunction addAttributes( settings ) {\n\tif ( ! hasColorSupport( settings ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify their own attribute definition with default values if needed.\n\tif ( ! settings.attributes.backgroundColor ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tbackgroundColor: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\tif ( ! settings.attributes.textColor ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\ttextColor: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\n\tif ( hasGradientSupport( settings ) && ! settings.attributes.gradient ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tgradient: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\n\treturn settings;\n}\n\n/**\n * Override props assigned to save component to inject colors classnames.\n *\n * @param {Object} props Additional props applied to save element.\n * @param {Object|string} blockNameOrType Block type.\n * @param {Object} attributes Block attributes.\n *\n * @return {Object} Filtered props applied to save element.\n */\nexport function addSaveProps( props, blockNameOrType, attributes ) {\n\tif (\n\t\t! hasColorSupport( blockNameOrType ) ||\n\t\tshouldSkipSerialization( blockNameOrType, COLOR_SUPPORT_KEY )\n\t) {\n\t\treturn props;\n\t}\n\n\tconst hasGradient = hasGradientSupport( blockNameOrType );\n\n\t// I'd have preferred to avoid the \"style\" attribute usage here\n\tconst { backgroundColor, textColor, gradient, style } = attributes;\n\n\tconst shouldSerialize = ( feature ) =>\n\t\t! shouldSkipSerialization(\n\t\t\tblockNameOrType,\n\t\t\tCOLOR_SUPPORT_KEY,\n\t\t\tfeature\n\t\t);\n\n\t// Primary color classes must come before the `has-text-color`,\n\t// `has-background` and `has-link-color` classes to maintain backwards\n\t// compatibility and avoid block invalidations.\n\tconst textClass = shouldSerialize( 'text' )\n\t\t? getColorClassName( 'color', textColor )\n\t\t: undefined;\n\n\tconst gradientClass = shouldSerialize( 'gradients' )\n\t\t? __experimentalGetGradientClass( gradient )\n\t\t: undefined;\n\n\tconst backgroundClass = shouldSerialize( 'background' )\n\t\t? getColorClassName( 'background-color', backgroundColor )\n\t\t: undefined;\n\n\tconst serializeHasBackground =\n\t\tshouldSerialize( 'background' ) || shouldSerialize( 'gradients' );\n\tconst hasBackground =\n\t\tbackgroundColor ||\n\t\tstyle?.color?.background ||\n\t\t( hasGradient && ( gradient || style?.color?.gradient ) );\n\n\tconst newClassName = clsx( props.className, textClass, gradientClass, {\n\t\t// Don't apply the background class if there's a custom gradient.\n\t\t[ backgroundClass ]:\n\t\t\t( ! hasGradient || ! style?.color?.gradient ) && !! backgroundClass,\n\t\t'has-text-color':\n\t\t\tshouldSerialize( 'text' ) && ( textColor || style?.color?.text ),\n\t\t'has-background': serializeHasBackground && hasBackground,\n\t\t'has-link-color':\n\t\t\tshouldSerialize( 'link' ) && style?.elements?.link?.color,\n\t} );\n\tprops.className = newClassName ? newClassName : undefined;\n\n\treturn props;\n}\n\nfunction styleToAttributes( style ) {\n\tconst textColorValue = style?.color?.text;\n\tconst textColorSlug = textColorValue?.startsWith( 'var:preset|color|' )\n\t\t? textColorValue.substring( 'var:preset|color|'.length )\n\t\t: undefined;\n\tconst backgroundColorValue = style?.color?.background;\n\tconst backgroundColorSlug = backgroundColorValue?.startsWith(\n\t\t'var:preset|color|'\n\t)\n\t\t? backgroundColorValue.substring( 'var:preset|color|'.length )\n\t\t: undefined;\n\tconst gradientValue = style?.color?.gradient;\n\tconst gradientSlug = gradientValue?.startsWith( 'var:preset|gradient|' )\n\t\t? gradientValue.substring( 'var:preset|gradient|'.length )\n\t\t: undefined;\n\tconst updatedStyle = { ...style };\n\tupdatedStyle.color = {\n\t\t...updatedStyle.color,\n\t\ttext: textColorSlug ? undefined : textColorValue,\n\t\tbackground: backgroundColorSlug ? undefined : backgroundColorValue,\n\t\tgradient: gradientSlug ? undefined : gradientValue,\n\t};\n\treturn {\n\t\tstyle: cleanEmptyObject( updatedStyle ),\n\t\ttextColor: textColorSlug,\n\t\tbackgroundColor: backgroundColorSlug,\n\t\tgradient: gradientSlug,\n\t};\n}\n\nfunction attributesToStyle( attributes ) {\n\treturn {\n\t\t...attributes.style,\n\t\tcolor: {\n\t\t\t...attributes.style?.color,\n\t\t\ttext: attributes.textColor\n\t\t\t\t? 'var:preset|color|' + attributes.textColor\n\t\t\t\t: attributes.style?.color?.text,\n\t\t\tbackground: attributes.backgroundColor\n\t\t\t\t? 'var:preset|color|' + attributes.backgroundColor\n\t\t\t\t: attributes.style?.color?.background,\n\t\t\tgradient: attributes.gradient\n\t\t\t\t? 'var:preset|gradient|' + attributes.gradient\n\t\t\t\t: attributes.style?.color?.gradient,\n\t\t},\n\t};\n}\n\nfunction ColorInspectorControl( { children, resetAllFilter } ) {\n\tconst attributesResetAllFilter = useCallback(\n\t\t( attributes ) => {\n\t\t\tconst existingStyle = attributesToStyle( attributes );\n\t\t\tconst updatedStyle = resetAllFilter( existingStyle );\n\t\t\treturn {\n\t\t\t\t...attributes,\n\t\t\t\t...styleToAttributes( updatedStyle ),\n\t\t\t};\n\t\t},\n\t\t[ resetAllFilter ]\n\t);\n\n\treturn (\n\t\t<InspectorControls\n\t\t\tgroup=\"color\"\n\t\t\tresetAllFilter={ attributesResetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</InspectorControls>\n\t);\n}\n\nexport function ColorEdit( {\n\tclientId,\n\tname,\n\tsetAttributes,\n\tsettings,\n\tasWrapper,\n\tlabel,\n\tdefaultControls,\n} ) {\n\tconst isEnabled = useHasColorPanel( settings );\n\n\tconst { style, textColor, backgroundColor, gradient } = useSelect(\n\t\t( select ) => {\n\t\t\t// Early return to avoid subscription when disabled\n\t\t\tif ( ! isEnabled ) {\n\t\t\t\treturn {};\n\t\t\t}\n\t\t\tconst {\n\t\t\t\tstyle: _style,\n\t\t\t\ttextColor: _textColor,\n\t\t\t\tbackgroundColor: _backgroundColor,\n\t\t\t\tgradient: _gradient,\n\t\t\t} = select( blockEditorStore ).getBlockAttributes( clientId ) || {};\n\t\t\treturn {\n\t\t\t\tstyle: _style,\n\t\t\t\ttextColor: _textColor,\n\t\t\t\tbackgroundColor: _backgroundColor,\n\t\t\t\tgradient: _gradient,\n\t\t\t};\n\t\t},\n\t\t[ clientId, isEnabled ]\n\t);\n\tconst value = useMemo( () => {\n\t\treturn attributesToStyle( {\n\t\t\tstyle,\n\t\t\ttextColor,\n\t\t\tbackgroundColor,\n\t\t\tgradient,\n\t\t} );\n\t}, [ style, textColor, backgroundColor, gradient ] );\n\n\tconst onChange = ( newStyle ) => {\n\t\tsetAttributes( styleToAttributes( newStyle ) );\n\t};\n\n\tif ( ! isEnabled ) {\n\t\treturn null;\n\t}\n\n\tdefaultControls = defaultControls\n\t\t? defaultControls\n\t\t: getBlockSupport( name, [\n\t\t\t\tCOLOR_SUPPORT_KEY,\n\t\t\t\t'__experimentalDefaultControls',\n\t\t ] );\n\n\tconst enableContrastChecking =\n\t\tPlatform.OS === 'web' &&\n\t\t! value?.color?.gradient &&\n\t\t( settings?.color?.text || settings?.color?.link ) &&\n\t\t// Contrast checking is enabled by default.\n\t\t// Deactivating it requires `enableContrastChecker` to have\n\t\t// an explicit value of `false`.\n\t\tfalse !==\n\t\t\tgetBlockSupport( name, [\n\t\t\t\tCOLOR_SUPPORT_KEY,\n\t\t\t\t'enableContrastChecker',\n\t\t\t] );\n\n\t// Use provided wrapper or default to ColorInspectorControl\n\tconst Wrapper = asWrapper || ColorInspectorControl;\n\n\treturn (\n\t\t<StylesColorPanel\n\t\t\tas={ Wrapper }\n\t\t\tpanelId={ clientId }\n\t\t\tsettings={ settings }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tdefaultControls={ defaultControls }\n\t\t\tlabel={ label }\n\t\t\tenableContrastChecker={\n\t\t\t\tfalse !==\n\t\t\t\tgetBlockSupport( name, [\n\t\t\t\t\tCOLOR_SUPPORT_KEY,\n\t\t\t\t\t'enableContrastChecker',\n\t\t\t\t] )\n\t\t\t}\n\t\t>\n\t\t\t{ enableContrastChecking && (\n\t\t\t\t<BlockColorContrastChecker clientId={ clientId } />\n\t\t\t) }\n\t\t</StylesColorPanel>\n\t);\n}\n\nfunction useBlockProps( {\n\tname,\n\tbackgroundColor,\n\ttextColor,\n\tgradient,\n\tstyle,\n} ) {\n\tconst [ userPalette, themePalette, defaultPalette ] = useSettings(\n\t\t'color.palette.custom',\n\t\t'color.palette.theme',\n\t\t'color.palette.default'\n\t);\n\n\tconst colors = useMemo(\n\t\t() => [\n\t\t\t...( userPalette || [] ),\n\t\t\t...( themePalette || [] ),\n\t\t\t...( defaultPalette || [] ),\n\t\t],\n\t\t[ userPalette, themePalette, defaultPalette ]\n\t);\n\tif (\n\t\t! hasColorSupport( name ) ||\n\t\tshouldSkipSerialization( name, COLOR_SUPPORT_KEY )\n\t) {\n\t\treturn {};\n\t}\n\tconst extraStyles = {};\n\n\tif (\n\t\ttextColor &&\n\t\t! shouldSkipSerialization( name, COLOR_SUPPORT_KEY, 'text' )\n\t) {\n\t\textraStyles.color = getColorObjectByAttributeValues(\n\t\t\tcolors,\n\t\t\ttextColor\n\t\t)?.color;\n\t}\n\tif (\n\t\tbackgroundColor &&\n\t\t! shouldSkipSerialization( name, COLOR_SUPPORT_KEY, 'background' )\n\t) {\n\t\textraStyles.backgroundColor = getColorObjectByAttributeValues(\n\t\t\tcolors,\n\t\t\tbackgroundColor\n\t\t)?.color;\n\t}\n\n\tconst saveProps = addSaveProps( { style: extraStyles }, name, {\n\t\ttextColor,\n\t\tbackgroundColor,\n\t\tgradient,\n\t\tstyle,\n\t} );\n\n\tconst hasBackgroundValue =\n\t\tbackgroundColor ||\n\t\tstyle?.color?.background ||\n\t\tgradient ||\n\t\tstyle?.color?.gradient;\n\n\treturn {\n\t\t...saveProps,\n\t\tclassName: clsx(\n\t\t\tsaveProps.className,\n\t\t\t// Add background image classes in the editor, if not already handled by background color values.\n\t\t\t! hasBackgroundValue && getBackgroundImageClasses( style )\n\t\t),\n\t};\n}\n\nexport default {\n\tuseBlockProps,\n\taddSaveProps,\n\tattributeKeys: [ 'backgroundColor', 'textColor', 'gradient', 'style' ],\n\thasSupport: hasColorSupport,\n};\n\nconst MIGRATION_PATHS = {\n\tlinkColor: [ [ 'style', 'elements', 'link', 'color', 'text' ] ],\n\ttextColor: [ [ 'textColor' ], [ 'style', 'color', 'text' ] ],\n\tbackgroundColor: [\n\t\t[ 'backgroundColor' ],\n\t\t[ 'style', 'color', 'background' ],\n\t],\n\tgradient: [ [ 'gradient' ], [ 'style', 'color', 'gradient' ] ],\n};\n\nexport function addTransforms( result, source, index, results ) {\n\tconst destinationBlockType = result.name;\n\tconst activeSupports = {\n\t\tlinkColor: hasLinkColorSupport( destinationBlockType ),\n\t\ttextColor: hasTextColorSupport( destinationBlockType ),\n\t\tbackgroundColor: hasBackgroundColorSupport( destinationBlockType ),\n\t\tgradient: hasGradientSupport( destinationBlockType ),\n\t};\n\treturn transformStyles(\n\t\tactiveSupports,\n\t\tMIGRATION_PATHS,\n\t\tresult,\n\t\tsource,\n\t\tindex,\n\t\tresults\n\t);\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/color/addAttribute',\n\taddAttributes\n);\n\naddFilter(\n\t'blocks.switchToBlockType.transformedBlock',\n\t'core/color/addTransforms',\n\taddTransforms\n);\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|
|
@@ -28,13 +28,12 @@ function ContentLockControlsPure({ clientId }) {
|
|
|
28
28
|
);
|
|
29
29
|
const isContentLocked = !isLockedByParent && templateLock === "contentOnly";
|
|
30
30
|
const stopEditingAsBlockCallback = useCallback(() => {
|
|
31
|
-
stopEditingContentOnlySection(
|
|
32
|
-
}, [
|
|
33
|
-
if (!isContentLocked && !isEditingContentOnlySection) {
|
|
31
|
+
stopEditingContentOnlySection();
|
|
32
|
+
}, [stopEditingContentOnlySection]);
|
|
33
|
+
if (window?.__experimentalContentOnlyPatternInsertion || !isContentLocked && !isEditingContentOnlySection) {
|
|
34
34
|
return null;
|
|
35
35
|
}
|
|
36
|
-
|
|
37
|
-
return showDoneButton && /* @__PURE__ */ jsx(BlockControls, { group: "other", children: /* @__PURE__ */ jsx(ToolbarButton, { onClick: stopEditingAsBlockCallback, children: __("Done") }) });
|
|
36
|
+
return isEditingContentOnlySection && /* @__PURE__ */ jsx(BlockControls, { group: "other", children: /* @__PURE__ */ jsx(ToolbarButton, { onClick: stopEditingAsBlockCallback, children: __("Done") }) });
|
|
38
37
|
}
|
|
39
38
|
var content_lock_ui_default = {
|
|
40
39
|
edit: ContentLockControlsPure,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/hooks/content-lock-ui.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { ToolbarButton } from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../store';\nimport { BlockControls } from '../components';\nimport { unlock } from '../lock-unlock';\n\n// The implementation of content locking is mainly in this file, although the mechanism\n// to stop editing a content only section when an outside block is selected is in the component\n// `StopEditingContentOnlySectionOnOutsideSelect` at block-editor/src/components/block-list/index.js.\n// Besides the components on this file and the file referenced above the implementation\n// also includes artifacts on the store (actions, reducers, and selector).\n\nfunction ContentLockControlsPure( { clientId } ) {\n\tconst { templateLock, isLockedByParent, isEditingContentOnlySection } =\n\t\tuseSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst {\n\t\t\t\t\tgetContentLockingParent,\n\t\t\t\t\tgetTemplateLock,\n\t\t\t\t\tgetEditedContentOnlySection,\n\t\t\t\t} = unlock( select( blockEditorStore ) );\n\t\t\t\treturn {\n\t\t\t\t\ttemplateLock: getTemplateLock( clientId ),\n\t\t\t\t\tisLockedByParent: !! getContentLockingParent( clientId ),\n\t\t\t\t\tisEditingContentOnlySection:\n\t\t\t\t\t\tgetEditedContentOnlySection() === clientId,\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ clientId ]\n\t\t);\n\n\tconst { stopEditingContentOnlySection } = unlock(\n\t\tuseDispatch( blockEditorStore )\n\t);\n\tconst isContentLocked =\n\t\t! isLockedByParent && templateLock === 'contentOnly';\n\n\tconst stopEditingAsBlockCallback = useCallback( () => {\n\t\tstopEditingContentOnlySection(
|
|
5
|
-
"mappings": ";AAGA,SAAS,qBAAqB;AAC9B,SAAS,aAAa,iBAAiB;AACvC,SAAS,UAAU;AACnB,SAAS,mBAAmB;AAK5B,SAAS,SAAS,wBAAwB;AAC1C,SAAS,qBAAqB;AAC9B,SAAS,cAAc;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { ToolbarButton } from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../store';\nimport { BlockControls } from '../components';\nimport { unlock } from '../lock-unlock';\n\n// The implementation of content locking is mainly in this file, although the mechanism\n// to stop editing a content only section when an outside block is selected is in the component\n// `StopEditingContentOnlySectionOnOutsideSelect` at block-editor/src/components/block-list/index.js.\n// Besides the components on this file and the file referenced above the implementation\n// also includes artifacts on the store (actions, reducers, and selector).\n\nfunction ContentLockControlsPure( { clientId } ) {\n\tconst { templateLock, isLockedByParent, isEditingContentOnlySection } =\n\t\tuseSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst {\n\t\t\t\t\tgetContentLockingParent,\n\t\t\t\t\tgetTemplateLock,\n\t\t\t\t\tgetEditedContentOnlySection,\n\t\t\t\t} = unlock( select( blockEditorStore ) );\n\t\t\t\treturn {\n\t\t\t\t\ttemplateLock: getTemplateLock( clientId ),\n\t\t\t\t\tisLockedByParent: !! getContentLockingParent( clientId ),\n\t\t\t\t\tisEditingContentOnlySection:\n\t\t\t\t\t\tgetEditedContentOnlySection() === clientId,\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ clientId ]\n\t\t);\n\n\tconst { stopEditingContentOnlySection } = unlock(\n\t\tuseDispatch( blockEditorStore )\n\t);\n\tconst isContentLocked =\n\t\t! isLockedByParent && templateLock === 'contentOnly';\n\n\tconst stopEditingAsBlockCallback = useCallback( () => {\n\t\tstopEditingContentOnlySection();\n\t}, [ stopEditingContentOnlySection ] );\n\n\t// Hide the Done button when the content only pattern insertion experiment is active.\n\t// This is replaced by an alternative UI in the experiment.\n\tif (\n\t\twindow?.__experimentalContentOnlyPatternInsertion ||\n\t\t( ! isContentLocked && ! isEditingContentOnlySection )\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\tisEditingContentOnlySection && (\n\t\t\t<BlockControls group=\"other\">\n\t\t\t\t<ToolbarButton onClick={ stopEditingAsBlockCallback }>\n\t\t\t\t\t{ __( 'Done' ) }\n\t\t\t\t</ToolbarButton>\n\t\t\t</BlockControls>\n\t\t)\n\t);\n}\n\nexport default {\n\tedit: ContentLockControlsPure,\n\thasSupport() {\n\t\treturn true;\n\t},\n};\n"],
|
|
5
|
+
"mappings": ";AAGA,SAAS,qBAAqB;AAC9B,SAAS,aAAa,iBAAiB;AACvC,SAAS,UAAU;AACnB,SAAS,mBAAmB;AAK5B,SAAS,SAAS,wBAAwB;AAC1C,SAAS,qBAAqB;AAC9B,SAAS,cAAc;AAiDnB;AAzCJ,SAAS,wBAAyB,EAAE,SAAS,GAAI;AAChD,QAAM,EAAE,cAAc,kBAAkB,4BAA4B,IACnE;AAAA,IACC,CAAE,WAAY;AACb,YAAM;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,MACD,IAAI,OAAQ,OAAQ,gBAAiB,CAAE;AACvC,aAAO;AAAA,QACN,cAAc,gBAAiB,QAAS;AAAA,QACxC,kBAAkB,CAAC,CAAE,wBAAyB,QAAS;AAAA,QACvD,6BACC,4BAA4B,MAAM;AAAA,MACpC;AAAA,IACD;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AAED,QAAM,EAAE,8BAA8B,IAAI;AAAA,IACzC,YAAa,gBAAiB;AAAA,EAC/B;AACA,QAAM,kBACL,CAAE,oBAAoB,iBAAiB;AAExC,QAAM,6BAA6B,YAAa,MAAM;AACrD,kCAA8B;AAAA,EAC/B,GAAG,CAAE,6BAA8B,CAAE;AAIrC,MACC,QAAQ,6CACN,CAAE,mBAAmB,CAAE,6BACxB;AACD,WAAO;AAAA,EACR;AAEA,SACC,+BACC,oBAAC,iBAAc,OAAM,SACpB,8BAAC,iBAAc,SAAU,4BACtB,aAAI,MAAO,GACd,GACD;AAGH;AAEA,IAAO,0BAAQ;AAAA,EACd,MAAM;AAAA,EACN,aAAa;AACZ,WAAO;AAAA,EACR;AACD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -56,8 +56,13 @@ function DimensionsInspectorControl({ children, resetAllFilter }) {
|
|
|
56
56
|
function DimensionsPanel({ clientId, name, setAttributes, settings }) {
|
|
57
57
|
const isEnabled = useHasDimensionsPanel(settings);
|
|
58
58
|
const value = useSelect(
|
|
59
|
-
(select) =>
|
|
60
|
-
|
|
59
|
+
(select) => {
|
|
60
|
+
if (!isEnabled) {
|
|
61
|
+
return void 0;
|
|
62
|
+
}
|
|
63
|
+
return select(blockEditorStore).getBlockAttributes(clientId)?.style;
|
|
64
|
+
},
|
|
65
|
+
[clientId, isEnabled]
|
|
61
66
|
);
|
|
62
67
|
const [visualizedProperty, setVisualizedProperty] = useVisualizer();
|
|
63
68
|
const onChange = (newStyle) => {
|
|
@@ -93,7 +98,7 @@ function DimensionsPanel({ clientId, name, setAttributes, settings }) {
|
|
|
93
98
|
onVisualize: setVisualizedProperty
|
|
94
99
|
}
|
|
95
100
|
),
|
|
96
|
-
!!settings?.spacing?.padding && /* @__PURE__ */ jsx(
|
|
101
|
+
!!settings?.spacing?.padding && visualizedProperty === "padding" && /* @__PURE__ */ jsx(
|
|
97
102
|
PaddingVisualizer,
|
|
98
103
|
{
|
|
99
104
|
forceShow: visualizedProperty === "padding",
|
|
@@ -101,7 +106,7 @@ function DimensionsPanel({ clientId, name, setAttributes, settings }) {
|
|
|
101
106
|
value
|
|
102
107
|
}
|
|
103
108
|
),
|
|
104
|
-
!!settings?.spacing?.margin && /* @__PURE__ */ jsx(
|
|
109
|
+
!!settings?.spacing?.margin && visualizedProperty === "margin" && /* @__PURE__ */ jsx(
|
|
105
110
|
MarginVisualizer,
|
|
106
111
|
{
|
|
107
112
|
forceShow: visualizedProperty === "margin",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/hooks/dimensions.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Platform, useState, useEffect, useCallback } from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { getBlockSupport } from '@wordpress/blocks';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport InspectorControls from '../components/inspector-controls';\nimport {\n\tDimensionsPanel as StylesDimensionsPanel,\n\tuseHasDimensionsPanel,\n} from '../components/global-styles';\nimport { MarginVisualizer, PaddingVisualizer } from './spacing-visualizer';\nimport { store as blockEditorStore } from '../store';\nimport { unlock } from '../lock-unlock';\nimport { cleanEmptyObject, shouldSkipSerialization } from './utils';\n\nexport const DIMENSIONS_SUPPORT_KEY = 'dimensions';\nexport const SPACING_SUPPORT_KEY = 'spacing';\nexport const ALL_SIDES = [ 'top', 'right', 'bottom', 'left' ];\nexport const AXIAL_SIDES = [ 'vertical', 'horizontal' ];\n\nfunction useVisualizer() {\n\tconst [ property, setProperty ] = useState( false );\n\tconst { hideBlockInterface, showBlockInterface } = unlock(\n\t\tuseDispatch( blockEditorStore )\n\t);\n\tuseEffect( () => {\n\t\tif ( ! property ) {\n\t\t\tshowBlockInterface();\n\t\t} else {\n\t\t\thideBlockInterface();\n\t\t}\n\t}, [ property, showBlockInterface, hideBlockInterface ] );\n\n\treturn [ property, setProperty ];\n}\n\nfunction DimensionsInspectorControl( { children, resetAllFilter } ) {\n\tconst attributesResetAllFilter = useCallback(\n\t\t( attributes ) => {\n\t\t\tconst existingStyle = attributes.style;\n\t\t\tconst updatedStyle = resetAllFilter( existingStyle );\n\t\t\treturn {\n\t\t\t\t...attributes,\n\t\t\t\tstyle: updatedStyle,\n\t\t\t};\n\t\t},\n\t\t[ resetAllFilter ]\n\t);\n\n\treturn (\n\t\t<InspectorControls\n\t\t\tgroup=\"dimensions\"\n\t\t\tresetAllFilter={ attributesResetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</InspectorControls>\n\t);\n}\n\nexport function DimensionsPanel( { clientId, name, setAttributes, settings } ) {\n\tconst isEnabled = useHasDimensionsPanel( settings );\n\tconst value = useSelect(\n\t\t( select )
|
|
5
|
-
"mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,UAAU,UAAU,WAAW,mBAAmB;AAC3D,SAAS,aAAa,iBAAiB;AACvC,SAAS,uBAAuB;AAChC,OAAO,gBAAgB;AAKvB,OAAO,uBAAuB;AAC9B;AAAA,EACC,mBAAmB;AAAA,EACnB;AAAA,OACM;AACP,SAAS,kBAAkB,yBAAyB;AACpD,SAAS,SAAS,wBAAwB;AAC1C,SAAS,cAAc;AACvB,SAAS,kBAAkB,+BAA+B;AAqCxD,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Platform, useState, useEffect, useCallback } from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { getBlockSupport } from '@wordpress/blocks';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport InspectorControls from '../components/inspector-controls';\nimport {\n\tDimensionsPanel as StylesDimensionsPanel,\n\tuseHasDimensionsPanel,\n} from '../components/global-styles';\nimport { MarginVisualizer, PaddingVisualizer } from './spacing-visualizer';\nimport { store as blockEditorStore } from '../store';\nimport { unlock } from '../lock-unlock';\nimport { cleanEmptyObject, shouldSkipSerialization } from './utils';\n\nexport const DIMENSIONS_SUPPORT_KEY = 'dimensions';\nexport const SPACING_SUPPORT_KEY = 'spacing';\nexport const ALL_SIDES = [ 'top', 'right', 'bottom', 'left' ];\nexport const AXIAL_SIDES = [ 'vertical', 'horizontal' ];\n\nfunction useVisualizer() {\n\tconst [ property, setProperty ] = useState( false );\n\tconst { hideBlockInterface, showBlockInterface } = unlock(\n\t\tuseDispatch( blockEditorStore )\n\t);\n\tuseEffect( () => {\n\t\tif ( ! property ) {\n\t\t\tshowBlockInterface();\n\t\t} else {\n\t\t\thideBlockInterface();\n\t\t}\n\t}, [ property, showBlockInterface, hideBlockInterface ] );\n\n\treturn [ property, setProperty ];\n}\n\nfunction DimensionsInspectorControl( { children, resetAllFilter } ) {\n\tconst attributesResetAllFilter = useCallback(\n\t\t( attributes ) => {\n\t\t\tconst existingStyle = attributes.style;\n\t\t\tconst updatedStyle = resetAllFilter( existingStyle );\n\t\t\treturn {\n\t\t\t\t...attributes,\n\t\t\t\tstyle: updatedStyle,\n\t\t\t};\n\t\t},\n\t\t[ resetAllFilter ]\n\t);\n\n\treturn (\n\t\t<InspectorControls\n\t\t\tgroup=\"dimensions\"\n\t\t\tresetAllFilter={ attributesResetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</InspectorControls>\n\t);\n}\n\nexport function DimensionsPanel( { clientId, name, setAttributes, settings } ) {\n\tconst isEnabled = useHasDimensionsPanel( settings );\n\tconst value = useSelect(\n\t\t( select ) => {\n\t\t\t// Early return to avoid subscription when disabled\n\t\t\tif ( ! isEnabled ) {\n\t\t\t\treturn undefined;\n\t\t\t}\n\t\t\treturn select( blockEditorStore ).getBlockAttributes( clientId )\n\t\t\t\t?.style;\n\t\t},\n\t\t[ clientId, isEnabled ]\n\t);\n\tconst [ visualizedProperty, setVisualizedProperty ] = useVisualizer();\n\tconst onChange = ( newStyle ) => {\n\t\tsetAttributes( {\n\t\t\tstyle: cleanEmptyObject( newStyle ),\n\t\t} );\n\t};\n\n\tif ( ! isEnabled ) {\n\t\treturn null;\n\t}\n\n\tconst defaultDimensionsControls = getBlockSupport( name, [\n\t\tDIMENSIONS_SUPPORT_KEY,\n\t\t'__experimentalDefaultControls',\n\t] );\n\tconst defaultSpacingControls = getBlockSupport( name, [\n\t\tSPACING_SUPPORT_KEY,\n\t\t'__experimentalDefaultControls',\n\t] );\n\tconst defaultControls = {\n\t\t...defaultDimensionsControls,\n\t\t...defaultSpacingControls,\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<StylesDimensionsPanel\n\t\t\t\tas={ DimensionsInspectorControl }\n\t\t\t\tpanelId={ clientId }\n\t\t\t\tsettings={ settings }\n\t\t\t\tvalue={ value }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tdefaultControls={ defaultControls }\n\t\t\t\tonVisualize={ setVisualizedProperty }\n\t\t\t/>\n\t\t\t{ !! settings?.spacing?.padding &&\n\t\t\t\tvisualizedProperty === 'padding' && (\n\t\t\t\t\t<PaddingVisualizer\n\t\t\t\t\t\tforceShow={ visualizedProperty === 'padding' }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t{ !! settings?.spacing?.margin &&\n\t\t\t\tvisualizedProperty === 'margin' && (\n\t\t\t\t\t<MarginVisualizer\n\t\t\t\t\t\tforceShow={ visualizedProperty === 'margin' }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t</>\n\t);\n}\n\n/**\n * Determine whether there is block support for dimensions.\n *\n * @param {string} blockName Block name.\n * @param {string} feature Background image feature to check for.\n *\n * @return {boolean} Whether there is support.\n */\nexport function hasDimensionsSupport( blockName, feature = 'any' ) {\n\tif ( Platform.OS !== 'web' ) {\n\t\treturn false;\n\t}\n\n\tconst support = getBlockSupport( blockName, DIMENSIONS_SUPPORT_KEY );\n\n\tif ( support === true ) {\n\t\treturn true;\n\t}\n\n\tif ( feature === 'any' ) {\n\t\treturn !! ( support?.aspectRatio || !! support?.minHeight );\n\t}\n\n\treturn !! support?.[ feature ];\n}\n\nexport default {\n\tuseBlockProps,\n\tattributeKeys: [ 'minHeight', 'style' ],\n\thasSupport( name ) {\n\t\treturn hasDimensionsSupport( name, 'aspectRatio' );\n\t},\n};\n\nfunction useBlockProps( { name, minHeight, style } ) {\n\tif (\n\t\t! hasDimensionsSupport( name, 'aspectRatio' ) ||\n\t\tshouldSkipSerialization( name, DIMENSIONS_SUPPORT_KEY, 'aspectRatio' )\n\t) {\n\t\treturn {};\n\t}\n\n\tconst className = clsx( {\n\t\t'has-aspect-ratio': !! style?.dimensions?.aspectRatio,\n\t} );\n\n\t// Allow dimensions-based inline style overrides to override any global styles rules that\n\t// might be set for the block, and therefore affect the display of the aspect ratio.\n\tconst inlineStyleOverrides = {};\n\n\t// Apply rules to unset incompatible styles.\n\t// Note that a set `aspectRatio` will win out if both an aspect ratio and a minHeight are set.\n\t// This is because the aspect ratio is a newer block support, so (in theory) any aspect ratio\n\t// that is set should be intentional and should override any existing minHeight. The Cover block\n\t// and dimensions controls have logic that will manually clear the aspect ratio if a minHeight\n\t// is set.\n\tif ( style?.dimensions?.aspectRatio ) {\n\t\t// To ensure the aspect ratio does not get overridden by `minHeight` unset any existing rule.\n\t\tinlineStyleOverrides.minHeight = 'unset';\n\t} else if ( minHeight || style?.dimensions?.minHeight ) {\n\t\t// To ensure the minHeight does not get overridden by `aspectRatio` unset any existing rule.\n\t\tinlineStyleOverrides.aspectRatio = 'unset';\n\t}\n\n\treturn { className, style: inlineStyleOverrides };\n}\n\n/**\n * @deprecated\n */\nexport function useCustomSides() {\n\tdeprecated( 'wp.blockEditor.__experimentalUseCustomSides', {\n\t\tsince: '6.3',\n\t\tversion: '6.4',\n\t} );\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -3,16 +3,10 @@ import { addFilter } from "@wordpress/hooks";
|
|
|
3
3
|
import { hasBlockSupport } from "@wordpress/blocks";
|
|
4
4
|
import { useEffect, useCallback } from "@wordpress/element";
|
|
5
5
|
import { useSelect } from "@wordpress/data";
|
|
6
|
-
import { __ } from "@wordpress/i18n";
|
|
7
|
-
import {
|
|
8
|
-
ToggleControl,
|
|
9
|
-
__experimentalToolsPanelItem as ToolsPanelItem
|
|
10
|
-
} from "@wordpress/components";
|
|
11
6
|
import { optimizeFitText } from "../utils/fit-text-utils";
|
|
12
7
|
import { store as blockEditorStore } from "../store";
|
|
13
8
|
import { useBlockElement } from "../components/block-list/use-block-props/use-block-refs";
|
|
14
|
-
|
|
15
|
-
import { jsx } from "react/jsx-runtime";
|
|
9
|
+
var EMPTY_OBJECT = {};
|
|
16
10
|
var FIT_TEXT_SUPPORT_KEY = "typography.fitText";
|
|
17
11
|
function addAttributes(settings) {
|
|
18
12
|
if (!hasBlockSupport(settings, FIT_TEXT_SUPPORT_KEY)) {
|
|
@@ -34,12 +28,15 @@ function addAttributes(settings) {
|
|
|
34
28
|
function useFitText({ fitText, name, clientId }) {
|
|
35
29
|
const hasFitTextSupport2 = hasBlockSupport(name, FIT_TEXT_SUPPORT_KEY);
|
|
36
30
|
const blockElement = useBlockElement(clientId);
|
|
37
|
-
const blockAttributes = useSelect(
|
|
31
|
+
const { blockAttributes, parentId } = useSelect(
|
|
38
32
|
(select) => {
|
|
39
33
|
if (!clientId || !hasFitTextSupport2 || !fitText) {
|
|
40
|
-
return;
|
|
34
|
+
return EMPTY_OBJECT;
|
|
41
35
|
}
|
|
42
|
-
return
|
|
36
|
+
return {
|
|
37
|
+
blockAttributes: select(blockEditorStore).getBlockAttributes(clientId),
|
|
38
|
+
parentId: select(blockEditorStore).getBlockRootClientId(clientId)
|
|
39
|
+
};
|
|
43
40
|
},
|
|
44
41
|
[clientId, hasFitTextSupport2, fitText]
|
|
45
42
|
);
|
|
@@ -86,6 +83,7 @@ function useFitText({ fitText, name, clientId }) {
|
|
|
86
83
|
if (window.ResizeObserver && currentElement.parentElement) {
|
|
87
84
|
resizeObserver = new window.ResizeObserver(applyFitText);
|
|
88
85
|
resizeObserver.observe(currentElement.parentElement);
|
|
86
|
+
resizeObserver.observe(currentElement);
|
|
89
87
|
}
|
|
90
88
|
return () => {
|
|
91
89
|
if (hideFrameId !== null) {
|
|
@@ -106,7 +104,14 @@ function useFitText({ fitText, name, clientId }) {
|
|
|
106
104
|
styleElement.remove();
|
|
107
105
|
}
|
|
108
106
|
};
|
|
109
|
-
}, [
|
|
107
|
+
}, [
|
|
108
|
+
fitText,
|
|
109
|
+
clientId,
|
|
110
|
+
parentId,
|
|
111
|
+
applyFitText,
|
|
112
|
+
blockElement,
|
|
113
|
+
hasFitTextSupport2
|
|
114
|
+
]);
|
|
110
115
|
useEffect(() => {
|
|
111
116
|
if (fitText && blockElement && hasFitTextSupport2) {
|
|
112
117
|
const frameId = window.requestAnimationFrame(() => {
|
|
@@ -124,58 +129,6 @@ function useFitText({ fitText, name, clientId }) {
|
|
|
124
129
|
hasFitTextSupport2
|
|
125
130
|
]);
|
|
126
131
|
}
|
|
127
|
-
function FitTextControl({
|
|
128
|
-
clientId,
|
|
129
|
-
fitText = false,
|
|
130
|
-
setAttributes,
|
|
131
|
-
name,
|
|
132
|
-
fontSize,
|
|
133
|
-
style
|
|
134
|
-
}) {
|
|
135
|
-
if (!hasBlockSupport(name, FIT_TEXT_SUPPORT_KEY)) {
|
|
136
|
-
return null;
|
|
137
|
-
}
|
|
138
|
-
return /* @__PURE__ */ jsx(InspectorControls, { group: "typography", children: /* @__PURE__ */ jsx(
|
|
139
|
-
ToolsPanelItem,
|
|
140
|
-
{
|
|
141
|
-
hasValue: () => fitText,
|
|
142
|
-
label: __("Fit text"),
|
|
143
|
-
onDeselect: () => setAttributes({ fitText: void 0 }),
|
|
144
|
-
resetAllFilter: () => ({ fitText: void 0 }),
|
|
145
|
-
panelId: clientId,
|
|
146
|
-
children: /* @__PURE__ */ jsx(
|
|
147
|
-
ToggleControl,
|
|
148
|
-
{
|
|
149
|
-
__nextHasNoMarginBottom: true,
|
|
150
|
-
label: __("Fit text"),
|
|
151
|
-
checked: fitText,
|
|
152
|
-
onChange: () => {
|
|
153
|
-
const newFitText = !fitText || void 0;
|
|
154
|
-
const updates = { fitText: newFitText };
|
|
155
|
-
if (newFitText) {
|
|
156
|
-
if (fontSize) {
|
|
157
|
-
updates.fontSize = void 0;
|
|
158
|
-
}
|
|
159
|
-
if (style?.typography?.fontSize) {
|
|
160
|
-
updates.style = {
|
|
161
|
-
...style,
|
|
162
|
-
typography: {
|
|
163
|
-
...style?.typography,
|
|
164
|
-
fontSize: void 0
|
|
165
|
-
}
|
|
166
|
-
};
|
|
167
|
-
}
|
|
168
|
-
}
|
|
169
|
-
setAttributes(updates);
|
|
170
|
-
},
|
|
171
|
-
help: fitText ? __("Text will resize to fit its container.") : __(
|
|
172
|
-
"The text will resize to fit its container, resetting other font size settings."
|
|
173
|
-
)
|
|
174
|
-
}
|
|
175
|
-
)
|
|
176
|
-
}
|
|
177
|
-
) });
|
|
178
|
-
}
|
|
179
132
|
function addSaveProps(props, blockType, attributes) {
|
|
180
133
|
if (!hasBlockSupport(blockType, FIT_TEXT_SUPPORT_KEY)) {
|
|
181
134
|
return props;
|
|
@@ -210,13 +163,12 @@ var hasFitTextSupport = (blockNameOrType) => {
|
|
|
210
163
|
var fit_text_default = {
|
|
211
164
|
useBlockProps,
|
|
212
165
|
addSaveProps,
|
|
213
|
-
attributeKeys: ["fitText"
|
|
166
|
+
attributeKeys: ["fitText"],
|
|
214
167
|
hasSupport: hasFitTextSupport,
|
|
215
|
-
edit:
|
|
168
|
+
edit: () => null
|
|
216
169
|
};
|
|
217
170
|
export {
|
|
218
171
|
FIT_TEXT_SUPPORT_KEY,
|
|
219
|
-
FitTextControl,
|
|
220
172
|
fit_text_default as default
|
|
221
173
|
};
|
|
222
174
|
//# sourceMappingURL=fit-text.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/hooks/fit-text.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { hasBlockSupport } from '@wordpress/blocks';\nimport { useEffect, useCallback } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tToggleControl,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { optimizeFitText } from '../utils/fit-text-utils';\nimport { store as blockEditorStore } from '../store';\nimport { useBlockElement } from '../components/block-list/use-block-props/use-block-refs';\nimport InspectorControls from '../components/inspector-controls';\n\nexport const FIT_TEXT_SUPPORT_KEY = 'typography.fitText';\n\n/**\n * Filters registered block settings, extending attributes to include\n * the `fitText` attribute.\n *\n * @param {Object} settings Original block settings.\n * @return {Object} Filtered block settings.\n */\nfunction addAttributes( settings ) {\n\tif ( ! hasBlockSupport( settings, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify their own attribute definition.\n\tif ( settings.attributes?.fitText ) {\n\t\treturn settings;\n\t}\n\n\t// Add fitText attribute.\n\treturn {\n\t\t...settings,\n\t\tattributes: {\n\t\t\t...settings.attributes,\n\t\t\tfitText: {\n\t\t\t\ttype: 'boolean',\n\t\t\t},\n\t\t},\n\t};\n}\n\n/**\n * Custom hook to handle fit text functionality in the editor.\n *\n * @param {Object} props Component props.\n * @param {?boolean} props.fitText Fit text attribute.\n * @param {string} props.name Block name.\n * @param {string} props.clientId Block client ID.\n */\nfunction useFitText( { fitText, name, clientId } ) {\n\tconst hasFitTextSupport = hasBlockSupport( name, FIT_TEXT_SUPPORT_KEY );\n\tconst blockElement = useBlockElement( clientId );\n\n\t// Monitor block attribute changes\n\t// Any attribute may change the available space.\n\tconst blockAttributes = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! clientId || ! hasFitTextSupport || ! fitText ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\treturn select( blockEditorStore ).getBlockAttributes( clientId );\n\t\t},\n\t\t[ clientId, hasFitTextSupport, fitText ]\n\t);\n\n\tconst applyFitText = useCallback( () => {\n\t\tif ( ! blockElement || ! hasFitTextSupport || ! fitText ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Get or create style element with unique ID\n\t\tconst styleId = `fit-text-${ clientId }`;\n\t\tlet styleElement = blockElement.ownerDocument.getElementById( styleId );\n\t\tif ( ! styleElement ) {\n\t\t\tstyleElement = blockElement.ownerDocument.createElement( 'style' );\n\t\t\tstyleElement.id = styleId;\n\t\t\tblockElement.ownerDocument.head.appendChild( styleElement );\n\t\t}\n\n\t\tconst blockSelector = `#block-${ clientId }`;\n\n\t\tconst applyFontSize = ( fontSize ) => {\n\t\t\tif ( fontSize === 0 ) {\n\t\t\t\tstyleElement.textContent = '';\n\t\t\t} else {\n\t\t\t\tstyleElement.textContent = `${ blockSelector } { font-size: ${ fontSize }px !important; }`;\n\t\t\t}\n\t\t};\n\n\t\toptimizeFitText( blockElement, applyFontSize );\n\t}, [ blockElement, clientId, hasFitTextSupport, fitText ] );\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\t! fitText ||\n\t\t\t! blockElement ||\n\t\t\t! clientId ||\n\t\t\t! hasFitTextSupport\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Store current element value for cleanup\n\t\tconst currentElement = blockElement;\n\t\tconst previousVisibility = currentElement.style.visibility;\n\n\t\t// Store IDs for cleanup\n\t\tlet hideFrameId = null;\n\t\tlet calculateFrameId = null;\n\t\tlet showTimeoutId = null;\n\n\t\t// We are hiding the element doing the calculation of fit text\n\t\t// and then showing it again to avoid the user noticing a flash of potentially\n\t\t// big fitText while the binary search is happening.\n\t\thideFrameId = window.requestAnimationFrame( () => {\n\t\t\tcurrentElement.style.visibility = 'hidden';\n\t\t\t// Wait for browser to render the hidden state\n\t\t\tcalculateFrameId = window.requestAnimationFrame( () => {\n\t\t\t\tapplyFitText();\n\n\t\t\t\t// Using a timeout instead of requestAnimationFrame, because\n\t\t\t\t// with requestAnimationFrame a flash of very high size\n\t\t\t\t// can still occur although rare.\n\t\t\t\tshowTimeoutId = setTimeout( () => {\n\t\t\t\t\tcurrentElement.style.visibility = previousVisibility;\n\t\t\t\t}, 10 );\n\t\t\t} );\n\t\t} );\n\n\t\t// Watch for size changes\n\t\tlet resizeObserver;\n\t\tif ( window.ResizeObserver && currentElement.parentElement ) {\n\t\t\tresizeObserver = new window.ResizeObserver( applyFitText );\n\t\t\tresizeObserver.observe( currentElement.parentElement );\n\t\t}\n\n\t\t// Cleanup function\n\t\treturn () => {\n\t\t\t// Cancel pending async operations\n\t\t\tif ( hideFrameId !== null ) {\n\t\t\t\twindow.cancelAnimationFrame( hideFrameId );\n\t\t\t}\n\t\t\tif ( calculateFrameId !== null ) {\n\t\t\t\twindow.cancelAnimationFrame( calculateFrameId );\n\t\t\t}\n\t\t\tif ( showTimeoutId !== null ) {\n\t\t\t\tclearTimeout( showTimeoutId );\n\t\t\t}\n\n\t\t\tif ( resizeObserver ) {\n\t\t\t\tresizeObserver.disconnect();\n\t\t\t}\n\n\t\t\tconst styleId = `fit-text-${ clientId }`;\n\t\t\tconst styleElement =\n\t\t\t\tcurrentElement.ownerDocument.getElementById( styleId );\n\t\t\tif ( styleElement ) {\n\t\t\t\tstyleElement.remove();\n\t\t\t}\n\t\t};\n\t}, [ fitText, clientId, applyFitText, blockElement, hasFitTextSupport ] );\n\n\t// Trigger fit text recalculation when content changes\n\tuseEffect( () => {\n\t\tif ( fitText && blockElement && hasFitTextSupport ) {\n\t\t\t// Wait for next frame to ensure DOM has updated after content changes\n\t\t\tconst frameId = window.requestAnimationFrame( () => {\n\t\t\t\tif ( blockElement ) {\n\t\t\t\t\tapplyFitText();\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\treturn () => window.cancelAnimationFrame( frameId );\n\t\t}\n\t}, [\n\t\tblockAttributes,\n\t\tfitText,\n\t\tapplyFitText,\n\t\tblockElement,\n\t\thasFitTextSupport,\n\t] );\n}\n\n/**\n * Fit text control component for the typography panel.\n *\n * @param {Object} props Component props.\n * @param {string} props.clientId Block client ID.\n * @param {Function} props.setAttributes Function to set block attributes.\n * @param {string} props.name Block name.\n * @param {boolean} props.fitText Whether fit text is enabled.\n * @param {string} props.fontSize Font size slug.\n * @param {Object} props.style Block style object.\n */\nexport function FitTextControl( {\n\tclientId,\n\tfitText = false,\n\tsetAttributes,\n\tname,\n\tfontSize,\n\tstyle,\n} ) {\n\tif ( ! hasBlockSupport( name, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<InspectorControls group=\"typography\">\n\t\t\t<ToolsPanelItem\n\t\t\t\thasValue={ () => fitText }\n\t\t\t\tlabel={ __( 'Fit text' ) }\n\t\t\t\tonDeselect={ () => setAttributes( { fitText: undefined } ) }\n\t\t\t\tresetAllFilter={ () => ( { fitText: undefined } ) }\n\t\t\t\tpanelId={ clientId }\n\t\t\t>\n\t\t\t\t<ToggleControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tlabel={ __( 'Fit text' ) }\n\t\t\t\t\tchecked={ fitText }\n\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\tconst newFitText = ! fitText || undefined;\n\t\t\t\t\t\tconst updates = { fitText: newFitText };\n\n\t\t\t\t\t\t// When enabling fit text, clear font size if it has a value\n\t\t\t\t\t\tif ( newFitText ) {\n\t\t\t\t\t\t\tif ( fontSize ) {\n\t\t\t\t\t\t\t\tupdates.fontSize = undefined;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif ( style?.typography?.fontSize ) {\n\t\t\t\t\t\t\t\tupdates.style = {\n\t\t\t\t\t\t\t\t\t...style,\n\t\t\t\t\t\t\t\t\ttypography: {\n\t\t\t\t\t\t\t\t\t\t...style?.typography,\n\t\t\t\t\t\t\t\t\t\tfontSize: undefined,\n\t\t\t\t\t\t\t\t\t},\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\n\t\t\t\t\t\tsetAttributes( updates );\n\t\t\t\t\t} }\n\t\t\t\t\thelp={\n\t\t\t\t\t\tfitText\n\t\t\t\t\t\t\t? __( 'Text will resize to fit its container.' )\n\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t'The text will resize to fit its container, resetting other font size settings.'\n\t\t\t\t\t\t\t )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</ToolsPanelItem>\n\t\t</InspectorControls>\n\t);\n}\n\n/**\n * Override props applied to the block element on save.\n *\n * @param {Object} props Additional props applied to the block element.\n * @param {Object} blockType Block type.\n * @param {Object} attributes Block attributes.\n * @return {Object} Filtered props applied to the block element.\n */\nfunction addSaveProps( props, blockType, attributes ) {\n\tif ( ! hasBlockSupport( blockType, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn props;\n\t}\n\n\tconst { fitText } = attributes;\n\n\tif ( ! fitText ) {\n\t\treturn props;\n\t}\n\n\t// Add CSS class for frontend detection and styling\n\tconst className = props.className\n\t\t? `${ props.className } has-fit-text`\n\t\t: 'has-fit-text';\n\n\treturn {\n\t\t...props,\n\t\tclassName,\n\t};\n}\n/**\n * Override props applied to the block element in the editor.\n *\n * @param {Object} props Component props including block attributes.\n * @param {string} props.name Block name.\n * @param {boolean} props.fitText Whether fit text is enabled.\n * @param {string} props.clientId Block client ID.\n * @return {Object} Filtered props applied to the block element.\n */\nfunction useBlockProps( { name, fitText, clientId } ) {\n\tuseFitText( { fitText, name, clientId } );\n\tif ( ! fitText || ! hasBlockSupport( name, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn {};\n\t}\n\treturn {\n\t\tclassName: 'has-fit-text',\n\t};\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/fit-text/addAttribute',\n\taddAttributes\n);\n\nconst hasFitTextSupport = ( blockNameOrType ) => {\n\treturn hasBlockSupport( blockNameOrType, FIT_TEXT_SUPPORT_KEY );\n};\n\nexport default {\n\tuseBlockProps,\n\taddSaveProps,\n\tattributeKeys: [ 'fitText', 'fontSize', 'style' ],\n\thasSupport: hasFitTextSupport,\n\tedit: FitTextControl,\n};\n"],
|
|
5
|
-
"mappings": ";AAGA,SAAS,iBAAiB;AAC1B,SAAS,uBAAuB;AAChC,SAAS,WAAW,mBAAmB;AACvC,SAAS,iBAAiB;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { hasBlockSupport } from '@wordpress/blocks';\nimport { useEffect, useCallback } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\n\nconst EMPTY_OBJECT = {};\n\n/**\n * Internal dependencies\n */\nimport { optimizeFitText } from '../utils/fit-text-utils';\nimport { store as blockEditorStore } from '../store';\nimport { useBlockElement } from '../components/block-list/use-block-props/use-block-refs';\n\nexport const FIT_TEXT_SUPPORT_KEY = 'typography.fitText';\n\n/**\n * Filters registered block settings, extending attributes to include\n * the `fitText` attribute.\n *\n * @param {Object} settings Original block settings.\n * @return {Object} Filtered block settings.\n */\nfunction addAttributes( settings ) {\n\tif ( ! hasBlockSupport( settings, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify their own attribute definition.\n\tif ( settings.attributes?.fitText ) {\n\t\treturn settings;\n\t}\n\n\t// Add fitText attribute.\n\treturn {\n\t\t...settings,\n\t\tattributes: {\n\t\t\t...settings.attributes,\n\t\t\tfitText: {\n\t\t\t\ttype: 'boolean',\n\t\t\t},\n\t\t},\n\t};\n}\n\n/**\n * Custom hook to handle fit text functionality in the editor.\n *\n * @param {Object} props Component props.\n * @param {?boolean} props.fitText Fit text attribute.\n * @param {string} props.name Block name.\n * @param {string} props.clientId Block client ID.\n */\nfunction useFitText( { fitText, name, clientId } ) {\n\tconst hasFitTextSupport = hasBlockSupport( name, FIT_TEXT_SUPPORT_KEY );\n\tconst blockElement = useBlockElement( clientId );\n\n\t// Monitor block attribute changes, and parent changes.\n\t// Any attribute or parent change may change the available space.\n\tconst { blockAttributes, parentId } = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! clientId || ! hasFitTextSupport || ! fitText ) {\n\t\t\t\treturn EMPTY_OBJECT;\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tblockAttributes:\n\t\t\t\t\tselect( blockEditorStore ).getBlockAttributes( clientId ),\n\t\t\t\tparentId:\n\t\t\t\t\tselect( blockEditorStore ).getBlockRootClientId( clientId ),\n\t\t\t};\n\t\t},\n\t\t[ clientId, hasFitTextSupport, fitText ]\n\t);\n\n\tconst applyFitText = useCallback( () => {\n\t\tif ( ! blockElement || ! hasFitTextSupport || ! fitText ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Get or create style element with unique ID\n\t\tconst styleId = `fit-text-${ clientId }`;\n\t\tlet styleElement = blockElement.ownerDocument.getElementById( styleId );\n\t\tif ( ! styleElement ) {\n\t\t\tstyleElement = blockElement.ownerDocument.createElement( 'style' );\n\t\t\tstyleElement.id = styleId;\n\t\t\tblockElement.ownerDocument.head.appendChild( styleElement );\n\t\t}\n\n\t\tconst blockSelector = `#block-${ clientId }`;\n\n\t\tconst applyFontSize = ( fontSize ) => {\n\t\t\tif ( fontSize === 0 ) {\n\t\t\t\tstyleElement.textContent = '';\n\t\t\t} else {\n\t\t\t\tstyleElement.textContent = `${ blockSelector } { font-size: ${ fontSize }px !important; }`;\n\t\t\t}\n\t\t};\n\n\t\toptimizeFitText( blockElement, applyFontSize );\n\t}, [ blockElement, clientId, hasFitTextSupport, fitText ] );\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\t! fitText ||\n\t\t\t! blockElement ||\n\t\t\t! clientId ||\n\t\t\t! hasFitTextSupport\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Store current element value for cleanup\n\t\tconst currentElement = blockElement;\n\t\tconst previousVisibility = currentElement.style.visibility;\n\n\t\t// Store IDs for cleanup\n\t\tlet hideFrameId = null;\n\t\tlet calculateFrameId = null;\n\t\tlet showTimeoutId = null;\n\n\t\t// We are hiding the element doing the calculation of fit text\n\t\t// and then showing it again to avoid the user noticing a flash of potentially\n\t\t// big fitText while the binary search is happening.\n\t\thideFrameId = window.requestAnimationFrame( () => {\n\t\t\tcurrentElement.style.visibility = 'hidden';\n\t\t\t// Wait for browser to render the hidden state\n\t\t\tcalculateFrameId = window.requestAnimationFrame( () => {\n\t\t\t\tapplyFitText();\n\n\t\t\t\t// Using a timeout instead of requestAnimationFrame, because\n\t\t\t\t// with requestAnimationFrame a flash of very high size\n\t\t\t\t// can still occur although rare.\n\t\t\t\tshowTimeoutId = setTimeout( () => {\n\t\t\t\t\tcurrentElement.style.visibility = previousVisibility;\n\t\t\t\t}, 10 );\n\t\t\t} );\n\t\t} );\n\n\t\t// Watch for size changes\n\t\tlet resizeObserver;\n\t\tif ( window.ResizeObserver && currentElement.parentElement ) {\n\t\t\tresizeObserver = new window.ResizeObserver( applyFitText );\n\t\t\tresizeObserver.observe( currentElement.parentElement );\n\t\t\tresizeObserver.observe( currentElement );\n\t\t}\n\n\t\t// Cleanup function\n\t\treturn () => {\n\t\t\t// Cancel pending async operations\n\t\t\tif ( hideFrameId !== null ) {\n\t\t\t\twindow.cancelAnimationFrame( hideFrameId );\n\t\t\t}\n\t\t\tif ( calculateFrameId !== null ) {\n\t\t\t\twindow.cancelAnimationFrame( calculateFrameId );\n\t\t\t}\n\t\t\tif ( showTimeoutId !== null ) {\n\t\t\t\tclearTimeout( showTimeoutId );\n\t\t\t}\n\n\t\t\tif ( resizeObserver ) {\n\t\t\t\tresizeObserver.disconnect();\n\t\t\t}\n\n\t\t\tconst styleId = `fit-text-${ clientId }`;\n\t\t\tconst styleElement =\n\t\t\t\tcurrentElement.ownerDocument.getElementById( styleId );\n\t\t\tif ( styleElement ) {\n\t\t\t\tstyleElement.remove();\n\t\t\t}\n\t\t};\n\t}, [\n\t\tfitText,\n\t\tclientId,\n\t\tparentId,\n\t\tapplyFitText,\n\t\tblockElement,\n\t\thasFitTextSupport,\n\t] );\n\n\t// Trigger fit text recalculation when content changes\n\tuseEffect( () => {\n\t\tif ( fitText && blockElement && hasFitTextSupport ) {\n\t\t\t// Wait for next frame to ensure DOM has updated after content changes\n\t\t\tconst frameId = window.requestAnimationFrame( () => {\n\t\t\t\tif ( blockElement ) {\n\t\t\t\t\tapplyFitText();\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\treturn () => window.cancelAnimationFrame( frameId );\n\t\t}\n\t}, [\n\t\tblockAttributes,\n\t\tfitText,\n\t\tapplyFitText,\n\t\tblockElement,\n\t\thasFitTextSupport,\n\t] );\n}\n\n/**\n * Override props applied to the block element on save.\n *\n * @param {Object} props Additional props applied to the block element.\n * @param {Object} blockType Block type.\n * @param {Object} attributes Block attributes.\n * @return {Object} Filtered props applied to the block element.\n */\nfunction addSaveProps( props, blockType, attributes ) {\n\tif ( ! hasBlockSupport( blockType, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn props;\n\t}\n\n\tconst { fitText } = attributes;\n\n\tif ( ! fitText ) {\n\t\treturn props;\n\t}\n\n\t// Add CSS class for frontend detection and styling\n\tconst className = props.className\n\t\t? `${ props.className } has-fit-text`\n\t\t: 'has-fit-text';\n\n\treturn {\n\t\t...props,\n\t\tclassName,\n\t};\n}\n/**\n * Override props applied to the block element in the editor.\n *\n * @param {Object} props Component props including block attributes.\n * @param {string} props.name Block name.\n * @param {boolean} props.fitText Whether fit text is enabled.\n * @param {string} props.clientId Block client ID.\n * @return {Object} Filtered props applied to the block element.\n */\nfunction useBlockProps( { name, fitText, clientId } ) {\n\tuseFitText( { fitText, name, clientId } );\n\tif ( ! fitText || ! hasBlockSupport( name, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn {};\n\t}\n\treturn {\n\t\tclassName: 'has-fit-text',\n\t};\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/fit-text/addAttribute',\n\taddAttributes\n);\n\nconst hasFitTextSupport = ( blockNameOrType ) => {\n\treturn hasBlockSupport( blockNameOrType, FIT_TEXT_SUPPORT_KEY );\n};\n\nexport default {\n\tuseBlockProps,\n\taddSaveProps,\n\tattributeKeys: [ 'fitText' ],\n\thasSupport: hasFitTextSupport,\n\tedit: () => null,\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["hasFitTextSupport"]
|
|
7
7
|
}
|
|
@@ -50,10 +50,13 @@ function addSaveProps(props, blockNameOrType, attributes) {
|
|
|
50
50
|
}
|
|
51
51
|
function FontSizeEdit(props) {
|
|
52
52
|
const {
|
|
53
|
-
attributes: { fontSize, style },
|
|
53
|
+
attributes: { fontSize, style, fitText },
|
|
54
54
|
setAttributes
|
|
55
55
|
} = props;
|
|
56
56
|
const [fontSizes] = useSettings("typography.fontSizes");
|
|
57
|
+
if (fitText) {
|
|
58
|
+
return null;
|
|
59
|
+
}
|
|
57
60
|
const onChange = (value, selectedItem) => {
|
|
58
61
|
const fontSizeSlug = selectedItem?.slug || getFontSizeObjectByValue(fontSizes, value).slug;
|
|
59
62
|
setAttributes({
|
|
@@ -134,7 +137,7 @@ function useBlockProps({ name, fontSize, style }) {
|
|
|
134
137
|
var font_size_default = {
|
|
135
138
|
useBlockProps,
|
|
136
139
|
addSaveProps,
|
|
137
|
-
attributeKeys: ["fontSize", "style"],
|
|
140
|
+
attributeKeys: ["fontSize", "style", "fitText"],
|
|
138
141
|
hasSupport(name) {
|
|
139
142
|
return hasBlockSupport(name, FONT_SIZE_SUPPORT_KEY);
|
|
140
143
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/hooks/font-size.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { hasBlockSupport } from '@wordpress/blocks';\nimport TokenList from '@wordpress/token-list';\nimport { getTypographyFontSizeValue } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetFontSize,\n\tgetFontSizeClass,\n\tgetFontSizeObjectByValue,\n\tFontSizePicker,\n} from '../components/font-sizes';\nimport { TYPOGRAPHY_SUPPORT_KEY } from './typography';\nimport {\n\tcleanEmptyObject,\n\ttransformStyles,\n\tshouldSkipSerialization,\n} from './utils';\nimport { useSettings } from '../components/use-settings';\n\nexport const FONT_SIZE_SUPPORT_KEY = 'typography.fontSize';\n\n/**\n * Filters registered block settings, extending attributes to include\n * `fontSize` and `fontWeight` attributes.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nfunction addAttributes( settings ) {\n\tif ( ! hasBlockSupport( settings, FONT_SIZE_SUPPORT_KEY ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify a default value if needed.\n\tif ( ! settings.attributes.fontSize ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tfontSize: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\n\treturn settings;\n}\n\n/**\n * Override props assigned to save component to inject font size.\n *\n * @param {Object} props Additional props applied to save element.\n * @param {Object} blockNameOrType Block type.\n * @param {Object} attributes Block attributes.\n *\n * @return {Object} Filtered props applied to save element.\n */\nfunction addSaveProps( props, blockNameOrType, attributes ) {\n\tif ( ! hasBlockSupport( blockNameOrType, FONT_SIZE_SUPPORT_KEY ) ) {\n\t\treturn props;\n\t}\n\n\tif (\n\t\tshouldSkipSerialization(\n\t\t\tblockNameOrType,\n\t\t\tTYPOGRAPHY_SUPPORT_KEY,\n\t\t\t'fontSize'\n\t\t)\n\t) {\n\t\treturn props;\n\t}\n\n\t// Use TokenList to dedupe classes.\n\tconst classes = new TokenList( props.className );\n\tclasses.add( getFontSizeClass( attributes.fontSize ) );\n\tconst newClassName = classes.value;\n\tprops.className = newClassName ? newClassName : undefined;\n\n\treturn props;\n}\n\n/**\n * Inspector control panel containing the font size related configuration\n *\n * @param {Object} props\n *\n * @return {Element} Font size edit element.\n */\nexport function FontSizeEdit( props ) {\n\tconst {\n\t\tattributes: { fontSize, style },\n\t\tsetAttributes,\n\t} = props;\n\tconst [ fontSizes ] = useSettings( 'typography.fontSizes' );\n\n\tconst onChange = ( value, selectedItem ) => {\n\t\t// Use the selectedItem's slug if available, otherwise fall back to finding by value\n\t\tconst fontSizeSlug =\n\t\t\tselectedItem?.slug ||\n\t\t\tgetFontSizeObjectByValue( fontSizes, value ).slug;\n\n\t\tsetAttributes( {\n\t\t\tstyle: cleanEmptyObject( {\n\t\t\t\t...style,\n\t\t\t\ttypography: {\n\t\t\t\t\t...style?.typography,\n\t\t\t\t\tfontSize: fontSizeSlug ? undefined : value,\n\t\t\t\t},\n\t\t\t} ),\n\t\t\tfontSize: fontSizeSlug,\n\t\t} );\n\t};\n\n\tconst fontSizeObject = getFontSize(\n\t\tfontSizes,\n\t\tfontSize,\n\t\tstyle?.typography?.fontSize\n\t);\n\n\tconst fontSizeValue =\n\t\tfontSizeObject?.size || style?.typography?.fontSize || fontSize;\n\n\treturn (\n\t\t<FontSizePicker\n\t\t\tonChange={ onChange }\n\t\t\tvalue={ fontSize || fontSizeValue }\n\t\t\tvalueMode={ fontSize ? 'slug' : 'literal' }\n\t\t\twithReset={ false }\n\t\t\twithSlider\n\t\t\tsize=\"__unstable-large\"\n\t\t/>\n\t);\n}\n\n/**\n * Custom hook that checks if font-size settings have been disabled.\n *\n * @param {string} name The name of the block.\n * @return {boolean} Whether setting is disabled.\n */\nexport function useIsFontSizeDisabled( { name: blockName } = {} ) {\n\tconst [ fontSizes ] = useSettings( 'typography.fontSizes' );\n\tconst hasFontSizes = !! fontSizes?.length;\n\n\treturn (\n\t\t! hasBlockSupport( blockName, FONT_SIZE_SUPPORT_KEY ) || ! hasFontSizes\n\t);\n}\n\nfunction useBlockProps( { name, fontSize, style } ) {\n\tconst [ fontSizes, fluidTypographySettings, layoutSettings ] = useSettings(\n\t\t'typography.fontSizes',\n\t\t'typography.fluid',\n\t\t'layout'\n\t);\n\n\t/*\n\t * Only add inline styles if the block supports font sizes,\n\t * doesn't skip serialization of font sizes,\n\t * and has either a custom font size or a preset font size.\n\t */\n\tif (\n\t\t! hasBlockSupport( name, FONT_SIZE_SUPPORT_KEY ) ||\n\t\tshouldSkipSerialization( name, TYPOGRAPHY_SUPPORT_KEY, 'fontSize' ) ||\n\t\t( ! fontSize && ! style?.typography?.fontSize )\n\t) {\n\t\treturn;\n\t}\n\n\tlet props;\n\n\tif ( style?.typography?.fontSize ) {\n\t\tprops = {\n\t\t\tstyle: {\n\t\t\t\tfontSize: getTypographyFontSizeValue(\n\t\t\t\t\t{ size: style.typography.fontSize },\n\t\t\t\t\t{\n\t\t\t\t\t\ttypography: {\n\t\t\t\t\t\t\tfluid: fluidTypographySettings,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tlayout: layoutSettings,\n\t\t\t\t\t}\n\t\t\t\t),\n\t\t\t},\n\t\t};\n\t}\n\n\tif ( fontSize ) {\n\t\tprops = {\n\t\t\tstyle: {\n\t\t\t\tfontSize: getFontSize(\n\t\t\t\t\tfontSizes,\n\t\t\t\t\tfontSize,\n\t\t\t\t\tstyle?.typography?.fontSize\n\t\t\t\t).size,\n\t\t\t},\n\t\t};\n\t}\n\n\tif ( ! props ) {\n\t\treturn;\n\t}\n\n\treturn addSaveProps( props, name, { fontSize } );\n}\n\nexport default {\n\tuseBlockProps,\n\taddSaveProps,\n\tattributeKeys: [ 'fontSize', 'style' ],\n\thasSupport( name ) {\n\t\treturn hasBlockSupport( name, FONT_SIZE_SUPPORT_KEY );\n\t},\n};\n\nconst MIGRATION_PATHS = {\n\tfontSize: [ [ 'fontSize' ], [ 'style', 'typography', 'fontSize' ] ],\n};\n\nfunction addTransforms( result, source, index, results ) {\n\tconst destinationBlockType = result.name;\n\tconst activeSupports = {\n\t\tfontSize: hasBlockSupport(\n\t\t\tdestinationBlockType,\n\t\t\tFONT_SIZE_SUPPORT_KEY\n\t\t),\n\t};\n\treturn transformStyles(\n\t\tactiveSupports,\n\t\tMIGRATION_PATHS,\n\t\tresult,\n\t\tsource,\n\t\tindex,\n\t\tresults\n\t);\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/font/addAttribute',\n\taddAttributes\n);\n\naddFilter(\n\t'blocks.switchToBlockType.transformedBlock',\n\t'core/font-size/addTransforms',\n\taddTransforms\n);\n"],
|
|
5
|
-
"mappings": ";AAGA,SAAS,iBAAiB;AAC1B,SAAS,uBAAuB;AAChC,OAAO,eAAe;AACtB,SAAS,kCAAkC;AAK3C;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,8BAA8B;AACvC;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,mBAAmB;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { hasBlockSupport } from '@wordpress/blocks';\nimport TokenList from '@wordpress/token-list';\nimport { getTypographyFontSizeValue } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetFontSize,\n\tgetFontSizeClass,\n\tgetFontSizeObjectByValue,\n\tFontSizePicker,\n} from '../components/font-sizes';\nimport { TYPOGRAPHY_SUPPORT_KEY } from './typography';\nimport {\n\tcleanEmptyObject,\n\ttransformStyles,\n\tshouldSkipSerialization,\n} from './utils';\nimport { useSettings } from '../components/use-settings';\n\nexport const FONT_SIZE_SUPPORT_KEY = 'typography.fontSize';\n\n/**\n * Filters registered block settings, extending attributes to include\n * `fontSize` and `fontWeight` attributes.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nfunction addAttributes( settings ) {\n\tif ( ! hasBlockSupport( settings, FONT_SIZE_SUPPORT_KEY ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify a default value if needed.\n\tif ( ! settings.attributes.fontSize ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tfontSize: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\n\treturn settings;\n}\n\n/**\n * Override props assigned to save component to inject font size.\n *\n * @param {Object} props Additional props applied to save element.\n * @param {Object} blockNameOrType Block type.\n * @param {Object} attributes Block attributes.\n *\n * @return {Object} Filtered props applied to save element.\n */\nfunction addSaveProps( props, blockNameOrType, attributes ) {\n\tif ( ! hasBlockSupport( blockNameOrType, FONT_SIZE_SUPPORT_KEY ) ) {\n\t\treturn props;\n\t}\n\n\tif (\n\t\tshouldSkipSerialization(\n\t\t\tblockNameOrType,\n\t\t\tTYPOGRAPHY_SUPPORT_KEY,\n\t\t\t'fontSize'\n\t\t)\n\t) {\n\t\treturn props;\n\t}\n\n\t// Use TokenList to dedupe classes.\n\tconst classes = new TokenList( props.className );\n\tclasses.add( getFontSizeClass( attributes.fontSize ) );\n\tconst newClassName = classes.value;\n\tprops.className = newClassName ? newClassName : undefined;\n\n\treturn props;\n}\n\n/**\n * Inspector control panel containing the font size related configuration\n *\n * @param {Object} props\n *\n * @return {Element} Font size edit element.\n */\nexport function FontSizeEdit( props ) {\n\tconst {\n\t\tattributes: { fontSize, style, fitText },\n\t\tsetAttributes,\n\t} = props;\n\n\tconst [ fontSizes ] = useSettings( 'typography.fontSizes' );\n\n\t// Hide font size UI when fitText is enabled\n\tif ( fitText ) {\n\t\treturn null;\n\t}\n\tconst onChange = ( value, selectedItem ) => {\n\t\t// Use the selectedItem's slug if available, otherwise fall back to finding by value\n\t\tconst fontSizeSlug =\n\t\t\tselectedItem?.slug ||\n\t\t\tgetFontSizeObjectByValue( fontSizes, value ).slug;\n\n\t\tsetAttributes( {\n\t\t\tstyle: cleanEmptyObject( {\n\t\t\t\t...style,\n\t\t\t\ttypography: {\n\t\t\t\t\t...style?.typography,\n\t\t\t\t\tfontSize: fontSizeSlug ? undefined : value,\n\t\t\t\t},\n\t\t\t} ),\n\t\t\tfontSize: fontSizeSlug,\n\t\t} );\n\t};\n\n\tconst fontSizeObject = getFontSize(\n\t\tfontSizes,\n\t\tfontSize,\n\t\tstyle?.typography?.fontSize\n\t);\n\n\tconst fontSizeValue =\n\t\tfontSizeObject?.size || style?.typography?.fontSize || fontSize;\n\n\treturn (\n\t\t<FontSizePicker\n\t\t\tonChange={ onChange }\n\t\t\tvalue={ fontSize || fontSizeValue }\n\t\t\tvalueMode={ fontSize ? 'slug' : 'literal' }\n\t\t\twithReset={ false }\n\t\t\twithSlider\n\t\t\tsize=\"__unstable-large\"\n\t\t/>\n\t);\n}\n\n/**\n * Custom hook that checks if font-size settings have been disabled.\n *\n * @param {string} name The name of the block.\n * @return {boolean} Whether setting is disabled.\n */\nexport function useIsFontSizeDisabled( { name: blockName } = {} ) {\n\tconst [ fontSizes ] = useSettings( 'typography.fontSizes' );\n\tconst hasFontSizes = !! fontSizes?.length;\n\n\treturn (\n\t\t! hasBlockSupport( blockName, FONT_SIZE_SUPPORT_KEY ) || ! hasFontSizes\n\t);\n}\n\nfunction useBlockProps( { name, fontSize, style } ) {\n\tconst [ fontSizes, fluidTypographySettings, layoutSettings ] = useSettings(\n\t\t'typography.fontSizes',\n\t\t'typography.fluid',\n\t\t'layout'\n\t);\n\n\t/*\n\t * Only add inline styles if the block supports font sizes,\n\t * doesn't skip serialization of font sizes,\n\t * and has either a custom font size or a preset font size.\n\t */\n\tif (\n\t\t! hasBlockSupport( name, FONT_SIZE_SUPPORT_KEY ) ||\n\t\tshouldSkipSerialization( name, TYPOGRAPHY_SUPPORT_KEY, 'fontSize' ) ||\n\t\t( ! fontSize && ! style?.typography?.fontSize )\n\t) {\n\t\treturn;\n\t}\n\n\tlet props;\n\n\tif ( style?.typography?.fontSize ) {\n\t\tprops = {\n\t\t\tstyle: {\n\t\t\t\tfontSize: getTypographyFontSizeValue(\n\t\t\t\t\t{ size: style.typography.fontSize },\n\t\t\t\t\t{\n\t\t\t\t\t\ttypography: {\n\t\t\t\t\t\t\tfluid: fluidTypographySettings,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tlayout: layoutSettings,\n\t\t\t\t\t}\n\t\t\t\t),\n\t\t\t},\n\t\t};\n\t}\n\n\tif ( fontSize ) {\n\t\tprops = {\n\t\t\tstyle: {\n\t\t\t\tfontSize: getFontSize(\n\t\t\t\t\tfontSizes,\n\t\t\t\t\tfontSize,\n\t\t\t\t\tstyle?.typography?.fontSize\n\t\t\t\t).size,\n\t\t\t},\n\t\t};\n\t}\n\n\tif ( ! props ) {\n\t\treturn;\n\t}\n\n\treturn addSaveProps( props, name, { fontSize } );\n}\n\nexport default {\n\tuseBlockProps,\n\taddSaveProps,\n\tattributeKeys: [ 'fontSize', 'style', 'fitText' ],\n\thasSupport( name ) {\n\t\treturn hasBlockSupport( name, FONT_SIZE_SUPPORT_KEY );\n\t},\n};\n\nconst MIGRATION_PATHS = {\n\tfontSize: [ [ 'fontSize' ], [ 'style', 'typography', 'fontSize' ] ],\n};\n\nfunction addTransforms( result, source, index, results ) {\n\tconst destinationBlockType = result.name;\n\tconst activeSupports = {\n\t\tfontSize: hasBlockSupport(\n\t\t\tdestinationBlockType,\n\t\t\tFONT_SIZE_SUPPORT_KEY\n\t\t),\n\t};\n\treturn transformStyles(\n\t\tactiveSupports,\n\t\tMIGRATION_PATHS,\n\t\tresult,\n\t\tsource,\n\t\tindex,\n\t\tresults\n\t);\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/font/addAttribute',\n\taddAttributes\n);\n\naddFilter(\n\t'blocks.switchToBlockType.transformedBlock',\n\t'core/font-size/addTransforms',\n\taddTransforms\n);\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -40,7 +40,10 @@ function useLayoutClasses(blockAttributes = {}, blockName = "") {
|
|
|
40
40
|
}
|
|
41
41
|
const hasGlobalPadding = useSelect(
|
|
42
42
|
(select) => {
|
|
43
|
-
|
|
43
|
+
if (!usedLayout?.inherit && !usedLayout?.contentSize && usedLayout?.type !== "constrained") {
|
|
44
|
+
return false;
|
|
45
|
+
}
|
|
46
|
+
return select(blockEditorStore).getSettings().__experimentalFeatures?.useRootPaddingAwareAlignments;
|
|
44
47
|
},
|
|
45
48
|
[usedLayout?.contentSize, usedLayout?.inherit, usedLayout?.type]
|
|
46
49
|
);
|