@esri/calcite-design-tokens 3.2.0-next.7 → 3.2.0-next.9

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/dist/css/dark.css CHANGED
@@ -9,8 +9,8 @@
9
9
  --calcite-color-foreground-1: #2b2b2b;
10
10
  --calcite-color-foreground-2: #212121;
11
11
  --calcite-color-foreground-3: #141414;
12
- --calcite-color-foreground-current: #2b465f; /** deprecated, use --calcite-color-foreground-highlight instead */
13
- --calcite-color-foreground-highlight: #2b465f;
12
+ --calcite-color-foreground-current: #2b465f; /** deprecated, use --calcite-color-surface-highlight instead */
13
+ --calcite-color-surface-highlight: #2b465f;
14
14
  --calcite-color-transparent: rgba(255, 255, 255, 0);
15
15
  --calcite-color-transparent-hover: rgba(255, 255, 255, 0.12);
16
16
  --calcite-color-transparent-press: rgba(255, 255, 255, 0.16);
@@ -44,8 +44,8 @@
44
44
  --calcite-color-transparent-press: rgba(0, 0, 0, 0.08);
45
45
  --calcite-color-transparent-hover: rgba(0, 0, 0, 0.04);
46
46
  --calcite-color-transparent: rgba(0, 0, 0, 0);
47
- --calcite-color-foreground-highlight: #d6efff;
48
- --calcite-color-foreground-current: #d6efff; /** deprecated, use --calcite-color-foreground-highlight instead */
47
+ --calcite-color-surface-highlight: #d6efff;
48
+ --calcite-color-foreground-current: #d6efff; /** deprecated, use --calcite-color-surface-highlight instead */
49
49
  --calcite-color-foreground-3: #ebebeb;
50
50
  --calcite-color-foreground-2: #f2f2f2;
51
51
  --calcite-color-foreground-1: #ffffff;
@@ -92,8 +92,8 @@
92
92
  --calcite-color-transparent-press: rgba(0, 0, 0, 0.08);
93
93
  --calcite-color-transparent-hover: rgba(0, 0, 0, 0.04);
94
94
  --calcite-color-transparent: rgba(0, 0, 0, 0);
95
- --calcite-color-foreground-highlight: #d6efff;
96
- --calcite-color-foreground-current: #d6efff; /** deprecated, use --calcite-color-foreground-highlight instead */
95
+ --calcite-color-surface-highlight: #d6efff;
96
+ --calcite-color-foreground-current: #d6efff; /** deprecated, use --calcite-color-surface-highlight instead */
97
97
  --calcite-color-foreground-3: #ebebeb;
98
98
  --calcite-color-foreground-2: #f2f2f2;
99
99
  --calcite-color-foreground-1: #ffffff;
@@ -141,8 +141,8 @@
141
141
  --calcite-color-transparent-press: rgba(255, 255, 255, 0.16);
142
142
  --calcite-color-transparent-hover: rgba(255, 255, 255, 0.12);
143
143
  --calcite-color-transparent: rgba(255, 255, 255, 0);
144
- --calcite-color-foreground-highlight: #2b465f;
145
- --calcite-color-foreground-current: #2b465f; /** deprecated, use --calcite-color-foreground-highlight instead */
144
+ --calcite-color-surface-highlight: #2b465f;
145
+ --calcite-color-foreground-current: #2b465f; /** deprecated, use --calcite-color-surface-highlight instead */
146
146
  --calcite-color-foreground-3: #141414;
147
147
  --calcite-color-foreground-2: #212121;
148
148
  --calcite-color-foreground-1: #2b2b2b;
@@ -189,8 +189,8 @@
189
189
  --calcite-color-transparent-press: rgba(0, 0, 0, 0.08);
190
190
  --calcite-color-transparent-hover: rgba(0, 0, 0, 0.04);
191
191
  --calcite-color-transparent: rgba(0, 0, 0, 0);
192
- --calcite-color-foreground-highlight: #d6efff;
193
- --calcite-color-foreground-current: #d6efff; /** deprecated, use --calcite-color-foreground-highlight instead */
192
+ --calcite-color-surface-highlight: #d6efff;
193
+ --calcite-color-foreground-current: #d6efff; /** deprecated, use --calcite-color-surface-highlight instead */
194
194
  --calcite-color-foreground-3: #ebebeb;
195
195
  --calcite-color-foreground-2: #f2f2f2;
196
196
  --calcite-color-foreground-1: #ffffff;
@@ -236,8 +236,8 @@
236
236
  --calcite-color-transparent-press: rgba(255, 255, 255, 0.16);
237
237
  --calcite-color-transparent-hover: rgba(255, 255, 255, 0.12);
238
238
  --calcite-color-transparent: rgba(255, 255, 255, 0);
