@wordpress/style-engine 2.34.0 → 2.34.1-next.2f1c7c01b.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/index.js +2 -0
- package/build/index.js.map +1 -1
- package/build/styles/background/index.js +7 -5
- package/build/styles/background/index.js.map +1 -1
- package/build/styles/border/index.js +10 -8
- package/build/styles/border/index.js.map +1 -1
- package/build/styles/color/background.js +3 -1
- package/build/styles/color/background.js.map +1 -1
- package/build/styles/color/gradient.js +3 -1
- package/build/styles/color/gradient.js.map +1 -1
- package/build/styles/color/index.js +2 -0
- package/build/styles/color/index.js.map +1 -1
- package/build/styles/color/text.js +3 -1
- package/build/styles/color/text.js.map +1 -1
- package/build/styles/constants.js +5 -3
- package/build/styles/constants.js.map +1 -1
- package/build/styles/dimensions/index.js +4 -2
- package/build/styles/dimensions/index.js.map +1 -1
- package/build/styles/index.js +3 -1
- package/build/styles/index.js.map +1 -1
- package/build/styles/outline/index.js +6 -4
- package/build/styles/outline/index.js.map +1 -1
- package/build/styles/shadow/index.js +3 -1
- package/build/styles/shadow/index.js.map +1 -1
- package/build/styles/spacing/index.js +2 -0
- package/build/styles/spacing/index.js.map +1 -1
- package/build/styles/spacing/margin.js +3 -1
- package/build/styles/spacing/margin.js.map +1 -1
- package/build/styles/spacing/padding.js +3 -1
- package/build/styles/spacing/padding.js.map +1 -1
- package/build/styles/typography/index.js +12 -10
- package/build/styles/typography/index.js.map +1 -1
- package/build/styles/utils.js +3 -1
- package/build/styles/utils.js.map +1 -1
- package/build/types.js +2 -0
- package/build/types.js.map +1 -1
- package/build-module/index.js +2 -1
- package/build-module/index.js.map +1 -1
- package/build-module/styles/background/index.js +6 -5
- package/build-module/styles/background/index.js.map +1 -1
- package/build-module/styles/border/index.js +9 -8
- package/build-module/styles/border/index.js.map +1 -1
- package/build-module/styles/color/background.js +2 -1
- package/build-module/styles/color/background.js.map +1 -1
- package/build-module/styles/color/gradient.js +2 -1
- package/build-module/styles/color/gradient.js.map +1 -1
- package/build-module/styles/color/index.js +1 -0
- package/build-module/styles/color/index.js.map +1 -1
- package/build-module/styles/color/text.js +2 -1
- package/build-module/styles/color/text.js.map +1 -1
- package/build-module/styles/constants.js +4 -3
- package/build-module/styles/constants.js.map +1 -1
- package/build-module/styles/dimensions/index.js +3 -2
- package/build-module/styles/dimensions/index.js.map +1 -1
- package/build-module/styles/index.js +2 -1
- package/build-module/styles/index.js.map +1 -1
- package/build-module/styles/outline/index.js +5 -4
- package/build-module/styles/outline/index.js.map +1 -1
- package/build-module/styles/shadow/index.js +2 -1
- package/build-module/styles/shadow/index.js.map +1 -1
- package/build-module/styles/spacing/index.js +1 -0
- package/build-module/styles/spacing/index.js.map +1 -1
- package/build-module/styles/spacing/margin.js +2 -1
- package/build-module/styles/spacing/margin.js.map +1 -1
- package/build-module/styles/spacing/padding.js +2 -1
- package/build-module/styles/spacing/padding.js.map +1 -1
- package/build-module/styles/typography/index.js +11 -10
- package/build-module/styles/typography/index.js.map +1 -1
- package/build-module/styles/utils.js +2 -1
- package/build-module/styles/utils.js.map +1 -1
- package/package.json +2 -2
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/typography/index.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateRule } from '../utils';\n\nconst fontSize = {\n\tname: 'fontSize',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'typography', 'fontSize' ],\n\t\t\t'fontSize'\n\t\t);\n\t},\n};\n\nconst fontStyle = {\n\tname: 'fontStyle',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'typography', 'fontStyle' ],\n\t\t\t'fontStyle'\n\t\t);\n\t},\n};\n\nconst fontWeight = {\n\tname: 'fontWeight',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'typography', 'fontWeight' ],\n\t\t\t'fontWeight'\n\t\t);\n\t},\n};\n\nconst fontFamily = {\n\tname: 'fontFamily',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'typography', 'fontFamily' ],\n\t\t\t'fontFamily'\n\t\t);\n\t},\n};\n\nconst letterSpacing = {\n\tname: 'letterSpacing',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'typography', 'letterSpacing' ],\n\t\t\t'letterSpacing'\n\t\t);\n\t},\n};\n\nconst lineHeight = {\n\tname: 'lineHeight',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'typography', 'lineHeight' ],\n\t\t\t'lineHeight'\n\t\t);\n\t},\n};\n\nconst textColumns = {\n\tname: 'textColumns',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'typography', 'textColumns' ],\n\t\t\t'columnCount'\n\t\t);\n\t},\n};\n\nconst textDecoration = {\n\tname: 'textDecoration',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'typography', 'textDecoration' ],\n\t\t\t'textDecoration'\n\t\t);\n\t},\n};\n\nconst textTransform = {\n\tname: 'textTransform',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'typography', 'textTransform' ],\n\t\t\t'textTransform'\n\t\t);\n\t},\n};\n\nconst writingMode = {\n\tname: 'writingMode',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'typography', 'writingMode' ],\n\t\t\t'writingMode'\n\t\t);\n\t},\n};\n\nexport default [\n\tfontFamily,\n\tfontSize,\n\tfontStyle,\n\tfontWeight,\n\tletterSpacing,\n\tlineHeight,\n\ttextColumns,\n\ttextDecoration,\n\ttextTransform,\n\twritingMode,\n];\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,mBAA6B;AAE7B,IAAM,WAAW;AAAA,EAChB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,eAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,UAAW;AAAA,MAC3B;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,YAAY;AAAA,EACjB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,eAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,WAAY;AAAA,MAC5B;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,aAAa;AAAA,EAClB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,eAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,YAAa;AAAA,MAC7B;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,aAAa;AAAA,EAClB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,eAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,YAAa;AAAA,MAC7B;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,gBAAgB;AAAA,EACrB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,eAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,eAAgB;AAAA,MAChC;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,aAAa;AAAA,EAClB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,eAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,YAAa;AAAA,MAC7B;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,cAAc;AAAA,EACnB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,eAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,aAAc;AAAA,MAC9B;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,iBAAiB;AAAA,EACtB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,eAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,gBAAiB;AAAA,MACjC;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,gBAAgB;AAAA,EACrB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,eAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,eAAgB;AAAA,MAChC;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,cAAc;AAAA,EACnB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,eAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,aAAc;AAAA,MAC9B;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAO,qBAAQ;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/build/styles/utils.js
CHANGED
|
@@ -16,6 +16,8 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
16
16
|
return to;
|
|
17
17
|
};
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// packages/style-engine/src/styles/utils.ts
|
|
19
21
|
var utils_exports = {};
|
|
20
22
|
__export(utils_exports, {
|
|
21
23
|
camelCaseJoin: () => camelCaseJoin,
|
|
@@ -29,7 +31,7 @@ __export(utils_exports, {
|
|
|
29
31
|
module.exports = __toCommonJS(utils_exports);
|
|
30
32
|
var import_change_case = require("change-case");
|
|
31
33
|
var import_constants = require("./constants");
|
|
32
|
-
|
|
34
|
+
var getStyleValueByPath = (object, path) => {
|
|
33
35
|
let value = object;
|
|
34
36
|
path.forEach((fieldName) => {
|
|
35
37
|
value = value?.[fieldName];
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styles/utils.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * External dependencies\n */\nimport { paramCase as kebabCase } from 'change-case';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tCssRulesKeys,\n\tGeneratedCSSRule,\n\tStyle,\n\tBox,\n\tStyleOptions,\n} from '../types';\nimport {\n\tVARIABLE_REFERENCE_PREFIX,\n\tVARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE,\n\tVARIABLE_PATH_SEPARATOR_TOKEN_STYLE,\n} from './constants';\n\n/**\n * Helper util to return a value from a certain path of the object.\n * Path is specified as an array of properties, like `[ 'x', 'y' ]`.\n *\n * @param object Input object.\n * @param path Path to the object property.\n * @return Value of the object property at the specified path.\n */\nexport const getStyleValueByPath = (\n\tobject: Record< any, any >,\n\tpath: string[]\n) => {\n\tlet value: any = object;\n\tpath.forEach( ( fieldName: string ) => {\n\t\tvalue = value?.[ fieldName ];\n\t} );\n\treturn value;\n};\n\n/**\n * Returns a JSON representation of the generated CSS rules.\n *\n * @param style Style object.\n * @param options Options object with settings to adjust how the styles are generated.\n * @param path An array of strings representing the path to the style value in the style object.\n * @param ruleKey A CSS property key.\n *\n * @return GeneratedCSSRule[] CSS rules.\n */\nexport function generateRule(\n\tstyle: Style,\n\toptions: StyleOptions,\n\tpath: string[],\n\truleKey: string\n): GeneratedCSSRule[] {\n\tconst styleValue: string | undefined = getStyleValueByPath( style, path );\n\n\treturn styleValue\n\t\t? [\n\t\t\t\t{\n\t\t\t\t\tselector: options?.selector,\n\t\t\t\t\tkey: ruleKey,\n\t\t\t\t\tvalue: getCSSValueFromRawStyle( styleValue ),\n\t\t\t\t},\n\t\t ]\n\t\t: [];\n}\n\n/**\n * Returns a JSON representation of the generated CSS rules taking into account box model properties, top, right, bottom, left.\n *\n * @param style Style object.\n * @param options Options object with settings to adjust how the styles are generated.\n * @param path An array of strings representing the path to the style value in the style object.\n * @param ruleKeys An array of CSS property keys and patterns.\n * @param individualProperties The \"sides\" or individual properties for which to generate rules.\n *\n * @return GeneratedCSSRule[] CSS rules.\n */\nexport function generateBoxRules(\n\tstyle: Style,\n\toptions: StyleOptions,\n\tpath: string[],\n\truleKeys: CssRulesKeys,\n\tindividualProperties: string[] = [ 'top', 'right', 'bottom', 'left' ]\n): GeneratedCSSRule[] {\n\tconst boxStyle: Box | string | undefined = getStyleValueByPath(\n\t\tstyle,\n\t\tpath\n\t);\n\tif ( ! boxStyle ) {\n\t\treturn [];\n\t}\n\n\tconst rules: GeneratedCSSRule[] = [];\n\tif ( typeof boxStyle === 'string' ) {\n\t\trules.push( {\n\t\t\tselector: options?.selector,\n\t\t\tkey: ruleKeys.default,\n\t\t\tvalue: getCSSValueFromRawStyle( boxStyle ),\n\t\t} );\n\t} else {\n\t\tconst sideRules = individualProperties.reduce(\n\t\t\t( acc: GeneratedCSSRule[], side: string ) => {\n\t\t\t\tconst value = getCSSValueFromRawStyle(\n\t\t\t\t\tgetStyleValueByPath( boxStyle, [ side ] )\n\t\t\t\t);\n\t\t\t\tif ( value ) {\n\t\t\t\t\tacc.push( {\n\t\t\t\t\t\tselector: options?.selector,\n\t\t\t\t\t\tkey: ruleKeys?.individual.replace(\n\t\t\t\t\t\t\t'%s',\n\t\t\t\t\t\t\tupperFirst( side )\n\t\t\t\t\t\t),\n\t\t\t\t\t\tvalue,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\treturn acc;\n\t\t\t},\n\t\t\t[]\n\t\t);\n\t\trules.push( ...sideRules );\n\t}\n\n\treturn rules;\n}\n\n/**\n * Returns a WordPress CSS custom var value from incoming style preset value,\n * if one is detected.\n *\n * The preset value is a string and follows the pattern `var:description|context|slug`.\n *\n * Example:\n *\n * `getCSSValueFromRawStyle( 'var:preset|color|heavenlyBlue' )` // returns 'var(--wp--preset--color--heavenly-blue)'\n *\n * @param styleValue A string representing a raw CSS value. Non-strings won't be processed.\n *\n * @return A CSS custom var value if the incoming style value is a preset value.\n */\n\nexport function getCSSValueFromRawStyle< StyleValue = string >(\n\tstyleValue: StyleValue\n): StyleValue {\n\tif (\n\t\ttypeof styleValue === 'string' &&\n\t\tstyleValue.startsWith( VARIABLE_REFERENCE_PREFIX )\n\t) {\n\t\tconst variable = styleValue\n\t\t\t.slice( VARIABLE_REFERENCE_PREFIX.length )\n\t\t\t.split( VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE )\n\t\t\t.map( ( presetVariable ) =>\n\t\t\t\tkebabCase( presetVariable, {\n\t\t\t\t\tsplitRegexp: [\n\t\t\t\t\t\t/([a-z0-9])([A-Z])/g, // fooBar => foo-bar, 3Bar => 3-bar\n\t\t\t\t\t\t/([0-9])([a-z])/g, // 3bar => 3-bar\n\t\t\t\t\t\t/([A-Za-z])([0-9])/g, // Foo3 => foo-3, foo3 => foo-3\n\t\t\t\t\t\t/([A-Z])([A-Z][a-z])/g, // FOOBar => foo-bar\n\t\t\t\t\t],\n\t\t\t\t} )\n\t\t\t)\n\t\t\t.join( VARIABLE_PATH_SEPARATOR_TOKEN_STYLE );\n\t\treturn `var(--wp--${ variable })` as StyleValue;\n\t}\n\treturn styleValue;\n}\n\n/**\n * Capitalizes the first letter in a string.\n *\n * @param string The string whose first letter the function will capitalize.\n *\n * @return String with the first letter capitalized.\n */\nexport function upperFirst( string: string ): string {\n\tconst [ firstLetter, ...rest ] = string;\n\treturn firstLetter.toUpperCase() + rest.join( '' );\n}\n\n/**\n * Converts an array of strings into a camelCase string.\n *\n * @param strings The strings to join into a camelCase string.\n *\n * @return camelCase string.\n */\nexport function camelCaseJoin( strings: string[] ): string {\n\tconst [ firstItem, ...rest ] = strings;\n\treturn firstItem.toLowerCase() + rest.map( upperFirst ).join( '' );\n}\n\n/**\n * Safely decodes a URI with `decodeURI`. Returns the URI unmodified if\n * `decodeURI` throws an error.\n *\n * @param {string} uri URI to decode.\n *\n * @example\n * ```js\n * const badUri = safeDecodeURI( '%z' ); // does not throw an Error, simply returns '%z'\n * ```\n *\n * @return {string} Decoded URI if possible.\n */\nexport function safeDecodeURI( uri: string ): string {\n\ttry {\n\t\treturn decodeURI( uri );\n\t} catch ( uriError ) {\n\t\treturn uri;\n\t}\n}\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,yBAAuC;AAYvC,uBAIO;AAUA,IAAM,sBAAsB,CAClC,QACA,SACI;AACJ,MAAI,QAAa;AACjB,OAAK,QAAS,CAAE,cAAuB;AACtC,YAAQ,QAAS,SAAU;AAAA,EAC5B,CAAE;AACF,SAAO;AACR;AAYO,SAAS,aACf,OACA,SACA,MACA,SACqB;AACrB,QAAM,aAAiC,oBAAqB,OAAO,IAAK;AAExE,SAAO,aACJ;AAAA,IACA;AAAA,MACC,UAAU,SAAS;AAAA,MACnB,KAAK;AAAA,MACL,OAAO,wBAAyB,UAAW;AAAA,IAC5C;AAAA,EACA,IACA,CAAC;AACL;AAaO,SAAS,iBACf,OACA,SACA,MACA,UACA,uBAAiC,CAAE,OAAO,SAAS,UAAU,MAAO,GAC/C;AACrB,QAAM,WAAqC;AAAA,IAC1C;AAAA,IACA;AAAA,EACD;AACA,MAAK,CAAE,UAAW;AACjB,WAAO,CAAC;AAAA,EACT;AAEA,QAAM,QAA4B,CAAC;AACnC,MAAK,OAAO,aAAa,UAAW;AACnC,UAAM,KAAM;AAAA,MACX,UAAU,SAAS;AAAA,MACnB,KAAK,SAAS;AAAA,MACd,OAAO,wBAAyB,QAAS;AAAA,IAC1C,CAAE;AAAA,EACH,OAAO;AACN,UAAM,YAAY,qBAAqB;AAAA,MACtC,CAAE,KAAyB,SAAkB;AAC5C,cAAM,QAAQ;AAAA,UACb,oBAAqB,UAAU,CAAE,IAAK,CAAE;AAAA,QACzC;AACA,YAAK,OAAQ;AACZ,cAAI,KAAM;AAAA,YACT,UAAU,SAAS;AAAA,YACnB,KAAK,UAAU,WAAW;AAAA,cACzB;AAAA,cACA,WAAY,IAAK;AAAA,YAClB;AAAA,YACA;AAAA,UACD,CAAE;AAAA,QACH;AACA,eAAO;AAAA,MACR;AAAA,MACA,CAAC;AAAA,IACF;AACA,UAAM,KAAM,GAAG,SAAU;AAAA,EAC1B;AAEA,SAAO;AACR;AAiBO,SAAS,wBACf,YACa;AACb,MACC,OAAO,eAAe,YACtB,WAAW,WAAY,0CAA0B,GAChD;AACD,UAAM,WAAW,WACf,MAAO,2CAA0B,MAAO,EACxC,MAAO,wDAAwC,EAC/C;AAAA,MAAK,CAAE,uBACP,mBAAAA,WAAW,gBAAgB;AAAA,QAC1B,aAAa;AAAA,UACZ;AAAA;AAAA,UACA;AAAA;AAAA,UACA;AAAA;AAAA,UACA;AAAA;AAAA,QACD;AAAA,MACD,CAAE;AAAA,IACH,EACC,KAAM,oDAAoC;AAC5C,WAAO,aAAc,QAAS;AAAA,EAC/B;AACA,SAAO;AACR;AASO,SAAS,WAAY,QAAyB;AACpD,QAAM,CAAE,aAAa,GAAG,IAAK,IAAI;AACjC,SAAO,YAAY,YAAY,IAAI,KAAK,KAAM,EAAG;AAClD;AASO,SAAS,cAAe,SAA4B;AAC1D,QAAM,CAAE,WAAW,GAAG,IAAK,IAAI;AAC/B,SAAO,UAAU,YAAY,IAAI,KAAK,IAAK,UAAW,EAAE,KAAM,EAAG;AAClE;AAeO,SAAS,cAAe,KAAsB;AACpD,MAAI;AACH,WAAO,UAAW,GAAI;AAAA,EACvB,SAAU,UAAW;AACpB,WAAO;AAAA,EACR;AACD;",
|
|
6
6
|
"names": ["kebabCase"]
|
|
7
7
|
}
|
package/build/types.js
CHANGED
|
@@ -12,6 +12,8 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
12
12
|
return to;
|
|
13
13
|
};
|
|
14
14
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
15
|
+
|
|
16
|
+
// packages/style-engine/src/types.ts
|
|
15
17
|
var types_exports = {};
|
|
16
18
|
module.exports = __toCommonJS(types_exports);
|
|
17
19
|
//# sourceMappingURL=types.js.map
|
package/build/types.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/types.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\ntype BoxVariant = 'margin' | 'padding';\nexport interface Box< T extends BoxVariant | undefined = undefined > {\n\ttop?: CSSProperties[ T extends undefined ? 'top' : `${ T }Top` ];\n\tright?: CSSProperties[ T extends undefined ? 'right' : `${ T }Right` ];\n\tbottom?: CSSProperties[ T extends undefined ? 'bottom' : `${ T }Bottom` ];\n\tleft?: CSSProperties[ T extends undefined ? 'left' : `${ T }Left` ];\n}\n\nexport type BoxEdge = 'top' | 'right' | 'bottom' | 'left';\n\n// `T` is one of the values in `BorderIndividualProperty`. The expected CSSProperties key is something like `borderTopColor`.\nexport interface BorderIndividualStyles< T extends BoxEdge > {\n\tcolor?: CSSProperties[ `border${ Capitalize< T > }Color` ];\n\tstyle?: CSSProperties[ `border${ Capitalize< T > }Style` ];\n\twidth?: CSSProperties[ `border${ Capitalize< T > }Width` ];\n}\n\nexport interface Style {\n\tbackground?: {\n\t\tbackgroundImage?:\n\t\t\t| { url?: CSSProperties[ 'backgroundImage' ]; source?: string }\n\t\t\t| CSSProperties[ 'backgroundImage' ];\n\t\tbackgroundPosition?: CSSProperties[ 'backgroundPosition' ];\n\t\tbackgroundRepeat?: CSSProperties[ 'backgroundRepeat' ];\n\t\tbackgroundSize?: CSSProperties[ 'backgroundSize' ];\n\t};\n\tborder?: {\n\t\tcolor?: CSSProperties[ 'borderColor' ];\n\t\tradius?:\n\t\t\t| CSSProperties[ 'borderRadius' ]\n\t\t\t| {\n\t\t\t\t\ttopLeft?: CSSProperties[ 'borderTopLeftRadius' ];\n\t\t\t\t\ttopRight?: CSSProperties[ 'borderTopRightRadius' ];\n\t\t\t\t\tbottomLeft?: CSSProperties[ 'borderBottomLeftRadius' ];\n\t\t\t\t\tbottomRight?: CSSProperties[ 'borderBottomLeftRadius' ];\n\t\t\t };\n\t\tstyle?: CSSProperties[ 'borderStyle' ];\n\t\twidth?: CSSProperties[ 'borderWidth' ];\n\t\ttop?: BorderIndividualStyles< 'top' >;\n\t\tright?: BorderIndividualStyles< 'right' >;\n\t\tbottom?: BorderIndividualStyles< 'bottom' >;\n\t\tleft?: BorderIndividualStyles< 'left' >;\n\t};\n\tdimensions?: {\n\t\taspectRatio?: CSSProperties[ 'aspectRatio' ];\n\t\tminHeight?: CSSProperties[ 'minHeight' ];\n\t};\n\tspacing?: {\n\t\tmargin?: CSSProperties[ 'margin' ] | Box< 'margin' >;\n\t\tpadding?: CSSProperties[ 'padding' ] | Box< 'padding' >;\n\t};\n\ttypography?: {\n\t\tfontSize?: CSSProperties[ 'fontSize' ];\n\t\tfontFamily?: CSSProperties[ 'fontFamily' ];\n\t\tfontWeight?: CSSProperties[ 'fontWeight' ];\n\t\tfontStyle?: CSSProperties[ 'fontStyle' ];\n\t\tletterSpacing?: CSSProperties[ 'letterSpacing' ];\n\t\tlineHeight?: CSSProperties[ 'lineHeight' ];\n\t\ttextColumns?: CSSProperties[ 'columnCount' ];\n\t\ttextDecoration?: CSSProperties[ 'textDecoration' ];\n\t\ttextTransform?: CSSProperties[ 'textTransform' ];\n\t\twritingMode?: CSSProperties[ 'writingMode' ];\n\t};\n\tcolor?: {\n\t\ttext?: CSSProperties[ 'color' ];\n\t\tbackground?: CSSProperties[ 'backgroundColor' ];\n\t\tgradient?: CSSProperties[ 'background' ];\n\t};\n\telements?: {\n\t\tlink?: {\n\t\t\tcolor?: {\n\t\t\t\ttext?: CSSProperties[ 'color' ];\n\t\t\t};\n\t\t};\n\t};\n}\n\nexport interface CssRulesKeys {\n\tdefault: string;\n\tindividual: string;\n}\n\nexport interface StyleOptions {\n\t/**\n\t * CSS selector for the generated style.\n\t */\n\tselector?: string;\n}\n\nexport interface GeneratedCSSRule {\n\tselector?: string;\n\tvalue: string | unknown;\n\t/**\n\t * The CSS key in JS style attribute format, compatible with React.\n\t * E.g. `paddingTop` instead of `padding-top`.\n\t */\n\tkey: string;\n}\n\nexport interface GenerateFunction {\n\t( style: Style, options: StyleOptions ): GeneratedCSSRule[];\n}\n\nexport interface StyleDefinition {\n\tname: string;\n\tgenerate?: GenerateFunction;\n}\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/build-module/index.js
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
|
+
// packages/style-engine/src/index.ts
|
|
1
2
|
import { paramCase as kebabCase } from "change-case";
|
|
2
3
|
import { styleDefinitions } from "./styles";
|
|
4
|
+
import { getCSSValueFromRawStyle } from "./styles/utils";
|
|
3
5
|
function compileCSS(style, options = {}) {
|
|
4
6
|
const rules = getCSSRules(style, options);
|
|
5
7
|
if (!options?.selector) {
|
|
@@ -45,7 +47,6 @@ function getCSSRules(style, options = {}) {
|
|
|
45
47
|
});
|
|
46
48
|
return rules;
|
|
47
49
|
}
|
|
48
|
-
import { getCSSValueFromRawStyle } from "./styles/utils";
|
|
49
50
|
export {
|
|
50
51
|
compileCSS,
|
|
51
52
|
getCSSRules,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/index.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * External dependencies\n */\nimport { paramCase as kebabCase } from 'change-case';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tStyle,\n\tStyleOptions,\n\tGeneratedCSSRule,\n\tStyleDefinition,\n} from './types';\nimport { styleDefinitions } from './styles';\n\n/**\n * Generates a stylesheet for a given style object and selector.\n *\n * @since 6.1.0 Introduced in WordPress core.\n *\n * @param style Style object, for example, the value of a block's attributes.style object or the top level styles in theme.json\n * @param options Options object with settings to adjust how the styles are generated.\n *\n * @return A generated stylesheet or inline style declarations.\n */\nexport function compileCSS( style: Style, options: StyleOptions = {} ): string {\n\tconst rules = getCSSRules( style, options );\n\n\t// If no selector is provided, treat generated rules as inline styles to be returned as a single string.\n\tif ( ! options?.selector ) {\n\t\tconst inlineRules: string[] = [];\n\t\trules.forEach( ( rule ) => {\n\t\t\tinlineRules.push( `${ kebabCase( rule.key ) }: ${ rule.value };` );\n\t\t} );\n\t\treturn inlineRules.join( ' ' );\n\t}\n\n\tconst groupedRules = rules.reduce(\n\t\t( acc: Record< string, GeneratedCSSRule[] >, rule ) => {\n\t\t\tconst { selector } = rule;\n\t\t\tif ( ! selector ) {\n\t\t\t\treturn acc;\n\t\t\t}\n\t\t\tif ( ! acc[ selector ] ) {\n\t\t\t\tacc[ selector ] = [];\n\t\t\t}\n\t\t\tacc[ selector ].push( rule );\n\t\t\treturn acc;\n\t\t},\n\t\t{}\n\t);\n\tconst selectorRules = Object.keys( groupedRules ).reduce(\n\t\t( acc: string[], subSelector: string ) => {\n\t\t\tacc.push(\n\t\t\t\t`${ subSelector } { ${ groupedRules[ subSelector ]\n\t\t\t\t\t.map(\n\t\t\t\t\t\t( rule: GeneratedCSSRule ) =>\n\t\t\t\t\t\t\t`${ kebabCase( rule.key ) }: ${ rule.value };`\n\t\t\t\t\t)\n\t\t\t\t\t.join( ' ' ) } }`\n\t\t\t);\n\t\t\treturn acc;\n\t\t},\n\t\t[]\n\t);\n\n\treturn selectorRules.join( '\\n' );\n}\n\n/**\n * Returns a JSON representation of the generated CSS rules.\n *\n * @since 6.1.0 Introduced in WordPress core.\n *\n * @param style Style object, for example, the value of a block's attributes.style object or the top level styles in theme.json\n * @param options Options object with settings to adjust how the styles are generated.\n *\n * @return A collection of objects containing the selector, if any, the CSS property key (camelcase) and parsed CSS value.\n */\nexport function getCSSRules(\n\tstyle: Style,\n\toptions: StyleOptions = {}\n): GeneratedCSSRule[] {\n\tconst rules: GeneratedCSSRule[] = [];\n\tstyleDefinitions.forEach( ( definition: StyleDefinition ) => {\n\t\tif ( typeof definition.generate === 'function' ) {\n\t\t\trules.push( ...definition.generate( style, options ) );\n\t\t}\n\t} );\n\n\treturn rules;\n}\n\n// Export style utils.\nexport { getCSSValueFromRawStyle } from './styles/utils';\n"],
|
|
5
|
-
"mappings": "AAGA,SAAS,aAAa,iBAAiB;AAWvC,SAAS,wBAAwB;
|
|
5
|
+
"mappings": ";AAGA,SAAS,aAAa,iBAAiB;AAWvC,SAAS,wBAAwB;AAiFjC,SAAS,+BAA+B;AArEjC,SAAS,WAAY,OAAc,UAAwB,CAAC,GAAY;AAC9E,QAAM,QAAQ,YAAa,OAAO,OAAQ;AAG1C,MAAK,CAAE,SAAS,UAAW;AAC1B,UAAM,cAAwB,CAAC;AAC/B,UAAM,QAAS,CAAE,SAAU;AAC1B,kBAAY,KAAM,GAAI,UAAW,KAAK,GAAI,CAAE,KAAM,KAAK,KAAM,GAAI;AAAA,IAClE,CAAE;AACF,WAAO,YAAY,KAAM,GAAI;AAAA,EAC9B;AAEA,QAAM,eAAe,MAAM;AAAA,IAC1B,CAAE,KAA2C,SAAU;AACtD,YAAM,EAAE,SAAS,IAAI;AACrB,UAAK,CAAE,UAAW;AACjB,eAAO;AAAA,MACR;AACA,UAAK,CAAE,IAAK,QAAS,GAAI;AACxB,YAAK,QAAS,IAAI,CAAC;AAAA,MACpB;AACA,UAAK,QAAS,EAAE,KAAM,IAAK;AAC3B,aAAO;AAAA,IACR;AAAA,IACA,CAAC;AAAA,EACF;AACA,QAAM,gBAAgB,OAAO,KAAM,YAAa,EAAE;AAAA,IACjD,CAAE,KAAe,gBAAyB;AACzC,UAAI;AAAA,QACH,GAAI,WAAY,MAAO,aAAc,WAAY,EAC/C;AAAA,UACA,CAAE,SACD,GAAI,UAAW,KAAK,GAAI,CAAE,KAAM,KAAK,KAAM;AAAA,QAC7C,EACC,KAAM,GAAI,CAAE;AAAA,MACf;AACA,aAAO;AAAA,IACR;AAAA,IACA,CAAC;AAAA,EACF;AAEA,SAAO,cAAc,KAAM,IAAK;AACjC;AAYO,SAAS,YACf,OACA,UAAwB,CAAC,GACJ;AACrB,QAAM,QAA4B,CAAC;AACnC,mBAAiB,QAAS,CAAE,eAAiC;AAC5D,QAAK,OAAO,WAAW,aAAa,YAAa;AAChD,YAAM,KAAM,GAAG,WAAW,SAAU,OAAO,OAAQ,CAAE;AAAA,IACtD;AAAA,EACD,CAAE;AAEF,SAAO;AACR;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
// packages/style-engine/src/styles/background/index.ts
|
|
1
2
|
import { generateRule, safeDecodeURI } from "../utils";
|
|
2
|
-
|
|
3
|
+
var backgroundImage = {
|
|
3
4
|
name: "backgroundImage",
|
|
4
5
|
generate: (style, options) => {
|
|
5
6
|
const _backgroundImage = style?.background?.backgroundImage;
|
|
@@ -23,7 +24,7 @@ const backgroundImage = {
|
|
|
23
24
|
);
|
|
24
25
|
}
|
|
25
26
|
};
|
|
26
|
-
|
|
27
|
+
var backgroundPosition = {
|
|
27
28
|
name: "backgroundPosition",
|
|
28
29
|
generate: (style, options) => {
|
|
29
30
|
return generateRule(
|
|
@@ -34,7 +35,7 @@ const backgroundPosition = {
|
|
|
34
35
|
);
|
|
35
36
|
}
|
|
36
37
|
};
|
|
37
|
-
|
|
38
|
+
var backgroundRepeat = {
|
|
38
39
|
name: "backgroundRepeat",
|
|
39
40
|
generate: (style, options) => {
|
|
40
41
|
return generateRule(
|
|
@@ -45,7 +46,7 @@ const backgroundRepeat = {
|
|
|
45
46
|
);
|
|
46
47
|
}
|
|
47
48
|
};
|
|
48
|
-
|
|
49
|
+
var backgroundSize = {
|
|
49
50
|
name: "backgroundSize",
|
|
50
51
|
generate: (style, options) => {
|
|
51
52
|
return generateRule(
|
|
@@ -56,7 +57,7 @@ const backgroundSize = {
|
|
|
56
57
|
);
|
|
57
58
|
}
|
|
58
59
|
};
|
|
59
|
-
|
|
60
|
+
var backgroundAttachment = {
|
|
60
61
|
name: "backgroundAttachment",
|
|
61
62
|
generate: (style, options) => {
|
|
62
63
|
return generateRule(
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/background/index.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateRule, safeDecodeURI } from '../utils';\n\nconst backgroundImage = {\n\tname: 'backgroundImage',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\tconst _backgroundImage = style?.background?.backgroundImage;\n\n\t\t/*\n\t\t * The background image can be a string or an object.\n\t\t * If the background image is a string, it could already contain a url() function,\n\t\t * or have a linear-gradient value.\n\t\t */\n\t\tif ( typeof _backgroundImage === 'object' && _backgroundImage?.url ) {\n\t\t\treturn [\n\t\t\t\t{\n\t\t\t\t\tselector: options.selector,\n\t\t\t\t\tkey: 'backgroundImage',\n\t\t\t\t\t// Passed `url` may already be encoded. To prevent double encoding, decodeURI is executed to revert to the original string.\n\t\t\t\t\tvalue: `url( '${ encodeURI(\n\t\t\t\t\t\tsafeDecodeURI( _backgroundImage.url )\n\t\t\t\t\t) }' )`,\n\t\t\t\t},\n\t\t\t];\n\t\t}\n\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundImage' ],\n\t\t\t'backgroundImage'\n\t\t);\n\t},\n};\n\nconst backgroundPosition = {\n\tname: 'backgroundPosition',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundPosition' ],\n\t\t\t'backgroundPosition'\n\t\t);\n\t},\n};\n\nconst backgroundRepeat = {\n\tname: 'backgroundRepeat',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundRepeat' ],\n\t\t\t'backgroundRepeat'\n\t\t);\n\t},\n};\n\nconst backgroundSize = {\n\tname: 'backgroundSize',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundSize' ],\n\t\t\t'backgroundSize'\n\t\t);\n\t},\n};\n\nconst backgroundAttachment = {\n\tname: 'backgroundAttachment',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundAttachment' ],\n\t\t\t'backgroundAttachment'\n\t\t);\n\t},\n};\n\nexport default [\n\tbackgroundImage,\n\tbackgroundPosition,\n\tbackgroundRepeat,\n\tbackgroundSize,\n\tbackgroundAttachment,\n];\n"],
|
|
5
|
-
"mappings": "AAIA,SAAS,cAAc,qBAAqB;AAE5C,
|
|
5
|
+
"mappings": ";AAIA,SAAS,cAAc,qBAAqB;AAE5C,IAAM,kBAAkB;AAAA,EACvB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,UAAM,mBAAmB,OAAO,YAAY;AAO5C,QAAK,OAAO,qBAAqB,YAAY,kBAAkB,KAAM;AACpE,aAAO;AAAA,QACN;AAAA,UACC,UAAU,QAAQ;AAAA,UAClB,KAAK;AAAA;AAAA,UAEL,OAAO,SAAU;AAAA,YAChB,cAAe,iBAAiB,GAAI;AAAA,UACrC,CAAE;AAAA,QACH;AAAA,MACD;AAAA,IACD;AAEA,WAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,iBAAkB;AAAA,MAClC;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,qBAAqB;AAAA,EAC1B,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,WAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,oBAAqB;AAAA,MACrC;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,mBAAmB;AAAA,EACxB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,WAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,kBAAmB;AAAA,MACnC;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,iBAAiB;AAAA,EACtB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,WAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,gBAAiB;AAAA,MACjC;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,uBAAuB;AAAA,EAC5B,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,WAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,sBAAuB;AAAA,MACvC;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAO,qBAAQ;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
// packages/style-engine/src/styles/border/index.ts
|
|
1
2
|
import { generateRule, generateBoxRules, camelCaseJoin } from "../utils";
|
|
2
3
|
function createBorderGenerateFunction(path) {
|
|
3
4
|
return (style, options) => generateRule(style, options, path, camelCaseJoin(path));
|
|
@@ -10,11 +11,11 @@ function createBorderEdgeGenerateFunction(edge) {
|
|
|
10
11
|
});
|
|
11
12
|
};
|
|
12
13
|
}
|
|
13
|
-
|
|
14
|
+
var color = {
|
|
14
15
|
name: "color",
|
|
15
16
|
generate: createBorderGenerateFunction(["border", "color"])
|
|
16
17
|
};
|
|
17
|
-
|
|
18
|
+
var radius = {
|
|
18
19
|
name: "radius",
|
|
19
20
|
generate: (style, options) => {
|
|
20
21
|
return generateBoxRules(
|
|
@@ -29,27 +30,27 @@ const radius = {
|
|
|
29
30
|
);
|
|
30
31
|
}
|
|
31
32
|
};
|
|
32
|
-
|
|
33
|
+
var borderStyle = {
|
|
33
34
|
name: "style",
|
|
34
35
|
generate: createBorderGenerateFunction(["border", "style"])
|
|
35
36
|
};
|
|
36
|
-
|
|
37
|
+
var width = {
|
|
37
38
|
name: "width",
|
|
38
39
|
generate: createBorderGenerateFunction(["border", "width"])
|
|
39
40
|
};
|
|
40
|
-
|
|
41
|
+
var borderTop = {
|
|
41
42
|
name: "borderTop",
|
|
42
43
|
generate: createBorderEdgeGenerateFunction("top")
|
|
43
44
|
};
|
|
44
|
-
|
|
45
|
+
var borderRight = {
|
|
45
46
|
name: "borderRight",
|
|
46
47
|
generate: createBorderEdgeGenerateFunction("right")
|
|
47
48
|
};
|
|
48
|
-
|
|
49
|
+
var borderBottom = {
|
|
49
50
|
name: "borderBottom",
|
|
50
51
|
generate: createBorderEdgeGenerateFunction("bottom")
|
|
51
52
|
};
|
|
52
|
-
|
|
53
|
+
var borderLeft = {
|
|
53
54
|
name: "borderLeft",
|
|
54
55
|
generate: createBorderEdgeGenerateFunction("left")
|
|
55
56
|
};
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/border/index.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { BoxEdge, GenerateFunction, StyleDefinition } from '../../types';\nimport { generateRule, generateBoxRules, camelCaseJoin } from '../utils';\n\n/**\n * Creates a function for generating CSS rules when the style path is the same as the camelCase CSS property used in React.\n *\n * @param path An array of strings representing the path to the style value in the style object.\n *\n * @return A function that generates CSS rules.\n */\nfunction createBorderGenerateFunction( path: string[] ): GenerateFunction {\n\treturn ( style, options ) =>\n\t\tgenerateRule( style, options, path, camelCaseJoin( path ) );\n}\n\n/**\n * Creates a function for generating border-{top,bottom,left,right}-{color,style,width} CSS rules.\n *\n * @param edge The edge to create CSS rules for.\n *\n * @return A function that generates CSS rules.\n */\nfunction createBorderEdgeGenerateFunction( edge: BoxEdge ): GenerateFunction {\n\treturn ( style, options ) => {\n\t\treturn [ 'color', 'style', 'width' ].flatMap( ( key ) => {\n\t\t\tconst path = [ 'border', edge, key ];\n\t\t\treturn createBorderGenerateFunction( path )( style, options );\n\t\t} );\n\t};\n}\n\nconst color: StyleDefinition = {\n\tname: 'color',\n\tgenerate: createBorderGenerateFunction( [ 'border', 'color' ] ),\n};\n\nconst radius: StyleDefinition = {\n\tname: 'radius',\n\tgenerate: ( style, options ) => {\n\t\treturn generateBoxRules(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'border', 'radius' ],\n\t\t\t{\n\t\t\t\tdefault: 'borderRadius',\n\t\t\t\tindividual: 'border%sRadius',\n\t\t\t},\n\t\t\t[ 'topLeft', 'topRight', 'bottomLeft', 'bottomRight' ]\n\t\t);\n\t},\n};\n\nconst borderStyle: StyleDefinition = {\n\tname: 'style',\n\tgenerate: createBorderGenerateFunction( [ 'border', 'style' ] ),\n};\n\nconst width: StyleDefinition = {\n\tname: 'width',\n\tgenerate: createBorderGenerateFunction( [ 'border', 'width' ] ),\n};\n\nconst borderTop: StyleDefinition = {\n\tname: 'borderTop',\n\tgenerate: createBorderEdgeGenerateFunction( 'top' ),\n};\n\nconst borderRight: StyleDefinition = {\n\tname: 'borderRight',\n\tgenerate: createBorderEdgeGenerateFunction( 'right' ),\n};\n\nconst borderBottom: StyleDefinition = {\n\tname: 'borderBottom',\n\tgenerate: createBorderEdgeGenerateFunction( 'bottom' ),\n};\n\nconst borderLeft: StyleDefinition = {\n\tname: 'borderLeft',\n\tgenerate: createBorderEdgeGenerateFunction( 'left' ),\n};\n\nexport default [\n\tcolor,\n\tborderStyle,\n\twidth,\n\tradius,\n\tborderTop,\n\tborderRight,\n\tborderBottom,\n\tborderLeft,\n];\n"],
|
|
5
|
-
"mappings": "AAIA,SAAS,cAAc,kBAAkB,qBAAqB;AAS9D,SAAS,6BAA8B,MAAmC;AACzE,SAAO,CAAE,OAAO,YACf,aAAc,OAAO,SAAS,MAAM,cAAe,IAAK,CAAE;AAC5D;AASA,SAAS,iCAAkC,MAAkC;AAC5E,SAAO,CAAE,OAAO,YAAa;AAC5B,WAAO,CAAE,SAAS,SAAS,OAAQ,EAAE,QAAS,CAAE,QAAS;AACxD,YAAM,OAAO,CAAE,UAAU,MAAM,GAAI;AACnC,aAAO,6BAA8B,IAAK,EAAG,OAAO,OAAQ;AAAA,IAC7D,CAAE;AAAA,EACH;AACD;AAEA,
|
|
5
|
+
"mappings": ";AAIA,SAAS,cAAc,kBAAkB,qBAAqB;AAS9D,SAAS,6BAA8B,MAAmC;AACzE,SAAO,CAAE,OAAO,YACf,aAAc,OAAO,SAAS,MAAM,cAAe,IAAK,CAAE;AAC5D;AASA,SAAS,iCAAkC,MAAkC;AAC5E,SAAO,CAAE,OAAO,YAAa;AAC5B,WAAO,CAAE,SAAS,SAAS,OAAQ,EAAE,QAAS,CAAE,QAAS;AACxD,YAAM,OAAO,CAAE,UAAU,MAAM,GAAI;AACnC,aAAO,6BAA8B,IAAK,EAAG,OAAO,OAAQ;AAAA,IAC7D,CAAE;AAAA,EACH;AACD;AAEA,IAAM,QAAyB;AAAA,EAC9B,MAAM;AAAA,EACN,UAAU,6BAA8B,CAAE,UAAU,OAAQ,CAAE;AAC/D;AAEA,IAAM,SAA0B;AAAA,EAC/B,MAAM;AAAA,EACN,UAAU,CAAE,OAAO,YAAa;AAC/B,WAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,UAAU,QAAS;AAAA,MACrB;AAAA,QACC,SAAS;AAAA,QACT,YAAY;AAAA,MACb;AAAA,MACA,CAAE,WAAW,YAAY,cAAc,aAAc;AAAA,IACtD;AAAA,EACD;AACD;AAEA,IAAM,cAA+B;AAAA,EACpC,MAAM;AAAA,EACN,UAAU,6BAA8B,CAAE,UAAU,OAAQ,CAAE;AAC/D;AAEA,IAAM,QAAyB;AAAA,EAC9B,MAAM;AAAA,EACN,UAAU,6BAA8B,CAAE,UAAU,OAAQ,CAAE;AAC/D;AAEA,IAAM,YAA6B;AAAA,EAClC,MAAM;AAAA,EACN,UAAU,iCAAkC,KAAM;AACnD;AAEA,IAAM,cAA+B;AAAA,EACpC,MAAM;AAAA,EACN,UAAU,iCAAkC,OAAQ;AACrD;AAEA,IAAM,eAAgC;AAAA,EACrC,MAAM;AAAA,EACN,UAAU,iCAAkC,QAAS;AACtD;AAEA,IAAM,aAA8B;AAAA,EACnC,MAAM;AAAA,EACN,UAAU,iCAAkC,MAAO;AACpD;AAEA,IAAO,iBAAQ;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/color/background.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateRule } from '../utils';\n\nconst background = {\n\tname: 'background',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'color', 'background' ],\n\t\t\t'backgroundColor'\n\t\t);\n\t},\n};\n\nexport default background;\n"],
|
|
5
|
-
"mappings": "AAIA,SAAS,oBAAoB;AAE7B,
|
|
5
|
+
"mappings": ";AAIA,SAAS,oBAAoB;AAE7B,IAAM,aAAa;AAAA,EAClB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,WAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,SAAS,YAAa;AAAA,MACxB;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAO,qBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/color/gradient.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateRule } from '../utils';\n\nconst gradient = {\n\tname: 'gradient',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'color', 'gradient' ],\n\t\t\t'background'\n\t\t);\n\t},\n};\n\nexport default gradient;\n"],
|
|
5
|
-
"mappings": "AAIA,SAAS,oBAAoB;AAE7B,
|
|
5
|
+
"mappings": ";AAIA,SAAS,oBAAoB;AAE7B,IAAM,WAAW;AAAA,EAChB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,WAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,SAAS,UAAW;AAAA,MACtB;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAO,mBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/color/index.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport background from './background';\nimport gradient from './gradient';\nimport text from './text';\n\nexport default [ text, gradient, background ];\n"],
|
|
5
|
-
"mappings": "AAGA,OAAO,gBAAgB;AACvB,OAAO,cAAc;AACrB,OAAO,UAAU;AAEjB,IAAO,gBAAQ,CAAE,MAAM,UAAU,UAAW;",
|
|
5
|
+
"mappings": ";AAGA,OAAO,gBAAgB;AACvB,OAAO,cAAc;AACrB,OAAO,UAAU;AAEjB,IAAO,gBAAQ,CAAE,MAAM,UAAU,UAAW;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/color/text.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateRule } from '../utils';\n\nconst text = {\n\tname: 'text',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule( style, options, [ 'color', 'text' ], 'color' );\n\t},\n};\n\nexport default text;\n"],
|
|
5
|
-
"mappings": "AAIA,SAAS,oBAAoB;AAE7B,
|
|
5
|
+
"mappings": ";AAIA,SAAS,oBAAoB;AAE7B,IAAM,OAAO;AAAA,EACZ,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,WAAO,aAAc,OAAO,SAAS,CAAE,SAAS,MAAO,GAAG,OAAQ;AAAA,EACnE;AACD;AAEA,IAAO,eAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
// packages/style-engine/src/styles/constants.ts
|
|
2
|
+
var VARIABLE_REFERENCE_PREFIX = "var:";
|
|
3
|
+
var VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE = "|";
|
|
4
|
+
var VARIABLE_PATH_SEPARATOR_TOKEN_STYLE = "--";
|
|
4
5
|
export {
|
|
5
6
|
VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE,
|
|
6
7
|
VARIABLE_PATH_SEPARATOR_TOKEN_STYLE,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styles/constants.ts"],
|
|
4
4
|
"sourcesContent": ["export const VARIABLE_REFERENCE_PREFIX = 'var:';\nexport const VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE = '|';\nexport const VARIABLE_PATH_SEPARATOR_TOKEN_STYLE = '--';\n"],
|
|
5
|
-
"mappings": "AAAO,
|
|
5
|
+
"mappings": ";AAAO,IAAM,4BAA4B;AAClC,IAAM,0CAA0C;AAChD,IAAM,sCAAsC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
// packages/style-engine/src/styles/dimensions/index.ts
|
|
1
2
|
import { generateRule } from "../utils";
|
|
2
|
-
|
|
3
|
+
var minHeight = {
|
|
3
4
|
name: "minHeight",
|
|
4
5
|
generate: (style, options) => {
|
|
5
6
|
return generateRule(
|
|
@@ -10,7 +11,7 @@ const minHeight = {
|
|
|
10
11
|
);
|
|
11
12
|
}
|
|
12
13
|
};
|
|
13
|
-
|
|
14
|
+
var aspectRatio = {
|
|
14
15
|
name: "aspectRatio",
|
|
15
16
|
generate: (style, options) => {
|
|
16
17
|
return generateRule(
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/dimensions/index.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateRule } from '../utils';\n\nconst minHeight = {\n\tname: 'minHeight',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'dimensions', 'minHeight' ],\n\t\t\t'minHeight'\n\t\t);\n\t},\n};\n\nconst aspectRatio = {\n\tname: 'aspectRatio',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'dimensions', 'aspectRatio' ],\n\t\t\t'aspectRatio'\n\t\t);\n\t},\n};\n\nexport default [ minHeight, aspectRatio ];\n"],
|
|
5
|
-
"mappings": "AAIA,SAAS,oBAAoB;AAE7B,
|
|
5
|
+
"mappings": ";AAIA,SAAS,oBAAoB;AAE7B,IAAM,YAAY;AAAA,EACjB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,WAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,WAAY;AAAA,MAC5B;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAM,cAAc;AAAA,EACnB,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,WAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA,CAAE,cAAc,aAAc;AAAA,MAC9B;AAAA,IACD;AAAA,EACD;AACD;AAEA,IAAO,qBAAQ,CAAE,WAAW,WAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
// packages/style-engine/src/styles/index.ts
|
|
1
2
|
import border from "./border";
|
|
2
3
|
import color from "./color";
|
|
3
4
|
import dimensions from "./dimensions";
|
|
@@ -6,7 +7,7 @@ import shadow from "./shadow";
|
|
|
6
7
|
import outline from "./outline";
|
|
7
8
|
import spacing from "./spacing";
|
|
8
9
|
import typography from "./typography";
|
|
9
|
-
|
|
10
|
+
var styleDefinitions = [
|
|
10
11
|
...border,
|
|
11
12
|
...color,
|
|
12
13
|
...dimensions,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styles/index.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport border from './border';\nimport color from './color';\nimport dimensions from './dimensions';\nimport background from './background';\nimport shadow from './shadow';\nimport outline from './outline';\nimport spacing from './spacing';\nimport typography from './typography';\n\nexport const styleDefinitions = [\n\t...border,\n\t...color,\n\t...dimensions,\n\t...outline,\n\t...spacing,\n\t...typography,\n\t...shadow,\n\t...background,\n];\n"],
|
|
5
|
-
"mappings": "AAGA,OAAO,YAAY;AACnB,OAAO,WAAW;AAClB,OAAO,gBAAgB;AACvB,OAAO,gBAAgB;AACvB,OAAO,YAAY;AACnB,OAAO,aAAa;AACpB,OAAO,aAAa;AACpB,OAAO,gBAAgB;AAEhB,
|
|
5
|
+
"mappings": ";AAGA,OAAO,YAAY;AACnB,OAAO,WAAW;AAClB,OAAO,gBAAgB;AACvB,OAAO,gBAAgB;AACvB,OAAO,YAAY;AACnB,OAAO,aAAa;AACpB,OAAO,aAAa;AACpB,OAAO,gBAAgB;AAEhB,IAAM,mBAAmB;AAAA,EAC/B,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,23 +1,24 @@
|
|
|
1
|
+
// packages/style-engine/src/styles/outline/index.ts
|
|
1
2
|
import { generateRule } from "../utils";
|
|
2
|
-
|
|
3
|
+
var color = {
|
|
3
4
|
name: "color",
|
|
4
5
|
generate: (style, options, path = ["outline", "color"], ruleKey = "outlineColor") => {
|
|
5
6
|
return generateRule(style, options, path, ruleKey);
|
|
6
7
|
}
|
|
7
8
|
};
|
|
8
|
-
|
|
9
|
+
var offset = {
|
|
9
10
|
name: "offset",
|
|
10
11
|
generate: (style, options, path = ["outline", "offset"], ruleKey = "outlineOffset") => {
|
|
11
12
|
return generateRule(style, options, path, ruleKey);
|
|
12
13
|
}
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
var outlineStyle = {
|
|
15
16
|
name: "style",
|
|
16
17
|
generate: (style, options, path = ["outline", "style"], ruleKey = "outlineStyle") => {
|
|
17
18
|
return generateRule(style, options, path, ruleKey);
|
|
18
19
|
}
|
|
19
20
|
};
|
|
20
|
-
|
|
21
|
+
var width = {
|
|
21
22
|
name: "width",
|
|
22
23
|
generate: (style, options, path = ["outline", "width"], ruleKey = "outlineWidth") => {
|
|
23
24
|
return generateRule(style, options, path, ruleKey);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/outline/index.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { GeneratedCSSRule, Style, StyleOptions } from '../../types';\nimport { generateRule } from '../utils';\n\nconst color = {\n\tname: 'color',\n\tgenerate: (\n\t\tstyle: Style,\n\t\toptions: StyleOptions,\n\t\tpath: string[] = [ 'outline', 'color' ],\n\t\truleKey: string = 'outlineColor'\n\t): GeneratedCSSRule[] => {\n\t\treturn generateRule( style, options, path, ruleKey );\n\t},\n};\n\nconst offset = {\n\tname: 'offset',\n\tgenerate: (\n\t\tstyle: Style,\n\t\toptions: StyleOptions,\n\t\tpath: string[] = [ 'outline', 'offset' ],\n\t\truleKey: string = 'outlineOffset'\n\t): GeneratedCSSRule[] => {\n\t\treturn generateRule( style, options, path, ruleKey );\n\t},\n};\n\nconst outlineStyle = {\n\tname: 'style',\n\tgenerate: (\n\t\tstyle: Style,\n\t\toptions: StyleOptions,\n\t\tpath: string[] = [ 'outline', 'style' ],\n\t\truleKey: string = 'outlineStyle'\n\t): GeneratedCSSRule[] => {\n\t\treturn generateRule( style, options, path, ruleKey );\n\t},\n};\n\nconst width = {\n\tname: 'width',\n\tgenerate: (\n\t\tstyle: Style,\n\t\toptions: StyleOptions,\n\t\tpath: string[] = [ 'outline', 'width' ],\n\t\truleKey: string = 'outlineWidth'\n\t): GeneratedCSSRule[] => {\n\t\treturn generateRule( style, options, path, ruleKey );\n\t},\n};\n\nexport default [ color, outlineStyle, offset, width ];\n"],
|
|
5
|
-
"mappings": "AAIA,SAAS,oBAAoB;AAE7B,
|
|
5
|
+
"mappings": ";AAIA,SAAS,oBAAoB;AAE7B,IAAM,QAAQ;AAAA,EACb,MAAM;AAAA,EACN,UAAU,CACT,OACA,SACA,OAAiB,CAAE,WAAW,OAAQ,GACtC,UAAkB,mBACM;AACxB,WAAO,aAAc,OAAO,SAAS,MAAM,OAAQ;AAAA,EACpD;AACD;AAEA,IAAM,SAAS;AAAA,EACd,MAAM;AAAA,EACN,UAAU,CACT,OACA,SACA,OAAiB,CAAE,WAAW,QAAS,GACvC,UAAkB,oBACM;AACxB,WAAO,aAAc,OAAO,SAAS,MAAM,OAAQ;AAAA,EACpD;AACD;AAEA,IAAM,eAAe;AAAA,EACpB,MAAM;AAAA,EACN,UAAU,CACT,OACA,SACA,OAAiB,CAAE,WAAW,OAAQ,GACtC,UAAkB,mBACM;AACxB,WAAO,aAAc,OAAO,SAAS,MAAM,OAAQ;AAAA,EACpD;AACD;AAEA,IAAM,QAAQ;AAAA,EACb,MAAM;AAAA,EACN,UAAU,CACT,OACA,SACA,OAAiB,CAAE,WAAW,OAAQ,GACtC,UAAkB,mBACM;AACxB,WAAO,aAAc,OAAO,SAAS,MAAM,OAAQ;AAAA,EACpD;AACD;AAEA,IAAO,kBAAQ,CAAE,OAAO,cAAc,QAAQ,KAAM;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/shadow/index.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateRule } from '../utils';\n\nconst shadow = {\n\tname: 'shadow',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule( style, options, [ 'shadow' ], 'boxShadow' );\n\t},\n};\n\nexport default [ shadow ];\n"],
|
|
5
|
-
"mappings": "AAIA,SAAS,oBAAoB;AAE7B,
|
|
5
|
+
"mappings": ";AAIA,SAAS,oBAAoB;AAE7B,IAAM,SAAS;AAAA,EACd,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,WAAO,aAAc,OAAO,SAAS,CAAE,QAAS,GAAG,WAAY;AAAA,EAChE;AACD;AAEA,IAAO,iBAAQ,CAAE,MAAO;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/spacing/index.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport padding from './padding';\nimport margin from './margin';\n\nexport default [ margin, padding ];\n"],
|
|
5
|
-
"mappings": "AAGA,OAAO,aAAa;AACpB,OAAO,YAAY;AAEnB,IAAO,kBAAQ,CAAE,QAAQ,OAAQ;",
|
|
5
|
+
"mappings": ";AAGA,OAAO,aAAa;AACpB,OAAO,YAAY;AAEnB,IAAO,kBAAQ,CAAE,QAAQ,OAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/spacing/margin.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateBoxRules } from '../utils';\n\nconst margin = {\n\tname: 'margin',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateBoxRules( style, options, [ 'spacing', 'margin' ], {\n\t\t\tdefault: 'margin',\n\t\t\tindividual: 'margin%s',\n\t\t} );\n\t},\n};\n\nexport default margin;\n"],
|
|
5
|
-
"mappings": "AAIA,SAAS,wBAAwB;AAEjC,
|
|
5
|
+
"mappings": ";AAIA,SAAS,wBAAwB;AAEjC,IAAM,SAAS;AAAA,EACd,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,WAAO,iBAAkB,OAAO,SAAS,CAAE,WAAW,QAAS,GAAG;AAAA,MACjE,SAAS;AAAA,MACT,YAAY;AAAA,IACb,CAAE;AAAA,EACH;AACD;AAEA,IAAO,iBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/spacing/padding.ts"],
|
|
4
4
|
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateBoxRules } from '../utils';\n\nconst padding = {\n\tname: 'padding',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateBoxRules( style, options, [ 'spacing', 'padding' ], {\n\t\t\tdefault: 'padding',\n\t\t\tindividual: 'padding%s',\n\t\t} );\n\t},\n};\n\nexport default padding;\n"],
|
|
5
|
-
"mappings": "AAIA,SAAS,wBAAwB;AAEjC,
|
|
5
|
+
"mappings": ";AAIA,SAAS,wBAAwB;AAEjC,IAAM,UAAU;AAAA,EACf,MAAM;AAAA,EACN,UAAU,CAAE,OAAc,YAA2B;AACpD,WAAO,iBAAkB,OAAO,SAAS,CAAE,WAAW,SAAU,GAAG;AAAA,MAClE,SAAS;AAAA,MACT,YAAY;AAAA,IACb,CAAE;AAAA,EACH;AACD;AAEA,IAAO,kBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
// packages/style-engine/src/styles/typography/index.ts
|
|
1
2
|
import { generateRule } from "../utils";
|
|
2
|
-
|
|
3
|
+
var fontSize = {
|
|
3
4
|
name: "fontSize",
|
|
4
5
|
generate: (style, options) => {
|
|
5
6
|
return generateRule(
|
|
@@ -10,7 +11,7 @@ const fontSize = {
|
|
|
10
11
|
);
|
|
11
12
|
}
|
|
12
13
|
};
|
|
13
|
-
|
|
14
|
+
var fontStyle = {
|
|
14
15
|
name: "fontStyle",
|
|
15
16
|
generate: (style, options) => {
|
|
16
17
|
return generateRule(
|
|
@@ -21,7 +22,7 @@ const fontStyle = {
|
|
|
21
22
|
);
|
|
22
23
|
}
|
|
23
24
|
};
|
|
24
|
-
|
|
25
|
+
var fontWeight = {
|
|
25
26
|
name: "fontWeight",
|
|
26
27
|
generate: (style, options) => {
|
|
27
28
|
return generateRule(
|
|
@@ -32,7 +33,7 @@ const fontWeight = {
|
|
|
32
33
|
);
|
|
33
34
|
}
|
|
34
35
|
};
|
|
35
|
-
|
|
36
|
+
var fontFamily = {
|
|
36
37
|
name: "fontFamily",
|
|
37
38
|
generate: (style, options) => {
|
|
38
39
|
return generateRule(
|
|
@@ -43,7 +44,7 @@ const fontFamily = {
|
|
|
43
44
|
);
|
|
44
45
|
}
|
|
45
46
|
};
|
|
46
|
-
|
|
47
|
+
var letterSpacing = {
|
|
47
48
|
name: "letterSpacing",
|
|
48
49
|
generate: (style, options) => {
|
|
49
50
|
return generateRule(
|
|
@@ -54,7 +55,7 @@ const letterSpacing = {
|
|
|
54
55
|
);
|
|
55
56
|
}
|
|
56
57
|
};
|
|
57
|
-
|
|
58
|
+
var lineHeight = {
|
|
58
59
|
name: "lineHeight",
|
|
59
60
|
generate: (style, options) => {
|
|
60
61
|
return generateRule(
|
|
@@ -65,7 +66,7 @@ const lineHeight = {
|
|
|
65
66
|
);
|
|
66
67
|
}
|
|
67
68
|
};
|
|
68
|
-
|
|
69
|
+
var textColumns = {
|
|
69
70
|
name: "textColumns",
|
|
70
71
|
generate: (style, options) => {
|
|
71
72
|
return generateRule(
|
|
@@ -76,7 +77,7 @@ const textColumns = {
|
|
|
76
77
|
);
|
|
77
78
|
}
|
|
78
79
|
};
|
|
79
|
-
|
|
80
|
+
var textDecoration = {
|
|
80
81
|
name: "textDecoration",
|
|
81
82
|
generate: (style, options) => {
|
|
82
83
|
return generateRule(
|
|
@@ -87,7 +88,7 @@ const textDecoration = {
|
|
|
87
88
|
);
|
|
88
89
|
}
|
|
89
90
|
};
|
|
90
|
-
|
|
91
|
+
var textTransform = {
|
|
91
92
|
name: "textTransform",
|
|
92
93
|
generate: (style, options) => {
|
|
93
94
|
return generateRule(
|
|
@@ -98,7 +99,7 @@ const textTransform = {
|
|
|
98
99
|
);
|
|
99
100
|
}
|
|
100
101
|
};
|
|
101
|
-
|
|
102
|
+
var writingMode = {
|
|
102
103
|
name: "writingMode",
|
|
103
104
|
generate: (style, options) => {
|
|
104
105
|
return generateRule(
|