@knapsack/sandbox-tokens 4.54.6--canary.4077.4d2b71a.0 → 4.54.6--canary.4093.b8af7d7.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (17) hide show
  1. package/dist/design-tokens.cjs +83 -51
  2. package/dist/design-tokens.collections.css +153 -90
  3. package/dist/design-tokens.css +74 -42
  4. package/dist/design-tokens.css.scss +74 -42
  5. package/dist/design-tokens.d.cts +83 -51
  6. package/dist/design-tokens.d.mts +83 -51
  7. package/dist/design-tokens.d.ts +83 -51
  8. package/dist/design-tokens.js +83 -51
  9. package/dist/design-tokens.json +73 -41
  10. package/dist/design-tokens.less +83 -51
  11. package/dist/design-tokens.mjs +83 -51
  12. package/dist/design-tokens.nested.json +80 -12
  13. package/dist/design-tokens.scss +199 -99
  14. package/dist/design-tokens.style-dictionary.json +395 -132
  15. package/dist/design-tokens.w3c-spec.json +395 -132
  16. package/package.json +4 -4
  17. package/src/knapsack.design-tokens.json +395 -132
package/dist/design-tokens.css.scss CHANGED
@@ -7,54 +7,74 @@
7
7
  --breakpoint-xlarge: 992px;
8
8
  --breakpoint-xxlarge: 1240px;
9
9
  --breakpoint-xxxlarge: 1440px;