239
- --calcite-color-foreground-highlight: #2b465f;
240
- --calcite-color-foreground-current: #2b465f; /** deprecated, use --calcite-color-foreground-highlight instead */
239
+ --calcite-color-surface-highlight: #2b465f;
240
+ --calcite-color-foreground-current: #2b465f; /** deprecated, use --calcite-color-surface-highlight instead */
241
241
  --calcite-color-foreground-3: #141414;
242
242
  --calcite-color-foreground-2: #212121;
243
243
  --calcite-color-foreground-1: #2b2b2b;
@@ -9,8 +9,8 @@
9
9
  --calcite-color-foreground-1: #ffffff;
10
10
  --calcite-color-foreground-2: #f2f2f2;
11
11
  --calcite-color-foreground-3: #ebebeb;
12
- --calcite-color-foreground-current: #d6efff; /** deprecated, use --calcite-color-foreground-highlight instead */
13
- --calcite-color-foreground-highlight: #d6efff;
12
+ --calcite-color-foreground-current: #d6efff; /** deprecated, use --calcite-color-surface-highlight instead */
13
+ --calcite-color-surface-highlight: #d6efff;
14
14
  --calcite-color-transparent: rgba(0, 0, 0, 0);
15
15
  --calcite-color-transparent-hover: rgba(0, 0, 0, 0.04);
