@wordpress/block-editor 15.6.0 → 15.6.1-next.36001005c.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/build/components/background-image-control/index.js +2 -2
- package/build/components/background-image-control/index.js.map +2 -2
- package/build/components/block-quick-navigation/index.js +1 -0
- package/build/components/block-quick-navigation/index.js.map +2 -2
- package/build/components/global-styles/border-panel.js +2 -1
- package/build/components/global-styles/border-panel.js.map +2 -2
- package/build/components/global-styles/color-panel.js +2 -1
- package/build/components/global-styles/color-panel.js.map +2 -2
- package/build/components/global-styles/dimensions-panel.js +3 -2
- package/build/components/global-styles/dimensions-panel.js.map +2 -2
- package/build/components/global-styles/filters-panel.js +2 -1
- package/build/components/global-styles/filters-panel.js.map +2 -2
- package/build/components/global-styles/hooks.js +23 -95
- package/build/components/global-styles/hooks.js.map +2 -2
- package/build/components/global-styles/index.js +0 -14
- package/build/components/global-styles/index.js.map +2 -2
- package/build/components/global-styles/typography-panel.js +2 -1
- package/build/components/global-styles/typography-panel.js.map +2 -2
- package/build/components/global-styles/typography-utils.js +2 -49
- package/build/components/global-styles/typography-utils.js.map +2 -2
- package/build/components/global-styles/utils.js +0 -377
- package/build/components/global-styles/utils.js.map +2 -2
- package/build/hooks/block-style-variation.js +6 -10
- package/build/hooks/block-style-variation.js.map +2 -2
- package/build/hooks/duotone.js +3 -3
- package/build/hooks/duotone.js.map +2 -2
- package/build/hooks/font-size.js +2 -2
- package/build/hooks/font-size.js.map +2 -2
- package/build/hooks/use-typography-props.js +2 -2
- package/build/hooks/use-typography-props.js.map +2 -2
- package/build-module/components/background-image-control/index.js +1 -1
- package/build-module/components/background-image-control/index.js.map +2 -2
- package/build-module/components/block-quick-navigation/index.js +1 -0
- package/build-module/components/block-quick-navigation/index.js.map +2 -2
- package/build-module/components/global-styles/border-panel.js +2 -1
- package/build-module/components/global-styles/border-panel.js.map +2 -2
- package/build-module/components/global-styles/color-panel.js +2 -1
- package/build-module/components/global-styles/color-panel.js.map +2 -2
- package/build-module/components/global-styles/dimensions-panel.js +2 -1
- package/build-module/components/global-styles/dimensions-panel.js.map +2 -2
- package/build-module/components/global-styles/filters-panel.js +2 -1
- package/build-module/components/global-styles/filters-panel.js.map +2 -2
- package/build-module/components/global-styles/hooks.js +27 -95
- package/build-module/components/global-styles/hooks.js.map +2 -2
- package/build-module/components/global-styles/index.js +0 -14
- package/build-module/components/global-styles/index.js.map +2 -2
- package/build-module/components/global-styles/typography-panel.js +2 -1
- package/build-module/components/global-styles/typography-panel.js.map +2 -2
- package/build-module/components/global-styles/typography-utils.js +1 -49
- package/build-module/components/global-styles/typography-utils.js.map +2 -2
- package/build-module/components/global-styles/utils.js +0 -364
- package/build-module/components/global-styles/utils.js.map +2 -2
- package/build-module/hooks/block-style-variation.js +4 -12
- package/build-module/hooks/block-style-variation.js.map +2 -2
- package/build-module/hooks/duotone.js +3 -3
- package/build-module/hooks/duotone.js.map +2 -2
- package/build-module/hooks/font-size.js +1 -1
- package/build-module/hooks/font-size.js.map +2 -2
- package/build-module/hooks/use-typography-props.js +1 -1
- package/build-module/hooks/use-typography-props.js.map +2 -2
- package/build-style/style-rtl.css +10 -6
- package/build-style/style.css +10 -6
- package/package.json +36 -35
- package/src/components/background-image-control/index.js +1 -1
- package/src/components/block-card/style.scss +1 -1
- package/src/components/block-navigation/style.scss +1 -1
- package/src/components/block-quick-navigation/index.js +1 -0
- package/src/components/block-quick-navigation/style.scss +5 -0
- package/src/components/block-switcher/style.scss +1 -1
- package/src/components/color-palette/test/__snapshots__/control.js.snap +1 -1
- package/src/components/global-styles/border-panel.js +2 -1
- package/src/components/global-styles/color-panel.js +2 -1
- package/src/components/global-styles/color-panel.native.js +1 -1
- package/src/components/global-styles/dimensions-panel.js +2 -1
- package/src/components/global-styles/filters-panel.js +2 -1
- package/src/components/global-styles/hooks.js +29 -108
- package/src/components/global-styles/index.js +0 -8
- package/src/components/global-styles/test/typography-utils.js +0 -806
- package/src/components/global-styles/test/utils.js +1 -442
- package/src/components/global-styles/typography-panel.js +2 -1
- package/src/components/global-styles/typography-utils.js +0 -133
- package/src/components/global-styles/utils.js +0 -537
- package/src/components/inserter/style.scss +2 -2
- package/src/components/multi-selection-inspector/style.scss +1 -1
- package/src/hooks/block-style-variation.js +4 -12
- package/src/hooks/duotone.js +3 -3
- package/src/hooks/font-size.js +1 -1
- package/src/hooks/use-typography-props.js +1 -1
- package/src/style.scss +1 -0
- package/tsconfig.json +1 -0
- package/build/components/global-styles/get-block-css-selector.js +0 -78
- package/build/components/global-styles/get-block-css-selector.js.map +0 -7
- package/build/components/global-styles/use-global-styles-output.js +0 -998
- package/build/components/global-styles/use-global-styles-output.js.map +0 -7
- package/build-module/components/global-styles/get-block-css-selector.js +0 -54
- package/build-module/components/global-styles/get-block-css-selector.js.map +0 -7
- package/build-module/components/global-styles/use-global-styles-output.js +0 -979
- package/build-module/components/global-styles/use-global-styles-output.js.map +0 -7
- package/src/components/global-styles/get-block-css-selector.js +0 -114
- package/src/components/global-styles/test/use-global-styles-output.js +0 -1131
- package/src/components/global-styles/use-global-styles-output.js +0 -1487
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/global-styles/hooks.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport fastDeepEqual from 'fast-deep-equal/es6';\n\n/**\n * WordPress dependencies\n */\nimport { useContext, useCallback, useMemo } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { _x } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { getValueFromVariable, getPresetVariableFromValue } from './utils';\nimport { getValueFromObjectPath, setImmutably } from '../../utils/object';\nimport { GlobalStylesContext } from './context';\nimport { unlock } from '../../lock-unlock';\n\nconst EMPTY_CONFIG = { settings: {}, styles: {} };\n\nconst VALID_SETTINGS = [\n\t'appearanceTools',\n\t'useRootPaddingAwareAlignments',\n\t'background.backgroundImage',\n\t'background.backgroundRepeat',\n\t'background.backgroundSize',\n\t'background.backgroundPosition',\n\t'border.color',\n\t'border.radius',\n\t'border.style',\n\t'border.width',\n\t'border.radiusSizes',\n\t'shadow.presets',\n\t'shadow.defaultPresets',\n\t'color.background',\n\t'color.button',\n\t'color.caption',\n\t'color.custom',\n\t'color.customDuotone',\n\t'color.customGradient',\n\t'color.defaultDuotone',\n\t'color.defaultGradients',\n\t'color.defaultPalette',\n\t'color.duotone',\n\t'color.gradients',\n\t'color.heading',\n\t'color.link',\n\t'color.palette',\n\t'color.text',\n\t'custom',\n\t'dimensions.aspectRatio',\n\t'dimensions.minHeight',\n\t'layout.contentSize',\n\t'layout.definitions',\n\t'layout.wideSize',\n\t'lightbox.enabled',\n\t'lightbox.allowEditing',\n\t'position.fixed',\n\t'position.sticky',\n\t'spacing.customSpacingSize',\n\t'spacing.defaultSpacingSizes',\n\t'spacing.spacingSizes',\n\t'spacing.spacingScale',\n\t'spacing.blockGap',\n\t'spacing.margin',\n\t'spacing.padding',\n\t'spacing.units',\n\t'typography.fluid',\n\t'typography.customFontSize',\n\t'typography.defaultFontSizes',\n\t'typography.dropCap',\n\t'typography.fontFamilies',\n\t'typography.fontSizes',\n\t'typography.fontStyle',\n\t'typography.fontWeight',\n\t'typography.letterSpacing',\n\t'typography.lineHeight',\n\t'typography.textAlign',\n\t'typography.textColumns',\n\t'typography.textDecoration',\n\t'typography.textTransform',\n\t'typography.writingMode',\n];\n\nexport const useGlobalStylesReset = () => {\n\tconst { user, setUserConfig } = useContext( GlobalStylesContext );\n\tconst config = {\n\t\tsettings: user.settings,\n\t\tstyles: user.styles,\n\t};\n\tconst canReset = !! config && ! fastDeepEqual( config, EMPTY_CONFIG );\n\treturn [\n\t\tcanReset,\n\t\tuseCallback( () => setUserConfig( EMPTY_CONFIG ), [ setUserConfig ] ),\n\t];\n};\n\nexport function useGlobalSetting( propertyPath, blockName, source = 'all' ) {\n\tconst { setUserConfig, ...configs } = useContext( GlobalStylesContext );\n\tconst appendedBlockPath = blockName ? '.blocks.' + blockName : '';\n\tconst appendedPropertyPath = propertyPath ? '.' + propertyPath : '';\n\tconst contextualPath = `settings${ appendedBlockPath }${ appendedPropertyPath }`;\n\tconst globalPath = `settings${ appendedPropertyPath }`;\n\tconst sourceKey = source === 'all' ? 'merged' : source;\n\n\tconst settingValue = useMemo( () => {\n\t\tconst configToUse = configs[ sourceKey ];\n\t\tif ( ! configToUse ) {\n\t\t\tthrow 'Unsupported source';\n\t\t}\n\n\t\tif ( propertyPath ) {\n\t\t\treturn (\n\t\t\t\tgetValueFromObjectPath( configToUse, contextualPath ) ??\n\t\t\t\tgetValueFromObjectPath( configToUse, globalPath )\n\t\t\t);\n\t\t}\n\n\t\tlet result = {};\n\t\tVALID_SETTINGS.forEach( ( setting ) => {\n\t\t\tconst value =\n\t\t\t\tgetValueFromObjectPath(\n\t\t\t\t\tconfigToUse,\n\t\t\t\t\t`settings${ appendedBlockPath }.${ setting }`\n\t\t\t\t) ??\n\t\t\t\tgetValueFromObjectPath( configToUse, `settings.${ setting }` );\n\t\t\tif ( value !== undefined ) {\n\t\t\t\tresult = setImmutably( result, setting.split( '.' ), value );\n\t\t\t}\n\t\t} );\n\t\treturn result;\n\t}, [\n\t\tconfigs,\n\t\tsourceKey,\n\t\tpropertyPath,\n\t\tcontextualPath,\n\t\tglobalPath,\n\t\tappendedBlockPath,\n\t] );\n\n\tconst setSetting = ( newValue ) => {\n\t\tsetUserConfig( ( currentConfig ) =>\n\t\t\tsetImmutably( currentConfig, contextualPath.split( '.' ), newValue )\n\t\t);\n\t};\n\treturn [ settingValue, setSetting ];\n}\n\nexport function useGlobalStyle(\n\tpath,\n\tblockName,\n\tsource = 'all',\n\t{ shouldDecodeEncode = true } = {}\n) {\n\tconst {\n\t\tmerged: mergedConfig,\n\t\tbase: baseConfig,\n\t\tuser: userConfig,\n\t\tsetUserConfig,\n\t} = useContext( GlobalStylesContext );\n\tconst appendedPath = path ? '.' + path : '';\n\tconst finalPath = ! blockName\n\t\t? `styles${ appendedPath }`\n\t\t: `styles.blocks.${ blockName }${ appendedPath }`;\n\n\tconst setStyle = ( newValue ) => {\n\t\tsetUserConfig( ( currentConfig ) =>\n\t\t\tsetImmutably(\n\t\t\t\tcurrentConfig,\n\t\t\t\tfinalPath.split( '.' ),\n\t\t\t\tshouldDecodeEncode\n\t\t\t\t\t? getPresetVariableFromValue(\n\t\t\t\t\t\t\tmergedConfig.settings,\n\t\t\t\t\t\t\tblockName,\n\t\t\t\t\t\t\tpath,\n\t\t\t\t\t\t\tnewValue\n\t\t\t\t\t )\n\t\t\t\t\t: newValue\n\t\t\t)\n\t\t);\n\t};\n\n\tlet rawResult, result;\n\tswitch ( source ) {\n\t\tcase 'all':\n\t\t\trawResult = getValueFromObjectPath( mergedConfig, finalPath );\n\t\t\tresult = shouldDecodeEncode\n\t\t\t\t? getValueFromVariable( mergedConfig, blockName, rawResult )\n\t\t\t\t: rawResult;\n\t\t\tbreak;\n\t\tcase 'user':\n\t\t\trawResult = getValueFromObjectPath( userConfig, finalPath );\n\t\t\tresult = shouldDecodeEncode\n\t\t\t\t? getValueFromVariable( mergedConfig, blockName, rawResult )\n\t\t\t\t: rawResult;\n\t\t\tbreak;\n\t\tcase 'base':\n\t\t\trawResult = getValueFromObjectPath( baseConfig, finalPath );\n\t\t\tresult = shouldDecodeEncode\n\t\t\t\t? getValueFromVariable( baseConfig, blockName, rawResult )\n\t\t\t\t: rawResult;\n\t\t\tbreak;\n\t\tdefault:\n\t\t\tthrow 'Unsupported source';\n\t}\n\n\treturn [ result, setStyle ];\n}\n\n/**\n * React hook that overrides a global settings object with block and element specific settings.\n *\n * @param {Object} parentSettings Settings object.\n * @param {blockName?} blockName Block name.\n * @param {element?} element Element name.\n *\n * @return {Object} Merge of settings and supports.\n */\nexport function useSettingsForBlockElement(\n\tparentSettings,\n\tblockName,\n\telement\n) {\n\tconst { supportedStyles, supports } = useSelect(\n\t\t( select ) => {\n\t\t\treturn {\n\t\t\t\tsupportedStyles: unlock(\n\t\t\t\t\tselect( blocksStore )\n\t\t\t\t).getSupportedStyles( blockName, element ),\n\t\t\t\tsupports:\n\t\t\t\t\tselect( blocksStore ).getBlockType( blockName )?.supports,\n\t\t\t};\n\t\t},\n\t\t[ blockName, element ]\n\t);\n\n\treturn useMemo( () => {\n\t\tconst updatedSettings = { ...parentSettings };\n\n\t\tif ( ! supportedStyles.includes( 'fontSize' ) ) {\n\t\t\tupdatedSettings.typography = {\n\t\t\t\t...updatedSettings.typography,\n\t\t\t\tfontSizes: {},\n\t\t\t\tcustomFontSize: false,\n\t\t\t\tdefaultFontSizes: false,\n\t\t\t};\n\t\t}\n\n\t\tif ( ! supportedStyles.includes( 'fontFamily' ) ) {\n\t\t\tupdatedSettings.typography = {\n\t\t\t\t...updatedSettings.typography,\n\t\t\t\tfontFamilies: {},\n\t\t\t};\n\t\t}\n\n\t\tupdatedSettings.color = {\n\t\t\t...updatedSettings.color,\n\t\t\ttext:\n\t\t\t\tupdatedSettings.color?.text &&\n\t\t\t\tsupportedStyles.includes( 'color' ),\n\t\t\tbackground:\n\t\t\t\tupdatedSettings.color?.background &&\n\t\t\t\t( supportedStyles.includes( 'background' ) ||\n\t\t\t\t\tsupportedStyles.includes( 'backgroundColor' ) ),\n\t\t\tbutton:\n\t\t\t\tupdatedSettings.color?.button &&\n\t\t\t\tsupportedStyles.includes( 'buttonColor' ),\n\t\t\theading:\n\t\t\t\tupdatedSettings.color?.heading &&\n\t\t\t\tsupportedStyles.includes( 'headingColor' ),\n\t\t\tlink:\n\t\t\t\tupdatedSettings.color?.link &&\n\t\t\t\tsupportedStyles.includes( 'linkColor' ),\n\t\t\tcaption:\n\t\t\t\tupdatedSettings.color?.caption &&\n\t\t\t\tsupportedStyles.includes( 'captionColor' ),\n\t\t};\n\n\t\t// Some blocks can enable background colors but disable gradients.\n\t\tif ( ! supportedStyles.includes( 'background' ) ) {\n\t\t\tupdatedSettings.color.gradients = [];\n\t\t\tupdatedSettings.color.customGradient = false;\n\t\t}\n\n\t\t// If filters are not supported by the block/element, disable duotone.\n\t\tif ( ! supportedStyles.includes( 'filter' ) ) {\n\t\t\tupdatedSettings.color.defaultDuotone = false;\n\t\t\tupdatedSettings.color.customDuotone = false;\n\t\t}\n\n\t\t[\n\t\t\t'lineHeight',\n\t\t\t'fontStyle',\n\t\t\t'fontWeight',\n\t\t\t'letterSpacing',\n\t\t\t'textAlign',\n\t\t\t'textTransform',\n\t\t\t'textDecoration',\n\t\t\t'writingMode',\n\t\t].forEach( ( key ) => {\n\t\t\tif ( ! supportedStyles.includes( key ) ) {\n\t\t\t\tupdatedSettings.typography = {\n\t\t\t\t\t...updatedSettings.typography,\n\t\t\t\t\t[ key ]: false,\n\t\t\t\t};\n\t\t\t}\n\t\t} );\n\n\t\t// The column-count style is named text column to reduce confusion with\n\t\t// the columns block and manage expectations from the support.\n\t\t// See: https://github.com/WordPress/gutenberg/pull/33587\n\t\tif ( ! supportedStyles.includes( 'columnCount' ) ) {\n\t\t\tupdatedSettings.typography = {\n\t\t\t\t...updatedSettings.typography,\n\t\t\t\ttextColumns: false,\n\t\t\t};\n\t\t}\n\n\t\t[ 'contentSize', 'wideSize' ].forEach( ( key ) => {\n\t\t\tif ( ! supportedStyles.includes( key ) ) {\n\t\t\t\tupdatedSettings.layout = {\n\t\t\t\t\t...updatedSettings.layout,\n\t\t\t\t\t[ key ]: false,\n\t\t\t\t};\n\t\t\t}\n\t\t} );\n\n\t\t[ 'padding', 'margin', 'blockGap' ].forEach( ( key ) => {\n\t\t\tif ( ! supportedStyles.includes( key ) ) {\n\t\t\t\tupdatedSettings.spacing = {\n\t\t\t\t\t...updatedSettings.spacing,\n\t\t\t\t\t[ key ]: false,\n\t\t\t\t};\n\t\t\t}\n\n\t\t\tconst sides = Array.isArray( supports?.spacing?.[ key ] )\n\t\t\t\t? supports?.spacing?.[ key ]\n\t\t\t\t: supports?.spacing?.[ key ]?.sides;\n\t\t\t// Check if spacing type is supported before adding sides.\n\t\t\tif ( sides?.length && updatedSettings.spacing?.[ key ] ) {\n\t\t\t\tupdatedSettings.spacing = {\n\t\t\t\t\t...updatedSettings.spacing,\n\t\t\t\t\t[ key ]: {\n\t\t\t\t\t\t...updatedSettings.spacing?.[ key ],\n\t\t\t\t\t\tsides,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t}\n\t\t} );\n\n\t\t[ 'aspectRatio', 'minHeight' ].forEach( ( key ) => {\n\t\t\tif ( ! supportedStyles.includes( key ) ) {\n\t\t\t\tupdatedSettings.dimensions = {\n\t\t\t\t\t...updatedSettings.dimensions,\n\t\t\t\t\t[ key ]: false,\n\t\t\t\t};\n\t\t\t}\n\t\t} );\n\n\t\t[ 'radius', 'color', 'style', 'width' ].forEach( ( key ) => {\n\t\t\tif (\n\t\t\t\t! supportedStyles.includes(\n\t\t\t\t\t'border' + key.charAt( 0 ).toUpperCase() + key.slice( 1 )\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tupdatedSettings.border = {\n\t\t\t\t\t...updatedSettings.border,\n\t\t\t\t\t[ key ]: false,\n\t\t\t\t};\n\t\t\t}\n\t\t} );\n\n\t\t[ 'backgroundImage', 'backgroundSize' ].forEach( ( key ) => {\n\t\t\tif ( ! supportedStyles.includes( key ) ) {\n\t\t\t\tupdatedSettings.background = {\n\t\t\t\t\t...updatedSettings.background,\n\t\t\t\t\t[ key ]: false,\n\t\t\t\t};\n\t\t\t}\n\t\t} );\n\n\t\tupdatedSettings.shadow = supportedStyles.includes( 'shadow' )\n\t\t\t? updatedSettings.shadow\n\t\t\t: false;\n\n\t\t// Text alignment is only available for blocks.\n\t\tif ( element ) {\n\t\t\tupdatedSettings.typography.textAlign = false;\n\t\t}\n\n\t\treturn updatedSettings;\n\t}, [ parentSettings, supportedStyles, supports, element ] );\n}\n\nexport function useColorsPerOrigin( settings ) {\n\tconst customColors = settings?.color?.palette?.custom;\n\tconst themeColors = settings?.color?.palette?.theme;\n\tconst defaultColors = settings?.color?.palette?.default;\n\tconst shouldDisplayDefaultColors = settings?.color?.defaultPalette;\n\n\treturn useMemo( () => {\n\t\tconst result = [];\n\t\tif ( themeColors && themeColors.length ) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Theme',\n\t\t\t\t\t'Indicates this palette comes from the theme.'\n\t\t\t\t),\n\t\t\t\tcolors: themeColors,\n\t\t\t} );\n\t\t}\n\t\tif (\n\t\t\tshouldDisplayDefaultColors &&\n\t\t\tdefaultColors &&\n\t\t\tdefaultColors.length\n\t\t) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Default',\n\t\t\t\t\t'Indicates this palette comes from WordPress.'\n\t\t\t\t),\n\t\t\t\tcolors: defaultColors,\n\t\t\t} );\n\t\t}\n\t\tif ( customColors && customColors.length ) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Custom',\n\t\t\t\t\t'Indicates this palette is created by the user.'\n\t\t\t\t),\n\t\t\t\tcolors: customColors,\n\t\t\t} );\n\t\t}\n\t\treturn result;\n\t}, [\n\t\tcustomColors,\n\t\tthemeColors,\n\t\tdefaultColors,\n\t\tshouldDisplayDefaultColors,\n\t] );\n}\n\nexport function useGradientsPerOrigin( settings ) {\n\tconst customGradients = settings?.color?.gradients?.custom;\n\tconst themeGradients = settings?.color?.gradients?.theme;\n\tconst defaultGradients = settings?.color?.gradients?.default;\n\tconst shouldDisplayDefaultGradients = settings?.color?.defaultGradients;\n\n\treturn useMemo( () => {\n\t\tconst result = [];\n\t\tif ( themeGradients && themeGradients.length ) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Theme',\n\t\t\t\t\t'Indicates this palette comes from the theme.'\n\t\t\t\t),\n\t\t\t\tgradients: themeGradients,\n\t\t\t} );\n\t\t}\n\t\tif (\n\t\t\tshouldDisplayDefaultGradients &&\n\t\t\tdefaultGradients &&\n\t\t\tdefaultGradients.length\n\t\t) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Default',\n\t\t\t\t\t'Indicates this palette comes from WordPress.'\n\t\t\t\t),\n\t\t\t\tgradients: defaultGradients,\n\t\t\t} );\n\t\t}\n\t\tif ( customGradients && customGradients.length ) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Custom',\n\t\t\t\t\t'Indicates this palette is created by the user.'\n\t\t\t\t),\n\t\t\t\tgradients: customGradients,\n\t\t\t} );\n\t\t}\n\t\treturn result;\n\t}, [\n\t\tcustomGradients,\n\t\tthemeGradients,\n\t\tdefaultGradients,\n\t\tshouldDisplayDefaultGradients,\n\t] );\n}\n"],
|
|
5
|
-
"mappings": "AAGA,OAAO,mBAAmB;AAK1B,SAAS,YAAY,aAAa,eAAe;AACjD,SAAS,iBAAiB;AAC1B,SAAS,SAAS,mBAAmB;AACrC,SAAS,UAAU;
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport fastDeepEqual from 'fast-deep-equal/es6';\n\n/**\n * WordPress dependencies\n */\nimport { useContext, useCallback, useMemo } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { _x } from '@wordpress/i18n';\nimport {\n\tgetSetting,\n\tgetStyle,\n\tgetPresetVariableFromValue,\n} from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport { setImmutably } from '../../utils/object';\nimport { GlobalStylesContext } from './context';\nimport { unlock } from '../../lock-unlock';\n\nconst EMPTY_CONFIG = { settings: {}, styles: {} };\n\nexport const useGlobalStylesReset = () => {\n\tconst { user, setUserConfig } = useContext( GlobalStylesContext );\n\tconst config = {\n\t\tsettings: user.settings,\n\t\tstyles: user.styles,\n\t};\n\tconst canReset = !! config && ! fastDeepEqual( config, EMPTY_CONFIG );\n\treturn [\n\t\tcanReset,\n\t\tuseCallback( () => setUserConfig( EMPTY_CONFIG ), [ setUserConfig ] ),\n\t];\n};\n\nexport function useGlobalSetting( propertyPath, blockName, source = 'all' ) {\n\tconst { setUserConfig, ...configs } = useContext( GlobalStylesContext );\n\tconst appendedBlockPath = blockName ? '.blocks.' + blockName : '';\n\tconst appendedPropertyPath = propertyPath ? '.' + propertyPath : '';\n\tconst contextualPath = `settings${ appendedBlockPath }${ appendedPropertyPath }`;\n\tconst sourceKey = source === 'all' ? 'merged' : source;\n\n\tconst settingValue = useMemo( () => {\n\t\tconst configToUse = configs[ sourceKey ];\n\t\tif ( ! configToUse ) {\n\t\t\tthrow 'Unsupported source';\n\t\t}\n\n\t\t// Use engine's getSetting instead of duplicating logic\n\t\treturn getSetting( configToUse, propertyPath, blockName );\n\t}, [ configs, sourceKey, propertyPath, blockName ] );\n\n\tconst setSetting = ( newValue ) => {\n\t\tsetUserConfig( ( currentConfig ) =>\n\t\t\tsetImmutably( currentConfig, contextualPath.split( '.' ), newValue )\n\t\t);\n\t};\n\treturn [ settingValue, setSetting ];\n}\n\nexport function useGlobalStyle(\n\tpath,\n\tblockName,\n\tsource = 'all',\n\t{ shouldDecodeEncode = true } = {}\n) {\n\tconst {\n\t\tmerged: mergedConfig,\n\t\tbase: baseConfig,\n\t\tuser: userConfig,\n\t\tsetUserConfig,\n\t} = useContext( GlobalStylesContext );\n\tconst appendedPath = path ? '.' + path : '';\n\tconst finalPath = ! blockName\n\t\t? `styles${ appendedPath }`\n\t\t: `styles.blocks.${ blockName }${ appendedPath }`;\n\n\tconst setStyle = ( newValue ) => {\n\t\tsetUserConfig( ( currentConfig ) =>\n\t\t\tsetImmutably(\n\t\t\t\tcurrentConfig,\n\t\t\t\tfinalPath.split( '.' ),\n\t\t\t\tshouldDecodeEncode\n\t\t\t\t\t? getPresetVariableFromValue(\n\t\t\t\t\t\t\tmergedConfig.settings,\n\t\t\t\t\t\t\tblockName,\n\t\t\t\t\t\t\tpath,\n\t\t\t\t\t\t\tnewValue\n\t\t\t\t\t )\n\t\t\t\t\t: newValue\n\t\t\t)\n\t\t);\n\t};\n\n\tlet result;\n\t// Use engine's getStyle instead of duplicating logic\n\tswitch ( source ) {\n\t\tcase 'all':\n\t\t\tresult = getStyle(\n\t\t\t\tmergedConfig,\n\t\t\t\tpath,\n\t\t\t\tblockName,\n\t\t\t\tshouldDecodeEncode\n\t\t\t);\n\t\t\tbreak;\n\t\tcase 'user':\n\t\t\tresult = getStyle(\n\t\t\t\tuserConfig,\n\t\t\t\tpath,\n\t\t\t\tblockName,\n\t\t\t\tshouldDecodeEncode\n\t\t\t);\n\t\t\tbreak;\n\t\tcase 'base':\n\t\t\tresult = getStyle(\n\t\t\t\tbaseConfig,\n\t\t\t\tpath,\n\t\t\t\tblockName,\n\t\t\t\tshouldDecodeEncode\n\t\t\t);\n\t\t\tbreak;\n\t\tdefault:\n\t\t\tthrow 'Unsupported source';\n\t}\n\n\treturn [ result, setStyle ];\n}\n\n/**\n * React hook that overrides a global settings object with block and element specific settings.\n *\n * @param {Object} parentSettings Settings object.\n * @param {blockName?} blockName Block name.\n * @param {element?} element Element name.\n *\n * @return {Object} Merge of settings and supports.\n */\nexport function useSettingsForBlockElement(\n\tparentSettings,\n\tblockName,\n\telement\n) {\n\tconst { supportedStyles, supports } = useSelect(\n\t\t( select ) => {\n\t\t\treturn {\n\t\t\t\tsupportedStyles: unlock(\n\t\t\t\t\tselect( blocksStore )\n\t\t\t\t).getSupportedStyles( blockName, element ),\n\t\t\t\tsupports:\n\t\t\t\t\tselect( blocksStore ).getBlockType( blockName )?.supports,\n\t\t\t};\n\t\t},\n\t\t[ blockName, element ]\n\t);\n\n\treturn useMemo( () => {\n\t\tconst updatedSettings = { ...parentSettings };\n\n\t\tif ( ! supportedStyles.includes( 'fontSize' ) ) {\n\t\t\tupdatedSettings.typography = {\n\t\t\t\t...updatedSettings.typography,\n\t\t\t\tfontSizes: {},\n\t\t\t\tcustomFontSize: false,\n\t\t\t\tdefaultFontSizes: false,\n\t\t\t};\n\t\t}\n\n\t\tif ( ! supportedStyles.includes( 'fontFamily' ) ) {\n\t\t\tupdatedSettings.typography = {\n\t\t\t\t...updatedSettings.typography,\n\t\t\t\tfontFamilies: {},\n\t\t\t};\n\t\t}\n\n\t\tupdatedSettings.color = {\n\t\t\t...updatedSettings.color,\n\t\t\ttext:\n\t\t\t\tupdatedSettings.color?.text &&\n\t\t\t\tsupportedStyles.includes( 'color' ),\n\t\t\tbackground:\n\t\t\t\tupdatedSettings.color?.background &&\n\t\t\t\t( supportedStyles.includes( 'background' ) ||\n\t\t\t\t\tsupportedStyles.includes( 'backgroundColor' ) ),\n\t\t\tbutton:\n\t\t\t\tupdatedSettings.color?.button &&\n\t\t\t\tsupportedStyles.includes( 'buttonColor' ),\n\t\t\theading:\n\t\t\t\tupdatedSettings.color?.heading &&\n\t\t\t\tsupportedStyles.includes( 'headingColor' ),\n\t\t\tlink:\n\t\t\t\tupdatedSettings.color?.link &&\n\t\t\t\tsupportedStyles.includes( 'linkColor' ),\n\t\t\tcaption:\n\t\t\t\tupdatedSettings.color?.caption &&\n\t\t\t\tsupportedStyles.includes( 'captionColor' ),\n\t\t};\n\n\t\t// Some blocks can enable background colors but disable gradients.\n\t\tif ( ! supportedStyles.includes( 'background' ) ) {\n\t\t\tupdatedSettings.color.gradients = [];\n\t\t\tupdatedSettings.color.customGradient = false;\n\t\t}\n\n\t\t// If filters are not supported by the block/element, disable duotone.\n\t\tif ( ! supportedStyles.includes( 'filter' ) ) {\n\t\t\tupdatedSettings.color.defaultDuotone = false;\n\t\t\tupdatedSettings.color.customDuotone = false;\n\t\t}\n\n\t\t[\n\t\t\t'lineHeight',\n\t\t\t'fontStyle',\n\t\t\t'fontWeight',\n\t\t\t'letterSpacing',\n\t\t\t'textAlign',\n\t\t\t'textTransform',\n\t\t\t'textDecoration',\n\t\t\t'writingMode',\n\t\t].forEach( ( key ) => {\n\t\t\tif ( ! supportedStyles.includes( key ) ) {\n\t\t\t\tupdatedSettings.typography = {\n\t\t\t\t\t...updatedSettings.typography,\n\t\t\t\t\t[ key ]: false,\n\t\t\t\t};\n\t\t\t}\n\t\t} );\n\n\t\t// The column-count style is named text column to reduce confusion with\n\t\t// the columns block and manage expectations from the support.\n\t\t// See: https://github.com/WordPress/gutenberg/pull/33587\n\t\tif ( ! supportedStyles.includes( 'columnCount' ) ) {\n\t\t\tupdatedSettings.typography = {\n\t\t\t\t...updatedSettings.typography,\n\t\t\t\ttextColumns: false,\n\t\t\t};\n\t\t}\n\n\t\t[ 'contentSize', 'wideSize' ].forEach( ( key ) => {\n\t\t\tif ( ! supportedStyles.includes( key ) ) {\n\t\t\t\tupdatedSettings.layout = {\n\t\t\t\t\t...updatedSettings.layout,\n\t\t\t\t\t[ key ]: false,\n\t\t\t\t};\n\t\t\t}\n\t\t} );\n\n\t\t[ 'padding', 'margin', 'blockGap' ].forEach( ( key ) => {\n\t\t\tif ( ! supportedStyles.includes( key ) ) {\n\t\t\t\tupdatedSettings.spacing = {\n\t\t\t\t\t...updatedSettings.spacing,\n\t\t\t\t\t[ key ]: false,\n\t\t\t\t};\n\t\t\t}\n\n\t\t\tconst sides = Array.isArray( supports?.spacing?.[ key ] )\n\t\t\t\t? supports?.spacing?.[ key ]\n\t\t\t\t: supports?.spacing?.[ key ]?.sides;\n\t\t\t// Check if spacing type is supported before adding sides.\n\t\t\tif ( sides?.length && updatedSettings.spacing?.[ key ] ) {\n\t\t\t\tupdatedSettings.spacing = {\n\t\t\t\t\t...updatedSettings.spacing,\n\t\t\t\t\t[ key ]: {\n\t\t\t\t\t\t...updatedSettings.spacing?.[ key ],\n\t\t\t\t\t\tsides,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t}\n\t\t} );\n\n\t\t[ 'aspectRatio', 'minHeight' ].forEach( ( key ) => {\n\t\t\tif ( ! supportedStyles.includes( key ) ) {\n\t\t\t\tupdatedSettings.dimensions = {\n\t\t\t\t\t...updatedSettings.dimensions,\n\t\t\t\t\t[ key ]: false,\n\t\t\t\t};\n\t\t\t}\n\t\t} );\n\n\t\t[ 'radius', 'color', 'style', 'width' ].forEach( ( key ) => {\n\t\t\tif (\n\t\t\t\t! supportedStyles.includes(\n\t\t\t\t\t'border' + key.charAt( 0 ).toUpperCase() + key.slice( 1 )\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tupdatedSettings.border = {\n\t\t\t\t\t...updatedSettings.border,\n\t\t\t\t\t[ key ]: false,\n\t\t\t\t};\n\t\t\t}\n\t\t} );\n\n\t\t[ 'backgroundImage', 'backgroundSize' ].forEach( ( key ) => {\n\t\t\tif ( ! supportedStyles.includes( key ) ) {\n\t\t\t\tupdatedSettings.background = {\n\t\t\t\t\t...updatedSettings.background,\n\t\t\t\t\t[ key ]: false,\n\t\t\t\t};\n\t\t\t}\n\t\t} );\n\n\t\tupdatedSettings.shadow = supportedStyles.includes( 'shadow' )\n\t\t\t? updatedSettings.shadow\n\t\t\t: false;\n\n\t\t// Text alignment is only available for blocks.\n\t\tif ( element ) {\n\t\t\tupdatedSettings.typography.textAlign = false;\n\t\t}\n\n\t\treturn updatedSettings;\n\t}, [ parentSettings, supportedStyles, supports, element ] );\n}\n\nexport function useColorsPerOrigin( settings ) {\n\tconst customColors = settings?.color?.palette?.custom;\n\tconst themeColors = settings?.color?.palette?.theme;\n\tconst defaultColors = settings?.color?.palette?.default;\n\tconst shouldDisplayDefaultColors = settings?.color?.defaultPalette;\n\n\treturn useMemo( () => {\n\t\tconst result = [];\n\t\tif ( themeColors && themeColors.length ) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Theme',\n\t\t\t\t\t'Indicates this palette comes from the theme.'\n\t\t\t\t),\n\t\t\t\tcolors: themeColors,\n\t\t\t} );\n\t\t}\n\t\tif (\n\t\t\tshouldDisplayDefaultColors &&\n\t\t\tdefaultColors &&\n\t\t\tdefaultColors.length\n\t\t) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Default',\n\t\t\t\t\t'Indicates this palette comes from WordPress.'\n\t\t\t\t),\n\t\t\t\tcolors: defaultColors,\n\t\t\t} );\n\t\t}\n\t\tif ( customColors && customColors.length ) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Custom',\n\t\t\t\t\t'Indicates this palette is created by the user.'\n\t\t\t\t),\n\t\t\t\tcolors: customColors,\n\t\t\t} );\n\t\t}\n\t\treturn result;\n\t}, [\n\t\tcustomColors,\n\t\tthemeColors,\n\t\tdefaultColors,\n\t\tshouldDisplayDefaultColors,\n\t] );\n}\n\nexport function useGradientsPerOrigin( settings ) {\n\tconst customGradients = settings?.color?.gradients?.custom;\n\tconst themeGradients = settings?.color?.gradients?.theme;\n\tconst defaultGradients = settings?.color?.gradients?.default;\n\tconst shouldDisplayDefaultGradients = settings?.color?.defaultGradients;\n\n\treturn useMemo( () => {\n\t\tconst result = [];\n\t\tif ( themeGradients && themeGradients.length ) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Theme',\n\t\t\t\t\t'Indicates this palette comes from the theme.'\n\t\t\t\t),\n\t\t\t\tgradients: themeGradients,\n\t\t\t} );\n\t\t}\n\t\tif (\n\t\t\tshouldDisplayDefaultGradients &&\n\t\t\tdefaultGradients &&\n\t\t\tdefaultGradients.length\n\t\t) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Default',\n\t\t\t\t\t'Indicates this palette comes from WordPress.'\n\t\t\t\t),\n\t\t\t\tgradients: defaultGradients,\n\t\t\t} );\n\t\t}\n\t\tif ( customGradients && customGradients.length ) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Custom',\n\t\t\t\t\t'Indicates this palette is created by the user.'\n\t\t\t\t),\n\t\t\t\tgradients: customGradients,\n\t\t\t} );\n\t\t}\n\t\treturn result;\n\t}, [\n\t\tcustomGradients,\n\t\tthemeGradients,\n\t\tdefaultGradients,\n\t\tshouldDisplayDefaultGradients,\n\t] );\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -4,14 +4,6 @@ import {
|
|
|
4
4
|
useGlobalStyle,
|
|
5
5
|
useSettingsForBlockElement
|
|
6
6
|
} from "./hooks";
|
|
7
|
-
import { getBlockCSSSelector } from "./get-block-css-selector";
|
|
8
|
-
import {
|
|
9
|
-
getLayoutStyles,
|
|
10
|
-
getBlockSelectors,
|
|
11
|
-
toStyles,
|
|
12
|
-
useGlobalStylesOutput,
|
|
13
|
-
useGlobalStylesOutputWithConfig
|
|
14
|
-
} from "./use-global-styles-output";
|
|
15
7
|
import { GlobalStylesContext } from "./context";
|
|
16
8
|
import {
|
|
17
9
|
default as default2,
|
|
@@ -50,15 +42,9 @@ export {
|
|
|
50
42
|
default7 as ImageSettingsPanel,
|
|
51
43
|
default2 as TypographyPanel,
|
|
52
44
|
areGlobalStyleConfigsEqual,
|
|
53
|
-
getBlockCSSSelector,
|
|
54
|
-
getBlockSelectors,
|
|
55
45
|
default10 as getGlobalStylesChanges,
|
|
56
|
-
getLayoutStyles,
|
|
57
|
-
toStyles,
|
|
58
46
|
useGlobalSetting,
|
|
59
47
|
useGlobalStyle,
|
|
60
|
-
useGlobalStylesOutput,
|
|
61
|
-
useGlobalStylesOutputWithConfig,
|
|
62
48
|
useGlobalStylesReset,
|
|
63
49
|
useHasBackgroundPanel,
|
|
64
50
|
useHasBorderPanel,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/global-styles/index.js"],
|
|
4
|
-
"sourcesContent": ["export {\n\tuseGlobalStylesReset,\n\tuseGlobalSetting,\n\tuseGlobalStyle,\n\tuseSettingsForBlockElement,\n} from './hooks';\nexport {
|
|
5
|
-
"mappings": "AAAA;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,2BAA2B;AACpC;AAAA,
|
|
4
|
+
"sourcesContent": ["export {\n\tuseGlobalStylesReset,\n\tuseGlobalSetting,\n\tuseGlobalStyle,\n\tuseSettingsForBlockElement,\n} from './hooks';\nexport { GlobalStylesContext } from './context';\nexport {\n\tdefault as TypographyPanel,\n\tuseHasTypographyPanel,\n} from './typography-panel';\nexport {\n\tdefault as DimensionsPanel,\n\tuseHasDimensionsPanel,\n} from './dimensions-panel';\nexport {\n\tdefault as BorderPanel,\n\tuseHasBorderPanel,\n\tuseHasBorderPanelControls,\n} from './border-panel';\nexport { default as ColorPanel, useHasColorPanel } from './color-panel';\nexport { default as FiltersPanel, useHasFiltersPanel } from './filters-panel';\nexport {\n\tdefault as ImageSettingsPanel,\n\tuseHasImageSettingsPanel,\n} from './image-settings-panel';\nexport { default as AdvancedPanel } from './advanced-panel';\nexport {\n\tdefault as BackgroundPanel,\n\tuseHasBackgroundPanel,\n} from './background-panel';\nexport { areGlobalStyleConfigsEqual } from './utils';\nexport { default as getGlobalStylesChanges } from './get-global-styles-changes';\n"],
|
|
5
|
+
"mappings": "AAAA;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,2BAA2B;AACpC;AAAA,EACY,WAAXA;AAAA,EACA;AAAA,OACM;AACP;AAAA,EACY,WAAXA;AAAA,EACA;AAAA,OACM;AACP;AAAA,EACY,WAAXA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAoB,WAAXA,UAAuB,wBAAwB;AACxD,SAAoB,WAAXA,UAAyB,0BAA0B;AAC5D;AAAA,EACY,WAAXA;AAAA,EACA;AAAA,OACM;AACP,SAAoB,WAAXA,gBAAgC;AACzC;AAAA,EACY,WAAXA;AAAA,EACA;AAAA,OACM;AACP,SAAS,kCAAkC;AAC3C,SAAoB,WAAXA,iBAAyC;",
|
|
6
6
|
"names": ["default"]
|
|
7
7
|
}
|
|
@@ -7,6 +7,7 @@ import {
|
|
|
7
7
|
} from "@wordpress/components";
|
|
8
8
|
import { __ } from "@wordpress/i18n";
|
|
9
9
|
import { useCallback, useMemo, useEffect } from "@wordpress/element";
|
|
10
|
+
import { getValueFromVariable } from "@wordpress/global-styles-engine";
|
|
10
11
|
import FontFamilyControl from "../font-family";
|
|
11
12
|
import FontAppearanceControl from "../font-appearance-control";
|
|
12
13
|
import LineHeightControl from "../line-height-control";
|
|
@@ -15,7 +16,7 @@ import TextAlignmentControl from "../text-alignment-control";
|
|
|
15
16
|
import TextTransformControl from "../text-transform-control";
|
|
16
17
|
import TextDecorationControl from "../text-decoration-control";
|
|
17
18
|
import WritingModeControl from "../writing-mode-control";
|
|
18
|
-
import {
|
|
19
|
+
import { useToolsPanelDropdownMenuProps } from "./utils";
|
|
19
20
|
import { setImmutably } from "../../utils/object";
|
|
20
21
|
import {
|
|
21
22
|
getMergedFontFamiliesAndFontFamilyFaces,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/global-styles/typography-panel.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tFontSizePicker,\n\t__experimentalNumberControl as NumberControl,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useCallback, useMemo, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport FontFamilyControl from '../font-family';\nimport FontAppearanceControl from '../font-appearance-control';\nimport LineHeightControl from '../line-height-control';\nimport LetterSpacingControl from '../letter-spacing-control';\nimport TextAlignmentControl from '../text-alignment-control';\nimport TextTransformControl from '../text-transform-control';\nimport TextDecorationControl from '../text-decoration-control';\nimport WritingModeControl from '../writing-mode-control';\nimport { getValueFromVariable, useToolsPanelDropdownMenuProps } from './utils';\nimport { setImmutably } from '../../utils/object';\nimport {\n\tgetMergedFontFamiliesAndFontFamilyFaces,\n\tfindNearestStyleAndWeight,\n} from './typography-utils';\n\nconst MIN_TEXT_COLUMNS = 1;\nconst MAX_TEXT_COLUMNS = 6;\n\nexport function useHasTypographyPanel( settings ) {\n\tconst hasFontFamily = useHasFontFamilyControl( settings );\n\tconst hasLineHeight = useHasLineHeightControl( settings );\n\tconst hasFontAppearance = useHasAppearanceControl( settings );\n\tconst hasLetterSpacing = useHasLetterSpacingControl( settings );\n\tconst hasTextAlign = useHasTextAlignmentControl( settings );\n\tconst hasTextTransform = useHasTextTransformControl( settings );\n\tconst hasTextDecoration = useHasTextDecorationControl( settings );\n\tconst hasWritingMode = useHasWritingModeControl( settings );\n\tconst hasTextColumns = useHasTextColumnsControl( settings );\n\tconst hasFontSize = useHasFontSizeControl( settings );\n\n\treturn (\n\t\thasFontFamily ||\n\t\thasLineHeight ||\n\t\thasFontAppearance ||\n\t\thasLetterSpacing ||\n\t\thasTextAlign ||\n\t\thasTextTransform ||\n\t\thasFontSize ||\n\t\thasTextDecoration ||\n\t\thasWritingMode ||\n\t\thasTextColumns\n\t);\n}\n\nfunction useHasFontSizeControl( settings ) {\n\treturn (\n\t\t( settings?.typography?.defaultFontSizes !== false &&\n\t\t\tsettings?.typography?.fontSizes?.default?.length ) ||\n\t\tsettings?.typography?.fontSizes?.theme?.length ||\n\t\tsettings?.typography?.fontSizes?.custom?.length ||\n\t\tsettings?.typography?.customFontSize\n\t);\n}\n\nfunction useHasFontFamilyControl( settings ) {\n\treturn [ 'default', 'theme', 'custom' ].some(\n\t\t( key ) => settings?.typography?.fontFamilies?.[ key ]?.length\n\t);\n}\n\nfunction useHasLineHeightControl( settings ) {\n\treturn settings?.typography?.lineHeight;\n}\n\nfunction useHasAppearanceControl( settings ) {\n\treturn settings?.typography?.fontStyle || settings?.typography?.fontWeight;\n}\n\nfunction useAppearanceControlLabel( settings ) {\n\tif ( ! settings?.typography?.fontStyle ) {\n\t\treturn __( 'Font weight' );\n\t}\n\tif ( ! settings?.typography?.fontWeight ) {\n\t\treturn __( 'Font style' );\n\t}\n\treturn __( 'Appearance' );\n}\n\nfunction useHasLetterSpacingControl( settings ) {\n\treturn settings?.typography?.letterSpacing;\n}\n\nfunction useHasTextTransformControl( settings ) {\n\treturn settings?.typography?.textTransform;\n}\n\nfunction useHasTextAlignmentControl( settings ) {\n\treturn settings?.typography?.textAlign;\n}\n\nfunction useHasTextDecorationControl( settings ) {\n\treturn settings?.typography?.textDecoration;\n}\n\nfunction useHasWritingModeControl( settings ) {\n\treturn settings?.typography?.writingMode;\n}\n\nfunction useHasTextColumnsControl( settings ) {\n\treturn settings?.typography?.textColumns;\n}\n\n/**\n * Concatenate all the font sizes into a single list for the font size picker.\n *\n * @param {Object} settings The global styles settings.\n *\n * @return {Array} The merged font sizes.\n */\nfunction getMergedFontSizes( settings ) {\n\tconst fontSizes = settings?.typography?.fontSizes;\n\tconst defaultFontSizesEnabled = !! settings?.typography?.defaultFontSizes;\n\treturn [\n\t\t...( fontSizes?.custom ?? [] ),\n\t\t...( fontSizes?.theme ?? [] ),\n\t\t...( defaultFontSizesEnabled ? fontSizes?.default ?? [] : [] ),\n\t];\n}\n\nfunction TypographyToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n} ) {\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ __( 'Typography' ) }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanel>\n\t);\n}\n\nconst DEFAULT_CONTROLS = {\n\tfontFamily: true,\n\tfontSize: true,\n\tfontAppearance: true,\n\tlineHeight: true,\n\tletterSpacing: true,\n\ttextAlign: true,\n\ttextTransform: true,\n\ttextDecoration: true,\n\twritingMode: true,\n\ttextColumns: true,\n};\n\nexport default function TypographyPanel( {\n\tas: Wrapper = TypographyToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tdefaultControls = DEFAULT_CONTROLS,\n} ) {\n\tconst decodeValue = ( rawValue ) =>\n\t\tgetValueFromVariable( { settings }, '', rawValue );\n\n\t// Font Family\n\tconst hasFontFamilyEnabled = useHasFontFamilyControl( settings );\n\tconst fontFamily = decodeValue( inheritedValue?.typography?.fontFamily );\n\tconst { fontFamilies, fontFamilyFaces } = useMemo( () => {\n\t\treturn getMergedFontFamiliesAndFontFamilyFaces( settings, fontFamily );\n\t}, [ settings, fontFamily ] );\n\n\tconst setFontFamily = ( newValue ) => {\n\t\tconst slug = fontFamilies?.find(\n\t\t\t( { fontFamily: f } ) => f === newValue\n\t\t)?.slug;\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'fontFamily' ],\n\t\t\t\tslug\n\t\t\t\t\t? `var:preset|font-family|${ slug }`\n\t\t\t\t\t: newValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasFontFamily = () => !! value?.typography?.fontFamily;\n\tconst resetFontFamily = () => setFontFamily( undefined );\n\n\t// Font Size\n\tconst hasFontSizeEnabled = useHasFontSizeControl( settings );\n\tconst disableCustomFontSizes = ! settings?.typography?.customFontSize;\n\tconst mergedFontSizes = getMergedFontSizes( settings );\n\n\tconst fontSize = decodeValue( inheritedValue?.typography?.fontSize );\n\tconst setFontSize = ( newValue, metadata ) => {\n\t\tconst actualValue = !! metadata?.slug\n\t\t\t? `var:preset|font-size|${ metadata?.slug }`\n\t\t\t: newValue;\n\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'fontSize' ],\n\t\t\t\tactualValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasFontSize = () => !! value?.typography?.fontSize;\n\tconst resetFontSize = () => setFontSize( undefined );\n\n\t// Appearance\n\tconst hasAppearanceControl = useHasAppearanceControl( settings );\n\tconst appearanceControlLabel = useAppearanceControlLabel( settings );\n\tconst hasFontStyles = settings?.typography?.fontStyle;\n\tconst hasFontWeights = settings?.typography?.fontWeight;\n\tconst fontStyle = decodeValue( inheritedValue?.typography?.fontStyle );\n\tconst fontWeight = decodeValue( inheritedValue?.typography?.fontWeight );\n\tconst { nearestFontStyle, nearestFontWeight } = findNearestStyleAndWeight(\n\t\tfontFamilyFaces,\n\t\tfontStyle,\n\t\tfontWeight\n\t);\n\tconst setFontAppearance = useCallback(\n\t\t( { fontStyle: newFontStyle, fontWeight: newFontWeight } ) => {\n\t\t\t// Only update the font style and weight if they have changed.\n\t\t\tif ( newFontStyle !== fontStyle || newFontWeight !== fontWeight ) {\n\t\t\t\tonChange( {\n\t\t\t\t\t...value,\n\t\t\t\t\ttypography: {\n\t\t\t\t\t\t...value?.typography,\n\t\t\t\t\t\tfontStyle: newFontStyle || undefined,\n\t\t\t\t\t\tfontWeight: newFontWeight || undefined,\n\t\t\t\t\t},\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\t\t[ fontStyle, fontWeight, onChange, value ]\n\t);\n\tconst hasFontAppearance = () =>\n\t\t!! value?.typography?.fontStyle || !! value?.typography?.fontWeight;\n\tconst resetFontAppearance = useCallback( () => {\n\t\tsetFontAppearance( {} );\n\t}, [ setFontAppearance ] );\n\n\t// Check if previous font style and weight values are available in the new font family.\n\tuseEffect( () => {\n\t\tif ( nearestFontStyle && nearestFontWeight ) {\n\t\t\tsetFontAppearance( {\n\t\t\t\tfontStyle: nearestFontStyle,\n\t\t\t\tfontWeight: nearestFontWeight,\n\t\t\t} );\n\t\t} else {\n\t\t\t// Reset font appearance if there are no available styles or weights.\n\t\t\tresetFontAppearance();\n\t\t}\n\t}, [\n\t\tnearestFontStyle,\n\t\tnearestFontWeight,\n\t\tresetFontAppearance,\n\t\tsetFontAppearance,\n\t] );\n\n\t// Line Height\n\tconst hasLineHeightEnabled = useHasLineHeightControl( settings );\n\tconst lineHeight = decodeValue( inheritedValue?.typography?.lineHeight );\n\tconst setLineHeight = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'lineHeight' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasLineHeight = () => value?.typography?.lineHeight !== undefined;\n\tconst resetLineHeight = () => setLineHeight( undefined );\n\n\t// Letter Spacing\n\tconst hasLetterSpacingControl = useHasLetterSpacingControl( settings );\n\tconst letterSpacing = decodeValue(\n\t\tinheritedValue?.typography?.letterSpacing\n\t);\n\tconst setLetterSpacing = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'letterSpacing' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasLetterSpacing = () => !! value?.typography?.letterSpacing;\n\tconst resetLetterSpacing = () => setLetterSpacing( undefined );\n\n\t// Text Columns\n\tconst hasTextColumnsControl = useHasTextColumnsControl( settings );\n\tconst textColumns = decodeValue( inheritedValue?.typography?.textColumns );\n\tconst setTextColumns = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textColumns' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasTextColumns = () => !! value?.typography?.textColumns;\n\tconst resetTextColumns = () => setTextColumns( undefined );\n\n\t// Text Transform\n\tconst hasTextTransformControl = useHasTextTransformControl( settings );\n\tconst textTransform = decodeValue(\n\t\tinheritedValue?.typography?.textTransform\n\t);\n\tconst setTextTransform = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textTransform' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasTextTransform = () => !! value?.typography?.textTransform;\n\tconst resetTextTransform = () => setTextTransform( undefined );\n\n\t// Text Decoration\n\tconst hasTextDecorationControl = useHasTextDecorationControl( settings );\n\tconst textDecoration = decodeValue(\n\t\tinheritedValue?.typography?.textDecoration\n\t);\n\tconst setTextDecoration = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textDecoration' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasTextDecoration = () => !! value?.typography?.textDecoration;\n\tconst resetTextDecoration = () => setTextDecoration( undefined );\n\n\t// Text Orientation\n\tconst hasWritingModeControl = useHasWritingModeControl( settings );\n\tconst writingMode = decodeValue( inheritedValue?.typography?.writingMode );\n\tconst setWritingMode = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'writingMode' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasWritingMode = () => !! value?.typography?.writingMode;\n\tconst resetWritingMode = () => setWritingMode( undefined );\n\n\t// Text Alignment\n\tconst hasTextAlignmentControl = useHasTextAlignmentControl( settings );\n\n\tconst textAlign = decodeValue( inheritedValue?.typography?.textAlign );\n\tconst setTextAlign = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textAlign' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasTextAlign = () => !! value?.typography?.textAlign;\n\tconst resetTextAlign = () => setTextAlign( undefined );\n\n\tconst resetAllFilter = useCallback( ( previousValue ) => {\n\t\treturn {\n\t\t\t...previousValue,\n\t\t\ttypography: {},\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t{ hasFontFamilyEnabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Font' ) }\n\t\t\t\t\thasValue={ hasFontFamily }\n\t\t\t\t\tonDeselect={ resetFontFamily }\n\t\t\t\t\tisShownByDefault={ defaultControls.fontFamily }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<FontFamilyControl\n\t\t\t\t\t\tfontFamilies={ fontFamilies }\n\t\t\t\t\t\tvalue={ fontFamily }\n\t\t\t\t\t\tonChange={ setFontFamily }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasFontSizeEnabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Size' ) }\n\t\t\t\t\thasValue={ hasFontSize }\n\t\t\t\t\tonDeselect={ resetFontSize }\n\t\t\t\t\tisShownByDefault={ defaultControls.fontSize }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<FontSizePicker\n\t\t\t\t\t\tvalue={ fontSize }\n\t\t\t\t\t\tonChange={ setFontSize }\n\t\t\t\t\t\tfontSizes={ mergedFontSizes }\n\t\t\t\t\t\tdisableCustomFontSizes={ disableCustomFontSizes }\n\t\t\t\t\t\twithReset={ false }\n\t\t\t\t\t\twithSlider\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasAppearanceControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\tlabel={ appearanceControlLabel }\n\t\t\t\t\thasValue={ hasFontAppearance }\n\t\t\t\t\tonDeselect={ resetFontAppearance }\n\t\t\t\t\tisShownByDefault={ defaultControls.fontAppearance }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<FontAppearanceControl\n\t\t\t\t\t\tvalue={ {\n\t\t\t\t\t\t\tfontStyle,\n\t\t\t\t\t\t\tfontWeight,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonChange={ setFontAppearance }\n\t\t\t\t\t\thasFontStyles={ hasFontStyles }\n\t\t\t\t\t\thasFontWeights={ hasFontWeights }\n\t\t\t\t\t\tfontFamilyFaces={ fontFamilyFaces }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasLineHeightEnabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\tlabel={ __( 'Line height' ) }\n\t\t\t\t\thasValue={ hasLineHeight }\n\t\t\t\t\tonDeselect={ resetLineHeight }\n\t\t\t\t\tisShownByDefault={ defaultControls.lineHeight }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<LineHeightControl\n\t\t\t\t\t\t__unstableInputWidth=\"auto\"\n\t\t\t\t\t\tvalue={ lineHeight }\n\t\t\t\t\t\tonChange={ setLineHeight }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasLetterSpacingControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\tlabel={ __( 'Letter spacing' ) }\n\t\t\t\t\thasValue={ hasLetterSpacing }\n\t\t\t\t\tonDeselect={ resetLetterSpacing }\n\t\t\t\t\tisShownByDefault={ defaultControls.letterSpacing }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<LetterSpacingControl\n\t\t\t\t\t\tvalue={ letterSpacing }\n\t\t\t\t\t\tonChange={ setLetterSpacing }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t__unstableInputWidth=\"auto\"\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextColumnsControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\tlabel={ __( 'Columns' ) }\n\t\t\t\t\thasValue={ hasTextColumns }\n\t\t\t\t\tonDeselect={ resetTextColumns }\n\t\t\t\t\tisShownByDefault={ defaultControls.textColumns }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<NumberControl\n\t\t\t\t\t\tlabel={ __( 'Columns' ) }\n\t\t\t\t\t\tmax={ MAX_TEXT_COLUMNS }\n\t\t\t\t\t\tmin={ MIN_TEXT_COLUMNS }\n\t\t\t\t\t\tonChange={ setTextColumns }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\tspinControls=\"custom\"\n\t\t\t\t\t\tvalue={ textColumns }\n\t\t\t\t\t\tinitialPosition={ 1 }\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextDecorationControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\tlabel={ __( 'Decoration' ) }\n\t\t\t\t\thasValue={ hasTextDecoration }\n\t\t\t\t\tonDeselect={ resetTextDecoration }\n\t\t\t\t\tisShownByDefault={ defaultControls.textDecoration }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<TextDecorationControl\n\t\t\t\t\t\tvalue={ textDecoration }\n\t\t\t\t\t\tonChange={ setTextDecoration }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t__unstableInputWidth=\"auto\"\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasWritingModeControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\tlabel={ __( 'Orientation' ) }\n\t\t\t\t\thasValue={ hasWritingMode }\n\t\t\t\t\tonDeselect={ resetWritingMode }\n\t\t\t\t\tisShownByDefault={ defaultControls.writingMode }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<WritingModeControl\n\t\t\t\t\t\tvalue={ writingMode }\n\t\t\t\t\t\tonChange={ setWritingMode }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextTransformControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Letter case' ) }\n\t\t\t\t\thasValue={ hasTextTransform }\n\t\t\t\t\tonDeselect={ resetTextTransform }\n\t\t\t\t\tisShownByDefault={ defaultControls.textTransform }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<TextTransformControl\n\t\t\t\t\t\tvalue={ textTransform }\n\t\t\t\t\t\tonChange={ setTextTransform }\n\t\t\t\t\t\tshowNone\n\t\t\t\t\t\tisBlock\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextAlignmentControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Text alignment' ) }\n\t\t\t\t\thasValue={ hasTextAlign }\n\t\t\t\t\tonDeselect={ resetTextAlign }\n\t\t\t\t\tisShownByDefault={ defaultControls.textAlign }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<TextAlignmentControl\n\t\t\t\t\t\tvalue={ textAlign }\n\t\t\t\t\t\tonChange={ setTextAlign }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n}\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tFontSizePicker,\n\t__experimentalNumberControl as NumberControl,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useCallback, useMemo, useEffect } from '@wordpress/element';\nimport { getValueFromVariable } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport FontFamilyControl from '../font-family';\nimport FontAppearanceControl from '../font-appearance-control';\nimport LineHeightControl from '../line-height-control';\nimport LetterSpacingControl from '../letter-spacing-control';\nimport TextAlignmentControl from '../text-alignment-control';\nimport TextTransformControl from '../text-transform-control';\nimport TextDecorationControl from '../text-decoration-control';\nimport WritingModeControl from '../writing-mode-control';\nimport { useToolsPanelDropdownMenuProps } from './utils';\nimport { setImmutably } from '../../utils/object';\nimport {\n\tgetMergedFontFamiliesAndFontFamilyFaces,\n\tfindNearestStyleAndWeight,\n} from './typography-utils';\n\nconst MIN_TEXT_COLUMNS = 1;\nconst MAX_TEXT_COLUMNS = 6;\n\nexport function useHasTypographyPanel( settings ) {\n\tconst hasFontFamily = useHasFontFamilyControl( settings );\n\tconst hasLineHeight = useHasLineHeightControl( settings );\n\tconst hasFontAppearance = useHasAppearanceControl( settings );\n\tconst hasLetterSpacing = useHasLetterSpacingControl( settings );\n\tconst hasTextAlign = useHasTextAlignmentControl( settings );\n\tconst hasTextTransform = useHasTextTransformControl( settings );\n\tconst hasTextDecoration = useHasTextDecorationControl( settings );\n\tconst hasWritingMode = useHasWritingModeControl( settings );\n\tconst hasTextColumns = useHasTextColumnsControl( settings );\n\tconst hasFontSize = useHasFontSizeControl( settings );\n\n\treturn (\n\t\thasFontFamily ||\n\t\thasLineHeight ||\n\t\thasFontAppearance ||\n\t\thasLetterSpacing ||\n\t\thasTextAlign ||\n\t\thasTextTransform ||\n\t\thasFontSize ||\n\t\thasTextDecoration ||\n\t\thasWritingMode ||\n\t\thasTextColumns\n\t);\n}\n\nfunction useHasFontSizeControl( settings ) {\n\treturn (\n\t\t( settings?.typography?.defaultFontSizes !== false &&\n\t\t\tsettings?.typography?.fontSizes?.default?.length ) ||\n\t\tsettings?.typography?.fontSizes?.theme?.length ||\n\t\tsettings?.typography?.fontSizes?.custom?.length ||\n\t\tsettings?.typography?.customFontSize\n\t);\n}\n\nfunction useHasFontFamilyControl( settings ) {\n\treturn [ 'default', 'theme', 'custom' ].some(\n\t\t( key ) => settings?.typography?.fontFamilies?.[ key ]?.length\n\t);\n}\n\nfunction useHasLineHeightControl( settings ) {\n\treturn settings?.typography?.lineHeight;\n}\n\nfunction useHasAppearanceControl( settings ) {\n\treturn settings?.typography?.fontStyle || settings?.typography?.fontWeight;\n}\n\nfunction useAppearanceControlLabel( settings ) {\n\tif ( ! settings?.typography?.fontStyle ) {\n\t\treturn __( 'Font weight' );\n\t}\n\tif ( ! settings?.typography?.fontWeight ) {\n\t\treturn __( 'Font style' );\n\t}\n\treturn __( 'Appearance' );\n}\n\nfunction useHasLetterSpacingControl( settings ) {\n\treturn settings?.typography?.letterSpacing;\n}\n\nfunction useHasTextTransformControl( settings ) {\n\treturn settings?.typography?.textTransform;\n}\n\nfunction useHasTextAlignmentControl( settings ) {\n\treturn settings?.typography?.textAlign;\n}\n\nfunction useHasTextDecorationControl( settings ) {\n\treturn settings?.typography?.textDecoration;\n}\n\nfunction useHasWritingModeControl( settings ) {\n\treturn settings?.typography?.writingMode;\n}\n\nfunction useHasTextColumnsControl( settings ) {\n\treturn settings?.typography?.textColumns;\n}\n\n/**\n * Concatenate all the font sizes into a single list for the font size picker.\n *\n * @param {Object} settings The global styles settings.\n *\n * @return {Array} The merged font sizes.\n */\nfunction getMergedFontSizes( settings ) {\n\tconst fontSizes = settings?.typography?.fontSizes;\n\tconst defaultFontSizesEnabled = !! settings?.typography?.defaultFontSizes;\n\treturn [\n\t\t...( fontSizes?.custom ?? [] ),\n\t\t...( fontSizes?.theme ?? [] ),\n\t\t...( defaultFontSizesEnabled ? fontSizes?.default ?? [] : [] ),\n\t];\n}\n\nfunction TypographyToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n} ) {\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ __( 'Typography' ) }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanel>\n\t);\n}\n\nconst DEFAULT_CONTROLS = {\n\tfontFamily: true,\n\tfontSize: true,\n\tfontAppearance: true,\n\tlineHeight: true,\n\tletterSpacing: true,\n\ttextAlign: true,\n\ttextTransform: true,\n\ttextDecoration: true,\n\twritingMode: true,\n\ttextColumns: true,\n};\n\nexport default function TypographyPanel( {\n\tas: Wrapper = TypographyToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tdefaultControls = DEFAULT_CONTROLS,\n} ) {\n\tconst decodeValue = ( rawValue ) =>\n\t\tgetValueFromVariable( { settings }, '', rawValue );\n\n\t// Font Family\n\tconst hasFontFamilyEnabled = useHasFontFamilyControl( settings );\n\tconst fontFamily = decodeValue( inheritedValue?.typography?.fontFamily );\n\tconst { fontFamilies, fontFamilyFaces } = useMemo( () => {\n\t\treturn getMergedFontFamiliesAndFontFamilyFaces( settings, fontFamily );\n\t}, [ settings, fontFamily ] );\n\n\tconst setFontFamily = ( newValue ) => {\n\t\tconst slug = fontFamilies?.find(\n\t\t\t( { fontFamily: f } ) => f === newValue\n\t\t)?.slug;\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'fontFamily' ],\n\t\t\t\tslug\n\t\t\t\t\t? `var:preset|font-family|${ slug }`\n\t\t\t\t\t: newValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasFontFamily = () => !! value?.typography?.fontFamily;\n\tconst resetFontFamily = () => setFontFamily( undefined );\n\n\t// Font Size\n\tconst hasFontSizeEnabled = useHasFontSizeControl( settings );\n\tconst disableCustomFontSizes = ! settings?.typography?.customFontSize;\n\tconst mergedFontSizes = getMergedFontSizes( settings );\n\n\tconst fontSize = decodeValue( inheritedValue?.typography?.fontSize );\n\tconst setFontSize = ( newValue, metadata ) => {\n\t\tconst actualValue = !! metadata?.slug\n\t\t\t? `var:preset|font-size|${ metadata?.slug }`\n\t\t\t: newValue;\n\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'fontSize' ],\n\t\t\t\tactualValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasFontSize = () => !! value?.typography?.fontSize;\n\tconst resetFontSize = () => setFontSize( undefined );\n\n\t// Appearance\n\tconst hasAppearanceControl = useHasAppearanceControl( settings );\n\tconst appearanceControlLabel = useAppearanceControlLabel( settings );\n\tconst hasFontStyles = settings?.typography?.fontStyle;\n\tconst hasFontWeights = settings?.typography?.fontWeight;\n\tconst fontStyle = decodeValue( inheritedValue?.typography?.fontStyle );\n\tconst fontWeight = decodeValue( inheritedValue?.typography?.fontWeight );\n\tconst { nearestFontStyle, nearestFontWeight } = findNearestStyleAndWeight(\n\t\tfontFamilyFaces,\n\t\tfontStyle,\n\t\tfontWeight\n\t);\n\tconst setFontAppearance = useCallback(\n\t\t( { fontStyle: newFontStyle, fontWeight: newFontWeight } ) => {\n\t\t\t// Only update the font style and weight if they have changed.\n\t\t\tif ( newFontStyle !== fontStyle || newFontWeight !== fontWeight ) {\n\t\t\t\tonChange( {\n\t\t\t\t\t...value,\n\t\t\t\t\ttypography: {\n\t\t\t\t\t\t...value?.typography,\n\t\t\t\t\t\tfontStyle: newFontStyle || undefined,\n\t\t\t\t\t\tfontWeight: newFontWeight || undefined,\n\t\t\t\t\t},\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\t\t[ fontStyle, fontWeight, onChange, value ]\n\t);\n\tconst hasFontAppearance = () =>\n\t\t!! value?.typography?.fontStyle || !! value?.typography?.fontWeight;\n\tconst resetFontAppearance = useCallback( () => {\n\t\tsetFontAppearance( {} );\n\t}, [ setFontAppearance ] );\n\n\t// Check if previous font style and weight values are available in the new font family.\n\tuseEffect( () => {\n\t\tif ( nearestFontStyle && nearestFontWeight ) {\n\t\t\tsetFontAppearance( {\n\t\t\t\tfontStyle: nearestFontStyle,\n\t\t\t\tfontWeight: nearestFontWeight,\n\t\t\t} );\n\t\t} else {\n\t\t\t// Reset font appearance if there are no available styles or weights.\n\t\t\tresetFontAppearance();\n\t\t}\n\t}, [\n\t\tnearestFontStyle,\n\t\tnearestFontWeight,\n\t\tresetFontAppearance,\n\t\tsetFontAppearance,\n\t] );\n\n\t// Line Height\n\tconst hasLineHeightEnabled = useHasLineHeightControl( settings );\n\tconst lineHeight = decodeValue( inheritedValue?.typography?.lineHeight );\n\tconst setLineHeight = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'lineHeight' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasLineHeight = () => value?.typography?.lineHeight !== undefined;\n\tconst resetLineHeight = () => setLineHeight( undefined );\n\n\t// Letter Spacing\n\tconst hasLetterSpacingControl = useHasLetterSpacingControl( settings );\n\tconst letterSpacing = decodeValue(\n\t\tinheritedValue?.typography?.letterSpacing\n\t);\n\tconst setLetterSpacing = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'letterSpacing' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasLetterSpacing = () => !! value?.typography?.letterSpacing;\n\tconst resetLetterSpacing = () => setLetterSpacing( undefined );\n\n\t// Text Columns\n\tconst hasTextColumnsControl = useHasTextColumnsControl( settings );\n\tconst textColumns = decodeValue( inheritedValue?.typography?.textColumns );\n\tconst setTextColumns = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textColumns' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasTextColumns = () => !! value?.typography?.textColumns;\n\tconst resetTextColumns = () => setTextColumns( undefined );\n\n\t// Text Transform\n\tconst hasTextTransformControl = useHasTextTransformControl( settings );\n\tconst textTransform = decodeValue(\n\t\tinheritedValue?.typography?.textTransform\n\t);\n\tconst setTextTransform = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textTransform' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasTextTransform = () => !! value?.typography?.textTransform;\n\tconst resetTextTransform = () => setTextTransform( undefined );\n\n\t// Text Decoration\n\tconst hasTextDecorationControl = useHasTextDecorationControl( settings );\n\tconst textDecoration = decodeValue(\n\t\tinheritedValue?.typography?.textDecoration\n\t);\n\tconst setTextDecoration = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textDecoration' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasTextDecoration = () => !! value?.typography?.textDecoration;\n\tconst resetTextDecoration = () => setTextDecoration( undefined );\n\n\t// Text Orientation\n\tconst hasWritingModeControl = useHasWritingModeControl( settings );\n\tconst writingMode = decodeValue( inheritedValue?.typography?.writingMode );\n\tconst setWritingMode = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'writingMode' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasWritingMode = () => !! value?.typography?.writingMode;\n\tconst resetWritingMode = () => setWritingMode( undefined );\n\n\t// Text Alignment\n\tconst hasTextAlignmentControl = useHasTextAlignmentControl( settings );\n\n\tconst textAlign = decodeValue( inheritedValue?.typography?.textAlign );\n\tconst setTextAlign = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textAlign' ],\n\t\t\t\tnewValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasTextAlign = () => !! value?.typography?.textAlign;\n\tconst resetTextAlign = () => setTextAlign( undefined );\n\n\tconst resetAllFilter = useCallback( ( previousValue ) => {\n\t\treturn {\n\t\t\t...previousValue,\n\t\t\ttypography: {},\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t{ hasFontFamilyEnabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Font' ) }\n\t\t\t\t\thasValue={ hasFontFamily }\n\t\t\t\t\tonDeselect={ resetFontFamily }\n\t\t\t\t\tisShownByDefault={ defaultControls.fontFamily }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<FontFamilyControl\n\t\t\t\t\t\tfontFamilies={ fontFamilies }\n\t\t\t\t\t\tvalue={ fontFamily }\n\t\t\t\t\t\tonChange={ setFontFamily }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasFontSizeEnabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Size' ) }\n\t\t\t\t\thasValue={ hasFontSize }\n\t\t\t\t\tonDeselect={ resetFontSize }\n\t\t\t\t\tisShownByDefault={ defaultControls.fontSize }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<FontSizePicker\n\t\t\t\t\t\tvalue={ fontSize }\n\t\t\t\t\t\tonChange={ setFontSize }\n\t\t\t\t\t\tfontSizes={ mergedFontSizes }\n\t\t\t\t\t\tdisableCustomFontSizes={ disableCustomFontSizes }\n\t\t\t\t\t\twithReset={ false }\n\t\t\t\t\t\twithSlider\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasAppearanceControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\tlabel={ appearanceControlLabel }\n\t\t\t\t\thasValue={ hasFontAppearance }\n\t\t\t\t\tonDeselect={ resetFontAppearance }\n\t\t\t\t\tisShownByDefault={ defaultControls.fontAppearance }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<FontAppearanceControl\n\t\t\t\t\t\tvalue={ {\n\t\t\t\t\t\t\tfontStyle,\n\t\t\t\t\t\t\tfontWeight,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonChange={ setFontAppearance }\n\t\t\t\t\t\thasFontStyles={ hasFontStyles }\n\t\t\t\t\t\thasFontWeights={ hasFontWeights }\n\t\t\t\t\t\tfontFamilyFaces={ fontFamilyFaces }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasLineHeightEnabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\tlabel={ __( 'Line height' ) }\n\t\t\t\t\thasValue={ hasLineHeight }\n\t\t\t\t\tonDeselect={ resetLineHeight }\n\t\t\t\t\tisShownByDefault={ defaultControls.lineHeight }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<LineHeightControl\n\t\t\t\t\t\t__unstableInputWidth=\"auto\"\n\t\t\t\t\t\tvalue={ lineHeight }\n\t\t\t\t\t\tonChange={ setLineHeight }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasLetterSpacingControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\tlabel={ __( 'Letter spacing' ) }\n\t\t\t\t\thasValue={ hasLetterSpacing }\n\t\t\t\t\tonDeselect={ resetLetterSpacing }\n\t\t\t\t\tisShownByDefault={ defaultControls.letterSpacing }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<LetterSpacingControl\n\t\t\t\t\t\tvalue={ letterSpacing }\n\t\t\t\t\t\tonChange={ setLetterSpacing }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t__unstableInputWidth=\"auto\"\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextColumnsControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\tlabel={ __( 'Columns' ) }\n\t\t\t\t\thasValue={ hasTextColumns }\n\t\t\t\t\tonDeselect={ resetTextColumns }\n\t\t\t\t\tisShownByDefault={ defaultControls.textColumns }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<NumberControl\n\t\t\t\t\t\tlabel={ __( 'Columns' ) }\n\t\t\t\t\t\tmax={ MAX_TEXT_COLUMNS }\n\t\t\t\t\t\tmin={ MIN_TEXT_COLUMNS }\n\t\t\t\t\t\tonChange={ setTextColumns }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\tspinControls=\"custom\"\n\t\t\t\t\t\tvalue={ textColumns }\n\t\t\t\t\t\tinitialPosition={ 1 }\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextDecorationControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\tlabel={ __( 'Decoration' ) }\n\t\t\t\t\thasValue={ hasTextDecoration }\n\t\t\t\t\tonDeselect={ resetTextDecoration }\n\t\t\t\t\tisShownByDefault={ defaultControls.textDecoration }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<TextDecorationControl\n\t\t\t\t\t\tvalue={ textDecoration }\n\t\t\t\t\t\tonChange={ setTextDecoration }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t__unstableInputWidth=\"auto\"\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasWritingModeControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\tlabel={ __( 'Orientation' ) }\n\t\t\t\t\thasValue={ hasWritingMode }\n\t\t\t\t\tonDeselect={ resetWritingMode }\n\t\t\t\t\tisShownByDefault={ defaultControls.writingMode }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<WritingModeControl\n\t\t\t\t\t\tvalue={ writingMode }\n\t\t\t\t\t\tonChange={ setWritingMode }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextTransformControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Letter case' ) }\n\t\t\t\t\thasValue={ hasTextTransform }\n\t\t\t\t\tonDeselect={ resetTextTransform }\n\t\t\t\t\tisShownByDefault={ defaultControls.textTransform }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<TextTransformControl\n\t\t\t\t\t\tvalue={ textTransform }\n\t\t\t\t\t\tonChange={ setTextTransform }\n\t\t\t\t\t\tshowNone\n\t\t\t\t\t\tisBlock\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextAlignmentControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Text alignment' ) }\n\t\t\t\t\thasValue={ hasTextAlign }\n\t\t\t\t\tonDeselect={ resetTextAlign }\n\t\t\t\t\tisShownByDefault={ defaultControls.textAlign }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<TextAlignmentControl\n\t\t\t\t\t\tvalue={ textAlign }\n\t\t\t\t\t\tonChange={ setTextAlign }\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,50 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
getComputedFluidTypographyValue,
|
|
3
|
-
getTypographyValueAndUnit
|
|
4
|
-
} from "../font-sizes/fluid-utils";
|
|
5
1
|
import { getFontStylesAndWeights } from "../../utils/get-font-styles-and-weights";
|
|
6
|
-
function getTypographyFontSizeValue(preset, settings) {
|
|
7
|
-
const { size: defaultSize } = preset;
|
|
8
|
-
if (!defaultSize || "0" === defaultSize || false === preset?.fluid) {
|
|
9
|
-
return defaultSize;
|
|
10
|
-
}
|
|
11
|
-
if (!isFluidTypographyEnabled(settings?.typography) && !isFluidTypographyEnabled(preset)) {
|
|
12
|
-
return defaultSize;
|
|
13
|
-
}
|
|
14
|
-
let fluidTypographySettings = getFluidTypographyOptionsFromSettings(settings);
|
|
15
|
-
fluidTypographySettings = typeof fluidTypographySettings?.fluid === "object" ? fluidTypographySettings?.fluid : {};
|
|
16
|
-
const fluidFontSizeValue = getComputedFluidTypographyValue({
|
|
17
|
-
minimumFontSize: preset?.fluid?.min,
|
|
18
|
-
maximumFontSize: preset?.fluid?.max,
|
|
19
|
-
fontSize: defaultSize,
|
|
20
|
-
minimumFontSizeLimit: fluidTypographySettings?.minFontSize,
|
|
21
|
-
maximumViewportWidth: fluidTypographySettings?.maxViewportWidth,
|
|
22
|
-
minimumViewportWidth: fluidTypographySettings?.minViewportWidth
|
|
23
|
-
});
|
|
24
|
-
if (!!fluidFontSizeValue) {
|
|
25
|
-
return fluidFontSizeValue;
|
|
26
|
-
}
|
|
27
|
-
return defaultSize;
|
|
28
|
-
}
|
|
29
|
-
function isFluidTypographyEnabled(typographySettings) {
|
|
30
|
-
const fluidSettings = typographySettings?.fluid;
|
|
31
|
-
return true === fluidSettings || fluidSettings && typeof fluidSettings === "object" && Object.keys(fluidSettings).length > 0;
|
|
32
|
-
}
|
|
33
|
-
function getFluidTypographyOptionsFromSettings(settings) {
|
|
34
|
-
const typographySettings = settings?.typography;
|
|
35
|
-
const layoutSettings = settings?.layout;
|
|
36
|
-
const defaultMaxViewportWidth = getTypographyValueAndUnit(
|
|
37
|
-
layoutSettings?.wideSize
|
|
38
|
-
) ? layoutSettings?.wideSize : null;
|
|
39
|
-
return isFluidTypographyEnabled(typographySettings) && defaultMaxViewportWidth ? {
|
|
40
|
-
fluid: {
|
|
41
|
-
maxViewportWidth: defaultMaxViewportWidth,
|
|
42
|
-
...typographySettings.fluid
|
|
43
|
-
}
|
|
44
|
-
} : {
|
|
45
|
-
fluid: typographySettings?.fluid
|
|
46
|
-
};
|
|
47
|
-
}
|
|
48
2
|
function getMergedFontFamiliesAndFontFamilyFaces(settings, selectedFontFamily) {
|
|
49
3
|
const fontFamiliesFromSettings = settings?.typography?.fontFamilies;
|
|
50
4
|
const fontFamilies = ["default", "theme", "custom"].flatMap(
|
|
@@ -121,8 +75,6 @@ export {
|
|
|
121
75
|
findNearestFontStyle,
|
|
122
76
|
findNearestFontWeight,
|
|
123
77
|
findNearestStyleAndWeight,
|
|
124
|
-
|
|
125
|
-
getMergedFontFamiliesAndFontFamilyFaces,
|
|
126
|
-
getTypographyFontSizeValue
|
|
78
|
+
getMergedFontFamiliesAndFontFamilyFaces
|
|
127
79
|
};
|
|
128
80
|
//# sourceMappingURL=typography-utils.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/global-styles/typography-utils.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * The fluid utilities must match the backend equivalent.\n * See: gutenberg_get_typography_font_size_value() in lib/block-supports/typography.php\n * ---------------------------------------------------------------\n */\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetComputedFluidTypographyValue,\n\tgetTypographyValueAndUnit,\n} from '../font-sizes/fluid-utils';\nimport { getFontStylesAndWeights } from '../../utils/get-font-styles-and-weights';\n\n/**\n * @typedef {Object} FluidPreset\n * @property {string|undefined} max A maximum font size value.\n * @property {?string|undefined} min A minimum font size value.\n */\n\n/**\n * @typedef {Object} Preset\n * @property {?string|?number} size A default font size.\n * @property {string} name A font size name, displayed in the UI.\n * @property {string} slug A font size slug\n * @property {boolean|FluidPreset|undefined} fluid Specifies the minimum and maximum font size value of a fluid font size.\n */\n\n/**\n * @typedef {Object} TypographySettings\n * @property {?string} minViewportWidth Minimum viewport size from which type will have fluidity. Optional if size is specified.\n * @property {?string} maxViewportWidth Maximum size up to which type will have fluidity. Optional if size is specified.\n * @property {?number} scaleFactor A scale factor to determine how fast a font scales within boundaries. Optional.\n * @property {?number} minFontSizeFactor How much to scale defaultFontSize by to derive minimumFontSize. Optional.\n * @property {?string} minFontSize The smallest a calculated font size may be. Optional.\n */\n\n/**\n * Returns a font-size value based on a given font-size preset.\n * Takes into account fluid typography parameters and attempts to return a css formula depending on available, valid values.\n *\n * The Core PHP equivalent is wp_get_typography_font_size_value().\n *\n * @param {Preset} preset\n * @param {Object} settings\n * @param {boolean|TypographySettings} settings.typography.fluid Whether fluid typography is enabled, and, optionally, fluid font size options.\n * @param {?Object} settings.typography.layout Layout options.\n *\n * @return {string|*} A font-size value or the value of preset.size.\n */\nexport function getTypographyFontSizeValue( preset, settings ) {\n\tconst { size: defaultSize } = preset;\n\n\t/*\n\t * Catch falsy values and 0/'0'. Fluid calculations cannot be performed on `0`.\n\t * Also return early when a preset font size explicitly disables fluid typography with `false`.\n\t */\n\tif ( ! defaultSize || '0' === defaultSize || false === preset?.fluid ) {\n\t\treturn defaultSize;\n\t}\n\n\t/*\n\t * Return early when fluid typography is disabled in the settings, and there\n\t * are no local settings to enable it for the individual preset.\n\t *\n\t * If this condition isn't met, either the settings or individual preset settings\n\t * have enabled fluid typography.\n\t */\n\tif (\n\t\t! isFluidTypographyEnabled( settings?.typography ) &&\n\t\t! isFluidTypographyEnabled( preset )\n\t) {\n\t\treturn defaultSize;\n\t}\n\n\tlet fluidTypographySettings =\n\t\tgetFluidTypographyOptionsFromSettings( settings );\n\tfluidTypographySettings =\n\t\ttypeof fluidTypographySettings?.fluid === 'object'\n\t\t\t? fluidTypographySettings?.fluid\n\t\t\t: {};\n\n\tconst fluidFontSizeValue = getComputedFluidTypographyValue( {\n\t\tminimumFontSize: preset?.fluid?.min,\n\t\tmaximumFontSize: preset?.fluid?.max,\n\t\tfontSize: defaultSize,\n\t\tminimumFontSizeLimit: fluidTypographySettings?.minFontSize,\n\t\tmaximumViewportWidth: fluidTypographySettings?.maxViewportWidth,\n\t\tminimumViewportWidth: fluidTypographySettings?.minViewportWidth,\n\t} );\n\n\tif ( !! fluidFontSizeValue ) {\n\t\treturn fluidFontSizeValue;\n\t}\n\n\treturn defaultSize;\n}\n\nfunction isFluidTypographyEnabled( typographySettings ) {\n\tconst fluidSettings = typographySettings?.fluid;\n\treturn (\n\t\ttrue === fluidSettings ||\n\t\t( fluidSettings &&\n\t\t\ttypeof fluidSettings === 'object' &&\n\t\t\tObject.keys( fluidSettings ).length > 0 )\n\t);\n}\n\n/**\n * Returns fluid typography settings from theme.json setting object.\n *\n * @param {Object} settings Theme.json settings\n * @param {Object} settings.typography Theme.json typography settings\n * @param {Object} settings.layout Theme.json layout settings\n * @return {TypographySettings} Fluid typography settings\n */\nexport function getFluidTypographyOptionsFromSettings( settings ) {\n\tconst typographySettings = settings?.typography;\n\tconst layoutSettings = settings?.layout;\n\tconst defaultMaxViewportWidth = getTypographyValueAndUnit(\n\t\tlayoutSettings?.wideSize\n\t)\n\t\t? layoutSettings?.wideSize\n\t\t: null;\n\treturn isFluidTypographyEnabled( typographySettings ) &&\n\t\tdefaultMaxViewportWidth\n\t\t? {\n\t\t\t\tfluid: {\n\t\t\t\t\tmaxViewportWidth: defaultMaxViewportWidth,\n\t\t\t\t\t...typographySettings.fluid,\n\t\t\t\t},\n\t\t }\n\t\t: {\n\t\t\t\tfluid: typographySettings?.fluid,\n\t\t };\n}\n\n/**\n * Returns an object of merged font families and the font faces from the selected font family\n * based on the theme.json settings object and the currently selected font family.\n *\n * @param {Object} settings Theme.json settings.\n * @param {string} selectedFontFamily Decoded font family string.\n * @return {Object} Merged font families and font faces from the selected font family.\n */\nexport function getMergedFontFamiliesAndFontFamilyFaces(\n\tsettings,\n\tselectedFontFamily\n) {\n\tconst fontFamiliesFromSettings = settings?.typography?.fontFamilies;\n\n\tconst fontFamilies = [ 'default', 'theme', 'custom' ].flatMap(\n\t\t( key ) => fontFamiliesFromSettings?.[ key ] ?? []\n\t);\n\n\tconst fontFamilyFaces =\n\t\tfontFamilies.find(\n\t\t\t( family ) => family.fontFamily === selectedFontFamily\n\t\t)?.fontFace ?? [];\n\n\treturn { fontFamilies, fontFamilyFaces };\n}\n\n/**\n * Returns the nearest font weight value from the available font weight list based on the new font weight.\n * The nearest font weight is the one with the smallest difference from the new font weight.\n *\n * @param {Array} availableFontWeights Array of available font weights.\n * @param {string} newFontWeightValue New font weight value.\n * @return {string} Nearest font weight.\n */\nexport function findNearestFontWeight(\n\tavailableFontWeights,\n\tnewFontWeightValue\n) {\n\tnewFontWeightValue =\n\t\t'number' === typeof newFontWeightValue\n\t\t\t? newFontWeightValue.toString()\n\t\t\t: newFontWeightValue;\n\tif ( ! newFontWeightValue || typeof newFontWeightValue !== 'string' ) {\n\t\treturn '';\n\t}\n\n\tif ( ! availableFontWeights || availableFontWeights.length === 0 ) {\n\t\treturn newFontWeightValue;\n\t}\n\n\tconst nearestFontWeight = availableFontWeights?.reduce(\n\t\t( nearest, { value: fw } ) => {\n\t\t\tconst currentDiff = Math.abs(\n\t\t\t\tparseInt( fw ) - parseInt( newFontWeightValue )\n\t\t\t);\n\t\t\tconst nearestDiff = Math.abs(\n\t\t\t\tparseInt( nearest ) - parseInt( newFontWeightValue )\n\t\t\t);\n\t\t\treturn currentDiff < nearestDiff ? fw : nearest;\n\t\t},\n\t\tavailableFontWeights[ 0 ]?.value\n\t);\n\n\treturn nearestFontWeight;\n}\n\n/**\n * Returns the nearest font style based on the new font style.\n * Defaults to an empty string if the new font style is not valid or available.\n *\n * @param {Array} availableFontStyles Array of available font weights.\n * @param {string} newFontStyleValue New font style value.\n * @return {string} Nearest font style or an empty string.\n */\nexport function findNearestFontStyle( availableFontStyles, newFontStyleValue ) {\n\tif ( typeof newFontStyleValue !== 'string' || ! newFontStyleValue ) {\n\t\treturn '';\n\t}\n\n\tconst validStyles = [ 'normal', 'italic', 'oblique' ];\n\tif ( ! validStyles.includes( newFontStyleValue ) ) {\n\t\treturn '';\n\t}\n\n\tif (\n\t\t! availableFontStyles ||\n\t\tavailableFontStyles.length === 0 ||\n\t\tavailableFontStyles.find(\n\t\t\t( style ) => style.value === newFontStyleValue\n\t\t)\n\t) {\n\t\treturn newFontStyleValue;\n\t}\n\n\tif (\n\t\tnewFontStyleValue === 'oblique' &&\n\t\t! availableFontStyles.find( ( style ) => style.value === 'oblique' )\n\t) {\n\t\treturn 'italic';\n\t}\n\n\treturn '';\n}\n\n/**\n * Returns the nearest font style and weight based on the available font family faces and the new font style and weight.\n *\n * @param {Array} fontFamilyFaces Array of available font family faces.\n * @param {string} fontStyle New font style. Defaults to previous value.\n * @param {string} fontWeight New font weight. Defaults to previous value.\n * @return {Object} Nearest font style and font weight.\n */\nexport function findNearestStyleAndWeight(\n\tfontFamilyFaces,\n\tfontStyle,\n\tfontWeight\n) {\n\tlet nearestFontStyle = fontStyle;\n\tlet nearestFontWeight = fontWeight;\n\n\tconst { fontStyles, fontWeights, combinedStyleAndWeightOptions } =\n\t\tgetFontStylesAndWeights( fontFamilyFaces );\n\n\t// Check if the new font style and weight are available in the font family faces.\n\tconst hasFontStyle = fontStyles?.some(\n\t\t( { value: fs } ) => fs === fontStyle\n\t);\n\tconst hasFontWeight = fontWeights?.some(\n\t\t( { value: fw } ) => fw?.toString() === fontWeight?.toString()\n\t);\n\n\tif ( ! hasFontStyle ) {\n\t\t/*\n\t\t * Default to italic if oblique is not available.\n\t\t * Or find the nearest font style based on the nearest font weight.\n\t\t */\n\t\tnearestFontStyle = fontStyle\n\t\t\t? findNearestFontStyle( fontStyles, fontStyle )\n\t\t\t: combinedStyleAndWeightOptions?.find(\n\t\t\t\t\t( option ) =>\n\t\t\t\t\t\toption.style.fontWeight ===\n\t\t\t\t\t\tfindNearestFontWeight( fontWeights, fontWeight )\n\t\t\t )?.style?.fontStyle;\n\t}\n\n\tif ( ! hasFontWeight ) {\n\t\t/*\n\t\t * Find the nearest font weight based on available weights.\n\t\t * Or find the nearest font weight based on the nearest font style.\n\t\t */\n\t\tnearestFontWeight = fontWeight\n\t\t\t? findNearestFontWeight( fontWeights, fontWeight )\n\t\t\t: combinedStyleAndWeightOptions?.find(\n\t\t\t\t\t( option ) =>\n\t\t\t\t\t\toption.style.fontStyle ===\n\t\t\t\t\t\t( nearestFontStyle || fontStyle )\n\t\t\t )?.style?.fontWeight;\n\t}\n\n\treturn { nearestFontStyle, nearestFontWeight };\n}\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport { getFontStylesAndWeights } from '../../utils/get-font-styles-and-weights';\n\n/**\n * Returns an object of merged font families and the font faces from the selected font family\n * based on the theme.json settings object and the currently selected font family.\n *\n * @param {Object} settings Theme.json settings.\n * @param {string} selectedFontFamily Decoded font family string.\n * @return {Object} Merged font families and font faces from the selected font family.\n */\nexport function getMergedFontFamiliesAndFontFamilyFaces(\n\tsettings,\n\tselectedFontFamily\n) {\n\tconst fontFamiliesFromSettings = settings?.typography?.fontFamilies;\n\n\tconst fontFamilies = [ 'default', 'theme', 'custom' ].flatMap(\n\t\t( key ) => fontFamiliesFromSettings?.[ key ] ?? []\n\t);\n\n\tconst fontFamilyFaces =\n\t\tfontFamilies.find(\n\t\t\t( family ) => family.fontFamily === selectedFontFamily\n\t\t)?.fontFace ?? [];\n\n\treturn { fontFamilies, fontFamilyFaces };\n}\n\n/**\n * Returns the nearest font weight value from the available font weight list based on the new font weight.\n * The nearest font weight is the one with the smallest difference from the new font weight.\n *\n * @param {Array} availableFontWeights Array of available font weights.\n * @param {string} newFontWeightValue New font weight value.\n * @return {string} Nearest font weight.\n */\nexport function findNearestFontWeight(\n\tavailableFontWeights,\n\tnewFontWeightValue\n) {\n\tnewFontWeightValue =\n\t\t'number' === typeof newFontWeightValue\n\t\t\t? newFontWeightValue.toString()\n\t\t\t: newFontWeightValue;\n\tif ( ! newFontWeightValue || typeof newFontWeightValue !== 'string' ) {\n\t\treturn '';\n\t}\n\n\tif ( ! availableFontWeights || availableFontWeights.length === 0 ) {\n\t\treturn newFontWeightValue;\n\t}\n\n\tconst nearestFontWeight = availableFontWeights?.reduce(\n\t\t( nearest, { value: fw } ) => {\n\t\t\tconst currentDiff = Math.abs(\n\t\t\t\tparseInt( fw ) - parseInt( newFontWeightValue )\n\t\t\t);\n\t\t\tconst nearestDiff = Math.abs(\n\t\t\t\tparseInt( nearest ) - parseInt( newFontWeightValue )\n\t\t\t);\n\t\t\treturn currentDiff < nearestDiff ? fw : nearest;\n\t\t},\n\t\tavailableFontWeights[ 0 ]?.value\n\t);\n\n\treturn nearestFontWeight;\n}\n\n/**\n * Returns the nearest font style based on the new font style.\n * Defaults to an empty string if the new font style is not valid or available.\n *\n * @param {Array} availableFontStyles Array of available font weights.\n * @param {string} newFontStyleValue New font style value.\n * @return {string} Nearest font style or an empty string.\n */\nexport function findNearestFontStyle( availableFontStyles, newFontStyleValue ) {\n\tif ( typeof newFontStyleValue !== 'string' || ! newFontStyleValue ) {\n\t\treturn '';\n\t}\n\n\tconst validStyles = [ 'normal', 'italic', 'oblique' ];\n\tif ( ! validStyles.includes( newFontStyleValue ) ) {\n\t\treturn '';\n\t}\n\n\tif (\n\t\t! availableFontStyles ||\n\t\tavailableFontStyles.length === 0 ||\n\t\tavailableFontStyles.find(\n\t\t\t( style ) => style.value === newFontStyleValue\n\t\t)\n\t) {\n\t\treturn newFontStyleValue;\n\t}\n\n\tif (\n\t\tnewFontStyleValue === 'oblique' &&\n\t\t! availableFontStyles.find( ( style ) => style.value === 'oblique' )\n\t) {\n\t\treturn 'italic';\n\t}\n\n\treturn '';\n}\n\n/**\n * Returns the nearest font style and weight based on the available font family faces and the new font style and weight.\n *\n * @param {Array} fontFamilyFaces Array of available font family faces.\n * @param {string} fontStyle New font style. Defaults to previous value.\n * @param {string} fontWeight New font weight. Defaults to previous value.\n * @return {Object} Nearest font style and font weight.\n */\nexport function findNearestStyleAndWeight(\n\tfontFamilyFaces,\n\tfontStyle,\n\tfontWeight\n) {\n\tlet nearestFontStyle = fontStyle;\n\tlet nearestFontWeight = fontWeight;\n\n\tconst { fontStyles, fontWeights, combinedStyleAndWeightOptions } =\n\t\tgetFontStylesAndWeights( fontFamilyFaces );\n\n\t// Check if the new font style and weight are available in the font family faces.\n\tconst hasFontStyle = fontStyles?.some(\n\t\t( { value: fs } ) => fs === fontStyle\n\t);\n\tconst hasFontWeight = fontWeights?.some(\n\t\t( { value: fw } ) => fw?.toString() === fontWeight?.toString()\n\t);\n\n\tif ( ! hasFontStyle ) {\n\t\t/*\n\t\t * Default to italic if oblique is not available.\n\t\t * Or find the nearest font style based on the nearest font weight.\n\t\t */\n\t\tnearestFontStyle = fontStyle\n\t\t\t? findNearestFontStyle( fontStyles, fontStyle )\n\t\t\t: combinedStyleAndWeightOptions?.find(\n\t\t\t\t\t( option ) =>\n\t\t\t\t\t\toption.style.fontWeight ===\n\t\t\t\t\t\tfindNearestFontWeight( fontWeights, fontWeight )\n\t\t\t )?.style?.fontStyle;\n\t}\n\n\tif ( ! hasFontWeight ) {\n\t\t/*\n\t\t * Find the nearest font weight based on available weights.\n\t\t * Or find the nearest font weight based on the nearest font style.\n\t\t */\n\t\tnearestFontWeight = fontWeight\n\t\t\t? findNearestFontWeight( fontWeights, fontWeight )\n\t\t\t: combinedStyleAndWeightOptions?.find(\n\t\t\t\t\t( option ) =>\n\t\t\t\t\t\toption.style.fontStyle ===\n\t\t\t\t\t\t( nearestFontStyle || fontStyle )\n\t\t\t )?.style?.fontWeight;\n\t}\n\n\treturn { nearestFontStyle, nearestFontWeight };\n}\n"],
|
|
5
|
+
"mappings": "AAGA,SAAS,+BAA+B;AAUjC,SAAS,wCACf,UACA,oBACC;AACD,QAAM,2BAA2B,UAAU,YAAY;AAEvD,QAAM,eAAe,CAAE,WAAW,SAAS,QAAS,EAAE;AAAA,IACrD,CAAE,QAAS,2BAA4B,GAAI,KAAK,CAAC;AAAA,EAClD;AAEA,QAAM,kBACL,aAAa;AAAA,IACZ,CAAE,WAAY,OAAO,eAAe;AAAA,EACrC,GAAG,YAAY,CAAC;AAEjB,SAAO,EAAE,cAAc,gBAAgB;AACxC;AAUO,SAAS,sBACf,sBACA,oBACC;AACD,uBACC,aAAa,OAAO,qBACjB,mBAAmB,SAAS,IAC5B;AACJ,MAAK,CAAE,sBAAsB,OAAO,uBAAuB,UAAW;AACrE,WAAO;AAAA,EACR;AAEA,MAAK,CAAE,wBAAwB,qBAAqB,WAAW,GAAI;AAClE,WAAO;AAAA,EACR;AAEA,QAAM,oBAAoB,sBAAsB;AAAA,IAC/C,CAAE,SAAS,EAAE,OAAO,GAAG,MAAO;AAC7B,YAAM,cAAc,KAAK;AAAA,QACxB,SAAU,EAAG,IAAI,SAAU,kBAAmB;AAAA,MAC/C;AACA,YAAM,cAAc,KAAK;AAAA,QACxB,SAAU,OAAQ,IAAI,SAAU,kBAAmB;AAAA,MACpD;AACA,aAAO,cAAc,cAAc,KAAK;AAAA,IACzC;AAAA,IACA,qBAAsB,CAAE,GAAG;AAAA,EAC5B;AAEA,SAAO;AACR;AAUO,SAAS,qBAAsB,qBAAqB,mBAAoB;AAC9E,MAAK,OAAO,sBAAsB,YAAY,CAAE,mBAAoB;AACnE,WAAO;AAAA,EACR;AAEA,QAAM,cAAc,CAAE,UAAU,UAAU,SAAU;AACpD,MAAK,CAAE,YAAY,SAAU,iBAAkB,GAAI;AAClD,WAAO;AAAA,EACR;AAEA,MACC,CAAE,uBACF,oBAAoB,WAAW,KAC/B,oBAAoB;AAAA,IACnB,CAAE,UAAW,MAAM,UAAU;AAAA,EAC9B,GACC;AACD,WAAO;AAAA,EACR;AAEA,MACC,sBAAsB,aACtB,CAAE,oBAAoB,KAAM,CAAE,UAAW,MAAM,UAAU,SAAU,GAClE;AACD,WAAO;AAAA,EACR;AAEA,SAAO;AACR;AAUO,SAAS,0BACf,iBACA,WACA,YACC;AACD,MAAI,mBAAmB;AACvB,MAAI,oBAAoB;AAExB,QAAM,EAAE,YAAY,aAAa,8BAA8B,IAC9D,wBAAyB,eAAgB;AAG1C,QAAM,eAAe,YAAY;AAAA,IAChC,CAAE,EAAE,OAAO,GAAG,MAAO,OAAO;AAAA,EAC7B;AACA,QAAM,gBAAgB,aAAa;AAAA,IAClC,CAAE,EAAE,OAAO,GAAG,MAAO,IAAI,SAAS,MAAM,YAAY,SAAS;AAAA,EAC9D;AAEA,MAAK,CAAE,cAAe;AAKrB,uBAAmB,YAChB,qBAAsB,YAAY,SAAU,IAC5C,+BAA+B;AAAA,MAC/B,CAAE,WACD,OAAO,MAAM,eACb,sBAAuB,aAAa,UAAW;AAAA,IAChD,GAAG,OAAO;AAAA,EACd;AAEA,MAAK,CAAE,eAAgB;AAKtB,wBAAoB,aACjB,sBAAuB,aAAa,UAAW,IAC/C,+BAA+B;AAAA,MAC/B,CAAE,WACD,OAAO,MAAM,eACX,oBAAoB;AAAA,IACvB,GAAG,OAAO;AAAA,EACd;AAEA,SAAO,EAAE,kBAAkB,kBAAkB;AAC9C;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|