10
- --collections-brands-color-color-brand-a-dark: #000000;
11
- --collections-brands-color-color-brand-a-light: #000000;
12
- --collections-brands-color-color-brand-b-dark: #000000;
13
- --collections-brands-color-color-brand-b-light: #000000;
14
- --collections-brands-color-color-1-brand-a-dark: #000000;
15
- --collections-brands-color-color-1-brand-a-light: #000000;
16
- --collections-brands-color-color-1-brand-b-dark: #000000;
17
- --collections-brands-color-color-1-brand-b-light: #000000;
18
- --collections-brands-color-font-weight-brand-a-dark: 400;
19
- --collections-brands-color-font-weight-brand-a-light: 400;
20
- --collections-brands-color-font-weight-brand-b-dark: 400;
21
- --collections-brands-color-font-weight-brand-b-light: 400;
22
- --collections-brands-color-primary-brand-a-dark: #0a13f7;
23
- --collections-brands-color-primary-brand-a-light: #3ed93f;
24
- --collections-brands-color-primary-brand-b-dark: var(--color-pink-800);
25
- --collections-brands-color-primary-brand-b-light: var(--color-pink-400);
26
- --collections-brands-color-secondary-brand-a-dark: var(--color-pink-500);
27
- --collections-brands-color-secondary-brand-a-light: var(--color-pink-500);
28
- --collections-brands-color-secondary-brand-b-dark: var(--color-purple-500);
29
- --collections-brands-color-secondary-brand-b-light: var(--color-purple-500);
30
- --collections-brands-foo-bar-brand-a-dark: 1px;
31
- --collections-brands-foo-bar-brand-a-light: 1px;
32
- --collections-brands-foo-bar-brand-b-dark: 1px;
33
- --collections-brands-foo-bar-brand-b-light: 1px;
34
- --collections-brands-test-dimension-brand-a-dark: 2px;
35
- --collections-brands-test-dimension-brand-a-light: 2px;
36
- --collections-brands-test-dimension-brand-b-dark: 2px;
37
- --collections-brands-test-dimension-brand-b-light: 2px;
38
- --collections-brands-test-primary-brand-a-dark: var(
10
+ --collections-density-spacing-large-compact: var(--spacing-scale-4);
11
+ --collections-density-spacing-large-cozy: var(--spacing-scale-5);
12
+ --collections-density-spacing-medium-compact: var(--spacing-scale-3);
13
+ --collections-density-spacing-medium-cozy: var(--spacing-scale-4);
14
+ --collections-density-spacing-small-compact: var(--spacing-scale-2);
15
+ --collections-density-spacing-small-cozy: var(--spacing-scale-3);
16
+ --collections-density-spacing-xlarge-compact: var(--spacing-scale-5);
17
+ --collections-density-spacing-xlarge-cozy: var(--spacing-scale-6);
18
+ --collections-density-spacing-xsmall-compact: var(--spacing-scale-1);
19
+ --collections-density-spacing-xsmall-cozy: var(--spacing-scale-2);
20
+ --collections-density-spacing-xxlarge-compact: var(--spacing-scale-7);
21
+ --collections-density-spacing-xxlarge-cozy: var(--spacing-scale-8);
22
+ --collections-density-spacing-xxxlarge-compact: var(--spacing-scale-8);
23
+ --collections-density-spacing-xxxlarge-cozy: var(--spacing-scale-10);
24
+ --collections-testing-color-color-brand-a-dark: #000000;
25
+ --collections-testing-color-color-brand-a-light: #000000;
26
+ --collections-testing-color-color-brand-b-dark: #000000;
27
+ --collections-testing-color-color-brand-b-light: #000000;
28
+ --collections-testing-color-color-1-brand-a-dark: #000000;
29
+ --collections-testing-color-color-1-brand-a-light: #000000;
30
+ --collections-testing-color-color-1-brand-b-dark: #000000;
31
+ --collections-testing-color-color-1-brand-b-light: #000000;
32
+ --collections-testing-color-font-weight-brand-a-dark: 400;
33
+ --collections-testing-color-font-weight-brand-a-light: 400;
34
+ --collections-testing-color-font-weight-brand-b-dark: 400;
35
+ --collections-testing-color-font-weight-brand-b-light: 400;
36
+ --collections-testing-color-primary-brand-a-dark: #0a13f7;
37
+ --collections-testing-color-primary-brand-a-light: #3ed93f;
38
+ --collections-testing-color-primary-brand-b-dark: var(--color-pink-800);
39
+ --collections-testing-color-primary-brand-b-light: var(--color-pink-400);
40
+ --collections-testing-color-secondary-brand-a-dark: var(--color-pink-500);
41
+ --collections-testing-color-secondary-brand-a-light: var(--color-pink-500);
42
+ --collections-testing-color-secondary-brand-b-dark: var(--color-purple-500);
43
+ --collections-testing-color-secondary-brand-b-light: var(--color-purple-500);
44
+ --collections-testing-foo-bar-brand-a-dark: 1px;
45
+ --collections-testing-foo-bar-brand-a-light: 1px;
46
+ --collections-testing-foo-bar-brand-b-dark: 1px;
47
+ --collections-testing-foo-bar-brand-b-light: 1px;
48
+ --collections-testing-test-dimension-brand-a-dark: 2px;
49
+ --collections-testing-test-dimension-brand-a-light: 2px;
50
+ --collections-testing-test-dimension-brand-b-dark: 2px;
51
+ --collections-testing-test-dimension-brand-b-light: 2px;
52
+ --collections-testing-test-primary-brand-a-dark: var(
39
53
  --collections-density-spacing-small-compact
40
54
  );
41
- --collections-brands-test-primary-brand-a-light: var(--spacing-scale-8);
42
- --collections-brands-test-primary-brand-b-dark: var(
55
+ --collections-testing-test-primary-brand-a-light: var(--spacing-scale-8);
56
+ --collections-testing-test-primary-brand-b-dark: var(
43
57
  --collections-density-spacing-small-compact
44
58
  );
45
- --collections-brands-test-primary-brand-b-light: var(
59
+ --collections-testing-test-primary-brand-b-light: var(
46
60
  --collections-density-spacing-small-compact
47
61
  );
48
- --collections-brands-test-secondary-brand-a-dark: #cc2020;
49
- --collections-brands-test-secondary-brand-a-light: #cc2020;
50
- --collections-brands-test-secondary-brand-b-dark: var(--color-neutral-600);
51
- --collections-brands-test-secondary-brand-b-light: var(--color-neutral-300);
52
- --collections-density-spacing-large-comfortable: var(--spacing-scale-8);
53
- --collections-density-spacing-large-compact: var(--spacing-scale-5);
54
- --collections-density-spacing-medium-comfortable: var(--spacing-scale-6);
55
- --collections-density-spacing-medium-compact: var(--spacing-scale-5);
56
- --collections-density-spacing-small-comfortable: var(--spacing-scale-3);
57
- --collections-density-spacing-small-compact: var(--spacing-scale-2);
62
+ --collections-testing-test-secondary-brand-a-dark: #cc2020;
63
+ --collections-testing-test-secondary-brand-a-light: #cc2020;
64
+ --collections-testing-test-secondary-brand-b-dark: var(--color-neutral-600);
65
+ --collections-testing-test-secondary-brand-b-light: var(--color-neutral-300);
66
+ --collections-theme-action-base-dark: var(--sandbox-color-brand);
67
+ --collections-theme-action-base-light: var(--sandbox-color-brand);
68
+ --collections-theme-action-text-dark: var(--sandbox-color-white);
69
+ --collections-theme-action-text-light: var(--sandbox-color-white);
70
+ --collections-theme-background-content-dark: #3b3644;
71
+ --collections-theme-background-content-light: #ffffff;
72
+ --collections-theme-background-page-dark: #1f1c25;
73
+ --collections-theme-background-page-light: #fdfcfe;
74
+ --collections-theme-text-base-dark: #f6f8ff;
75
+ --collections-theme-text-base-light: #191f2c;
76
+ --collections-theme-text-subtle-dark: #bec3d3;
77
+ --collections-theme-text-subtle-light: #6e7a82;
58
78
  --color-black: var(--color-neutral-800);
59
79
  --color-white: #ffffff;
60
80
  --color-neutral-100: #fafafb;
@@ -102,6 +122,18 @@
102
122
  --radius-medium: 8px;
103
123
  --radius-round: 160px;
104
124
  --radius-small: 4px;
125
+ --sandbox-color-brand: #7a34ed;
126
+ --sandbox-color-error: #ff5c46;
127
+ --sandbox-color-success: #6bc313;
128
+ --sandbox-color-warning: #fab120;
129
+ --sandbox-color-white: #ffffff;
130
+ --sandbox-radius-large: 16px;
131
+ --sandbox-radius-medium: 8px;
132
+ --sandbox-radius-small: 4px;
133
+ --sandbox-radius-xlarge: 32px;
134
+ --sandbox-radius-xsmall: 2px;
135
+ --sandbox-width-narrow: 640px;
136
+ --sandbox-width-wide: 1080px;
105
137
  --shadow-1: 0px 5px 10px 0px #000000;
106
138
  --shadow-2: 0px 10px 20px 0px #000000;
107
139
  --shadow-3: 0px 15px 25px 0px #000000;
package/dist/design-tokens.d.cts CHANGED
@@ -8,59 +8,85 @@ export declare const breakpointSmall = '330px';
8
8
  export declare const breakpointXlarge = '992px';
9
9
  export declare const breakpointXxlarge = '1240px';
10
10
  export declare const breakpointXxxlarge = '1440px';
11
- export declare const collectionsBrandsColorColorBrandADark = '#000000';
12
- export declare const collectionsBrandsColorColorBrandALight = '#000000';
13
- export declare const collectionsBrandsColorColorBrandBDark = '#000000';
14
- export declare const collectionsBrandsColorColorBrandBLight = '#000000';
15
- export declare const collectionsBrandsColorColor1BrandADark = '#000000';
16
- export declare const collectionsBrandsColorColor1BrandALight = '#000000';
17
- export declare const collectionsBrandsColorColor1BrandBDark = '#000000';
18
- export declare const collectionsBrandsColorColor1BrandBLight = '#000000';
19
- export declare const collectionsBrandsColorFontWeightBrandADark = 400;
20
- export declare const collectionsBrandsColorFontWeightBrandALight = 400;
21
- export declare const collectionsBrandsColorFontWeightBrandBDark = 400;
22
- export declare const collectionsBrandsColorFontWeightBrandBLight = 400;
23
- export declare const collectionsBrandsColorPrimaryBrandADark = '#0a13f7';
24
- export declare const collectionsBrandsColorPrimaryBrandALight = '#3ed93f';
11
+ export declare const spacingScale4 = '12px';
12
+ export declare const collectionsDensitySpacingLargeCompact = '12px';
13
+ export declare const spacingScale5 = '16px';
14
+ export declare const collectionsDensitySpacingLargeCozy = '16px';
15
+ export declare const spacingScale3 = '8px';
16
+ export declare const collectionsDensitySpacingMediumCompact = '8px';
17
+ export declare const collectionsDensitySpacingMediumCozy = '12px';
18
+ export declare const spacingScale2 = '4px';
19
+ export declare const collectionsDensitySpacingSmallCompact = '4px';
20
+ export declare const collectionsDensitySpacingSmallCozy = '8px';
21
+ export declare const collectionsDensitySpacingXlargeCompact = '16px';
22
+ export declare const spacingScale6 = '24px';
23
+ export declare const collectionsDensitySpacingXlargeCozy = '24px';
24
+ export declare const spacingScale1 = '2px';
25
+ export declare const collectionsDensitySpacingXsmallCompact = '2px';
26
+ export declare const collectionsDensitySpacingXsmallCozy = '4px';
27
+ export declare const spacingScale7 = '32px';
28
+ export declare const collectionsDensitySpacingXxlargeCompact = '32px';
29
+ export declare const spacingScale8 = '40px';
30
+ export declare const collectionsDensitySpacingXxlargeCozy = '40px';
31
+ export declare const collectionsDensitySpacingXxxlargeCompact = '40px';
32
+ export declare const spacingScale10 = '64px';
33
+ export declare const collectionsDensitySpacingXxxlargeCozy = '64px';
34
+ export declare const collectionsTestingColorColorBrandADark = '#000000';
35
+ export declare const collectionsTestingColorColorBrandALight = '#000000';
36
+ export declare const collectionsTestingColorColorBrandBDark = '#000000';
37
+ export declare const collectionsTestingColorColorBrandBLight = '#000000';
38
+ export declare const collectionsTestingColorColor1BrandADark = '#000000';
39
+ export declare const collectionsTestingColorColor1BrandALight = '#000000';
40
+ export declare const collectionsTestingColorColor1BrandBDark = '#000000';
41
+ export declare const collectionsTestingColorColor1BrandBLight = '#000000';
42
+ export declare const collectionsTestingColorFontWeightBrandADark = 400;
43
+ export declare const collectionsTestingColorFontWeightBrandALight = 400;
44
+ export declare const collectionsTestingColorFontWeightBrandBDark = 400;
45
+ export declare const collectionsTestingColorFontWeightBrandBLight = 400;
46
+ export declare const collectionsTestingColorPrimaryBrandADark = '#0a13f7';
47
+ export declare const collectionsTestingColorPrimaryBrandALight = '#3ed93f';
25
48
  export declare const colorPink800 = '#710D55';
26
- export declare const collectionsBrandsColorPrimaryBrandBDark = '#710D55';
49
+ export declare const collectionsTestingColorPrimaryBrandBDark = '#710D55';
27
50
  export declare const colorPink400 = '#F37491';
28
- export declare const collectionsBrandsColorPrimaryBrandBLight = '#F37491';
51
+ export declare const collectionsTestingColorPrimaryBrandBLight = '#F37491';
29
52
  export declare const colorPink500 = '#EC487D';
30
- export declare const collectionsBrandsColorSecondaryBrandADark = '#EC487D';
31
- export declare const collectionsBrandsColorSecondaryBrandALight = '#EC487D';
53
+ export declare const collectionsTestingColorSecondaryBrandADark = '#EC487D';
54
+ export declare const collectionsTestingColorSecondaryBrandALight = '#EC487D';
32
55
  export declare const colorPurple500 = '#6A4CEC';
33
- export declare const collectionsBrandsColorSecondaryBrandBDark = '#6A4CEC';
34
- export declare const collectionsBrandsColorSecondaryBrandBLight = '#6A4CEC';
35
- export declare const collectionsBrandsFooBarBrandADark = '1px';
36
- export declare const collectionsBrandsFooBarBrandALight = '1px';
37
- export declare const collectionsBrandsFooBarBrandBDark = '1px';
38
- export declare const collectionsBrandsFooBarBrandBLight = '1px';
39
- export declare const collectionsBrandsTestDimensionBrandADark = '2px';
40
- export declare const collectionsBrandsTestDimensionBrandALight = '2px';
41
- export declare const collectionsBrandsTestDimensionBrandBDark = '2px';
42
- export declare const collectionsBrandsTestDimensionBrandBLight = '2px';
43
- export declare const spacingScale2 = '4px';
44
- export declare const collectionsDensitySpacingSmallCompact = '4px';
45
- export declare const collectionsBrandsTestPrimaryBrandADark = '4px';
46
- export declare const spacingScale8 = '40px';
47
- export declare const collectionsBrandsTestPrimaryBrandALight = '40px';
48
- export declare const collectionsBrandsTestPrimaryBrandBDark = '4px';
49
- export declare const collectionsBrandsTestPrimaryBrandBLight = '4px';
50
- export declare const collectionsBrandsTestSecondaryBrandADark = '#cc2020';
51
- export declare const collectionsBrandsTestSecondaryBrandALight = '#cc2020';
56
+ export declare const collectionsTestingColorSecondaryBrandBDark = '#6A4CEC';
57
+ export declare const collectionsTestingColorSecondaryBrandBLight = '#6A4CEC';
58
+ export declare const collectionsTestingFooBarBrandADark = '1px';
59
+ export declare const collectionsTestingFooBarBrandALight = '1px';
60
+ export declare const collectionsTestingFooBarBrandBDark = '1px';
61
+ export declare const collectionsTestingFooBarBrandBLight = '1px';
62
+ export declare const collectionsTestingTestDimensionBrandADark = '2px';
63
+ export declare const collectionsTestingTestDimensionBrandALight = '2px';
64
+ export declare const collectionsTestingTestDimensionBrandBDark = '2px';
65
+ export declare const collectionsTestingTestDimensionBrandBLight = '2px';
66
+ export declare const collectionsTestingTestPrimaryBrandADark = '4px';
67
+ export declare const collectionsTestingTestPrimaryBrandALight = '40px';
68
+ export declare const collectionsTestingTestPrimaryBrandBDark = '4px';
69
+ export declare const collectionsTestingTestPrimaryBrandBLight = '4px';
70
+ export declare const collectionsTestingTestSecondaryBrandADark = '#cc2020';
71
+ export declare const collectionsTestingTestSecondaryBrandALight = '#cc2020';
52
72
  export declare const colorNeutral600 = '#ACAAB6';
53
- export declare const collectionsBrandsTestSecondaryBrandBDark = '#ACAAB6';
73
+ export declare const collectionsTestingTestSecondaryBrandBDark = '#ACAAB6';
54
74
  export declare const colorNeutral300 = '#EDECEF';
55
- export declare const collectionsBrandsTestSecondaryBrandBLight = '#EDECEF';
56
- export declare const collectionsDensitySpacingLargeComfortable = '40px';
57
- export declare const spacingScale5 = '16px';
58
- export declare const collectionsDensitySpacingLargeCompact = '16px';
59
- export declare const spacingScale6 = '24px';
60
- export declare const collectionsDensitySpacingMediumComfortable = '24px';
61
- export declare const collectionsDensitySpacingMediumCompact = '16px';
62
- export declare const spacingScale3 = '8px';
63
- export declare const collectionsDensitySpacingSmallComfortable = '8px';
75
+ export declare const collectionsTestingTestSecondaryBrandBLight = '#EDECEF';
76
+ export declare const sandboxColorBrand = '#7A34ED';
77
+ export declare const collectionsThemeActionBaseDark = '#7A34ED';
78
+ export declare const collectionsThemeActionBaseLight = '#7A34ED';
79
+ export declare const sandboxColorWhite = '#ffffff';
80
+ export declare const collectionsThemeActionTextDark = '#ffffff';
81
+ export declare const collectionsThemeActionTextLight = '#ffffff';
82
+ export declare const collectionsThemeBackgroundContentDark = '#3B3644';
83
+ export declare const collectionsThemeBackgroundContentLight = '#FFFFFF';
84
+ export declare const collectionsThemeBackgroundPageDark = '#1F1C25';
85
+ export declare const collectionsThemeBackgroundPageLight = '#FDFCFE';
86
+ export declare const collectionsThemeTextBaseDark = '#F6F8FF';
87
+ export declare const collectionsThemeTextBaseLight = '#191F2C';
88
+ export declare const collectionsThemeTextSubtleDark = '#BEC3D3';
89
+ export declare const collectionsThemeTextSubtleLight = '#6E7A82';
64
90
  export declare const colorNeutral800 = '#191335';
65
91
  export declare const colorBlack = '#191335';
66
92
  export declare const colorWhite = '#ffffff';
@@ -100,16 +126,22 @@ export declare const miscSomeText = 'Hello world';
100
126
  export declare const radiusMedium = '8px';
101
127
  export declare const radiusRound = '160px';
102
128
  export declare const radiusSmall = '4px';
129
+ export declare const sandboxColorError = '#FF5C46';
130
+ export declare const sandboxColorSuccess = '#6BC313';
131
+ export declare const sandboxColorWarning = '#FAB120';
132
+ export declare const sandboxRadiusLarge = '16px';
133
+ export declare const sandboxRadiusMedium = '8px';
134
+ export declare const sandboxRadiusSmall = '4px';
135
+ export declare const sandboxRadiusXlarge = '32px';
136
+ export declare const sandboxRadiusXsmall = '2px';
137
+ export declare const sandboxWidthNarrow = '640px';
138
+ export declare const sandboxWidthWide = '1080px';
103
139
  export declare const shadow1 = '0px 5px 10px 0px #000000';
104
140
  export declare const shadow2 = '0px 10px 20px 0px #000000';
105
141
  export declare const shadow3 = '0px 15px 25px 0px #000000';
106
142
  export declare const shadow4 = '0px 20px 40px 0px #000000';
107
143
  export declare const shadowColor = '#000000';
108
- export declare const spacingScale1 = '2px';
109
- export declare const spacingScale4 = '12px';
110
- export declare const spacingScale7 = '32px';
111
144
  export declare const spacingScale9 = '48px';
112
- export declare const spacingScale10 = '64px';
113
145
  export declare const spacingScale11 = '80px';
114
146
  export declare const spacingScale12 = '96px';
115
147
  export declare const spacingScale13 = '160px';
package/dist/design-tokens.d.mts CHANGED
@@ -8,59 +8,85 @@ export declare const breakpointSmall = '330px';
8
8
  export declare const breakpointXlarge = '992px';
9
9
  export declare const breakpointXxlarge = '1240px';
10
10
  export declare const breakpointXxxlarge = '1440px';
11
- export declare const collectionsBrandsColorColorBrandADark = '#000000';
12
- export declare const collectionsBrandsColorColorBrandALight = '#000000';
13
- export declare const collectionsBrandsColorColorBrandBDark = '#000000';
14
- export declare const collectionsBrandsColorColorBrandBLight = '#000000';
15
- export declare const collectionsBrandsColorColor1BrandADark = '#000000';
16
- export declare const collectionsBrandsColorColor1BrandALight = '#000000';
17
- export declare const collectionsBrandsColorColor1BrandBDark = '#000000';
18
- export declare const collectionsBrandsColorColor1BrandBLight = '#000000';
19
- export declare const collectionsBrandsColorFontWeightBrandADark = 400;
20
- export declare const collectionsBrandsColorFontWeightBrandALight = 400;
21
- export declare const collectionsBrandsColorFontWeightBrandBDark = 400;
22
- export declare const collectionsBrandsColorFontWeightBrandBLight = 400;
23
- export declare const collectionsBrandsColorPrimaryBrandADark = '#0a13f7';
24
- export declare const collectionsBrandsColorPrimaryBrandALight = '#3ed93f';
11
+ export declare const spacingScale4 = '12px';
12
+ export declare const collectionsDensitySpacingLargeCompact = '12px';
13
+ export declare const spacingScale5 = '16px';
14
+ export declare const collectionsDensitySpacingLargeCozy = '16px';
15
+ export declare const spacingScale3 = '8px';
16
+ export declare const collectionsDensitySpacingMediumCompact = '8px';
17
+ export declare const collectionsDensitySpacingMediumCozy = '12px';
18
+ export declare const spacingScale2 = '4px';
19
+ export declare const collectionsDensitySpacingSmallCompact = '4px';
20
+ export declare const collectionsDensitySpacingSmallCozy = '8px';
21
+ export declare const collectionsDensitySpacingXlargeCompact = '16px';
22
+ export declare const spacingScale6 = '24px';
23
+ export declare const collectionsDensitySpacingXlargeCozy = '24px';
24
+ export declare const spacingScale1 = '2px';
25
+ export declare const collectionsDensitySpacingXsmallCompact = '2px';
26
+ export declare const collectionsDensitySpacingXsmallCozy = '4px';
27
+ export declare const spacingScale7 = '32px';
28
+ export declare const collectionsDensitySpacingXxlargeCompact = '32px';
29
+ export declare const spacingScale8 = '40px';
30
+ export declare const collectionsDensitySpacingXxlargeCozy = '40px';
31
+ export declare const collectionsDensitySpacingXxxlargeCompact = '40px';
32
+ export declare const spacingScale10 = '64px';
33
+ export declare const collectionsDensitySpacingXxxlargeCozy = '64px';
34
+ export declare const collectionsTestingColorColorBrandADark = '#000000';
35
+ export declare const collectionsTestingColorColorBrandALight = '#000000';
36
+ export declare const collectionsTestingColorColorBrandBDark = '#000000';
37
+ export declare const collectionsTestingColorColorBrandBLight = '#000000';
38
+ export declare const collectionsTestingColorColor1BrandADark = '#000000';
39
+ export declare const collectionsTestingColorColor1BrandALight = '#000000';
40
+ export declare const collectionsTestingColorColor1BrandBDark = '#000000';
41
+ export declare const collectionsTestingColorColor1BrandBLight = '#000000';
42
+ export declare const collectionsTestingColorFontWeightBrandADark = 400;
43
+ export declare const collectionsTestingColorFontWeightBrandALight = 400;
44
+ export declare const collectionsTestingColorFontWeightBrandBDark = 400;
45
+ export declare const collectionsTestingColorFontWeightBrandBLight = 400;
46
+ export declare const collectionsTestingColorPrimaryBrandADark = '#0a13f7';
47
+ export declare const collectionsTestingColorPrimaryBrandALight = '#3ed93f';
25
48
  export declare const colorPink800 = '#710D55';
26
- export declare const collectionsBrandsColorPrimaryBrandBDark = '#710D55';
49
+ export declare const collectionsTestingColorPrimaryBrandBDark = '#710D55';
27
50
  export declare const colorPink400 = '#F37491';
28
- export declare const collectionsBrandsColorPrimaryBrandBLight = '#F37491';
51
+ export declare const collectionsTestingColorPrimaryBrandBLight = '#F37491';
29
52
  export declare const colorPink500 = '#EC487D';
30
- export declare const collectionsBrandsColorSecondaryBrandADark = '#EC487D';
31
- export declare const collectionsBrandsColorSecondaryBrandALight = '#EC487D';
53
+ export declare const collectionsTestingColorSecondaryBrandADark = '#EC487D';
54
+ export declare const collectionsTestingColorSecondaryBrandALight = '#EC487D';
32
55
  export declare const colorPurple500 = '#6A4CEC';
33
- export declare const collectionsBrandsColorSecondaryBrandBDark = '#6A4CEC';
34
- export declare const collectionsBrandsColorSecondaryBrandBLight = '#6A4CEC';
35
- export declare const collectionsBrandsFooBarBrandADark = '1px';
36
- export declare const collectionsBrandsFooBarBrandALight = '1px';
37
- export declare const collectionsBrandsFooBarBrandBDark = '1px';
38
- export declare const collectionsBrandsFooBarBrandBLight = '1px';
39
- export declare const collectionsBrandsTestDimensionBrandADark = '2px';
40
- export declare const collectionsBrandsTestDimensionBrandALight = '2px';
41
- export declare const collectionsBrandsTestDimensionBrandBDark = '2px';
42
- export declare const collectionsBrandsTestDimensionBrandBLight = '2px';
43
- export declare const spacingScale2 = '4px';
44
- export declare const collectionsDensitySpacingSmallCompact = '4px';
45
- export declare const collectionsBrandsTestPrimaryBrandADark = '4px';
46
- export declare const spacingScale8 = '40px';
47
- export declare const collectionsBrandsTestPrimaryBrandALight = '40px';
48
- export declare const collectionsBrandsTestPrimaryBrandBDark = '4px';
49
- export declare const collectionsBrandsTestPrimaryBrandBLight = '4px';
50
- export declare const collectionsBrandsTestSecondaryBrandADark = '#cc2020';
51
- export declare const collectionsBrandsTestSecondaryBrandALight = '#cc2020';
56
+ export declare const collectionsTestingColorSecondaryBrandBDark = '#6A4CEC';
57
+ export declare const collectionsTestingColorSecondaryBrandBLight = '#6A4CEC';
58
+ export declare const collectionsTestingFooBarBrandADark = '1px';
59
+ export declare const collectionsTestingFooBarBrandALight = '1px';
60
+ export declare const collectionsTestingFooBarBrandBDark = '1px';
61
+ export declare const collectionsTestingFooBarBrandBLight = '1px';
62
+ export declare const collectionsTestingTestDimensionBrandADark = '2px';
63
+ export declare const collectionsTestingTestDimensionBrandALight = '2px';
64
+ export declare const collectionsTestingTestDimensionBrandBDark = '2px';
65
+ export declare const collectionsTestingTestDimensionBrandBLight = '2px';
66
+ export declare const collectionsTestingTestPrimaryBrandADark = '4px';
67
+ export declare const collectionsTestingTestPrimaryBrandALight = '40px';
68
+ export declare const collectionsTestingTestPrimaryBrandBDark = '4px';
69
+ export declare const collectionsTestingTestPrimaryBrandBLight = '4px';
70
+ export declare const collectionsTestingTestSecondaryBrandADark = '#cc2020';
71
+ export declare const collectionsTestingTestSecondaryBrandALight = '#cc2020';
52
72
  export declare const colorNeutral600 = '#ACAAB6';
53
- export declare const collectionsBrandsTestSecondaryBrandBDark = '#ACAAB6';
73
+ export declare const collectionsTestingTestSecondaryBrandBDark = '#ACAAB6';
54
74
  export declare const colorNeutral300 = '#EDECEF';
55
- export declare const collectionsBrandsTestSecondaryBrandBLight = '#EDECEF';
56
- export declare const collectionsDensitySpacingLargeComfortable = '40px';
57
- export declare const spacingScale5 = '16px';
58
- export declare const collectionsDensitySpacingLargeCompact = '16px';
59
- export declare const spacingScale6 = '24px';
60
- export declare const collectionsDensitySpacingMediumComfortable = '24px';
61
- export declare const collectionsDensitySpacingMediumCompact = '16px';
62
- export declare const spacingScale3 = '8px';
63
- export declare const collectionsDensitySpacingSmallComfortable = '8px';
75
+ export declare const collectionsTestingTestSecondaryBrandBLight = '#EDECEF';
76
+ export declare const sandboxColorBrand = '#7A34ED';
77
+ export declare const collectionsThemeActionBaseDark = '#7A34ED';
78
+ export declare const collectionsThemeActionBaseLight = '#7A34ED';
79
+ export declare const sandboxColorWhite = '#ffffff';
80
+ export declare const collectionsThemeActionTextDark = '#ffffff';
81
+ export declare const collectionsThemeActionTextLight = '#ffffff';
82
+ export declare const collectionsThemeBackgroundContentDark = '#3B3644';
83
+ export declare const collectionsThemeBackgroundContentLight = '#FFFFFF';
84
+ export declare const collectionsThemeBackgroundPageDark = '#1F1C25';
85
+ export declare const collectionsThemeBackgroundPageLight = '#FDFCFE';
86
+ export declare const collectionsThemeTextBaseDark = '#F6F8FF';
87
+ export declare const collectionsThemeTextBaseLight = '#191F2C';
88
+ export declare const collectionsThemeTextSubtleDark = '#BEC3D3';
89
+ export declare const collectionsThemeTextSubtleLight = '#6E7A82';
64
90
  export declare const colorNeutral800 = '#191335';
65
91
  export declare const colorBlack = '#191335';
66
92
  export declare const colorWhite = '#ffffff';
@@ -100,16 +126,22 @@ export declare const miscSomeText = 'Hello world';
100
126
  export declare const radiusMedium = '8px';
101
127
  export declare const radiusRound = '160px';
102
128
  export declare const radiusSmall = '4px';
129
+ export declare const sandboxColorError = '#FF5C46';
130
+ export declare const sandboxColorSuccess = '#6BC313';
131
+ export declare const sandboxColorWarning = '#FAB120';
132
+ export declare const sandboxRadiusLarge = '16px';
133
+ export declare const sandboxRadiusMedium = '8px';
134
+ export declare const sandboxRadiusSmall = '4px';
135
+ export declare const sandboxRadiusXlarge = '32px';
136
+ export declare const sandboxRadiusXsmall = '2px';
137
+ export declare const sandboxWidthNarrow = '640px';
138
+ export declare const sandboxWidthWide = '1080px';
103
139
  export declare const shadow1 = '0px 5px 10px 0px #000000';
104
140
  export declare const shadow2 = '0px 10px 20px 0px #000000';
105
141
  export declare const shadow3 = '0px 15px 25px 0px #000000';
106
142
  export declare const shadow4 = '0px 20px 40px 0px #000000';
107
143
  export declare const shadowColor = '#000000';
108
- export declare const spacingScale1 = '2px';
109
- export declare const spacingScale4 = '12px';
110
- export declare const spacingScale7 = '32px';
111
144
  export declare const spacingScale9 = '48px';
112
- export declare const spacingScale10 = '64px';
113
145
  export declare const spacingScale11 = '80px';
114
146
  export declare const spacingScale12 = '96px';
115
147
  export declare const spacingScale13 = '160px';