@midas-ds/components 8.0.0 → 8.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -14,7 +14,7 @@
14
14
  "description": "Midas Components",
15
15
  "homepage": "https://designsystem.migrationsverket.se/",
16
16
  "license": "CC0-1.0",
17
- "version": "8.0.0",
17
+ "version": "8.1.0",
18
18
  "main": "./index.cjs",
19
19
  "module": "./index.js",
20
20
  "types": "./index.d.ts",
package/select/utils.d.ts CHANGED
@@ -2,3 +2,10 @@ export declare const options: {
2
2
  name: string;
3
3
  id: string;
4
4
  }[];
5
+ export declare const optionsWithSections: {
6
+ name: string;
7
+ children: {
8
+ name: string;
9
+ id: string;
10
+ }[];
11
+ }[];
package/theme/index.d.ts CHANGED
@@ -37,16 +37,19 @@ export declare const theme: {
37
37
  purple80: string;
38
38
  purple140: string;
39
39
  red100: string;
40
- signalBlue20: string;
41
- signalBlue140: string;
40
+ signalBlue10: string;
41
+ signalBlue100: string;
42
42
  signalGreen20: string;
43
- signalGreen140: string;
43
+ signalGreen30: string;
44
+ signalGreen100: string;
45
+ signalYellow10: string;
46
+ signalYellow100: string;
44
47
  signalRed20: string;
45
- signalRed140: string;
48
+ signalRed30: string;
49
+ signalRed80: string;
50
+ signalRed100: string;
46
51
  signalRed160: string;
47
52
  signalRed180: string;
48
- signalYellow20: string;
49
- signalYellow140: string;
50
53
  };
