@liner-fe/design-token-primitive 0.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.
Files changed (57) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/README.md +3 -0
  3. package/dist/constants/breakpoint/index.d.ts +17 -0
  4. package/dist/constants/breakpoint/index.js +21 -0
  5. package/dist/constants/color/index.d.ts +8 -0
  6. package/dist/constants/color/index.js +298 -0
  7. package/dist/constants/color/types.d.ts +136 -0
  8. package/dist/constants/color/types.js +2 -0
  9. package/dist/constants/gap/index.d.ts +13 -0
  10. package/dist/constants/gap/index.js +17 -0
  11. package/dist/constants/icon/index.d.ts +7 -0
  12. package/dist/constants/icon/index.js +11 -0
  13. package/dist/constants/letterSpacing/index.d.ts +3 -0
  14. package/dist/constants/letterSpacing/index.js +6 -0
  15. package/dist/constants/opacity/index.d.ts +21 -0
  16. package/dist/constants/opacity/index.js +24 -0
  17. package/dist/constants/padding/index.d.ts +23 -0
  18. package/dist/constants/padding/index.js +27 -0
  19. package/dist/constants/radius/index.d.ts +2 -0
  20. package/dist/constants/radius/index.js +13 -0
  21. package/dist/constants/radius/type.d.ts +10 -0
  22. package/dist/constants/radius/type.js +2 -0
  23. package/dist/constants/shadow/index.d.ts +2 -0
  24. package/dist/constants/shadow/index.js +22 -0
  25. package/dist/constants/size/index.d.ts +2 -0
  26. package/dist/constants/size/index.js +35 -0
  27. package/dist/constants/size/type.d.ts +31 -0
  28. package/dist/constants/size/type.js +34 -0
  29. package/dist/constants/typography/index.d.ts +14 -0
  30. package/dist/constants/typography/index.js +309 -0
  31. package/dist/constants/typography/primitive.d.ts +43 -0
  32. package/dist/constants/typography/primitive.js +45 -0
  33. package/dist/constants/typography/types.d.ts +15 -0
  34. package/dist/constants/typography/types.js +2 -0
  35. package/dist/index.d.ts +13 -0
  36. package/dist/index.js +29 -0
  37. package/dist/index.mjs +1 -0
  38. package/esbuild.js +14 -0
  39. package/package.json +20 -0
  40. package/src/constants/breakpoint/index.ts +21 -0
  41. package/src/constants/color/index.ts +341 -0
  42. package/src/constants/color/types.ts +240 -0
  43. package/src/constants/gap/index.ts +15 -0
  44. package/src/constants/icon/index.ts +9 -0
  45. package/src/constants/letterSpacing/index.ts +3 -0
  46. package/src/constants/opacity/index.ts +21 -0
  47. package/src/constants/padding/index.ts +26 -0
  48. package/src/constants/radius/index.ts +12 -0
  49. package/src/constants/radius/type.ts +11 -0
  50. package/src/constants/shadow/index.ts +20 -0
  51. package/src/constants/size/index.ts +33 -0
  52. package/src/constants/size/type.ts +31 -0
  53. package/src/constants/typography/index.ts +328 -0
  54. package/src/constants/typography/primitive.ts +46 -0
  55. package/src/constants/typography/types.ts +74 -0
  56. package/src/index.ts +13 -0
  57. package/tsconfig.json +7 -0
