@apify/ui-library 1.88.1 → 1.90.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.
Files changed (32) hide show
  1. package/README.md +3 -1
  2. package/dist/src/components/badge.d.ts.map +1 -1
  3. package/dist/src/components/badge.js +1 -1
  4. package/dist/src/components/badge.js.map +1 -1
  5. package/dist/src/design_system/colors/generated/colors_theme.dark.d.ts +23 -23
  6. package/dist/src/design_system/colors/generated/colors_theme.dark.js +23 -23
  7. package/dist/src/design_system/colors/generated/colors_theme.light.d.ts +23 -23
  8. package/dist/src/design_system/colors/generated/colors_theme.light.js +23 -23
  9. package/dist/src/design_system/colors/generated/css_variables.dark.d.ts +1 -1
  10. package/dist/src/design_system/colors/generated/css_variables.dark.js +39 -39
  11. package/dist/src/design_system/colors/generated/css_variables.light.d.ts +1 -1
  12. package/dist/src/design_system/colors/generated/css_variables.light.js +33 -33
  13. package/dist/src/design_system/colors/generated/css_variables_palette.dark.d.ts +1 -1
  14. package/dist/src/design_system/colors/generated/css_variables_palette.dark.js +23 -23
  15. package/dist/src/design_system/colors/generated/css_variables_palette.light.d.ts +1 -1
  16. package/dist/src/design_system/colors/generated/css_variables_palette.light.js +23 -23
  17. package/dist/src/design_system/theme.d.ts +46 -46
  18. package/dist/tsconfig.build.tsbuildinfo +1 -1
  19. package/package.json +2 -2
  20. package/src/components/badge.tsx +2 -1
  21. package/src/design_system/colors/figma_color_tokens.dark.json +1 -1
  22. package/src/design_system/colors/figma_color_tokens.light.json +1 -1
  23. package/src/design_system/colors/generated/colors_theme.dark.ts +23 -23
  24. package/src/design_system/colors/generated/colors_theme.light.ts +23 -23
  25. package/src/design_system/colors/generated/css_variables.dark.ts +39 -39
  26. package/src/design_system/colors/generated/css_variables.light.ts +33 -33
  27. package/src/design_system/colors/generated/css_variables_palette.dark.ts +23 -23
  28. package/src/design_system/colors/generated/css_variables_palette.light.ts +23 -23
  29. package/style/colors/dark.scss +39 -39
  30. package/style/colors/light.scss +33 -33
  31. package/style/colors/palette.dark.scss +23 -23
  32. package/style/colors/palette.light.scss +23 -23
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@apify/ui-library",
3
- "version": "1.88.1",
3
+ "version": "1.90.0",
4
4
  "description": "React UI library used by apify.com",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",
@@ -66,5 +66,5 @@
66
66
  "src",
67
67
  "style"
68
68
  ],
69
- "gitHead": "8ca60abd69f8a03daabb2941633645e9b0379f16"
69
+ "gitHead": "9e6600fd773251daac9236b90a189d6ebbcf1aab"
70
70
  }
package/src/components/badge.tsx CHANGED
@@ -141,10 +141,11 @@ export const Badge = forwardRef(
141
141
  ref={ref}
142
142
  $size={size}
143
143
  $variant={variant}
144
+ as='span'
144
145
  {...props}
145
146
  >
146
147
  {LeadingIcon && <LeadingIcon size={BADGE_ICON_SIZES[size]} />}
147
- {children && (<Text size={BADGE_TEXT_SIZES[size]} type={type} weight="medium">{children}</Text>)}
148
+ {children && (<Text size={BADGE_TEXT_SIZES[size]} type={type} weight="medium" as='span'>{children}</Text>)}
148
149
  </StyledBadge>
149
150
  );
150
151
  },
package/src/design_system/colors/figma_color_tokens.dark.json CHANGED
@@ -607,7 +607,7 @@
607
607
  },
608
608
  "25": {
609
609
  "$type": "color",
610
- "$value": "#f9fafa"
610
+ "$value": "#f9f9fa"
611
611
  },
612
612
  "50": {
613
613
  "$type": "color",
package/src/design_system/colors/figma_color_tokens.light.json CHANGED
@@ -607,7 +607,7 @@
607
607
  },
608
608
  "25": {
609
609
  "$type": "color",
610
- "$value": "#f9fafa"
610
+ "$value": "#f9f9fa"
611
611
  },