51
54
  typography: {
52
55
  fontFamily: string;
@@ -134,10 +137,10 @@ export declare const theme: {
134
137
  layerAccentHover02: string;
135
138
  layerAccentSelected02: string;
136
139
  brandPrimary: string;
137
- borderStrong: string;
138
- borderMedium: string;
140
+ borderPrimary: string;
141
+ borderSecondary: string;
139
142
  borderSubtle: string;
140
- borderBrand: string;
143
+ borderTertiary: string;
141
144
  borderInvalid: string;
142
145
  borderDisabled: string;
143
146
  field01: string;
@@ -161,14 +164,16 @@ export declare const theme: {
161
164
  linkHover: string;
162
165
  linkPressed: string;
163
166
  linkVisited: string;
164
- notificationBorderSuccess: string;
165
- notificationBorderInfo: string;
166
- notificationBorderImportant: string;
167
- notificationBorderWarning: string;
168
- notificationBackgroundSuccess: string;
169
- notificationBackgroundInfo: string;
170
- notificationBackgroundImportant: string;
171
- notificationBackgroundWarning: string;
167
+ supportBorderSuccess: string;
168
+ supportBorderInfo: string;
169
+ supportBorderImportant: string;
170
+ supportBorderWarning: string;
171
+ supportBackgroundSuccess: string;
172
+ supportBackgroundSuccessHover: string;
173
+ supportBackgroundInfo: string;
174
+ supportBackgroundImportant: string;
175
+ supportBackgroundWarning: string;
176
+ supportBackgroundWarningHover: string;
172
177
  textPrimary: string;
173
178
  textSecondary: string;
174
179
  textTertiary: string;
package/theme/tokens.d.ts CHANGED
@@ -35,16 +35,19 @@ export declare const baseColors: {
35
35
  purple80: string;
36
36
  purple140: string;
37
37
  red100: string;
38
- signalBlue20: string;
39
- signalBlue140: string;
38
+ signalBlue10: string;
39
+ signalBlue100: string;
40
40
  signalGreen20: string;
41
- signalGreen140: string;
41
+ signalGreen30: string;
42
+ signalGreen100: string;
43
+ signalYellow10: string;
44
+ signalYellow100: string;
42
45
  signalRed20: string;
43
- signalRed140: string;
46
+ signalRed30: string;
47
+ signalRed80: string;
48
+ signalRed100: string;
44
49
  signalRed160: string;
45
50
  signalRed180: string;
46
- signalYellow20: string;
47
- signalYellow140: string;
48
51
  };
49
52
  export declare const typography: {
50
53
  fontFamily: string;
@@ -132,10 +135,10 @@ export declare const semantic: {
132
135
  layerAccentHover02: string;
133
136
  layerAccentSelected02: string;
134
137
  brandPrimary: string;
135
- borderStrong: string;
136
- borderMedium: string;
138
+ borderPrimary: string;
139
+ borderSecondary: string;
137
140
  borderSubtle: string;
138
- borderBrand: string;
141
+ borderTertiary: string;
139
142
  borderInvalid: string;
140
143
  borderDisabled: string;
141
144
  field01: string;
@@ -159,14 +162,16 @@ export declare const semantic: {
159
162
  linkHover: string;
160
163
  linkPressed: string;
161
164
  linkVisited: string;
162
- notificationBorderSuccess: string;
163
- notificationBorderInfo: string;
164
- notificationBorderImportant: string;
165
- notificationBorderWarning: string;
166
- notificationBackgroundSuccess: string;
167
- notificationBackgroundInfo: string;
168
- notificationBackgroundImportant: string;
169
- notificationBackgroundWarning: string;
165
+ supportBorderSuccess: string;
166
+ supportBorderInfo: string;
167
+ supportBorderImportant: string;
168
+ supportBorderWarning: string;
169
+ supportBackgroundSuccess: string;
170
+ supportBackgroundSuccessHover: string;
171
+ supportBackgroundInfo: string;
172
+ supportBackgroundImportant: string;
173
+ supportBackgroundWarning: string;
174
+ supportBackgroundWarningHover: string;
170
175
  textPrimary: string;
171
176
  textSecondary: string;
172
177
  textTertiary: string;
package/theme.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./tokens-BzHPOv0Z.cjs"),s={...e.tokens};exports.baseColors=e.baseColors;exports.breakpoints=e.breakpoints;exports.semantic=e.semantic;exports.spacing=e.spacing;exports.states=e.states;exports.transitions=e.transitions;exports.typography=e.typography;exports.windowSizes=e.windowSizes;exports.zIndex=e.zIndex;exports.theme=s;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./tokens-B0IQe84F.cjs"),s={...e.tokens};exports.baseColors=e.baseColors;exports.breakpoints=e.breakpoints;exports.semantic=e.semantic;exports.spacing=e.spacing;exports.states=e.states;exports.transitions=e.transitions;exports.typography=e.typography;exports.windowSizes=e.windowSizes;exports.zIndex=e.zIndex;exports.theme=s;
package/theme.js CHANGED
@@ -1,5 +1,5 @@
1
- import { t as s } from "./tokens-f_GueHFO.js";
2
- import { b as n, f as r, s as i, c as p, d as m, e as c, a as b, w as d, z as f } from "./tokens-f_GueHFO.js";
1
+ import { t as s } from "./tokens-BWq37Xsh.js";
2
+ import { b as n, f as r, s as i, c as p, d as m, e as c, a as b, w as d, z as f } from "./tokens-BWq37Xsh.js";
3
3
  const t = { ...s };
4
4
  export {
5
5
  n as baseColors,
@@ -0,0 +1,2 @@
1
+ import { ToggleButtonProps } from 'react-aria-components';
2
+ export declare const ToggleButton: React.FC<ToggleButtonProps & React.RefAttributes<HTMLButtonElement>>;
@@ -0,0 +1,3 @@
1
+ import { ToggleButtonGroupProps } from 'react-aria-components';
2
+ import * as React from 'react';
3
+ export declare const ToggleButtonGroup: React.FC<ToggleButtonGroupProps & React.RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,2 @@
1
+ export * from './ToggleButton';
2
+ export * from './ToggleButtonGroup';
@@ -0,0 +1 @@
1
+ "use strict";const r={black:"#000000",white:"#ffffff",blackHover:"#0d0d0d",whiteHover:"#e6e6e6",gray10:"#f2f2f2",gray20:"#e6e6e6",gray30:"#d9d9d9",gray40:"#cccccc",gray50:"#bfbfbf",gray60:"#b3b3b3",gray70:"#a6a6a6",gray80:"#999999",gray90:"#8c8c8c",gray100:"#808080",gray110:"#737373",gray120:"#666666",gray130:"#5d5d5d",gray140:"#525252",gray150:"#474747",gray160:"#383838",gray170:"#333333",gray180:"#262626",gray190:"#212121",gray200:"#171717",blue10:"#eaf2f6",blue20:"#d5e5ed",blue40:"#abcbdb",blue60:"#82b0c9",blue80:"#5897b8",blue90:"#4289ad",blue100:"#2e7ca5",blue140:"#25607f",blue170:"#143c50",purple80:"#b46ab4",purple140:"#954b95",red100:"#b90835",signalBlue10:"#eaf2f6",signalBlue100:"#0066cc",signalGreen20:"#d5f2d9",signalGreen30:"#bae5c5",signalGreen100:"#008d3c",signalYellow10:"#fff8e1",signalYellow100:"#fdb813",signalRed20:"#ffdfdf",signalRed30:"#fcc8c8",signalRed80:"#eb4e4e",signalRed100:"#e62323",signalRed160:"#b31b1b",signalRed180:"#801313"},a={fontFamily:'"Inter", sans-serif',lineHeight01:1,lineHeight02:1.125,lineHeight03:1.25,lineHeight04:1.375,lineHeight05:1.5,lineHeight06:1.75,lineHeight07:2,lineHeight08:2.25,lineHeight09:2.5,size01:"0.75rem",size02:"0.875rem",size03:"1rem",size04:"1.125rem",size05:"1.25rem",size06:"1.5rem",size07:"1.75rem",size08:"2rem",size09:"2.25rem",size10:"2.625rem",weightThin:100,weightExtraLight:200,weightLight:300,weightRegular:400,weightMedium:500,weightSemiBold:600,weightBold:700,weightExtraBold:800,weightBlack:900},g={"01":"0.125rem","02":"0.25rem","03":"0.5rem","04":"0.75rem","05":"1rem","06":"1.5rem","07":"2rem","08":"2.5rem","09":"3rem",10:"4rem",11:"5rem",12:"6rem"},i={focus:"0 0 0 2px light-dark(white, black), 0 0 0 4px light-dark(black, white)"},l={slow:"500ms",normal:"300ms",fast:"250ms"},e={md:768,lg:1200,xl:1440},t={sm:`(max-width: ${e.md-1}px)`,md:`(min-width: ${e.md}px)`,lg:`(min-width: ${e.lg}px)`,xl:`(min-width: ${e.xl}px)`,forcedColorsMode:"(forced-colors: active)",darkMode:"(prefers-color-scheme: dark)",prefersReducedMotion:"(prefers-reduced-motion: reduced)"},d={background:`light-dark(${r.white}, ${r.gray200})`,backgroundHover:`light-dark(${r.whiteHover}, ${r.gray190})`,backgroundInverse:`light-dark(${r.gray200}, ${r.gray10})`,layer01:`light-dark(${r.gray10}, ${r.gray180})`,layerHover01:`light-dark(${r.gray20}, ${r.gray170})`,layerSelected01:`light-dark(${r.gray30}, ${r.gray160})`,layerSelectedHover01:`light-dark(${r.gray40}, ${r.gray150})`,layer02:`light-dark(${r.white}, ${r.gray160})`,layerHover02:`light-dark(${r.whiteHover}, ${r.gray150})`,layerSelected02:`light-dark(${r.gray30}, ${r.gray140})`,layerSelectedHover02:`light-dark(${r.gray40}, ${r.gray130})`,layerAccent01:`light-dark(${r.gray30}, ${r.gray160})`,layerAccentHover01:`light-dark(${r.gray40}, ${r.gray150})`,layerAccentSelected01:`light-dark(${r.gray50}, ${r.gray140})`,layerAccent02:`light-dark(${r.gray10}, ${r.gray180})`,layerAccentHover02:`light-dark(${r.gray20}, ${r.gray170})`,layerAccentSelected02:`light-dark(${r.gray30}, ${r.gray160})`,brandPrimary:`light-dark(${r.red100}, ${r.red100})`,borderPrimary:`light-dark(${r.gray200}, ${r.gray10})`,borderSecondary:`light-dark(${r.gray110}, ${r.gray90})`,borderSubtle:`light-dark(${r.gray50}, ${r.gray160})`,borderTertiary:`light-dark(${r.blue170}, ${r.blue100})`,borderInvalid:`light-dark(${r.signalRed100}, ${r.signalRed80})`,borderDisabled:`light-dark(${r.gray50}, ${r.gray140})`,field01:`light-dark(${r.gray10}, ${r.gray180})`,fieldHover01:`light-dark(${r.gray20}, ${r.gray170})`,fieldActive01:`light-dark(${r.gray30}, ${r.gray160})`,field02:`light-dark(${r.white}, ${r.gray160})`,fieldHover02:`light-dark(${r.whiteHover}, ${r.gray150})`,fieldActive02:`light-dark(${r.gray30}, ${r.gray140})`,fieldDisabled:`light-dark(${r.gray10}, ${r.gray180})`,fieldSkeleton:`light-dark(${r.gray10}, ${r.gray180})`,iconPrimary:`light-dark(${r.gray200}, ${r.gray10})`,iconSecondary:`light-dark(${r.blue170}, ${r.gray10})`,iconInverse:`light-dark(${r.white}, ${r.gray200})`,iconOnColor:`light-dark(${r.white}, ${r.white})`,iconDisabled:`light-dark(${r.gray50}, ${r.gray140})`,iconSuccess:`light-dark(${r.signalGreen100}, ${r.signalGreen100})`,iconInfo:`light-dark(${r.signalBlue100}, ${r.signalBlue100})`,iconWarning:`light-dark(${r.signalRed100}, ${r.signalRed100})`,iconImportant:`light-dark(${r.signalYellow100}, ${r.signalYellow100})`,linkEnabled:`light-dark(${r.blue100}, ${r.blue90})`,linkHover:`light-dark(${r.blue170}, ${r.blue80})`,linkPressed:`light-dark(${r.gray200}, ${r.blue60})`,linkVisited:`light-dark(${r.purple140}, ${r.purple80})`,supportBorderSuccess:`light-dark(${r.signalGreen100}, ${r.signalGreen100})`,supportBorderInfo:`light-dark(${r.signalBlue100}, ${r.signalBlue100})`,supportBorderImportant:`light-dark(${r.signalYellow100}, ${r.signalYellow100})`,supportBorderWarning:`light-dark(${r.signalRed100}, ${r.signalRed100})`,supportBackgroundSuccess:`light-dark(${r.signalGreen20}, ${r.gray180})`,supportBackgroundSuccessHover:`light-dark(${r.signalGreen30}, ${r.gray170})`,supportBackgroundInfo:`light-dark(${r.signalBlue10}, ${r.gray180})`,supportBackgroundImportant:`light-dark(${r.signalYellow10}, ${r.gray180})`,supportBackgroundWarning:`light-dark(${r.signalRed20}, ${r.gray180})`,supportBackgroundWarningHover:`light-dark(${r.signalRed30}, ${r.gray170})`,textPrimary:`light-dark(${r.gray200}, ${r.gray10})`,textSecondary:`light-dark(${r.gray140}, ${r.gray70})`,textTertiary:`light-dark(${r.blue170}, ${r.gray10})`,textOnColor:`light-dark(${r.white}, ${r.white})`,textInverse:`light-dark(${r.gray10}, ${r.gray200})`,textDisabled:`light-dark(${r.gray50}, ${r.gray140})`,textInvalid:`light-dark(${r.signalRed100}, ${r.signalRed80})`,textPlaceholder:`light-dark(${r.gray70}, ${r.gray140})`,buttonBackgroundPrimary:`light-dark(${r.blue170}, ${r.blue100})`,buttonBackgroundPrimaryHover:`light-dark(${r.blue140}, ${r.blue140})`,buttonBackgroundPrimaryActive:`light-dark(${r.blue100}, ${r.blue170})`,buttonBackgroundSecondary:`light-dark(${r.white}, ${r.gray200})`,buttonBackgroundSecondaryHover:`light-dark(${r.whiteHover}, ${r.gray190})`,buttonBackgroundSecondaryActive:`light-dark(${r.gray30}, ${r.gray180})`,buttonBackgroundTertiaryHover:`light-dark(${r.whiteHover}, ${r.gray190})`,buttonBackgroundTertiaryActive:`light-dark(${r.gray30}, ${r.gray180})`,buttonBackgroundDanger:`light-dark(${r.signalRed100}, ${r.signalRed100})`,buttonBackgroundDangerHover:`light-dark(${r.signalRed160}, ${r.signalRed160})`,buttonBackgroundDangerActive:`light-dark(${r.signalRed180}, ${r.signalRed180})`,buttonBackgroundDisabled:`light-dark(${r.gray10}, ${r.gray180})`,buttonBackgroundSkeleton:`light-dark(${r.gray10}, ${r.gray180})`,buttonBorderSecondary:`light-dark(${r.blue170}, ${r.gray10})`,logoPrimary:`light-dark(${r.red100}, ${r.white})`},n={base:1,above:10,modal:1e3,toast:1100,skipToContent:1200},o=Object.freeze(Object.defineProperty({__proto__:null,baseColors:r,breakpoints:t,semantic:d,spacing:g,states:i,transitions:l,typography:a,windowSizes:e,zIndex:n},Symbol.toStringTag,{value:"Module"}));exports.baseColors=r;exports.breakpoints=t;exports.semantic=d;exports.spacing=g;exports.states=i;exports.tokens=o;exports.transitions=l;exports.typography=a;exports.windowSizes=e;exports.zIndex=n;
@@ -35,17 +35,20 @@ const r = {
35
35
  purple80: "#b46ab4",
36
36
  purple140: "#954b95",
37
37
  red100: "#b90835",
38
- signalBlue20: "#eaf2f6",
39
- signalBlue140: "#0066cc",
38
+ signalBlue10: "#eaf2f6",
39
+ signalBlue100: "#0066cc",
40
40
  signalGreen20: "#d5f2d9",
41
- signalGreen140: "#008d3c",
41
+ signalGreen30: "#bae5c5",
42
+ signalGreen100: "#008d3c",
43
+ signalYellow10: "#fff8e1",
44
+ signalYellow100: "#fdb813",
42
45
  signalRed20: "#ffdfdf",
43
- signalRed140: "#e62323",
46
+ signalRed30: "#fcc8c8",
47
+ signalRed80: "#eb4e4e",
48
+ signalRed100: "#e62323",
44
49
  signalRed160: "#b31b1b",
45
- signalRed180: "#801313",
46
- signalYellow20: "#fff8e1",
47
- signalYellow140: "#fdb813"
48
- }, e = {
50
+ signalRed180: "#801313"
51
+ }, a = {
49
52
  fontFamily: '"Inter", sans-serif',
50
53
  lineHeight01: 1,
51
54
  // 16px
@@ -120,20 +123,20 @@ const r = {
120
123
  12: "6rem"
121
124
  // 96px
122
125
  }, i = {
123
- focus: "0 0 0 2px white, 0 0 0 4px black"
126
+ focus: "0 0 0 2px light-dark(white, black), 0 0 0 4px light-dark(black, white)"
124
127
  }, l = {
125
128
  slow: "500ms",
126
129
  normal: "300ms",
127
130
  fast: "250ms"
128
- }, a = {
131
+ }, e = {
129
132
  md: 768,
130
133
  lg: 1200,
131
134
  xl: 1440
132
135
  }, t = {
133
- sm: `(max-width: ${a.md - 1}px)`,
134
- md: `(min-width: ${a.md}px)`,
135
- lg: `(min-width: ${a.lg}px)`,
136
- xl: `(min-width: ${a.xl}px)`,
136
+ sm: `(max-width: ${e.md - 1}px)`,
137
+ md: `(min-width: ${e.md}px)`,
138
+ lg: `(min-width: ${e.lg}px)`,
139
+ xl: `(min-width: ${e.xl}px)`,
137
140
  forcedColorsMode: "(forced-colors: active)",
138
141
  darkMode: "(prefers-color-scheme: dark)",
139
142
  prefersReducedMotion: "(prefers-reduced-motion: reduced)"
@@ -156,11 +159,11 @@ const r = {
156
159
  layerAccentHover02: `light-dark(${r.gray20}, ${r.gray170})`,
157
160
  layerAccentSelected02: `light-dark(${r.gray30}, ${r.gray160})`,
158
161
  brandPrimary: `light-dark(${r.red100}, ${r.red100})`,
159
- borderStrong: `light-dark(${r.gray200}, ${r.gray10})`,
160
- borderMedium: `light-dark(${r.gray110}, ${r.gray90})`,
162
+ borderPrimary: `light-dark(${r.gray200}, ${r.gray10})`,
163
+ borderSecondary: `light-dark(${r.gray110}, ${r.gray90})`,
161
164
  borderSubtle: `light-dark(${r.gray50}, ${r.gray160})`,
162
- borderBrand: `light-dark(${r.blue170}, ${r.blue170})`,
163
- borderInvalid: `light-dark(${r.signalRed140}, ${r.signalRed140})`,
165
+ borderTertiary: `light-dark(${r.blue170}, ${r.blue100})`,
166
+ borderInvalid: `light-dark(${r.signalRed100}, ${r.signalRed80})`,
164
167
  borderDisabled: `light-dark(${r.gray50}, ${r.gray140})`,
165
168
  field01: `light-dark(${r.gray10}, ${r.gray180})`,
166
169
  fieldHover01: `light-dark(${r.gray20}, ${r.gray170})`,
@@ -175,29 +178,31 @@ const r = {
175
178
  iconInverse: `light-dark(${r.white}, ${r.gray200})`,
176
179
  iconOnColor: `light-dark(${r.white}, ${r.white})`,
177
180
  iconDisabled: `light-dark(${r.gray50}, ${r.gray140})`,
178
- iconSuccess: `light-dark(${r.signalGreen140}, ${r.signalGreen140})`,
179
- iconInfo: `light-dark(${r.signalBlue140}, ${r.signalBlue140})`,
180
- iconWarning: `light-dark(${r.signalRed140}, ${r.signalRed140})`,
181
- iconImportant: `light-dark(${r.signalYellow140}, ${r.signalYellow140})`,
181
+ iconSuccess: `light-dark(${r.signalGreen100}, ${r.signalGreen100})`,
182
+ iconInfo: `light-dark(${r.signalBlue100}, ${r.signalBlue100})`,
183
+ iconWarning: `light-dark(${r.signalRed100}, ${r.signalRed100})`,
184
+ iconImportant: `light-dark(${r.signalYellow100}, ${r.signalYellow100})`,
182
185
  linkEnabled: `light-dark(${r.blue100}, ${r.blue90})`,
183
186
  linkHover: `light-dark(${r.blue170}, ${r.blue80})`,
184
187
  linkPressed: `light-dark(${r.gray200}, ${r.blue60})`,
185
188
  linkVisited: `light-dark(${r.purple140}, ${r.purple80})`,
186
- notificationBorderSuccess: `light-dark(${r.signalGreen140}, ${r.signalGreen140})`,
187
- notificationBorderInfo: `light-dark(${r.signalBlue140}, ${r.signalBlue140})`,
188
- notificationBorderImportant: `light-dark(${r.signalYellow140}, ${r.signalYellow140})`,
189
- notificationBorderWarning: `light-dark(${r.signalRed140}, ${r.signalRed140})`,
190
- notificationBackgroundSuccess: `light-dark(${r.signalGreen20}, ${r.gray180})`,
191
- notificationBackgroundInfo: `light-dark(${r.signalBlue20}, ${r.gray180})`,
192
- notificationBackgroundImportant: `light-dark(${r.signalYellow20}, ${r.gray180})`,
193
- notificationBackgroundWarning: `light-dark(${r.signalRed20}, ${r.gray180})`,
189
+ supportBorderSuccess: `light-dark(${r.signalGreen100}, ${r.signalGreen100})`,
190
+ supportBorderInfo: `light-dark(${r.signalBlue100}, ${r.signalBlue100})`,
191
+ supportBorderImportant: `light-dark(${r.signalYellow100}, ${r.signalYellow100})`,
192
+ supportBorderWarning: `light-dark(${r.signalRed100}, ${r.signalRed100})`,
193
+ supportBackgroundSuccess: `light-dark(${r.signalGreen20}, ${r.gray180})`,
194
+ supportBackgroundSuccessHover: `light-dark(${r.signalGreen30}, ${r.gray170})`,
195
+ supportBackgroundInfo: `light-dark(${r.signalBlue10}, ${r.gray180})`,
196
+ supportBackgroundImportant: `light-dark(${r.signalYellow10}, ${r.gray180})`,
197
+ supportBackgroundWarning: `light-dark(${r.signalRed20}, ${r.gray180})`,
198
+ supportBackgroundWarningHover: `light-dark(${r.signalRed30}, ${r.gray170})`,
194
199
  textPrimary: `light-dark(${r.gray200}, ${r.gray10})`,
195
200
  textSecondary: `light-dark(${r.gray140}, ${r.gray70})`,
196
201
  textTertiary: `light-dark(${r.blue170}, ${r.gray10})`,
197
202
  textOnColor: `light-dark(${r.white}, ${r.white})`,
198
203
  textInverse: `light-dark(${r.gray10}, ${r.gray200})`,
199
204
  textDisabled: `light-dark(${r.gray50}, ${r.gray140})`,
200
- textInvalid: `light-dark(${r.signalRed140}, ${r.signalRed140})`,
205
+ textInvalid: `light-dark(${r.signalRed100}, ${r.signalRed80})`,
201
206
  textPlaceholder: `light-dark(${r.gray70}, ${r.gray140})`,
202
207
  buttonBackgroundPrimary: `light-dark(${r.blue170}, ${r.blue100})`,
203
208
  buttonBackgroundPrimaryHover: `light-dark(${r.blue140}, ${r.blue140})`,
@@ -207,7 +212,7 @@ const r = {
207
212
  buttonBackgroundSecondaryActive: `light-dark(${r.gray30}, ${r.gray180})`,
208
213
  buttonBackgroundTertiaryHover: `light-dark(${r.whiteHover}, ${r.gray190})`,
209
214
  buttonBackgroundTertiaryActive: `light-dark(${r.gray30}, ${r.gray180})`,
210
- buttonBackgroundDanger: `light-dark(${r.signalRed140}, ${r.signalRed140})`,
215
+ buttonBackgroundDanger: `light-dark(${r.signalRed100}, ${r.signalRed100})`,
211
216
  buttonBackgroundDangerHover: `light-dark(${r.signalRed160}, ${r.signalRed160})`,
212
217
  buttonBackgroundDangerActive: `light-dark(${r.signalRed180}, ${r.signalRed180})`,
213
218
  buttonBackgroundDisabled: `light-dark(${r.gray10}, ${r.gray180})`,
@@ -228,12 +233,12 @@ const r = {
228
233
  spacing: g,
229
234
  states: i,
230
235
  transitions: l,
231
- typography: e,
232
- windowSizes: a,
236
+ typography: a,
237
+ windowSizes: e,
233
238
  zIndex: n
234
239
  }, Symbol.toStringTag, { value: "Module" }));
235
240
  export {
236
- e as a,
241
+ a,
237
242
  r as b,
238
243
  g as c,
239
244
  i as d,
@@ -241,6 +246,6 @@ export {
241
246
  t as f,
242
247
  d as s,
243
248
  o as t,
244
- a as w,
249
+ e as w,
245
250
  n as z
246
251
  };
@@ -1 +0,0 @@
1
- "use strict";const r={black:"#000000",white:"#ffffff",blackHover:"#0d0d0d",whiteHover:"#e6e6e6",gray10:"#f2f2f2",gray20:"#e6e6e6",gray30:"#d9d9d9",gray40:"#cccccc",gray50:"#bfbfbf",gray60:"#b3b3b3",gray70:"#a6a6a6",gray80:"#999999",gray90:"#8c8c8c",gray100:"#808080",gray110:"#737373",gray120:"#666666",gray130:"#5d5d5d",gray140:"#525252",gray150:"#474747",gray160:"#383838",gray170:"#333333",gray180:"#262626",gray190:"#212121",gray200:"#171717",blue10:"#eaf2f6",blue20:"#d5e5ed",blue40:"#abcbdb",blue60:"#82b0c9",blue80:"#5897b8",blue90:"#4289ad",blue100:"#2e7ca5",blue140:"#25607f",blue170:"#143c50",purple80:"#b46ab4",purple140:"#954b95",red100:"#b90835",signalBlue20:"#eaf2f6",signalBlue140:"#0066cc",signalGreen20:"#d5f2d9",signalGreen140:"#008d3c",signalRed20:"#ffdfdf",signalRed140:"#e62323",signalRed160:"#b31b1b",signalRed180:"#801313",signalYellow20:"#fff8e1",signalYellow140:"#fdb813"},a={fontFamily:'"Inter", sans-serif',lineHeight01:1,lineHeight02:1.125,lineHeight03:1.25,lineHeight04:1.375,lineHeight05:1.5,lineHeight06:1.75,lineHeight07:2,lineHeight08:2.25,lineHeight09:2.5,size01:"0.75rem",size02:"0.875rem",size03:"1rem",size04:"1.125rem",size05:"1.25rem",size06:"1.5rem",size07:"1.75rem",size08:"2rem",size09:"2.25rem",size10:"2.625rem",weightThin:100,weightExtraLight:200,weightLight:300,weightRegular:400,weightMedium:500,weightSemiBold:600,weightBold:700,weightExtraBold:800,weightBlack:900},g={"01":"0.125rem","02":"0.25rem","03":"0.5rem","04":"0.75rem","05":"1rem","06":"1.5rem","07":"2rem","08":"2.5rem","09":"3rem",10:"4rem",11:"5rem",12:"6rem"},i={focus:"0 0 0 2px white, 0 0 0 4px black"},t={slow:"500ms",normal:"300ms",fast:"250ms"},e={md:768,lg:1200,xl:1440},l={sm:`(max-width: ${e.md-1}px)`,md:`(min-width: ${e.md}px)`,lg:`(min-width: ${e.lg}px)`,xl:`(min-width: ${e.xl}px)`,forcedColorsMode:"(forced-colors: active)",darkMode:"(prefers-color-scheme: dark)",prefersReducedMotion:"(prefers-reduced-motion: reduced)"},d={background:`light-dark(${r.white}, ${r.gray200})`,backgroundHover:`light-dark(${r.whiteHover}, ${r.gray190})`,backgroundInverse:`light-dark(${r.gray200}, ${r.gray10})`,layer01:`light-dark(${r.gray10}, ${r.gray180})`,layerHover01:`light-dark(${r.gray20}, ${r.gray170})`,layerSelected01:`light-dark(${r.gray30}, ${r.gray160})`,layerSelectedHover01:`light-dark(${r.gray40}, ${r.gray150})`,layer02:`light-dark(${r.white}, ${r.gray160})`,layerHover02:`light-dark(${r.whiteHover}, ${r.gray150})`,layerSelected02:`light-dark(${r.gray30}, ${r.gray140})`,layerSelectedHover02:`light-dark(${r.gray40}, ${r.gray130})`,layerAccent01:`light-dark(${r.gray30}, ${r.gray160})`,layerAccentHover01:`light-dark(${r.gray40}, ${r.gray150})`,layerAccentSelected01:`light-dark(${r.gray50}, ${r.gray140})`,layerAccent02:`light-dark(${r.gray10}, ${r.gray180})`,layerAccentHover02:`light-dark(${r.gray20}, ${r.gray170})`,layerAccentSelected02:`light-dark(${r.gray30}, ${r.gray160})`,brandPrimary:`light-dark(${r.red100}, ${r.red100})`,borderStrong:`light-dark(${r.gray200}, ${r.gray10})`,borderMedium:`light-dark(${r.gray110}, ${r.gray90})`,borderSubtle:`light-dark(${r.gray50}, ${r.gray160})`,borderBrand:`light-dark(${r.blue170}, ${r.blue170})`,borderInvalid:`light-dark(${r.signalRed140}, ${r.signalRed140})`,borderDisabled:`light-dark(${r.gray50}, ${r.gray140})`,field01:`light-dark(${r.gray10}, ${r.gray180})`,fieldHover01:`light-dark(${r.gray20}, ${r.gray170})`,fieldActive01:`light-dark(${r.gray30}, ${r.gray160})`,field02:`light-dark(${r.white}, ${r.gray160})`,fieldHover02:`light-dark(${r.whiteHover}, ${r.gray150})`,fieldActive02:`light-dark(${r.gray30}, ${r.gray140})`,fieldDisabled:`light-dark(${r.gray10}, ${r.gray180})`,fieldSkeleton:`light-dark(${r.gray10}, ${r.gray180})`,iconPrimary:`light-dark(${r.gray200}, ${r.gray10})`,iconSecondary:`light-dark(${r.blue170}, ${r.gray10})`,iconInverse:`light-dark(${r.white}, ${r.gray200})`,iconOnColor:`light-dark(${r.white}, ${r.white})`,iconDisabled:`light-dark(${r.gray50}, ${r.gray140})`,iconSuccess:`light-dark(${r.signalGreen140}, ${r.signalGreen140})`,iconInfo:`light-dark(${r.signalBlue140}, ${r.signalBlue140})`,iconWarning:`light-dark(${r.signalRed140}, ${r.signalRed140})`,iconImportant:`light-dark(${r.signalYellow140}, ${r.signalYellow140})`,linkEnabled:`light-dark(${r.blue100}, ${r.blue90})`,linkHover:`light-dark(${r.blue170}, ${r.blue80})`,linkPressed:`light-dark(${r.gray200}, ${r.blue60})`,linkVisited:`light-dark(${r.purple140}, ${r.purple80})`,notificationBorderSuccess:`light-dark(${r.signalGreen140}, ${r.signalGreen140})`,notificationBorderInfo:`light-dark(${r.signalBlue140}, ${r.signalBlue140})`,notificationBorderImportant:`light-dark(${r.signalYellow140}, ${r.signalYellow140})`,notificationBorderWarning:`light-dark(${r.signalRed140}, ${r.signalRed140})`,notificationBackgroundSuccess:`light-dark(${r.signalGreen20}, ${r.gray180})`,notificationBackgroundInfo:`light-dark(${r.signalBlue20}, ${r.gray180})`,notificationBackgroundImportant:`light-dark(${r.signalYellow20}, ${r.gray180})`,notificationBackgroundWarning:`light-dark(${r.signalRed20}, ${r.gray180})`,textPrimary:`light-dark(${r.gray200}, ${r.gray10})`,textSecondary:`light-dark(${r.gray140}, ${r.gray70})`,textTertiary:`light-dark(${r.blue170}, ${r.gray10})`,textOnColor:`light-dark(${r.white}, ${r.white})`,textInverse:`light-dark(${r.gray10}, ${r.gray200})`,textDisabled:`light-dark(${r.gray50}, ${r.gray140})`,textInvalid:`light-dark(${r.signalRed140}, ${r.signalRed140})`,textPlaceholder:`light-dark(${r.gray70}, ${r.gray140})`,buttonBackgroundPrimary:`light-dark(${r.blue170}, ${r.blue100})`,buttonBackgroundPrimaryHover:`light-dark(${r.blue140}, ${r.blue140})`,buttonBackgroundPrimaryActive:`light-dark(${r.blue100}, ${r.blue170})`,buttonBackgroundSecondary:`light-dark(${r.white}, ${r.gray200})`,buttonBackgroundSecondaryHover:`light-dark(${r.whiteHover}, ${r.gray190})`,buttonBackgroundSecondaryActive:`light-dark(${r.gray30}, ${r.gray180})`,buttonBackgroundTertiaryHover:`light-dark(${r.whiteHover}, ${r.gray190})`,buttonBackgroundTertiaryActive:`light-dark(${r.gray30}, ${r.gray180})`,buttonBackgroundDanger:`light-dark(${r.signalRed140}, ${r.signalRed140})`,buttonBackgroundDangerHover:`light-dark(${r.signalRed160}, ${r.signalRed160})`,buttonBackgroundDangerActive:`light-dark(${r.signalRed180}, ${r.signalRed180})`,buttonBackgroundDisabled:`light-dark(${r.gray10}, ${r.gray180})`,buttonBackgroundSkeleton:`light-dark(${r.gray10}, ${r.gray180})`,buttonBorderSecondary:`light-dark(${r.blue170}, ${r.gray10})`,logoPrimary:`light-dark(${r.red100}, ${r.white})`},n={base:1,above:10,modal:1e3,toast:1100,skipToContent:1200},o=Object.freeze(Object.defineProperty({__proto__:null,baseColors:r,breakpoints:l,semantic:d,spacing:g,states:i,transitions:t,typography:a,windowSizes:e,zIndex:n},Symbol.toStringTag,{value:"Module"}));exports.baseColors=r;exports.breakpoints=l;exports.semantic=d;exports.spacing=g;exports.states=i;exports.tokens=o;exports.transitions=t;exports.typography=a;exports.windowSizes=e;exports.zIndex=n;