@spectrabrain/eds 0.0.1 → 0.0.2

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.
Files changed (12) hide show
  1. package/AI.md +13 -19
  2. package/README.md +52 -0
  3. package/dist/components.css +1 -1
  4. package/dist/index.js +16 -9
  5. package/dist/index.mjs +16 -9
  6. package/dist/tokens.css +10 -9
  7. package/dist/tokens.d.mts +3 -3
  8. package/dist/tokens.d.ts +3 -3
  9. package/dist/tokens.js +16 -9
  10. package/dist/tokens.json +18 -9
  11. package/dist/tokens.mjs +16 -9
  12. package/package.json +1 -1
package/AI.md CHANGED
@@ -27,22 +27,16 @@ const color = cssVar(token); // var(--eds-color-fg-brand)
27
27
  - 문서에 없는 deep import, raw 색상값, 임의 CSS variable은 사용하지 않습니다.
28
28
  - 역할에 맞는 semantic token이 없으면 임의 값을 만들지 말고 디자인 시스템 담당자에게 요청합니다.
29
29
 
30
- ## 컴포넌트가 추가된 뒤
31
-
32
- 각 컴포넌트의 공식 API와 설치된 패키지 버전을 먼저 확인합니다. 현재 제공하는 Button은 다음 규칙을 따릅니다.
33
-
34
- - `size`는 `xs`, `sm`, `md` 중 하나를 필수로 지정합니다.
35
- - `role`은 `brand`, `neutral`, `critical` 중 하나를 필수로 지정하며 시각적 역할로만 사용합니다.
36
- - `brand`는 `solid`, `outline`, `neutral`은 `solid`, `weak`, `outline`, `ghost`, `link`, `critical`은 `weak`만 허용합니다.
37
- - native button branch에서는 `type`을 필수로 지정합니다. `neutral/link`는 `href`가 필수인 `<a>`입니다.
38
- - children과 아이콘 슬롯 조합으로 layout을 결정합니다. icon-only는 비어 있지 않은 `aria-label`이 필수입니다.
39
- - disabled link는 href를 제거하고 키보드 순서에서 제외합니다. `role="link"`를 임의로 추가하지 않습니다.
40
- - `loading`은 처리 중임을 나타냅니다. 라벨과 공간은 유지되고 내부 progress circle이 표시되며, native button은 비활성화되고 link는 href가 제거됩니다. loading 중에는 `aria-busy="true"`가 제공되며 `prefers-reduced-motion: reduce` 환경에서는 애니메이션이 정지합니다.
41
- - `iconName`, `startIconName`, `endIconName`은 `ButtonIconName` 자동완성을 제공하는 lucide PascalCase 이름입니다. 이름으로 지정한 아이콘은 `lucide-react`의 기본 시각 설정을 사용하며 Button이 아이콘 영역 크기를 조정합니다. custom 아이콘은 단일 `ReactElement`만 허용하며 같은 슬롯의 이름 prop과 함께 지정하지 않습니다.
42
- - Button에는 typography prop이 없습니다. label은 `xs`에서 `typography.semantic.body3`, `sm`·`md`에서 `typography.semantic.title3`을 사용하며, 공개 text style semantic token은 Storybook 검토용 preset과 컴포넌트 내부 mapping에서 사용합니다. 소비처는 raw typography 값이나 component token override로 Button 글꼴을 덮어쓰지 않습니다.
43
- - `className`, native `aria-*`, `data-*`만 추가하며 `style`로 시각 정책을 우회하지 않습니다.
44
-
45
- - 제공되는 EDS 컴포넌트를 유사한 자체 구현보다 우선 사용합니다.
46
- - typed prop으로 제공하지 않은 색상, 상태, variant를 `className`이나 inline style로 우회하지 않습니다.
47
- - native semantics, accessible name, keyboard interaction을 임의로 변경하지 않습니다.
48
- - 컴포넌트 context와 manifest의 사용 목적·금지 사례를 따릅니다.
30
+ ## 컴포넌트 문서 읽기
31
+
32
+ 컴포넌트를 사용하거나 구현하기 전에 해당 컴포넌트 디렉토리의 `README.md`를 먼저 읽습니다. 이 문서에 컴포넌트의 개요, 사용 맥락, 공개 API, 접근성 계약, 금지 사례를 기록합니다.
33
+
34
+ 현재 제공하는 컴포넌트 문서는 다음 위치에 있습니다.
35
+
36
+ | 컴포넌트 | 문서 위치 |
37
+ | --- | --- |
38
+ | `Button` | `src/components/Button/README.md` |
39
+
40
+ 컴포넌트별 문서에 없는 props·variant·상태·사용 맥락은 추측해서 추가하지 않습니다.
41
+
42
+ 제공되는 EDS 컴포넌트를 유사한 자체 구현보다 우선 사용합니다. typed prop으로 제공하지 않은 색상·상태·variant를 `className`이나 inline style로 우회하지 않으며, native semantics·accessible name·keyboard interaction을 임의로 변경하지 않습니다.
package/README.md CHANGED
@@ -39,6 +39,58 @@ lucide 아이콘은 PascalCase 이름을 `iconName`, `startIconName`, `endIconNa
39
39
 
40
40
  처리 중인 버튼은 `loading`을 지정합니다. 라벨 공간을 유지한 2색 progress circle을 표시하고 상호작용을 차단하며, link는 href를 제거합니다. `prefers-reduced-motion: reduce` 환경에서는 애니메이션이 정지합니다.
41
41
 
42
+ ## Button API
43
+
44
+ `Button`은 TypeScript 타입으로 허용된 role·variant 조합과 native element branch를 제한합니다. 필수 props를 생략하거나 허용되지 않은 조합을 지정하면 TypeScript 자동완성 단계에서 오류를 확인할 수 있습니다.
45
+
46
+ ### 필수 props
47
+
48
+ | prop | 타입 | 규칙 |
49
+ | --- | --- | --- |
50
+ | `size` | `"xs" \| "sm" \| "md"` | 사용 공간과 행동의 중요도에 맞춰 선택합니다. 필수입니다. |
51
+ | `role` | `"brand" \| "neutral" \| "critical"` | 액션의 의미를 나타내는 시각적 역할입니다. DOM의 ARIA `role`로 전달되지 않습니다. 필수입니다. |
52
+ | `variant` | role별 아래 표 | 같은 role 안에서 시각적 위계를 결정합니다. 필수입니다. |
53
+ | `type` | `"button" \| "submit" \| "reset"` | native `<button>` branch에서 필수입니다. `neutral/link` branch에서는 사용하지 않습니다. |
54
+ | `href` | `string` | `role="neutral"`, `variant="link"` branch에서 필수입니다. 이 branch는 `<a>`로 렌더링합니다. |
55
+
56
+ ### role·variant 조합
57
+
58
+ | role | 허용 variant |
59
+ | --- | --- |
60
+ | `brand` | `solid`, `outline` |
61
+ | `neutral` | `solid`, `weak`, `outline`, `ghost`, `link` |
62
+ | `critical` | `weak` |
63
+
64
+ ### 선택 props와 슬롯
65
+
66
+ | prop | 타입·규칙 |
67
+ | --- | --- |
68
+ | `children` | `ReactNode` label입니다. 렌더링 가능한 내용이 하나 이상 필요하며 `startIcon`·`endIcon`과 조합할 수 있습니다. |
69
+ | `icon` | icon-only용 단일 custom `ReactElement`입니다. children이나 다른 아이콘 슬롯과 함께 사용하지 않습니다. |
70
+ | `iconName` | icon-only용 `ButtonIconName` lucide 이름입니다. |
71
+ | `startIcon` / `endIcon` | label 앞·뒤에 배치할 단일 custom `ReactElement` 슬롯입니다. |
72
+ | `startIconName` / `endIconName` | label 앞·뒤에 배치할 `ButtonIconName` lucide 이름입니다. |
73
+ | `aria-label` | icon-only에서 비어 있지 않은 accessible name으로 필수입니다. text label에서는 필요할 때 지정합니다. |
74
+ | `disabled` | 실행할 수 없는 상태입니다. native button은 `disabled`, link는 href 제거·`aria-disabled="true"`·`tabIndex={-1}`를 적용합니다. |
75
+ | `loading` | 처리 중 상태입니다. label과 아이콘 공간을 유지하고 progress circle을 표시하며 상호작용을 차단합니다. `aria-busy="true"`를 적용합니다. |
76
+ | `className` | 배치·컨테이너 보정용으로만 사용합니다. |
77
+ | `aria-*` / `data-*` | native 속성으로 전달할 수 있습니다. |
78
+ | `ref` | native button은 `HTMLButtonElement`, link는 `HTMLAnchorElement`를 전달합니다. |
79
+
80
+ `style`과 component token override API는 제공하지 않습니다. lucide 이름과 custom `ReactElement`는 같은 슬롯에 함께 지정하지 않습니다. 이름으로 지정한 lucide 아이콘은 `lucide-react` 기본 시각 설정을 사용하며, Button은 아이콘 영역 크기만 조정합니다.
81
+
82
+ 슬롯 조합에 따라 layout은 다음처럼 추론합니다.
83
+
84
+ | 조합 | layout |
85
+ | --- | --- |
86
+ | children만 지정합니다. | `textOnly` |
87
+ | children과 `startIcon` 또는 `startIconName`을 지정합니다. | `iconFirst` |
88
+ | children과 `endIcon` 또는 `endIconName`을 지정합니다. | `iconLast` |
89
+ | children과 앞·뒤 아이콘을 모두 지정합니다. | `iconBoth` |
90
+ | children 없이 `icon` 또는 `iconName`만 지정합니다. | `iconOnly` |
91
+
92
+ 잘못된 슬롯 조합, 빈 label·accessible name·icon은 모든 환경에서 오류로 처리합니다. Button의 개요와 사용 맥락은 저장소의 [Button 컴포넌트 문서](src/components/Button/README.md)를 기준으로 합니다.
93
+
42
94
  ## 토큰 사용
43
95
 
44
96
  CSS를 한 번 import한 뒤 `cssVar()`와 `SemanticTokenName`을 사용합니다. 공개 token 이름은 `-`로 구분하며 복합어 안에서만 lower camelCase를 사용합니다.
package/dist/components.css CHANGED
@@ -169,7 +169,7 @@
169
169
  --eds-button-style-brand-outline-enabled-root-borderWidth: 1px;
170
170
  --eds-button-style-brand-outline-hover-root-backgroundColor: var(--eds-color-bg-transparent-hover);
171
171
  --eds-button-style-brand-outline-loading-progressCircle-rangeColor: var(--eds-color-fg-brand);
172
- --eds-button-style-brand-outline-loading-progressCircle-trackColor: #FF936F;
172
+ --eds-button-style-brand-outline-loading-progressCircle-trackColor: #FFA081;
173
173
  --eds-button-style-brand-outline-loading-root-backgroundColor: var(--eds-color-bg-transparent-hover);
174
174
  --eds-button-style-brand-solid-disabled-label-color: var(--eds-color-fg-disabled);
175
175
  --eds-button-style-brand-solid-disabled-root-backgroundColor: var(--eds-color-bg-disabled);
package/dist/index.js CHANGED
@@ -81,7 +81,7 @@ var tokenMap = {
81
81
  "color-bg-layer-default": {
82
82
  "name": "color-bg-layer-default",
83
83
  "type": "color",
84
- "value": "#FFFFFF",
84
+ "value": "#FFFFFFFF",
85
85
  "cssVariable": "--eds-color-bg-layer-default"
86
86
  },
87
87
  "color-bg-layer-default-hover": {
@@ -93,7 +93,7 @@ var tokenMap = {
93
93
  "color-bg-layer-floating": {
94
94
  "name": "color-bg-layer-floating",
95
95
  "type": "color",
96
- "value": "#FFFFFF",
96
+ "value": "#FFFFFFFF",
97
97
  "cssVariable": "--eds-color-bg-layer-floating"
98
98
  },
99
99
  "color-bg-layer-floating-hover": {
@@ -105,19 +105,19 @@ var tokenMap = {
105
105
  "color-bg-neutral-inverted": {
106
106
  "name": "color-bg-neutral-inverted",
107
107
  "type": "color",
108
- "value": "#374151",
108
+ "value": "#1F2937",
109
109
  "cssVariable": "--eds-color-bg-neutral-inverted"
110
110
  },
111
111
  "color-bg-neutral-inverted-hover": {
112
112
  "name": "color-bg-neutral-inverted-hover",
113
113
  "type": "color",
114
- "value": "#374151",
114
+ "value": "#111827",
115
115
  "cssVariable": "--eds-color-bg-neutral-inverted-hover"
116
116
  },
117
117
  "color-bg-neutral-primary": {
118
118
  "name": "color-bg-neutral-primary",
119
119
  "type": "color",
120
- "value": "#FFFFFF",
120
+ "value": "#FFFFFFFF",
121
121
  "cssVariable": "--eds-color-bg-neutral-primary"
122
122
  },
123
123
  "color-bg-neutral-primary-hover": {
@@ -249,13 +249,13 @@ var tokenMap = {
249
249
  "color-fg-neutral": {
250
250
  "name": "color-fg-neutral",
251
251
  "type": "color",
252
- "value": "#374151",
252
+ "value": "#1F2937",
253
253
  "cssVariable": "--eds-color-fg-neutral"
254
254
  },
255
255
  "color-fg-neutral-inverted": {
256
256
  "name": "color-fg-neutral-inverted",
257
257
  "type": "color",
258
- "value": "#FFFFFF",
258
+ "value": "#FFFFFFFF",
259
259
  "cssVariable": "--eds-color-fg-neutral-inverted"
260
260
  },
261
261
  "color-fg-neutral-secondary": {
@@ -303,9 +303,15 @@ var tokenMap = {
303
303
  "color-stroke-brand-primary": {
304
304
  "name": "color-stroke-brand-primary",
305
305
  "type": "color",
306
- "value": "#DB3700",
306
+ "value": "#FE4101",
307
307
  "cssVariable": "--eds-color-stroke-brand-primary"
308
308
  },
309
+ "color-stroke-brand-weak": {
310
+ "name": "color-stroke-brand-weak",
311
+ "type": "color",
312
+ "value": "#FFEBE4",
313
+ "cssVariable": "--eds-color-stroke-brand-weak"
314
+ },
309
315
  "color-stroke-critical-primary": {
310
316
  "name": "color-stroke-critical-primary",
311
317
  "type": "color",
@@ -339,7 +345,7 @@ var tokenMap = {
339
345
  "color-stroke-neutral-contrast": {
340
346
  "name": "color-stroke-neutral-contrast",
341
347
  "type": "color",
342
- "value": "#374151",
348
+ "value": "#1F2937",
343
349
  "cssVariable": "--eds-color-stroke-neutral-contrast"
344
350
  },
345
351
  "color-stroke-neutral-primary": {
@@ -1125,6 +1131,7 @@ var tokenNames = Object.freeze([
1125
1131
  "color-fg-warning",
1126
1132
  "color-fg-warning-contrast",
1127
1133
  "color-stroke-brand-primary",
1134
+ "color-stroke-brand-weak",
1128
1135
  "color-stroke-critical-primary",
1129
1136
  "color-stroke-critical-weak",
1130
1137
  "color-stroke-focusRing",
package/dist/index.mjs CHANGED
@@ -79,7 +79,7 @@ var tokenMap = {
79
79
  "color-bg-layer-default": {
80
80
  "name": "color-bg-layer-default",
81
81
  "type": "color",
82
- "value": "#FFFFFF",
82
+ "value": "#FFFFFFFF",
83
83
  "cssVariable": "--eds-color-bg-layer-default"
84
84
  },
85
85
  "color-bg-layer-default-hover": {
@@ -91,7 +91,7 @@ var tokenMap = {
91
91
  "color-bg-layer-floating": {
92
92
  "name": "color-bg-layer-floating",
93
93
  "type": "color",
94
- "value": "#FFFFFF",
94
+ "value": "#FFFFFFFF",
95
95
  "cssVariable": "--eds-color-bg-layer-floating"
96
96
  },
97
97
  "color-bg-layer-floating-hover": {
@@ -103,19 +103,19 @@ var tokenMap = {
103
103
  "color-bg-neutral-inverted": {
104
104
  "name": "color-bg-neutral-inverted",
105
105
  "type": "color",
106
- "value": "#374151",
106
+ "value": "#1F2937",
107
107
  "cssVariable": "--eds-color-bg-neutral-inverted"
108
108
  },
109
109
  "color-bg-neutral-inverted-hover": {
110
110
  "name": "color-bg-neutral-inverted-hover",
111
111
  "type": "color",
112
- "value": "#374151",
112
+ "value": "#111827",
113
113
  "cssVariable": "--eds-color-bg-neutral-inverted-hover"
114
114
  },
115
115
  "color-bg-neutral-primary": {
116
116
  "name": "color-bg-neutral-primary",
117
117
  "type": "color",
118
- "value": "#FFFFFF",
118
+ "value": "#FFFFFFFF",
119
119
  "cssVariable": "--eds-color-bg-neutral-primary"
120
120
  },
121
121
  "color-bg-neutral-primary-hover": {
@@ -247,13 +247,13 @@ var tokenMap = {
247
247
  "color-fg-neutral": {
248
248
  "name": "color-fg-neutral",
249
249
  "type": "color",
250
- "value": "#374151",
250
+ "value": "#1F2937",
251
251
  "cssVariable": "--eds-color-fg-neutral"
252
252
  },
253
253
  "color-fg-neutral-inverted": {
254
254
  "name": "color-fg-neutral-inverted",
255
255
  "type": "color",
256
- "value": "#FFFFFF",
256
+ "value": "#FFFFFFFF",
257
257
  "cssVariable": "--eds-color-fg-neutral-inverted"
258
258
  },
259
259
  "color-fg-neutral-secondary": {
@@ -301,9 +301,15 @@ var tokenMap = {
301
301
  "color-stroke-brand-primary": {
302
302
  "name": "color-stroke-brand-primary",
303
303
  "type": "color",
304
- "value": "#DB3700",
304
+ "value": "#FE4101",
305
305
  "cssVariable": "--eds-color-stroke-brand-primary"
306
306
  },
307
+ "color-stroke-brand-weak": {
308
+ "name": "color-stroke-brand-weak",
309
+ "type": "color",
310
+ "value": "#FFEBE4",
311
+ "cssVariable": "--eds-color-stroke-brand-weak"
312
+ },
307
313
  "color-stroke-critical-primary": {
308
314
  "name": "color-stroke-critical-primary",
309
315
  "type": "color",
@@ -337,7 +343,7 @@ var tokenMap = {
337
343
  "color-stroke-neutral-contrast": {
338
344
  "name": "color-stroke-neutral-contrast",
339
345
  "type": "color",
340
- "value": "#374151",
346
+ "value": "#1F2937",
341
347
  "cssVariable": "--eds-color-stroke-neutral-contrast"
342
348
  },
343
349
  "color-stroke-neutral-primary": {
@@ -1123,6 +1129,7 @@ var tokenNames = Object.freeze([
1123
1129
  "color-fg-warning",
1124
1130
  "color-fg-warning-contrast",
1125
1131
  "color-stroke-brand-primary",
1132
+ "color-stroke-brand-weak",
1126
1133
  "color-stroke-critical-primary",
1127
1134
  "color-stroke-critical-weak",
1128
1135
  "color-stroke-focusRing",
package/dist/tokens.css CHANGED
@@ -12,13 +12,13 @@
12
12
  --eds-color-bg-informative-weak: #EFF6FF;
13
13
  --eds-color-bg-informative-weak-hover: #DBEAFE;
14
14
  --eds-color-bg-layer-basement: #F3F4F6;
15
- --eds-color-bg-layer-default: #FFFFFF;
15
+ --eds-color-bg-layer-default: #FFFFFFFF;
16
16
  --eds-color-bg-layer-default-hover: #F9FAFB;
17
- --eds-color-bg-layer-floating: #FFFFFF;
17
+ --eds-color-bg-layer-floating: #FFFFFFFF;
18
18
  --eds-color-bg-layer-floating-hover: #F9FAFB;
19
- --eds-color-bg-neutral-inverted: #374151;
20
- --eds-color-bg-neutral-inverted-hover: #374151;
21
- --eds-color-bg-neutral-primary: #FFFFFF;
19
+ --eds-color-bg-neutral-inverted: #1F2937;
20
+ --eds-color-bg-neutral-inverted-hover: #111827;
21
+ --eds-color-bg-neutral-primary: #FFFFFFFF;
22
22
  --eds-color-bg-neutral-primary-hover: #F3F4F6;
23
23
  --eds-color-bg-neutral-weak: #E5E7EB;
24
24
  --eds-color-bg-neutral-weak-hover: #D1D5DB;
@@ -40,8 +40,8 @@
40
40
  --eds-color-fg-focus: #374151;
41
41
  --eds-color-fg-informative: #3B82F6;
42
42
  --eds-color-fg-informative-contrast: #1D4ED8;
43
- --eds-color-fg-neutral: #374151;
44
- --eds-color-fg-neutral-inverted: #FFFFFF;
43
+ --eds-color-fg-neutral: #1F2937;
44
+ --eds-color-fg-neutral-inverted: #FFFFFFFF;
45
45
  --eds-color-fg-neutral-secondary: #4B5563;
46
46
  --eds-color-fg-neutral-tertiary: #9CA3AF;
47
47
  --eds-color-fg-placeholder: #9CA3AF;
@@ -49,13 +49,14 @@
49
49
  --eds-color-fg-positive-contrast: #15803D;
50
50
  --eds-color-fg-warning: #CA8A04;
51
51
  --eds-color-fg-warning-contrast: #713F12;
52
- --eds-color-stroke-brand-primary: #DB3700;
52
+ --eds-color-stroke-brand-primary: #FE4101;
53
+ --eds-color-stroke-brand-weak: #FFEBE4;
53
54
  --eds-color-stroke-critical-primary: #EF4444;
54
55
  --eds-color-stroke-critical-weak: #FECACA;
55
56
  --eds-color-stroke-focusRing: #374151;
56
57
  --eds-color-stroke-informative-primary: #3B82F6;
57
58
  --eds-color-stroke-informative-weak: #BFDBFE;
58
- --eds-color-stroke-neutral-contrast: #374151;
59
+ --eds-color-stroke-neutral-contrast: #1F2937;
59
60
  --eds-color-stroke-neutral-primary: #4B5563;
60
61
  --eds-color-stroke-neutral-secondary: #E5E7EB;
61
62
  --eds-color-stroke-neutral-weak: #F3F4F6;
package/dist/tokens.d.mts CHANGED
@@ -1,7 +1,7 @@
1
- type SemanticTokenName = "color-bg-brand-primary" | "color-bg-brand-primary-hover" | "color-bg-critical-primary" | "color-bg-critical-primary-hover" | "color-bg-critical-weak" | "color-bg-critical-weak-hover" | "color-bg-disabled" | "color-bg-informative-primary" | "color-bg-informative-primary-hover" | "color-bg-informative-weak" | "color-bg-informative-weak-hover" | "color-bg-layer-basement" | "color-bg-layer-default" | "color-bg-layer-default-hover" | "color-bg-layer-floating" | "color-bg-layer-floating-hover" | "color-bg-neutral-inverted" | "color-bg-neutral-inverted-hover" | "color-bg-neutral-primary" | "color-bg-neutral-primary-hover" | "color-bg-neutral-weak" | "color-bg-neutral-weak-hover" | "color-bg-positive-primary" | "color-bg-positive-primary-hover" | "color-bg-positive-weak" | "color-bg-positive-weak-hover" | "color-bg-transparent" | "color-bg-transparent-hover" | "color-bg-warning-primary" | "color-bg-warning-primary-hover" | "color-bg-warning-weak" | "color-bg-warning-weak-hover" | "color-fg-brand" | "color-fg-brand-contrast" | "color-fg-critical" | "color-fg-critical-contrast" | "color-fg-disabled" | "color-fg-focus" | "color-fg-informative" | "color-fg-informative-contrast" | "color-fg-neutral" | "color-fg-neutral-inverted" | "color-fg-neutral-secondary" | "color-fg-neutral-tertiary" | "color-fg-placeholder" | "color-fg-positive" | "color-fg-positive-contrast" | "color-fg-warning" | "color-fg-warning-contrast" | "color-stroke-brand-primary" | "color-stroke-critical-primary" | "color-stroke-critical-weak" | "color-stroke-focusRing" | "color-stroke-informative-primary" | "color-stroke-informative-weak" | "color-stroke-neutral-contrast" | "color-stroke-neutral-primary" | "color-stroke-neutral-secondary" | "color-stroke-neutral-weak" | "color-stroke-positive-primary" | "color-stroke-positive-weak" | "color-stroke-warning-primary" | "color-stroke-warning-weak" | "typography-body1-fontFamily" | "typography-body1-fontSize" | "typography-body1-fontWeight" | "typography-body1-letterSpacing" | "typography-body1-lineHeight" | "typography-body2-fontFamily" | "typography-body2-fontSize" | "typography-body2-fontWeight" | "typography-body2-letterSpacing" | "typography-body2-lineHeight" | "typography-body3-fontFamily" | "typography-body3-fontSize" | "typography-body3-fontWeight" | "typography-body3-letterSpacing" | "typography-body3-lineHeight" | "typography-body4-fontFamily" | "typography-body4-fontSize" | "typography-body4-fontWeight" | "typography-body4-letterSpacing" | "typography-body4-lineHeight" | "typography-caption1-fontFamily" | "typography-caption1-fontSize" | "typography-caption1-fontWeight" | "typography-caption1-letterSpacing" | "typography-caption1-lineHeight" | "typography-caption2-fontFamily" | "typography-caption2-fontSize" | "typography-caption2-fontWeight" | "typography-caption2-letterSpacing" | "typography-caption2-lineHeight" | "typography-caption3-fontFamily" | "typography-caption3-fontSize" | "typography-caption3-fontWeight" | "typography-caption3-letterSpacing" | "typography-caption3-lineHeight" | "typography-display1-fontFamily" | "typography-display1-fontSize" | "typography-display1-fontWeight" | "typography-display1-letterSpacing" | "typography-display1-lineHeight" | "typography-display2-fontFamily" | "typography-display2-fontSize" | "typography-display2-fontWeight" | "typography-display2-letterSpacing" | "typography-display2-lineHeight" | "typography-heading1-fontFamily" | "typography-heading1-fontSize" | "typography-heading1-fontWeight" | "typography-heading1-letterSpacing" | "typography-heading1-lineHeight" | "typography-heading2-fontFamily" | "typography-heading2-fontSize" | "typography-heading2-fontWeight" | "typography-heading2-letterSpacing" | "typography-heading2-lineHeight" | "typography-heading3-fontFamily" | "typography-heading3-fontSize" | "typography-heading3-fontWeight" | "typography-heading3-letterSpacing" | "typography-heading3-lineHeight" | "typography-title1-fontFamily" | "typography-title1-fontSize" | "typography-title1-fontWeight" | "typography-title1-letterSpacing" | "typography-title1-lineHeight" | "typography-title2-fontFamily" | "typography-title2-fontSize" | "typography-title2-fontWeight" | "typography-title2-letterSpacing" | "typography-title2-lineHeight" | "typography-title3-fontFamily" | "typography-title3-fontSize" | "typography-title3-fontWeight" | "typography-title3-letterSpacing" | "typography-title3-lineHeight" | "typography-title4-fontFamily" | "typography-title4-fontSize" | "typography-title4-fontWeight" | "typography-title4-letterSpacing" | "typography-title4-lineHeight";
1
+ type SemanticTokenName = "color-bg-brand-primary" | "color-bg-brand-primary-hover" | "color-bg-critical-primary" | "color-bg-critical-primary-hover" | "color-bg-critical-weak" | "color-bg-critical-weak-hover" | "color-bg-disabled" | "color-bg-informative-primary" | "color-bg-informative-primary-hover" | "color-bg-informative-weak" | "color-bg-informative-weak-hover" | "color-bg-layer-basement" | "color-bg-layer-default" | "color-bg-layer-default-hover" | "color-bg-layer-floating" | "color-bg-layer-floating-hover" | "color-bg-neutral-inverted" | "color-bg-neutral-inverted-hover" | "color-bg-neutral-primary" | "color-bg-neutral-primary-hover" | "color-bg-neutral-weak" | "color-bg-neutral-weak-hover" | "color-bg-positive-primary" | "color-bg-positive-primary-hover" | "color-bg-positive-weak" | "color-bg-positive-weak-hover" | "color-bg-transparent" | "color-bg-transparent-hover" | "color-bg-warning-primary" | "color-bg-warning-primary-hover" | "color-bg-warning-weak" | "color-bg-warning-weak-hover" | "color-fg-brand" | "color-fg-brand-contrast" | "color-fg-critical" | "color-fg-critical-contrast" | "color-fg-disabled" | "color-fg-focus" | "color-fg-informative" | "color-fg-informative-contrast" | "color-fg-neutral" | "color-fg-neutral-inverted" | "color-fg-neutral-secondary" | "color-fg-neutral-tertiary" | "color-fg-placeholder" | "color-fg-positive" | "color-fg-positive-contrast" | "color-fg-warning" | "color-fg-warning-contrast" | "color-stroke-brand-primary" | "color-stroke-brand-weak" | "color-stroke-critical-primary" | "color-stroke-critical-weak" | "color-stroke-focusRing" | "color-stroke-informative-primary" | "color-stroke-informative-weak" | "color-stroke-neutral-contrast" | "color-stroke-neutral-primary" | "color-stroke-neutral-secondary" | "color-stroke-neutral-weak" | "color-stroke-positive-primary" | "color-stroke-positive-weak" | "color-stroke-warning-primary" | "color-stroke-warning-weak" | "typography-body1-fontFamily" | "typography-body1-fontSize" | "typography-body1-fontWeight" | "typography-body1-letterSpacing" | "typography-body1-lineHeight" | "typography-body2-fontFamily" | "typography-body2-fontSize" | "typography-body2-fontWeight" | "typography-body2-letterSpacing" | "typography-body2-lineHeight" | "typography-body3-fontFamily" | "typography-body3-fontSize" | "typography-body3-fontWeight" | "typography-body3-letterSpacing" | "typography-body3-lineHeight" | "typography-body4-fontFamily" | "typography-body4-fontSize" | "typography-body4-fontWeight" | "typography-body4-letterSpacing" | "typography-body4-lineHeight" | "typography-caption1-fontFamily" | "typography-caption1-fontSize" | "typography-caption1-fontWeight" | "typography-caption1-letterSpacing" | "typography-caption1-lineHeight" | "typography-caption2-fontFamily" | "typography-caption2-fontSize" | "typography-caption2-fontWeight" | "typography-caption2-letterSpacing" | "typography-caption2-lineHeight" | "typography-caption3-fontFamily" | "typography-caption3-fontSize" | "typography-caption3-fontWeight" | "typography-caption3-letterSpacing" | "typography-caption3-lineHeight" | "typography-display1-fontFamily" | "typography-display1-fontSize" | "typography-display1-fontWeight" | "typography-display1-letterSpacing" | "typography-display1-lineHeight" | "typography-display2-fontFamily" | "typography-display2-fontSize" | "typography-display2-fontWeight" | "typography-display2-letterSpacing" | "typography-display2-lineHeight" | "typography-heading1-fontFamily" | "typography-heading1-fontSize" | "typography-heading1-fontWeight" | "typography-heading1-letterSpacing" | "typography-heading1-lineHeight" | "typography-heading2-fontFamily" | "typography-heading2-fontSize" | "typography-heading2-fontWeight" | "typography-heading2-letterSpacing" | "typography-heading2-lineHeight" | "typography-heading3-fontFamily" | "typography-heading3-fontSize" | "typography-heading3-fontWeight" | "typography-heading3-letterSpacing" | "typography-heading3-lineHeight" | "typography-title1-fontFamily" | "typography-title1-fontSize" | "typography-title1-fontWeight" | "typography-title1-letterSpacing" | "typography-title1-lineHeight" | "typography-title2-fontFamily" | "typography-title2-fontSize" | "typography-title2-fontWeight" | "typography-title2-letterSpacing" | "typography-title2-lineHeight" | "typography-title3-fontFamily" | "typography-title3-fontSize" | "typography-title3-fontWeight" | "typography-title3-letterSpacing" | "typography-title3-lineHeight" | "typography-title4-fontFamily" | "typography-title4-fontSize" | "typography-title4-fontWeight" | "typography-title4-letterSpacing" | "typography-title4-lineHeight";
2
2
  type SemanticTokenType = "color" | "dimension" | "fontFamily" | "fontWeight";
3
- type SemanticTokenCssVariable = "--eds-color-bg-brand-primary" | "--eds-color-bg-brand-primary-hover" | "--eds-color-bg-critical-primary" | "--eds-color-bg-critical-primary-hover" | "--eds-color-bg-critical-weak" | "--eds-color-bg-critical-weak-hover" | "--eds-color-bg-disabled" | "--eds-color-bg-informative-primary" | "--eds-color-bg-informative-primary-hover" | "--eds-color-bg-informative-weak" | "--eds-color-bg-informative-weak-hover" | "--eds-color-bg-layer-basement" | "--eds-color-bg-layer-default" | "--eds-color-bg-layer-default-hover" | "--eds-color-bg-layer-floating" | "--eds-color-bg-layer-floating-hover" | "--eds-color-bg-neutral-inverted" | "--eds-color-bg-neutral-inverted-hover" | "--eds-color-bg-neutral-primary" | "--eds-color-bg-neutral-primary-hover" | "--eds-color-bg-neutral-weak" | "--eds-color-bg-neutral-weak-hover" | "--eds-color-bg-positive-primary" | "--eds-color-bg-positive-primary-hover" | "--eds-color-bg-positive-weak" | "--eds-color-bg-positive-weak-hover" | "--eds-color-bg-transparent" | "--eds-color-bg-transparent-hover" | "--eds-color-bg-warning-primary" | "--eds-color-bg-warning-primary-hover" | "--eds-color-bg-warning-weak" | "--eds-color-bg-warning-weak-hover" | "--eds-color-fg-brand" | "--eds-color-fg-brand-contrast" | "--eds-color-fg-critical" | "--eds-color-fg-critical-contrast" | "--eds-color-fg-disabled" | "--eds-color-fg-focus" | "--eds-color-fg-informative" | "--eds-color-fg-informative-contrast" | "--eds-color-fg-neutral" | "--eds-color-fg-neutral-inverted" | "--eds-color-fg-neutral-secondary" | "--eds-color-fg-neutral-tertiary" | "--eds-color-fg-placeholder" | "--eds-color-fg-positive" | "--eds-color-fg-positive-contrast" | "--eds-color-fg-warning" | "--eds-color-fg-warning-contrast" | "--eds-color-stroke-brand-primary" | "--eds-color-stroke-critical-primary" | "--eds-color-stroke-critical-weak" | "--eds-color-stroke-focusRing" | "--eds-color-stroke-informative-primary" | "--eds-color-stroke-informative-weak" | "--eds-color-stroke-neutral-contrast" | "--eds-color-stroke-neutral-primary" | "--eds-color-stroke-neutral-secondary" | "--eds-color-stroke-neutral-weak" | "--eds-color-stroke-positive-primary" | "--eds-color-stroke-positive-weak" | "--eds-color-stroke-warning-primary" | "--eds-color-stroke-warning-weak" | "--eds-typography-body1-fontFamily" | "--eds-typography-body1-fontSize" | "--eds-typography-body1-fontWeight" | "--eds-typography-body1-letterSpacing" | "--eds-typography-body1-lineHeight" | "--eds-typography-body2-fontFamily" | "--eds-typography-body2-fontSize" | "--eds-typography-body2-fontWeight" | "--eds-typography-body2-letterSpacing" | "--eds-typography-body2-lineHeight" | "--eds-typography-body3-fontFamily" | "--eds-typography-body3-fontSize" | "--eds-typography-body3-fontWeight" | "--eds-typography-body3-letterSpacing" | "--eds-typography-body3-lineHeight" | "--eds-typography-body4-fontFamily" | "--eds-typography-body4-fontSize" | "--eds-typography-body4-fontWeight" | "--eds-typography-body4-letterSpacing" | "--eds-typography-body4-lineHeight" | "--eds-typography-caption1-fontFamily" | "--eds-typography-caption1-fontSize" | "--eds-typography-caption1-fontWeight" | "--eds-typography-caption1-letterSpacing" | "--eds-typography-caption1-lineHeight" | "--eds-typography-caption2-fontFamily" | "--eds-typography-caption2-fontSize" | "--eds-typography-caption2-fontWeight" | "--eds-typography-caption2-letterSpacing" | "--eds-typography-caption2-lineHeight" | "--eds-typography-caption3-fontFamily" | "--eds-typography-caption3-fontSize" | "--eds-typography-caption3-fontWeight" | "--eds-typography-caption3-letterSpacing" | "--eds-typography-caption3-lineHeight" | "--eds-typography-display1-fontFamily" | "--eds-typography-display1-fontSize" | "--eds-typography-display1-fontWeight" | "--eds-typography-display1-letterSpacing" | "--eds-typography-display1-lineHeight" | "--eds-typography-display2-fontFamily" | "--eds-typography-display2-fontSize" | "--eds-typography-display2-fontWeight" | "--eds-typography-display2-letterSpacing" | "--eds-typography-display2-lineHeight" | "--eds-typography-heading1-fontFamily" | "--eds-typography-heading1-fontSize" | "--eds-typography-heading1-fontWeight" | "--eds-typography-heading1-letterSpacing" | "--eds-typography-heading1-lineHeight" | "--eds-typography-heading2-fontFamily" | "--eds-typography-heading2-fontSize" | "--eds-typography-heading2-fontWeight" | "--eds-typography-heading2-letterSpacing" | "--eds-typography-heading2-lineHeight" | "--eds-typography-heading3-fontFamily" | "--eds-typography-heading3-fontSize" | "--eds-typography-heading3-fontWeight" | "--eds-typography-heading3-letterSpacing" | "--eds-typography-heading3-lineHeight" | "--eds-typography-title1-fontFamily" | "--eds-typography-title1-fontSize" | "--eds-typography-title1-fontWeight" | "--eds-typography-title1-letterSpacing" | "--eds-typography-title1-lineHeight" | "--eds-typography-title2-fontFamily" | "--eds-typography-title2-fontSize" | "--eds-typography-title2-fontWeight" | "--eds-typography-title2-letterSpacing" | "--eds-typography-title2-lineHeight" | "--eds-typography-title3-fontFamily" | "--eds-typography-title3-fontSize" | "--eds-typography-title3-fontWeight" | "--eds-typography-title3-letterSpacing" | "--eds-typography-title3-lineHeight" | "--eds-typography-title4-fontFamily" | "--eds-typography-title4-fontSize" | "--eds-typography-title4-fontWeight" | "--eds-typography-title4-letterSpacing" | "--eds-typography-title4-lineHeight";
4
- type SemanticTokenCssReference = "var(--eds-color-bg-brand-primary)" | "var(--eds-color-bg-brand-primary-hover)" | "var(--eds-color-bg-critical-primary)" | "var(--eds-color-bg-critical-primary-hover)" | "var(--eds-color-bg-critical-weak)" | "var(--eds-color-bg-critical-weak-hover)" | "var(--eds-color-bg-disabled)" | "var(--eds-color-bg-informative-primary)" | "var(--eds-color-bg-informative-primary-hover)" | "var(--eds-color-bg-informative-weak)" | "var(--eds-color-bg-informative-weak-hover)" | "var(--eds-color-bg-layer-basement)" | "var(--eds-color-bg-layer-default)" | "var(--eds-color-bg-layer-default-hover)" | "var(--eds-color-bg-layer-floating)" | "var(--eds-color-bg-layer-floating-hover)" | "var(--eds-color-bg-neutral-inverted)" | "var(--eds-color-bg-neutral-inverted-hover)" | "var(--eds-color-bg-neutral-primary)" | "var(--eds-color-bg-neutral-primary-hover)" | "var(--eds-color-bg-neutral-weak)" | "var(--eds-color-bg-neutral-weak-hover)" | "var(--eds-color-bg-positive-primary)" | "var(--eds-color-bg-positive-primary-hover)" | "var(--eds-color-bg-positive-weak)" | "var(--eds-color-bg-positive-weak-hover)" | "var(--eds-color-bg-transparent)" | "var(--eds-color-bg-transparent-hover)" | "var(--eds-color-bg-warning-primary)" | "var(--eds-color-bg-warning-primary-hover)" | "var(--eds-color-bg-warning-weak)" | "var(--eds-color-bg-warning-weak-hover)" | "var(--eds-color-fg-brand)" | "var(--eds-color-fg-brand-contrast)" | "var(--eds-color-fg-critical)" | "var(--eds-color-fg-critical-contrast)" | "var(--eds-color-fg-disabled)" | "var(--eds-color-fg-focus)" | "var(--eds-color-fg-informative)" | "var(--eds-color-fg-informative-contrast)" | "var(--eds-color-fg-neutral)" | "var(--eds-color-fg-neutral-inverted)" | "var(--eds-color-fg-neutral-secondary)" | "var(--eds-color-fg-neutral-tertiary)" | "var(--eds-color-fg-placeholder)" | "var(--eds-color-fg-positive)" | "var(--eds-color-fg-positive-contrast)" | "var(--eds-color-fg-warning)" | "var(--eds-color-fg-warning-contrast)" | "var(--eds-color-stroke-brand-primary)" | "var(--eds-color-stroke-critical-primary)" | "var(--eds-color-stroke-critical-weak)" | "var(--eds-color-stroke-focusRing)" | "var(--eds-color-stroke-informative-primary)" | "var(--eds-color-stroke-informative-weak)" | "var(--eds-color-stroke-neutral-contrast)" | "var(--eds-color-stroke-neutral-primary)" | "var(--eds-color-stroke-neutral-secondary)" | "var(--eds-color-stroke-neutral-weak)" | "var(--eds-color-stroke-positive-primary)" | "var(--eds-color-stroke-positive-weak)" | "var(--eds-color-stroke-warning-primary)" | "var(--eds-color-stroke-warning-weak)" | "var(--eds-typography-body1-fontFamily)" | "var(--eds-typography-body1-fontSize)" | "var(--eds-typography-body1-fontWeight)" | "var(--eds-typography-body1-letterSpacing)" | "var(--eds-typography-body1-lineHeight)" | "var(--eds-typography-body2-fontFamily)" | "var(--eds-typography-body2-fontSize)" | "var(--eds-typography-body2-fontWeight)" | "var(--eds-typography-body2-letterSpacing)" | "var(--eds-typography-body2-lineHeight)" | "var(--eds-typography-body3-fontFamily)" | "var(--eds-typography-body3-fontSize)" | "var(--eds-typography-body3-fontWeight)" | "var(--eds-typography-body3-letterSpacing)" | "var(--eds-typography-body3-lineHeight)" | "var(--eds-typography-body4-fontFamily)" | "var(--eds-typography-body4-fontSize)" | "var(--eds-typography-body4-fontWeight)" | "var(--eds-typography-body4-letterSpacing)" | "var(--eds-typography-body4-lineHeight)" | "var(--eds-typography-caption1-fontFamily)" | "var(--eds-typography-caption1-fontSize)" | "var(--eds-typography-caption1-fontWeight)" | "var(--eds-typography-caption1-letterSpacing)" | "var(--eds-typography-caption1-lineHeight)" | "var(--eds-typography-caption2-fontFamily)" | "var(--eds-typography-caption2-fontSize)" | "var(--eds-typography-caption2-fontWeight)" | "var(--eds-typography-caption2-letterSpacing)" | "var(--eds-typography-caption2-lineHeight)" | "var(--eds-typography-caption3-fontFamily)" | "var(--eds-typography-caption3-fontSize)" | "var(--eds-typography-caption3-fontWeight)" | "var(--eds-typography-caption3-letterSpacing)" | "var(--eds-typography-caption3-lineHeight)" | "var(--eds-typography-display1-fontFamily)" | "var(--eds-typography-display1-fontSize)" | "var(--eds-typography-display1-fontWeight)" | "var(--eds-typography-display1-letterSpacing)" | "var(--eds-typography-display1-lineHeight)" | "var(--eds-typography-display2-fontFamily)" | "var(--eds-typography-display2-fontSize)" | "var(--eds-typography-display2-fontWeight)" | "var(--eds-typography-display2-letterSpacing)" | "var(--eds-typography-display2-lineHeight)" | "var(--eds-typography-heading1-fontFamily)" | "var(--eds-typography-heading1-fontSize)" | "var(--eds-typography-heading1-fontWeight)" | "var(--eds-typography-heading1-letterSpacing)" | "var(--eds-typography-heading1-lineHeight)" | "var(--eds-typography-heading2-fontFamily)" | "var(--eds-typography-heading2-fontSize)" | "var(--eds-typography-heading2-fontWeight)" | "var(--eds-typography-heading2-letterSpacing)" | "var(--eds-typography-heading2-lineHeight)" | "var(--eds-typography-heading3-fontFamily)" | "var(--eds-typography-heading3-fontSize)" | "var(--eds-typography-heading3-fontWeight)" | "var(--eds-typography-heading3-letterSpacing)" | "var(--eds-typography-heading3-lineHeight)" | "var(--eds-typography-title1-fontFamily)" | "var(--eds-typography-title1-fontSize)" | "var(--eds-typography-title1-fontWeight)" | "var(--eds-typography-title1-letterSpacing)" | "var(--eds-typography-title1-lineHeight)" | "var(--eds-typography-title2-fontFamily)" | "var(--eds-typography-title2-fontSize)" | "var(--eds-typography-title2-fontWeight)" | "var(--eds-typography-title2-letterSpacing)" | "var(--eds-typography-title2-lineHeight)" | "var(--eds-typography-title3-fontFamily)" | "var(--eds-typography-title3-fontSize)" | "var(--eds-typography-title3-fontWeight)" | "var(--eds-typography-title3-letterSpacing)" | "var(--eds-typography-title3-lineHeight)" | "var(--eds-typography-title4-fontFamily)" | "var(--eds-typography-title4-fontSize)" | "var(--eds-typography-title4-fontWeight)" | "var(--eds-typography-title4-letterSpacing)" | "var(--eds-typography-title4-lineHeight)";
3
+ type SemanticTokenCssVariable = "--eds-color-bg-brand-primary" | "--eds-color-bg-brand-primary-hover" | "--eds-color-bg-critical-primary" | "--eds-color-bg-critical-primary-hover" | "--eds-color-bg-critical-weak" | "--eds-color-bg-critical-weak-hover" | "--eds-color-bg-disabled" | "--eds-color-bg-informative-primary" | "--eds-color-bg-informative-primary-hover" | "--eds-color-bg-informative-weak" | "--eds-color-bg-informative-weak-hover" | "--eds-color-bg-layer-basement" | "--eds-color-bg-layer-default" | "--eds-color-bg-layer-default-hover" | "--eds-color-bg-layer-floating" | "--eds-color-bg-layer-floating-hover" | "--eds-color-bg-neutral-inverted" | "--eds-color-bg-neutral-inverted-hover" | "--eds-color-bg-neutral-primary" | "--eds-color-bg-neutral-primary-hover" | "--eds-color-bg-neutral-weak" | "--eds-color-bg-neutral-weak-hover" | "--eds-color-bg-positive-primary" | "--eds-color-bg-positive-primary-hover" | "--eds-color-bg-positive-weak" | "--eds-color-bg-positive-weak-hover" | "--eds-color-bg-transparent" | "--eds-color-bg-transparent-hover" | "--eds-color-bg-warning-primary" | "--eds-color-bg-warning-primary-hover" | "--eds-color-bg-warning-weak" | "--eds-color-bg-warning-weak-hover" | "--eds-color-fg-brand" | "--eds-color-fg-brand-contrast" | "--eds-color-fg-critical" | "--eds-color-fg-critical-contrast" | "--eds-color-fg-disabled" | "--eds-color-fg-focus" | "--eds-color-fg-informative" | "--eds-color-fg-informative-contrast" | "--eds-color-fg-neutral" | "--eds-color-fg-neutral-inverted" | "--eds-color-fg-neutral-secondary" | "--eds-color-fg-neutral-tertiary" | "--eds-color-fg-placeholder" | "--eds-color-fg-positive" | "--eds-color-fg-positive-contrast" | "--eds-color-fg-warning" | "--eds-color-fg-warning-contrast" | "--eds-color-stroke-brand-primary" | "--eds-color-stroke-brand-weak" | "--eds-color-stroke-critical-primary" | "--eds-color-stroke-critical-weak" | "--eds-color-stroke-focusRing" | "--eds-color-stroke-informative-primary" | "--eds-color-stroke-informative-weak" | "--eds-color-stroke-neutral-contrast" | "--eds-color-stroke-neutral-primary" | "--eds-color-stroke-neutral-secondary" | "--eds-color-stroke-neutral-weak" | "--eds-color-stroke-positive-primary" | "--eds-color-stroke-positive-weak" | "--eds-color-stroke-warning-primary" | "--eds-color-stroke-warning-weak" | "--eds-typography-body1-fontFamily" | "--eds-typography-body1-fontSize" | "--eds-typography-body1-fontWeight" | "--eds-typography-body1-letterSpacing" | "--eds-typography-body1-lineHeight" | "--eds-typography-body2-fontFamily" | "--eds-typography-body2-fontSize" | "--eds-typography-body2-fontWeight" | "--eds-typography-body2-letterSpacing" | "--eds-typography-body2-lineHeight" | "--eds-typography-body3-fontFamily" | "--eds-typography-body3-fontSize" | "--eds-typography-body3-fontWeight" | "--eds-typography-body3-letterSpacing" | "--eds-typography-body3-lineHeight" | "--eds-typography-body4-fontFamily" | "--eds-typography-body4-fontSize" | "--eds-typography-body4-fontWeight" | "--eds-typography-body4-letterSpacing" | "--eds-typography-body4-lineHeight" | "--eds-typography-caption1-fontFamily" | "--eds-typography-caption1-fontSize" | "--eds-typography-caption1-fontWeight" | "--eds-typography-caption1-letterSpacing" | "--eds-typography-caption1-lineHeight" | "--eds-typography-caption2-fontFamily" | "--eds-typography-caption2-fontSize" | "--eds-typography-caption2-fontWeight" | "--eds-typography-caption2-letterSpacing" | "--eds-typography-caption2-lineHeight" | "--eds-typography-caption3-fontFamily" | "--eds-typography-caption3-fontSize" | "--eds-typography-caption3-fontWeight" | "--eds-typography-caption3-letterSpacing" | "--eds-typography-caption3-lineHeight" | "--eds-typography-display1-fontFamily" | "--eds-typography-display1-fontSize" | "--eds-typography-display1-fontWeight" | "--eds-typography-display1-letterSpacing" | "--eds-typography-display1-lineHeight" | "--eds-typography-display2-fontFamily" | "--eds-typography-display2-fontSize" | "--eds-typography-display2-fontWeight" | "--eds-typography-display2-letterSpacing" | "--eds-typography-display2-lineHeight" | "--eds-typography-heading1-fontFamily" | "--eds-typography-heading1-fontSize" | "--eds-typography-heading1-fontWeight" | "--eds-typography-heading1-letterSpacing" | "--eds-typography-heading1-lineHeight" | "--eds-typography-heading2-fontFamily" | "--eds-typography-heading2-fontSize" | "--eds-typography-heading2-fontWeight" | "--eds-typography-heading2-letterSpacing" | "--eds-typography-heading2-lineHeight" | "--eds-typography-heading3-fontFamily" | "--eds-typography-heading3-fontSize" | "--eds-typography-heading3-fontWeight" | "--eds-typography-heading3-letterSpacing" | "--eds-typography-heading3-lineHeight" | "--eds-typography-title1-fontFamily" | "--eds-typography-title1-fontSize" | "--eds-typography-title1-fontWeight" | "--eds-typography-title1-letterSpacing" | "--eds-typography-title1-lineHeight" | "--eds-typography-title2-fontFamily" | "--eds-typography-title2-fontSize" | "--eds-typography-title2-fontWeight" | "--eds-typography-title2-letterSpacing" | "--eds-typography-title2-lineHeight" | "--eds-typography-title3-fontFamily" | "--eds-typography-title3-fontSize" | "--eds-typography-title3-fontWeight" | "--eds-typography-title3-letterSpacing" | "--eds-typography-title3-lineHeight" | "--eds-typography-title4-fontFamily" | "--eds-typography-title4-fontSize" | "--eds-typography-title4-fontWeight" | "--eds-typography-title4-letterSpacing" | "--eds-typography-title4-lineHeight";
4
+ type SemanticTokenCssReference = "var(--eds-color-bg-brand-primary)" | "var(--eds-color-bg-brand-primary-hover)" | "var(--eds-color-bg-critical-primary)" | "var(--eds-color-bg-critical-primary-hover)" | "var(--eds-color-bg-critical-weak)" | "var(--eds-color-bg-critical-weak-hover)" | "var(--eds-color-bg-disabled)" | "var(--eds-color-bg-informative-primary)" | "var(--eds-color-bg-informative-primary-hover)" | "var(--eds-color-bg-informative-weak)" | "var(--eds-color-bg-informative-weak-hover)" | "var(--eds-color-bg-layer-basement)" | "var(--eds-color-bg-layer-default)" | "var(--eds-color-bg-layer-default-hover)" | "var(--eds-color-bg-layer-floating)" | "var(--eds-color-bg-layer-floating-hover)" | "var(--eds-color-bg-neutral-inverted)" | "var(--eds-color-bg-neutral-inverted-hover)" | "var(--eds-color-bg-neutral-primary)" | "var(--eds-color-bg-neutral-primary-hover)" | "var(--eds-color-bg-neutral-weak)" | "var(--eds-color-bg-neutral-weak-hover)" | "var(--eds-color-bg-positive-primary)" | "var(--eds-color-bg-positive-primary-hover)" | "var(--eds-color-bg-positive-weak)" | "var(--eds-color-bg-positive-weak-hover)" | "var(--eds-color-bg-transparent)" | "var(--eds-color-bg-transparent-hover)" | "var(--eds-color-bg-warning-primary)" | "var(--eds-color-bg-warning-primary-hover)" | "var(--eds-color-bg-warning-weak)" | "var(--eds-color-bg-warning-weak-hover)" | "var(--eds-color-fg-brand)" | "var(--eds-color-fg-brand-contrast)" | "var(--eds-color-fg-critical)" | "var(--eds-color-fg-critical-contrast)" | "var(--eds-color-fg-disabled)" | "var(--eds-color-fg-focus)" | "var(--eds-color-fg-informative)" | "var(--eds-color-fg-informative-contrast)" | "var(--eds-color-fg-neutral)" | "var(--eds-color-fg-neutral-inverted)" | "var(--eds-color-fg-neutral-secondary)" | "var(--eds-color-fg-neutral-tertiary)" | "var(--eds-color-fg-placeholder)" | "var(--eds-color-fg-positive)" | "var(--eds-color-fg-positive-contrast)" | "var(--eds-color-fg-warning)" | "var(--eds-color-fg-warning-contrast)" | "var(--eds-color-stroke-brand-primary)" | "var(--eds-color-stroke-brand-weak)" | "var(--eds-color-stroke-critical-primary)" | "var(--eds-color-stroke-critical-weak)" | "var(--eds-color-stroke-focusRing)" | "var(--eds-color-stroke-informative-primary)" | "var(--eds-color-stroke-informative-weak)" | "var(--eds-color-stroke-neutral-contrast)" | "var(--eds-color-stroke-neutral-primary)" | "var(--eds-color-stroke-neutral-secondary)" | "var(--eds-color-stroke-neutral-weak)" | "var(--eds-color-stroke-positive-primary)" | "var(--eds-color-stroke-positive-weak)" | "var(--eds-color-stroke-warning-primary)" | "var(--eds-color-stroke-warning-weak)" | "var(--eds-typography-body1-fontFamily)" | "var(--eds-typography-body1-fontSize)" | "var(--eds-typography-body1-fontWeight)" | "var(--eds-typography-body1-letterSpacing)" | "var(--eds-typography-body1-lineHeight)" | "var(--eds-typography-body2-fontFamily)" | "var(--eds-typography-body2-fontSize)" | "var(--eds-typography-body2-fontWeight)" | "var(--eds-typography-body2-letterSpacing)" | "var(--eds-typography-body2-lineHeight)" | "var(--eds-typography-body3-fontFamily)" | "var(--eds-typography-body3-fontSize)" | "var(--eds-typography-body3-fontWeight)" | "var(--eds-typography-body3-letterSpacing)" | "var(--eds-typography-body3-lineHeight)" | "var(--eds-typography-body4-fontFamily)" | "var(--eds-typography-body4-fontSize)" | "var(--eds-typography-body4-fontWeight)" | "var(--eds-typography-body4-letterSpacing)" | "var(--eds-typography-body4-lineHeight)" | "var(--eds-typography-caption1-fontFamily)" | "var(--eds-typography-caption1-fontSize)" | "var(--eds-typography-caption1-fontWeight)" | "var(--eds-typography-caption1-letterSpacing)" | "var(--eds-typography-caption1-lineHeight)" | "var(--eds-typography-caption2-fontFamily)" | "var(--eds-typography-caption2-fontSize)" | "var(--eds-typography-caption2-fontWeight)" | "var(--eds-typography-caption2-letterSpacing)" | "var(--eds-typography-caption2-lineHeight)" | "var(--eds-typography-caption3-fontFamily)" | "var(--eds-typography-caption3-fontSize)" | "var(--eds-typography-caption3-fontWeight)" | "var(--eds-typography-caption3-letterSpacing)" | "var(--eds-typography-caption3-lineHeight)" | "var(--eds-typography-display1-fontFamily)" | "var(--eds-typography-display1-fontSize)" | "var(--eds-typography-display1-fontWeight)" | "var(--eds-typography-display1-letterSpacing)" | "var(--eds-typography-display1-lineHeight)" | "var(--eds-typography-display2-fontFamily)" | "var(--eds-typography-display2-fontSize)" | "var(--eds-typography-display2-fontWeight)" | "var(--eds-typography-display2-letterSpacing)" | "var(--eds-typography-display2-lineHeight)" | "var(--eds-typography-heading1-fontFamily)" | "var(--eds-typography-heading1-fontSize)" | "var(--eds-typography-heading1-fontWeight)" | "var(--eds-typography-heading1-letterSpacing)" | "var(--eds-typography-heading1-lineHeight)" | "var(--eds-typography-heading2-fontFamily)" | "var(--eds-typography-heading2-fontSize)" | "var(--eds-typography-heading2-fontWeight)" | "var(--eds-typography-heading2-letterSpacing)" | "var(--eds-typography-heading2-lineHeight)" | "var(--eds-typography-heading3-fontFamily)" | "var(--eds-typography-heading3-fontSize)" | "var(--eds-typography-heading3-fontWeight)" | "var(--eds-typography-heading3-letterSpacing)" | "var(--eds-typography-heading3-lineHeight)" | "var(--eds-typography-title1-fontFamily)" | "var(--eds-typography-title1-fontSize)" | "var(--eds-typography-title1-fontWeight)" | "var(--eds-typography-title1-letterSpacing)" | "var(--eds-typography-title1-lineHeight)" | "var(--eds-typography-title2-fontFamily)" | "var(--eds-typography-title2-fontSize)" | "var(--eds-typography-title2-fontWeight)" | "var(--eds-typography-title2-letterSpacing)" | "var(--eds-typography-title2-lineHeight)" | "var(--eds-typography-title3-fontFamily)" | "var(--eds-typography-title3-fontSize)" | "var(--eds-typography-title3-fontWeight)" | "var(--eds-typography-title3-letterSpacing)" | "var(--eds-typography-title3-lineHeight)" | "var(--eds-typography-title4-fontFamily)" | "var(--eds-typography-title4-fontSize)" | "var(--eds-typography-title4-fontWeight)" | "var(--eds-typography-title4-letterSpacing)" | "var(--eds-typography-title4-lineHeight)";
5
5
  interface SemanticToken {
6
6
  readonly name: SemanticTokenName;
7
7
  readonly type: SemanticTokenType;
package/dist/tokens.d.ts CHANGED
@@ -1,7 +1,7 @@
1
- type SemanticTokenName = "color-bg-brand-primary" | "color-bg-brand-primary-hover" | "color-bg-critical-primary" | "color-bg-critical-primary-hover" | "color-bg-critical-weak" | "color-bg-critical-weak-hover" | "color-bg-disabled" | "color-bg-informative-primary" | "color-bg-informative-primary-hover" | "color-bg-informative-weak" | "color-bg-informative-weak-hover" | "color-bg-layer-basement" | "color-bg-layer-default" | "color-bg-layer-default-hover" | "color-bg-layer-floating" | "color-bg-layer-floating-hover" | "color-bg-neutral-inverted" | "color-bg-neutral-inverted-hover" | "color-bg-neutral-primary" | "color-bg-neutral-primary-hover" | "color-bg-neutral-weak" | "color-bg-neutral-weak-hover" | "color-bg-positive-primary" | "color-bg-positive-primary-hover" | "color-bg-positive-weak" | "color-bg-positive-weak-hover" | "color-bg-transparent" | "color-bg-transparent-hover" | "color-bg-warning-primary" | "color-bg-warning-primary-hover" | "color-bg-warning-weak" | "color-bg-warning-weak-hover" | "color-fg-brand" | "color-fg-brand-contrast" | "color-fg-critical" | "color-fg-critical-contrast" | "color-fg-disabled" | "color-fg-focus" | "color-fg-informative" | "color-fg-informative-contrast" | "color-fg-neutral" | "color-fg-neutral-inverted" | "color-fg-neutral-secondary" | "color-fg-neutral-tertiary" | "color-fg-placeholder" | "color-fg-positive" | "color-fg-positive-contrast" | "color-fg-warning" | "color-fg-warning-contrast" | "color-stroke-brand-primary" | "color-stroke-critical-primary" | "color-stroke-critical-weak" | "color-stroke-focusRing" | "color-stroke-informative-primary" | "color-stroke-informative-weak" | "color-stroke-neutral-contrast" | "color-stroke-neutral-primary" | "color-stroke-neutral-secondary" | "color-stroke-neutral-weak" | "color-stroke-positive-primary" | "color-stroke-positive-weak" | "color-stroke-warning-primary" | "color-stroke-warning-weak" | "typography-body1-fontFamily" | "typography-body1-fontSize" | "typography-body1-fontWeight" | "typography-body1-letterSpacing" | "typography-body1-lineHeight" | "typography-body2-fontFamily" | "typography-body2-fontSize" | "typography-body2-fontWeight" | "typography-body2-letterSpacing" | "typography-body2-lineHeight" | "typography-body3-fontFamily" | "typography-body3-fontSize" | "typography-body3-fontWeight" | "typography-body3-letterSpacing" | "typography-body3-lineHeight" | "typography-body4-fontFamily" | "typography-body4-fontSize" | "typography-body4-fontWeight" | "typography-body4-letterSpacing" | "typography-body4-lineHeight" | "typography-caption1-fontFamily" | "typography-caption1-fontSize" | "typography-caption1-fontWeight" | "typography-caption1-letterSpacing" | "typography-caption1-lineHeight" | "typography-caption2-fontFamily" | "typography-caption2-fontSize" | "typography-caption2-fontWeight" | "typography-caption2-letterSpacing" | "typography-caption2-lineHeight" | "typography-caption3-fontFamily" | "typography-caption3-fontSize" | "typography-caption3-fontWeight" | "typography-caption3-letterSpacing" | "typography-caption3-lineHeight" | "typography-display1-fontFamily" | "typography-display1-fontSize" | "typography-display1-fontWeight" | "typography-display1-letterSpacing" | "typography-display1-lineHeight" | "typography-display2-fontFamily" | "typography-display2-fontSize" | "typography-display2-fontWeight" | "typography-display2-letterSpacing" | "typography-display2-lineHeight" | "typography-heading1-fontFamily" | "typography-heading1-fontSize" | "typography-heading1-fontWeight" | "typography-heading1-letterSpacing" | "typography-heading1-lineHeight" | "typography-heading2-fontFamily" | "typography-heading2-fontSize" | "typography-heading2-fontWeight" | "typography-heading2-letterSpacing" | "typography-heading2-lineHeight" | "typography-heading3-fontFamily" | "typography-heading3-fontSize" | "typography-heading3-fontWeight" | "typography-heading3-letterSpacing" | "typography-heading3-lineHeight" | "typography-title1-fontFamily" | "typography-title1-fontSize" | "typography-title1-fontWeight" | "typography-title1-letterSpacing" | "typography-title1-lineHeight" | "typography-title2-fontFamily" | "typography-title2-fontSize" | "typography-title2-fontWeight" | "typography-title2-letterSpacing" | "typography-title2-lineHeight" | "typography-title3-fontFamily" | "typography-title3-fontSize" | "typography-title3-fontWeight" | "typography-title3-letterSpacing" | "typography-title3-lineHeight" | "typography-title4-fontFamily" | "typography-title4-fontSize" | "typography-title4-fontWeight" | "typography-title4-letterSpacing" | "typography-title4-lineHeight";
1
+ type SemanticTokenName = "color-bg-brand-primary" | "color-bg-brand-primary-hover" | "color-bg-critical-primary" | "color-bg-critical-primary-hover" | "color-bg-critical-weak" | "color-bg-critical-weak-hover" | "color-bg-disabled" | "color-bg-informative-primary" | "color-bg-informative-primary-hover" | "color-bg-informative-weak" | "color-bg-informative-weak-hover" | "color-bg-layer-basement" | "color-bg-layer-default" | "color-bg-layer-default-hover" | "color-bg-layer-floating" | "color-bg-layer-floating-hover" | "color-bg-neutral-inverted" | "color-bg-neutral-inverted-hover" | "color-bg-neutral-primary" | "color-bg-neutral-primary-hover" | "color-bg-neutral-weak" | "color-bg-neutral-weak-hover" | "color-bg-positive-primary" | "color-bg-positive-primary-hover" | "color-bg-positive-weak" | "color-bg-positive-weak-hover" | "color-bg-transparent" | "color-bg-transparent-hover" | "color-bg-warning-primary" | "color-bg-warning-primary-hover" | "color-bg-warning-weak" | "color-bg-warning-weak-hover" | "color-fg-brand" | "color-fg-brand-contrast" | "color-fg-critical" | "color-fg-critical-contrast" | "color-fg-disabled" | "color-fg-focus" | "color-fg-informative" | "color-fg-informative-contrast" | "color-fg-neutral" | "color-fg-neutral-inverted" | "color-fg-neutral-secondary" | "color-fg-neutral-tertiary" | "color-fg-placeholder" | "color-fg-positive" | "color-fg-positive-contrast" | "color-fg-warning" | "color-fg-warning-contrast" | "color-stroke-brand-primary" | "color-stroke-brand-weak" | "color-stroke-critical-primary" | "color-stroke-critical-weak" | "color-stroke-focusRing" | "color-stroke-informative-primary" | "color-stroke-informative-weak" | "color-stroke-neutral-contrast" | "color-stroke-neutral-primary" | "color-stroke-neutral-secondary" | "color-stroke-neutral-weak" | "color-stroke-positive-primary" | "color-stroke-positive-weak" | "color-stroke-warning-primary" | "color-stroke-warning-weak" | "typography-body1-fontFamily" | "typography-body1-fontSize" | "typography-body1-fontWeight" | "typography-body1-letterSpacing" | "typography-body1-lineHeight" | "typography-body2-fontFamily" | "typography-body2-fontSize" | "typography-body2-fontWeight" | "typography-body2-letterSpacing" | "typography-body2-lineHeight" | "typography-body3-fontFamily" | "typography-body3-fontSize" | "typography-body3-fontWeight" | "typography-body3-letterSpacing" | "typography-body3-lineHeight" | "typography-body4-fontFamily" | "typography-body4-fontSize" | "typography-body4-fontWeight" | "typography-body4-letterSpacing" | "typography-body4-lineHeight" | "typography-caption1-fontFamily" | "typography-caption1-fontSize" | "typography-caption1-fontWeight" | "typography-caption1-letterSpacing" | "typography-caption1-lineHeight" | "typography-caption2-fontFamily" | "typography-caption2-fontSize" | "typography-caption2-fontWeight" | "typography-caption2-letterSpacing" | "typography-caption2-lineHeight" | "typography-caption3-fontFamily" | "typography-caption3-fontSize" | "typography-caption3-fontWeight" | "typography-caption3-letterSpacing" | "typography-caption3-lineHeight" | "typography-display1-fontFamily" | "typography-display1-fontSize" | "typography-display1-fontWeight" | "typography-display1-letterSpacing" | "typography-display1-lineHeight" | "typography-display2-fontFamily" | "typography-display2-fontSize" | "typography-display2-fontWeight" | "typography-display2-letterSpacing" | "typography-display2-lineHeight" | "typography-heading1-fontFamily" | "typography-heading1-fontSize" | "typography-heading1-fontWeight" | "typography-heading1-letterSpacing" | "typography-heading1-lineHeight" | "typography-heading2-fontFamily" | "typography-heading2-fontSize" | "typography-heading2-fontWeight" | "typography-heading2-letterSpacing" | "typography-heading2-lineHeight" | "typography-heading3-fontFamily" | "typography-heading3-fontSize" | "typography-heading3-fontWeight" | "typography-heading3-letterSpacing" | "typography-heading3-lineHeight" | "typography-title1-fontFamily" | "typography-title1-fontSize" | "typography-title1-fontWeight" | "typography-title1-letterSpacing" | "typography-title1-lineHeight" | "typography-title2-fontFamily" | "typography-title2-fontSize" | "typography-title2-fontWeight" | "typography-title2-letterSpacing" | "typography-title2-lineHeight" | "typography-title3-fontFamily" | "typography-title3-fontSize" | "typography-title3-fontWeight" | "typography-title3-letterSpacing" | "typography-title3-lineHeight" | "typography-title4-fontFamily" | "typography-title4-fontSize" | "typography-title4-fontWeight" | "typography-title4-letterSpacing" | "typography-title4-lineHeight";
2
2
  type SemanticTokenType = "color" | "dimension" | "fontFamily" | "fontWeight";
3
- type SemanticTokenCssVariable = "--eds-color-bg-brand-primary" | "--eds-color-bg-brand-primary-hover" | "--eds-color-bg-critical-primary" | "--eds-color-bg-critical-primary-hover" | "--eds-color-bg-critical-weak" | "--eds-color-bg-critical-weak-hover" | "--eds-color-bg-disabled" | "--eds-color-bg-informative-primary" | "--eds-color-bg-informative-primary-hover" | "--eds-color-bg-informative-weak" | "--eds-color-bg-informative-weak-hover" | "--eds-color-bg-layer-basement" | "--eds-color-bg-layer-default" | "--eds-color-bg-layer-default-hover" | "--eds-color-bg-layer-floating" | "--eds-color-bg-layer-floating-hover" | "--eds-color-bg-neutral-inverted" | "--eds-color-bg-neutral-inverted-hover" | "--eds-color-bg-neutral-primary" | "--eds-color-bg-neutral-primary-hover" | "--eds-color-bg-neutral-weak" | "--eds-color-bg-neutral-weak-hover" | "--eds-color-bg-positive-primary" | "--eds-color-bg-positive-primary-hover" | "--eds-color-bg-positive-weak" | "--eds-color-bg-positive-weak-hover" | "--eds-color-bg-transparent" | "--eds-color-bg-transparent-hover" | "--eds-color-bg-warning-primary" | "--eds-color-bg-warning-primary-hover" | "--eds-color-bg-warning-weak" | "--eds-color-bg-warning-weak-hover" | "--eds-color-fg-brand" | "--eds-color-fg-brand-contrast" | "--eds-color-fg-critical" | "--eds-color-fg-critical-contrast" | "--eds-color-fg-disabled" | "--eds-color-fg-focus" | "--eds-color-fg-informative" | "--eds-color-fg-informative-contrast" | "--eds-color-fg-neutral" | "--eds-color-fg-neutral-inverted" | "--eds-color-fg-neutral-secondary" | "--eds-color-fg-neutral-tertiary" | "--eds-color-fg-placeholder" | "--eds-color-fg-positive" | "--eds-color-fg-positive-contrast" | "--eds-color-fg-warning" | "--eds-color-fg-warning-contrast" | "--eds-color-stroke-brand-primary" | "--eds-color-stroke-critical-primary" | "--eds-color-stroke-critical-weak" | "--eds-color-stroke-focusRing" | "--eds-color-stroke-informative-primary" | "--eds-color-stroke-informative-weak" | "--eds-color-stroke-neutral-contrast" | "--eds-color-stroke-neutral-primary" | "--eds-color-stroke-neutral-secondary" | "--eds-color-stroke-neutral-weak" | "--eds-color-stroke-positive-primary" | "--eds-color-stroke-positive-weak" | "--eds-color-stroke-warning-primary" | "--eds-color-stroke-warning-weak" | "--eds-typography-body1-fontFamily" | "--eds-typography-body1-fontSize" | "--eds-typography-body1-fontWeight" | "--eds-typography-body1-letterSpacing" | "--eds-typography-body1-lineHeight" | "--eds-typography-body2-fontFamily" | "--eds-typography-body2-fontSize" | "--eds-typography-body2-fontWeight" | "--eds-typography-body2-letterSpacing" | "--eds-typography-body2-lineHeight" | "--eds-typography-body3-fontFamily" | "--eds-typography-body3-fontSize" | "--eds-typography-body3-fontWeight" | "--eds-typography-body3-letterSpacing" | "--eds-typography-body3-lineHeight" | "--eds-typography-body4-fontFamily" | "--eds-typography-body4-fontSize" | "--eds-typography-body4-fontWeight" | "--eds-typography-body4-letterSpacing" | "--eds-typography-body4-lineHeight" | "--eds-typography-caption1-fontFamily" | "--eds-typography-caption1-fontSize" | "--eds-typography-caption1-fontWeight" | "--eds-typography-caption1-letterSpacing" | "--eds-typography-caption1-lineHeight" | "--eds-typography-caption2-fontFamily" | "--eds-typography-caption2-fontSize" | "--eds-typography-caption2-fontWeight" | "--eds-typography-caption2-letterSpacing" | "--eds-typography-caption2-lineHeight" | "--eds-typography-caption3-fontFamily" | "--eds-typography-caption3-fontSize" | "--eds-typography-caption3-fontWeight" | "--eds-typography-caption3-letterSpacing" | "--eds-typography-caption3-lineHeight" | "--eds-typography-display1-fontFamily" | "--eds-typography-display1-fontSize" | "--eds-typography-display1-fontWeight" | "--eds-typography-display1-letterSpacing" | "--eds-typography-display1-lineHeight" | "--eds-typography-display2-fontFamily" | "--eds-typography-display2-fontSize" | "--eds-typography-display2-fontWeight" | "--eds-typography-display2-letterSpacing" | "--eds-typography-display2-lineHeight" | "--eds-typography-heading1-fontFamily" | "--eds-typography-heading1-fontSize" | "--eds-typography-heading1-fontWeight" | "--eds-typography-heading1-letterSpacing" | "--eds-typography-heading1-lineHeight" | "--eds-typography-heading2-fontFamily" | "--eds-typography-heading2-fontSize" | "--eds-typography-heading2-fontWeight" | "--eds-typography-heading2-letterSpacing" | "--eds-typography-heading2-lineHeight" | "--eds-typography-heading3-fontFamily" | "--eds-typography-heading3-fontSize" | "--eds-typography-heading3-fontWeight" | "--eds-typography-heading3-letterSpacing" | "--eds-typography-heading3-lineHeight" | "--eds-typography-title1-fontFamily" | "--eds-typography-title1-fontSize" | "--eds-typography-title1-fontWeight" | "--eds-typography-title1-letterSpacing" | "--eds-typography-title1-lineHeight" | "--eds-typography-title2-fontFamily" | "--eds-typography-title2-fontSize" | "--eds-typography-title2-fontWeight" | "--eds-typography-title2-letterSpacing" | "--eds-typography-title2-lineHeight" | "--eds-typography-title3-fontFamily" | "--eds-typography-title3-fontSize" | "--eds-typography-title3-fontWeight" | "--eds-typography-title3-letterSpacing" | "--eds-typography-title3-lineHeight" | "--eds-typography-title4-fontFamily" | "--eds-typography-title4-fontSize" | "--eds-typography-title4-fontWeight" | "--eds-typography-title4-letterSpacing" | "--eds-typography-title4-lineHeight";
4
- type SemanticTokenCssReference = "var(--eds-color-bg-brand-primary)" | "var(--eds-color-bg-brand-primary-hover)" | "var(--eds-color-bg-critical-primary)" | "var(--eds-color-bg-critical-primary-hover)" | "var(--eds-color-bg-critical-weak)" | "var(--eds-color-bg-critical-weak-hover)" | "var(--eds-color-bg-disabled)" | "var(--eds-color-bg-informative-primary)" | "var(--eds-color-bg-informative-primary-hover)" | "var(--eds-color-bg-informative-weak)" | "var(--eds-color-bg-informative-weak-hover)" | "var(--eds-color-bg-layer-basement)" | "var(--eds-color-bg-layer-default)" | "var(--eds-color-bg-layer-default-hover)" | "var(--eds-color-bg-layer-floating)" | "var(--eds-color-bg-layer-floating-hover)" | "var(--eds-color-bg-neutral-inverted)" | "var(--eds-color-bg-neutral-inverted-hover)" | "var(--eds-color-bg-neutral-primary)" | "var(--eds-color-bg-neutral-primary-hover)" | "var(--eds-color-bg-neutral-weak)" | "var(--eds-color-bg-neutral-weak-hover)" | "var(--eds-color-bg-positive-primary)" | "var(--eds-color-bg-positive-primary-hover)" | "var(--eds-color-bg-positive-weak)" | "var(--eds-color-bg-positive-weak-hover)" | "var(--eds-color-bg-transparent)" | "var(--eds-color-bg-transparent-hover)" | "var(--eds-color-bg-warning-primary)" | "var(--eds-color-bg-warning-primary-hover)" | "var(--eds-color-bg-warning-weak)" | "var(--eds-color-bg-warning-weak-hover)" | "var(--eds-color-fg-brand)" | "var(--eds-color-fg-brand-contrast)" | "var(--eds-color-fg-critical)" | "var(--eds-color-fg-critical-contrast)" | "var(--eds-color-fg-disabled)" | "var(--eds-color-fg-focus)" | "var(--eds-color-fg-informative)" | "var(--eds-color-fg-informative-contrast)" | "var(--eds-color-fg-neutral)" | "var(--eds-color-fg-neutral-inverted)" | "var(--eds-color-fg-neutral-secondary)" | "var(--eds-color-fg-neutral-tertiary)" | "var(--eds-color-fg-placeholder)" | "var(--eds-color-fg-positive)" | "var(--eds-color-fg-positive-contrast)" | "var(--eds-color-fg-warning)" | "var(--eds-color-fg-warning-contrast)" | "var(--eds-color-stroke-brand-primary)" | "var(--eds-color-stroke-critical-primary)" | "var(--eds-color-stroke-critical-weak)" | "var(--eds-color-stroke-focusRing)" | "var(--eds-color-stroke-informative-primary)" | "var(--eds-color-stroke-informative-weak)" | "var(--eds-color-stroke-neutral-contrast)" | "var(--eds-color-stroke-neutral-primary)" | "var(--eds-color-stroke-neutral-secondary)" | "var(--eds-color-stroke-neutral-weak)" | "var(--eds-color-stroke-positive-primary)" | "var(--eds-color-stroke-positive-weak)" | "var(--eds-color-stroke-warning-primary)" | "var(--eds-color-stroke-warning-weak)" | "var(--eds-typography-body1-fontFamily)" | "var(--eds-typography-body1-fontSize)" | "var(--eds-typography-body1-fontWeight)" | "var(--eds-typography-body1-letterSpacing)" | "var(--eds-typography-body1-lineHeight)" | "var(--eds-typography-body2-fontFamily)" | "var(--eds-typography-body2-fontSize)" | "var(--eds-typography-body2-fontWeight)" | "var(--eds-typography-body2-letterSpacing)" | "var(--eds-typography-body2-lineHeight)" | "var(--eds-typography-body3-fontFamily)" | "var(--eds-typography-body3-fontSize)" | "var(--eds-typography-body3-fontWeight)" | "var(--eds-typography-body3-letterSpacing)" | "var(--eds-typography-body3-lineHeight)" | "var(--eds-typography-body4-fontFamily)" | "var(--eds-typography-body4-fontSize)" | "var(--eds-typography-body4-fontWeight)" | "var(--eds-typography-body4-letterSpacing)" | "var(--eds-typography-body4-lineHeight)" | "var(--eds-typography-caption1-fontFamily)" | "var(--eds-typography-caption1-fontSize)" | "var(--eds-typography-caption1-fontWeight)" | "var(--eds-typography-caption1-letterSpacing)" | "var(--eds-typography-caption1-lineHeight)" | "var(--eds-typography-caption2-fontFamily)" | "var(--eds-typography-caption2-fontSize)" | "var(--eds-typography-caption2-fontWeight)" | "var(--eds-typography-caption2-letterSpacing)" | "var(--eds-typography-caption2-lineHeight)" | "var(--eds-typography-caption3-fontFamily)" | "var(--eds-typography-caption3-fontSize)" | "var(--eds-typography-caption3-fontWeight)" | "var(--eds-typography-caption3-letterSpacing)" | "var(--eds-typography-caption3-lineHeight)" | "var(--eds-typography-display1-fontFamily)" | "var(--eds-typography-display1-fontSize)" | "var(--eds-typography-display1-fontWeight)" | "var(--eds-typography-display1-letterSpacing)" | "var(--eds-typography-display1-lineHeight)" | "var(--eds-typography-display2-fontFamily)" | "var(--eds-typography-display2-fontSize)" | "var(--eds-typography-display2-fontWeight)" | "var(--eds-typography-display2-letterSpacing)" | "var(--eds-typography-display2-lineHeight)" | "var(--eds-typography-heading1-fontFamily)" | "var(--eds-typography-heading1-fontSize)" | "var(--eds-typography-heading1-fontWeight)" | "var(--eds-typography-heading1-letterSpacing)" | "var(--eds-typography-heading1-lineHeight)" | "var(--eds-typography-heading2-fontFamily)" | "var(--eds-typography-heading2-fontSize)" | "var(--eds-typography-heading2-fontWeight)" | "var(--eds-typography-heading2-letterSpacing)" | "var(--eds-typography-heading2-lineHeight)" | "var(--eds-typography-heading3-fontFamily)" | "var(--eds-typography-heading3-fontSize)" | "var(--eds-typography-heading3-fontWeight)" | "var(--eds-typography-heading3-letterSpacing)" | "var(--eds-typography-heading3-lineHeight)" | "var(--eds-typography-title1-fontFamily)" | "var(--eds-typography-title1-fontSize)" | "var(--eds-typography-title1-fontWeight)" | "var(--eds-typography-title1-letterSpacing)" | "var(--eds-typography-title1-lineHeight)" | "var(--eds-typography-title2-fontFamily)" | "var(--eds-typography-title2-fontSize)" | "var(--eds-typography-title2-fontWeight)" | "var(--eds-typography-title2-letterSpacing)" | "var(--eds-typography-title2-lineHeight)" | "var(--eds-typography-title3-fontFamily)" | "var(--eds-typography-title3-fontSize)" | "var(--eds-typography-title3-fontWeight)" | "var(--eds-typography-title3-letterSpacing)" | "var(--eds-typography-title3-lineHeight)" | "var(--eds-typography-title4-fontFamily)" | "var(--eds-typography-title4-fontSize)" | "var(--eds-typography-title4-fontWeight)" | "var(--eds-typography-title4-letterSpacing)" | "var(--eds-typography-title4-lineHeight)";
3
+ type SemanticTokenCssVariable = "--eds-color-bg-brand-primary" | "--eds-color-bg-brand-primary-hover" | "--eds-color-bg-critical-primary" | "--eds-color-bg-critical-primary-hover" | "--eds-color-bg-critical-weak" | "--eds-color-bg-critical-weak-hover" | "--eds-color-bg-disabled" | "--eds-color-bg-informative-primary" | "--eds-color-bg-informative-primary-hover" | "--eds-color-bg-informative-weak" | "--eds-color-bg-informative-weak-hover" | "--eds-color-bg-layer-basement" | "--eds-color-bg-layer-default" | "--eds-color-bg-layer-default-hover" | "--eds-color-bg-layer-floating" | "--eds-color-bg-layer-floating-hover" | "--eds-color-bg-neutral-inverted" | "--eds-color-bg-neutral-inverted-hover" | "--eds-color-bg-neutral-primary" | "--eds-color-bg-neutral-primary-hover" | "--eds-color-bg-neutral-weak" | "--eds-color-bg-neutral-weak-hover" | "--eds-color-bg-positive-primary" | "--eds-color-bg-positive-primary-hover" | "--eds-color-bg-positive-weak" | "--eds-color-bg-positive-weak-hover" | "--eds-color-bg-transparent" | "--eds-color-bg-transparent-hover" | "--eds-color-bg-warning-primary" | "--eds-color-bg-warning-primary-hover" | "--eds-color-bg-warning-weak" | "--eds-color-bg-warning-weak-hover" | "--eds-color-fg-brand" | "--eds-color-fg-brand-contrast" | "--eds-color-fg-critical" | "--eds-color-fg-critical-contrast" | "--eds-color-fg-disabled" | "--eds-color-fg-focus" | "--eds-color-fg-informative" | "--eds-color-fg-informative-contrast" | "--eds-color-fg-neutral" | "--eds-color-fg-neutral-inverted" | "--eds-color-fg-neutral-secondary" | "--eds-color-fg-neutral-tertiary" | "--eds-color-fg-placeholder" | "--eds-color-fg-positive" | "--eds-color-fg-positive-contrast" | "--eds-color-fg-warning" | "--eds-color-fg-warning-contrast" | "--eds-color-stroke-brand-primary" | "--eds-color-stroke-brand-weak" | "--eds-color-stroke-critical-primary" | "--eds-color-stroke-critical-weak" | "--eds-color-stroke-focusRing" | "--eds-color-stroke-informative-primary" | "--eds-color-stroke-informative-weak" | "--eds-color-stroke-neutral-contrast" | "--eds-color-stroke-neutral-primary" | "--eds-color-stroke-neutral-secondary" | "--eds-color-stroke-neutral-weak" | "--eds-color-stroke-positive-primary" | "--eds-color-stroke-positive-weak" | "--eds-color-stroke-warning-primary" | "--eds-color-stroke-warning-weak" | "--eds-typography-body1-fontFamily" | "--eds-typography-body1-fontSize" | "--eds-typography-body1-fontWeight" | "--eds-typography-body1-letterSpacing" | "--eds-typography-body1-lineHeight" | "--eds-typography-body2-fontFamily" | "--eds-typography-body2-fontSize" | "--eds-typography-body2-fontWeight" | "--eds-typography-body2-letterSpacing" | "--eds-typography-body2-lineHeight" | "--eds-typography-body3-fontFamily" | "--eds-typography-body3-fontSize" | "--eds-typography-body3-fontWeight" | "--eds-typography-body3-letterSpacing" | "--eds-typography-body3-lineHeight" | "--eds-typography-body4-fontFamily" | "--eds-typography-body4-fontSize" | "--eds-typography-body4-fontWeight" | "--eds-typography-body4-letterSpacing" | "--eds-typography-body4-lineHeight" | "--eds-typography-caption1-fontFamily" | "--eds-typography-caption1-fontSize" | "--eds-typography-caption1-fontWeight" | "--eds-typography-caption1-letterSpacing" | "--eds-typography-caption1-lineHeight" | "--eds-typography-caption2-fontFamily" | "--eds-typography-caption2-fontSize" | "--eds-typography-caption2-fontWeight" | "--eds-typography-caption2-letterSpacing" | "--eds-typography-caption2-lineHeight" | "--eds-typography-caption3-fontFamily" | "--eds-typography-caption3-fontSize" | "--eds-typography-caption3-fontWeight" | "--eds-typography-caption3-letterSpacing" | "--eds-typography-caption3-lineHeight" | "--eds-typography-display1-fontFamily" | "--eds-typography-display1-fontSize" | "--eds-typography-display1-fontWeight" | "--eds-typography-display1-letterSpacing" | "--eds-typography-display1-lineHeight" | "--eds-typography-display2-fontFamily" | "--eds-typography-display2-fontSize" | "--eds-typography-display2-fontWeight" | "--eds-typography-display2-letterSpacing" | "--eds-typography-display2-lineHeight" | "--eds-typography-heading1-fontFamily" | "--eds-typography-heading1-fontSize" | "--eds-typography-heading1-fontWeight" | "--eds-typography-heading1-letterSpacing" | "--eds-typography-heading1-lineHeight" | "--eds-typography-heading2-fontFamily" | "--eds-typography-heading2-fontSize" | "--eds-typography-heading2-fontWeight" | "--eds-typography-heading2-letterSpacing" | "--eds-typography-heading2-lineHeight" | "--eds-typography-heading3-fontFamily" | "--eds-typography-heading3-fontSize" | "--eds-typography-heading3-fontWeight" | "--eds-typography-heading3-letterSpacing" | "--eds-typography-heading3-lineHeight" | "--eds-typography-title1-fontFamily" | "--eds-typography-title1-fontSize" | "--eds-typography-title1-fontWeight" | "--eds-typography-title1-letterSpacing" | "--eds-typography-title1-lineHeight" | "--eds-typography-title2-fontFamily" | "--eds-typography-title2-fontSize" | "--eds-typography-title2-fontWeight" | "--eds-typography-title2-letterSpacing" | "--eds-typography-title2-lineHeight" | "--eds-typography-title3-fontFamily" | "--eds-typography-title3-fontSize" | "--eds-typography-title3-fontWeight" | "--eds-typography-title3-letterSpacing" | "--eds-typography-title3-lineHeight" | "--eds-typography-title4-fontFamily" | "--eds-typography-title4-fontSize" | "--eds-typography-title4-fontWeight" | "--eds-typography-title4-letterSpacing" | "--eds-typography-title4-lineHeight";
4
+ type SemanticTokenCssReference = "var(--eds-color-bg-brand-primary)" | "var(--eds-color-bg-brand-primary-hover)" | "var(--eds-color-bg-critical-primary)" | "var(--eds-color-bg-critical-primary-hover)" | "var(--eds-color-bg-critical-weak)" | "var(--eds-color-bg-critical-weak-hover)" | "var(--eds-color-bg-disabled)" | "var(--eds-color-bg-informative-primary)" | "var(--eds-color-bg-informative-primary-hover)" | "var(--eds-color-bg-informative-weak)" | "var(--eds-color-bg-informative-weak-hover)" | "var(--eds-color-bg-layer-basement)" | "var(--eds-color-bg-layer-default)" | "var(--eds-color-bg-layer-default-hover)" | "var(--eds-color-bg-layer-floating)" | "var(--eds-color-bg-layer-floating-hover)" | "var(--eds-color-bg-neutral-inverted)" | "var(--eds-color-bg-neutral-inverted-hover)" | "var(--eds-color-bg-neutral-primary)" | "var(--eds-color-bg-neutral-primary-hover)" | "var(--eds-color-bg-neutral-weak)" | "var(--eds-color-bg-neutral-weak-hover)" | "var(--eds-color-bg-positive-primary)" | "var(--eds-color-bg-positive-primary-hover)" | "var(--eds-color-bg-positive-weak)" | "var(--eds-color-bg-positive-weak-hover)" | "var(--eds-color-bg-transparent)" | "var(--eds-color-bg-transparent-hover)" | "var(--eds-color-bg-warning-primary)" | "var(--eds-color-bg-warning-primary-hover)" | "var(--eds-color-bg-warning-weak)" | "var(--eds-color-bg-warning-weak-hover)" | "var(--eds-color-fg-brand)" | "var(--eds-color-fg-brand-contrast)" | "var(--eds-color-fg-critical)" | "var(--eds-color-fg-critical-contrast)" | "var(--eds-color-fg-disabled)" | "var(--eds-color-fg-focus)" | "var(--eds-color-fg-informative)" | "var(--eds-color-fg-informative-contrast)" | "var(--eds-color-fg-neutral)" | "var(--eds-color-fg-neutral-inverted)" | "var(--eds-color-fg-neutral-secondary)" | "var(--eds-color-fg-neutral-tertiary)" | "var(--eds-color-fg-placeholder)" | "var(--eds-color-fg-positive)" | "var(--eds-color-fg-positive-contrast)" | "var(--eds-color-fg-warning)" | "var(--eds-color-fg-warning-contrast)" | "var(--eds-color-stroke-brand-primary)" | "var(--eds-color-stroke-brand-weak)" | "var(--eds-color-stroke-critical-primary)" | "var(--eds-color-stroke-critical-weak)" | "var(--eds-color-stroke-focusRing)" | "var(--eds-color-stroke-informative-primary)" | "var(--eds-color-stroke-informative-weak)" | "var(--eds-color-stroke-neutral-contrast)" | "var(--eds-color-stroke-neutral-primary)" | "var(--eds-color-stroke-neutral-secondary)" | "var(--eds-color-stroke-neutral-weak)" | "var(--eds-color-stroke-positive-primary)" | "var(--eds-color-stroke-positive-weak)" | "var(--eds-color-stroke-warning-primary)" | "var(--eds-color-stroke-warning-weak)" | "var(--eds-typography-body1-fontFamily)" | "var(--eds-typography-body1-fontSize)" | "var(--eds-typography-body1-fontWeight)" | "var(--eds-typography-body1-letterSpacing)" | "var(--eds-typography-body1-lineHeight)" | "var(--eds-typography-body2-fontFamily)" | "var(--eds-typography-body2-fontSize)" | "var(--eds-typography-body2-fontWeight)" | "var(--eds-typography-body2-letterSpacing)" | "var(--eds-typography-body2-lineHeight)" | "var(--eds-typography-body3-fontFamily)" | "var(--eds-typography-body3-fontSize)" | "var(--eds-typography-body3-fontWeight)" | "var(--eds-typography-body3-letterSpacing)" | "var(--eds-typography-body3-lineHeight)" | "var(--eds-typography-body4-fontFamily)" | "var(--eds-typography-body4-fontSize)" | "var(--eds-typography-body4-fontWeight)" | "var(--eds-typography-body4-letterSpacing)" | "var(--eds-typography-body4-lineHeight)" | "var(--eds-typography-caption1-fontFamily)" | "var(--eds-typography-caption1-fontSize)" | "var(--eds-typography-caption1-fontWeight)" | "var(--eds-typography-caption1-letterSpacing)" | "var(--eds-typography-caption1-lineHeight)" | "var(--eds-typography-caption2-fontFamily)" | "var(--eds-typography-caption2-fontSize)" | "var(--eds-typography-caption2-fontWeight)" | "var(--eds-typography-caption2-letterSpacing)" | "var(--eds-typography-caption2-lineHeight)" | "var(--eds-typography-caption3-fontFamily)" | "var(--eds-typography-caption3-fontSize)" | "var(--eds-typography-caption3-fontWeight)" | "var(--eds-typography-caption3-letterSpacing)" | "var(--eds-typography-caption3-lineHeight)" | "var(--eds-typography-display1-fontFamily)" | "var(--eds-typography-display1-fontSize)" | "var(--eds-typography-display1-fontWeight)" | "var(--eds-typography-display1-letterSpacing)" | "var(--eds-typography-display1-lineHeight)" | "var(--eds-typography-display2-fontFamily)" | "var(--eds-typography-display2-fontSize)" | "var(--eds-typography-display2-fontWeight)" | "var(--eds-typography-display2-letterSpacing)" | "var(--eds-typography-display2-lineHeight)" | "var(--eds-typography-heading1-fontFamily)" | "var(--eds-typography-heading1-fontSize)" | "var(--eds-typography-heading1-fontWeight)" | "var(--eds-typography-heading1-letterSpacing)" | "var(--eds-typography-heading1-lineHeight)" | "var(--eds-typography-heading2-fontFamily)" | "var(--eds-typography-heading2-fontSize)" | "var(--eds-typography-heading2-fontWeight)" | "var(--eds-typography-heading2-letterSpacing)" | "var(--eds-typography-heading2-lineHeight)" | "var(--eds-typography-heading3-fontFamily)" | "var(--eds-typography-heading3-fontSize)" | "var(--eds-typography-heading3-fontWeight)" | "var(--eds-typography-heading3-letterSpacing)" | "var(--eds-typography-heading3-lineHeight)" | "var(--eds-typography-title1-fontFamily)" | "var(--eds-typography-title1-fontSize)" | "var(--eds-typography-title1-fontWeight)" | "var(--eds-typography-title1-letterSpacing)" | "var(--eds-typography-title1-lineHeight)" | "var(--eds-typography-title2-fontFamily)" | "var(--eds-typography-title2-fontSize)" | "var(--eds-typography-title2-fontWeight)" | "var(--eds-typography-title2-letterSpacing)" | "var(--eds-typography-title2-lineHeight)" | "var(--eds-typography-title3-fontFamily)" | "var(--eds-typography-title3-fontSize)" | "var(--eds-typography-title3-fontWeight)" | "var(--eds-typography-title3-letterSpacing)" | "var(--eds-typography-title3-lineHeight)" | "var(--eds-typography-title4-fontFamily)" | "var(--eds-typography-title4-fontSize)" | "var(--eds-typography-title4-fontWeight)" | "var(--eds-typography-title4-letterSpacing)" | "var(--eds-typography-title4-lineHeight)";
5
5
  interface SemanticToken {
6
6
  readonly name: SemanticTokenName;
7
7
  readonly type: SemanticTokenType;
package/dist/tokens.js CHANGED
@@ -77,7 +77,7 @@ var tokenMap = {
77
77
  "color-bg-layer-default": {
78
78
  "name": "color-bg-layer-default",
79
79
  "type": "color",
80
- "value": "#FFFFFF",
80
+ "value": "#FFFFFFFF",
81
81
  "cssVariable": "--eds-color-bg-layer-default"
82
82
  },
83
83
  "color-bg-layer-default-hover": {
@@ -89,7 +89,7 @@ var tokenMap = {
89
89
  "color-bg-layer-floating": {
90
90
  "name": "color-bg-layer-floating",
91
91
  "type": "color",
92
- "value": "#FFFFFF",
92
+ "value": "#FFFFFFFF",
93
93
  "cssVariable": "--eds-color-bg-layer-floating"
94
94
  },
95
95
  "color-bg-layer-floating-hover": {
@@ -101,19 +101,19 @@ var tokenMap = {
101
101
  "color-bg-neutral-inverted": {
102
102
  "name": "color-bg-neutral-inverted",
103
103
  "type": "color",
104
- "value": "#374151",
104
+ "value": "#1F2937",
105
105
  "cssVariable": "--eds-color-bg-neutral-inverted"
106
106
  },
107
107
  "color-bg-neutral-inverted-hover": {
108
108
  "name": "color-bg-neutral-inverted-hover",
109
109
  "type": "color",
110
- "value": "#374151",
110
+ "value": "#111827",
111
111
  "cssVariable": "--eds-color-bg-neutral-inverted-hover"
112
112
  },
113
113
  "color-bg-neutral-primary": {
114
114
  "name": "color-bg-neutral-primary",
115
115
  "type": "color",
116
- "value": "#FFFFFF",
116
+ "value": "#FFFFFFFF",
117
117
  "cssVariable": "--eds-color-bg-neutral-primary"
118
118
  },
119
119
  "color-bg-neutral-primary-hover": {
@@ -245,13 +245,13 @@ var tokenMap = {
245
245
  "color-fg-neutral": {
246
246
  "name": "color-fg-neutral",
247
247
  "type": "color",
248
- "value": "#374151",
248
+ "value": "#1F2937",
249
249
  "cssVariable": "--eds-color-fg-neutral"
250
250
  },
251
251
  "color-fg-neutral-inverted": {
252
252
  "name": "color-fg-neutral-inverted",
253
253
  "type": "color",
254
- "value": "#FFFFFF",
254
+ "value": "#FFFFFFFF",
255
255
  "cssVariable": "--eds-color-fg-neutral-inverted"
256
256
  },
257
257
  "color-fg-neutral-secondary": {
@@ -299,9 +299,15 @@ var tokenMap = {
299
299
  "color-stroke-brand-primary": {
300
300
  "name": "color-stroke-brand-primary",
301
301
  "type": "color",
302
- "value": "#DB3700",
302
+ "value": "#FE4101",
303
303
  "cssVariable": "--eds-color-stroke-brand-primary"
304
304
  },
305
+ "color-stroke-brand-weak": {
306
+ "name": "color-stroke-brand-weak",
307
+ "type": "color",
308
+ "value": "#FFEBE4",
309
+ "cssVariable": "--eds-color-stroke-brand-weak"
310
+ },
305
311
  "color-stroke-critical-primary": {
306
312
  "name": "color-stroke-critical-primary",
307
313
  "type": "color",
@@ -335,7 +341,7 @@ var tokenMap = {
335
341
  "color-stroke-neutral-contrast": {
336
342
  "name": "color-stroke-neutral-contrast",
337
343
  "type": "color",
338
- "value": "#374151",
344
+ "value": "#1F2937",
339
345
  "cssVariable": "--eds-color-stroke-neutral-contrast"
340
346
  },
341
347
  "color-stroke-neutral-primary": {
@@ -1121,6 +1127,7 @@ var tokenNames = Object.freeze([
1121
1127
  "color-fg-warning",
1122
1128
  "color-fg-warning-contrast",
1123
1129
  "color-stroke-brand-primary",
1130
+ "color-stroke-brand-weak",
1124
1131
  "color-stroke-critical-primary",
1125
1132
  "color-stroke-critical-weak",
1126
1133
  "color-stroke-focusRing",
package/dist/tokens.json CHANGED
@@ -111,7 +111,7 @@
111
111
  },
112
112
  "color-bg-layer-default": {
113
113
  "$type": "color",
114
- "$value": "#FFFFFF",
114
+ "$value": "#FFFFFFFF",
115
115
  "$extensions": {
116
116
  "eds": {
117
117
  "cssVariable": "--eds-color-bg-layer-default"
@@ -129,7 +129,7 @@
129
129
  },
130
130
  "color-bg-layer-floating": {
131
131
  "$type": "color",
132
- "$value": "#FFFFFF",
132
+ "$value": "#FFFFFFFF",
133
133
  "$extensions": {
134
134
  "eds": {
135
135
  "cssVariable": "--eds-color-bg-layer-floating"
@@ -147,7 +147,7 @@
147
147
  },
148
148
  "color-bg-neutral-inverted": {
149
149
  "$type": "color",
150
- "$value": "#374151",
150
+ "$value": "#1F2937",
151
151
  "$extensions": {
152
152
  "eds": {
153
153
  "cssVariable": "--eds-color-bg-neutral-inverted"
@@ -156,7 +156,7 @@
156
156
  },
157
157
  "color-bg-neutral-inverted-hover": {
158
158
  "$type": "color",
159
- "$value": "#374151",
159
+ "$value": "#111827",
160
160
  "$extensions": {
161
161
  "eds": {
162
162
  "cssVariable": "--eds-color-bg-neutral-inverted-hover"
@@ -165,7 +165,7 @@
165
165
  },
166
166
  "color-bg-neutral-primary": {
167
167
  "$type": "color",
168
- "$value": "#FFFFFF",
168
+ "$value": "#FFFFFFFF",
169
169
  "$extensions": {
170
170
  "eds": {
171
171
  "cssVariable": "--eds-color-bg-neutral-primary"
@@ -363,7 +363,7 @@
363
363
  },
364
364
  "color-fg-neutral": {
365
365
  "$type": "color",
366
- "$value": "#374151",
366
+ "$value": "#1F2937",
367
367
  "$extensions": {
368
368
  "eds": {
369
369
  "cssVariable": "--eds-color-fg-neutral"
@@ -372,7 +372,7 @@
372
372
  },
373
373
  "color-fg-neutral-inverted": {
374
374
  "$type": "color",
375
- "$value": "#FFFFFF",
375
+ "$value": "#FFFFFFFF",
376
376
  "$extensions": {
377
377
  "eds": {
378
378
  "cssVariable": "--eds-color-fg-neutral-inverted"
@@ -444,13 +444,22 @@
444
444
  },
445
445
  "color-stroke-brand-primary": {
446
446
  "$type": "color",
447
- "$value": "#DB3700",
447
+ "$value": "#FE4101",
448
448
  "$extensions": {
449
449
  "eds": {
450
450
  "cssVariable": "--eds-color-stroke-brand-primary"
451
451
  }
452
452
  }
453
453
  },
454
+ "color-stroke-brand-weak": {
455
+ "$type": "color",
456
+ "$value": "#FFEBE4",
457
+ "$extensions": {
458
+ "eds": {
459
+ "cssVariable": "--eds-color-stroke-brand-weak"
460
+ }
461
+ }
462
+ },
454
463
  "color-stroke-critical-primary": {
455
464
  "$type": "color",
456
465
  "$value": "#EF4444",
@@ -498,7 +507,7 @@
498
507
  },
499
508
  "color-stroke-neutral-contrast": {
500
509
  "$type": "color",
501
- "$value": "#374151",
510
+ "$value": "#1F2937",
502
511
  "$extensions": {
503
512
  "eds": {
504
513
  "cssVariable": "--eds-color-stroke-neutral-contrast"
package/dist/tokens.mjs CHANGED
@@ -75,7 +75,7 @@ var tokenMap = {
75
75
  "color-bg-layer-default": {
76
76
  "name": "color-bg-layer-default",
77
77
  "type": "color",
78
- "value": "#FFFFFF",
78
+ "value": "#FFFFFFFF",
79
79
  "cssVariable": "--eds-color-bg-layer-default"
80
80
  },
81
81
  "color-bg-layer-default-hover": {
@@ -87,7 +87,7 @@ var tokenMap = {
87
87
  "color-bg-layer-floating": {
88
88
  "name": "color-bg-layer-floating",
89
89
  "type": "color",
90
- "value": "#FFFFFF",
90
+ "value": "#FFFFFFFF",
91
91
  "cssVariable": "--eds-color-bg-layer-floating"
92
92
  },
93
93
  "color-bg-layer-floating-hover": {
@@ -99,19 +99,19 @@ var tokenMap = {
99
99
  "color-bg-neutral-inverted": {
100
100
  "name": "color-bg-neutral-inverted",
101
101
  "type": "color",
102
- "value": "#374151",
102
+ "value": "#1F2937",
103
103
  "cssVariable": "--eds-color-bg-neutral-inverted"
104
104
  },
105
105
  "color-bg-neutral-inverted-hover": {
106
106
  "name": "color-bg-neutral-inverted-hover",
107
107
  "type": "color",
108
- "value": "#374151",
108
+ "value": "#111827",
109
109
  "cssVariable": "--eds-color-bg-neutral-inverted-hover"
110
110
  },
111
111
  "color-bg-neutral-primary": {
112
112
  "name": "color-bg-neutral-primary",
113
113
  "type": "color",
114
- "value": "#FFFFFF",
114
+ "value": "#FFFFFFFF",
115
115
  "cssVariable": "--eds-color-bg-neutral-primary"
116
116
  },
117
117
  "color-bg-neutral-primary-hover": {
@@ -243,13 +243,13 @@ var tokenMap = {
243
243
  "color-fg-neutral": {
244
244
  "name": "color-fg-neutral",
245
245
  "type": "color",
246
- "value": "#374151",
246
+ "value": "#1F2937",
247
247
  "cssVariable": "--eds-color-fg-neutral"
248
248
  },
249
249
  "color-fg-neutral-inverted": {
250
250
  "name": "color-fg-neutral-inverted",
251
251
  "type": "color",
252
- "value": "#FFFFFF",
252
+ "value": "#FFFFFFFF",
253
253
  "cssVariable": "--eds-color-fg-neutral-inverted"
254
254
  },
255
255
  "color-fg-neutral-secondary": {
@@ -297,9 +297,15 @@ var tokenMap = {
297
297
  "color-stroke-brand-primary": {
298
298
  "name": "color-stroke-brand-primary",
299
299
  "type": "color",
300
- "value": "#DB3700",
300
+ "value": "#FE4101",
301
301
  "cssVariable": "--eds-color-stroke-brand-primary"
302
302
  },
303
+ "color-stroke-brand-weak": {
304
+ "name": "color-stroke-brand-weak",
305
+ "type": "color",
306
+ "value": "#FFEBE4",
307
+ "cssVariable": "--eds-color-stroke-brand-weak"
308
+ },
303
309
  "color-stroke-critical-primary": {
304
310
  "name": "color-stroke-critical-primary",
305
311
  "type": "color",
@@ -333,7 +339,7 @@ var tokenMap = {
333
339
  "color-stroke-neutral-contrast": {
334
340
  "name": "color-stroke-neutral-contrast",
335
341
  "type": "color",
336
- "value": "#374151",
342
+ "value": "#1F2937",
337
343
  "cssVariable": "--eds-color-stroke-neutral-contrast"
338
344
  },
339
345
  "color-stroke-neutral-primary": {
@@ -1119,6 +1125,7 @@ var tokenNames = Object.freeze([
1119
1125
  "color-fg-warning",
1120
1126
  "color-fg-warning-contrast",
1121
1127
  "color-stroke-brand-primary",
1128
+ "color-stroke-brand-weak",
1122
1129
  "color-stroke-critical-primary",
1123
1130
  "color-stroke-critical-weak",
1124
1131
  "color-stroke-focusRing",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spectrabrain/eds",
3
- "version": "0.0.1",
3
+ "version": "0.0.2",
4
4
  "description": "EVA services' shared React design system",
5
5
  "author": "SpectraBrain",
6
6
  "license": "UNLICENSED",