@wordpress/global-styles-engine 1.1.0 → 1.2.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/core/equal.js +2 -0
- package/build/core/equal.js.map +1 -1
- package/build/core/merge.js +2 -0
- package/build/core/merge.js.map +1 -1
- package/build/core/render.js +12 -10
- package/build/core/render.js.map +1 -1
- package/build/core/selectors.js +2 -0
- package/build/core/selectors.js.map +1 -1
- package/build/index.js +2 -0
- package/build/index.js.map +1 -1
- package/build/settings/get-palette.js +2 -0
- package/build/settings/get-palette.js.map +1 -1
- package/build/settings/get-setting.js +3 -1
- package/build/settings/get-setting.js.map +1 -1
- package/build/settings/get-style.js +2 -0
- package/build/settings/get-style.js.map +1 -1
- package/build/settings/set-setting.js +2 -0
- package/build/settings/set-setting.js.map +1 -1
- package/build/settings/set-style.js +2 -0
- package/build/settings/set-style.js.map +1 -1
- package/build/types.js +2 -0
- package/build/types.js.map +1 -1
- package/build/utils/background.js +3 -1
- package/build/utils/background.js.map +1 -1
- package/build/utils/common.js +6 -4
- package/build/utils/common.js.map +1 -1
- package/build/utils/duotone.js +2 -0
- package/build/utils/duotone.js.map +1 -1
- package/build/utils/fluid.js +8 -6
- package/build/utils/fluid.js.map +1 -1
- package/build/utils/gap.js +2 -0
- package/build/utils/gap.js.map +1 -1
- package/build/utils/get-global-styles-changes.js +7 -5
- package/build/utils/get-global-styles-changes.js.map +1 -1
- package/build/utils/layout.js +3 -1
- package/build/utils/layout.js.map +1 -1
- package/build/utils/object.js +3 -1
- package/build/utils/object.js.map +1 -1
- package/build/utils/spacing.js +2 -0
- package/build/utils/spacing.js.map +1 -1
- package/build/utils/string.js +2 -0
- package/build/utils/string.js.map +1 -1
- package/build/utils/typography.js +2 -0
- package/build/utils/typography.js.map +1 -1
- package/build-module/core/equal.js +1 -0
- package/build-module/core/equal.js.map +1 -1
- package/build-module/core/merge.js +1 -0
- package/build-module/core/merge.js.map +1 -1
- package/build-module/core/render.js +11 -10
- package/build-module/core/render.js.map +1 -1
- package/build-module/core/selectors.js +1 -0
- package/build-module/core/selectors.js.map +1 -1
- package/build-module/index.js +1 -0
- package/build-module/index.js.map +1 -1
- package/build-module/settings/get-palette.js +1 -0
- package/build-module/settings/get-palette.js.map +1 -1
- package/build-module/settings/get-setting.js +2 -1
- package/build-module/settings/get-setting.js.map +1 -1
- package/build-module/settings/get-style.js +1 -0
- package/build-module/settings/get-style.js.map +1 -1
- package/build-module/settings/set-setting.js +1 -0
- package/build-module/settings/set-setting.js.map +1 -1
- package/build-module/settings/set-style.js +1 -0
- package/build-module/settings/set-style.js.map +1 -1
- package/build-module/utils/background.js +2 -1
- package/build-module/utils/background.js.map +1 -1
- package/build-module/utils/common.js +5 -4
- package/build-module/utils/common.js.map +1 -1
- package/build-module/utils/duotone.js +1 -0
- package/build-module/utils/duotone.js.map +1 -1
- package/build-module/utils/fluid.js +7 -6
- package/build-module/utils/fluid.js.map +1 -1
- package/build-module/utils/gap.js +1 -0
- package/build-module/utils/gap.js.map +1 -1
- package/build-module/utils/get-global-styles-changes.js +6 -5
- package/build-module/utils/get-global-styles-changes.js.map +1 -1
- package/build-module/utils/layout.js +2 -1
- package/build-module/utils/layout.js.map +1 -1
- package/build-module/utils/object.js +2 -1
- package/build-module/utils/object.js.map +1 -1
- package/build-module/utils/spacing.js +1 -0
- package/build-module/utils/spacing.js.map +1 -1
- package/build-module/utils/string.js +1 -0
- package/build-module/utils/string.js.map +1 -1
- package/build-module/utils/typography.js +1 -0
- package/build-module/utils/typography.js.map +1 -1
- package/build-types/core/render.d.ts.map +1 -1
- package/build-types/utils/object.d.ts.map +1 -1
- package/package.json +6 -6
- package/tsconfig.tsbuildinfo +1 -1
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/common.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { getCSSValueFromRawStyle } from '@wordpress/style-engine';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tGlobalStylesSettings,\n\tThemeFileLink,\n\tTypographyPreset,\n\tUnresolvedValue,\n\tGlobalStylesConfig,\n} from '../types';\nimport { getTypographyFontSizeValue } from './typography';\nimport { getValueFromObjectPath } from './object';\n\nexport const ROOT_BLOCK_SELECTOR = 'body';\nexport const ROOT_CSS_PROPERTIES_SELECTOR = ':root';\n\nexport const PRESET_METADATA = [\n\t{\n\t\tpath: [ 'color', 'palette' ],\n\t\tvalueKey: 'color',\n\t\tcssVarInfix: 'color',\n\t\tclasses: [\n\t\t\t{ classSuffix: 'color', propertyName: 'color' },\n\t\t\t{\n\t\t\t\tclassSuffix: 'background-color',\n\t\t\t\tpropertyName: 'background-color',\n\t\t\t},\n\t\t\t{\n\t\t\t\tclassSuffix: 'border-color',\n\t\t\t\tpropertyName: 'border-color',\n\t\t\t},\n\t\t],\n\t},\n\t{\n\t\tpath: [ 'color', 'gradients' ],\n\t\tvalueKey: 'gradient',\n\t\tcssVarInfix: 'gradient',\n\t\tclasses: [\n\t\t\t{\n\t\t\t\tclassSuffix: 'gradient-background',\n\t\t\t\tpropertyName: 'background',\n\t\t\t},\n\t\t],\n\t},\n\t{\n\t\tpath: [ 'color', 'duotone' ],\n\t\tvalueKey: 'colors',\n\t\tcssVarInfix: 'duotone',\n\t\tvalueFunc: ( { slug }: { slug: string } ) =>\n\t\t\t`url( '#wp-duotone-${ slug }' )`,\n\t\tclasses: [],\n\t},\n\t{\n\t\tpath: [ 'shadow', 'presets' ],\n\t\tvalueKey: 'shadow',\n\t\tcssVarInfix: 'shadow',\n\t\tclasses: [],\n\t},\n\t{\n\t\tpath: [ 'typography', 'fontSizes' ],\n\t\tvalueFunc: (\n\t\t\tpreset: TypographyPreset,\n\t\t\tsettings: GlobalStylesSettings\n\t\t) => getTypographyFontSizeValue( preset, settings ),\n\t\tvalueKey: 'size',\n\t\tcssVarInfix: 'font-size',\n\t\tclasses: [ { classSuffix: 'font-size', propertyName: 'font-size' } ],\n\t},\n\t{\n\t\tpath: [ 'typography', 'fontFamilies' ],\n\t\tvalueKey: 'fontFamily',\n\t\tcssVarInfix: 'font-family',\n\t\tclasses: [\n\t\t\t{ classSuffix: 'font-family', propertyName: 'font-family' },\n\t\t],\n\t},\n\t{\n\t\tpath: [ 'spacing', 'spacingSizes' ],\n\t\tvalueKey: 'size',\n\t\tcssVarInfix: 'spacing',\n\t\tvalueFunc: ( { size }: { size: string } ) => size,\n\t\tclasses: [],\n\t},\n\t{\n\t\tpath: [ 'border', 'radiusSizes' ],\n\t\tvalueKey: 'size',\n\t\tcssVarInfix: 'border-radius',\n\t\tclasses: [],\n\t},\n];\n\nexport const STYLE_PATH_TO_CSS_VAR_INFIX: Record< string, string > = {\n\t'color.background': 'color',\n\t'color.text': 'color',\n\t'filter.duotone': 'duotone',\n\t'elements.link.color.text': 'color',\n\t'elements.link.:hover.color.text': 'color',\n\t'elements.link.typography.fontFamily': 'font-family',\n\t'elements.link.typography.fontSize': 'font-size',\n\t'elements.button.color.text': 'color',\n\t'elements.button.color.background': 'color',\n\t'elements.caption.color.text': 'color',\n\t'elements.button.typography.fontFamily': 'font-family',\n\t'elements.button.typography.fontSize': 'font-size',\n\t'elements.heading.color': 'color',\n\t'elements.heading.color.background': 'color',\n\t'elements.heading.typography.fontFamily': 'font-family',\n\t'elements.heading.gradient': 'gradient',\n\t'elements.heading.color.gradient': 'gradient',\n\t'elements.h1.color': 'color',\n\t'elements.h1.color.background': 'color',\n\t'elements.h1.typography.fontFamily': 'font-family',\n\t'elements.h1.color.gradient': 'gradient',\n\t'elements.h2.color': 'color',\n\t'elements.h2.color.background': 'color',\n\t'elements.h2.typography.fontFamily': 'font-family',\n\t'elements.h2.color.gradient': 'gradient',\n\t'elements.h3.color': 'color',\n\t'elements.h3.color.background': 'color',\n\t'elements.h3.typography.fontFamily': 'font-family',\n\t'elements.h3.color.gradient': 'gradient',\n\t'elements.h4.color': 'color',\n\t'elements.h4.color.background': 'color',\n\t'elements.h4.typography.fontFamily': 'font-family',\n\t'elements.h4.color.gradient': 'gradient',\n\t'elements.h5.color': 'color',\n\t'elements.h5.color.background': 'color',\n\t'elements.h5.typography.fontFamily': 'font-family',\n\t'elements.h5.color.gradient': 'gradient',\n\t'elements.h6.color': 'color',\n\t'elements.h6.color.background': 'color',\n\t'elements.h6.typography.fontFamily': 'font-family',\n\t'elements.h6.color.gradient': 'gradient',\n\t'color.gradient': 'gradient',\n\tshadow: 'shadow',\n\t'typography.fontSize': 'font-size',\n\t'typography.fontFamily': 'font-family',\n};\n\n/**\n * Function that scopes a selector with another one. This works a bit like\n * SCSS nesting except the `&` operator isn't supported.\n *\n * @example\n * ```js\n * const scope = '.a, .b .c';\n * const selector = '> .x, .y';\n * const merged = scopeSelector( scope, selector );\n * // merged is '.a > .x, .a .y, .b .c > .x, .b .c .y'\n * ```\n *\n * @param scope Selector to scope to.\n * @param selector Original selector.\n *\n * @return Scoped selector.\n */\nexport function scopeSelector( scope: string | undefined, selector: string ) {\n\tif ( ! scope || ! selector ) {\n\t\treturn selector;\n\t}\n\n\tconst scopes = scope.split( ',' );\n\tconst selectors = selector.split( ',' );\n\n\tconst selectorsScoped: string[] = [];\n\tscopes.forEach( ( outer ) => {\n\t\tselectors.forEach( ( inner ) => {\n\t\t\tselectorsScoped.push( `${ outer.trim() } ${ inner.trim() }` );\n\t\t} );\n\t} );\n\n\treturn selectorsScoped.join( ', ' );\n}\n\n/**\n * Scopes a collection of selectors for features and subfeatures.\n *\n * @example\n * ```js\n * const scope = '.custom-scope';\n * const selectors = {\n * color: '.wp-my-block p',\n * typography: { fontSize: '.wp-my-block caption' },\n * };\n * const result = scopeFeatureSelector( scope, selectors );\n * // result is {\n * // color: '.custom-scope .wp-my-block p',\n * // typography: { fonSize: '.custom-scope .wp-my-block caption' },\n * // }\n * ```\n *\n * @param scope Selector to scope collection of selectors with.\n * @param selectors Collection of feature selectors e.g.\n *\n * @return Scoped collection of feature selectors.\n */\nexport function scopeFeatureSelectors(\n\tscope: string | undefined,\n\tselectors: string | Record< string, string | Record< string, string > >\n) {\n\tif ( ! scope || ! selectors ) {\n\t\treturn;\n\t}\n\n\tconst featureSelectors: Record<\n\t\tstring,\n\t\tstring | Record< string, string >\n\t> = {};\n\n\tObject.entries( selectors ).forEach( ( [ feature, selector ] ) => {\n\t\tif ( typeof selector === 'string' ) {\n\t\t\tfeatureSelectors[ feature ] = scopeSelector( scope, selector );\n\t\t}\n\n\t\tif ( typeof selector === 'object' ) {\n\t\t\tfeatureSelectors[ feature ] = {};\n\n\t\t\tObject.entries( selector ).forEach(\n\t\t\t\t( [ subfeature, subfeatureSelector ] ) => {\n\t\t\t\t\t// @ts-expect-error\n\t\t\t\t\tfeatureSelectors[ feature ][ subfeature ] = scopeSelector(\n\t\t\t\t\t\tscope,\n\t\t\t\t\t\tsubfeatureSelector as string\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t);\n\t\t}\n\t} );\n\n\treturn featureSelectors;\n}\n\n/**\n * Appends a sub-selector to an existing one.\n *\n * Given the compounded `selector` \"h1, h2, h3\"\n * and the `toAppend` selector \".some-class\" the result will be\n * \"h1.some-class, h2.some-class, h3.some-class\".\n *\n * @param selector Original selector.\n * @param toAppend Selector to append.\n *\n * @return The new selector.\n */\nexport function appendToSelector( selector: string, toAppend: string ) {\n\tif ( ! selector.includes( ',' ) ) {\n\t\treturn selector + toAppend;\n\t}\n\tconst selectors = selector.split( ',' );\n\tconst newSelectors = selectors.map( ( sel ) => sel + toAppend );\n\treturn newSelectors.join( ',' );\n}\n\n/**\n * Generates the selector for a block style variation by creating the\n * appropriate CSS class and adding it to the ancestor portion of the block's\n * selector.\n *\n * For example, take the Button block which has a compound selector:\n * `.wp-block-button .wp-block-button__link`. With a variation named 'custom',\n * the class `.is-style-custom` should be added to the `.wp-block-button`\n * ancestor only.\n *\n * This function will take into account comma separated and complex selectors.\n *\n * @param variation Name for the variation.\n * @param blockSelector CSS selector for the block.\n *\n * @return CSS selector for the block style variation.\n */\nexport function getBlockStyleVariationSelector(\n\tvariation: string,\n\tblockSelector: string\n) {\n\tconst variationClass = `.is-style-${ variation }`;\n\n\tif ( ! blockSelector ) {\n\t\treturn variationClass;\n\t}\n\n\tconst ancestorRegex = /((?::\\([^)]+\\))?\\s*)([^\\s:]+)/;\n\tconst addVariationClass = (\n\t\t_match: string,\n\t\tgroup1: string,\n\t\tgroup2: string\n\t) => {\n\t\treturn group1 + group2 + variationClass;\n\t};\n\n\tconst result = blockSelector\n\t\t.split( ',' )\n\t\t.map( ( part ) => part.replace( ancestorRegex, addVariationClass ) );\n\n\treturn result.join( ',' );\n}\n\n/**\n * Resolves ref values in theme JSON.\n *\n * @param ruleValue A block style value that may contain a reference to a theme.json value.\n * @param tree A theme.json object.\n * @return The resolved value or incoming ruleValue.\n */\nexport function getResolvedRefValue(\n\truleValue: UnresolvedValue,\n\ttree?: GlobalStylesConfig\n): UnresolvedValue {\n\tif ( ! ruleValue || ! tree ) {\n\t\treturn ruleValue;\n\t}\n\n\t/*\n\t * Where the rule value is an object with a 'ref' property pointing\n\t * to a path, this converts that path into the value at that path.\n\t * For example: { \"ref\": \"style.color.background\" } => \"#fff\".\n\t */\n\tif (\n\t\ttypeof ruleValue === 'object' &&\n\t\t'ref' in ruleValue &&\n\t\truleValue?.ref\n\t) {\n\t\tconst resolvedRuleValue = getCSSValueFromRawStyle(\n\t\t\tgetValueFromObjectPath( tree, ruleValue.ref )\n\t\t) as UnresolvedValue;\n\n\t\t/*\n\t\t * Presence of another ref indicates a reference to another dynamic value.\n\t\t * Pointing to another dynamic value is not supported.\n\t\t */\n\t\tif (\n\t\t\ttypeof resolvedRuleValue === 'object' &&\n\t\t\tresolvedRuleValue !== null &&\n\t\t\t'ref' in resolvedRuleValue &&\n\t\t\tresolvedRuleValue?.ref\n\t\t) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tif ( resolvedRuleValue === undefined ) {\n\t\t\treturn ruleValue;\n\t\t}\n\n\t\treturn resolvedRuleValue;\n\t}\n\treturn ruleValue;\n}\n\n/**\n * Looks up a theme file URI based on a relative path.\n *\n * @param file A relative path.\n * @param themeFileURIs A collection of absolute theme file URIs and their corresponding file paths.\n * @return A resolved theme file URI, if one is found in the themeFileURIs collection.\n */\nexport function getResolvedThemeFilePath(\n\tfile: string,\n\tthemeFileURIs?: ThemeFileLink[]\n) {\n\tif ( ! file || ! themeFileURIs || ! Array.isArray( themeFileURIs ) ) {\n\t\treturn file;\n\t}\n\n\tconst uri = themeFileURIs.find(\n\t\t( themeFileUri ) => themeFileUri?.name === file\n\t);\n\n\tif ( ! uri?.href ) {\n\t\treturn file;\n\t}\n\n\treturn uri?.href;\n}\n\n/**\n * Resolves ref and relative path values in theme JSON.\n *\n * @param ruleValue A block style value that may contain a reference to a theme.json value.\n * @param tree A theme.json object.\n * @return The resolved value or incoming ruleValue.\n */\nexport function getResolvedValue(\n\truleValue: UnresolvedValue,\n\ttree: GlobalStylesConfig | undefined\n) {\n\tif ( ! ruleValue || ! tree ) {\n\t\treturn ruleValue;\n\t}\n\n\t// Resolve ref values.\n\tconst resolvedValue = getResolvedRefValue( ruleValue, tree );\n\n\t// Resolve relative paths.\n\tif (\n\t\ttypeof resolvedValue === 'object' &&\n\t\tresolvedValue !== null &&\n\t\t'url' in resolvedValue &&\n\t\tresolvedValue?.url\n\t) {\n\t\tresolvedValue.url = getResolvedThemeFilePath(\n\t\t\tresolvedValue.url,\n\t\t\ttree?._links?.[ 'wp:theme-file' ]\n\t\t);\n\t}\n\n\treturn resolvedValue;\n}\n\nfunction findInPresetsBy(\n\tsettings: GlobalStylesSettings,\n\tblockName?: string,\n\tpresetPath: string[] = [],\n\tpresetProperty: string = 'slug',\n\tpresetValueValue?: string\n) {\n\t// Block presets take priority above root level presets.\n\tconst orderedPresetsByOrigin = [\n\t\tblockName\n\t\t\t? getValueFromObjectPath( settings, [\n\t\t\t\t\t'blocks',\n\t\t\t\t\tblockName,\n\t\t\t\t\t...presetPath,\n\t\t\t ] )\n\t\t\t: undefined,\n\t\tgetValueFromObjectPath( settings, presetPath ),\n\t].filter( Boolean );\n\n\tfor ( const presetByOrigin of orderedPresetsByOrigin ) {\n\t\tif ( presetByOrigin ) {\n\t\t\t// Preset origins ordered by priority.\n\t\t\tconst origins = [ 'custom', 'theme', 'default' ];\n\t\t\tfor ( const origin of origins ) {\n\t\t\t\t// @ts-expect-error\n\t\t\t\tconst presets = presetByOrigin[ origin ];\n\t\t\t\tif ( presets ) {\n\t\t\t\t\tconst presetObject = presets.find(\n\t\t\t\t\t\t( preset: any ) =>\n\t\t\t\t\t\t\tpreset[ presetProperty ] === presetValueValue\n\t\t\t\t\t);\n\t\t\t\t\tif ( presetObject ) {\n\t\t\t\t\t\tif ( presetProperty === 'slug' ) {\n\t\t\t\t\t\t\treturn presetObject;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If there is a highest priority preset with the same slug but different value the preset we found was overwritten and should be ignored.\n\t\t\t\t\t\tconst highestPresetObjectWithSameSlug = findInPresetsBy(\n\t\t\t\t\t\t\tsettings,\n\t\t\t\t\t\t\tblockName,\n\t\t\t\t\t\t\tpresetPath,\n\t\t\t\t\t\t\t'slug',\n\t\t\t\t\t\t\tpresetObject.slug\n\t\t\t\t\t\t);\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\thighestPresetObjectWithSameSlug[\n\t\t\t\t\t\t\t\tpresetProperty\n\t\t\t\t\t\t\t] === presetObject[ presetProperty ]\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\treturn presetObject;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn undefined;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n\nfunction getValueFromPresetVariable(\n\tfeatures: GlobalStylesConfig,\n\tblockName?: string,\n\tvariable?: string,\n\t[ presetType, slug ]: string[] = []\n) {\n\tconst metadata = PRESET_METADATA.find(\n\t\t( data ) => data.cssVarInfix === presetType\n\t);\n\tif ( ! metadata || ! features.settings ) {\n\t\treturn variable;\n\t}\n\n\tconst presetObject = findInPresetsBy(\n\t\tfeatures.settings,\n\t\tblockName,\n\t\tmetadata.path,\n\t\t'slug',\n\t\tslug\n\t);\n\n\tif ( presetObject ) {\n\t\tconst { valueKey } = metadata;\n\t\tconst result = presetObject[ valueKey ];\n\t\treturn getValueFromVariable( features, blockName, result );\n\t}\n\n\treturn variable;\n}\n\nfunction getValueFromCustomVariable(\n\tfeatures: GlobalStylesConfig,\n\tblockName?: string,\n\tvariable?: string,\n\tpath: string[] = []\n): string | undefined {\n\tconst result =\n\t\t( blockName\n\t\t\t? getValueFromObjectPath( features?.settings ?? {}, [\n\t\t\t\t\t'blocks',\n\t\t\t\t\tblockName,\n\t\t\t\t\t'custom',\n\t\t\t\t\t...path,\n\t\t\t ] )\n\t\t\t: undefined ) ??\n\t\tgetValueFromObjectPath( features?.settings ?? {}, [\n\t\t\t'custom',\n\t\t\t...path,\n\t\t] );\n\tif ( ! result ) {\n\t\treturn variable;\n\t}\n\t// A variable may reference another variable so we need recursion until we find the value.\n\treturn getValueFromVariable( features, blockName, result as string );\n}\n\n/**\n * Attempts to fetch the value of a theme.json CSS variable.\n *\n * This function resolves CSS variable references in two formats:\n * - User format: `var:preset|color|red` or `var:custom|spacing|small`\n * - Theme format: `var(--wp--preset--color--red)` or `var(--wp--custom--spacing--small)`\n *\n * It also handles ref-style variables in the format `{ ref: \"path.to.value\" }`.\n *\n * @param features GlobalStylesContext config (user, base, or merged). Represents the theme.json tree.\n * @param blockName The name of a block as represented in the styles property. E.g., 'root' for root-level, and 'core/block-name' for blocks.\n * @param variable An incoming style value. A CSS var value is expected, but it could be any value.\n * @return The value of the CSS var, if found. If not found, returns the original variable argument.\n */\nexport function getValueFromVariable(\n\tfeatures: GlobalStylesConfig,\n\tblockName?: string,\n\tvariable?: string | UnresolvedValue\n): any {\n\tif ( ! variable || typeof variable !== 'string' ) {\n\t\tif (\n\t\t\ttypeof variable === 'object' &&\n\t\t\tvariable !== null &&\n\t\t\t'ref' in variable &&\n\t\t\ttypeof variable.ref === 'string'\n\t\t) {\n\t\t\tconst resolvedVariable = getValueFromObjectPath(\n\t\t\t\tfeatures,\n\t\t\t\tvariable.ref\n\t\t\t);\n\t\t\t// Presence of another ref indicates a reference to another dynamic value.\n\t\t\t// Pointing to another dynamic value is not supported.\n\t\t\tif (\n\t\t\t\t! resolvedVariable ||\n\t\t\t\t( typeof resolvedVariable === 'object' &&\n\t\t\t\t\t'ref' in resolvedVariable )\n\t\t\t) {\n\t\t\t\treturn resolvedVariable;\n\t\t\t}\n\t\t\tvariable = resolvedVariable as string;\n\t\t} else {\n\t\t\treturn variable;\n\t\t}\n\t}\n\tconst USER_VALUE_PREFIX = 'var:';\n\tconst THEME_VALUE_PREFIX = 'var(--wp--';\n\tconst THEME_VALUE_SUFFIX = ')';\n\n\tlet parsedVar;\n\n\tif ( variable.startsWith( USER_VALUE_PREFIX ) ) {\n\t\tparsedVar = variable.slice( USER_VALUE_PREFIX.length ).split( '|' );\n\t} else if (\n\t\tvariable.startsWith( THEME_VALUE_PREFIX ) &&\n\t\tvariable.endsWith( THEME_VALUE_SUFFIX )\n\t) {\n\t\tparsedVar = variable\n\t\t\t.slice( THEME_VALUE_PREFIX.length, -THEME_VALUE_SUFFIX.length )\n\t\t\t.split( '--' );\n\t} else {\n\t\t// We don't know how to parse the value: either is raw of uses complex CSS such as `calc(1px * var(--wp--variable) )`\n\t\treturn variable;\n\t}\n\n\tconst [ type, ...path ] = parsedVar;\n\tif ( type === 'preset' ) {\n\t\treturn getValueFromPresetVariable(\n\t\t\tfeatures,\n\t\t\tblockName,\n\t\t\tvariable,\n\t\t\tpath\n\t\t);\n\t}\n\tif ( type === 'custom' ) {\n\t\treturn getValueFromCustomVariable(\n\t\t\tfeatures,\n\t\t\tblockName,\n\t\t\tvariable,\n\t\t\tpath\n\t\t);\n\t}\n\treturn variable;\n}\n\n/**\n * Encodes a value to a preset variable format if it matches a preset.\n * This is the inverse operation of getValueFromVariable().\n *\n * @example\n * ```js\n * const presetVar = getPresetVariableFromValue(\n * globalStyles.settings,\n * 'core/paragraph',\n * 'color.text',\n * '#ff0000'\n * );\n * // If #ff0000 is the 'red' preset color, returns 'var:preset|color|red'\n * // Otherwise returns '#ff0000'\n * ```\n *\n * @param features GlobalStylesContext settings object.\n * @param blockName The name of a block (e.g., 'core/paragraph').\n * @param variableStylePath The style path (e.g., 'color.text', 'typography.fontSize').\n * @param presetPropertyValue The value to encode (e.g., '#ff0000').\n * @return The preset variable if found, otherwise the original value.\n */\nexport function getPresetVariableFromValue(\n\tfeatures: GlobalStylesSettings,\n\tblockName: string | undefined,\n\tvariableStylePath: string,\n\tpresetPropertyValue: any\n): any {\n\tif ( ! presetPropertyValue ) {\n\t\treturn presetPropertyValue;\n\t}\n\n\tconst cssVarInfix = STYLE_PATH_TO_CSS_VAR_INFIX[ variableStylePath ];\n\n\tconst metadata = PRESET_METADATA.find(\n\t\t( data ) => data.cssVarInfix === cssVarInfix\n\t);\n\n\tif ( ! metadata ) {\n\t\t// The property doesn't have preset data\n\t\t// so the value should be returned as it is.\n\t\treturn presetPropertyValue;\n\t}\n\tconst { valueKey, path } = metadata;\n\n\tconst presetObject = findInPresetsBy(\n\t\tfeatures,\n\t\tblockName,\n\t\tpath,\n\t\tvalueKey,\n\t\tpresetPropertyValue\n\t);\n\n\tif ( ! presetObject ) {\n\t\t// Value wasn't found in the presets,\n\t\t// so it must be a custom value.\n\t\treturn presetPropertyValue;\n\t}\n\n\treturn `var:preset|${ cssVarInfix }|${ presetObject.slug }`;\n}\n"],
|
|
5
|
-
"mappings": "AAGA,SAAS,+BAA+B;AAYxC,SAAS,kCAAkC;AAC3C,SAAS,8BAA8B;AAEhC,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/duotone.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * External dependencies\n */\nimport { colord } from 'colord';\n\n/**\n * Convert a list of colors to an object of R, G, and B values.\n *\n * @param colors Array of RBG color strings.\n *\n * @return R, G, and B values.\n */\nexport function getValuesFromColors( colors: string[] = [] ) {\n\tconst values: { r: number[]; g: number[]; b: number[]; a: number[] } = {\n\t\tr: [],\n\t\tg: [],\n\t\tb: [],\n\t\ta: [],\n\t};\n\n\tcolors.forEach( ( color ) => {\n\t\tconst rgbColor = colord( color ).toRgb();\n\t\tvalues.r.push( rgbColor.r / 255 );\n\t\tvalues.g.push( rgbColor.g / 255 );\n\t\tvalues.b.push( rgbColor.b / 255 );\n\t\tvalues.a.push( rgbColor.a );\n\t} );\n\n\treturn values;\n}\n\n/**\n * Stylesheet for disabling a global styles duotone filter.\n *\n * @param selector Selector to disable the filter for.\n *\n * @return Filter none style.\n */\nexport function getDuotoneUnsetStylesheet( selector: string ) {\n\treturn `${ selector }{filter:none}`;\n}\n\n/**\n * SVG and stylesheet needed for rendering the duotone filter.\n *\n * @param {string} selector Selector to apply the filter to.\n * @param {string} id Unique id for this duotone filter.\n *\n * @return {string} Duotone filter style.\n */\nexport function getDuotoneStylesheet( selector: string, id: string ) {\n\treturn `${ selector }{filter:url(#${ id })}`;\n}\n\n/**\n * The SVG part of the duotone filter.\n *\n * @param id Unique id for this duotone filter.\n * @param colors Color strings from dark to light.\n *\n * @return Duotone SVG.\n */\nexport function getDuotoneFilter( id: string, colors: string[] ) {\n\tconst values = getValuesFromColors( colors );\n\treturn `\n<svg\n\txmlns:xlink=\"http://www.w3.org/1999/xlink\"\n\tviewBox=\"0 0 0 0\"\n\twidth=\"0\"\n\theight=\"0\"\n\tfocusable=\"false\"\n\trole=\"none\"\n\taria-hidden=\"true\"\n\tstyle=\"visibility: hidden; position: absolute; left: -9999px; overflow: hidden;\"\n>\n\t<defs>\n\t\t<filter id=\"${ id }\">\n\t\t\t<!--\n\t\t\t\tUse sRGB instead of linearRGB so transparency looks correct.\n\t\t\t\tUse perceptual brightness to convert to grayscale.\n\t\t\t-->\n\t\t\t<feColorMatrix color-interpolation-filters=\"sRGB\" type=\"matrix\" values=\" .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 \"></feColorMatrix>\n\t\t\t<!-- Use sRGB instead of linearRGB to be consistent with how CSS gradients work. -->\n\t\t\t<feComponentTransfer color-interpolation-filters=\"sRGB\">\n\t\t\t\t<feFuncR type=\"table\" tableValues=\"${ values.r.join( ' ' ) }\"></feFuncR>\n\t\t\t\t<feFuncG type=\"table\" tableValues=\"${ values.g.join( ' ' ) }\"></feFuncG>\n\t\t\t\t<feFuncB type=\"table\" tableValues=\"${ values.b.join( ' ' ) }\"></feFuncB>\n\t\t\t\t<feFuncA type=\"table\" tableValues=\"${ values.a.join( ' ' ) }\"></feFuncA>\n\t\t\t</feComponentTransfer>\n\t\t\t<!-- Re-mask the image with the original transparency since the feColorMatrix above loses that information. -->\n\t\t\t<feComposite in2=\"SourceGraphic\" operator=\"in\"></feComposite>\n\t\t</filter>\n\t</defs>\n</svg>`;\n}\n"],
|
|
5
|
-
"mappings": "AAGA,SAAS,cAAc;AAShB,SAAS,oBAAqB,SAAmB,CAAC,GAAI;AAC5D,QAAM,SAAiE;AAAA,IACtE,GAAG,CAAC;AAAA,IACJ,GAAG,CAAC;AAAA,IACJ,GAAG,CAAC;AAAA,IACJ,GAAG,CAAC;AAAA,EACL;AAEA,SAAO,QAAS,CAAE,UAAW;AAC5B,UAAM,WAAW,OAAQ,KAAM,EAAE,MAAM;AACvC,WAAO,EAAE,KAAM,SAAS,IAAI,GAAI;AAChC,WAAO,EAAE,KAAM,SAAS,IAAI,GAAI;AAChC,WAAO,EAAE,KAAM,SAAS,IAAI,GAAI;AAChC,WAAO,EAAE,KAAM,SAAS,CAAE;AAAA,EAC3B,CAAE;AAEF,SAAO;AACR;AASO,SAAS,0BAA2B,UAAmB;AAC7D,SAAO,GAAI,QAAS;AACrB;AAUO,SAAS,qBAAsB,UAAkB,IAAa;AACpE,SAAO,GAAI,QAAS,gBAAiB,EAAG;AACzC;AAUO,SAAS,iBAAkB,IAAY,QAAmB;AAChE,QAAM,SAAS,oBAAqB,MAAO;AAC3C,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAYS,EAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yCAQsB,OAAO,EAAE,KAAM,GAAI,CAAE;AAAA,yCACrB,OAAO,EAAE,KAAM,GAAI,CAAE;AAAA,yCACrB,OAAO,EAAE,KAAM,GAAI,CAAE;AAAA,yCACrB,OAAO,EAAE,KAAM,GAAI,CAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAO/D;",
|
|
5
|
+
"mappings": ";AAGA,SAAS,cAAc;AAShB,SAAS,oBAAqB,SAAmB,CAAC,GAAI;AAC5D,QAAM,SAAiE;AAAA,IACtE,GAAG,CAAC;AAAA,IACJ,GAAG,CAAC;AAAA,IACJ,GAAG,CAAC;AAAA,IACJ,GAAG,CAAC;AAAA,EACL;AAEA,SAAO,QAAS,CAAE,UAAW;AAC5B,UAAM,WAAW,OAAQ,KAAM,EAAE,MAAM;AACvC,WAAO,EAAE,KAAM,SAAS,IAAI,GAAI;AAChC,WAAO,EAAE,KAAM,SAAS,IAAI,GAAI;AAChC,WAAO,EAAE,KAAM,SAAS,IAAI,GAAI;AAChC,WAAO,EAAE,KAAM,SAAS,CAAE;AAAA,EAC3B,CAAE;AAEF,SAAO;AACR;AASO,SAAS,0BAA2B,UAAmB;AAC7D,SAAO,GAAI,QAAS;AACrB;AAUO,SAAS,qBAAsB,UAAkB,IAAa;AACpE,SAAO,GAAI,QAAS,gBAAiB,EAAG;AACzC;AAUO,SAAS,iBAAkB,IAAY,QAAmB;AAChE,QAAM,SAAS,oBAAqB,MAAO;AAC3C,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAYS,EAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yCAQsB,OAAO,EAAE,KAAM,GAAI,CAAE;AAAA,yCACrB,OAAO,EAAE,KAAM,GAAI,CAAE;AAAA,yCACrB,OAAO,EAAE,KAAM,GAAI,CAAE;AAAA,yCACrB,OAAO,EAAE,KAAM,GAAI,CAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAO/D;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
// packages/global-styles-engine/src/utils/fluid.ts
|
|
2
|
+
var DEFAULT_MAXIMUM_VIEWPORT_WIDTH = "1600px";
|
|
3
|
+
var DEFAULT_MINIMUM_VIEWPORT_WIDTH = "320px";
|
|
4
|
+
var DEFAULT_SCALE_FACTOR = 1;
|
|
5
|
+
var DEFAULT_MINIMUM_FONT_SIZE_FACTOR_MIN = 0.25;
|
|
6
|
+
var DEFAULT_MINIMUM_FONT_SIZE_FACTOR_MAX = 0.75;
|
|
7
|
+
var DEFAULT_MINIMUM_FONT_SIZE_LIMIT = "14px";
|
|
7
8
|
function getComputedFluidTypographyValue({
|
|
8
9
|
minimumFontSize,
|
|
9
10
|
maximumFontSize,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/fluid.ts"],
|
|
4
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// Defaults.\nconst DEFAULT_MAXIMUM_VIEWPORT_WIDTH = '1600px';\nconst DEFAULT_MINIMUM_VIEWPORT_WIDTH = '320px';\nconst DEFAULT_SCALE_FACTOR = 1;\nconst DEFAULT_MINIMUM_FONT_SIZE_FACTOR_MIN = 0.25;\nconst DEFAULT_MINIMUM_FONT_SIZE_FACTOR_MAX = 0.75;\nconst DEFAULT_MINIMUM_FONT_SIZE_LIMIT = '14px';\n\n/**\n * Computes a fluid font-size value that uses clamp(). A minimum and maximum\n * font size OR a single font size can be specified.\n *\n * If a single font size is specified, it is scaled up and down using a logarithmic scale.\n *\n * @example\n * ```js\n * // Calculate fluid font-size value from a minimum and maximum value.\n * const fontSize = getComputedFluidTypographyValue( {\n * minimumFontSize: '20px',\n * maximumFontSize: '45px'\n * } );\n * // Calculate fluid font-size value from a single font size.\n * const fontSize = getComputedFluidTypographyValue( {\n * fontSize: '30px',\n * } );\n * ```\n *\n * @param {Object} args\n * @param {?string} args.minimumViewportWidth Minimum viewport size from which type will have fluidity. Optional if fontSize is specified.\n * @param {?string} args.maximumViewportWidth Maximum size up to which type will have fluidity. Optional if fontSize is specified.\n * @param {string|number} [args.fontSize] Size to derive maximumFontSize and minimumFontSize from, if necessary. Optional if minimumFontSize and maximumFontSize are specified.\n * @param {?string} args.maximumFontSize Maximum font size for any clamp() calculation. Optional.\n * @param {?string} args.minimumFontSize Minimum font size for any clamp() calculation. Optional.\n * @param {?number} args.scaleFactor A scale factor to determine how fast a font scales within boundaries. Optional.\n * @param {?string} args.minimumFontSizeLimit The smallest a calculated font size may be. Optional.\n *\n * @return {string|null} A font-size value using clamp().\n */\nexport function getComputedFluidTypographyValue( {\n\tminimumFontSize,\n\tmaximumFontSize,\n\tfontSize,\n\tminimumViewportWidth = DEFAULT_MINIMUM_VIEWPORT_WIDTH,\n\tmaximumViewportWidth = DEFAULT_MAXIMUM_VIEWPORT_WIDTH,\n\tscaleFactor = DEFAULT_SCALE_FACTOR,\n\tminimumFontSizeLimit,\n}: {\n\tminimumFontSize?: string;\n\tmaximumFontSize?: string;\n\tfontSize?: string | number;\n\tminimumViewportWidth?: string;\n\tmaximumViewportWidth?: string;\n\tscaleFactor?: number;\n\tminimumFontSizeLimit?: string;\n} ) {\n\t// Validate incoming settings and set defaults.\n\tminimumFontSizeLimit = !! getTypographyValueAndUnit( minimumFontSizeLimit )\n\t\t? minimumFontSizeLimit\n\t\t: DEFAULT_MINIMUM_FONT_SIZE_LIMIT;\n\n\t/*\n\t * Calculates missing minimumFontSize and maximumFontSize from\n\t * defaultFontSize if provided.\n\t */\n\tif ( fontSize ) {\n\t\t// Parses default font size.\n\t\tconst fontSizeParsed = getTypographyValueAndUnit( fontSize );\n\n\t\t// Protect against invalid units.\n\t\tif ( ! fontSizeParsed?.unit || ! fontSizeParsed?.value ) {\n\t\t\treturn null;\n\t\t}\n\n\t\t// Parses the minimum font size limit, so we can perform checks using it.\n\t\tconst minimumFontSizeLimitParsed = getTypographyValueAndUnit(\n\t\t\tminimumFontSizeLimit,\n\t\t\t{\n\t\t\t\tcoerceTo: fontSizeParsed.unit,\n\t\t\t}\n\t\t);\n\n\t\t// Don't enforce minimum font size if a font size has explicitly set a min and max value.\n\t\tif (\n\t\t\t!! minimumFontSizeLimitParsed?.value &&\n\t\t\t! minimumFontSize &&\n\t\t\t! maximumFontSize\n\t\t) {\n\t\t\t/*\n\t\t\t * If a minimum size was not passed to this function\n\t\t\t * and the user-defined font size is lower than $minimum_font_size_limit,\n\t\t\t * do not calculate a fluid value.\n\t\t\t */\n\t\t\tif ( fontSizeParsed?.value <= minimumFontSizeLimitParsed?.value ) {\n\t\t\t\treturn null;\n\t\t\t}\n\t\t}\n\n\t\t// If no fluid max font size is available use the incoming value.\n\t\tif ( ! maximumFontSize ) {\n\t\t\tmaximumFontSize = `${ fontSizeParsed.value }${ fontSizeParsed.unit }`;\n\t\t}\n\n\t\t/*\n\t\t * If no minimumFontSize is provided, create one using\n\t\t * the given font size multiplied by the min font size scale factor.\n\t\t */\n\t\tif ( ! minimumFontSize ) {\n\t\t\tconst fontSizeValueInPx =\n\t\t\t\tfontSizeParsed.unit === 'px'\n\t\t\t\t\t? fontSizeParsed.value\n\t\t\t\t\t: fontSizeParsed.value * 16;\n\n\t\t\t/*\n\t\t\t * The scale factor is a multiplier that affects how quickly the curve will move towards the minimum,\n\t\t\t * that is, how quickly the size factor reaches 0 given increasing font size values.\n\t\t\t * For a - b * log2(), lower values of b will make the curve move towards the minimum faster.\n\t\t\t * The scale factor is constrained between min and max values.\n\t\t\t */\n\t\t\tconst minimumFontSizeFactor = Math.min(\n\t\t\t\tMath.max(\n\t\t\t\t\t1 - 0.075 * Math.log2( fontSizeValueInPx ),\n\t\t\t\t\tDEFAULT_MINIMUM_FONT_SIZE_FACTOR_MIN\n\t\t\t\t),\n\t\t\t\tDEFAULT_MINIMUM_FONT_SIZE_FACTOR_MAX\n\t\t\t);\n\n\t\t\t// Calculates the minimum font size.\n\t\t\tconst calculatedMinimumFontSize = roundToPrecision(\n\t\t\t\tfontSizeParsed.value * minimumFontSizeFactor,\n\t\t\t\t3\n\t\t\t) as number;\n\n\t\t\t// Only use calculated min font size if it's > $minimum_font_size_limit value.\n\t\t\tif (\n\t\t\t\t!! minimumFontSizeLimitParsed?.value &&\n\t\t\t\tcalculatedMinimumFontSize < minimumFontSizeLimitParsed?.value\n\t\t\t) {\n\t\t\t\tminimumFontSize = `${ minimumFontSizeLimitParsed.value }${ minimumFontSizeLimitParsed.unit }`;\n\t\t\t} else {\n\t\t\t\tminimumFontSize = `${ calculatedMinimumFontSize }${ fontSizeParsed.unit }`;\n\t\t\t}\n\t\t}\n\t}\n\n\t// Grab the minimum font size and normalize it in order to use the value for calculations.\n\tconst minimumFontSizeParsed = getTypographyValueAndUnit( minimumFontSize );\n\n\t// We get a 'preferred' unit to keep units consistent when calculating,\n\t// otherwise the result will not be accurate.\n\tconst fontSizeUnit = minimumFontSizeParsed?.unit || 'rem';\n\n\t// Grabs the maximum font size and normalize it in order to use the value for calculations.\n\tconst maximumFontSizeParsed = getTypographyValueAndUnit( maximumFontSize, {\n\t\tcoerceTo: fontSizeUnit,\n\t} );\n\n\t// Checks for mandatory min and max sizes, and protects against unsupported units.\n\tif ( ! minimumFontSizeParsed || ! maximumFontSizeParsed ) {\n\t\treturn null;\n\t}\n\n\t// Uses rem for accessible fluid target font scaling.\n\tconst minimumFontSizeRem = getTypographyValueAndUnit( minimumFontSize, {\n\t\tcoerceTo: 'rem',\n\t} );\n\n\t// Viewport widths defined for fluid typography. Normalize units\n\tconst maximumViewportWidthParsed = getTypographyValueAndUnit(\n\t\tmaximumViewportWidth,\n\t\t{ coerceTo: fontSizeUnit }\n\t);\n\tconst minimumViewportWidthParsed = getTypographyValueAndUnit(\n\t\tminimumViewportWidth,\n\t\t{ coerceTo: fontSizeUnit }\n\t);\n\n\t// Protect against unsupported units.\n\tif (\n\t\t! maximumViewportWidthParsed ||\n\t\t! minimumViewportWidthParsed ||\n\t\t! minimumFontSizeRem\n\t) {\n\t\treturn null;\n\t}\n\n\t// Calculates the linear factor denominator. If it's 0, we cannot calculate a fluid value.\n\tconst linearDenominator =\n\t\tmaximumViewportWidthParsed.value - minimumViewportWidthParsed.value;\n\tif ( ! linearDenominator ) {\n\t\treturn null;\n\t}\n\n\t// Build CSS rule.\n\t// Borrowed from https://websemantics.uk/tools/responsive-font-calculator/.\n\tconst minViewportWidthOffsetValue = roundToPrecision(\n\t\tminimumViewportWidthParsed.value / 100,\n\t\t3\n\t);\n\n\tconst viewportWidthOffset =\n\t\troundToPrecision( minViewportWidthOffsetValue, 3 ) + fontSizeUnit;\n\tconst linearFactor =\n\t\t100 *\n\t\t( ( maximumFontSizeParsed.value - minimumFontSizeParsed.value ) /\n\t\t\tlinearDenominator );\n\tconst linearFactorScaled = roundToPrecision(\n\t\t( linearFactor || 1 ) * scaleFactor,\n\t\t3\n\t);\n\tconst fluidTargetFontSize = `${ minimumFontSizeRem.value }${ minimumFontSizeRem.unit } + ((1vw - ${ viewportWidthOffset }) * ${ linearFactorScaled })`;\n\n\treturn `clamp(${ minimumFontSize }, ${ fluidTargetFontSize }, ${ maximumFontSize })`;\n}\n\n/**\n * Internal method that checks a string for a unit and value and returns an array consisting of `'value'` and `'unit'`, e.g., [ '42', 'rem' ].\n * A raw font size of `value + unit` is expected. If the value is an integer, it will convert to `value + 'px'`.\n *\n * @param rawValue Raw size value from theme.json.\n * @param options Calculation options.\n *\n * @return An object consisting of `'value'` and `'unit'` properties.\n */\nexport function getTypographyValueAndUnit(\n\trawValue?: string | number,\n\toptions = {}\n) {\n\tif ( typeof rawValue !== 'string' && typeof rawValue !== 'number' ) {\n\t\treturn null;\n\t}\n\n\t// Converts numeric values to pixel values by default.\n\tif ( isFinite( rawValue as number ) ) {\n\t\trawValue = `${ rawValue }px`;\n\t}\n\n\tconst { coerceTo, rootSizeValue, acceptableUnits } = {\n\t\tcoerceTo: '',\n\t\t// Default browser font size. Later we could inject some JS to compute this `getComputedStyle( document.querySelector( \"html\" ) ).fontSize`.\n\t\trootSizeValue: 16,\n\t\tacceptableUnits: [ 'rem', 'px', 'em' ],\n\t\t...options,\n\t};\n\n\tconst acceptableUnitsGroup = acceptableUnits?.join( '|' );\n\tconst regexUnits = new RegExp(\n\t\t`^(\\\\d*\\\\.?\\\\d+)(${ acceptableUnitsGroup }){1,1}$`\n\t);\n\n\tconst matches = rawValue.toString().match( regexUnits );\n\n\t// We need a number value and a unit.\n\tif ( ! matches || matches.length < 3 ) {\n\t\treturn null;\n\t}\n\n\tlet [ , value, unit ] = matches;\n\n\tlet returnValue = parseFloat( value );\n\n\tif ( 'px' === coerceTo && ( 'em' === unit || 'rem' === unit ) ) {\n\t\treturnValue = returnValue * rootSizeValue;\n\t\tunit = coerceTo;\n\t}\n\n\tif ( 'px' === unit && ( 'em' === coerceTo || 'rem' === coerceTo ) ) {\n\t\treturnValue = returnValue / rootSizeValue;\n\t\tunit = coerceTo;\n\t}\n\n\t/*\n\t * No calculation is required if swapping between em and rem yet,\n\t * since we assume a root size value. Later we might like to differentiate between\n\t * :root font size (rem) and parent element font size (em) relativity.\n\t */\n\tif (\n\t\t( 'em' === coerceTo || 'rem' === coerceTo ) &&\n\t\t( 'em' === unit || 'rem' === unit )\n\t) {\n\t\tunit = coerceTo;\n\t}\n\n\tif ( ! unit ) {\n\t\treturn null;\n\t}\n\n\treturn {\n\t\tvalue: roundToPrecision( returnValue, 3 ),\n\t\tunit,\n\t};\n}\n\n/**\n * Returns a value rounded to defined precision.\n * Returns `undefined` if the value is not a valid finite number.\n *\n * @param value Raw value.\n * @param digits The number of digits to appear after the decimal point\n *\n * @return Value rounded to standard precision.\n */\nexport function roundToPrecision( value: number, digits: number = 3 ) {\n\tconst base = Math.pow( 10, digits );\n\treturn Math.round( value * base ) / base;\n}\n"],
|
|
5
|
-
"mappings": "AAOA,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/gap.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport { getSpacingPresetCssVar } from './spacing';\n\n/**\n * Returns a BoxControl object value from a given blockGap style value.\n * The string check is for backwards compatibility before Gutenberg supported\n * split gap values (row and column) and the value was a string n + unit.\n *\n * @param blockGapValue A block gap string or axial object value, e.g., '10px' or { top: '10px', left: '10px'}.\n * @return A value to pass to the BoxControl component.\n */\nexport function getGapBoxControlValueFromStyle(\n\tblockGapValue?: string | { top: string; left: string }\n) {\n\tif ( ! blockGapValue ) {\n\t\treturn null;\n\t}\n\n\tconst isValueString = typeof blockGapValue === 'string';\n\treturn {\n\t\ttop: isValueString ? blockGapValue : blockGapValue?.top,\n\t\tleft: isValueString ? blockGapValue : blockGapValue?.left,\n\t};\n}\n\n/**\n * Returns a CSS value for the `gap` property from a given blockGap style.\n *\n * @param blockGapValue A block gap string or axial object value, e.g., '10px' or { top: '10px', left: '10px'}.\n * @param defaultValue A default gap value.\n * @return The concatenated gap value (row and column).\n */\nexport function getGapCSSValue(\n\tblockGapValue?:\n\t\t| string\n\t\t| {\n\t\t\t\ttop: string;\n\t\t\t\tleft: string;\n\t\t },\n\tdefaultValue: string = '0'\n) {\n\tconst blockGapBoxControlValue =\n\t\tgetGapBoxControlValueFromStyle( blockGapValue );\n\tif ( ! blockGapBoxControlValue ) {\n\t\treturn null;\n\t}\n\n\tconst row =\n\t\tgetSpacingPresetCssVar( blockGapBoxControlValue?.top ) || defaultValue;\n\tconst column =\n\t\tgetSpacingPresetCssVar( blockGapBoxControlValue?.left ) || defaultValue;\n\n\treturn row === column ? row : `${ row } ${ column }`;\n}\n"],
|
|
5
|
-
"mappings": "AAGA,SAAS,8BAA8B;AAUhC,SAAS,+BACf,eACC;AACD,MAAK,CAAE,eAAgB;AACtB,WAAO;AAAA,EACR;AAEA,QAAM,gBAAgB,OAAO,kBAAkB;AAC/C,SAAO;AAAA,IACN,KAAK,gBAAgB,gBAAgB,eAAe;AAAA,IACpD,MAAM,gBAAgB,gBAAgB,eAAe;AAAA,EACtD;AACD;AASO,SAAS,eACf,eAMA,eAAuB,KACtB;AACD,QAAM,0BACL,+BAAgC,aAAc;AAC/C,MAAK,CAAE,yBAA0B;AAChC,WAAO;AAAA,EACR;AAEA,QAAM,MACL,uBAAwB,yBAAyB,GAAI,KAAK;AAC3D,QAAM,SACL,uBAAwB,yBAAyB,IAAK,KAAK;AAE5D,SAAO,QAAQ,SAAS,MAAM,GAAI,GAAI,IAAK,MAAO;AACnD;",
|
|
5
|
+
"mappings": ";AAGA,SAAS,8BAA8B;AAUhC,SAAS,+BACf,eACC;AACD,MAAK,CAAE,eAAgB;AACtB,WAAO;AAAA,EACR;AAEA,QAAM,gBAAgB,OAAO,kBAAkB;AAC/C,SAAO;AAAA,IACN,KAAK,gBAAgB,gBAAgB,eAAe;AAAA,IACpD,MAAM,gBAAgB,gBAAgB,eAAe;AAAA,EACtD;AACD;AASO,SAAS,eACf,eAMA,eAAuB,KACtB;AACD,QAAM,0BACL,+BAAgC,aAAc;AAC/C,MAAK,CAAE,yBAA0B;AAChC,WAAO;AAAA,EACR;AAEA,QAAM,MACL,uBAAwB,yBAAyB,GAAI,KAAK;AAC3D,QAAM,SACL,uBAAwB,yBAAyB,IAAK,KAAK;AAE5D,SAAO,QAAQ,SAAS,MAAM,GAAI,GAAI,IAAK,MAAO;AACnD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
|
+
// packages/global-styles-engine/src/utils/get-global-styles-changes.ts
|
|
1
2
|
import memoize from "memize";
|
|
2
3
|
import { __, _n, sprintf } from "@wordpress/i18n";
|
|
3
4
|
import { getBlockTypes } from "@wordpress/blocks";
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
var globalStylesChangesCache = /* @__PURE__ */ new Map();
|
|
6
|
+
var EMPTY_ARRAY = [];
|
|
7
|
+
var translationMap = {
|
|
7
8
|
caption: __("Caption"),
|
|
8
9
|
link: __("Link"),
|
|
9
10
|
button: __("Button"),
|
|
@@ -23,7 +24,7 @@ const translationMap = {
|
|
|
23
24
|
"styles.background": __("Background"),
|
|
24
25
|
"styles.typography": __("Typography")
|
|
25
26
|
};
|
|
26
|
-
|
|
27
|
+
var getBlockNames = memoize(
|
|
27
28
|
() => getBlockTypes().reduce(
|
|
28
29
|
(accumulator, {
|
|
29
30
|
name,
|
|
@@ -35,7 +36,7 @@ const getBlockNames = memoize(
|
|
|
35
36
|
{}
|
|
36
37
|
)
|
|
37
38
|
);
|
|
38
|
-
|
|
39
|
+
var isObject = (obj) => obj !== null && typeof obj === "object";
|
|
39
40
|
function getTranslation(key) {
|
|
40
41
|
if (translationMap[key]) {
|
|
41
42
|
return translationMap[key];
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/get-global-styles-changes.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * External dependencies\n */\nimport memoize from 'memize';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\n// @ts-expect-error blocks package not typed yet.\nimport { getBlockTypes } from '@wordpress/blocks';\n\ntype TranslationMap = Record< string, string >;\ntype BlockNamesMap = Record< string, string >;\ntype ChangeEntry = [ string, string ];\n\ninterface GetGlobalStylesChangesOptions {\n\tmaxResults?: number;\n}\n\nconst globalStylesChangesCache = new Map< string, ChangeEntry[] >();\nconst EMPTY_ARRAY: string[] = [];\nconst translationMap: TranslationMap = {\n\tcaption: __( 'Caption' ),\n\tlink: __( 'Link' ),\n\tbutton: __( 'Button' ),\n\theading: __( 'Heading' ),\n\th1: __( 'H1' ),\n\th2: __( 'H2' ),\n\th3: __( 'H3' ),\n\th4: __( 'H4' ),\n\th5: __( 'H5' ),\n\th6: __( 'H6' ),\n\t'settings.color': __( 'Color' ),\n\t'settings.typography': __( 'Typography' ),\n\t'settings.shadow': __( 'Shadow' ),\n\t'settings.layout': __( 'Layout' ),\n\t'styles.color': __( 'Colors' ),\n\t'styles.spacing': __( 'Spacing' ),\n\t'styles.background': __( 'Background' ),\n\t'styles.typography': __( 'Typography' ),\n};\nconst getBlockNames = memoize(\n\t(): BlockNamesMap =>\n\t\tgetBlockTypes().reduce< BlockNamesMap >(\n\t\t\t(\n\t\t\t\taccumulator: BlockNamesMap,\n\t\t\t\t{\n\t\t\t\t\tname,\n\t\t\t\t\ttitle,\n\t\t\t\t}: {\n\t\t\t\t\tname: string;\n\t\t\t\t\ttitle: string;\n\t\t\t\t}\n\t\t\t) => {\n\t\t\t\taccumulator[ name ] = title;\n\t\t\t\treturn accumulator;\n\t\t\t},\n\t\t\t{}\n\t\t)\n);\nconst isObject = ( obj: any ): obj is Record< string, any > =>\n\tobj !== null && typeof obj === 'object';\n\n/**\n * Get the translation for a given global styles key.\n * @param key A key representing a path to a global style property or setting.\n * @return A translated key or undefined if no translation exists.\n */\nfunction getTranslation( key: string ): string | undefined {\n\tif ( translationMap[ key ] ) {\n\t\treturn translationMap[ key ];\n\t}\n\n\tconst keyArray = key.split( '.' );\n\n\tif ( keyArray?.[ 0 ] === 'blocks' ) {\n\t\tconst blockName = getBlockNames()?.[ keyArray[ 1 ] ];\n\t\treturn blockName || keyArray[ 1 ];\n\t}\n\n\tif ( keyArray?.[ 0 ] === 'elements' ) {\n\t\treturn translationMap[ keyArray[ 1 ] ] || keyArray[ 1 ];\n\t}\n\n\treturn undefined;\n}\n\n/**\n * A deep comparison of two objects, optimized for comparing global styles.\n * @param changedObject The changed object to compare.\n * @param originalObject The original object to compare against.\n * @param parentPath A key/value pair object of block names and their rendered titles.\n * @return An array of paths whose values have changed.\n */\nfunction deepCompare(\n\tchangedObject: any,\n\toriginalObject: any,\n\tparentPath: string = ''\n): string | string[] | undefined {\n\t// We have two non-object values to compare.\n\tif ( ! isObject( changedObject ) && ! isObject( originalObject ) ) {\n\t\t/*\n\t\t * Only return a path if the value has changed.\n\t\t * And then only the path name up to 2 levels deep.\n\t\t */\n\t\treturn changedObject !== originalObject\n\t\t\t? parentPath.split( '.' ).slice( 0, 2 ).join( '.' )\n\t\t\t: undefined;\n\t}\n\n\t// Enable comparison when an object doesn't have a corresponding property to compare.\n\tchangedObject = isObject( changedObject ) ? changedObject : {};\n\toriginalObject = isObject( originalObject ) ? originalObject : {};\n\n\tconst allKeys = new Set( [\n\t\t...Object.keys( changedObject ),\n\t\t...Object.keys( originalObject ),\n\t] );\n\n\tlet diffs: string[] = [];\n\tfor ( const key of allKeys ) {\n\t\tconst path = parentPath ? parentPath + '.' + key : key;\n\t\tconst changedPath = deepCompare(\n\t\t\tchangedObject[ key ],\n\t\t\toriginalObject[ key ],\n\t\t\tpath\n\t\t);\n\t\tif ( changedPath ) {\n\t\t\tdiffs = diffs.concat( changedPath );\n\t\t}\n\t}\n\treturn diffs;\n}\n\n/**\n * Returns an array of translated summarized global styles changes.\n * Results are cached using a Map() key of `JSON.stringify( { next, previous } )`.\n *\n * @param next The changed object to compare.\n * @param previous The original object to compare against.\n * @return A 2-dimensional array of tuples: [ \"group\", \"translated change\" ].\n */\nexport function getGlobalStylesChangelist(\n\tnext: any,\n\tprevious: any\n): ChangeEntry[] {\n\tconst cacheKey = JSON.stringify( { next, previous } );\n\n\tif ( globalStylesChangesCache.has( cacheKey ) ) {\n\t\treturn globalStylesChangesCache.get( cacheKey )!;\n\t}\n\n\t/*\n\t * Compare the two changesets with normalized keys.\n\t * The order of these keys determines the order in which\n\t * they'll appear in the results.\n\t */\n\tconst changedValueTree = deepCompare(\n\t\t{\n\t\t\tstyles: {\n\t\t\t\tbackground: next?.styles?.background,\n\t\t\t\tcolor: next?.styles?.color,\n\t\t\t\ttypography: next?.styles?.typography,\n\t\t\t\tspacing: next?.styles?.spacing,\n\t\t\t},\n\t\t\tblocks: next?.styles?.blocks,\n\t\t\telements: next?.styles?.elements,\n\t\t\tsettings: next?.settings,\n\t\t},\n\t\t{\n\t\t\tstyles: {\n\t\t\t\tbackground: previous?.styles?.background,\n\t\t\t\tcolor: previous?.styles?.color,\n\t\t\t\ttypography: previous?.styles?.typography,\n\t\t\t\tspacing: previous?.styles?.spacing,\n\t\t\t},\n\t\t\tblocks: previous?.styles?.blocks,\n\t\t\telements: previous?.styles?.elements,\n\t\t\tsettings: previous?.settings,\n\t\t}\n\t);\n\n\tif (\n\t\t! changedValueTree ||\n\t\t( Array.isArray( changedValueTree ) && ! changedValueTree.length )\n\t) {\n\t\tglobalStylesChangesCache.set( cacheKey, [] );\n\t\treturn [];\n\t}\n\n\tconst changedValueArray = Array.isArray( changedValueTree )\n\t\t? changedValueTree\n\t\t: [ changedValueTree ];\n\n\t// Remove duplicate results.\n\tconst result = [ ...new Set( changedValueArray ) ]\n\t\t/*\n\t\t * Translate the keys.\n\t\t * Remove empty translations.\n\t\t */\n\t\t.reduce< ChangeEntry[] >( ( acc, curr ) => {\n\t\t\tconst translation = getTranslation( curr );\n\t\t\tif ( translation ) {\n\t\t\t\tacc.push( [ curr.split( '.' )[ 0 ], translation ] );\n\t\t\t}\n\t\t\treturn acc;\n\t\t}, [] );\n\n\tglobalStylesChangesCache.set( cacheKey, result );\n\n\treturn result;\n}\n\n/**\n * From a getGlobalStylesChangelist() result, returns an array of translated global styles changes, grouped by type.\n * The types are 'blocks', 'elements', 'settings', and 'styles'.\n *\n * @param next The changed object to compare.\n * @param previous The original object to compare against.\n * @param options Options. maxResults: results to return before truncating.\n * @return An array of translated changes.\n */\nexport default function getGlobalStylesChanges(\n\tnext: any,\n\tprevious: any,\n\toptions: GetGlobalStylesChangesOptions = {}\n): string[] {\n\tlet changeList = getGlobalStylesChangelist( next, previous );\n\tconst changesLength = changeList.length;\n\tconst { maxResults } = options;\n\n\tif ( changesLength ) {\n\t\t// Truncate to `n` results if necessary.\n\t\tif ( !! maxResults && changesLength > maxResults ) {\n\t\t\tchangeList = changeList.slice( 0, maxResults );\n\t\t}\n\t\treturn Object.entries(\n\t\t\tchangeList.reduce< Record< string, string[] > >( ( acc, curr ) => {\n\t\t\t\tconst group = acc[ curr[ 0 ] ] || [];\n\t\t\t\tif ( ! group.includes( curr[ 1 ] ) ) {\n\t\t\t\t\tacc[ curr[ 0 ] ] = [ ...group, curr[ 1 ] ];\n\t\t\t\t}\n\t\t\t\treturn acc;\n\t\t\t}, {} )\n\t\t).map( ( [ key, changeValues ] ) => {\n\t\t\tconst changeValuesLength = changeValues.length;\n\t\t\tconst joinedChangesValue = changeValues.join(\n\t\t\t\t/* translators: Used between list items, there is a space after the comma. */\n\t\t\t\t__( ', ' ) // eslint-disable-line @wordpress/i18n-no-flanking-whitespace\n\t\t\t);\n\t\t\tswitch ( key ) {\n\t\t\t\tcase 'blocks': {\n\t\t\t\t\treturn sprintf(\n\t\t\t\t\t\t// translators: %s: a list of block names separated by a comma.\n\t\t\t\t\t\t_n( '%s block.', '%s blocks.', changeValuesLength ),\n\t\t\t\t\t\tjoinedChangesValue\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tcase 'elements': {\n\t\t\t\t\treturn sprintf(\n\t\t\t\t\t\t// translators: %s: a list of element names separated by a comma.\n\t\t\t\t\t\t_n( '%s element.', '%s elements.', changeValuesLength ),\n\t\t\t\t\t\tjoinedChangesValue\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tcase 'settings': {\n\t\t\t\t\treturn sprintf(\n\t\t\t\t\t\t// translators: %s: a list of theme.json setting labels separated by a comma.\n\t\t\t\t\t\t__( '%s settings.' ),\n\t\t\t\t\t\tjoinedChangesValue\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tcase 'styles': {\n\t\t\t\t\treturn sprintf(\n\t\t\t\t\t\t// translators: %s: a list of theme.json top-level styles labels separated by a comma.\n\t\t\t\t\t\t__( '%s styles.' ),\n\t\t\t\t\t\tjoinedChangesValue\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tdefault: {\n\t\t\t\t\treturn sprintf(\n\t\t\t\t\t\t// translators: %s: a list of global styles changes separated by a comma.\n\t\t\t\t\t\t__( '%s.' ),\n\t\t\t\t\t\tjoinedChangesValue\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\t\t} );\n\t}\n\n\treturn EMPTY_ARRAY;\n}\n"],
|
|
5
|
-
"mappings": "AAGA,OAAO,aAAa;AAKpB,SAAS,IAAI,IAAI,eAAe;AAEhC,SAAS,qBAAqB;AAU9B,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/layout.ts"],
|
|
4
4
|
"sourcesContent": ["// Layout definitions keyed by layout type.\n// Provides a common definition of slugs, classnames, base styles, and spacing styles for each layout type.\n// If making changes or additions to layout definitions, be sure to update the corresponding PHP definitions in\n// `block-supports/layout.php` so that the server-side and client-side definitions match.\nexport const LAYOUT_DEFINITIONS = {\n\tdefault: {\n\t\tname: 'default',\n\t\tslug: 'flow',\n\t\tclassName: 'is-layout-flow',\n\t\tbaseStyles: [\n\t\t\t{\n\t\t\t\tselector: ' > .alignleft',\n\t\t\t\trules: {\n\t\t\t\t\tfloat: 'left',\n\t\t\t\t\t'margin-inline-start': '0',\n\t\t\t\t\t'margin-inline-end': '2em',\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tselector: ' > .alignright',\n\t\t\t\trules: {\n\t\t\t\t\tfloat: 'right',\n\t\t\t\t\t'margin-inline-start': '2em',\n\t\t\t\t\t'margin-inline-end': '0',\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tselector: ' > .aligncenter',\n\t\t\t\trules: {\n\t\t\t\t\t'margin-left': 'auto !important',\n\t\t\t\t\t'margin-right': 'auto !important',\n\t\t\t\t},\n\t\t\t},\n\t\t],\n\t\tspacingStyles: [\n\t\t\t{\n\t\t\t\tselector: ' > :first-child',\n\t\t\t\trules: {\n\t\t\t\t\t'margin-block-start': '0',\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tselector: ' > :last-child',\n\t\t\t\trules: {\n\t\t\t\t\t'margin-block-end': '0',\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tselector: ' > *',\n\t\t\t\trules: {\n\t\t\t\t\t'margin-block-start': null,\n\t\t\t\t\t'margin-block-end': '0',\n\t\t\t\t},\n\t\t\t},\n\t\t],\n\t},\n\tconstrained: {\n\t\tname: 'constrained',\n\t\tslug: 'constrained',\n\t\tclassName: 'is-layout-constrained',\n\t\tbaseStyles: [\n\t\t\t{\n\t\t\t\tselector: ' > .alignleft',\n\t\t\t\trules: {\n\t\t\t\t\tfloat: 'left',\n\t\t\t\t\t'margin-inline-start': '0',\n\t\t\t\t\t'margin-inline-end': '2em',\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tselector: ' > .alignright',\n\t\t\t\trules: {\n\t\t\t\t\tfloat: 'right',\n\t\t\t\t\t'margin-inline-start': '2em',\n\t\t\t\t\t'margin-inline-end': '0',\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tselector: ' > .aligncenter',\n\t\t\t\trules: {\n\t\t\t\t\t'margin-left': 'auto !important',\n\t\t\t\t\t'margin-right': 'auto !important',\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tselector:\n\t\t\t\t\t' > :where(:not(.alignleft):not(.alignright):not(.alignfull))',\n\t\t\t\trules: {\n\t\t\t\t\t'max-width': 'var(--wp--style--global--content-size)',\n\t\t\t\t\t'margin-left': 'auto !important',\n\t\t\t\t\t'margin-right': 'auto !important',\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tselector: ' > .alignwide',\n\t\t\t\trules: {\n\t\t\t\t\t'max-width': 'var(--wp--style--global--wide-size)',\n\t\t\t\t},\n\t\t\t},\n\t\t],\n\t\tspacingStyles: [\n\t\t\t{\n\t\t\t\tselector: ' > :first-child',\n\t\t\t\trules: {\n\t\t\t\t\t'margin-block-start': '0',\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tselector: ' > :last-child',\n\t\t\t\trules: {\n\t\t\t\t\t'margin-block-end': '0',\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tselector: ' > *',\n\t\t\t\trules: {\n\t\t\t\t\t'margin-block-start': null,\n\t\t\t\t\t'margin-block-end': '0',\n\t\t\t\t},\n\t\t\t},\n\t\t],\n\t},\n\tflex: {\n\t\tname: 'flex',\n\t\tslug: 'flex',\n\t\tclassName: 'is-layout-flex',\n\t\tdisplayMode: 'flex',\n\t\tbaseStyles: [\n\t\t\t{\n\t\t\t\tselector: '',\n\t\t\t\trules: {\n\t\t\t\t\t'flex-wrap': 'wrap',\n\t\t\t\t\t'align-items': 'center',\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tselector: ' > :is(*, div)', // :is(*, div) instead of just * increases the specificity by 001.\n\t\t\t\trules: {\n\t\t\t\t\tmargin: '0',\n\t\t\t\t},\n\t\t\t},\n\t\t],\n\t\tspacingStyles: [\n\t\t\t{\n\t\t\t\tselector: '',\n\t\t\t\trules: {\n\t\t\t\t\tgap: null,\n\t\t\t\t},\n\t\t\t},\n\t\t],\n\t},\n\tgrid: {\n\t\tname: 'grid',\n\t\tslug: 'grid',\n\t\tclassName: 'is-layout-grid',\n\t\tdisplayMode: 'grid',\n\t\tbaseStyles: [\n\t\t\t{\n\t\t\t\tselector: ' > :is(*, div)', // :is(*, div) instead of just * increases the specificity by 001.\n\t\t\t\trules: {\n\t\t\t\t\tmargin: '0',\n\t\t\t\t},\n\t\t\t},\n\t\t],\n\t\tspacingStyles: [\n\t\t\t{\n\t\t\t\tselector: '',\n\t\t\t\trules: {\n\t\t\t\t\tgap: null,\n\t\t\t\t},\n\t\t\t},\n\t\t],\n\t},\n};\n"],
|
|
5
|
-
"mappings": "AAIO,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
// packages/global-styles-engine/src/utils/object.ts
|
|
1
2
|
function setImmutably(object, path, value) {
|
|
2
3
|
path = Array.isArray(path) ? [...path] : [path];
|
|
3
4
|
object = Array.isArray(object) ? [...object] : { ...object };
|
|
@@ -10,7 +11,7 @@ function setImmutably(object, path, value) {
|
|
|
10
11
|
prev[leaf] = value;
|
|
11
12
|
return object;
|
|
12
13
|
}
|
|
13
|
-
|
|
14
|
+
var getValueFromObjectPath = (object, path, defaultValue) => {
|
|
14
15
|
const arrayPath = Array.isArray(path) ? path : path.split(".");
|
|
15
16
|
let value = object;
|
|
16
17
|
arrayPath.forEach((fieldName) => {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/object.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Immutably sets a value inside an object. Like `lodash#set`, but returning a\n * new object. Treats nullish initial values as empty objects. Clones any\n * nested objects. Supports arrays, too.\n *\n * @param object Object to set a value in.\n * @param path Path in the object to modify.\n * @param value New value to set.\n * @return Cloned object with the new value set.\n */\nexport function setImmutably(\n\tobject: Object,\n\tpath: string | number | ( string | number )[],\n\tvalue: any\n) {\n\t// Normalize path\n\tpath = Array.isArray( path ) ? [ ...path ] : [ path ];\n\n\t// Shallowly clone the base of the object\n\tobject = Array.isArray( object ) ? [ ...object ] : { ...object };\n\n\tconst leaf = path.pop();\n\n\t// Traverse object from root to leaf, shallowly cloning at each level\n\tlet prev = object;\n\tfor ( const key of path ) {\n\t\t// @ts-expect-error\n\t\tconst lvl = prev[ key ];\n\t\t// @ts-expect-error\n\t\tprev = prev[ key ] = Array.isArray( lvl ) ? [ ...lvl ] : { ...lvl };\n\t}\n\t// @ts-expect-error\n\tprev[ leaf ] = value;\n\n\treturn object;\n}\n\n/**\n * Helper util to return a value from a certain path of the object.\n *\n * Path is specified as either:\n * - a string of properties, separated by dots, for example: \"x.y\".\n * - an array of properties, for example `[ 'x', 'y' ]`.\n *\n * You can also specify a default value in case the result is nullish.\n *\n * @param object Input object.\n * @param path Path to the object property.\n * @param defaultValue Default value if the value at the specified path is nullish.\n * @return Value of the object property at the specified path.\n */\nexport const getValueFromObjectPath = (\n\tobject: Object,\n\tpath: string | string[],\n\tdefaultValue?: any\n) => {\n\tconst arrayPath = Array.isArray( path ) ? path : path.split( '.' );\n\tlet value = object;\n\tarrayPath.forEach( ( fieldName ) => {\n\t\t// @ts-expect-error\n\t\tvalue = value?.[ fieldName ];\n\t} );\n\treturn value ?? defaultValue;\n};\n"],
|
|
5
|
-
"mappings": "AAUO,SAAS,aACf,QACA,MACA,OACC;AAED,SAAO,MAAM,QAAS,IAAK,IAAI,CAAE,GAAG,IAAK,IAAI,CAAE,IAAK;AAGpD,WAAS,MAAM,QAAS,MAAO,IAAI,CAAE,GAAG,MAAO,IAAI,EAAE,GAAG,OAAO;AAE/D,QAAM,OAAO,KAAK,IAAI;AAGtB,MAAI,OAAO;AACX,aAAY,OAAO,MAAO;AAEzB,UAAM,MAAM,KAAM,GAAI;AAEtB,WAAO,KAAM,GAAI,IAAI,MAAM,QAAS,GAAI,IAAI,CAAE,GAAG,GAAI,IAAI,EAAE,GAAG,IAAI;AAAA,EACnE;AAEA,OAAM,IAAK,IAAI;AAEf,SAAO;AACR;AAgBO,
|
|
5
|
+
"mappings": ";AAUO,SAAS,aACf,QACA,MACA,OACC;AAED,SAAO,MAAM,QAAS,IAAK,IAAI,CAAE,GAAG,IAAK,IAAI,CAAE,IAAK;AAGpD,WAAS,MAAM,QAAS,MAAO,IAAI,CAAE,GAAG,MAAO,IAAI,EAAE,GAAG,OAAO;AAE/D,QAAM,OAAO,KAAK,IAAI;AAGtB,MAAI,OAAO;AACX,aAAY,OAAO,MAAO;AAEzB,UAAM,MAAM,KAAM,GAAI;AAEtB,WAAO,KAAM,GAAI,IAAI,MAAM,QAAS,GAAI,IAAI,CAAE,GAAG,GAAI,IAAI,EAAE,GAAG,IAAI;AAAA,EACnE;AAEA,OAAM,IAAK,IAAI;AAEf,SAAO;AACR;AAgBO,IAAM,yBAAyB,CACrC,QACA,MACA,iBACI;AACJ,QAAM,YAAY,MAAM,QAAS,IAAK,IAAI,OAAO,KAAK,MAAO,GAAI;AACjE,MAAI,QAAQ;AACZ,YAAU,QAAS,CAAE,cAAe;AAEnC,YAAQ,QAAS,SAAU;AAAA,EAC5B,CAAE;AACF,SAAO,SAAS;AACjB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/spacing.ts"],
|
|
4
4
|
"sourcesContent": ["export function getSpacingPresetCssVar( value?: string ) {\n\tif ( ! value ) {\n\t\treturn;\n\t}\n\n\tconst slug = value.match( /var:preset\\|spacing\\|(.+)/ );\n\n\tif ( ! slug ) {\n\t\treturn value;\n\t}\n\n\treturn `var(--wp--preset--spacing--${ slug[ 1 ] })`;\n}\n"],
|
|
5
|
-
"mappings": "AAAO,SAAS,uBAAwB,OAAiB;AACxD,MAAK,CAAE,OAAQ;AACd;AAAA,EACD;AAEA,QAAM,OAAO,MAAM,MAAO,2BAA4B;AAEtD,MAAK,CAAE,MAAO;AACb,WAAO;AAAA,EACR;AAEA,SAAO,8BAA+B,KAAM,CAAE,CAAE;AACjD;",
|
|
5
|
+
"mappings": ";AAAO,SAAS,uBAAwB,OAAiB;AACxD,MAAK,CAAE,OAAQ;AACd;AAAA,EACD;AAEA,QAAM,OAAO,MAAM,MAAO,2BAA4B;AAEtD,MAAK,CAAE,MAAO;AACb,WAAO;AAAA,EACR;AAEA,SAAO,8BAA+B,KAAM,CAAE,CAAE;AACjD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/string.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Converts a string to kebab-case.\n * Matches WordPress kebabCase behavior.\n *\n * @param str The string to convert\n * @return The kebab-cased string\n */\nexport function kebabCase( str: string ): string {\n\treturn str\n\t\t.replace( /([a-z])([A-Z])/g, '$1-$2' ) // camelCase to kebab-case\n\t\t.replace( /([0-9])([a-zA-Z])/g, '$1-$2' ) // number followed by letter\n\t\t.replace( /([a-zA-Z])([0-9])/g, '$1-$2' ) // letter followed by number\n\t\t.replace( /[\\s_]+/g, '-' ) // spaces and underscores to hyphens\n\t\t.toLowerCase();\n}\n"],
|
|
5
|
-
"mappings": "AAOO,SAAS,UAAW,KAAsB;AAChD,SAAO,IACL,QAAS,mBAAmB,OAAQ,EACpC,QAAS,sBAAsB,OAAQ,EACvC,QAAS,sBAAsB,OAAQ,EACvC,QAAS,WAAW,GAAI,EACxB,YAAY;AACf;",
|
|
5
|
+
"mappings": ";AAOO,SAAS,UAAW,KAAsB;AAChD,SAAO,IACL,QAAS,mBAAmB,OAAQ,EACpC,QAAS,sBAAsB,OAAQ,EACvC,QAAS,sBAAsB,OAAQ,EACvC,QAAS,WAAW,GAAI,EACxB,YAAY;AACf;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/typography.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type {\n\tTypographyPreset,\n\tGlobalStylesSettings,\n\tFluidTypographySettings,\n\tTypographySettings,\n} from '../types';\nimport {\n\tgetTypographyValueAndUnit,\n\tgetComputedFluidTypographyValue,\n} from './fluid';\n\n/**\n * Checks if fluid typography is enabled in the given typography settings.\n *\n * Fluid typography is considered enabled if the fluid setting is explicitly set to true,\n * or if it's an object with properties (which would contain fluid typography configuration\n * like minViewportWidth, maxViewportWidth, etc.).\n *\n * @param typographySettings Typography settings object that may contain fluid typography configuration.\n * @param typographySettings.fluid Fluid typography configuration. Can be:\n * - `true` to enable with default settings\n * - An object with fluid settings (minViewportWidth, maxViewportWidth, etc.)\n * - `false` or `undefined` to disable\n *\n * @return True if fluid typography is enabled, false otherwise.\n */\nfunction isFluidTypographyEnabled(\n\ttypographySettings?: TypographySettings | TypographyPreset\n) {\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 settings Theme.json settings\n * @param settings.typography Theme.json typography settings\n * @param settings.layout Theme.json layout settings\n * @return Fluid typography settings\n */\nexport function getFluidTypographyOptionsFromSettings(\n\tsettings: GlobalStylesSettings\n): { fluid?: FluidTypographySettings | boolean | undefined } {\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...( typeof typographySettings.fluid === 'object'\n\t\t\t\t\t\t? typographySettings.fluid\n\t\t\t\t\t\t: {} ),\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 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 A typography preset object containing size and fluid properties.\n * @param settings Global styles settings object containing typography and layout settings.\n *\n * @return A font-size value or the value of preset.size.\n */\nexport function getTypographyFontSizeValue(\n\tpreset: TypographyPreset,\n\tsettings: GlobalStylesSettings\n) {\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\tconst fluidTypographySettings =\n\t\tgetFluidTypographyOptionsFromSettings( settings )?.fluid ?? {};\n\n\tconst fluidFontSizeValue = getComputedFluidTypographyValue( {\n\t\tminimumFontSize:\n\t\t\ttypeof preset?.fluid === 'boolean' ? undefined : preset?.fluid?.min,\n\t\tmaximumFontSize:\n\t\t\ttypeof preset?.fluid === 'boolean' ? undefined : preset?.fluid?.max,\n\t\tfontSize: defaultSize,\n\t\tminimumFontSizeLimit:\n\t\t\ttypeof fluidTypographySettings === 'object'\n\t\t\t\t? fluidTypographySettings?.minFontSize\n\t\t\t\t: undefined,\n\t\tmaximumViewportWidth:\n\t\t\ttypeof fluidTypographySettings === 'object'\n\t\t\t\t? fluidTypographySettings?.maxViewportWidth\n\t\t\t\t: undefined,\n\t\tminimumViewportWidth:\n\t\t\ttypeof fluidTypographySettings === 'object'\n\t\t\t\t? fluidTypographySettings?.minViewportWidth\n\t\t\t\t: undefined,\n\t} );\n\n\tif ( !! fluidFontSizeValue ) {\n\t\treturn fluidFontSizeValue;\n\t}\n\n\treturn defaultSize;\n}\n"],
|
|
5
|
-
"mappings": "AASA;AAAA,EACC;AAAA,EACA;AAAA,OACM;AAiBP,SAAS,yBACR,oBACC;AACD,QAAM,gBAAgB,oBAAoB;AAC1C,SACC,SAAS,iBACP,iBACD,OAAO,kBAAkB,YACzB,OAAO,KAAM,aAAc,EAAE,SAAS;AAEzC;AAUO,SAAS,sCACf,UAC4D;AAC5D,QAAM,qBAAqB,UAAU,cAAc,CAAC;AACpD,QAAM,iBAAiB,UAAU;AACjC,QAAM,0BAA0B;AAAA,IAC/B,gBAAgB;AAAA,EACjB,IACG,gBAAgB,WAChB;AACH,SAAO,yBAA0B,kBAAmB,KACnD,0BACE;AAAA,IACA,OAAO;AAAA,MACN,kBAAkB;AAAA,MAClB,GAAK,OAAO,mBAAmB,UAAU,WACtC,mBAAmB,QACnB,CAAC;AAAA,IACL;AAAA,EACA,IACA;AAAA,IACA,OAAO,oBAAoB;AAAA,EAC3B;AACJ;AAaO,SAAS,2BACf,QACA,UACC;AACD,QAAM,EAAE,MAAM,YAAY,IAAI;AAM9B,MAAK,CAAE,eAAe,QAAQ,eAAe,UAAU,QAAQ,OAAQ;AACtE,WAAO;AAAA,EACR;AASA,MACC,CAAE,yBAA0B,UAAU,UAAW,KACjD,CAAE,yBAA0B,MAAO,GAClC;AACD,WAAO;AAAA,EACR;AAEA,QAAM,0BACL,sCAAuC,QAAS,GAAG,SAAS,CAAC;AAE9D,QAAM,qBAAqB,gCAAiC;AAAA,IAC3D,iBACC,OAAO,QAAQ,UAAU,YAAY,SAAY,QAAQ,OAAO;AAAA,IACjE,iBACC,OAAO,QAAQ,UAAU,YAAY,SAAY,QAAQ,OAAO;AAAA,IACjE,UAAU;AAAA,IACV,sBACC,OAAO,4BAA4B,WAChC,yBAAyB,cACzB;AAAA,IACJ,sBACC,OAAO,4BAA4B,WAChC,yBAAyB,mBACzB;AAAA,IACJ,sBACC,OAAO,4BAA4B,WAChC,yBAAyB,mBACzB;AAAA,EACL,CAAE;AAEF,MAAK,CAAC,CAAE,oBAAqB;AAC5B,WAAO;AAAA,EACR;AAEA,SAAO;AACR;",
|
|
5
|
+
"mappings": ";AASA;AAAA,EACC;AAAA,EACA;AAAA,OACM;AAiBP,SAAS,yBACR,oBACC;AACD,QAAM,gBAAgB,oBAAoB;AAC1C,SACC,SAAS,iBACP,iBACD,OAAO,kBAAkB,YACzB,OAAO,KAAM,aAAc,EAAE,SAAS;AAEzC;AAUO,SAAS,sCACf,UAC4D;AAC5D,QAAM,qBAAqB,UAAU,cAAc,CAAC;AACpD,QAAM,iBAAiB,UAAU;AACjC,QAAM,0BAA0B;AAAA,IAC/B,gBAAgB;AAAA,EACjB,IACG,gBAAgB,WAChB;AACH,SAAO,yBAA0B,kBAAmB,KACnD,0BACE;AAAA,IACA,OAAO;AAAA,MACN,kBAAkB;AAAA,MAClB,GAAK,OAAO,mBAAmB,UAAU,WACtC,mBAAmB,QACnB,CAAC;AAAA,IACL;AAAA,EACA,IACA;AAAA,IACA,OAAO,oBAAoB;AAAA,EAC3B;AACJ;AAaO,SAAS,2BACf,QACA,UACC;AACD,QAAM,EAAE,MAAM,YAAY,IAAI;AAM9B,MAAK,CAAE,eAAe,QAAQ,eAAe,UAAU,QAAQ,OAAQ;AACtE,WAAO;AAAA,EACR;AASA,MACC,CAAE,yBAA0B,UAAU,UAAW,KACjD,CAAE,yBAA0B,MAAO,GAClC;AACD,WAAO;AAAA,EACR;AAEA,QAAM,0BACL,sCAAuC,QAAS,GAAG,SAAS,CAAC;AAE9D,QAAM,qBAAqB,gCAAiC;AAAA,IAC3D,iBACC,OAAO,QAAQ,UAAU,YAAY,SAAY,QAAQ,OAAO;AAAA,IACjE,iBACC,OAAO,QAAQ,UAAU,YAAY,SAAY,QAAQ,OAAO;AAAA,IACjE,UAAU;AAAA,IACV,sBACC,OAAO,4BAA4B,WAChC,yBAAyB,cACzB;AAAA,IACJ,sBACC,OAAO,4BAA4B,WAChC,yBAAyB,mBACzB;AAAA,IACJ,sBACC,OAAO,4BAA4B,WAChC,yBAAyB,mBACzB;AAAA,EACL,CAAE;AAEF,MAAK,CAAC,CAAE,oBAAqB;AAC5B,WAAO;AAAA,EACR;AAEA,SAAO;AACR;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/core/render.tsx"],"names":[],"mappings":"AAoCA,OAAO,KAAK,EAEX,SAAS,EACT,kBAAkB,EAElB,kBAAkB,EAClB,MAAM,UAAU,CAAC;AA6ClB;;GAEG;AACH,UAAU,gBAAgB;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,KAAK,CAAE;QACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,KAAK,CAAC,EAAE,MAAM,CAAE,MAAM,EAAE,GAAG,CAAE,CAAC;KAC9B,CAAE,CAAC;IACJ,UAAU,CAAC,EAAE,KAAK,CAAE;QACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,KAAK,CAAC,EAAE,MAAM,CAAE,MAAM,EAAE,GAAG,CAAE,CAAC;KAC9B,CAAE,CAAC;CACJ;AA6BD,MAAM,MAAM,cAAc,GAAG,MAAM,CAClC,MAAM,EACN;IACC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,gBAAgB,CAAC,EACd,MAAM,GACN,MAAM,CAAE,MAAM,EAAE,MAAM,GAAG,MAAM,CAAE,MAAM,EAAE,MAAM,CAAE,CAAE,CAAC;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uBAAuB,CAAC,EAAE,MAAM,CAAE,MAAM,EAAE,MAAM,CAAE,CAAC;CACnD,CACD,CAAC;AAkSF;;;;;;;;;GASG;AACH,wBAAgB,qBAAqB,CACpC,WAAW,GAAE,GAAQ,EACrB,QAAQ,GAAE,MAAW,EACrB,mBAAmB,CAAC,EAAE,OAAO,EAC7B,IAAI,GAAE,GAAQ,EACd,kBAAkB,GAAE,OAAe,GACjC,MAAM,EAAE,CAqJV;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,eAAe,CAAE,EAChC,iBAAsC,EACtC,KAAK,EACL,QAAQ,EACR,kBAAkB,EAClB,qBAAqB,EACrB,gBAAgB,GAChB,EAAE;IACF,iBAAiB,CAAC,EAAE,MAAM,CAAE,MAAM,EAAE,gBAAgB,CAAE,CAAC;IACvD,KAAK,CAAC,EAAE,kBAAkB,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC1B,GAAI,MAAM,CA0HV;AA8BD,eAAO,MAAM,kBAAkB,
|
|
1
|
+
{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/core/render.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"object.d.ts","sourceRoot":"","sources":["../../src/utils/object.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,wBAAgB,YAAY,CAC3B,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,CAAE,MAAM,GAAG,MAAM,CAAE,EAAE,EAC7C,KAAK,EAAE,GAAG,UAsBV;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,sBAAsB,
|
|
1
|
+
{"version":3,"file":"object.d.ts","sourceRoot":"","sources":["../../src/utils/object.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,wBAAgB,YAAY,CAC3B,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,CAAE,MAAM,GAAG,MAAM,CAAE,EAAE,EAC7C,KAAK,EAAE,GAAG,UAsBV;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,sBAAsB,GAClC,QAAQ,MAAM,EACd,MAAM,MAAM,GAAG,MAAM,EAAE,EACvB,eAAe,GAAG,WASlB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wordpress/global-styles-engine",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.2.0",
|
|
4
4
|
"description": "Pure CSS generation engine for WordPress global styles.",
|
|
5
5
|
"author": "The WordPress Contributors",
|
|
6
6
|
"license": "GPL-2.0-or-later",
|
|
@@ -35,10 +35,10 @@
|
|
|
35
35
|
"types": "build-types/index.d.ts",
|
|
36
36
|
"sideEffects": false,
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@wordpress/blocks": "^15.
|
|
39
|
-
"@wordpress/data": "^10.
|
|
40
|
-
"@wordpress/i18n": "^6.
|
|
41
|
-
"@wordpress/style-engine": "^2.
|
|
38
|
+
"@wordpress/blocks": "^15.8.0",
|
|
39
|
+
"@wordpress/data": "^10.35.0",
|
|
40
|
+
"@wordpress/i18n": "^6.8.0",
|
|
41
|
+
"@wordpress/style-engine": "^2.35.0",
|
|
42
42
|
"colord": "^2.9.2",
|
|
43
43
|
"deepmerge": "^4.3.0",
|
|
44
44
|
"fast-deep-equal": "^3.1.3",
|
|
@@ -48,5 +48,5 @@
|
|
|
48
48
|
"publishConfig": {
|
|
49
49
|
"access": "public"
|
|
50
50
|
},
|
|
51
|
-
"gitHead": "
|
|
51
|
+
"gitHead": "77aa1f194edceafe8ac2a1b9438bf84b557e76e3"
|
|
52
52
|
}
|