@wordpress/theme 0.2.1-next.16d95556a.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bin/terrazzo-plugin-inline-alias-values/index.ts +43 -14
- package/build/color-ramps/index.js +16 -12
- package/build/color-ramps/index.js.map +2 -2
- package/build/color-ramps/lib/color-utils.js +5 -0
- package/build/color-ramps/lib/color-utils.js.map +2 -2
- package/build/color-ramps/lib/constants.js +1 -1
- package/build/color-ramps/lib/constants.js.map +1 -1
- package/build/color-ramps/lib/default-ramps.js +88 -88
- package/build/color-ramps/lib/default-ramps.js.map +1 -1
- package/build/color-ramps/lib/find-color-with-constraints.js +1 -1
- package/build/color-ramps/lib/find-color-with-constraints.js.map +2 -2
- package/build/color-ramps/lib/index.js +2 -2
- package/build/color-ramps/lib/index.js.map +2 -2
- package/build/color-ramps/lib/ramp-configs.js +2 -2
- package/build/color-ramps/lib/ramp-configs.js.map +1 -1
- package/build/color-ramps/lib/utils.js +4 -8
- package/build/color-ramps/lib/utils.js.map +2 -2
- package/build/prebuilt/js/design-tokens.js +5 -4
- package/build/prebuilt/js/design-tokens.js.map +2 -2
- package/build/prebuilt/json/figma.json +75 -59
- package/build/theme-provider.js +3 -1
- package/build/theme-provider.js.map +2 -2
- package/build/types.js.map +1 -1
- package/build-module/color-ramps/index.js +17 -13
- package/build-module/color-ramps/index.js.map +2 -2
- package/build-module/color-ramps/lib/color-utils.js +7 -1
- package/build-module/color-ramps/lib/color-utils.js.map +2 -2
- package/build-module/color-ramps/lib/constants.js +1 -1
- package/build-module/color-ramps/lib/constants.js.map +1 -1
- package/build-module/color-ramps/lib/default-ramps.js +88 -88
- package/build-module/color-ramps/lib/default-ramps.js.map +1 -1
- package/build-module/color-ramps/lib/find-color-with-constraints.js +2 -2
- package/build-module/color-ramps/lib/find-color-with-constraints.js.map +2 -2
- package/build-module/color-ramps/lib/index.js +1 -2
- package/build-module/color-ramps/lib/index.js.map +2 -2
- package/build-module/color-ramps/lib/ramp-configs.js +2 -2
- package/build-module/color-ramps/lib/ramp-configs.js.map +1 -1
- package/build-module/color-ramps/lib/utils.js +0 -3
- package/build-module/color-ramps/lib/utils.js.map +2 -2
- package/build-module/prebuilt/js/design-tokens.js +5 -4
- package/build-module/prebuilt/js/design-tokens.js.map +2 -2
- package/build-module/prebuilt/json/figma.json +75 -59
- package/build-module/theme-provider.js +3 -1
- package/build-module/theme-provider.js.map +2 -2
- package/build-types/color-ramps/index.d.ts +1 -0
- package/build-types/color-ramps/index.d.ts.map +1 -1
- package/build-types/color-ramps/lib/color-utils.d.ts +5 -0
- package/build-types/color-ramps/lib/color-utils.d.ts.map +1 -1
- package/build-types/color-ramps/lib/constants.d.ts +1 -1
- package/build-types/color-ramps/lib/constants.d.ts.map +1 -1
- package/build-types/color-ramps/lib/index.d.ts.map +1 -1
- package/build-types/color-ramps/lib/utils.d.ts +0 -5
- package/build-types/color-ramps/lib/utils.d.ts.map +1 -1
- package/build-types/color-ramps/stories/index.story.d.ts.map +1 -1
- package/build-types/stories/index.story.d.ts +1 -0
- package/build-types/stories/index.story.d.ts.map +1 -1
- package/build-types/theme-provider.d.ts +1 -1
- package/build-types/theme-provider.d.ts.map +1 -1
- package/build-types/types.d.ts +8 -0
- package/build-types/types.d.ts.map +1 -1
- package/docs/ds-tokens.md +8 -7
- package/package.json +4 -4
- package/src/color-ramps/index.ts +16 -11
- package/src/color-ramps/lib/color-utils.ts +11 -0
- package/src/color-ramps/lib/constants.ts +3 -3
- package/src/color-ramps/lib/default-ramps.ts +88 -88
- package/src/color-ramps/lib/find-color-with-constraints.ts +2 -2
- package/src/color-ramps/lib/index.ts +1 -2
- package/src/color-ramps/lib/ramp-configs.ts +2 -2
- package/src/color-ramps/lib/utils.ts +1 -8
- package/src/color-ramps/stories/index.story.tsx +7 -4
- package/src/prebuilt/css/design-tokens.css +81 -55
- package/src/prebuilt/js/design-tokens.js +5 -4
- package/src/prebuilt/json/figma.json +75 -59
- package/src/stories/index.story.tsx +23 -9
- package/src/theme-provider.tsx +2 -0
- package/src/types.ts +9 -0
- package/terrazzo.config.ts +21 -0
- package/tokens/color.json +88 -88
- package/tokens/dimension.json +44 -10
- package/tsconfig.bin.tsbuildinfo +1 -1
- package/tsconfig.src.tsbuildinfo +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/color-ramps/lib/utils.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport {
|
|
5
|
-
"mappings": ";
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport { type ColorTypes } from 'colorjs.io/fn';\n\n/**\n * Internal dependencies\n */\nimport './register-color-spaces';\nimport {\n\tWHITE,\n\tBLACK,\n\tUNIVERSAL_CONTRAST_TOPUP,\n\tWHITE_TEXT_CONTRAST_MARGIN,\n\tACCENT_SCALE_BASE_LIGHTNESS_THRESHOLDS,\n\tMAX_BISECTION_ITERATIONS,\n\tCONTRAST_EPSILON,\n} from './constants';\nimport type { Ramp, RampConfig, RampDirection } from './types';\nimport { getContrast } from './color-utils';\n\n/**\n * Build a dependency graph from the steps configuration\n * @param config - The steps configuration object\n */\nfunction buildDependencyGraph( config: RampConfig ): {\n\tdependencies: Map< keyof Ramp, ( keyof Ramp | 'seed' )[] >;\n\tdependents: Map< keyof Ramp | 'seed', ( keyof Ramp )[] >;\n} {\n\tconst dependencies = new Map< keyof Ramp, ( keyof Ramp | 'seed' )[] >();\n\tconst dependents = new Map< keyof Ramp | 'seed', ( keyof Ramp )[] >();\n\n\t// Initialize maps\n\tObject.keys( config ).forEach( ( step ) => {\n\t\tdependencies.set( step as keyof Ramp, [] );\n\t} );\n\tdependents.set( 'seed', [] );\n\tObject.keys( config ).forEach( ( step ) => {\n\t\tdependents.set( step as keyof Ramp, [] );\n\t} );\n\n\t// Build the graph\n\tObject.entries( config ).forEach( ( [ stepName, stepConfig ] ) => {\n\t\tconst step = stepName as keyof Ramp;\n\t\tconst reference = stepConfig.contrast.reference;\n\n\t\tdependencies.get( step )!.push( reference );\n\t\tdependents.get( reference )!.push( step );\n\n\t\t// Add dependency for sameAsIfPossible\n\t\tif ( stepConfig.sameAsIfPossible ) {\n\t\t\tdependencies.get( step )!.push( stepConfig.sameAsIfPossible );\n\t\t\tdependents.get( stepConfig.sameAsIfPossible )!.push( step );\n\t\t}\n\t} );\n\n\treturn { dependencies, dependents };\n}\n\n/**\n * Topologically sort steps based on their dependencies\n * @param config - The steps configuration object\n */\nexport function sortByDependency( config: RampConfig ): ( keyof Ramp )[] {\n\tconst { dependents } = buildDependencyGraph( config );\n\tconst result: ( keyof Ramp )[] = [];\n\tconst visited = new Set< keyof Ramp | 'seed' >();\n\tconst visiting = new Set< keyof Ramp | 'seed' >();\n\n\tfunction visit( node: keyof Ramp | 'seed' ): void {\n\t\tif ( visiting.has( node ) ) {\n\t\t\tthrow new Error(\n\t\t\t\t`Circular dependency detected involving step: ${ String(\n\t\t\t\t\tnode\n\t\t\t\t) }`\n\t\t\t);\n\t\t}\n\t\tif ( visited.has( node ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tvisiting.add( node );\n\n\t\t// Visit all dependents (steps that depend on this node)\n\t\tconst nodeDependents = dependents.get( node ) || [];\n\t\tnodeDependents.forEach( ( dependent ) => {\n\t\t\tvisit( dependent );\n\t\t} );\n\n\t\tvisiting.delete( node );\n\t\tvisited.add( node );\n\n\t\t// Add to result only if it's a step (not 'seed')\n\t\tif ( node !== 'seed' ) {\n\t\t\tresult.unshift( node ); // Add to front for correct topological order\n\t\t}\n\t}\n\n\t// Start with seed - this will recursively visit all reachable nodes\n\tvisit( 'seed' );\n\n\treturn result;\n}\n/**\n * Return minimal set of steps that are needed to calculate `stepName` from the seed.\n * @param stepName Name of the step.\n * @param config Configuration of the ramp.\n * @return Array of steps that `stepName` depends on.\n */\nexport function stepsForStep(\n\tstepName: keyof Ramp,\n\tconfig: RampConfig\n): ( keyof Ramp )[] {\n\tconst result = new Set< keyof Ramp >();\n\tfunction visit( step: keyof Ramp | 'seed' ) {\n\t\tif ( step === 'seed' || result.has( step ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst stepConfig = config[ step ];\n\t\tif ( ! stepConfig ) {\n\t\t\treturn;\n\t\t}\n\n\t\tvisit( stepConfig.contrast.reference );\n\t\tif ( stepConfig.sameAsIfPossible ) {\n\t\t\tvisit( stepConfig.sameAsIfPossible );\n\t\t}\n\n\t\tresult.add( step );\n\t}\n\tvisit( stepName );\n\treturn Array.from( result );\n}\n\n/**\n * Finds out whether a lighter or a darker foreground color achieves a better\n * contrast against the seed\n * @param seed\n * @param preferLighter Whether the check should favor white foreground color\n * @return An object with \"better\" and \"worse\" properties, each holding a\n * ramp direction value.\n */\nexport function computeBetterFgColorDirection(\n\tseed: ColorTypes,\n\tpreferLighter?: boolean\n): {\n\tbetter: RampDirection;\n\tworse: RampDirection;\n} {\n\tconst contrastAgainstBlack = getContrast( seed, BLACK );\n\tconst contrastAgainstWhite = getContrast( seed, WHITE );\n\n\treturn contrastAgainstBlack >\n\t\tcontrastAgainstWhite +\n\t\t\t( preferLighter ? WHITE_TEXT_CONTRAST_MARGIN : 0 )\n\t\t? { better: 'darker', worse: 'lighter' }\n\t\t: { better: 'lighter', worse: 'darker' };\n}\n\nexport function adjustContrastTarget( target: number ) {\n\tif ( target === 1 ) {\n\t\treturn 1;\n\t}\n\n\t// Add a little top up to take into account any rounding error and algo imprecisions.\n\treturn target + UNIVERSAL_CONTRAST_TOPUP;\n}\n\n/**\n * Prevent the accent scale from referencing a lightness value that\n * would prevent the algorithm from complying with the requirements\n * and cause it to generate unexpected results.\n * @param rawLightness\n * @param direction\n * @return The clamped lightness value\n */\nexport function clampAccentScaleReferenceLightness(\n\trawLightness: number,\n\tdirection: RampDirection\n) {\n\tconst thresholds = ACCENT_SCALE_BASE_LIGHTNESS_THRESHOLDS[ direction ];\n\treturn Math.max( thresholds.min, Math.min( thresholds.max, rawLightness ) );\n}\n\n/**\n * Find the value of of `L` (luminance) that produces a `C` (color) that has a\n * `value` (contrast delta) equal to zero.\n * @param calculateC Calculate `C` from a given `L`.\n * @param calculateValue Calculate value (delta) for a given `C`.\n * @param initLowerL Initial lower value of `L`.\n * @param initLowerValue Initial lower delta (negative).\n * @param initUpperL Initial upper value of `L`.\n * @param initUpperValue Initial upper delta (positive).\n * @return Resulting value of type `C`.\n */\nexport function solveWithBisect< C >(\n\tcalculateC: ( l: number ) => C,\n\tcalculateValue: ( t: C ) => number,\n\tinitLowerL: number,\n\tinitLowerValue: number,\n\tinitUpperL: number,\n\tinitUpperValue: number\n): C {\n\tlet lowerL = initLowerL;\n\tlet lowerValue = initLowerValue;\n\tlet lowerReplaced = false;\n\n\tlet upperL = initUpperL;\n\tlet upperValue = initUpperValue;\n\tlet upperReplaced = false;\n\n\tlet bestC: C;\n\tlet bestValue: number;\n\tlet iterations = 0;\n\n\twhile ( true ) {\n\t\titerations++;\n\n\t\t// Linear interpolation: find the point where a line would cross the zero axis.\n\t\tconst newL =\n\t\t\t( lowerL * upperValue - upperL * lowerValue ) /\n\t\t\t( upperValue - lowerValue );\n\n\t\tbestC = calculateC( newL );\n\t\tbestValue = calculateValue( bestC );\n\n\t\tif (\n\t\t\tMath.abs( bestValue ) <= CONTRAST_EPSILON ||\n\t\t\titerations >= MAX_BISECTION_ITERATIONS\n\t\t) {\n\t\t\tbreak;\n\t\t}\n\n\t\t// Update the lower/upper bracket values. When only one side is repeatedly updated,\n\t\t// apply so-called \"Illinois trick\" for faster convergence: halve the opposite value.\n\t\tif ( bestValue <= 0 ) {\n\t\t\tlowerL = newL;\n\t\t\tlowerValue = bestValue;\n\t\t\tif ( lowerReplaced ) {\n\t\t\t\tupperValue /= 2;\n\t\t\t}\n\t\t\tlowerReplaced = true;\n\t\t\tupperReplaced = false;\n\t\t} else {\n\t\t\tupperL = newL;\n\t\t\tupperValue = bestValue;\n\t\t\tif ( upperReplaced ) {\n\t\t\t\tlowerValue /= 2;\n\t\t\t}\n\t\t\tupperReplaced = true;\n\t\t\tlowerReplaced = false;\n\t\t}\n\t}\n\n\treturn bestC;\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -93,10 +93,11 @@ var design_tokens_default = [
|
|
|
93
93
|
"--wpds-color-stroke-interactive-error-strong",
|
|
94
94
|
"--wpds-color-stroke-focus-brand",
|
|
95
95
|
"--wpds-dimension-base",
|
|
96
|
-
"--wpds-dimension-padding-surface-
|
|
97
|
-
"--wpds-dimension-padding-surface-
|
|
98
|
-
"--wpds-dimension-padding-surface-
|
|
99
|
-
"--wpds-dimension-padding-surface-
|
|
96
|
+
"--wpds-dimension-padding-surface-2xs",
|
|
97
|
+
"--wpds-dimension-padding-surface-xs",
|
|
98
|
+
"--wpds-dimension-padding-surface-sm",
|
|
99
|
+
"--wpds-dimension-padding-surface-md",
|
|
100
|
+
"--wpds-dimension-padding-surface-lg",
|
|
100
101
|
"--wpds-elevation-x-small",
|
|
101
102
|
"--wpds-elevation-small",
|
|
102
103
|
"--wpds-elevation-medium",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/prebuilt/js/design-tokens.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * This file is generated by the @terrazzo/plugin-known-wpds-css-variables plugin.\n * Do not edit this file directly.\n */\n\nexport default [\n\t'--wpds-border-radius-x-small',\n\t'--wpds-border-radius-small',\n\t'--wpds-border-radius-medium',\n\t'--wpds-border-radius-large',\n\t'--wpds-border-width-focus',\n\t'--wpds-color-bg-surface-neutral',\n\t'--wpds-color-bg-surface-neutral-strong',\n\t'--wpds-color-bg-surface-neutral-weak',\n\t'--wpds-color-bg-surface-brand',\n\t'--wpds-color-bg-surface-success',\n\t'--wpds-color-bg-surface-success-weak',\n\t'--wpds-color-bg-surface-info',\n\t'--wpds-color-bg-surface-info-weak',\n\t'--wpds-color-bg-surface-warning',\n\t'--wpds-color-bg-surface-warning-weak',\n\t'--wpds-color-bg-surface-caution',\n\t'--wpds-color-bg-surface-caution-weak',\n\t'--wpds-color-bg-surface-error',\n\t'--wpds-color-bg-surface-error-weak',\n\t'--wpds-color-bg-interactive-neutral',\n\t'--wpds-color-bg-interactive-neutral-active',\n\t'--wpds-color-bg-interactive-neutral-disabled',\n\t'--wpds-color-bg-interactive-neutral-strong',\n\t'--wpds-color-bg-interactive-neutral-strong-active',\n\t'--wpds-color-bg-interactive-neutral-strong-disabled',\n\t'--wpds-color-bg-interactive-neutral-weak',\n\t'--wpds-color-bg-interactive-neutral-weak-active',\n\t'--wpds-color-bg-interactive-neutral-weak-disabled',\n\t'--wpds-color-bg-interactive-brand',\n\t'--wpds-color-bg-interactive-brand-active',\n\t'--wpds-color-bg-interactive-brand-disabled',\n\t'--wpds-color-bg-interactive-brand-strong',\n\t'--wpds-color-bg-interactive-brand-strong-active',\n\t'--wpds-color-bg-interactive-brand-strong-disabled',\n\t'--wpds-color-bg-interactive-brand-weak',\n\t'--wpds-color-bg-interactive-brand-weak-active',\n\t'--wpds-color-bg-interactive-brand-weak-disabled',\n\t'--wpds-color-bg-track-neutral-weak',\n\t'--wpds-color-bg-track-neutral',\n\t'--wpds-color-bg-thumb-neutral-weak',\n\t'--wpds-color-bg-thumb-neutral-weak-active',\n\t'--wpds-color-bg-thumb-brand',\n\t'--wpds-color-bg-thumb-brand-active',\n\t'--wpds-color-bg-thumb-brand-disabled',\n\t'--wpds-color-fg-content-neutral',\n\t'--wpds-color-fg-content-neutral-weak',\n\t'--wpds-color-fg-content-success',\n\t'--wpds-color-fg-content-success-weak',\n\t'--wpds-color-fg-content-info',\n\t'--wpds-color-fg-content-info-weak',\n\t'--wpds-color-fg-content-warning',\n\t'--wpds-color-fg-content-warning-weak',\n\t'--wpds-color-fg-content-caution',\n\t'--wpds-color-fg-content-caution-weak',\n\t'--wpds-color-fg-content-error',\n\t'--wpds-color-fg-content-error-weak',\n\t'--wpds-color-fg-interactive-neutral',\n\t'--wpds-color-fg-interactive-neutral-active',\n\t'--wpds-color-fg-interactive-neutral-disabled',\n\t'--wpds-color-fg-interactive-neutral-strong',\n\t'--wpds-color-fg-interactive-neutral-strong-active',\n\t'--wpds-color-fg-interactive-neutral-strong-disabled',\n\t'--wpds-color-fg-interactive-neutral-weak',\n\t'--wpds-color-fg-interactive-neutral-weak-disabled',\n\t'--wpds-color-fg-interactive-brand',\n\t'--wpds-color-fg-interactive-brand-active',\n\t'--wpds-color-fg-interactive-brand-disabled',\n\t'--wpds-color-fg-interactive-brand-strong',\n\t'--wpds-color-fg-interactive-brand-strong-active',\n\t'--wpds-color-fg-interactive-brand-strong-disabled',\n\t'--wpds-color-stroke-surface-neutral',\n\t'--wpds-color-stroke-surface-neutral-weak',\n\t'--wpds-color-stroke-surface-neutral-strong',\n\t'--wpds-color-stroke-surface-brand',\n\t'--wpds-color-stroke-surface-brand-strong',\n\t'--wpds-color-stroke-surface-success',\n\t'--wpds-color-stroke-surface-success-strong',\n\t'--wpds-color-stroke-surface-info',\n\t'--wpds-color-stroke-surface-info-strong',\n\t'--wpds-color-stroke-surface-warning',\n\t'--wpds-color-stroke-surface-warning-strong',\n\t'--wpds-color-stroke-surface-error',\n\t'--wpds-color-stroke-surface-error-strong',\n\t'--wpds-color-stroke-interactive-neutral',\n\t'--wpds-color-stroke-interactive-neutral-active',\n\t'--wpds-color-stroke-interactive-neutral-disabled',\n\t'--wpds-color-stroke-interactive-neutral-strong',\n\t'--wpds-color-stroke-interactive-brand',\n\t'--wpds-color-stroke-interactive-brand-active',\n\t'--wpds-color-stroke-interactive-brand-disabled',\n\t'--wpds-color-stroke-interactive-error-strong',\n\t'--wpds-color-stroke-focus-brand',\n\t'--wpds-dimension-base',\n\t'--wpds-dimension-padding-surface-
|
|
5
|
-
"mappings": ";AAKA,IAAO,wBAAQ;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;",
|
|
4
|
+
"sourcesContent": ["/**\n * This file is generated by the @terrazzo/plugin-known-wpds-css-variables plugin.\n * Do not edit this file directly.\n */\n\nexport default [\n\t'--wpds-border-radius-x-small',\n\t'--wpds-border-radius-small',\n\t'--wpds-border-radius-medium',\n\t'--wpds-border-radius-large',\n\t'--wpds-border-width-focus',\n\t'--wpds-color-bg-surface-neutral',\n\t'--wpds-color-bg-surface-neutral-strong',\n\t'--wpds-color-bg-surface-neutral-weak',\n\t'--wpds-color-bg-surface-brand',\n\t'--wpds-color-bg-surface-success',\n\t'--wpds-color-bg-surface-success-weak',\n\t'--wpds-color-bg-surface-info',\n\t'--wpds-color-bg-surface-info-weak',\n\t'--wpds-color-bg-surface-warning',\n\t'--wpds-color-bg-surface-warning-weak',\n\t'--wpds-color-bg-surface-caution',\n\t'--wpds-color-bg-surface-caution-weak',\n\t'--wpds-color-bg-surface-error',\n\t'--wpds-color-bg-surface-error-weak',\n\t'--wpds-color-bg-interactive-neutral',\n\t'--wpds-color-bg-interactive-neutral-active',\n\t'--wpds-color-bg-interactive-neutral-disabled',\n\t'--wpds-color-bg-interactive-neutral-strong',\n\t'--wpds-color-bg-interactive-neutral-strong-active',\n\t'--wpds-color-bg-interactive-neutral-strong-disabled',\n\t'--wpds-color-bg-interactive-neutral-weak',\n\t'--wpds-color-bg-interactive-neutral-weak-active',\n\t'--wpds-color-bg-interactive-neutral-weak-disabled',\n\t'--wpds-color-bg-interactive-brand',\n\t'--wpds-color-bg-interactive-brand-active',\n\t'--wpds-color-bg-interactive-brand-disabled',\n\t'--wpds-color-bg-interactive-brand-strong',\n\t'--wpds-color-bg-interactive-brand-strong-active',\n\t'--wpds-color-bg-interactive-brand-strong-disabled',\n\t'--wpds-color-bg-interactive-brand-weak',\n\t'--wpds-color-bg-interactive-brand-weak-active',\n\t'--wpds-color-bg-interactive-brand-weak-disabled',\n\t'--wpds-color-bg-track-neutral-weak',\n\t'--wpds-color-bg-track-neutral',\n\t'--wpds-color-bg-thumb-neutral-weak',\n\t'--wpds-color-bg-thumb-neutral-weak-active',\n\t'--wpds-color-bg-thumb-brand',\n\t'--wpds-color-bg-thumb-brand-active',\n\t'--wpds-color-bg-thumb-brand-disabled',\n\t'--wpds-color-fg-content-neutral',\n\t'--wpds-color-fg-content-neutral-weak',\n\t'--wpds-color-fg-content-success',\n\t'--wpds-color-fg-content-success-weak',\n\t'--wpds-color-fg-content-info',\n\t'--wpds-color-fg-content-info-weak',\n\t'--wpds-color-fg-content-warning',\n\t'--wpds-color-fg-content-warning-weak',\n\t'--wpds-color-fg-content-caution',\n\t'--wpds-color-fg-content-caution-weak',\n\t'--wpds-color-fg-content-error',\n\t'--wpds-color-fg-content-error-weak',\n\t'--wpds-color-fg-interactive-neutral',\n\t'--wpds-color-fg-interactive-neutral-active',\n\t'--wpds-color-fg-interactive-neutral-disabled',\n\t'--wpds-color-fg-interactive-neutral-strong',\n\t'--wpds-color-fg-interactive-neutral-strong-active',\n\t'--wpds-color-fg-interactive-neutral-strong-disabled',\n\t'--wpds-color-fg-interactive-neutral-weak',\n\t'--wpds-color-fg-interactive-neutral-weak-disabled',\n\t'--wpds-color-fg-interactive-brand',\n\t'--wpds-color-fg-interactive-brand-active',\n\t'--wpds-color-fg-interactive-brand-disabled',\n\t'--wpds-color-fg-interactive-brand-strong',\n\t'--wpds-color-fg-interactive-brand-strong-active',\n\t'--wpds-color-fg-interactive-brand-strong-disabled',\n\t'--wpds-color-stroke-surface-neutral',\n\t'--wpds-color-stroke-surface-neutral-weak',\n\t'--wpds-color-stroke-surface-neutral-strong',\n\t'--wpds-color-stroke-surface-brand',\n\t'--wpds-color-stroke-surface-brand-strong',\n\t'--wpds-color-stroke-surface-success',\n\t'--wpds-color-stroke-surface-success-strong',\n\t'--wpds-color-stroke-surface-info',\n\t'--wpds-color-stroke-surface-info-strong',\n\t'--wpds-color-stroke-surface-warning',\n\t'--wpds-color-stroke-surface-warning-strong',\n\t'--wpds-color-stroke-surface-error',\n\t'--wpds-color-stroke-surface-error-strong',\n\t'--wpds-color-stroke-interactive-neutral',\n\t'--wpds-color-stroke-interactive-neutral-active',\n\t'--wpds-color-stroke-interactive-neutral-disabled',\n\t'--wpds-color-stroke-interactive-neutral-strong',\n\t'--wpds-color-stroke-interactive-brand',\n\t'--wpds-color-stroke-interactive-brand-active',\n\t'--wpds-color-stroke-interactive-brand-disabled',\n\t'--wpds-color-stroke-interactive-error-strong',\n\t'--wpds-color-stroke-focus-brand',\n\t'--wpds-dimension-base',\n\t'--wpds-dimension-padding-surface-2xs',\n\t'--wpds-dimension-padding-surface-xs',\n\t'--wpds-dimension-padding-surface-sm',\n\t'--wpds-dimension-padding-surface-md',\n\t'--wpds-dimension-padding-surface-lg',\n\t'--wpds-elevation-x-small',\n\t'--wpds-elevation-small',\n\t'--wpds-elevation-medium',\n\t'--wpds-elevation-large',\n\t'--wpds-font-family-heading',\n\t'--wpds-font-family-body',\n\t'--wpds-font-family-mono',\n\t'--wpds-font-size-x-small',\n\t'--wpds-font-size-small',\n\t'--wpds-font-size-medium',\n\t'--wpds-font-size-large',\n\t'--wpds-font-size-x-large',\n\t'--wpds-font-size-2x-large',\n\t'--wpds-font-line-height-x-small',\n\t'--wpds-font-line-height-small',\n\t'--wpds-font-line-height-medium',\n\t'--wpds-font-line-height-large',\n\t'--wpds-font-line-height-x-large',\n\t'--wpds-font-line-height-2x-large',\n];\n"],
|
|
5
|
+
"mappings": ";AAKA,IAAO,wBAAQ;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -50,13 +50,13 @@
|
|
|
50
50
|
},
|
|
51
51
|
"Color/Semantic/Background/Brand/bgSur-brand": {
|
|
52
52
|
"value": {
|
|
53
|
-
".": "#
|
|
53
|
+
".": "#ecf0f9"
|
|
54
54
|
},
|
|
55
55
|
"description": "Background color for surfaces with brand tone and normal emphasis."
|
|
56
56
|
},
|
|
57
57
|
"Color/Semantic/Background/Success/bgSur-success": {
|
|
58
58
|
"value": {
|
|
59
|
-
".": "#
|
|
59
|
+
".": "#cbf5d1"
|
|
60
60
|
},
|
|
61
61
|
"description": "Background color for surfaces with success tone and normal emphasis."
|
|
62
62
|
},
|
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
},
|
|
69
69
|
"Color/Semantic/Background/Info/bgSur-info": {
|
|
70
70
|
"value": {
|
|
71
|
-
".": "#
|
|
71
|
+
".": "#dfebf8"
|
|
72
72
|
},
|
|
73
73
|
"description": "Background color for surfaces with info tone and normal emphasis."
|
|
74
74
|
},
|
|
@@ -80,7 +80,7 @@
|
|
|
80
80
|
},
|
|
81
81
|
"Color/Semantic/Background/Warning/bgSur-warning": {
|
|
82
82
|
"value": {
|
|
83
|
-
".": "#
|
|
83
|
+
".": "#f8e8cc"
|
|
84
84
|
},
|
|
85
85
|
"description": "Background color for surfaces with warning tone and normal emphasis."
|
|
86
86
|
},
|
|
@@ -92,7 +92,7 @@
|
|
|
92
92
|
},
|
|
93
93
|
"Color/Semantic/Background/Caution/bgSur-caution": {
|
|
94
94
|
"value": {
|
|
95
|
-
".": "#
|
|
95
|
+
".": "#f7eab3"
|
|
96
96
|
},
|
|
97
97
|
"description": "Background color for surfaces with caution tone and normal emphasis."
|
|
98
98
|
},
|
|
@@ -104,7 +104,7 @@
|
|
|
104
104
|
},
|
|
105
105
|
"Color/Semantic/Background/Error/bgSur-error": {
|
|
106
106
|
"value": {
|
|
107
|
-
".": "#
|
|
107
|
+
".": "#fae4e1"
|
|
108
108
|
},
|
|
109
109
|
"description": "Background color for surfaces with error tone and normal emphasis."
|
|
110
110
|
},
|
|
@@ -128,7 +128,7 @@
|
|
|
128
128
|
},
|
|
129
129
|
"Color/Semantic/Background/Neutral/bgInt-neutral-disabled": {
|
|
130
130
|
"value": {
|
|
131
|
-
".": "#
|
|
131
|
+
".": "#e2e2e2"
|
|
132
132
|
},
|
|
133
133
|
"description": "Background color for interactive elements with neutral tone and normal emphasis, in their disabled state."
|
|
134
134
|
},
|
|
@@ -146,7 +146,7 @@
|
|
|
146
146
|
},
|
|
147
147
|
"Color/Semantic/Background/Neutral/bgInt-neutral-strong-disabled": {
|
|
148
148
|
"value": {
|
|
149
|
-
".": "#
|
|
149
|
+
".": "#d2d2d2"
|
|
150
150
|
},
|
|
151
151
|
"description": "Background color for interactive elements with neutral tone and strong emphasis, in their disabled state."
|
|
152
152
|
},
|
|
@@ -164,7 +164,7 @@
|
|
|
164
164
|
},
|
|
165
165
|
"Color/Semantic/Background/Neutral/bgInt-neutral-weak-disabled": {
|
|
166
166
|
"value": {
|
|
167
|
-
".": "#
|
|
167
|
+
".": "#e2e2e2"
|
|
168
168
|
},
|
|
169
169
|
"description": "Background color for interactive elements with neutral tone and weak emphasis, in their disabled state."
|
|
170
170
|
},
|
|
@@ -182,7 +182,7 @@
|
|
|
182
182
|
},
|
|
183
183
|
"Color/Semantic/Background/Brand/bgInt-brand-disabled": {
|
|
184
184
|
"value": {
|
|
185
|
-
".": "#
|
|
185
|
+
".": "#e2e2e2"
|
|
186
186
|
},
|
|
187
187
|
"description": "Background color for interactive elements with brand tone and normal emphasis, in their disabled state."
|
|
188
188
|
},
|
|
@@ -194,13 +194,13 @@
|
|
|
194
194
|
},
|
|
195
195
|
"Color/Semantic/Background/Brand/bgInt-brand-strong-active": {
|
|
196
196
|
"value": {
|
|
197
|
-
".": "#
|
|
197
|
+
".": "#2e49d9"
|
|
198
198
|
},
|
|
199
199
|
"description": "Background color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active."
|
|
200
200
|
},
|
|
201
201
|
"Color/Semantic/Background/Brand/bgInt-brand-strong-disabled": {
|
|
202
202
|
"value": {
|
|
203
|
-
".": "#
|
|
203
|
+
".": "#d2d2d2"
|
|
204
204
|
},
|
|
205
205
|
"description": "Background color for interactive elements with brand tone and strong emphasis, in their disabled state."
|
|
206
206
|
},
|
|
@@ -212,37 +212,37 @@
|
|
|
212
212
|
},
|
|
213
213
|
"Color/Semantic/Background/Brand/bgInt-brand-weak-active": {
|
|
214
214
|
"value": {
|
|
215
|
-
".": "#
|
|
215
|
+
".": "#e4eaf7"
|
|
216
216
|
},
|
|
217
217
|
"description": "Background color for interactive elements with brand tone and weak emphasis that are hovered, focused, or active."
|
|
218
218
|
},
|
|
219
219
|
"Color/Semantic/Background/Brand/bgInt-brand-weak-disabled": {
|
|
220
220
|
"value": {
|
|
221
|
-
".": "#
|
|
221
|
+
".": "#e2e2e2"
|
|
222
222
|
},
|
|
223
223
|
"description": "Background color for interactive elements with brand tone and weak emphasis, in their disabled state."
|
|
224
224
|
},
|
|
225
225
|
"Color/Semantic/Background/Neutral/bgTra-neutral-weak": {
|
|
226
226
|
"value": {
|
|
227
|
-
".": "#
|
|
227
|
+
".": "#e0e0e0"
|
|
228
228
|
},
|
|
229
229
|
"description": "Background color for tracks with a neutral tone and weak emphasis (eg. scrollbar track)."
|
|
230
230
|
},
|
|
231
231
|
"Color/Semantic/Background/Neutral/bgTra-neutral": {
|
|
232
232
|
"value": {
|
|
233
|
-
".": "#
|
|
233
|
+
".": "#d8d8d8"
|
|
234
234
|
},
|
|
235
235
|
"description": "Background color for tracks with a neutral tone and normal emphasis (eg. slider or progressbar track)."
|
|
236
236
|
},
|
|
237
237
|
"Color/Semantic/Background/Neutral/bgThu-neutral-weak": {
|
|
238
238
|
"value": {
|
|
239
|
-
".": "#
|
|
239
|
+
".": "#8a8a8a"
|
|
240
240
|
},
|
|
241
241
|
"description": "Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb)."
|
|
242
242
|
},
|
|
243
243
|
"Color/Semantic/Background/Neutral/bgThu-neutral-weak-active": {
|
|
244
244
|
"value": {
|
|
245
|
-
".": "#
|
|
245
|
+
".": "#6c6c6c"
|
|
246
246
|
},
|
|
247
247
|
"description": "Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb) that are hovered, focused, or active."
|
|
248
248
|
},
|
|
@@ -260,7 +260,7 @@
|
|
|
260
260
|
},
|
|
261
261
|
"Color/Semantic/Background/Brand/bgThu-brand-disabled": {
|
|
262
262
|
"value": {
|
|
263
|
-
".": "#
|
|
263
|
+
".": "#d8d8d8"
|
|
264
264
|
},
|
|
265
265
|
"description": "Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track), in their disabled state."
|
|
266
266
|
},
|
|
@@ -272,61 +272,61 @@
|
|
|
272
272
|
},
|
|
273
273
|
"Color/Semantic/Foreground/Neutral/fgCon-neutral-weak": {
|
|
274
274
|
"value": {
|
|
275
|
-
".": "#
|
|
275
|
+
".": "#6d6d6d"
|
|
276
276
|
},
|
|
277
277
|
"description": "Foreground color for content like text with weak emphasis."
|
|
278
278
|
},
|
|
279
279
|
"Color/Semantic/Foreground/Success/fgCon-success": {
|
|
280
280
|
"value": {
|
|
281
|
-
".": "#
|
|
281
|
+
".": "#002900"
|
|
282
282
|
},
|
|
283
283
|
"description": "Foreground color for content like text with success tone and normal emphasis."
|
|
284
284
|
},
|
|
285
285
|
"Color/Semantic/Foreground/Success/fgCon-success-weak": {
|
|
286
286
|
"value": {
|
|
287
|
-
".": "#
|
|
287
|
+
".": "#007f30"
|
|
288
288
|
},
|
|
289
289
|
"description": "Foreground color for content like text with success tone and weak emphasis."
|
|
290
290
|
},
|
|
291
291
|
"Color/Semantic/Foreground/Info/fgCon-info": {
|
|
292
292
|
"value": {
|
|
293
|
-
".": "#
|
|
293
|
+
".": "#001b4f"
|
|
294
294
|
},
|
|
295
295
|
"description": "Foreground color for content like text with info tone and normal emphasis."
|
|
296
296
|
},
|
|
297
297
|
"Color/Semantic/Foreground/Info/fgCon-info-weak": {
|
|
298
298
|
"value": {
|
|
299
|
-
".": "#
|
|
299
|
+
".": "#006bd7"
|
|
300
300
|
},
|
|
301
301
|
"description": "Foreground color for content like text with info tone and weak emphasis."
|
|
302
302
|
},
|
|
303
303
|
"Color/Semantic/Foreground/Warning/fgCon-warning": {
|
|
304
304
|
"value": {
|
|
305
|
-
".": "#
|
|
305
|
+
".": "#2e1900"
|
|
306
306
|
},
|
|
307
307
|
"description": "Foreground color for content like text with warning tone and normal emphasis."
|
|
308
308
|
},
|
|
309
309
|
"Color/Semantic/Foreground/Warning/fgCon-warning-weak": {
|
|
310
310
|
"value": {
|
|
311
|
-
".": "#
|
|
311
|
+
".": "#936400"
|
|
312
312
|
},
|
|
313
313
|
"description": "Foreground color for content like text with warning tone and weak emphasis."
|
|
314
314
|
},
|
|
315
315
|
"Color/Semantic/Foreground/Caution/fgCon-caution": {
|
|
316
316
|
"value": {
|
|
317
|
-
".": "#
|
|
317
|
+
".": "#281d00"
|
|
318
318
|
},
|
|
319
319
|
"description": "Foreground color for content like text with caution tone and normal emphasis."
|
|
320
320
|
},
|
|
321
321
|
"Color/Semantic/Foreground/Caution/fgCon-caution-weak": {
|
|
322
322
|
"value": {
|
|
323
|
-
".": "#
|
|
323
|
+
".": "#836b00"
|
|
324
324
|
},
|
|
325
325
|
"description": "Foreground color for content like text with caution tone and weak emphasis."
|
|
326
326
|
},
|
|
327
327
|
"Color/Semantic/Foreground/Error/fgCon-error": {
|
|
328
328
|
"value": {
|
|
329
|
-
".": "#
|
|
329
|
+
".": "#470000"
|
|
330
330
|
},
|
|
331
331
|
"description": "Foreground color for content like text with error tone and normal emphasis."
|
|
332
332
|
},
|
|
@@ -350,7 +350,7 @@
|
|
|
350
350
|
},
|
|
351
351
|
"Color/Semantic/Foreground/Neutral/fgInt-neutral-disabled": {
|
|
352
352
|
"value": {
|
|
353
|
-
".": "#
|
|
353
|
+
".": "#8a8a8a"
|
|
354
354
|
},
|
|
355
355
|
"description": "Foreground color for interactive elements with neutral tone and normal emphasis, in their disabled state."
|
|
356
356
|
},
|
|
@@ -368,19 +368,19 @@
|
|
|
368
368
|
},
|
|
369
369
|
"Color/Semantic/Foreground/Neutral/fgInt-neutral-strong-disabled": {
|
|
370
370
|
"value": {
|
|
371
|
-
".": "#
|
|
371
|
+
".": "#6d6d6d"
|
|
372
372
|
},
|
|
373
373
|
"description": "Foreground color for interactive elements with neutral tone and strong emphasis, in their disabled state."
|
|
374
374
|
},
|
|
375
375
|
"Color/Semantic/Foreground/Neutral/fgInt-neutral-weak": {
|
|
376
376
|
"value": {
|
|
377
|
-
".": "#
|
|
377
|
+
".": "#6d6d6d"
|
|
378
378
|
},
|
|
379
379
|
"description": "Foreground color for interactive elements with neutral tone and weak emphasis."
|
|
380
380
|
},
|
|
381
381
|
"Color/Semantic/Foreground/Neutral/fgInt-neutral-weak-disabled": {
|
|
382
382
|
"value": {
|
|
383
|
-
".": "#
|
|
383
|
+
".": "#8a8a8a"
|
|
384
384
|
},
|
|
385
385
|
"description": "Foreground color for interactive elements with neutral tone and weak emphasis, in their disabled state."
|
|
386
386
|
},
|
|
@@ -398,7 +398,7 @@
|
|
|
398
398
|
},
|
|
399
399
|
"Color/Semantic/Foreground/Brand/fgInt-brand-disabled": {
|
|
400
400
|
"value": {
|
|
401
|
-
".": "#
|
|
401
|
+
".": "#8a8a8a"
|
|
402
402
|
},
|
|
403
403
|
"description": "Foreground color for interactive elements with brand tone and normal emphasis, in their disabled state."
|
|
404
404
|
},
|
|
@@ -416,31 +416,31 @@
|
|
|
416
416
|
},
|
|
417
417
|
"Color/Semantic/Foreground/Brand/fgInt-brand-strong-disabled": {
|
|
418
418
|
"value": {
|
|
419
|
-
".": "#
|
|
419
|
+
".": "#6d6d6d"
|
|
420
420
|
},
|
|
421
421
|
"description": "Foreground color for interactive elements with brand tone and strong emphasis, in their disabled state."
|
|
422
422
|
},
|
|
423
423
|
"Color/Semantic/Stroke/Neutral/strokeSur-neutral": {
|
|
424
424
|
"value": {
|
|
425
|
-
".": "#
|
|
425
|
+
".": "#d8d8d8"
|
|
426
426
|
},
|
|
427
427
|
"description": "Decorative stroke color used to define neutrally-toned surface boundaries with normal emphasis."
|
|
428
428
|
},
|
|
429
429
|
"Color/Semantic/Stroke/Neutral/strokeSur-neutral-weak": {
|
|
430
430
|
"value": {
|
|
431
|
-
".": "#
|
|
431
|
+
".": "#e0e0e0"
|
|
432
432
|
},
|
|
433
433
|
"description": "Decorative stroke color used to define neutrally-toned surface boundaries with weak emphasis."
|
|
434
434
|
},
|
|
435
435
|
"Color/Semantic/Stroke/Neutral/strokeSur-neutral-strong": {
|
|
436
436
|
"value": {
|
|
437
|
-
".": "#
|
|
437
|
+
".": "#8a8a8a"
|
|
438
438
|
},
|
|
439
439
|
"description": "Decorative stroke color used to define neutrally-toned surface boundaries with strong emphasis."
|
|
440
440
|
},
|
|
441
441
|
"Color/Semantic/Stroke/Brand/strokeSur-brand": {
|
|
442
442
|
"value": {
|
|
443
|
-
".": "#
|
|
443
|
+
".": "#a2b1d6"
|
|
444
444
|
},
|
|
445
445
|
"description": "Decorative stroke color used to define brand-toned surface boundaries with normal emphasis."
|
|
446
446
|
},
|
|
@@ -452,43 +452,43 @@
|
|
|
452
452
|
},
|
|
453
453
|
"Color/Semantic/Stroke/Success/strokeSur-success": {
|
|
454
454
|
"value": {
|
|
455
|
-
".": "#
|
|
455
|
+
".": "#82c98f"
|
|
456
456
|
},
|
|
457
457
|
"description": "Decorative stroke color used to define success-toned surface boundaries with normal emphasis."
|
|
458
458
|
},
|
|
459
459
|
"Color/Semantic/Stroke/Success/strokeSur-success-strong": {
|
|
460
460
|
"value": {
|
|
461
|
-
".": "#
|
|
461
|
+
".": "#007f30"
|
|
462
462
|
},
|
|
463
463
|
"description": "Decorative stroke color used to define success-toned surface boundaries with strong emphasis."
|
|
464
464
|
},
|
|
465
465
|
"Color/Semantic/Stroke/Info/strokeSur-info": {
|
|
466
466
|
"value": {
|
|
467
|
-
".": "#
|
|
467
|
+
".": "#9fbcdd"
|
|
468
468
|
},
|
|
469
469
|
"description": "Decorative stroke color used to define info-toned surface boundaries with normal emphasis."
|
|
470
470
|
},
|
|
471
471
|
"Color/Semantic/Stroke/Info/strokeSur-info-strong": {
|
|
472
472
|
"value": {
|
|
473
|
-
".": "#
|
|
473
|
+
".": "#006bd7"
|
|
474
474
|
},
|
|
475
475
|
"description": "Decorative stroke color used to define info-toned surface boundaries with strong emphasis."
|
|
476
476
|
},
|
|
477
477
|
"Color/Semantic/Stroke/Warning/strokeSur-warning": {
|
|
478
478
|
"value": {
|
|
479
|
-
".": "#
|
|
479
|
+
".": "#d2b581"
|
|
480
480
|
},
|
|
481
481
|
"description": "Decorative stroke color used to define warning-toned surface boundaries with normal emphasis."
|
|
482
482
|
},
|
|
483
483
|
"Color/Semantic/Stroke/Warning/strokeSur-warning-strong": {
|
|
484
484
|
"value": {
|
|
485
|
-
".": "#
|
|
485
|
+
".": "#936400"
|
|
486
486
|
},
|
|
487
487
|
"description": "Decorative stroke color used to define warning-toned surface boundaries with strong emphasis."
|
|
488
488
|
},
|
|
489
489
|
"Color/Semantic/Stroke/Error/strokeSur-error": {
|
|
490
490
|
"value": {
|
|
491
|
-
".": "#
|
|
491
|
+
".": "#e1a198"
|
|
492
492
|
},
|
|
493
493
|
"description": "Decorative stroke color used to define error-toned surface boundaries with normal emphasis."
|
|
494
494
|
},
|
|
@@ -500,25 +500,25 @@
|
|
|
500
500
|
},
|
|
501
501
|
"Color/Semantic/Stroke/Neutral/strokeInt-neutral": {
|
|
502
502
|
"value": {
|
|
503
|
-
".": "#
|
|
503
|
+
".": "#8a8a8a"
|
|
504
504
|
},
|
|
505
505
|
"description": "Accessible stroke color used for interactive neutrally-toned elements with normal emphasis."
|
|
506
506
|
},
|
|
507
507
|
"Color/Semantic/Stroke/Neutral/strokeInt-neutral-active": {
|
|
508
508
|
"value": {
|
|
509
|
-
".": "#
|
|
509
|
+
".": "#6c6c6c"
|
|
510
510
|
},
|
|
511
511
|
"description": "Accessible stroke color used for interactive neutrally-toned elements with normal emphasis that are hovered, focused, or active."
|
|
512
512
|
},
|
|
513
513
|
"Color/Semantic/Stroke/Neutral/strokeInt-neutral-disabled": {
|
|
514
514
|
"value": {
|
|
515
|
-
".": "#
|
|
515
|
+
".": "#d8d8d8"
|
|
516
516
|
},
|
|
517
517
|
"description": "Accessible stroke color used for interactive neutrally-toned elements with normal emphasis, in their disabled state."
|
|
518
518
|
},
|
|
519
519
|
"Color/Semantic/Stroke/Neutral/strokeInt-neutral-strong": {
|
|
520
520
|
"value": {
|
|
521
|
-
".": "#
|
|
521
|
+
".": "#6c6c6c"
|
|
522
522
|
},
|
|
523
523
|
"description": "Accessible stroke color used for interactive neutrally-toned elements with strong emphasis."
|
|
524
524
|
},
|
|
@@ -536,7 +536,7 @@
|
|
|
536
536
|
},
|
|
537
537
|
"Color/Semantic/Stroke/Brand/strokeInt-brand-disabled": {
|
|
538
538
|
"value": {
|
|
539
|
-
".": "#
|
|
539
|
+
".": "#d8d8d8"
|
|
540
540
|
},
|
|
541
541
|
"description": "Accessible stroke color used for interactive brand-toned elements with normal emphasis, in their disabled state."
|
|
542
542
|
},
|
|
@@ -558,27 +558,43 @@
|
|
|
558
558
|
},
|
|
559
559
|
"description": "Base dimension unit"
|
|
560
560
|
},
|
|
561
|
-
"Dimension/Semantic/padding-surface-
|
|
561
|
+
"Dimension/Semantic/padding-surface-2xs": {
|
|
562
562
|
"value": {
|
|
563
|
-
".": "
|
|
563
|
+
".": "4px",
|
|
564
|
+
"compact": "4px",
|
|
565
|
+
"comfortable": "8px"
|
|
566
|
+
},
|
|
567
|
+
"description": "2x extra small spacing for surfaces"
|
|
568
|
+
},
|
|
569
|
+
"Dimension/Semantic/padding-surface-xs": {
|
|
570
|
+
"value": {
|
|
571
|
+
".": "8px",
|
|
572
|
+
"compact": "4px",
|
|
573
|
+
"comfortable": "12px"
|
|
564
574
|
},
|
|
565
575
|
"description": "Extra small spacing for surfaces"
|
|
566
576
|
},
|
|
567
|
-
"Dimension/Semantic/padding-surface-
|
|
577
|
+
"Dimension/Semantic/padding-surface-sm": {
|
|
568
578
|
"value": {
|
|
569
|
-
".": "
|
|
579
|
+
".": "16px",
|
|
580
|
+
"compact": "12px",
|
|
581
|
+
"comfortable": "20px"
|
|
570
582
|
},
|
|
571
583
|
"description": "Small spacing for surfaces"
|
|
572
584
|
},
|
|
573
|
-
"Dimension/Semantic/padding-surface-
|
|
585
|
+
"Dimension/Semantic/padding-surface-md": {
|
|
574
586
|
"value": {
|
|
575
|
-
".": "
|
|
587
|
+
".": "24px",
|
|
588
|
+
"compact": "20px",
|
|
589
|
+
"comfortable": "32px"
|
|
576
590
|
},
|
|
577
591
|
"description": "Medium spacing for surfaces"
|
|
578
592
|
},
|
|
579
|
-
"Dimension/Semantic/padding-surface-
|
|
593
|
+
"Dimension/Semantic/padding-surface-lg": {
|
|
580
594
|
"value": {
|
|
581
|
-
".": "
|
|
595
|
+
".": "32px",
|
|
596
|
+
"compact": "24px",
|
|
597
|
+
"comfortable": "40px"
|
|
582
598
|
},
|
|
583
599
|
"description": "Large spacing for surfaces"
|
|
584
600
|
},
|
|
@@ -36,7 +36,8 @@ function generateCSSSelector({
|
|
|
36
36
|
var ThemeProvider = ({
|
|
37
37
|
children,
|
|
38
38
|
color = {},
|
|
39
|
-
isRoot = false
|
|
39
|
+
isRoot = false,
|
|
40
|
+
density
|
|
40
41
|
}) => {
|
|
41
42
|
const instanceId = useId();
|
|
42
43
|
const { themeProviderStyles, resolvedSettings } = useThemeProviderStyles({
|
|
@@ -58,6 +59,7 @@ var ThemeProvider = ({
|
|
|
58
59
|
{
|
|
59
60
|
"data-wpds-theme-provider-id": instanceId,
|
|
60
61
|
"data-wpds-root-provider": isRoot,
|
|
62
|
+
"data-wpds-density": density,
|
|
61
63
|
className: style_default.root,
|
|
62
64
|
children: /* @__PURE__ */ jsx(ThemeContext.Provider, { value: contextValue, children })
|
|
63
65
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/theme-provider.tsx", "../src/style.module.css"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useId } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ThemeContext } from './context';\nimport { useThemeProviderStyles } from './use-theme-provider-styles';\nimport { type ThemeProviderProps } from './types';\nimport styles from './style.module.css';\n\nfunction cssObjectToText( values: CSSProperties ) {\n\treturn Object.entries( values )\n\t\t.map( ( [ key, value ] ) => `${ key }: ${ value };` )\n\t\t.join( '' );\n}\n\nfunction generateCSSSelector( {\n\tinstanceId,\n\tisRoot,\n}: {\n\tinstanceId: string;\n\tisRoot: boolean;\n} ) {\n\tconst rootSel = `[data-wpds-root-provider=\"true\"]`;\n\tconst instanceIdSel = `[data-wpds-theme-provider-id=\"${ instanceId }\"]`;\n\n\tconst selectors = [];\n\n\tif ( isRoot ) {\n\t\tselectors.push(\n\t\t\t`:root:has(.${ styles.root }${ rootSel }${ instanceIdSel })`\n\t\t);\n\t}\n\n\tselectors.push( `.${ styles.root }.${ styles.root }${ instanceIdSel }` );\n\n\treturn selectors.join( ',' );\n}\n\nexport const ThemeProvider = ( {\n\tchildren,\n\tcolor = {},\n\tisRoot = false,\n}: ThemeProviderProps ) => {\n\tconst instanceId = useId();\n\n\tconst { themeProviderStyles, resolvedSettings } = useThemeProviderStyles( {\n\t\tcolor,\n\t} );\n\n\tconst contextValue = useMemo(\n\t\t() => ( {\n\t\t\tresolvedSettings,\n\t\t} ),\n\t\t[ resolvedSettings ]\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t{ themeProviderStyles ? (\n\t\t\t\t<style>\n\t\t\t\t\t{ `${ generateCSSSelector( {\n\t\t\t\t\t\tinstanceId,\n\t\t\t\t\t\tisRoot,\n\t\t\t\t\t} ) } {${ cssObjectToText( themeProviderStyles ) }}` }\n\t\t\t\t</style>\n\t\t\t) : null }\n\t\t\t<div\n\t\t\t\tdata-wpds-theme-provider-id={ instanceId }\n\t\t\t\tdata-wpds-root-provider={ isRoot }\n\t\t\t\tclassName={ styles.root }\n\t\t\t>\n\t\t\t\t<ThemeContext.Provider value={ contextValue }>\n\t\t\t\t\t{ children }\n\t\t\t\t</ThemeContext.Provider>\n\t\t\t</div>\n\t\t</>\n\t);\n};\n", "const css = `.style-module__root__26kw6 {\n\tdisplay: contents;\n}\n`;\ndocument.head\n .appendChild(document.createElement(\"style\"))\n .appendChild(document.createTextNode(css));\nexport {css};\nexport default {\n \"root\": \"style-module__root__26kw6\"\n};"],
|
|
5
|
-
"mappings": ";AAQA,SAAS,SAAS,aAAa;AAK/B,SAAS,oBAAoB;AAC7B,SAAS,8BAA8B;;;ACdvC,IAAM,MAAM;AAAA;AAAA;AAAA;AAIZ,SAAS,KACJ,YAAY,SAAS,cAAc,OAAO,CAAC,EAC3C,YAAY,SAAS,eAAe,GAAG,CAAC;AAE7C,IAAO,gBAAQ;AAAA,EACb,QAAQ;AACV;;;
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useId } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ThemeContext } from './context';\nimport { useThemeProviderStyles } from './use-theme-provider-styles';\nimport { type ThemeProviderProps } from './types';\nimport styles from './style.module.css';\n\nfunction cssObjectToText( values: CSSProperties ) {\n\treturn Object.entries( values )\n\t\t.map( ( [ key, value ] ) => `${ key }: ${ value };` )\n\t\t.join( '' );\n}\n\nfunction generateCSSSelector( {\n\tinstanceId,\n\tisRoot,\n}: {\n\tinstanceId: string;\n\tisRoot: boolean;\n} ) {\n\tconst rootSel = `[data-wpds-root-provider=\"true\"]`;\n\tconst instanceIdSel = `[data-wpds-theme-provider-id=\"${ instanceId }\"]`;\n\n\tconst selectors = [];\n\n\tif ( isRoot ) {\n\t\tselectors.push(\n\t\t\t`:root:has(.${ styles.root }${ rootSel }${ instanceIdSel })`\n\t\t);\n\t}\n\n\tselectors.push( `.${ styles.root }.${ styles.root }${ instanceIdSel }` );\n\n\treturn selectors.join( ',' );\n}\n\nexport const ThemeProvider = ( {\n\tchildren,\n\tcolor = {},\n\tisRoot = false,\n\tdensity,\n}: ThemeProviderProps ) => {\n\tconst instanceId = useId();\n\n\tconst { themeProviderStyles, resolvedSettings } = useThemeProviderStyles( {\n\t\tcolor,\n\t} );\n\n\tconst contextValue = useMemo(\n\t\t() => ( {\n\t\t\tresolvedSettings,\n\t\t} ),\n\t\t[ resolvedSettings ]\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t{ themeProviderStyles ? (\n\t\t\t\t<style>\n\t\t\t\t\t{ `${ generateCSSSelector( {\n\t\t\t\t\t\tinstanceId,\n\t\t\t\t\t\tisRoot,\n\t\t\t\t\t} ) } {${ cssObjectToText( themeProviderStyles ) }}` }\n\t\t\t\t</style>\n\t\t\t) : null }\n\t\t\t<div\n\t\t\t\tdata-wpds-theme-provider-id={ instanceId }\n\t\t\t\tdata-wpds-root-provider={ isRoot }\n\t\t\t\tdata-wpds-density={ density }\n\t\t\t\tclassName={ styles.root }\n\t\t\t>\n\t\t\t\t<ThemeContext.Provider value={ contextValue }>\n\t\t\t\t\t{ children }\n\t\t\t\t</ThemeContext.Provider>\n\t\t\t</div>\n\t\t</>\n\t);\n};\n", "const css = `.style-module__root__26kw6 {\n\tdisplay: contents;\n}\n`;\ndocument.head\n .appendChild(document.createElement(\"style\"))\n .appendChild(document.createTextNode(css));\nexport {css};\nexport default {\n \"root\": \"style-module__root__26kw6\"\n};"],
|
|
5
|
+
"mappings": ";AAQA,SAAS,SAAS,aAAa;AAK/B,SAAS,oBAAoB;AAC7B,SAAS,8BAA8B;;;ACdvC,IAAM,MAAM;AAAA;AAAA;AAAA;AAIZ,SAAS,KACJ,YAAY,SAAS,cAAc,OAAO,CAAC,EAC3C,YAAY,SAAS,eAAe,GAAG,CAAC;AAE7C,IAAO,gBAAQ;AAAA,EACb,QAAQ;AACV;;;ADyDE,mBAEE,KAFF;AAjDF,SAAS,gBAAiB,QAAwB;AACjD,SAAO,OAAO,QAAS,MAAO,EAC5B,IAAK,CAAE,CAAE,KAAK,KAAM,MAAO,GAAI,GAAI,KAAM,KAAM,GAAI,EACnD,KAAM,EAAG;AACZ;AAEA,SAAS,oBAAqB;AAAA,EAC7B;AAAA,EACA;AACD,GAGI;AACH,QAAM,UAAU;AAChB,QAAM,gBAAgB,iCAAkC,UAAW;AAEnE,QAAM,YAAY,CAAC;AAEnB,MAAK,QAAS;AACb,cAAU;AAAA,MACT,cAAe,cAAO,IAAK,GAAI,OAAQ,GAAI,aAAc;AAAA,IAC1D;AAAA,EACD;AAEA,YAAU,KAAM,IAAK,cAAO,IAAK,IAAK,cAAO,IAAK,GAAI,aAAc,EAAG;AAEvE,SAAO,UAAU,KAAM,GAAI;AAC5B;AAEO,IAAM,gBAAgB,CAAE;AAAA,EAC9B;AAAA,EACA,QAAQ,CAAC;AAAA,EACT,SAAS;AAAA,EACT;AACD,MAA2B;AAC1B,QAAM,aAAa,MAAM;AAEzB,QAAM,EAAE,qBAAqB,iBAAiB,IAAI,uBAAwB;AAAA,IACzE;AAAA,EACD,CAAE;AAEF,QAAM,eAAe;AAAA,IACpB,OAAQ;AAAA,MACP;AAAA,IACD;AAAA,IACA,CAAE,gBAAiB;AAAA,EACpB;AAEA,SACC,iCACG;AAAA,0BACD,oBAAC,WACE,aAAI,oBAAqB;AAAA,MAC1B;AAAA,MACA;AAAA,IACD,CAAE,CAAE,KAAM,gBAAiB,mBAAoB,CAAE,KAClD,IACG;AAAA,IACJ;AAAA,MAAC;AAAA;AAAA,QACA,+BAA8B;AAAA,QAC9B,2BAA0B;AAAA,QAC1B,qBAAoB;AAAA,QACpB,WAAY,cAAO;AAAA,QAEnB,8BAAC,aAAa,UAAb,EAAsB,OAAQ,cAC5B,UACH;AAAA;AAAA,IACD;AAAA,KACD;AAEF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -32,6 +32,7 @@ export declare function checkAccessibleCombinations({ bgRamp, accentRamps, }: {
|
|
|
32
32
|
fgName: keyof Ramp;
|
|
33
33
|
fgColor: string;
|
|
34
34
|
unmetContrast: number;
|
|
35
|
+
achievedContrast: number;
|
|
35
36
|
}[];
|
|
36
37
|
export type RampResult = InternalRampResult;
|
|
37
38
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/color-ramps/index.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,OAAO,6BAA6B,CAAC;AAIrC,OAAO,KAAK,EACX,UAAU,IAAI,kBAAkB,EAEhC,IAAI,EACJ,MAAM,aAAa,CAAC;AAGrB,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAEtD;;;GAGG;AACH,wBAAgB,WAAW,CAAE,IAAI,EAAE,MAAM,sBAMxC;AAsBD;;;;;GAKG;AACH,wBAAgB,eAAe,CAC9B,IAAI,EAAE,MAAM,EACZ,MAAM,CAAC,EAAE,kBAAkB,GACzB,kBAAkB,CAOpB;AAED;;;;;;GAMG;AACH,wBAAgB,2BAA2B,CAAE,EAC5C,MAAM,EACN,WAAgB,GAChB,EAAE;IACF,MAAM,EAAE,kBAAkB,CAAC;IAC3B,WAAW,CAAC,EAAE,kBAAkB,EAAE,CAAC;CACnC;YAES,MAAM,IAAI;aACT,MAAM;YACP,MAAM,IAAI;aACT,MAAM;mBACA,MAAM;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/color-ramps/index.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,OAAO,6BAA6B,CAAC;AAIrC,OAAO,KAAK,EACX,UAAU,IAAI,kBAAkB,EAEhC,IAAI,EACJ,MAAM,aAAa,CAAC;AAGrB,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAEtD;;;GAGG;AACH,wBAAgB,WAAW,CAAE,IAAI,EAAE,MAAM,sBAMxC;AAsBD;;;;;GAKG;AACH,wBAAgB,eAAe,CAC9B,IAAI,EAAE,MAAM,EACZ,MAAM,CAAC,EAAE,kBAAkB,GACzB,kBAAkB,CAOpB;AAED;;;;;;GAMG;AACH,wBAAgB,2BAA2B,CAAE,EAC5C,MAAM,EACN,WAAgB,GAChB,EAAE;IACF,MAAM,EAAE,kBAAkB,CAAC;IAC3B,WAAW,CAAC,EAAE,kBAAkB,EAAE,CAAC;CACnC;YAES,MAAM,IAAI;aACT,MAAM;YACP,MAAM,IAAI;aACT,MAAM;mBACA,MAAM;sBACH,MAAM;IAiDzB;AAED,MAAM,MAAM,UAAU,GAAG,kBAAkB,CAAC"}
|
|
@@ -19,4 +19,9 @@ export declare function getColorString(color: ColorTypes): string;
|
|
|
19
19
|
* @return WCAG 2.1 contrast ratio
|
|
20
20
|
*/
|
|
21
21
|
export declare function getContrast(colorA: ColorTypes, colorB: ColorTypes): number;
|
|
22
|
+
/**
|
|
23
|
+
* Make sure that a color is valid in the sRGB gamut and convert it to OKLCH.
|
|
24
|
+
* @param c
|
|
25
|
+
*/
|
|
26
|
+
export declare function clampToGamut(c: ColorTypes): import("colorjs.io/fn").PlainColorObject;
|
|
22
27
|
//# sourceMappingURL=color-utils.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"color-utils.d.ts","sourceRoot":"","sources":["../../../src/color-ramps/lib/color-utils.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,
|
|
1
|
+
{"version":3,"file":"color-utils.d.ts","sourceRoot":"","sources":["../../../src/color-ramps/lib/color-utils.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAON,KAAK,UAAU,EACf,MAAM,eAAe,CAAC;AAEvB;;GAEG;AACH,OAAO,yBAAyB,CAAC;AAEjC;;;;GAIG;AACH,wBAAgB,cAAc,CAAE,KAAK,EAAE,UAAU,GAAI,MAAM,CAE1D;AAED;;;;;GAKG;AACH,wBAAgB,WAAW,CAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,UAAU,GAAI,MAAM,CAE5E;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAE,CAAC,EAAE,UAAU,4CAG1C"}
|
|
@@ -5,7 +5,7 @@ import './register-color-spaces';
|
|
|
5
5
|
import type { Ramp } from './types';
|
|
6
6
|
export declare const WHITE: import("colorjs.io/fn").PlainColorObject;
|
|
7
7
|
export declare const BLACK: import("colorjs.io/fn").PlainColorObject;
|
|
8
|
-
export declare const UNIVERSAL_CONTRAST_TOPUP = 0.
|
|
8
|
+
export declare const UNIVERSAL_CONTRAST_TOPUP = 0.02;
|
|
9
9
|
export declare const WHITE_TEXT_CONTRAST_MARGIN = 3.1;
|
|
10
10
|
export declare const ACCENT_SCALE_BASE_LIGHTNESS_THRESHOLDS: {
|
|
11
11
|
readonly lighter: {
|