(node: AtRule)
| 6077 | ] |
| 6078 | |
| 6079 | export function createCssUtility(node: AtRule) { |
| 6080 | // Allow escaped characters in the name for compatibility with formatters and |
| 6081 | // other parsers, to ensure valid CSS syntax. E.g.: `@utility foo-1\/2`. |
| 6082 | // |
| 6083 | // Note: the actual utility will be `foo-1/2` |
| 6084 | let name = unescape(node.params) |
| 6085 | |
| 6086 | // Functional utilities. E.g.: `tab-size-*` |
| 6087 | if (isValidFunctionalUtilityName(name)) { |
| 6088 | // API: |
| 6089 | // |
| 6090 | // - `--value('literal')` resolves a literal named value |
| 6091 | // - `--value(number)` resolves a bare value of type number |
| 6092 | // - `--value([number])` resolves an arbitrary value of type number |
| 6093 | // - `--value(--color)` resolves a theme value in the `color` namespace |
| 6094 | // - `--value(--default(4))` resolves to a default value when only the |
| 6095 | // root of the functional utility was used. |
| 6096 | // - `--value(number, [number])` resolves a bare value of type number or an |
| 6097 | // arbitrary value of type number in order. |
| 6098 | // |
| 6099 | // Rules: |
| 6100 | // |
| 6101 | // - If `--value(…)` does not resolve to a valid value, the declaration is |
| 6102 | // removed. |
| 6103 | // - If a `--value(ratio)` resolves, the `--modifier(…)` cannot be used. |
| 6104 | // - If a candidate looks like `foo-2/3`, then the `--value(ratio)` should |
| 6105 | // be used OR the `--value(…)` and `--modifier(…)` must be used. But not |
| 6106 | // both. |
| 6107 | // - All parts of the candidate must resolve, otherwise it's not a valid |
| 6108 | // utility. E.g.:` |
| 6109 | // ``` |
| 6110 | // @utility foo-* { |
| 6111 | // test: --value(number) |
| 6112 | // } |
| 6113 | // ``` |
| 6114 | // If you then use `foo-1/2`, this is invalid, because the modifier is not used. |
| 6115 | |
| 6116 | return (designSystem: DesignSystem) => { |
| 6117 | let storage = { |
| 6118 | '--value': { |
| 6119 | usedSpacingInteger: false, |
| 6120 | usedSpacingNumber: false, |
| 6121 | themeKeys: new Set<`--${string}`>(), |
| 6122 | literals: new Set<string>(), |
| 6123 | }, |
| 6124 | '--modifier': { |
| 6125 | usedSpacingInteger: false, |
| 6126 | usedSpacingNumber: false, |
| 6127 | themeKeys: new Set<`--${string}`>(), |
| 6128 | literals: new Set<string>(), |
| 6129 | }, |
| 6130 | } |
| 6131 | |
| 6132 | // Pre-process the AST to make it easier to work with. |
| 6133 | // |
| 6134 | // - Normalize theme values used in `--value(…)` and `--modifier(…)` |
| 6135 | // functions. |
| 6136 | // - Track information for suggestions |
no test coverage detected