16
16
  --calcite-color-transparent-press: rgba(0, 0, 0, 0.08);
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": 1751917956219,
2
+ "timestamp": 1752680549355,
3
3
  "tokens": [
4
4
  {
5
5
  "key": "{core.color.neutral.blk-000}",
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": 1751917954381,
2
+ "timestamp": 1752680547547,
3
3
  "tokens": [
4
4
  {
5
5
  "key": "{semantic.color.background.default}",
@@ -152,13 +152,13 @@
152
152
  "item": "foreground",
153
153
  "subitem": "current",
154
154
  "value": "#2b465f",
155
- "description": "deprecated, use --calcite-color-foreground-highlight instead",
155
+ "description": "deprecated, use --calcite-color-surface-highlight instead",
156
156
  "filePath": "src/tokens/semantic/color/dark.json",
157
157
  "isSource": true,
158
158
  "key": "{semantic.color.foreground.current}",
159
159
  "name": "calcite-semantic-color-foreground-current",
160
160
  "path": ["semantic", "color", "foreground", "current"],
161
- "comment": "deprecated, use --calcite-color-foreground-highlight instead",
161
+ "comment": "deprecated, use --calcite-color-surface-highlight instead",
162
162
  "names": {
163
163
  "scss": "$calcite-color-foreground-current",
164
164
  "css": "var(--calcite-color-foreground-current)",
@@ -172,29 +172,29 @@
172
172
  "type": "color"
173
173
  }
174
174
  },
175
- "description": "deprecated, use --calcite-color-foreground-highlight instead",
175
+ "description": "deprecated, use --calcite-color-surface-highlight instead",
176
176
  "filePath": "src/tokens/semantic/color/dark.json",
177
177
  "isSource": true,
178
178
  "name": "Color Foreground Current",
179
179
  "path": ["semantic", "color", "foreground", "current"],
180
- "comment": "deprecated, use --calcite-color-foreground-highlight instead"
180
+ "comment": "deprecated, use --calcite-color-surface-highlight instead"
181
181
  },
182
182
  {
183
- "key": "{semantic.color.foreground.highlight}",
183
+ "key": "{semantic.color.surface.highlight}",
184
184
  "value": "#2b465f",
185
185
  "type": "color",
186
186
  "attributes": {
187
187
  "category": "color",
188
188
  "group": "foreground",
189
189
  "type": "color",
190
- "item": "foreground",
190
+ "item": "surface",
191
191
  "subitem": "highlight",
192
192
  "names": {
193
- "scss": "$calcite-color-foreground-highlight",
194
- "css": "var(--calcite-color-foreground-highlight)",
195
- "js": "semantic.color.foreground.highlight",
196
- "docs": "semantic.color.foreground.highlight",
197
- "es6": "calciteColorForegroundHighlight"
193
+ "scss": "$calcite-color-surface-highlight",
194
+ "css": "var(--calcite-color-surface-highlight)",
195
+ "js": "semantic.color.surface.highlight",
196
+ "docs": "semantic.color.surface.highlight",
197
+ "es6": "calciteColorSurfaceHighlight"
198
198
  },
199
199
  "calcite-schema": {
200
200
  "system": "calcite",
@@ -204,8 +204,8 @@
204
204
  },
205
205
  "filePath": "src/tokens/semantic/color/dark.json",
206
206
  "isSource": true,
207
- "name": "Color Foreground Highlight",
208
- "path": ["semantic", "color", "foreground", "highlight"]
207
+ "name": "Color Surface Highlight",
208
+ "path": ["semantic", "color", "surface", "highlight"]
209
209
  },
210
210
  {
211
211
  "key": "{semantic.color.transparent.default.default}",
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": 1751917956046,
2
+ "timestamp": 1752680549192,
3
3
  "tokens": [
4
4
  {
5
5
  "key": "{semantic.color.background.default}",
@@ -152,13 +152,13 @@
152
152
  "item": "foreground",
153
153
  "subitem": "current",
154
154
  "value": "#d6efff",
155
- "description": "deprecated, use --calcite-color-foreground-highlight instead",
155
+ "description": "deprecated, use --calcite-color-surface-highlight instead",
156
156
  "filePath": "src/tokens/semantic/color/light.json",
157
157
  "isSource": false,
158
158
  "key": "{semantic.color.foreground.current}",
159
159
  "name": "calcite-semantic-color-foreground-current",
160
160
  "path": ["semantic", "color", "foreground", "current"],
161
- "comment": "deprecated, use --calcite-color-foreground-highlight instead",
161
+ "comment": "deprecated, use --calcite-color-surface-highlight instead",
162
162
  "names": {
163
163
  "scss": "$calcite-color-foreground-current",
164
164
  "css": "var(--calcite-color-foreground-current)",
@@ -172,29 +172,29 @@
172
172
  "type": "color"
173
173
  }
174
174
  },
175
- "description": "deprecated, use --calcite-color-foreground-highlight instead",
175
+ "description": "deprecated, use --calcite-color-surface-highlight instead",
176
176
  "filePath": "src/tokens/semantic/color/light.json",
177
177
  "isSource": false,
178
178
  "name": "Color Foreground Current",
179
179
  "path": ["semantic", "color", "foreground", "current"],
180
- "comment": "deprecated, use --calcite-color-foreground-highlight instead"
180
+ "comment": "deprecated, use --calcite-color-surface-highlight instead"
181
181
  },
182
182
  {
183
- "key": "{semantic.color.foreground.highlight}",
183
+ "key": "{semantic.color.surface.highlight}",
184
184
  "value": "{\"light\":\"#d6efff\",\"dark\":\"#2b465f\"}",
185
185
  "type": "color",
186
186
  "attributes": {
187
187
  "category": "color",
188
188
  "group": "foreground",
189
189
  "type": "color",
190
- "item": "foreground",
190
+ "item": "surface",
191
191
  "subitem": "highlight",
192
192
  "names": {
193
- "scss": "$calcite-color-foreground-highlight",
194
- "css": "var(--calcite-color-foreground-highlight)",
195
- "js": "semantic.color.foreground.highlight",
196
- "docs": "semantic.color.foreground.highlight",
197
- "es6": "calciteColorForegroundHighlight"
193
+ "scss": "$calcite-color-surface-highlight",
194
+ "css": "var(--calcite-color-surface-highlight)",
195
+ "js": "semantic.color.surface.highlight",
196
+ "docs": "semantic.color.surface.highlight",
197
+ "es6": "calciteColorSurfaceHighlight"
198
198
  },
199
199
  "calcite-schema": {
200
200
  "system": "calcite",
@@ -204,8 +204,8 @@
204
204
  },
205
205
  "filePath": "src/tokens/semantic/color/light.json",
206
206
  "isSource": false,
207
- "name": "Color Foreground Highlight",
208
- "path": ["semantic", "color", "foreground", "highlight"]
207
+ "name": "Color Surface Highlight",
208
+ "path": ["semantic", "color", "surface", "highlight"]
209
209
  },
210
210
  {
211
211
  "key": "{semantic.color.transparent.default.default}",
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": 1751917955272,
2
+ "timestamp": 1752680548409,
3
3
  "tokens": [
4
4
  {
5
5
  "key": "{semantic.color.background.default}",
@@ -152,13 +152,13 @@
152
152
  "item": "foreground",
153
153
  "subitem": "current",
154
154
  "value": "#d6efff",
155
- "description": "deprecated, use --calcite-color-foreground-highlight instead",
155
+ "description": "deprecated, use --calcite-color-surface-highlight instead",
156
156
  "filePath": "src/tokens/semantic/color/light.json",
157
157
  "isSource": true,
158
158
  "key": "{semantic.color.foreground.current}",
159
159
  "name": "calcite-semantic-color-foreground-current",
160
160
  "path": ["semantic", "color", "foreground", "current"],
161
- "comment": "deprecated, use --calcite-color-foreground-highlight instead",
161
+ "comment": "deprecated, use --calcite-color-surface-highlight instead",
162
162
  "names": {
163
163
  "scss": "$calcite-color-foreground-current",
164
164
  "css": "var(--calcite-color-foreground-current)",
@@ -172,29 +172,29 @@
172
172
  "type": "color"
173
173
  }
174
174
  },
175
- "description": "deprecated, use --calcite-color-foreground-highlight instead",
175
+ "description": "deprecated, use --calcite-color-surface-highlight instead",
176
176
  "filePath": "src/tokens/semantic/color/light.json",
177
177
  "isSource": true,
178
178
  "name": "Color Foreground Current",
179
179
  "path": ["semantic", "color", "foreground", "current"],
180
- "comment": "deprecated, use --calcite-color-foreground-highlight instead"
180
+ "comment": "deprecated, use --calcite-color-surface-highlight instead"
181
181
  },
182
182
  {
183
- "key": "{semantic.color.foreground.highlight}",
183
+ "key": "{semantic.color.surface.highlight}",
184
184
  "value": "#d6efff",
185
185
  "type": "color",
186
186
  "attributes": {
187
187
  "category": "color",
188
188
  "group": "foreground",
189
189
  "type": "color",
190
- "item": "foreground",
190
+ "item": "surface",
191
191
  "subitem": "highlight",
192
192
  "names": {
193
- "scss": "$calcite-color-foreground-highlight",
194
- "css": "var(--calcite-color-foreground-highlight)",
195
- "js": "semantic.color.foreground.highlight",
196
- "docs": "semantic.color.foreground.highlight",
197
- "es6": "calciteColorForegroundHighlight"
193
+ "scss": "$calcite-color-surface-highlight",
194
+ "css": "var(--calcite-color-surface-highlight)",
195
+ "js": "semantic.color.surface.highlight",
196
+ "docs": "semantic.color.surface.highlight",
197
+ "es6": "calciteColorSurfaceHighlight"
198
198
  },
199
199
  "calcite-schema": {
200
200
  "system": "calcite",
@@ -204,8 +204,8 @@
204
204
  },
205
205
  "filePath": "src/tokens/semantic/color/light.json",
206
206
  "isSource": true,
207
- "name": "Color Foreground Highlight",
208
- "path": ["semantic", "color", "foreground", "highlight"]
207
+ "name": "Color Surface Highlight",
208
+ "path": ["semantic", "color", "surface", "highlight"]
209
209
  },
210
210
  {
211
211
  "key": "{semantic.color.transparent.default.default}",
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": 1751917956159,
2
+ "timestamp": 1752680549302,
3
3
  "tokens": [
4
4
  {
5
5
  "key": "{semantic.border.width.none}",
@@ -8,9 +8,9 @@ export const calciteColorBackgroundNone: string;
8
8
  export const calciteColorForeground1: string;
9
9
  export const calciteColorForeground2: string;
10
10
  export const calciteColorForeground3: string;
11
- /** deprecated, use --calcite-color-foreground-highlight instead */
11
+ /** deprecated, use --calcite-color-surface-highlight instead */
12
12
  export const calciteColorForegroundCurrent: string;
13
- export const calciteColorForegroundHighlight: string;
13
+ export const calciteColorSurfaceHighlight: string;
14
14
  export const calciteColorTransparent: string;
15
15
  export const calciteColorTransparentHover: string;
16
16
  export const calciteColorTransparentPress: string;
package/dist/es6/dark.js CHANGED
@@ -8,8 +8,8 @@ export const calciteColorBackgroundNone = "rgba(255, 255, 255, 0)";
8
8
  export const calciteColorForeground1 = "#2b2b2b";
9
9
  export const calciteColorForeground2 = "#212121";
10
10
  export const calciteColorForeground3 = "#141414";
11
- export const calciteColorForegroundCurrent = "#2b465f"; // deprecated, use --calcite-color-foreground-highlight instead
12
- export const calciteColorForegroundHighlight = "#2b465f";
11
+ export const calciteColorForegroundCurrent = "#2b465f"; // deprecated, use --calcite-color-surface-highlight instead
12
+ export const calciteColorSurfaceHighlight = "#2b465f";
13
13
  export const calciteColorTransparent = "rgba(255, 255, 255, 0)";
14
14
  export const calciteColorTransparentHover = "rgba(255, 255, 255, 0.12)";
15
15
  export const calciteColorTransparentPress = "rgba(255, 255, 255, 0.16)";
@@ -9,9 +9,9 @@ export const calciteColorBackgroundNone: string;
9
9
  export const calciteColorForeground1: { light: string; dark: string };
10
10
  export const calciteColorForeground2: { light: string; dark: string };
11
11
  export const calciteColorForeground3: { light: string; dark: string };
12
- /** deprecated, use --calcite-color-foreground-highlight instead */
12
+ /** deprecated, use --calcite-color-surface-highlight instead */
13
13
  export const calciteColorForegroundCurrent: { light: string; dark: string };
14
- export const calciteColorForegroundHighlight: { light: string; dark: string };
14
+ export const calciteColorSurfaceHighlight: { light: string; dark: string };
15
15
  export const calciteColorTransparent: { light: string; dark: string };
16
16
  export const calciteColorTransparentHover: { light: string; dark: string };
17
17
  export const calciteColorTransparentPress: { light: string; dark: string };
@@ -12,8 +12,8 @@ export const calciteColorForeground3 = { light: "#ebebeb", dark: "#141414" };
12
12
  export const calciteColorForegroundCurrent = {
13
13
  light: "#d6efff",
14
14
  dark: "#2b465f",
15
- }; // deprecated, use --calcite-color-foreground-highlight instead
16
- export const calciteColorForegroundHighlight = {
15
+ }; // deprecated, use --calcite-color-surface-highlight instead
16
+ export const calciteColorSurfaceHighlight = {
17
17
  light: "#d6efff",
18
18
  dark: "#2b465f",
19
19
  };
@@ -8,9 +8,9 @@ export const calciteColorBackgroundNone: string;
8
8
  export const calciteColorForeground1: string;
9
9
  export const calciteColorForeground2: string;
10
10
  export const calciteColorForeground3: string;
11
- /** deprecated, use --calcite-color-foreground-highlight instead */
11
+ /** deprecated, use --calcite-color-surface-highlight instead */
12
12
  export const calciteColorForegroundCurrent: string;
13
- export const calciteColorForegroundHighlight: string;
13
+ export const calciteColorSurfaceHighlight: string;
14
14
  export const calciteColorTransparent: string;
15
15
  export const calciteColorTransparentHover: string;
16
16
  export const calciteColorTransparentPress: string;
package/dist/es6/light.js CHANGED
@@ -8,8 +8,8 @@ export const calciteColorBackgroundNone = "rgba(255, 255, 255, 0)";
8
8
  export const calciteColorForeground1 = "#ffffff";
9
9
  export const calciteColorForeground2 = "#f2f2f2";
10
10
  export const calciteColorForeground3 = "#ebebeb";
11
- export const calciteColorForegroundCurrent = "#d6efff"; // deprecated, use --calcite-color-foreground-highlight instead
12
- export const calciteColorForegroundHighlight = "#d6efff";
11
+ export const calciteColorForegroundCurrent = "#d6efff"; // deprecated, use --calcite-color-surface-highlight instead
12
+ export const calciteColorSurfaceHighlight = "#d6efff";
13
13
  export const calciteColorTransparent = "rgba(0, 0, 0, 0)";
14
14
  export const calciteColorTransparentHover = "rgba(0, 0, 0, 0.04)";
15
15
  export const calciteColorTransparentPress = "rgba(0, 0, 0, 0.08)";
package/dist/js/dark.d.ts CHANGED
@@ -8,9 +8,9 @@ export const calciteColorBackgroundNone: string;
8
8
  export const calciteColorForeground1: string;
9
9
  export const calciteColorForeground2: string;
10
10
  export const calciteColorForeground3: string;
11
- /** deprecated, use --calcite-color-foreground-highlight instead */
11
+ /** deprecated, use --calcite-color-surface-highlight instead */
12
12
  export const calciteColorForegroundCurrent: string;
13
- export const calciteColorForegroundHighlight: string;
13
+ export const calciteColorSurfaceHighlight: string;
14
14
  export const calciteColorTransparent: string;
15
15
  export const calciteColorTransparentHover: string;
16
16
  export const calciteColorTransparentPress: string;
package/dist/js/dark.js CHANGED
@@ -206,14 +206,14 @@ export default {
206
206
  subitem: "current",
207
207
  value: "#2b465f",
208
208
  description:
209
- "deprecated, use --calcite-color-foreground-highlight instead",
209
+ "deprecated, use --calcite-color-surface-highlight instead",
210
210
  filePath: "src/tokens/semantic/color/dark.json",
211
211
  isSource: true,
212
212
  key: "{semantic.color.foreground.current}",
213
213
  name: "calcite-semantic-color-foreground-current",
214
214
  path: ["semantic", "color", "foreground", "current"],
215
215
  comment:
216
- "deprecated, use --calcite-color-foreground-highlight instead",
216
+ "deprecated, use --calcite-color-surface-highlight instead",
217
217
  names: {
218
218
  scss: "$calcite-color-foreground-current",
219
219
  css: "var(--calcite-color-foreground-current)",
@@ -228,7 +228,7 @@ export default {
228
228
  },
229
229
  },
230
230
  description:
231
- "deprecated, use --calcite-color-foreground-highlight instead",
231
+ "deprecated, use --calcite-color-surface-highlight instead",
232
232
  filePath: "src/tokens/semantic/color/dark.json",
233
233
  isSource: true,
234
234
  original: {
@@ -239,30 +239,31 @@ export default {
239
239
  group: "foreground",
240
240
  },
241
241
  description:
242
- "deprecated, use --calcite-color-foreground-highlight instead",
242
+ "deprecated, use --calcite-color-surface-highlight instead",
243
243
  key: "{semantic.color.foreground.current}",
244
244
  },
245
245
  name: "calciteColorForegroundCurrent",
246
246
  path: ["semantic", "color", "foreground", "current"],
247
- comment:
248
- "deprecated, use --calcite-color-foreground-highlight instead",
247
+ comment: "deprecated, use --calcite-color-surface-highlight instead",
249
248
  },
249
+ },
250
+ surface: {
250
251
  highlight: {
251
- key: "{semantic.color.foreground.highlight}",
252
+ key: "{semantic.color.surface.highlight}",
252
253
  value: "#2b465f",
253
254
  type: "color",
254
255
  attributes: {
255
256
  category: "color",
256
257
  group: "foreground",
257
258
  type: "color",
258
- item: "foreground",
259
+ item: "surface",
259
260
  subitem: "highlight",
260
261
  names: {
261
- scss: "$calcite-color-foreground-highlight",
262
- css: "var(--calcite-color-foreground-highlight)",
263
- js: "semantic.color.foreground.highlight",
264
- docs: "semantic.color.foreground.highlight",
265
- es6: "calciteColorForegroundHighlight",
262
+ scss: "$calcite-color-surface-highlight",
263
+ css: "var(--calcite-color-surface-highlight)",
264
+ js: "semantic.color.surface.highlight",
265
+ docs: "semantic.color.surface.highlight",
266
+ es6: "calciteColorSurfaceHighlight",
266
267
  },
267
268
  "calcite-schema": {
268
269
  system: "calcite",
@@ -279,10 +280,10 @@ export default {
279
280
  category: "color",
280
281
  group: "foreground",
281
282
  },
282
- key: "{semantic.color.foreground.highlight}",
283
+ key: "{semantic.color.surface.highlight}",
283
284
  },
284
- name: "calciteColorForegroundHighlight",
285
- path: ["semantic", "color", "foreground", "highlight"],
285
+ name: "calciteColorSurfaceHighlight",
286
+ path: ["semantic", "color", "surface", "highlight"],
286
287
  },
287
288
  },
288
289
  transparent: {
@@ -28,6 +28,8 @@ declare const tokens: {
28
28
  "2": DesignToken;
29
29
  "3": DesignToken;
30
30
  current: DesignToken;
31
+ };
32
+ surface: {
31
33
  highlight: DesignToken;
32
34
  };
33
35
  transparent: {
package/dist/js/global.js CHANGED
@@ -222,14 +222,14 @@ export default {
222
222
  subitem: "current",
223
223
  value: "#d6efff",
224
224
  description:
225
- "deprecated, use --calcite-color-foreground-highlight instead",
225
+ "deprecated, use --calcite-color-surface-highlight instead",
226
226
  filePath: "src/tokens/semantic/color/light.json",
227
227
  isSource: false,
228
228
  key: "{semantic.color.foreground.current}",
229
229
  name: "calcite-semantic-color-foreground-current",
230
230
  path: ["semantic", "color", "foreground", "current"],
231
231
  comment:
232
- "deprecated, use --calcite-color-foreground-highlight instead",
232
+ "deprecated, use --calcite-color-surface-highlight instead",
233
233
  names: {
234
234
  scss: "$calcite-color-foreground-current",
235
235
  css: "var(--calcite-color-foreground-current)",
@@ -244,7 +244,7 @@ export default {
244
244
  },
245
245
  },
246
246
  description:
247
- "deprecated, use --calcite-color-foreground-highlight instead",
247
+ "deprecated, use --calcite-color-surface-highlight instead",
248
248
  filePath: "src/tokens/semantic/color/light.json",
249
249
  isSource: false,
250
250
  original: {
@@ -255,16 +255,17 @@ export default {
255
255
  group: "foreground",
256
256
  },
257
257
  description:
258
- "deprecated, use --calcite-color-foreground-highlight instead",
258
+ "deprecated, use --calcite-color-surface-highlight instead",
259
259
  key: "{semantic.color.foreground.current}",
260
260
  },
261
261
  name: "Color Foreground Current",
262
262
  path: ["semantic", "color", "foreground", "current"],
263
- comment:
264
- "deprecated, use --calcite-color-foreground-highlight instead",
263
+ comment: "deprecated, use --calcite-color-surface-highlight instead",
265
264
  },
265
+ },
266
+ surface: {
266
267
  highlight: {
267
- key: "{semantic.color.foreground.highlight}",
268
+ key: "{semantic.color.surface.highlight}",
268
269
  value: {
269
270
  light: "#d6efff",
270
271
  dark: "#2b465f",
@@ -274,14 +275,14 @@ export default {
274
275
  category: "color",
275
276
  group: "foreground",
276
277
  type: "color",
277
- item: "foreground",
278
+ item: "surface",
278
279
  subitem: "highlight",
279
280
  names: {
280
- scss: "$calcite-color-foreground-highlight",
281
- css: "var(--calcite-color-foreground-highlight)",
282
- js: "semantic.color.foreground.highlight",
283
- docs: "semantic.color.foreground.highlight",
284
- es6: "calciteColorForegroundHighlight",
281
+ scss: "$calcite-color-surface-highlight",
282
+ css: "var(--calcite-color-surface-highlight)",
283
+ js: "semantic.color.surface.highlight",
284
+ docs: "semantic.color.surface.highlight",
285
+ es6: "calciteColorSurfaceHighlight",
285
286
  },
286
287
  "calcite-schema": {
287
288
  system: "calcite",
@@ -298,10 +299,10 @@ export default {
298
299
  category: "color",
299
300
  group: "foreground",
300
301
  },
301
- key: "{semantic.color.foreground.highlight}",
302
+ key: "{semantic.color.surface.highlight}",
302
303
  },
303
- name: "Color Foreground Highlight",
304
- path: ["semantic", "color", "foreground", "highlight"],
304
+ name: "Color Surface Highlight",
305
+ path: ["semantic", "color", "surface", "highlight"],
305
306
  },
306
307
  },
307
308
  transparent: {
@@ -8,9 +8,9 @@ export const calciteColorBackgroundNone: string;
8
8
  export const calciteColorForeground1: string;
9
9
  export const calciteColorForeground2: string;
10
10
  export const calciteColorForeground3: string;
11
- /** deprecated, use --calcite-color-foreground-highlight instead */
11
+ /** deprecated, use --calcite-color-surface-highlight instead */
12
12
  export const calciteColorForegroundCurrent: string;
13
- export const calciteColorForegroundHighlight: string;
13
+ export const calciteColorSurfaceHighlight: string;
14
14
  export const calciteColorTransparent: string;
15
15
  export const calciteColorTransparentHover: string;
16
16
  export const calciteColorTransparentPress: string;
package/dist/js/light.js CHANGED
@@ -206,14 +206,14 @@ export default {
206
206
  subitem: "current",
207
207
  value: "#d6efff",
208
208
  description:
209
- "deprecated, use --calcite-color-foreground-highlight instead",
209
+ "deprecated, use --calcite-color-surface-highlight instead",
210
210
  filePath: "src/tokens/semantic/color/light.json",
211
211
  isSource: true,
212
212
  key: "{semantic.color.foreground.current}",
213
213
  name: "calcite-semantic-color-foreground-current",
214
214
  path: ["semantic", "color", "foreground", "current"],
215
215
  comment:
216
- "deprecated, use --calcite-color-foreground-highlight instead",
216
+ "deprecated, use --calcite-color-surface-highlight instead",
217
217
  names: {
218
218
  scss: "$calcite-color-foreground-current",
219
219
  css: "var(--calcite-color-foreground-current)",
@@ -228,7 +228,7 @@ export default {
228
228
  },
229
229
  },
230
230
  description:
231
- "deprecated, use --calcite-color-foreground-highlight instead",
231
+ "deprecated, use --calcite-color-surface-highlight instead",
232
232
  filePath: "src/tokens/semantic/color/light.json",
233
233
  isSource: true,
234
234
  original: {
@@ -239,30 +239,31 @@ export default {
239
239
  group: "foreground",
240
240
  },
241
241
  description:
242
- "deprecated, use --calcite-color-foreground-highlight instead",
242
+ "deprecated, use --calcite-color-surface-highlight instead",
243
243
  key: "{semantic.color.foreground.current}",
244
244
  },
245
245
  name: "calciteColorForegroundCurrent",
246
246
  path: ["semantic", "color", "foreground", "current"],
247
- comment:
248
- "deprecated, use --calcite-color-foreground-highlight instead",
247
+ comment: "deprecated, use --calcite-color-surface-highlight instead",
249
248
  },
249
+ },
250
+ surface: {
250
251
  highlight: {
251
- key: "{semantic.color.foreground.highlight}",
252
+ key: "{semantic.color.surface.highlight}",
252
253
  value: "#d6efff",
253
254
  type: "color",
254
255
  attributes: {
255
256
  category: "color",
256
257
  group: "foreground",
257
258
  type: "color",
258
- item: "foreground",
259
+ item: "surface",
259
260
  subitem: "highlight",
260
261
  names: {
261
- scss: "$calcite-color-foreground-highlight",
262
- css: "var(--calcite-color-foreground-highlight)",
263
- js: "semantic.color.foreground.highlight",
264
- docs: "semantic.color.foreground.highlight",
265
- es6: "calciteColorForegroundHighlight",
262
+ scss: "$calcite-color-surface-highlight",
263
+ css: "var(--calcite-color-surface-highlight)",
264
+ js: "semantic.color.surface.highlight",
265
+ docs: "semantic.color.surface.highlight",
266
+ es6: "calciteColorSurfaceHighlight",
266
267
  },
267
268
  "calcite-schema": {
268
269
  system: "calcite",
@@ -279,10 +280,10 @@ export default {
279
280
  category: "color",
280
281
  group: "foreground",
281
282
  },
282
- key: "{semantic.color.foreground.highlight}",
283
+ key: "{semantic.color.surface.highlight}",
283
284
  },
284
- name: "calciteColorForegroundHighlight",
285
- path: ["semantic", "color", "foreground", "highlight"],
285
+ name: "calciteColorSurfaceHighlight",
286
+ path: ["semantic", "color", "surface", "highlight"],
286
287
  },
287
288
  },
288
289
  transparent: {
@@ -7,8 +7,8 @@ $calcite-color-background-none: rgba(255, 255, 255, 0);
7
7
  $calcite-color-foreground-1: #2b2b2b;
8
8
  $calcite-color-foreground-2: #212121;
9
9
  $calcite-color-foreground-3: #141414;
10
- $calcite-color-foreground-current: #2b465f; // deprecated, use --calcite-color-foreground-highlight instead
11
- $calcite-color-foreground-highlight: #2b465f;
10
+ $calcite-color-foreground-current: #2b465f; // deprecated, use --calcite-color-surface-highlight instead
11
+ $calcite-color-surface-highlight: #2b465f;
12
12
  $calcite-color-transparent: rgba(255, 255, 255, 0);
13
13
  $calcite-color-transparent-hover: rgba(255, 255, 255, 0.12);
14
14
  $calcite-color-transparent-press: rgba(255, 255, 255, 0.16);
@@ -45,8 +45,8 @@
45
45
  --calcite-color-transparent-press: rgba(0, 0, 0, 0.08);
46
46
  --calcite-color-transparent-hover: rgba(0, 0, 0, 0.04);
47
47
  --calcite-color-transparent: rgba(0, 0, 0, 0);
48
- --calcite-color-foreground-highlight: #d6efff;
49
- --calcite-color-foreground-current: #d6efff; /** deprecated, use --calcite-color-foreground-highlight instead */
48
+ --calcite-color-surface-highlight: #d6efff;
49
+ --calcite-color-foreground-current: #d6efff; /** deprecated, use --calcite-color-surface-highlight instead */
50
50
  --calcite-color-foreground-3: #ebebeb;
51
51
  --calcite-color-foreground-2: #f2f2f2;
52
52
  --calcite-color-foreground-1: #ffffff;
@@ -92,8 +92,8 @@
92
92
  --calcite-color-transparent-press: rgba(255, 255, 255, 0.16);
93
93
  --calcite-color-transparent-hover: rgba(255, 255, 255, 0.12);
94
94
  --calcite-color-transparent: rgba(255, 255, 255, 0);
95
- --calcite-color-foreground-highlight: #2b465f;
96
- --calcite-color-foreground-current: #2b465f; /** deprecated, use --calcite-color-foreground-highlight instead */
95
+ --calcite-color-surface-highlight: #2b465f;
96
+ --calcite-color-foreground-current: #2b465f; /** deprecated, use --calcite-color-surface-highlight instead */
97
97
  --calcite-color-foreground-3: #141414;
98
98
  --calcite-color-foreground-2: #212121;
99
99
  --calcite-color-foreground-1: #2b2b2b;
@@ -7,8 +7,8 @@ $calcite-color-background-none: rgba(255, 255, 255, 0);
7
7
  $calcite-color-foreground-1: #ffffff;
8
8
  $calcite-color-foreground-2: #f2f2f2;
9
9
  $calcite-color-foreground-3: #ebebeb;
10
- $calcite-color-foreground-current: #d6efff; // deprecated, use --calcite-color-foreground-highlight instead
11
- $calcite-color-foreground-highlight: #d6efff;
10
+ $calcite-color-foreground-current: #d6efff; // deprecated, use --calcite-color-surface-highlight instead
11
+ $calcite-color-surface-highlight: #d6efff;
12
12
  $calcite-color-transparent: rgba(0, 0, 0, 0);
13
13
  $calcite-color-transparent-hover: rgba(0, 0, 0, 0.04);
14
14
  $calcite-color-transparent-press: rgba(0, 0, 0, 0.08);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@esri/calcite-design-tokens",
3
- "version": "3.2.0-next.7",
3
+ "version": "3.2.0-next.9",
4
4
  "description": "Esri's Calcite Design System Tokens",
5
5
  "keywords": [
6
6
  "Calcite",
@@ -46,5 +46,5 @@
46
46
  "devDependencies": {
47
47
  "vitest": "3.2.4"
48
48
  },
49
- "gitHead": "386f7067abf8c09ec3741bb5ddde24337b508d5e"
49
+ "gitHead": "e42d19fc444149812dbf379ce94351bab3537b10"
50
50
  }