package/CHANGELOG.md ADDED
@@ -0,0 +1,13 @@
1
+ # @liner-fe/design-token-primitive
2
+
3
+ ## 0.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 081f7e7: rebranding minor bump
8
+
9
+ ## 0.0.2
10
+
11
+ ### Patch Changes
12
+
13
+ - ff37eb5: update
package/README.md ADDED
@@ -0,0 +1,3 @@
1
+ # design-token-primitive
2
+
3
+ design-token-primitive는 npm에 배포되지 않고 내부적으로 script를 통해 원하는 포맷으로 변경하기 위한 package입니다.
@@ -0,0 +1,17 @@
1
+ export declare const breakpointOrigin: {
2
+ readonly xs: "0px";
3
+ readonly s: "599px";
4
+ readonly m: "1023px";
5
+ readonly l: "1365px";
6
+ readonly xl: "1535px";
7
+ readonly xxl: "1919px";
8
+ readonly xxxl: "2559px";
9
+ };
10
+ export declare const breakpoint: {
11
+ s: string;
12
+ m: string;
13
+ l: string;
14
+ xl: string;
15
+ xxl: string;
16
+ xxxl: string;
17
+ };
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.breakpoint = exports.breakpointOrigin = void 0;
4
+ exports.breakpointOrigin = {
5
+ xs: '0px',
6
+ s: '599px',
7
+ m: '1023px',
8
+ l: '1365px',
9
+ xl: '1535px',
10
+ xxl: '1919px',
11
+ xxxl: '2559px',
12
+ };
13
+ const makeBreakpoint = (key) => `@media (max-width: ${exports.breakpointOrigin[key]})`;
14
+ exports.breakpoint = {
15
+ s: makeBreakpoint('s'),
16
+ m: makeBreakpoint('m'),
17
+ l: makeBreakpoint('l'),
18
+ xl: makeBreakpoint('xl'),
19
+ xxl: makeBreakpoint('xxl'),
20
+ xxxl: makeBreakpoint('xxxl'),
21
+ };
@@ -0,0 +1,8 @@
1
+ import { IColor } from './types';
2
+ export declare const color: IColor;
3
+ export declare const alphas: readonly [80, 72, 64, 56, 50, 48, 44, 40, 36, 32, 28, 24, 20, 16, 12, 8, 6, 4, 1, 0];
4
+ export type alphaPrimitiveKeys = 'lp-pri-achromatic-white' | 'lp-pri-gray-cool-dark' | 'lp-pri-gray-cool-light' | 'lp-pri-brand-original' | 'lp-pri-achromatic-black' | 'lp-pri-brand-variation';
5
+ export declare const alphaPrimitive: {
6
+ name: alphaPrimitiveKeys;
7
+ value: string;
8
+ }[];
@@ -0,0 +1,298 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.alphaPrimitive = exports.alphas = exports.color = void 0;
4
+ const utils_1 = require("@toss/utils");
5
+ const system = {
6
+ // neutral / container
7
+ 'neutral-container-lowest': ['lp-pri-achromatic-white', 'lp-pri-gray-cool-100'],
8
+ 'neutral-container-lowest-hover': ['lp-pri-gray-cool-980', 'lp-pri-gray-cool-200'],
9
+ 'neutral-container-low': ['lp-pri-gray-cool-980', 'lp-pri-gray-cool-200'],
10
+ 'neutral-container-low-hover': ['lp-pri-gray-cool-970', 'lp-pri-gray-cool-250'],
11
+ 'neutral-container-mid': ['lp-pri-gray-cool-970', 'lp-pri-gray-cool-250'],
12
+ 'neutral-container-mid-hover': ['lp-pri-gray-cool-950', 'lp-pri-gray-cool-270'],
13
+ 'neutral-container-high': ['lp-pri-gray-cool-940', 'lp-pri-gray-cool-250'],
14
+ 'neutral-container-high-hover': ['lp-pri-gray-cool-900', 'lp-pri-gray-cool-300'],
15
+ 'neutral-container-highest': ['lp-pri-gray-cool-920', 'lp-pri-gray-cool-300'],
16
+ 'neutral-container-static-lowest': ['lp-pri-achromatic-white', 'lp-pri-achromatic-white'],
17
+ 'neutral-container-static-lowest-hover': ['lp-pri-gray-cool-980', 'lp-pri-gray-cool-980'],
18
+ 'neutral-container-variation-lowest': ['lp-pri-achromatic-white', 'lp-pri-gray-cool-200'],
19
+ // neutral / fill
20
+ 'neutral-fill-lowest': ['lp-pri-gray-cool-dark-alpha-0', 'lp-pri-gray-cool-dark-alpha-0'],
21
+ 'neutral-fill-lowest-hover': ['lp-pri-gray-cool-dark-alpha-6', 'lp-pri-gray-cool-dark-alpha-12'],
22
+ 'neutral-fill-low': ['lp-pri-gray-cool-dark-alpha-4', 'lp-pri-gray-cool-dark-alpha-8'],
23
+ 'neutral-fill-low-hover': ['lp-pri-gray-cool-dark-alpha-8', 'lp-pri-gray-cool-dark-alpha-20'],
24
+ 'neutral-fill-mid': ['lp-pri-gray-cool-dark-alpha-8', 'lp-pri-gray-cool-dark-alpha-16'],
25
+ 'neutral-fill-mid-hover': ['lp-pri-gray-cool-dark-alpha-16', 'lp-pri-gray-cool-dark-alpha-32'],
26
+ 'neutral-fill-high': ['lp-pri-gray-cool-dark-alpha-20', 'lp-pri-gray-cool-dark-alpha-32'],
27
+ 'neutral-fill-high-hover': ['lp-pri-gray-cool-dark-alpha-28', 'lp-pri-gray-cool-dark-alpha-44'],
28
+ 'neutral-fill-highest': ['lp-pri-gray-cool-dark-alpha-72', 'lp-pri-gray-cool-dark-alpha-72'],
29
+ // neutral / label
30
+ 'neutral-label-primary': ['lp-pri-gray-cool-100', 'lp-pri-achromatic-white'],
31
+ 'neutral-label-secondary': ['lp-pri-gray-cool-dark-alpha-80', 'lp-pri-gray-cool-light-alpha-64'],
32
+ 'neutral-label-tertiary': ['lp-pri-gray-cool-dark-alpha-48', 'lp-pri-gray-cool-light-alpha-32'],
33
+ 'neutral-label-quaternary': ['lp-pri-gray-cool-dark-alpha-24', 'lp-pri-gray-cool-light-alpha-20'],
34
+ 'neutral-label-static-primary': ['lp-pri-gray-cool-100', 'lp-pri-gray-cool-100'],
35
+ 'neutral-label-static-secondary': [
36
+ 'lp-pri-gray-cool-dark-alpha-80',
37
+ 'lp-pri-gray-cool-dark-alpha-80',
38
+ ],
39
+ // neutral / border
40
+ 'neutral-border-overlay-strong': [
41
+ 'lp-pri-gray-cool-dark-alpha-64',
42
+ 'lp-pri-gray-cool-light-alpha-64',
43
+ ],
44
+ 'neutral-border-overlay-normal': [
45
+ 'lp-pri-gray-cool-dark-alpha-24',
46
+ 'lp-pri-gray-cool-light-alpha-28',
47
+ ],
48
+ 'neutral-border-overlay-subtle': [
49
+ 'lp-pri-gray-cool-dark-alpha-16',
50
+ 'lp-pri-gray-cool-light-alpha-20',
51
+ ],
52
+ 'neutral-border-overlay-hint': [
53
+ 'lp-pri-gray-cool-dark-alpha-12',
54
+ 'lp-pri-gray-cool-light-alpha-12',
55
+ ],
56
+ 'neutral-border-opaque-strong': ['lp-pri-gray-cool-100', 'lp-pri-achromatic-white'],
57
+ 'neutral-border-opaque-normal': ['lp-pri-gray-cool-850', 'lp-pri-gray-cool-350'],
58
+ 'neutral-border-opaque-subtle': ['lp-pri-gray-cool-920', 'lp-pri-gray-cool-250'],
59
+ // inverse / container
60
+ 'inverse-container-lowest': ['lp-pri-gray-cool-100', 'lp-pri-achromatic-white'],
61
+ 'inverse-container-lowest-hover': ['lp-pri-gray-cool-200', 'lp-pri-gray-cool-980'],
62
+ 'inverse-container-low': ['lp-pri-gray-cool-200', 'lp-pri-gray-cool-980'],
63
+ 'inverse-container-low-hover': ['lp-pri-gray-cool-250', 'lp-pri-gray-cool-970'],
64
+ 'inverse-container-mid': ['lp-pri-gray-cool-250', 'lp-pri-gray-cool-970'],
65
+ 'inverse-container-mid-hover': ['lp-pri-gray-cool-270', 'lp-pri-gray-cool-950'],
66
+ 'inverse-container-high': ['lp-pri-gray-cool-250', 'lp-pri-gray-cool-940'],
67
+ 'inverse-container-high-hover': ['lp-pri-gray-cool-300', 'lp-pri-gray-cool-900'],
68
+ 'inverse-container-static-high': ['lp-pri-gray-cool-250', 'lp-pri-gray-cool-250'],
69
+ 'inverse-container-static-high-hover': ['lp-pri-gray-cool-350', 'lp-pri-gray-cool-350'],
70
+ 'inverse-container-highest': ['lp-pri-gray-cool-300', 'lp-pri-gray-cool-920'],
71
+ // inverse / fill
72
+ 'inverse-fill-mid': ['lp-pri-achromatic-white', 'lp-pri-gray-cool-light-alpha-24'],
73
+ 'inverse-fill-mid-hover': ['lp-pri-gray-cool-dark-alpha-32', 'lp-pri-gray-cool-dark-alpha-16'],
74
+ // inverse / label
75
+ 'inverse-label-primary': ['lp-pri-achromatic-white', 'lp-pri-gray-cool-100'],
76
+ 'inverse-label-secondary': ['lp-pri-gray-cool-light-alpha-64', 'lp-pri-gray-cool-dark-alpha-80'],
77
+ 'inverse-label-tertiary': ['lp-pri-gray-cool-light-alpha-32', 'lp-pri-gray-cool-dark-alpha-48'],
78
+ 'inverse-label-quaternary': ['lp-pri-gray-cool-light-alpha-20', 'lp-pri-gray-cool-dark-alpha-24'],
79
+ 'inverse-label-static-primary': ['lp-pri-achromatic-white', 'lp-pri-achromatic-white'],
80
+ 'inverse-label-static-secondary': [
81
+ 'lp-pri-gray-cool-light-alpha-64',
82
+ 'lp-pri-gray-cool-light-alpha-64',
83
+ ],
84
+ // inverse / border
85
+ 'inverse-border-overlay-strong': [
86
+ 'lp-pri-gray-cool-light-alpha-64',
87
+ 'lp-pri-gray-cool-dark-alpha-64',
88
+ ],
89
+ 'inverse-border-overlay-normal': [
90
+ 'lp-pri-gray-cool-light-alpha-28',
91
+ 'lp-pri-gray-cool-dark-alpha-24',
92
+ ],
93
+ 'inverse-border-overlay-subtle': [
94
+ 'lp-pri-gray-cool-light-alpha-20',
95
+ 'lp-pri-gray-cool-dark-alpha-16',
96
+ ],
97
+ 'inverse-border-overlay-hint': [
98
+ 'lp-pri-gray-cool-light-alpha-12',
99
+ 'lp-pri-gray-cool-dark-alpha-12',
100
+ ],
101
+ 'inverse-border-opaque-strong': ['lp-pri-achromatic-white', 'lp-pri-gray-cool-100'],
102
+ 'inverse-border-opaque-normal': ['lp-pri-gray-cool-350', 'lp-pri-gray-cool-850'],
103
+ 'inverse-border-opaque-subtle': ['lp-pri-gray-cool-250', 'lp-pri-gray-cool-920'],
104
+ // brand / container
105
+ 'brand-container-mid': ['lp-pri-brand-original-200', 'lp-pri-brand-variation-380'],
106
+ 'brand-container-mid-hover': ['lp-pri-brand-original-150', 'lp-pri-brand-variation-350'],
107
+ 'brand-container-high': ['lp-pri-brand-original-500', 'lp-pri-brand-original-500'],
108
+ // brand / fill
109
+ 'brand-fill-mid': ['lp-pri-brand-original-200', 'lp-pri-brand-variation-380'],
110
+ 'brand-fill-mid-hover': ['lp-pri-brand-original-150', 'lp-pri-brand-variation-350'],
111
+ 'brand-fill-low': ['lp-pri-brand-original-990', 'lp-pri-brand-variation-100'],
112
+ 'brand-fill-low-hover': ['lp-pri-brand-original-980', 'lp-pri-brand-variation-150'],
113
+ // brand / label
114
+ 'brand-label-primary': ['lp-pri-brand-original-500', 'lp-pri-brand-variation-950'],
115
+ 'brand-label-secondary': ['lp-pri-brand-original-200', 'lp-pri-achromatic-white'],
116
+ 'brand-label-variation-secondary': [
117
+ 'lp-pri-brand-original-200',
118
+ 'lp-pri-achromatic-white-alpha-80',
119
+ ],
120
+ // brand / border
121
+ 'brand-border-opaque-normal': ['lp-pri-brand-original-200', 'lp-pri-achromatic-white'],
122
+ 'brand-border-opaque-strong': ['lp-pri-brand-original-500', 'lp-pri-brand-variation-950'],
123
+ // brand / inverse label
124
+ 'brandinverse-label-primary': ['lp-pri-brand-variation-950', 'lp-pri-brand-original-500'],
125
+ 'brandinverse-label-secondary': ['lp-pri-achromatic-white', 'lp-pri-brand-original-200'],
126
+ 'brandinverse-label-static-primary': ['lp-pri-brand-variation-950', 'lp-pri-brand-variation-950'],
127
+ // accent / label
128
+ 'accent-label-primary': ['lp-pri-rainbow-orange-700', 'lp-pri-rainbow-orange-730'],
129
+ // accent / container
130
+ 'accent-container-primary': ['lp-pri-rainbow-orange-800', 'lp-pri-rainbow-orange-500'],
131
+ // function / container
132
+ 'function-container-positive': ['lp-pri-rainbow-green-500', 'lp-pri-rainbow-green-600'],
133
+ 'function-container-negative': ['lp-pri-rainbow-red-500', 'lp-pri-rainbow-red-500'],
134
+ 'function-container-negative-hover': ['lp-pri-rainbow-red-400', 'lp-pri-rainbow-red-600'],
135
+ 'function-container-caution': ['lp-pri-rainbow-orange-500', 'lp-pri-rainbow-orange-500'],
136
+ 'function-container-highlight': ['lp-pri-rainbow-yellow-900', 'lp-pri-rainbow-yellow-100'],
137
+ 'function-container-selection': ['lp-pri-brand-variation-950', 'lp-pri-brand-variation-100'],
138
+ 'function-container-drag': ['lp-pri-brand-original-alpha-12', 'lp-pri-achromatic-white-alpha-16'],
139
+ // function / label
140
+ 'function-label-positive': ['lp-pri-rainbow-green-500', 'lp-pri-rainbow-green-600'],
141
+ 'function-label-negative': ['lp-pri-rainbow-red-500', 'lp-pri-rainbow-red-500'],
142
+ 'function-label-caution': ['lp-pri-rainbow-orange-500', 'lp-pri-rainbow-orange-500'],
143
+ 'function-label-link': ['lp-pri-rainbow-cyan-300', 'lp-pri-rainbow-cyan-600'],
144
+ // cover
145
+ 'cover-dim-page': ['lp-pri-achromatic-black-alpha-56', 'lp-pri-achromatic-black-alpha-56'],
146
+ };
147
+ exports.color = {
148
+ primitive: {
149
+ 'lp-pri-achromatic-white': '#ffffff',
150
+ 'lp-pri-achromatic-black': '#000000',
151
+ 'lp-pri-gray-cool-980': '#F9F9FA',
152
+ 'lp-pri-gray-cool-970': '#F6F6F7',
153
+ 'lp-pri-gray-cool-950': '#F1F1F2',
154
+ 'lp-pri-gray-cool-940': '#EDEEF0',
155
+ 'lp-pri-gray-cool-920': '#E9E9EB',
156
+ 'lp-pri-gray-cool-900': '#E3E3E6',
157
+ 'lp-pri-gray-cool-850': '#D7D7D9',
158
+ 'lp-pri-gray-cool-350': '#58595C',
159
+ 'lp-pri-gray-cool-300': '#4A4A4D',
160
+ 'lp-pri-gray-cool-270': '#39393B',
161
+ 'lp-pri-gray-cool-250': '#313133',
162
+ 'lp-pri-gray-cool-200': '#272729',
163
+ 'lp-pri-gray-cool-120': '#252526',
164
+ 'lp-pri-gray-cool-100': '#1E1E1F',
165
+ 'lp-pri-brand-original-990': '#F6FFF1',
166
+ 'lp-pri-brand-original-980': '#EBFFE7',
167
+ 'lp-pri-brand-original-500': '#0C893B',
168
+ 'lp-pri-brand-original-380': '#006829',
169
+ 'lp-pri-brand-original-200': '#14371B',
170
+ 'lp-pri-brand-original-150': '#14371B',
171
+ 'lp-pri-brand-original-50': '#002109',
172
+ 'lp-pri-brand-variation-950': '#C3FFD0',
173
+ 'lp-pri-brand-variation-900': '#96F7B3',
174
+ 'lp-pri-brand-variation-380': '#236638',
175
+ 'lp-pri-brand-variation-350': '#1A5E31',
176
+ 'lp-pri-brand-variation-250': '#00461F',
177
+ 'lp-pri-brand-variation-150': '#0E2B1A',
178
+ 'lp-pri-brand-variation-100': '#032110',
179
+ 'lp-pri-rainbow-red-950': '#FFF5F5',
180
+ 'lp-pri-rainbow-red-900': '#FFE7E7',
181
+ 'lp-pri-rainbow-red-800': '#FFC3C3',
182
+ 'lp-pri-rainbow-red-700': '#FF9090',
183
+ 'lp-pri-rainbow-red-600': '#FF6060',
184
+ 'lp-pri-rainbow-red-500': '#FF3333',
185
+ 'lp-pri-rainbow-red-400': '#DB2323',
186
+ 'lp-pri-rainbow-red-300': '#B81616',
187
+ 'lp-pri-rainbow-red-200': '#710808',
188
+ 'lp-pri-rainbow-red-100': '#410404',
189
+ 'lp-pri-rainbow-orange-970': '#FFF4EF',
190
+ 'lp-pri-rainbow-orange-940': '#FFEADC',
191
+ 'lp-pri-rainbow-orange-900': '#FFDCC2',
192
+ 'lp-pri-rainbow-orange-800': '#FFB77C',
193
+ 'lp-pri-rainbow-orange-730': '#FF9B3E',
194
+ 'lp-pri-rainbow-orange-700': '#FE8F16',
195
+ 'lp-pri-rainbow-orange-600': '#DA7700',
196
+ 'lp-pri-rainbow-orange-500': '#B46200',
197
+ 'lp-pri-rainbow-orange-400': '#904D00',
198
+ 'lp-pri-rainbow-orange-300': '#6D3900',
199
+ 'lp-pri-rainbow-yellow-950': '#FFFDF4',
200
+ 'lp-pri-rainbow-yellow-900': '#FFF9E3',
201
+ 'lp-pri-rainbow-yellow-800': '#FFF0B4',
202
+ 'lp-pri-rainbow-yellow-700': '#FFE375',
203
+ 'lp-pri-rainbow-yellow-600': '#FFD739',
204
+ 'lp-pri-rainbow-yellow-500': '#FFCC00',
205
+ 'lp-pri-rainbow-yellow-400': '#DBB003',
206
+ 'lp-pri-rainbow-yellow-300': '#B89405',
207
+ 'lp-pri-rainbow-yellow-200': '#715B05',
208
+ 'lp-pri-rainbow-yellow-100': '#413503',
209
+ 'lp-pri-rainbow-lime_green-970': '#EAFFB6',
210
+ 'lp-pri-rainbow-lime_green-940': '#CEFF56',
211
+ 'lp-pri-rainbow-lime_green-900': '#BFF434',
212
+ 'lp-pri-rainbow-lime_green-800': '#A4D706',
213
+ 'lp-pri-rainbow-lime_green-730': '#94C300',
214
+ 'lp-pri-rainbow-lime_green-700': '#8DBA00',
215
+ 'lp-pri-rainbow-lime_green-600': '#779D00',
216
+ 'lp-pri-rainbow-lime_green-500': '#628200',
217
+ 'lp-pri-rainbow-lime_green-400': '#4D6700',
218
+ 'lp-pri-rainbow-lime_green-300': '#394D00',
219
+ 'lp-pri-rainbow-green-950': '#F5FEF7',
220
+ 'lp-pri-rainbow-green-900': '#E6FCEA',
221
+ 'lp-pri-rainbow-green-800': '#BFF5C8',
222
+ 'lp-pri-rainbow-green-700': '#8CEC9C',
223
+ 'lp-pri-rainbow-green-600': '#5DDF73',
224
+ 'lp-pri-rainbow-green-500': '#30BF48',
225
+ 'lp-pri-rainbow-green-400': '#20A536',
226
+ 'lp-pri-rainbow-green-300': '#148B28',
227
+ 'lp-pri-rainbow-green-200': '#075714',
228
+ 'lp-pri-rainbow-green-100': '#03350B',
229
+ 'lp-pri-rainbow-mint-950': '#F3FEFE',
230
+ 'lp-pri-rainbow-mint-900': '#AFF7F7',
231
+ 'lp-pri-rainbow-mint-800': '#6EF0F0',
232
+ 'lp-pri-rainbow-mint-700': '#33E6E6',
233
+ 'lp-pri-rainbow-mint-600': '#00CCCC',
234
+ 'lp-pri-rainbow-mint-500': '#02B0B0',
235
+ 'lp-pri-rainbow-mint-400': '#02B0B0',
236
+ 'lp-pri-rainbow-mint-300': '#049494',
237
+ 'lp-pri-rainbow-mint-200': '#045C5C',
238
+ 'lp-pri-rainbow-mint-100': '#033737',
239
+ 'lp-pri-rainbow-cyan-950': '#F6FBFF',
240
+ 'lp-pri-rainbow-cyan-900': '#E8F6FF',
241
+ 'lp-pri-rainbow-cyan-800': '#C6E8FF',
242
+ 'lp-pri-rainbow-cyan-700': '#97D5FF',
243
+ 'lp-pri-rainbow-cyan-600': '#6AC4FF',
244
+ 'lp-pri-rainbow-cyan-500': '#40B3FF',
245
+ 'lp-pri-rainbow-cyan-400': '#2B95DB',
246
+ 'lp-pri-rainbow-cyan-300': '#1A79B8',
247
+ 'lp-pri-rainbow-cyan-200': '#094771',
248
+ 'lp-pri-rainbow-cyan-100': '#042941',
249
+ 'lp-pri-rainbow-purple-950': '#FCF6FF',
250
+ 'lp-pri-rainbow-purple-900': '#F7EAFE',
251
+ 'lp-pri-rainbow-purple-800': '#EBCAFB',
252
+ 'lp-pri-rainbow-purple-700': '#DAA0F7',
253
+ 'lp-pri-rainbow-purple-600': '#C978F2',
254
+ 'lp-pri-rainbow-purple-500': '#B450E6',
255
+ 'lp-pri-rainbow-purple-400': '#9535C6',
256
+ 'lp-pri-rainbow-purple-300': '#7920A6',
257
+ 'lp-pri-rainbow-purple-200': '#480A67',
258
+ 'lp-pri-rainbow-purple-100': '#29043C',
259
+ 'lp-pri-rainbow-pink-950': '#FFF5F8',
260
+ 'lp-pri-rainbow-pink-900': '#FFE7EF',
261
+ 'lp-pri-rainbow-pink-800': '#FFC3D7',
262
+ 'lp-pri-rainbow-pink-700': '#FF90B5',
263
+ 'lp-pri-rainbow-pink-600': '#FF6095',
264
+ 'lp-pri-rainbow-pink-500': '#FF3377',
265
+ 'lp-pri-rainbow-pink-400': '#DB2360',
266
+ 'lp-pri-rainbow-pink-300': '#B8164C',
267
+ 'lp-pri-rainbow-pink-200': '#71082B',
268
+ 'lp-pri-rainbow-pink-100': '#120107',
269
+ },
270
+ system: {
271
+ dark: {},
272
+ light: {},
273
+ },
274
+ };
275
+ exports.alphas = [
276
+ 80, 72, 64, 56, 50, 48, 44, 40, 36, 32, 28, 24, 20, 16, 12, 8, 6, 4, 1, 0,
277
+ ];
278
+ exports.alphaPrimitive = [
279
+ { name: 'lp-pri-achromatic-white', value: '#FFFFFF' },
280
+ { name: 'lp-pri-gray-cool-dark', value: '#6D6D70' },
281
+ { name: 'lp-pri-gray-cool-light', value: '#E9E9EB' },
282
+ { name: 'lp-pri-brand-original', value: '#041166' },
283
+ { name: 'lp-pri-achromatic-black', value: '#000000' },
284
+ ];
285
+ const generateAlpha = () => {
286
+ exports.alphaPrimitive.forEach(({ name, value }) => {
287
+ exports.alphas.forEach((alpha) => {
288
+ const alphaKey = `${name}-alpha-${alpha}`;
289
+ exports.color.primitive[alphaKey] = (0, utils_1.hexToRgba)(value.slice(1), alpha / 100);
290
+ });
291
+ });
292
+ };
293
+ generateAlpha();
294
+ Object.entries(system).map(([key, value]) => {
295
+ const systemKey = key;
296
+ exports.color.system.light[systemKey] = value[0];
297
+ exports.color.system.dark[systemKey] = value[1];
298
+ });
@@ -0,0 +1,136 @@
1
+ import { alphas, alphaPrimitiveKeys } from '.';
2
+ export interface IPrimitive {
3
+ 'lp-pri-achromatic-white': '#ffffff';
4
+ 'lp-pri-achromatic-black': '#000000';
5
+ 'lp-pri-gray-cool-980': '#F9F9FA';
6
+ 'lp-pri-gray-cool-970': '#F6F6F7';
7
+ 'lp-pri-gray-cool-950': '#F1F1F2';
8
+ 'lp-pri-gray-cool-940': '#EDEEF0';
9
+ 'lp-pri-gray-cool-920': '#E9E9EB';
10
+ 'lp-pri-gray-cool-900': '#E3E3E6';
11
+ 'lp-pri-gray-cool-850': '#D7D7D9';
12
+ 'lp-pri-gray-cool-350': '#58595C';
13
+ 'lp-pri-gray-cool-300': '#4A4A4D';
14
+ 'lp-pri-gray-cool-270': '#39393B';
15
+ 'lp-pri-gray-cool-250': '#313133';
16
+ 'lp-pri-gray-cool-200': '#272729';
17
+ 'lp-pri-gray-cool-120': '#252526';
18
+ 'lp-pri-gray-cool-100': '#1E1E1F';
19
+ 'lp-pri-brand-original-990': '#F6FFF1';
20
+ 'lp-pri-brand-original-980': '#EBFFE7';
21
+ 'lp-pri-brand-original-500': '#0C893B';
22
+ 'lp-pri-brand-original-380': '#006829';
23
+ 'lp-pri-brand-original-200': '#14371B';
24
+ 'lp-pri-brand-original-150': '#14371B';
25
+ 'lp-pri-brand-original-50': '#002109';
26
+ 'lp-pri-brand-variation-950': '#C3FFD0';
27
+ 'lp-pri-brand-variation-900': '#96F7B3';
28
+ 'lp-pri-brand-variation-380': '#236638';
29
+ 'lp-pri-brand-variation-350': '#1A5E31';
30
+ 'lp-pri-brand-variation-250': '#00461F';
31
+ 'lp-pri-brand-variation-150': '#0E2B1A';
32
+ 'lp-pri-brand-variation-100': '#032110';
33
+ 'lp-pri-rainbow-red-950': '#FFF5F5';
34
+ 'lp-pri-rainbow-red-900': '#FFE7E7';
35
+ 'lp-pri-rainbow-red-800': '#FFC3C3';
36
+ 'lp-pri-rainbow-red-700': '#FF9090';
37
+ 'lp-pri-rainbow-red-600': '#FF6060';
38
+ 'lp-pri-rainbow-red-500': '#FF3333';
39
+ 'lp-pri-rainbow-red-400': '#DB2323';
40
+ 'lp-pri-rainbow-red-300': '#B81616';
41
+ 'lp-pri-rainbow-red-200': '#710808';
42
+ 'lp-pri-rainbow-red-100': '#410404';
43
+ 'lp-pri-rainbow-orange-970': '#FFF4EF';
44
+ 'lp-pri-rainbow-orange-940': '#FFEADC';
45
+ 'lp-pri-rainbow-orange-900': '#FFDCC2';
46
+ 'lp-pri-rainbow-orange-800': '#FFB77C';
47
+ 'lp-pri-rainbow-orange-730': '#FF9B3E';
48
+ 'lp-pri-rainbow-orange-700': '#FE8F16';
49
+ 'lp-pri-rainbow-orange-600': '#DA7700';
50
+ 'lp-pri-rainbow-orange-500': '#B46200';
51
+ 'lp-pri-rainbow-orange-400': '#904D00';
52
+ 'lp-pri-rainbow-orange-300': '#6D3900';
53
+ 'lp-pri-rainbow-yellow-950': '#FFFDF4';
54
+ 'lp-pri-rainbow-yellow-900': '#FFF9E3';
55
+ 'lp-pri-rainbow-yellow-800': '#FFF0B4';
56
+ 'lp-pri-rainbow-yellow-700': '#FFE375';
57
+ 'lp-pri-rainbow-yellow-600': '#FFD739';
58
+ 'lp-pri-rainbow-yellow-500': '#FFCC00';
59
+ 'lp-pri-rainbow-yellow-400': '#DBB003';
60
+ 'lp-pri-rainbow-yellow-300': '#B89405';
61
+ 'lp-pri-rainbow-yellow-200': '#715B05';
62
+ 'lp-pri-rainbow-yellow-100': '#413503';
63
+ 'lp-pri-rainbow-lime_green-970': '#EAFFB6';
64
+ 'lp-pri-rainbow-lime_green-940': '#CEFF56';
65
+ 'lp-pri-rainbow-lime_green-900': '#BFF434';
66
+ 'lp-pri-rainbow-lime_green-800': '#A4D706';
67
+ 'lp-pri-rainbow-lime_green-730': '#94C300';
68
+ 'lp-pri-rainbow-lime_green-700': '#8DBA00';
69
+ 'lp-pri-rainbow-lime_green-600': '#779D00';
70
+ 'lp-pri-rainbow-lime_green-500': '#628200';
71
+ 'lp-pri-rainbow-lime_green-400': '#4D6700';
72
+ 'lp-pri-rainbow-lime_green-300': '#394D00';
73
+ 'lp-pri-rainbow-green-950': '#F5FEF7';
74
+ 'lp-pri-rainbow-green-900': '#E6FCEA';
75
+ 'lp-pri-rainbow-green-800': '#BFF5C8';
76
+ 'lp-pri-rainbow-green-700': '#8CEC9C';
77
+ 'lp-pri-rainbow-green-600': '#5DDF73';
78
+ 'lp-pri-rainbow-green-500': '#30BF48';
79
+ 'lp-pri-rainbow-green-400': '#20A536';
80
+ 'lp-pri-rainbow-green-300': '#148B28';
81
+ 'lp-pri-rainbow-green-200': '#075714';
82
+ 'lp-pri-rainbow-green-100': '#03350B';
83
+ 'lp-pri-rainbow-mint-950': '#F3FEFE';
84
+ 'lp-pri-rainbow-mint-900': '#AFF7F7';
85
+ 'lp-pri-rainbow-mint-800': '#6EF0F0';
86
+ 'lp-pri-rainbow-mint-700': '#33E6E6';
87
+ 'lp-pri-rainbow-mint-600': '#00CCCC';
88
+ 'lp-pri-rainbow-mint-500': '#02B0B0';
89
+ 'lp-pri-rainbow-mint-400': '#02B0B0';
90
+ 'lp-pri-rainbow-mint-300': '#049494';
91
+ 'lp-pri-rainbow-mint-200': '#045C5C';
92
+ 'lp-pri-rainbow-mint-100': '#033737';
93
+ 'lp-pri-rainbow-cyan-950': '#F6FBFF';
94
+ 'lp-pri-rainbow-cyan-900': '#E8F6FF';
95
+ 'lp-pri-rainbow-cyan-800': '#C6E8FF';
96
+ 'lp-pri-rainbow-cyan-700': '#97D5FF';
97
+ 'lp-pri-rainbow-cyan-600': '#6AC4FF';
98
+ 'lp-pri-rainbow-cyan-500': '#40B3FF';
99
+ 'lp-pri-rainbow-cyan-400': '#2B95DB';
100
+ 'lp-pri-rainbow-cyan-300': '#1A79B8';
101
+ 'lp-pri-rainbow-cyan-200': '#094771';
102
+ 'lp-pri-rainbow-cyan-100': '#042941';
103
+ 'lp-pri-rainbow-purple-950': '#FCF6FF';
104
+ 'lp-pri-rainbow-purple-900': '#F7EAFE';
105
+ 'lp-pri-rainbow-purple-800': '#EBCAFB';
106
+ 'lp-pri-rainbow-purple-700': '#DAA0F7';
107
+ 'lp-pri-rainbow-purple-600': '#C978F2';
108
+ 'lp-pri-rainbow-purple-500': '#B450E6';
109
+ 'lp-pri-rainbow-purple-400': '#9535C6';
110
+ 'lp-pri-rainbow-purple-300': '#7920A6';
111
+ 'lp-pri-rainbow-purple-200': '#480A67';
112
+ 'lp-pri-rainbow-purple-100': '#29043C';
113
+ 'lp-pri-rainbow-pink-950': '#FFF5F8';
114
+ 'lp-pri-rainbow-pink-900': '#FFE7EF';
115
+ 'lp-pri-rainbow-pink-800': '#FFC3D7';
116
+ 'lp-pri-rainbow-pink-700': '#FF90B5';
117
+ 'lp-pri-rainbow-pink-600': '#FF6095';
118
+ 'lp-pri-rainbow-pink-500': '#FF3377';
119
+ 'lp-pri-rainbow-pink-400': '#DB2360';
120
+ 'lp-pri-rainbow-pink-300': '#B8164C';
121
+ 'lp-pri-rainbow-pink-200': '#71082B';
122
+ 'lp-pri-rainbow-pink-100': '#120107';
123
+ }
124
+ export type SystemKeys = 'neutral-container-variation-lowest' | 'neutral-container-lowest-hover' | 'neutral-container-lowest' | 'neutral-container-low' | 'neutral-container-low-hover' | 'neutral-container-mid' | 'neutral-container-mid-hover' | 'neutral-container-high' | 'neutral-container-high-hover' | 'neutral-container-highest' | 'neutral-container-static-lowest' | 'neutral-container-static-lowest-hover' | 'neutral-fill-lowest' | 'neutral-fill-lowest-hover' | 'neutral-fill-low' | 'neutral-fill-low-hover' | 'neutral-fill-mid' | 'neutral-fill-mid-hover' | 'neutral-fill-high' | 'neutral-fill-high-hover' | 'neutral-fill-highest' | 'neutral-label-primary' | 'neutral-label-secondary' | 'neutral-label-tertiary' | 'neutral-label-quaternary' | 'neutral-label-static-primary' | 'neutral-label-static-secondary' | 'neutral-border-overlay-strong' | 'neutral-border-overlay-normal' | 'neutral-border-overlay-subtle' | 'neutral-border-overlay-hint' | 'neutral-border-opaque-strong' | 'neutral-border-opaque-normal' | 'neutral-border-opaque-subtle' | 'inverse-container-lowest' | 'inverse-container-lowest-hover' | 'inverse-container-low' | 'inverse-container-low-hover' | 'inverse-container-mid' | 'inverse-container-mid-hover' | 'inverse-container-high' | 'inverse-container-high-hover' | 'inverse-container-static-high' | 'inverse-container-static-high-hover' | 'inverse-fill-mid' | 'inverse-fill-mid-hover' | 'inverse-label-primary' | 'inverse-label-static-primary' | 'inverse-label-static-secondary' | 'inverse-label-secondary' | 'inverse-label-tertiary' | 'inverse-label-quaternary' | 'inverse-border-overlay-strong' | 'inverse-border-overlay-normal' | 'inverse-border-overlay-subtle' | 'inverse-border-overlay-hint' | 'inverse-border-opaque-strong' | 'inverse-border-opaque-normal' | 'inverse-border-opaque-subtle' | 'brand-container-mid' | 'brand-container-mid-hover' | 'brand-container-high' | 'brand-fill-mid' | 'brand-fill-mid-hover' | 'brand-fill-low' | 'brand-fill-low-hover' | 'brand-label-primary' | 'brand-label-secondary' | 'brand-label-variation-secondary' | 'brand-border-opaque-normal' | 'brand-border-opaque-strong' | 'brandinverse-label-primary' | 'brandinverse-label-secondary' | 'brandinverse-label-static-primary' | 'accent-label-primary' | 'accent-container-primary' | 'function-container-positive' | 'function-container-negative' | 'function-container-negative-hover' | 'function-container-caution' | 'function-container-highlight' | 'function-container-selection' | 'function-container-drag' | 'function-label-positive' | 'function-label-negative' | 'function-label-caution' | 'function-label-link' | 'inverse-container-highest' | 'cover-dim-page';
125
+ export interface IPrimitiveWithAlpha extends Partial<Record<AlphasKey, string>>, IPrimitive {
126
+ }
127
+ type ISystem = Record<SystemKeys, keyof IPrimitiveWithAlpha>;
128
+ export interface IColor {
129
+ primitive: IPrimitiveWithAlpha;
130
+ system: {
131
+ dark: Partial<ISystem>;
132
+ light: Partial<ISystem>;
133
+ };
134
+ }
135
+ export type AlphasKey = `${alphaPrimitiveKeys}-alpha-${(typeof alphas)[number]}`;
136
+ export {};
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -0,0 +1,13 @@
1
+ export declare const gap: {
2
+ readonly 'lp-sys-gap-positive-50': "2px";
3
+ readonly 'lp-sys-gap-positive-100': "4px";
4
+ readonly 'lp-sys-gap-positive-150': "6px";
5
+ readonly 'lp-sys-gap-positive-200': "8px";
6
+ readonly 'lp-sys-gap-positive-300': "12px";
7
+ readonly 'lp-sys-gap-positive-400': "16px";
8
+ readonly 'lp-sys-gap-positive-500': "20px";
9
+ readonly 'lp-sys-gap-positive-600': "24px";
10
+ readonly 'lp-sys-gap-positive-700': "32px";
11
+ readonly 'lp-sys-gap-positive-800': "40px";
12
+ readonly 'lp-sys-gap-positive-900': "48px";
13
+ };
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.gap = void 0;
4
+ const type_1 = require("../size/type");
5
+ exports.gap = {
6
+ 'lp-sys-gap-positive-50': type_1.ISize['lp-pri-size-2'],
7
+ 'lp-sys-gap-positive-100': type_1.ISize['lp-pri-size-4'],
8
+ 'lp-sys-gap-positive-150': type_1.ISize['lp-pri-size-6'],
9
+ 'lp-sys-gap-positive-200': type_1.ISize['lp-pri-size-8'],
10
+ 'lp-sys-gap-positive-300': type_1.ISize['lp-pri-size-12'],
11
+ 'lp-sys-gap-positive-400': type_1.ISize['lp-pri-size-16'],
12
+ 'lp-sys-gap-positive-500': type_1.ISize['lp-pri-size-20'],
13
+ 'lp-sys-gap-positive-600': type_1.ISize['lp-pri-size-24'],
14
+ 'lp-sys-gap-positive-700': type_1.ISize['lp-pri-size-32'],
15
+ 'lp-sys-gap-positive-800': type_1.ISize['lp-pri-size-40'],
16
+ 'lp-sys-gap-positive-900': type_1.ISize['lp-pri-size-48'],
17
+ };
@@ -0,0 +1,7 @@
1
+ export declare const iconSize: {
2
+ readonly 'lp-sys-icon-size-xs': "16px";
3
+ readonly 'lp-sys-icon-size-s': "20px";
4
+ readonly 'lp-sys-icon-size-m': "24px";
5
+ readonly 'lp-sys-icon-size-l': "32px";
6
+ readonly 'lp-sys-icon-size-xl': "40px";
7
+ };
@@ -0,0 +1,11 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.iconSize = void 0;
4
+ const type_1 = require("../size/type");
5
+ exports.iconSize = {
6
+ 'lp-sys-icon-size-xs': type_1.ISize['lp-pri-size-16'],
7
+ 'lp-sys-icon-size-s': type_1.ISize['lp-pri-size-20'],
8
+ 'lp-sys-icon-size-m': type_1.ISize['lp-pri-size-24'],
9
+ 'lp-sys-icon-size-l': type_1.ISize['lp-pri-size-32'],
10
+ 'lp-sys-icon-size-xl': type_1.ISize['lp-pri-size-40'],
11
+ };
@@ -0,0 +1,3 @@
1
+ export declare const letterSpacing: {
2
+ readonly 'lp-pri-font-letterspacing-tight': -2.5;
3
+ };
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.letterSpacing = void 0;
4
+ exports.letterSpacing = {
5
+ 'lp-pri-font-letterspacing-tight': -2.5,
6
+ };
@@ -0,0 +1,21 @@
1
+ export declare const opacity: {
2
+ readonly 'lp-pri-opacity-80': "80%";
3
+ readonly 'lp-pri-opacity-72': "72%";
4
+ readonly 'lp-pri-opacity-64': "64%";
5
+ readonly 'lp-pri-opacity-56': "56%";
6
+ readonly 'lp-pri-opacity-50': "50%";
7
+ readonly 'lp-pri-opacity-48': "48%";
8
+ readonly 'lp-pri-opacity-44': "44%";
9
+ readonly 'lp-pri-opacity-40': "40%";
10
+ readonly 'lp-pri-opacity-36': "36%";
11
+ readonly 'lp-pri-opacity-32': "32%";
12
+ readonly 'lp-pri-opacity-28': "28%";
13
+ readonly 'lp-pri-opacity-24': "24%";
14
+ readonly 'lp-pri-opacity-20': "20%";
15
+ readonly 'lp-pri-opacity-16': "16%";
16
+ readonly 'lp-pri-opacity-12': "12%";
17
+ readonly 'lp-pri-opacity-8': "8%";
18
+ readonly 'lp-pri-opacity-4': "4%";
19
+ readonly 'lp-pri-opacity-1': "1%";
20
+ readonly 'lp-pri-opacity-0': "0%";
21
+ };
@@ -0,0 +1,24 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.opacity = void 0;
4
+ exports.opacity = {
5
+ 'lp-pri-opacity-80': '80%',
6
+ 'lp-pri-opacity-72': '72%',
7
+ 'lp-pri-opacity-64': '64%',
8
+ 'lp-pri-opacity-56': '56%',
9
+ 'lp-pri-opacity-50': '50%',
10
+ 'lp-pri-opacity-48': '48%',
11
+ 'lp-pri-opacity-44': '44%',
12
+ 'lp-pri-opacity-40': '40%',
13
+ 'lp-pri-opacity-36': '36%',
14
+ 'lp-pri-opacity-32': '32%',
15
+ 'lp-pri-opacity-28': '28%',
16
+ 'lp-pri-opacity-24': '24%',
17
+ 'lp-pri-opacity-20': '20%',
18
+ 'lp-pri-opacity-16': '16%',
19
+ 'lp-pri-opacity-12': '12%',
20
+ 'lp-pri-opacity-8': '8%',
21
+ 'lp-pri-opacity-4': '4%',
22
+ 'lp-pri-opacity-1': '1%',
23
+ 'lp-pri-opacity-0': '0%',
24
+ };