612
612
  "50": {
613
613
  "$type": "color",
package/src/design_system/colors/generated/colors_theme.dark.ts CHANGED
@@ -40,29 +40,29 @@ export const darkTheme = {
40
40
  bambooDark: '#305b4a',
41
41
  bambooText: '#65bc99',
42
42
  neutral0: '#ffffff',
43
- neutral25: '#f8f9fc',
44
- neutral50: '#f3f4fa',
45
- neutral75: '#eef0f8',
46
- neutral100: '#e1e3ed',
47
- neutral150: '#d1d5e4',
48
- neutral200: '#c1c6d9',
49
- neutral250: '#b2b8cc',
50
- neutral300: '#a5abc0',
51
- neutral350: '#989eb3',
52
- neutral400: '#8c93a8',
53
- neutral450: '#7d8499',
54
- neutral500: '#6e758a',
55
- neutral550: '#646a7f',
56
- neutral600: '#575d71',
57
- neutral650: '#4d5265',
58
- neutral700: '#414758',
59
- neutral750: '#343847',
60
- neutral775: '#2d313e',
61
- neutral800: '#2a2d39',
62
- neutral850: '#252832',
63
- neutral875: '#1e2027',
64
- neutral900: '#1a1b21',
65
- neutral950: '#101114',
43
+ neutral25: '#f9f9fa',
44
+ neutral50: '#f4f4f5',
45
+ neutral75: '#edeeef',
46
+ neutral100: '#e4e5e6',
47
+ neutral150: '#d2d3d6',
48
+ neutral200: '#c9cbcf',
49
+ neutral250: '#bfc1c5',
50
+ neutral300: '#b4b6bb',
51
+ neutral350: '#a9acb1',
52
+ neutral400: '#9ea2a8',
53
+ neutral450: '#848890',
54
+ neutral500: '#6d7178',
55
+ neutral550: '#5c5f66',
56
+ neutral600: '#4f5257',
57
+ neutral650: '#44464b',
58
+ neutral700: '#3d3f43',
59
+ neutral750: '#333538',
60
+ neutral775: '#292b2e',
61
+ neutral800: '#242528',
62
+ neutral850: '#1f2123',
63
+ neutral875: '#1b1c1d',
64
+ neutral900: '#161718',
65
+ neutral950: '#0a0a0b',
66
66
  yellow25: '#fcdc73',
67
67
  yellow50: '#ffd761',
68
68
  yellow75: '#f9ce4b',
package/src/design_system/colors/generated/colors_theme.light.ts CHANGED
@@ -40,29 +40,29 @@ export const lightTheme = {
40
40
  bambooDark: '#195d46',
41
41
  bambooText: '#007455',
42
42
  neutral0: '#ffffff',
43
- neutral25: '#f8f9fc',
44
- neutral50: '#f3f4fa',
45
- neutral75: '#eef0f8',
46
- neutral100: '#e0e3f2',
47
- neutral150: '#d0d5e9',
48
- neutral200: '#c0c6de',
49
- neutral250: '#b0b8d1',
50
- neutral300: '#a3abc5',
51
- neutral350: '#969eb8',
52
- neutral400: '#8a93ae',
53
- neutral450: '#7b84a0',
54
- neutral500: '#6c7590',
55
- neutral550: '#626a85',
56
- neutral600: '#555d76',
57
- neutral650: '#4b526b',
58
- neutral700: '#3f475d',
59
- neutral750: '#31384d',
60
- neutral775: '#2b3143',
61
- neutral800: '#272d3e',
62
- neutral850: '#242836',
63
- neutral875: '#1d202a',
64
- neutral900: '#191b22',
65
- neutral950: '#0a0b0f',
43
+ neutral25: '#f9f9fa',
44
+ neutral50: '#f4f4f5',
45
+ neutral75: '#edeeef',
46
+ neutral100: '#e4e5e6',
47
+ neutral150: '#d2d3d6',
48
+ neutral200: '#c9cbcf',
49
+ neutral250: '#bfc1c5',
50
+ neutral300: '#b4b6bb',
51
+ neutral350: '#a9acb1',
52
+ neutral400: '#9ea2a8',
53
+ neutral450: '#848890',
54
+ neutral500: '#6d7178',
55
+ neutral550: '#5c5f66',
56
+ neutral600: '#4f5257',
57
+ neutral650: '#44464b',
58
+ neutral700: '#3d3f43',
59
+ neutral750: '#333538',
60
+ neutral775: '#292b2e',
61
+ neutral800: '#242528',
62
+ neutral850: '#1f2123',
63
+ neutral875: '#1b1c1d',
64
+ neutral900: '#161718',
65
+ neutral950: '#0a0a0b',
66
66
  yellow25: '#f9f6ea',
67
67
  yellow50: '#f9f0db',
68
68
  yellow75: '#f7e8c4',
package/src/design_system/colors/generated/css_variables.dark.ts CHANGED
@@ -3,42 +3,42 @@
3
3
  */
4
4
 
5
5
  export const tokens = `
6
- --color-neutral-text: #f3f4fa;
7
- --color-neutral-text-muted: #b2b8cc;
8
- --color-neutral-text-subtle: #8c93a8;
9
- --color-neutral-text-disabled: #575d71;
10
- --color-neutral-text-on-primary: #1a1b21;
11
- --color-neutral-icon-on-primary: #1a1b21;
12
- --color-neutral-background: #1a1b21;
13
- --color-neutral-background-muted: #252832;
14
- --color-neutral-background-subtle: #2a2d39;
15
- --color-neutral-background-white: #f3f4fa;
16
- --color-neutral-card-background: #1e2027;
17
- --color-neutral-card-background-hover: #252832;
18
- --color-neutral-border: #414758;
19
- --color-neutral-separator-subtle: #343847;
20
- --color-neutral-hover: #2d313e;
21
- --color-neutral-disabled: #343847;
22
- --color-neutral-overflow: #2a2d39;
23
- --color-neutral-icon: #b2b8cc;
24
- --color-neutral-icon-subtle: #6e758a;
25
- --color-neutral-icon-disabled: #575d71;
26
- --color-neutral-field-border: #343847;
27
- --color-neutral-action-secondary: #575d71;
28
- --color-neutral-action-secondary-hover: #6e758a;
29
- --color-neutral-action-secondary-active: #343847;
30
- --color-neutral-chip-background: #575d71;
31
- --color-neutral-chip-background-hover: #6e758a;
32
- --color-neutral-chip-background-active: #8c93a8;
33
- --color-neutral-chip-background-disabled: #8c93a8;
34
- --color-neutral-large-tooltip-background: #2a2d39;
35
- --color-neutral-large-tooltip-border: #343847;
6
+ --color-neutral-text: #f4f4f5;
7
+ --color-neutral-text-muted: #bfc1c5;
8
+ --color-neutral-text-subtle: #9ea2a8;
9
+ --color-neutral-text-disabled: #4f5257;
10
+ --color-neutral-text-on-primary: #161718;
11
+ --color-neutral-icon-on-primary: #161718;
12
+ --color-neutral-background: #161718;
13
+ --color-neutral-background-muted: #1f2123;
14
+ --color-neutral-background-subtle: #242528;
15
+ --color-neutral-background-white: #f4f4f5;
16
+ --color-neutral-card-background: #1b1c1d;
17
+ --color-neutral-card-background-hover: #1f2123;
18
+ --color-neutral-border: #3d3f43;
19
+ --color-neutral-separator-subtle: #333538;
20
+ --color-neutral-hover: #292b2e;
21
+ --color-neutral-disabled: #333538;
22
+ --color-neutral-overflow: #242528;
23
+ --color-neutral-icon: #bfc1c5;
24
+ --color-neutral-icon-subtle: #6d7178;
25
+ --color-neutral-icon-disabled: #4f5257;
26
+ --color-neutral-field-border: #333538;
27
+ --color-neutral-action-secondary: #4f5257;
28
+ --color-neutral-action-secondary-hover: #6d7178;
29
+ --color-neutral-action-secondary-active: #333538;
30
+ --color-neutral-chip-background: #4f5257;
31
+ --color-neutral-chip-background-hover: #6d7178;
32
+ --color-neutral-chip-background-active: #9ea2a8;
33
+ --color-neutral-chip-background-disabled: #9ea2a8;
34
+ --color-neutral-large-tooltip-background: #242528;
35
+ --color-neutral-large-tooltip-border: #333538;
36
36
  --color-neutral-small-tooltip-text: #ffffff;
37
- --color-neutral-small-tooltip-background: #2a2d39;
38
- --color-neutral-small-tooltip-border: #343847;
37
+ --color-neutral-small-tooltip-background: #242528;
38
+ --color-neutral-small-tooltip-border: #333538;
39
39
  --color-neutral-overlay: #101114;
40
- --color-neutral-field-background: #101114;
41
- --color-neutral-text-placeholder: #6e758a;
40
+ --color-neutral-field-background: #0a0a0b;
41
+ --color-neutral-text-placeholder: #6d7178;
42
42
  --color-primary-text: #6f9dff;
43
43
  --color-primary-text-interactive: #6f9dff;
44
44
  --color-primary-icon: #3970d7;
@@ -56,11 +56,11 @@ export const tokens = `
56
56
  --color-primary-chip-text: #8ebcff;
57
57
  --color-primary-shadow-active: #295cbb;
58
58
  --color-primary-black-action: #ffffff;
59
- --color-primary-black-action-hover: #d1d5e4;
60
- --color-primary-black-action-active: #f3f4fa;
61
- --color-primary-black-background: #f3f4fa;
62
- --color-primary-black-background-hover: #eef0f8;
63
- --color-primary-black-chip-text: #101114;
59
+ --color-primary-black-action-hover: #d2d3d6;
60
+ --color-primary-black-action-active: #f4f4f5;
61
+ --color-primary-black-background: #f4f4f5;
62
+ --color-primary-black-background-hover: #edeeef;
63
+ --color-primary-black-chip-text: #0a0a0b;
64
64
  --color-success-text: #3bb358;
65
65
  --color-success-icon: #23a64a;
66
66
  --color-success-background: #14441f;
package/src/design_system/colors/generated/css_variables.light.ts CHANGED
@@ -3,42 +3,42 @@
3
3
  */
4
4
 
5
5
  export const tokens = `
6
- --color-neutral-text: #242836;
7
- --color-neutral-text-muted: #3f475d;
8
- --color-neutral-text-subtle: #6c7590;
9
- --color-neutral-text-disabled: #c0c6de;
6
+ --color-neutral-text: #1f2123;
7
+ --color-neutral-text-muted: #3d3f43;
8
+ --color-neutral-text-subtle: #6d7178;
9
+ --color-neutral-text-disabled: #c9cbcf;
10
10
  --color-neutral-text-on-primary: #ffffff;
11
11
  --color-neutral-icon-on-primary: #ffffff;
12
12
  --color-neutral-background: #ffffff;
13
- --color-neutral-background-muted: #f8f9fc;
14
- --color-neutral-background-subtle: #f3f4fa;
13
+ --color-neutral-background-muted: #f9f9fa;
14
+ --color-neutral-background-subtle: #f4f4f5;
15
15
  --color-neutral-background-white: #ffffff;
16
16
  --color-neutral-card-background: #ffffff;
17
17
  --color-neutral-card-background-hover: #ffffff;
18
- --color-neutral-border: #d0d5e9;
19
- --color-neutral-separator-subtle: #e0e3f2;
20
- --color-neutral-hover: #eef0f8;
21
- --color-neutral-disabled: #f3f4fa;
22
- --color-neutral-overflow: #e0e3f2;
23
- --color-neutral-icon: #555d76;
24
- --color-neutral-icon-subtle: #8a93ae;
25
- --color-neutral-icon-disabled: #b0b8d1;
26
- --color-neutral-field-border: #c0c6de;
27
- --color-neutral-action-secondary: #d0d5e9;
28
- --color-neutral-action-secondary-hover: #e0e3f2;
29
- --color-neutral-action-secondary-active: #d0d5e9;
30
- --color-neutral-chip-background: #e0e3f2;
31
- --color-neutral-chip-background-hover: #d0d5e9;
32
- --color-neutral-chip-background-active: #c0c6de;
33
- --color-neutral-chip-background-disabled: #d0d5e9;
18
+ --color-neutral-border: #d2d3d6;
19
+ --color-neutral-separator-subtle: #e4e5e6;
20
+ --color-neutral-hover: #edeeef;
21
+ --color-neutral-disabled: #f4f4f5;
22
+ --color-neutral-overflow: #e4e5e6;
23
+ --color-neutral-icon: #4f5257;
24
+ --color-neutral-icon-subtle: #9ea2a8;
25
+ --color-neutral-icon-disabled: #bfc1c5;
26
+ --color-neutral-field-border: #c9cbcf;
27
+ --color-neutral-action-secondary: #d2d3d6;
28
+ --color-neutral-action-secondary-hover: #e4e5e6;
29
+ --color-neutral-action-secondary-active: #d2d3d6;
30
+ --color-neutral-chip-background: #e4e5e6;
31
+ --color-neutral-chip-background-hover: #d2d3d6;
32
+ --color-neutral-chip-background-active: #c9cbcf;
33
+ --color-neutral-chip-background-disabled: #d2d3d6;
34
34
  --color-neutral-large-tooltip-background: #ffffff;
35
- --color-neutral-large-tooltip-border: #e0e3f2;
35
+ --color-neutral-large-tooltip-border: #e4e5e6;
36
36
  --color-neutral-small-tooltip-text: #ffffff;
37
- --color-neutral-small-tooltip-background: #191b22;
38
- --color-neutral-small-tooltip-border: #242836;
37
+ --color-neutral-small-tooltip-background: #161718;
38
+ --color-neutral-small-tooltip-border: #1f2123;
39
39
  --color-neutral-overlay: #191b22;
40
- --color-neutral-field-background: #f8f9fc;
41
- --color-neutral-text-placeholder: #969eb8;
40
+ --color-neutral-field-background: #f9f9fa;
41
+ --color-neutral-text-placeholder: #a9acb1;
42
42
  --color-primary-text: #1672eb;
43
43
  --color-primary-text-interactive: #1672eb;
44
44
  --color-primary-icon: #1672eb;
@@ -55,12 +55,12 @@ export const tokens = `
55
55
  --color-primary-chip-background-hover: #d8e2ff;
56
56
  --color-primary-chip-text: #1a57da;
57
57
  --color-primary-shadow-active: #b2c6ff;
58
- --color-primary-black-action: #272d3e;
59
- --color-primary-black-action-hover: #2b3143;
60
- --color-primary-black-action-active: #0a0b0f;
61
- --color-primary-black-background: #1d202a;
62
- --color-primary-black-background-hover: #3f475d;
63
- --color-primary-black-chip-text: #f8f9fc;
58
+ --color-primary-black-action: #242528;
59
+ --color-primary-black-action-hover: #292b2e;
60
+ --color-primary-black-action-active: #0a0a0b;
61
+ --color-primary-black-background: #1b1c1d;
62
+ --color-primary-black-background-hover: #3d3f43;
63
+ --color-primary-black-chip-text: #f9f9fa;
64
64
  --color-success-text: #008a27;
65
65
  --color-success-icon: #008a27;
66
66
  --color-success-background: #e4f5e5;
package/src/design_system/colors/generated/css_variables_palette.dark.ts CHANGED
@@ -4,29 +4,29 @@
4
4
 
5
5
  export const tokens = `
6
6
  --palette-neutral-0: #ffffff;
7
- --palette-neutral-25: #f8f9fc;
8
- --palette-neutral-50: #f3f4fa;
9
- --palette-neutral-75: #eef0f8;
10
- --palette-neutral-100: #e1e3ed;
11
- --palette-neutral-150: #d1d5e4;
12
- --palette-neutral-200: #c1c6d9;
13
- --palette-neutral-250: #b2b8cc;
14
- --palette-neutral-300: #a5abc0;
15
- --palette-neutral-350: #989eb3;
16
- --palette-neutral-400: #8c93a8;
17
- --palette-neutral-450: #7d8499;
18
- --palette-neutral-500: #6e758a;
19
- --palette-neutral-550: #646a7f;
20
- --palette-neutral-600: #575d71;
21
- --palette-neutral-650: #4d5265;
22
- --palette-neutral-700: #414758;
23
- --palette-neutral-750: #343847;
24
- --palette-neutral-775: #2d313e;
25
- --palette-neutral-800: #2a2d39;
26
- --palette-neutral-850: #252832;
27
- --palette-neutral-875: #1e2027;
28
- --palette-neutral-900: #1a1b21;
29
- --palette-neutral-950: #101114;
7
+ --palette-neutral-25: #f9f9fa;
8
+ --palette-neutral-50: #f4f4f5;
9
+ --palette-neutral-75: #edeeef;
10
+ --palette-neutral-100: #e4e5e6;
11
+ --palette-neutral-150: #d2d3d6;
12
+ --palette-neutral-200: #c9cbcf;
13
+ --palette-neutral-250: #bfc1c5;
14
+ --palette-neutral-300: #b4b6bb;
15
+ --palette-neutral-350: #a9acb1;
16
+ --palette-neutral-400: #9ea2a8;
17
+ --palette-neutral-450: #848890;
18
+ --palette-neutral-500: #6d7178;
19
+ --palette-neutral-550: #5c5f66;
20
+ --palette-neutral-600: #4f5257;
21
+ --palette-neutral-650: #44464b;
22
+ --palette-neutral-700: #3d3f43;
23
+ --palette-neutral-750: #333538;
24
+ --palette-neutral-775: #292b2e;
25
+ --palette-neutral-800: #242528;
26
+ --palette-neutral-850: #1f2123;
27
+ --palette-neutral-875: #1b1c1d;
28
+ --palette-neutral-900: #161718;
29
+ --palette-neutral-950: #0a0a0b;
30
30
  --palette-yellow-25: #fcdc73;
31
31
  --palette-yellow-50: #ffd761;
32
32
  --palette-yellow-75: #f9ce4b;
package/src/design_system/colors/generated/css_variables_palette.light.ts CHANGED
@@ -4,29 +4,29 @@
4
4
 
5
5
  export const tokens = `
6
6
  --palette-neutral-0: #ffffff;
7
- --palette-neutral-25: #f8f9fc;
8
- --palette-neutral-50: #f3f4fa;
9
- --palette-neutral-75: #eef0f8;
10
- --palette-neutral-100: #e0e3f2;
11
- --palette-neutral-150: #d0d5e9;
12
- --palette-neutral-200: #c0c6de;
13
- --palette-neutral-250: #b0b8d1;
14
- --palette-neutral-300: #a3abc5;
15
- --palette-neutral-350: #969eb8;
16
- --palette-neutral-400: #8a93ae;
17
- --palette-neutral-450: #7b84a0;
18
- --palette-neutral-500: #6c7590;
19
- --palette-neutral-550: #626a85;
20
- --palette-neutral-600: #555d76;
21
- --palette-neutral-650: #4b526b;
22
- --palette-neutral-700: #3f475d;
23
- --palette-neutral-750: #31384d;
24
- --palette-neutral-775: #2b3143;
25
- --palette-neutral-800: #272d3e;
26
- --palette-neutral-850: #242836;
27
- --palette-neutral-875: #1d202a;
28
- --palette-neutral-900: #191b22;
29
- --palette-neutral-950: #0a0b0f;
7
+ --palette-neutral-25: #f9f9fa;
8
+ --palette-neutral-50: #f4f4f5;
9
+ --palette-neutral-75: #edeeef;
10
+ --palette-neutral-100: #e4e5e6;
11
+ --palette-neutral-150: #d2d3d6;
12
+ --palette-neutral-200: #c9cbcf;
13
+ --palette-neutral-250: #bfc1c5;
14
+ --palette-neutral-300: #b4b6bb;
15
+ --palette-neutral-350: #a9acb1;
16
+ --palette-neutral-400: #9ea2a8;
17
+ --palette-neutral-450: #848890;
18
+ --palette-neutral-500: #6d7178;
19
+ --palette-neutral-550: #5c5f66;
20
+ --palette-neutral-600: #4f5257;
21
+ --palette-neutral-650: #44464b;
22
+ --palette-neutral-700: #3d3f43;
23
+ --palette-neutral-750: #333538;
24
+ --palette-neutral-775: #292b2e;
25
+ --palette-neutral-800: #242528;
26
+ --palette-neutral-850: #1f2123;
27
+ --palette-neutral-875: #1b1c1d;
28
+ --palette-neutral-900: #161718;
29
+ --palette-neutral-950: #0a0a0b;
30
30
  --palette-yellow-25: #f9f6ea;
31
31
  --palette-yellow-50: #f9f0db;
32
32
  --palette-yellow-75: #f7e8c4;
package/style/colors/dark.scss CHANGED
@@ -4,42 +4,42 @@
4
4
  */
5
5
 
6
6
  $tokens: (
7
- 'color-neutral-text': #f3f4fa,
8
- 'color-neutral-text-muted': #b2b8cc,
9
- 'color-neutral-text-subtle': #8c93a8,
10
- 'color-neutral-text-disabled': #575d71,
11
- 'color-neutral-text-on-primary': #1a1b21,
12
- 'color-neutral-icon-on-primary': #1a1b21,
13
- 'color-neutral-background': #1a1b21,
14
- 'color-neutral-background-muted': #252832,
15
- 'color-neutral-background-subtle': #2a2d39,
16
- 'color-neutral-background-white': #f3f4fa,
17
- 'color-neutral-card-background': #1e2027,
18
- 'color-neutral-card-background-hover': #252832,
19
- 'color-neutral-border': #414758,
20
- 'color-neutral-separator-subtle': #343847,
21
- 'color-neutral-hover': #2d313e,
22
- 'color-neutral-disabled': #343847,
23
- 'color-neutral-overflow': #2a2d39,
24
- 'color-neutral-icon': #b2b8cc,
25
- 'color-neutral-icon-subtle': #6e758a,
26
- 'color-neutral-icon-disabled': #575d71,
27
- 'color-neutral-field-border': #343847,
28
- 'color-neutral-action-secondary': #575d71,
29
- 'color-neutral-action-secondary-hover': #6e758a,
30
- 'color-neutral-action-secondary-active': #343847,
31
- 'color-neutral-chip-background': #575d71,
32
- 'color-neutral-chip-background-hover': #6e758a,
33
- 'color-neutral-chip-background-active': #8c93a8,
34
- 'color-neutral-chip-background-disabled': #8c93a8,
35
- 'color-neutral-large-tooltip-background': #2a2d39,
36
- 'color-neutral-large-tooltip-border': #343847,
7
+ 'color-neutral-text': #f4f4f5,
8
+ 'color-neutral-text-muted': #bfc1c5,
9
+ 'color-neutral-text-subtle': #9ea2a8,
10
+ 'color-neutral-text-disabled': #4f5257,
11
+ 'color-neutral-text-on-primary': #161718,
12
+ 'color-neutral-icon-on-primary': #161718,
13
+ 'color-neutral-background': #161718,
14
+ 'color-neutral-background-muted': #1f2123,
15
+ 'color-neutral-background-subtle': #242528,
16
+ 'color-neutral-background-white': #f4f4f5,
17
+ 'color-neutral-card-background': #1b1c1d,
18
+ 'color-neutral-card-background-hover': #1f2123,
19
+ 'color-neutral-border': #3d3f43,
20
+ 'color-neutral-separator-subtle': #333538,
21
+ 'color-neutral-hover': #292b2e,
22
+ 'color-neutral-disabled': #333538,
23
+ 'color-neutral-overflow': #242528,
24
+ 'color-neutral-icon': #bfc1c5,
25
+ 'color-neutral-icon-subtle': #6d7178,
26
+ 'color-neutral-icon-disabled': #4f5257,
27
+ 'color-neutral-field-border': #333538,
28
+ 'color-neutral-action-secondary': #4f5257,
29
+ 'color-neutral-action-secondary-hover': #6d7178,
30
+ 'color-neutral-action-secondary-active': #333538,
31
+ 'color-neutral-chip-background': #4f5257,
32
+ 'color-neutral-chip-background-hover': #6d7178,
33
+ 'color-neutral-chip-background-active': #9ea2a8,
34
+ 'color-neutral-chip-background-disabled': #9ea2a8,
35
+ 'color-neutral-large-tooltip-background': #242528,
36
+ 'color-neutral-large-tooltip-border': #333538,
37
37
  'color-neutral-small-tooltip-text': #ffffff,
38
- 'color-neutral-small-tooltip-background': #2a2d39,
39
- 'color-neutral-small-tooltip-border': #343847,
38
+ 'color-neutral-small-tooltip-background': #242528,
39
+ 'color-neutral-small-tooltip-border': #333538,
40
40
  'color-neutral-overlay': #101114,
41
- 'color-neutral-field-background': #101114,
42
- 'color-neutral-text-placeholder': #6e758a,
41
+ 'color-neutral-field-background': #0a0a0b,
42
+ 'color-neutral-text-placeholder': #6d7178,
43
43
  'color-primary-text': #6f9dff,
44
44
  'color-primary-text-interactive': #6f9dff,
45
45
  'color-primary-icon': #3970d7,
@@ -57,11 +57,11 @@ $tokens: (
57
57
  'color-primary-chip-text': #8ebcff,
58
58
  'color-primary-shadow-active': #295cbb,
59
59
  'color-primary-black-action': #ffffff,
60
- 'color-primary-black-action-hover': #d1d5e4,
61
- 'color-primary-black-action-active': #f3f4fa,
62
- 'color-primary-black-background': #f3f4fa,
63
- 'color-primary-black-background-hover': #eef0f8,
64
- 'color-primary-black-chip-text': #101114,
60
+ 'color-primary-black-action-hover': #d2d3d6,
61
+ 'color-primary-black-action-active': #f4f4f5,
62
+ 'color-primary-black-background': #f4f4f5,
63
+ 'color-primary-black-background-hover': #edeeef,
64
+ 'color-primary-black-chip-text': #0a0a0b,
65
65
  'color-success-text': #3bb358,
66
66
  'color-success-icon': #23a64a,
67
67
  'color-success-background': #14441f,
package/style/colors/light.scss CHANGED
@@ -4,42 +4,42 @@
4
4
  */
5
5
 
6
6
  $tokens: (
7
- 'color-neutral-text': #242836,
8
- 'color-neutral-text-muted': #3f475d,
9
- 'color-neutral-text-subtle': #6c7590,
10
- 'color-neutral-text-disabled': #c0c6de,
7
+ 'color-neutral-text': #1f2123,
8
+ 'color-neutral-text-muted': #3d3f43,
9
+ 'color-neutral-text-subtle': #6d7178,
10
+ 'color-neutral-text-disabled': #c9cbcf,
11
11
  'color-neutral-text-on-primary': #ffffff,
12
12
  'color-neutral-icon-on-primary': #ffffff,
13
13
  'color-neutral-background': #ffffff,
14
- 'color-neutral-background-muted': #f8f9fc,
15
- 'color-neutral-background-subtle': #f3f4fa,
14
+ 'color-neutral-background-muted': #f9f9fa,
15
+ 'color-neutral-background-subtle': #f4f4f5,
16
16
  'color-neutral-background-white': #ffffff,
17
17
  'color-neutral-card-background': #ffffff,
18
18
  'color-neutral-card-background-hover': #ffffff,
19
- 'color-neutral-border': #d0d5e9,
20
- 'color-neutral-separator-subtle': #e0e3f2,
21
- 'color-neutral-hover': #eef0f8,
22
- 'color-neutral-disabled': #f3f4fa,
23
- 'color-neutral-overflow': #e0e3f2,
24
- 'color-neutral-icon': #555d76,
25
- 'color-neutral-icon-subtle': #8a93ae,
26
- 'color-neutral-icon-disabled': #b0b8d1,
27
- 'color-neutral-field-border': #c0c6de,
28
- 'color-neutral-action-secondary': #d0d5e9,
29
- 'color-neutral-action-secondary-hover': #e0e3f2,
30
- 'color-neutral-action-secondary-active': #d0d5e9,
31
- 'color-neutral-chip-background': #e0e3f2,
32
- 'color-neutral-chip-background-hover': #d0d5e9,
33
- 'color-neutral-chip-background-active': #c0c6de,
34
- 'color-neutral-chip-background-disabled': #d0d5e9,
19
+ 'color-neutral-border': #d2d3d6,
20
+ 'color-neutral-separator-subtle': #e4e5e6,
21
+ 'color-neutral-hover': #edeeef,
22
+ 'color-neutral-disabled': #f4f4f5,
23
+ 'color-neutral-overflow': #e4e5e6,
24
+ 'color-neutral-icon': #4f5257,
25
+ 'color-neutral-icon-subtle': #9ea2a8,
26
+ 'color-neutral-icon-disabled': #bfc1c5,
27
+ 'color-neutral-field-border': #c9cbcf,
28
+ 'color-neutral-action-secondary': #d2d3d6,
29
+ 'color-neutral-action-secondary-hover': #e4e5e6,
30
+ 'color-neutral-action-secondary-active': #d2d3d6,
31
+ 'color-neutral-chip-background': #e4e5e6,
32
+ 'color-neutral-chip-background-hover': #d2d3d6,
33
+ 'color-neutral-chip-background-active': #c9cbcf,
34
+ 'color-neutral-chip-background-disabled': #d2d3d6,
35
35
  'color-neutral-large-tooltip-background': #ffffff,
36
- 'color-neutral-large-tooltip-border': #e0e3f2,
36
+ 'color-neutral-large-tooltip-border': #e4e5e6,
37
37
  'color-neutral-small-tooltip-text': #ffffff,
38
- 'color-neutral-small-tooltip-background': #191b22,
39
- 'color-neutral-small-tooltip-border': #242836,
38
+ 'color-neutral-small-tooltip-background': #161718,
39
+ 'color-neutral-small-tooltip-border': #1f2123,
40
40
  'color-neutral-overlay': #191b22,
41
- 'color-neutral-field-background': #f8f9fc,
42
- 'color-neutral-text-placeholder': #969eb8,
41
+ 'color-neutral-field-background': #f9f9fa,
42
+ 'color-neutral-text-placeholder': #a9acb1,
43
43
  'color-primary-text': #1672eb,
44
44
  'color-primary-text-interactive': #1672eb,
45
45
  'color-primary-icon': #1672eb,
@@ -56,12 +56,12 @@ $tokens: (
56
56
  'color-primary-chip-background-hover': #d8e2ff,
57
57
  'color-primary-chip-text': #1a57da,
58
58
  'color-primary-shadow-active': #b2c6ff,
59
- 'color-primary-black-action': #272d3e,
60
- 'color-primary-black-action-hover': #2b3143,
61
- 'color-primary-black-action-active': #0a0b0f,
62
- 'color-primary-black-background': #1d202a,
63
- 'color-primary-black-background-hover': #3f475d,
64
- 'color-primary-black-chip-text': #f8f9fc,
59
+ 'color-primary-black-action': #242528,
60
+ 'color-primary-black-action-hover': #292b2e,
61
+ 'color-primary-black-action-active': #0a0a0b,
62
+ 'color-primary-black-background': #1b1c1d,
63
+ 'color-primary-black-background-hover': #3d3f43,
64
+ 'color-primary-black-chip-text': #f9f9fa,
65
65
  'color-success-text': #008a27,
66
66
  'color-success-icon': #008a27,
67
67
  'color-success-background': #e4f5e5,