@baukit/ui-tokens 0.1.2 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +78 -6
- package/dist/contrast.d.ts +42 -0
- package/dist/contrast.d.ts.map +1 -1
- package/dist/contrast.js +183 -6
- package/dist/contrast.js.map +1 -1
- package/dist/example.d.ts +66 -0
- package/dist/example.d.ts.map +1 -1
- package/dist/example.js +25 -0
- package/dist/example.js.map +1 -1
- package/dist/layout.d.ts +4 -0
- package/dist/layout.d.ts.map +1 -1
- package/dist/layout.js +18 -0
- package/dist/layout.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -15,6 +15,78 @@ Colors are opaque `#RGB` or `#RRGGBB` sRGB values with light and dark variants.
|
|
|
15
15
|
|
|
16
16
|
Validation is handwritten rather than Zod-based: the schema is small, this keeps production dependencies at zero, and it enables diagnostics tailored to semantic token paths.
|
|
17
17
|
|
|
18
|
+
## Work with colors
|
|
19
|
+
|
|
20
|
+
The color helpers accept three- or six-digit hexadecimal sRGB colors, with an
|
|
21
|
+
optional `#`. Normalized and calculated colors use lowercase `#rrggbb` form.
|
|
22
|
+
|
|
23
|
+
```ts
|
|
24
|
+
import {
|
|
25
|
+
blendColors,
|
|
26
|
+
chooseReadableForeground,
|
|
27
|
+
hexToRgb,
|
|
28
|
+
normalizeHexColor,
|
|
29
|
+
rgbToHex,
|
|
30
|
+
} from '@baukit/ui-tokens';
|
|
31
|
+
|
|
32
|
+
normalizeHexColor('09C'); // '#0099cc'
|
|
33
|
+
hexToRgb('#0099cc'); // { r: 0, g: 153, b: 204 }
|
|
34
|
+
rgbToHex({ r: 0, g: 153, b: 204 }); // '#0099cc'
|
|
35
|
+
blendColors('#ffffff', '#000000', 0.25); // '#404040'
|
|
36
|
+
|
|
37
|
+
const foreground = chooseReadableForeground('#005fcc', ['#ffffff', '#111111'], 4.5);
|
|
38
|
+
// { foreground: '#ffffff', ratio: 5.98..., meetsThreshold: true }
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
`blendColors` clamps its ratio to `[0, 1]`. `chooseReadableForeground` returns
|
|
42
|
+
the first candidate that meets the threshold. If none passes, it returns the
|
|
43
|
+
candidate with the highest ratio and sets `meetsThreshold` to `false`.
|
|
44
|
+
|
|
45
|
+
## Check a semantic contrast matrix
|
|
46
|
+
|
|
47
|
+
`DEFAULT_SEMANTIC_CONTRAST_REQUIREMENTS` defines these role paths:
|
|
48
|
+
|
|
49
|
+
- `color.background.primary` and `color.background.elevated`
|
|
50
|
+
- `color.text.primary` and `color.text.muted`
|
|
51
|
+
- `color.border.primary` and `color.focus.ring`
|
|
52
|
+
- `color.action.primary`, `color.action.onPrimary`, `color.action.secondary`, and `color.action.onSecondary`
|
|
53
|
+
- `color.status.success`, `color.status.warning`, `color.status.danger`, and their `onSuccess`, `onWarning`, and `onDanger` foregrounds
|
|
54
|
+
|
|
55
|
+
Text and labeled foregrounds require 4.5:1. Borders and focus rings require
|
|
56
|
+
3:1 against both background roles. The checker tests every requirement in the
|
|
57
|
+
light and dark variants and returns every failure.
|
|
58
|
+
|
|
59
|
+
```ts
|
|
60
|
+
import {
|
|
61
|
+
checkSemanticContrastMatrix,
|
|
62
|
+
DEFAULT_SEMANTIC_CONTRAST_REQUIREMENTS,
|
|
63
|
+
} from '@baukit/ui-tokens';
|
|
64
|
+
|
|
65
|
+
const failures = checkSemanticContrastMatrix(tokens, [
|
|
66
|
+
...DEFAULT_SEMANTIC_CONTRAST_REQUIREMENTS,
|
|
67
|
+
{
|
|
68
|
+
foregroundRole: 'color.chart.label',
|
|
69
|
+
backgroundRole: 'color.chart.background',
|
|
70
|
+
minimumRatio: 4.5,
|
|
71
|
+
},
|
|
72
|
+
]);
|
|
73
|
+
```
|
|
74
|
+
|
|
75
|
+
Pass a different list to replace the defaults. A missing role or a minimum
|
|
76
|
+
outside the possible WCAG range of 1 through 21 throws a descriptive error.
|
|
77
|
+
|
|
78
|
+
## Calculate vertical layout
|
|
79
|
+
|
|
80
|
+
Products supply every dimension and threshold. Both functions reject negative
|
|
81
|
+
or non-finite values.
|
|
82
|
+
|
|
83
|
+
```ts
|
|
84
|
+
import { getUsableContentHeight, isShortViewport } from '@baukit/ui-tokens';
|
|
85
|
+
|
|
86
|
+
getUsableContentHeight(720, 112, 128); // 480
|
|
87
|
+
isShortViewport(600, productLayout.shortViewportHeight); // true
|
|
88
|
+
```
|
|
89
|
+
|
|
18
90
|
## Compile
|
|
19
91
|
|
|
20
92
|
```ts
|
|
@@ -67,12 +139,12 @@ restriction keeps route names, test ids, and ordinary prose off the report.
|
|
|
67
139
|
|
|
68
140
|
Options:
|
|
69
141
|
|
|
70
|
-
| Option
|
|
71
|
-
|
|
|
72
|
-
| `allowedFiles`
|
|
73
|
-
| `allowedValues`
|
|
74
|
-
| `additionalStyleProperties` | `[]`
|
|
75
|
-
| `reportKeywords`
|
|
142
|
+
| Option | Default | Meaning |
|
|
143
|
+
| --------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------ |
|
|
144
|
+
| `allowedFiles` | `[]` | Glob-like paths that may declare raw colors. `*` matches inside a path segment, `**` across segments. Put the token definition here. |
|
|
145
|
+
| `allowedValues` | `transparent`, `currentColor`, `inherit`, `none` | Literals allowed everywhere. Entries add to the defaults. |
|
|
146
|
+
| `additionalStyleProperties` | `[]` | Extra property or attribute names treated as style-like. |
|
|
147
|
+
| `reportKeywords` | `true` | Set to `false` to report only hex and functional notations. |
|
|
76
148
|
|
|
77
149
|
## Boundaries
|
|
78
150
|
|
package/dist/contrast.d.ts
CHANGED
|
@@ -1,5 +1,27 @@
|
|
|
1
1
|
import type { DesignTokens } from './schema.js';
|
|
2
2
|
export type ThemeName = 'light' | 'dark';
|
|
3
|
+
export interface RgbColor {
|
|
4
|
+
readonly r: number;
|
|
5
|
+
readonly g: number;
|
|
6
|
+
readonly b: number;
|
|
7
|
+
}
|
|
8
|
+
export interface ReadableForegroundResult {
|
|
9
|
+
readonly foreground: string;
|
|
10
|
+
readonly ratio: number;
|
|
11
|
+
readonly meetsThreshold: boolean;
|
|
12
|
+
}
|
|
13
|
+
export interface SemanticContrastRequirement {
|
|
14
|
+
readonly foregroundRole: string;
|
|
15
|
+
readonly backgroundRole: string;
|
|
16
|
+
readonly minimumRatio: number;
|
|
17
|
+
}
|
|
18
|
+
export interface SemanticContrastViolation {
|
|
19
|
+
readonly foregroundRole: string;
|
|
20
|
+
readonly backgroundRole: string;
|
|
21
|
+
readonly theme: ThemeName;
|
|
22
|
+
readonly achievedRatio: number;
|
|
23
|
+
readonly minimumRatio: number;
|
|
24
|
+
}
|
|
3
25
|
export interface ContrastViolation {
|
|
4
26
|
readonly foreground: string;
|
|
5
27
|
readonly background: string;
|
|
@@ -7,10 +29,30 @@ export interface ContrastViolation {
|
|
|
7
29
|
readonly ratio: number;
|
|
8
30
|
readonly requiredRatio: 3 | 4.5;
|
|
9
31
|
}
|
|
32
|
+
/**
|
|
33
|
+
* Default role paths and contrast rules for product palettes. Products can
|
|
34
|
+
* extend this list or replace it when their semantic token model differs.
|
|
35
|
+
*/
|
|
36
|
+
export declare const DEFAULT_SEMANTIC_CONTRAST_REQUIREMENTS: readonly SemanticContrastRequirement[];
|
|
37
|
+
/** Normalizes an RGB or RRGGBB hexadecimal color to lowercase #rrggbb. */
|
|
38
|
+
export declare function normalizeHexColor(color: string): string;
|
|
39
|
+
/** Converts a supported hexadecimal color to integer sRGB channels. */
|
|
40
|
+
export declare function hexToRgb(color: string): RgbColor;
|
|
41
|
+
/** Converts integer sRGB channels to a lowercase six-digit hexadecimal color. */
|
|
42
|
+
export declare function rgbToHex(color: RgbColor): string;
|
|
43
|
+
/** Blends the first opaque color over the second with a ratio clamped to [0, 1]. */
|
|
44
|
+
export declare function blendColors(foreground: string, background: string, foregroundRatio: number): string;
|
|
10
45
|
/** WCAG 2.x relative luminance for an opaque hexadecimal sRGB color. */
|
|
11
46
|
export declare function relativeLuminance(color: string): number;
|
|
12
47
|
/** WCAG contrast ratio, always between 1 and 21 inclusive. */
|
|
13
48
|
export declare function contrastRatio(foreground: string, background: string): number;
|
|
49
|
+
/**
|
|
50
|
+
* Returns the first candidate that meets the threshold. If none does, returns
|
|
51
|
+
* the candidate with the highest ratio and sets `meetsThreshold` to false.
|
|
52
|
+
*/
|
|
53
|
+
export declare function chooseReadableForeground(background: string, candidates: readonly string[], minimumRatio: number): ReadableForegroundResult;
|
|
14
54
|
/** Checks every declared pair in both themes and returns only failures. */
|
|
15
55
|
export declare function checkContrast(tokens: DesignTokens): ContrastViolation[];
|
|
56
|
+
/** Checks every semantic requirement in both themes and returns every failure. */
|
|
57
|
+
export declare function checkSemanticContrastMatrix(tokens: DesignTokens, requirements: readonly SemanticContrastRequirement[]): SemanticContrastViolation[];
|
|
16
58
|
//# sourceMappingURL=contrast.d.ts.map
|
package/dist/contrast.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"contrast.d.ts","sourceRoot":"","sources":["../src/contrast.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAc,MAAM,aAAa,CAAC;AAE5D,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;AAEzC,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,aAAa,EAAE,CAAC,GAAG,GAAG,CAAC;CACjC;
|
|
1
|
+
{"version":3,"file":"contrast.d.ts","sourceRoot":"","sources":["../src/contrast.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAc,MAAM,aAAa,CAAC;AAE5D,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;AAEzC,MAAM,WAAW,QAAQ;IACvB,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,wBAAwB;IACvC,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,cAAc,EAAE,OAAO,CAAC;CAClC;AAED,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;CAC/B;AAED,MAAM,WAAW,yBAAyB;IACxC,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,aAAa,EAAE,MAAM,CAAC;IAC/B,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;CAC/B;AAED,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,aAAa,EAAE,CAAC,GAAG,GAAG,CAAC;CACjC;AAED;;;GAGG;AACH,eAAO,MAAM,sCAAsC,EAAE,SAAS,2BAA2B,EAkExF,CAAC;AAEF,0EAA0E;AAC1E,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAavD;AAED,uEAAuE;AACvE,wBAAgB,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,QAAQ,CAOhD;AAUD,iFAAiF;AACjF,wBAAgB,QAAQ,CAAC,KAAK,EAAE,QAAQ,GAAG,MAAM,CAOhD;AAED,oFAAoF;AACpF,wBAAgB,WAAW,CACzB,UAAU,EAAE,MAAM,EAClB,UAAU,EAAE,MAAM,EAClB,eAAe,EAAE,MAAM,GACtB,MAAM,CAYR;AAOD,wEAAwE;AACxE,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAGvD;AAED,8DAA8D;AAC9D,wBAAgB,aAAa,CAAC,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,MAAM,CAM5E;AAUD;;;GAGG;AACH,wBAAgB,wBAAwB,CACtC,UAAU,EAAE,MAAM,EAClB,UAAU,EAAE,SAAS,MAAM,EAAE,EAC7B,YAAY,EAAE,MAAM,GACnB,wBAAwB,CAsB1B;AA8BD,2EAA2E;AAC3E,wBAAgB,aAAa,CAAC,MAAM,EAAE,YAAY,GAAG,iBAAiB,EAAE,CAoBvE;AAED,kFAAkF;AAClF,wBAAgB,2BAA2B,CACzC,MAAM,EAAE,YAAY,EACpB,YAAY,EAAE,SAAS,2BAA2B,EAAE,GACnD,yBAAyB,EAAE,CAoB7B"}
|
package/dist/contrast.js
CHANGED
|
@@ -1,12 +1,122 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
/**
|
|
2
|
+
* Default role paths and contrast rules for product palettes. Products can
|
|
3
|
+
* extend this list or replace it when their semantic token model differs.
|
|
4
|
+
*/
|
|
5
|
+
export const DEFAULT_SEMANTIC_CONTRAST_REQUIREMENTS = [
|
|
6
|
+
{
|
|
7
|
+
foregroundRole: 'color.text.primary',
|
|
8
|
+
backgroundRole: 'color.background.primary',
|
|
9
|
+
minimumRatio: 4.5,
|
|
10
|
+
},
|
|
11
|
+
{
|
|
12
|
+
foregroundRole: 'color.text.primary',
|
|
13
|
+
backgroundRole: 'color.background.elevated',
|
|
14
|
+
minimumRatio: 4.5,
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
foregroundRole: 'color.text.muted',
|
|
18
|
+
backgroundRole: 'color.background.primary',
|
|
19
|
+
minimumRatio: 4.5,
|
|
20
|
+
},
|
|
21
|
+
{
|
|
22
|
+
foregroundRole: 'color.text.muted',
|
|
23
|
+
backgroundRole: 'color.background.elevated',
|
|
24
|
+
minimumRatio: 4.5,
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
foregroundRole: 'color.border.primary',
|
|
28
|
+
backgroundRole: 'color.background.primary',
|
|
29
|
+
minimumRatio: 3,
|
|
30
|
+
},
|
|
31
|
+
{
|
|
32
|
+
foregroundRole: 'color.border.primary',
|
|
33
|
+
backgroundRole: 'color.background.elevated',
|
|
34
|
+
minimumRatio: 3,
|
|
35
|
+
},
|
|
36
|
+
{
|
|
37
|
+
foregroundRole: 'color.focus.ring',
|
|
38
|
+
backgroundRole: 'color.background.primary',
|
|
39
|
+
minimumRatio: 3,
|
|
40
|
+
},
|
|
41
|
+
{
|
|
42
|
+
foregroundRole: 'color.focus.ring',
|
|
43
|
+
backgroundRole: 'color.background.elevated',
|
|
44
|
+
minimumRatio: 3,
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
foregroundRole: 'color.action.onPrimary',
|
|
48
|
+
backgroundRole: 'color.action.primary',
|
|
49
|
+
minimumRatio: 4.5,
|
|
50
|
+
},
|
|
51
|
+
{
|
|
52
|
+
foregroundRole: 'color.action.onSecondary',
|
|
53
|
+
backgroundRole: 'color.action.secondary',
|
|
54
|
+
minimumRatio: 4.5,
|
|
55
|
+
},
|
|
56
|
+
{
|
|
57
|
+
foregroundRole: 'color.status.onSuccess',
|
|
58
|
+
backgroundRole: 'color.status.success',
|
|
59
|
+
minimumRatio: 4.5,
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
foregroundRole: 'color.status.onWarning',
|
|
63
|
+
backgroundRole: 'color.status.warning',
|
|
64
|
+
minimumRatio: 4.5,
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
foregroundRole: 'color.status.onDanger',
|
|
68
|
+
backgroundRole: 'color.status.danger',
|
|
69
|
+
minimumRatio: 4.5,
|
|
70
|
+
},
|
|
71
|
+
];
|
|
72
|
+
/** Normalizes an RGB or RRGGBB hexadecimal color to lowercase #rrggbb. */
|
|
73
|
+
export function normalizeHexColor(color) {
|
|
74
|
+
const match = /^#?([\dA-Fa-f]{3}|[\dA-Fa-f]{6})$/u.exec(color);
|
|
3
75
|
if (match?.[1] === undefined) {
|
|
4
|
-
throw new TypeError(`Unsupported color ${color}; expected
|
|
76
|
+
throw new TypeError(`Unsupported hexadecimal color ${JSON.stringify(color)}; expected RGB or RRGGBB with an optional #.`);
|
|
5
77
|
}
|
|
6
78
|
const digits = match[1];
|
|
7
|
-
|
|
79
|
+
const expanded = digits.length === 3
|
|
8
80
|
? `${digits.charAt(0)}${digits.charAt(0)}${digits.charAt(1)}${digits.charAt(1)}${digits.charAt(2)}${digits.charAt(2)}`
|
|
9
81
|
: digits;
|
|
82
|
+
return `#${expanded.toLowerCase()}`;
|
|
83
|
+
}
|
|
84
|
+
/** Converts a supported hexadecimal color to integer sRGB channels. */
|
|
85
|
+
export function hexToRgb(color) {
|
|
86
|
+
const normalized = normalizeHexColor(color);
|
|
87
|
+
return {
|
|
88
|
+
r: Number.parseInt(normalized.slice(1, 3), 16),
|
|
89
|
+
g: Number.parseInt(normalized.slice(3, 5), 16),
|
|
90
|
+
b: Number.parseInt(normalized.slice(5, 7), 16),
|
|
91
|
+
};
|
|
92
|
+
}
|
|
93
|
+
function validateRgbChannel(name, value) {
|
|
94
|
+
if (!Number.isInteger(value) || value < 0 || value > 255) {
|
|
95
|
+
throw new RangeError(`RGB channel ${name} must be an integer between 0 and 255; received ${String(value)}.`);
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
/** Converts integer sRGB channels to a lowercase six-digit hexadecimal color. */
|
|
99
|
+
export function rgbToHex(color) {
|
|
100
|
+
validateRgbChannel('r', color.r);
|
|
101
|
+
validateRgbChannel('g', color.g);
|
|
102
|
+
validateRgbChannel('b', color.b);
|
|
103
|
+
return `#${[color.r, color.g, color.b]
|
|
104
|
+
.map((value) => value.toString(16).padStart(2, '0'))
|
|
105
|
+
.join('')}`;
|
|
106
|
+
}
|
|
107
|
+
/** Blends the first opaque color over the second with a ratio clamped to [0, 1]. */
|
|
108
|
+
export function blendColors(foreground, background, foregroundRatio) {
|
|
109
|
+
if (!Number.isFinite(foregroundRatio)) {
|
|
110
|
+
throw new RangeError(`Blend ratio must be finite; received ${String(foregroundRatio)}.`);
|
|
111
|
+
}
|
|
112
|
+
const ratio = Math.max(0, Math.min(1, foregroundRatio));
|
|
113
|
+
const foregroundRgb = hexToRgb(foreground);
|
|
114
|
+
const backgroundRgb = hexToRgb(background);
|
|
115
|
+
return rgbToHex({
|
|
116
|
+
r: Math.round(foregroundRgb.r * ratio + backgroundRgb.r * (1 - ratio)),
|
|
117
|
+
g: Math.round(foregroundRgb.g * ratio + backgroundRgb.g * (1 - ratio)),
|
|
118
|
+
b: Math.round(foregroundRgb.b * ratio + backgroundRgb.b * (1 - ratio)),
|
|
119
|
+
});
|
|
10
120
|
}
|
|
11
121
|
function channel(hex, offset) {
|
|
12
122
|
const value = Number.parseInt(hex.slice(offset, offset + 2), 16) / 255;
|
|
@@ -14,7 +124,7 @@ function channel(hex, offset) {
|
|
|
14
124
|
}
|
|
15
125
|
/** WCAG 2.x relative luminance for an opaque hexadecimal sRGB color. */
|
|
16
126
|
export function relativeLuminance(color) {
|
|
17
|
-
const hex =
|
|
127
|
+
const hex = normalizeHexColor(color).slice(1);
|
|
18
128
|
return 0.2126 * channel(hex, 0) + 0.7152 * channel(hex, 2) + 0.0722 * channel(hex, 4);
|
|
19
129
|
}
|
|
20
130
|
/** WCAG contrast ratio, always between 1 and 21 inclusive. */
|
|
@@ -25,13 +135,58 @@ export function contrastRatio(foreground, background) {
|
|
|
25
135
|
const darker = Math.min(foregroundLuminance, backgroundLuminance);
|
|
26
136
|
return (lighter + 0.05) / (darker + 0.05);
|
|
27
137
|
}
|
|
138
|
+
function validateMinimumRatio(minimumRatio) {
|
|
139
|
+
if (!Number.isFinite(minimumRatio) || minimumRatio < 1 || minimumRatio > 21) {
|
|
140
|
+
throw new RangeError(`Minimum contrast ratio must be finite and between 1 and 21; received ${String(minimumRatio)}.`);
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
/**
|
|
144
|
+
* Returns the first candidate that meets the threshold. If none does, returns
|
|
145
|
+
* the candidate with the highest ratio and sets `meetsThreshold` to false.
|
|
146
|
+
*/
|
|
147
|
+
export function chooseReadableForeground(background, candidates, minimumRatio) {
|
|
148
|
+
validateMinimumRatio(minimumRatio);
|
|
149
|
+
const normalizedBackground = normalizeHexColor(background);
|
|
150
|
+
const normalizedCandidates = candidates.map((candidate) => normalizeHexColor(candidate));
|
|
151
|
+
const firstCandidate = normalizedCandidates[0];
|
|
152
|
+
if (firstCandidate === undefined) {
|
|
153
|
+
throw new RangeError('Readable foreground candidates must contain at least one color.');
|
|
154
|
+
}
|
|
155
|
+
const evaluate = (foreground) => {
|
|
156
|
+
const ratio = contrastRatio(foreground, normalizedBackground);
|
|
157
|
+
return { foreground, ratio, meetsThreshold: ratio >= minimumRatio };
|
|
158
|
+
};
|
|
159
|
+
let best = evaluate(firstCandidate);
|
|
160
|
+
if (best.meetsThreshold)
|
|
161
|
+
return best;
|
|
162
|
+
for (const candidate of normalizedCandidates.slice(1)) {
|
|
163
|
+
const result = evaluate(candidate);
|
|
164
|
+
if (result.meetsThreshold)
|
|
165
|
+
return result;
|
|
166
|
+
if (result.ratio > best.ratio)
|
|
167
|
+
best = result;
|
|
168
|
+
}
|
|
169
|
+
return best;
|
|
170
|
+
}
|
|
28
171
|
function colorAt(tokens, path) {
|
|
29
172
|
const segments = path.split('.');
|
|
30
|
-
segments.shift()
|
|
173
|
+
if (segments.shift() !== 'color' || segments.length === 0) {
|
|
174
|
+
throw new TypeError(`Semantic color role ${JSON.stringify(path)} must start with "color.".`);
|
|
175
|
+
}
|
|
31
176
|
let current = tokens.color;
|
|
32
177
|
for (const segment of segments) {
|
|
178
|
+
if (current === null || typeof current !== 'object' || Array.isArray(current)) {
|
|
179
|
+
throw new TypeError(`Semantic color role ${JSON.stringify(path)} does not reference a color token.`);
|
|
180
|
+
}
|
|
33
181
|
current = current[segment];
|
|
34
182
|
}
|
|
183
|
+
if (current === null ||
|
|
184
|
+
typeof current !== 'object' ||
|
|
185
|
+
Array.isArray(current) ||
|
|
186
|
+
typeof current['light'] !== 'string' ||
|
|
187
|
+
typeof current['dark'] !== 'string') {
|
|
188
|
+
throw new TypeError(`Semantic color role ${JSON.stringify(path)} does not reference a color token.`);
|
|
189
|
+
}
|
|
35
190
|
return current;
|
|
36
191
|
}
|
|
37
192
|
/** Checks every declared pair in both themes and returns only failures. */
|
|
@@ -56,4 +211,26 @@ export function checkContrast(tokens) {
|
|
|
56
211
|
}
|
|
57
212
|
return violations;
|
|
58
213
|
}
|
|
214
|
+
/** Checks every semantic requirement in both themes and returns every failure. */
|
|
215
|
+
export function checkSemanticContrastMatrix(tokens, requirements) {
|
|
216
|
+
const violations = [];
|
|
217
|
+
for (const requirement of requirements) {
|
|
218
|
+
validateMinimumRatio(requirement.minimumRatio);
|
|
219
|
+
const foreground = colorAt(tokens, requirement.foregroundRole);
|
|
220
|
+
const background = colorAt(tokens, requirement.backgroundRole);
|
|
221
|
+
for (const theme of ['light', 'dark']) {
|
|
222
|
+
const achievedRatio = contrastRatio(foreground[theme], background[theme]);
|
|
223
|
+
if (achievedRatio < requirement.minimumRatio) {
|
|
224
|
+
violations.push({
|
|
225
|
+
foregroundRole: requirement.foregroundRole,
|
|
226
|
+
backgroundRole: requirement.backgroundRole,
|
|
227
|
+
theme,
|
|
228
|
+
achievedRatio,
|
|
229
|
+
minimumRatio: requirement.minimumRatio,
|
|
230
|
+
});
|
|
231
|
+
}
|
|
232
|
+
}
|
|
233
|
+
}
|
|
234
|
+
return violations;
|
|
235
|
+
}
|
|
59
236
|
//# sourceMappingURL=contrast.js.map
|
package/dist/contrast.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"contrast.js","sourceRoot":"","sources":["../src/contrast.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"contrast.js","sourceRoot":"","sources":["../src/contrast.ts"],"names":[],"mappings":"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"}
|
package/dist/example.d.ts
CHANGED
|
@@ -6,6 +6,10 @@ export declare const exampleTokens: {
|
|
|
6
6
|
readonly light: "#ffffff";
|
|
7
7
|
readonly dark: "#111111";
|
|
8
8
|
};
|
|
9
|
+
readonly elevated: {
|
|
10
|
+
readonly light: "#f5f5f5";
|
|
11
|
+
readonly dark: "#222222";
|
|
12
|
+
};
|
|
9
13
|
readonly accent: {
|
|
10
14
|
readonly light: "#005fcc";
|
|
11
15
|
readonly dark: "#66aaff";
|
|
@@ -16,11 +20,71 @@ export declare const exampleTokens: {
|
|
|
16
20
|
readonly light: "#111111";
|
|
17
21
|
readonly dark: "#ffffff";
|
|
18
22
|
};
|
|
23
|
+
readonly muted: {
|
|
24
|
+
readonly light: "#595959";
|
|
25
|
+
readonly dark: "#b3b3b3";
|
|
26
|
+
};
|
|
19
27
|
readonly onAccent: {
|
|
20
28
|
readonly light: "#ffffff";
|
|
21
29
|
readonly dark: "#111111";
|
|
22
30
|
};
|
|
23
31
|
};
|
|
32
|
+
readonly border: {
|
|
33
|
+
readonly primary: {
|
|
34
|
+
readonly light: "#767676";
|
|
35
|
+
readonly dark: "#888888";
|
|
36
|
+
};
|
|
37
|
+
};
|
|
38
|
+
readonly focus: {
|
|
39
|
+
readonly ring: {
|
|
40
|
+
readonly light: "#005fcc";
|
|
41
|
+
readonly dark: "#66aaff";
|
|
42
|
+
};
|
|
43
|
+
};
|
|
44
|
+
readonly action: {
|
|
45
|
+
readonly primary: {
|
|
46
|
+
readonly light: "#005fcc";
|
|
47
|
+
readonly dark: "#66aaff";
|
|
48
|
+
};
|
|
49
|
+
readonly onPrimary: {
|
|
50
|
+
readonly light: "#ffffff";
|
|
51
|
+
readonly dark: "#111111";
|
|
52
|
+
};
|
|
53
|
+
readonly secondary: {
|
|
54
|
+
readonly light: "#5f3dc4";
|
|
55
|
+
readonly dark: "#b197fc";
|
|
56
|
+
};
|
|
57
|
+
readonly onSecondary: {
|
|
58
|
+
readonly light: "#ffffff";
|
|
59
|
+
readonly dark: "#111111";
|
|
60
|
+
};
|
|
61
|
+
};
|
|
62
|
+
readonly status: {
|
|
63
|
+
readonly success: {
|
|
64
|
+
readonly light: "#137333";
|
|
65
|
+
readonly dark: "#65d48b";
|
|
66
|
+
};
|
|
67
|
+
readonly onSuccess: {
|
|
68
|
+
readonly light: "#ffffff";
|
|
69
|
+
readonly dark: "#111111";
|
|
70
|
+
};
|
|
71
|
+
readonly warning: {
|
|
72
|
+
readonly light: "#8a4b00";
|
|
73
|
+
readonly dark: "#ffd166";
|
|
74
|
+
};
|
|
75
|
+
readonly onWarning: {
|
|
76
|
+
readonly light: "#ffffff";
|
|
77
|
+
readonly dark: "#111111";
|
|
78
|
+
};
|
|
79
|
+
readonly danger: {
|
|
80
|
+
readonly light: "#b3261e";
|
|
81
|
+
readonly dark: "#ff8a80";
|
|
82
|
+
};
|
|
83
|
+
readonly onDanger: {
|
|
84
|
+
readonly light: "#ffffff";
|
|
85
|
+
readonly dark: "#111111";
|
|
86
|
+
};
|
|
87
|
+
};
|
|
24
88
|
};
|
|
25
89
|
readonly typography: {
|
|
26
90
|
readonly family: {
|
|
@@ -67,4 +131,6 @@ export declare const exampleTokens: {
|
|
|
67
131
|
readonly background: "color.background.accent";
|
|
68
132
|
}];
|
|
69
133
|
};
|
|
134
|
+
/** Example result for the package's default semantic contrast requirements. */
|
|
135
|
+
export declare const exampleContrastViolations: import("./contrast.js").SemanticContrastViolation[];
|
|
70
136
|
//# sourceMappingURL=example.d.ts.map
|
package/dist/example.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"example.d.ts","sourceRoot":"","sources":["../src/example.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"example.d.ts","sourceRoot":"","sources":["../src/example.ts"],"names":[],"mappings":"AAGA,wFAAwF;AACxF,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkDO,CAAC;AAElC,+EAA+E;AAC/E,eAAO,MAAM,yBAAyB,qDAGrC,CAAC"}
|
package/dist/example.js
CHANGED
|
@@ -1,14 +1,37 @@
|
|
|
1
|
+
import { checkSemanticContrastMatrix, DEFAULT_SEMANTIC_CONTRAST_REQUIREMENTS } from './contrast.js';
|
|
1
2
|
/** A deliberately small fixture that demonstrates the pipeline, not a design system. */
|
|
2
3
|
export const exampleTokens = {
|
|
3
4
|
color: {
|
|
4
5
|
background: {
|
|
5
6
|
primary: { light: '#ffffff', dark: '#111111' },
|
|
7
|
+
elevated: { light: '#f5f5f5', dark: '#222222' },
|
|
6
8
|
accent: { light: '#005fcc', dark: '#66aaff' },
|
|
7
9
|
},
|
|
8
10
|
text: {
|
|
9
11
|
primary: { light: '#111111', dark: '#ffffff' },
|
|
12
|
+
muted: { light: '#595959', dark: '#b3b3b3' },
|
|
10
13
|
onAccent: { light: '#ffffff', dark: '#111111' },
|
|
11
14
|
},
|
|
15
|
+
border: {
|
|
16
|
+
primary: { light: '#767676', dark: '#888888' },
|
|
17
|
+
},
|
|
18
|
+
focus: {
|
|
19
|
+
ring: { light: '#005fcc', dark: '#66aaff' },
|
|
20
|
+
},
|
|
21
|
+
action: {
|
|
22
|
+
primary: { light: '#005fcc', dark: '#66aaff' },
|
|
23
|
+
onPrimary: { light: '#ffffff', dark: '#111111' },
|
|
24
|
+
secondary: { light: '#5f3dc4', dark: '#b197fc' },
|
|
25
|
+
onSecondary: { light: '#ffffff', dark: '#111111' },
|
|
26
|
+
},
|
|
27
|
+
status: {
|
|
28
|
+
success: { light: '#137333', dark: '#65d48b' },
|
|
29
|
+
onSuccess: { light: '#ffffff', dark: '#111111' },
|
|
30
|
+
warning: { light: '#8a4b00', dark: '#ffd166' },
|
|
31
|
+
onWarning: { light: '#ffffff', dark: '#111111' },
|
|
32
|
+
danger: { light: '#b3261e', dark: '#ff8a80' },
|
|
33
|
+
onDanger: { light: '#ffffff', dark: '#111111' },
|
|
34
|
+
},
|
|
12
35
|
},
|
|
13
36
|
typography: {
|
|
14
37
|
family: { body: 'Inter, sans-serif' },
|
|
@@ -28,4 +51,6 @@ export const exampleTokens = {
|
|
|
28
51
|
{ foreground: 'color.text.onAccent', background: 'color.background.accent' },
|
|
29
52
|
],
|
|
30
53
|
};
|
|
54
|
+
/** Example result for the package's default semantic contrast requirements. */
|
|
55
|
+
export const exampleContrastViolations = checkSemanticContrastMatrix(exampleTokens, DEFAULT_SEMANTIC_CONTRAST_REQUIREMENTS);
|
|
31
56
|
//# sourceMappingURL=example.js.map
|
package/dist/example.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"example.js","sourceRoot":"","sources":["../src/example.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"example.js","sourceRoot":"","sources":["../src/example.ts"],"names":[],"mappings":"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"}
|
package/dist/layout.d.ts
CHANGED
|
@@ -23,4 +23,8 @@ export declare function getLayoutMode(width: number, breakpoints: LayoutBreakpoi
|
|
|
23
23
|
export declare function getScreenMaxWidth<Widths extends ScreenMaxWidths>(screen: keyof Widths, layoutMode: LayoutMode, { maxWidths, narrowFallback, expandedOnly }: ScreenMaxWidthOptions<Widths>): number;
|
|
24
24
|
/** Bottom padding that keeps content clear of a mobile tab bar and the safe area. */
|
|
25
25
|
export declare function getTabContentInset(layoutMode: LayoutMode, safeAreaBottom: number, tabBarHeight: number): number;
|
|
26
|
+
/** Returns the viewport height left after fixed footer and bottom inset. */
|
|
27
|
+
export declare function getUsableContentHeight(viewportHeight: number, fixedFooterHeight: number, bottomInset: number): number;
|
|
28
|
+
/** True when the viewport height is at or below the caller's threshold. */
|
|
29
|
+
export declare function isShortViewport(viewportHeight: number, threshold: number): boolean;
|
|
26
30
|
//# sourceMappingURL=layout.d.ts.map
|
package/dist/layout.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../src/layout.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE3D,MAAM,WAAW,iBAAiB;IAChC,sDAAsD;IACtD,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,wDAAwD;IACxD,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;CAC3B;AAED,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;AAE/D,MAAM,WAAW,qBAAqB,CAAC,MAAM,SAAS,eAAe;IACnE,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;IAC3B,0EAA0E;IAC1E,QAAQ,CAAC,cAAc,EAAE,MAAM,MAAM,CAAC;IACtC,oEAAoE;IACpE,QAAQ,CAAC,YAAY,EAAE,SAAS,CAAC,MAAM,MAAM,CAAC,EAAE,CAAC;CAClD;AAED,8DAA8D;AAC9D,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,iBAAiB,GAAG,UAAU,CAIvF;AAED,oFAAoF;AACpF,wBAAgB,iBAAiB,CAAC,MAAM,SAAS,eAAe,EAC9D,MAAM,EAAE,MAAM,MAAM,EACpB,UAAU,EAAE,UAAU,EACtB,EAAE,SAAS,EAAE,cAAc,EAAE,YAAY,EAAE,EAAE,qBAAqB,CAAC,MAAM,CAAC,GACzE,MAAM,CAOR;AAED,qFAAqF;AACrF,wBAAgB,kBAAkB,CAChC,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,MAAM,EACtB,YAAY,EAAE,MAAM,GACnB,MAAM,CAGR"}
|
|
1
|
+
{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../src/layout.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE3D,MAAM,WAAW,iBAAiB;IAChC,sDAAsD;IACtD,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,wDAAwD;IACxD,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;CAC3B;AAED,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;AAE/D,MAAM,WAAW,qBAAqB,CAAC,MAAM,SAAS,eAAe;IACnE,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;IAC3B,0EAA0E;IAC1E,QAAQ,CAAC,cAAc,EAAE,MAAM,MAAM,CAAC;IACtC,oEAAoE;IACpE,QAAQ,CAAC,YAAY,EAAE,SAAS,CAAC,MAAM,MAAM,CAAC,EAAE,CAAC;CAClD;AAED,8DAA8D;AAC9D,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,iBAAiB,GAAG,UAAU,CAIvF;AAED,oFAAoF;AACpF,wBAAgB,iBAAiB,CAAC,MAAM,SAAS,eAAe,EAC9D,MAAM,EAAE,MAAM,MAAM,EACpB,UAAU,EAAE,UAAU,EACtB,EAAE,SAAS,EAAE,cAAc,EAAE,YAAY,EAAE,EAAE,qBAAqB,CAAC,MAAM,CAAC,GACzE,MAAM,CAOR;AAED,qFAAqF;AACrF,wBAAgB,kBAAkB,CAChC,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,MAAM,EACtB,YAAY,EAAE,MAAM,GACnB,MAAM,CAGR;AAUD,4EAA4E;AAC5E,wBAAgB,sBAAsB,CACpC,cAAc,EAAE,MAAM,EACtB,iBAAiB,EAAE,MAAM,EACzB,WAAW,EAAE,MAAM,GAClB,MAAM,CAKR;AAED,2EAA2E;AAC3E,wBAAgB,eAAe,CAAC,cAAc,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,OAAO,CAIlF"}
|
package/dist/layout.js
CHANGED
|
@@ -25,4 +25,22 @@ export function getTabContentInset(layoutMode, safeAreaBottom, tabBarHeight) {
|
|
|
25
25
|
return 0;
|
|
26
26
|
return tabBarHeight + Math.max(0, safeAreaBottom);
|
|
27
27
|
}
|
|
28
|
+
function validateNonNegativeDimension(name, value) {
|
|
29
|
+
if (!Number.isFinite(value) || value < 0) {
|
|
30
|
+
throw new RangeError(`${name} must be a finite non-negative number; received ${String(value)}.`);
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
/** Returns the viewport height left after fixed footer and bottom inset. */
|
|
34
|
+
export function getUsableContentHeight(viewportHeight, fixedFooterHeight, bottomInset) {
|
|
35
|
+
validateNonNegativeDimension('viewportHeight', viewportHeight);
|
|
36
|
+
validateNonNegativeDimension('fixedFooterHeight', fixedFooterHeight);
|
|
37
|
+
validateNonNegativeDimension('bottomInset', bottomInset);
|
|
38
|
+
return Math.max(0, viewportHeight - fixedFooterHeight - bottomInset);
|
|
39
|
+
}
|
|
40
|
+
/** True when the viewport height is at or below the caller's threshold. */
|
|
41
|
+
export function isShortViewport(viewportHeight, threshold) {
|
|
42
|
+
validateNonNegativeDimension('viewportHeight', viewportHeight);
|
|
43
|
+
validateNonNegativeDimension('threshold', threshold);
|
|
44
|
+
return viewportHeight <= threshold;
|
|
45
|
+
}
|
|
28
46
|
//# sourceMappingURL=layout.js.map
|
package/dist/layout.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout.js","sourceRoot":"","sources":["../src/layout.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAqBH,8DAA8D;AAC9D,MAAM,UAAU,aAAa,CAAC,KAAa,EAAE,WAA8B;IACzE,IAAI,KAAK,IAAI,WAAW,CAAC,QAAQ;QAAE,OAAO,UAAU,CAAC;IACrD,IAAI,KAAK,IAAI,WAAW,CAAC,MAAM;QAAE,OAAO,QAAQ,CAAC;IACjD,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,oFAAoF;AACpF,MAAM,UAAU,iBAAiB,CAC/B,MAAoB,EACpB,UAAsB,EACtB,EAAE,SAAS,EAAE,cAAc,EAAE,YAAY,EAAiC;IAE1E,MAAM,GAAG,GAAG,UAAU,KAAK,UAAU,IAAI,YAAY,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC;IACjG,MAAM,KAAK,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC;IAC7B,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;QACxB,MAAM,IAAI,KAAK,CAAC,6BAA6B,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;IAC9D,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC;AAED,qFAAqF;AACrF,MAAM,UAAU,kBAAkB,CAChC,UAAsB,EACtB,cAAsB,EACtB,YAAoB;IAEpB,IAAI,UAAU,KAAK,UAAU;QAAE,OAAO,CAAC,CAAC;IACxC,OAAO,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC;AACpD,CAAC"}
|
|
1
|
+
{"version":3,"file":"layout.js","sourceRoot":"","sources":["../src/layout.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAqBH,8DAA8D;AAC9D,MAAM,UAAU,aAAa,CAAC,KAAa,EAAE,WAA8B;IACzE,IAAI,KAAK,IAAI,WAAW,CAAC,QAAQ;QAAE,OAAO,UAAU,CAAC;IACrD,IAAI,KAAK,IAAI,WAAW,CAAC,MAAM;QAAE,OAAO,QAAQ,CAAC;IACjD,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,oFAAoF;AACpF,MAAM,UAAU,iBAAiB,CAC/B,MAAoB,EACpB,UAAsB,EACtB,EAAE,SAAS,EAAE,cAAc,EAAE,YAAY,EAAiC;IAE1E,MAAM,GAAG,GAAG,UAAU,KAAK,UAAU,IAAI,YAAY,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC;IACjG,MAAM,KAAK,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC;IAC7B,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;QACxB,MAAM,IAAI,KAAK,CAAC,6BAA6B,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;IAC9D,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC;AAED,qFAAqF;AACrF,MAAM,UAAU,kBAAkB,CAChC,UAAsB,EACtB,cAAsB,EACtB,YAAoB;IAEpB,IAAI,UAAU,KAAK,UAAU;QAAE,OAAO,CAAC,CAAC;IACxC,OAAO,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC;AACpD,CAAC;AAED,SAAS,4BAA4B,CAAC,IAAY,EAAE,KAAa;IAC/D,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,CAAC,EAAE,CAAC;QACzC,MAAM,IAAI,UAAU,CAClB,GAAG,IAAI,mDAAmD,MAAM,CAAC,KAAK,CAAC,GAAG,CAC3E,CAAC;IACJ,CAAC;AACH,CAAC;AAED,4EAA4E;AAC5E,MAAM,UAAU,sBAAsB,CACpC,cAAsB,EACtB,iBAAyB,EACzB,WAAmB;IAEnB,4BAA4B,CAAC,gBAAgB,EAAE,cAAc,CAAC,CAAC;IAC/D,4BAA4B,CAAC,mBAAmB,EAAE,iBAAiB,CAAC,CAAC;IACrE,4BAA4B,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;IACzD,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,cAAc,GAAG,iBAAiB,GAAG,WAAW,CAAC,CAAC;AACvE,CAAC;AAED,2EAA2E;AAC3E,MAAM,UAAU,eAAe,CAAC,cAAsB,EAAE,SAAiB;IACvE,4BAA4B,CAAC,gBAAgB,EAAE,cAAc,CAAC,CAAC;IAC/D,4BAA4B,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;IACrD,OAAO,cAAc,IAAI,SAAS,CAAC;AACrC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@baukit/ui-tokens",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.2.0",
|
|
4
4
|
"description": "Dependency-free design-token schema, validator, accessibility checker, and deterministic compiler for web and React Native.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Patrick Koss",
|