@okshaun/components 0.3.1 → 0.3.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +138 -25
- package/dist/index.js +233 -98
- package/dist/index.js.map +1 -1
- package/dist/preset.js +257 -581
- package/dist/preset.js.map +1 -1
- package/dist/size.primitives-j2MFgtrT.js +335 -0
- package/dist/size.primitives-j2MFgtrT.js.map +1 -0
- package/package.json +1 -1
package/dist/preset.js
CHANGED
|
@@ -1,4 +1,260 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { defineSemanticTokens, defineStyles, defineTextStyles, defineGlobalStyles, defineRecipe, defineSlotRecipe, defineTokens, definePreset as definePreset$1 } from "@pandacss/dev";
|
|
2
|
+
import { b as breakpoints$1, a as colors$1, c as containerSizes, n as numericSizes, s as sizes, u as utilitySizes } from "./size.primitives-j2MFgtrT.js";
|
|
3
|
+
const fonts = {
|
|
4
|
+
heading: { value: "'IBM Plex Sans', Geneva, Tahoma, Verdana, sans-serif" },
|
|
5
|
+
sans: { value: "'IBM Plex Sans', Geneva, Tahoma, Verdana, sans-serif" },
|
|
6
|
+
body: {
|
|
7
|
+
value: "'Piazzolla Variable', 'Piazzolla', Georgia, 'Times New Roman', Times, serif"
|
|
8
|
+
},
|
|
9
|
+
serif: {
|
|
10
|
+
value: "'Piazzolla Variable', 'Piazzolla', Georgia, 'Times New Roman', Times, serif"
|
|
11
|
+
},
|
|
12
|
+
mono: {
|
|
13
|
+
value: "'IBM Plex Mono', Andale Mono, monaco, Consolas, Lucida Console, monospace"
|
|
14
|
+
}
|
|
15
|
+
};
|
|
16
|
+
const fontSizes = {
|
|
17
|
+
"12": { value: "0.75rem" },
|
|
18
|
+
"14": { value: "0.875rem" },
|
|
19
|
+
"16": { value: "1rem" },
|
|
20
|
+
"20": { value: "1.25rem" },
|
|
21
|
+
"24": { value: "1.5rem" },
|
|
22
|
+
"32": { value: "2rem" },
|
|
23
|
+
"40": { value: "2.5rem" },
|
|
24
|
+
"48": { value: "3rem" },
|
|
25
|
+
"56": { value: "3.5rem" },
|
|
26
|
+
"64": { value: "4rem" },
|
|
27
|
+
"72": { value: "4.5rem" },
|
|
28
|
+
"80": { value: "5rem" },
|
|
29
|
+
"88": { value: "5.5rem" },
|
|
30
|
+
"96": { value: "6rem" }
|
|
31
|
+
};
|
|
32
|
+
const fontWeights = {
|
|
33
|
+
light: { value: "300" },
|
|
34
|
+
normal: { value: "400" },
|
|
35
|
+
medium: { value: "500" },
|
|
36
|
+
bold: { value: "700" },
|
|
37
|
+
black: { value: "900" }
|
|
38
|
+
};
|
|
39
|
+
const lineHeights = {
|
|
40
|
+
none: {
|
|
41
|
+
value: "1"
|
|
42
|
+
},
|
|
43
|
+
tighter: {
|
|
44
|
+
value: "1em + 0.125rem"
|
|
45
|
+
},
|
|
46
|
+
tight: {
|
|
47
|
+
value: "1em + 0.25rem"
|
|
48
|
+
},
|
|
49
|
+
default: {
|
|
50
|
+
value: "1em + 0.5rem"
|
|
51
|
+
},
|
|
52
|
+
loose: {
|
|
53
|
+
value: "1em + 0.75rem"
|
|
54
|
+
},
|
|
55
|
+
looser: {
|
|
56
|
+
value: "1em + 0.875rem"
|
|
57
|
+
}
|
|
58
|
+
};
|
|
59
|
+
const letterSpacings = {
|
|
60
|
+
tighter: {
|
|
61
|
+
value: "-0.05em"
|
|
62
|
+
},
|
|
63
|
+
tight: {
|
|
64
|
+
value: "-0.025em"
|
|
65
|
+
},
|
|
66
|
+
normal: {
|
|
67
|
+
value: "0em"
|
|
68
|
+
},
|
|
69
|
+
wide: {
|
|
70
|
+
value: "0.025em"
|
|
71
|
+
},
|
|
72
|
+
wider: {
|
|
73
|
+
value: "0.05em"
|
|
74
|
+
},
|
|
75
|
+
widest: {
|
|
76
|
+
value: "0.1em"
|
|
77
|
+
}
|
|
78
|
+
};
|
|
79
|
+
const animations = {
|
|
80
|
+
spin: {
|
|
81
|
+
value: "spin 1s linear infinite"
|
|
82
|
+
},
|
|
83
|
+
ping: {
|
|
84
|
+
value: "ping 1s cubic-bezier(0, 0, 0.2, 1) infinite"
|
|
85
|
+
},
|
|
86
|
+
pulse: {
|
|
87
|
+
value: "pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite"
|
|
88
|
+
},
|
|
89
|
+
bounce: {
|
|
90
|
+
value: "bounce 1s infinite"
|
|
91
|
+
}
|
|
92
|
+
};
|
|
93
|
+
const keyframes$1 = {
|
|
94
|
+
spin: {
|
|
95
|
+
to: {
|
|
96
|
+
transform: "rotate(360deg)"
|
|
97
|
+
}
|
|
98
|
+
},
|
|
99
|
+
ping: {
|
|
100
|
+
"75%, 100%": {
|
|
101
|
+
transform: "scale(2)",
|
|
102
|
+
opacity: "0"
|
|
103
|
+
}
|
|
104
|
+
},
|
|
105
|
+
pulse: {
|
|
106
|
+
"50%": {
|
|
107
|
+
opacity: ".5"
|
|
108
|
+
}
|
|
109
|
+
},
|
|
110
|
+
bounce: {
|
|
111
|
+
"0%, 100%": {
|
|
112
|
+
transform: "translateY(-25%)",
|
|
113
|
+
animationTimingFunction: "cubic-bezier(0.8,0,1,1)"
|
|
114
|
+
},
|
|
115
|
+
"50%": {
|
|
116
|
+
transform: "none",
|
|
117
|
+
animationTimingFunction: "cubic-bezier(0,0,0.2,1)"
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
};
|
|
121
|
+
const easings = {
|
|
122
|
+
default: {
|
|
123
|
+
value: "cubic-bezier(0.4, 0, 0.2, 1)"
|
|
124
|
+
},
|
|
125
|
+
linear: {
|
|
126
|
+
value: "linear"
|
|
127
|
+
},
|
|
128
|
+
in: {
|
|
129
|
+
value: "cubic-bezier(0.4, 0, 1, 1)"
|
|
130
|
+
},
|
|
131
|
+
out: {
|
|
132
|
+
value: "cubic-bezier(0, 0, 0.2, 1)"
|
|
133
|
+
},
|
|
134
|
+
"in-out": {
|
|
135
|
+
value: "cubic-bezier(0.4, 0, 0.2, 1)"
|
|
136
|
+
}
|
|
137
|
+
};
|
|
138
|
+
const durations = {
|
|
139
|
+
fastest: {
|
|
140
|
+
value: "50ms"
|
|
141
|
+
},
|
|
142
|
+
faster: {
|
|
143
|
+
value: "100ms"
|
|
144
|
+
},
|
|
145
|
+
fast: {
|
|
146
|
+
value: "150ms"
|
|
147
|
+
},
|
|
148
|
+
normal: {
|
|
149
|
+
value: "200ms"
|
|
150
|
+
},
|
|
151
|
+
slow: {
|
|
152
|
+
value: "300ms"
|
|
153
|
+
},
|
|
154
|
+
slower: {
|
|
155
|
+
value: "400ms"
|
|
156
|
+
},
|
|
157
|
+
slowest: {
|
|
158
|
+
value: "500ms"
|
|
159
|
+
}
|
|
160
|
+
};
|
|
161
|
+
const radii = {
|
|
162
|
+
"0": { value: "{sizes.0}" },
|
|
163
|
+
"1": { value: "{sizes.1}" },
|
|
164
|
+
"2": { value: "{sizes.2}" },
|
|
165
|
+
"4": { value: "{sizes.4}" },
|
|
166
|
+
"8": { value: "{sizes.8}" },
|
|
167
|
+
"16": { value: "{sizes.16}" },
|
|
168
|
+
"100": { value: "100%" }
|
|
169
|
+
};
|
|
170
|
+
const borderWidths = {
|
|
171
|
+
"0": { value: "{sizes.0}" },
|
|
172
|
+
"1": { value: "{sizes.1}" },
|
|
173
|
+
"2": { value: "{sizes.2}" },
|
|
174
|
+
"4": { value: "{sizes.4}" },
|
|
175
|
+
"8": { value: "{sizes.8}" },
|
|
176
|
+
"16": { value: "{sizes.16}" }
|
|
177
|
+
};
|
|
178
|
+
const shadows = {
|
|
179
|
+
low: {
|
|
180
|
+
value: "0px 1px 1px {colors.utility.shadowColor}, 0px 2px 2px {colors.utility.shadowColor}"
|
|
181
|
+
},
|
|
182
|
+
medium: {
|
|
183
|
+
value: "0px 2px 2px {colors.utility.shadowColor}, 0px 4px 4px {colors.utility.shadowColor}, 0px 8px 8px {colors.utility.shadowColor}"
|
|
184
|
+
},
|
|
185
|
+
high: {
|
|
186
|
+
value: "0px 2px 2px {colors.utility.shadowColor}, 0px 4px 4px {colors.utility.shadowColor}, 0px 8px 8px {colors.utility.shadowColor}, 0px 16px 16px {colors.utility.shadowColor}"
|
|
187
|
+
},
|
|
188
|
+
inset: {
|
|
189
|
+
value: "inset 0px 2px 1px {colors.utility.shadowColor}, inset 0px 3px 2px {colors.utility.shadowColor}"
|
|
190
|
+
}
|
|
191
|
+
};
|
|
192
|
+
const aspectRatios = {
|
|
193
|
+
square: {
|
|
194
|
+
value: "1 / 1"
|
|
195
|
+
},
|
|
196
|
+
landscape: {
|
|
197
|
+
value: "4 / 3"
|
|
198
|
+
},
|
|
199
|
+
portrait: {
|
|
200
|
+
value: "3 / 4"
|
|
201
|
+
},
|
|
202
|
+
wide: {
|
|
203
|
+
value: "16 / 9"
|
|
204
|
+
},
|
|
205
|
+
ultrawide: {
|
|
206
|
+
value: "18 / 5"
|
|
207
|
+
},
|
|
208
|
+
golden: {
|
|
209
|
+
value: "1.618 / 1"
|
|
210
|
+
}
|
|
211
|
+
};
|
|
212
|
+
const blurs = {
|
|
213
|
+
sm: {
|
|
214
|
+
value: "4px"
|
|
215
|
+
},
|
|
216
|
+
base: {
|
|
217
|
+
value: "8px"
|
|
218
|
+
},
|
|
219
|
+
md: {
|
|
220
|
+
value: "12px"
|
|
221
|
+
},
|
|
222
|
+
lg: {
|
|
223
|
+
value: "16px"
|
|
224
|
+
},
|
|
225
|
+
xl: {
|
|
226
|
+
value: "24px"
|
|
227
|
+
},
|
|
228
|
+
"2xl": {
|
|
229
|
+
value: "40px"
|
|
230
|
+
},
|
|
231
|
+
"3xl": {
|
|
232
|
+
value: "64px"
|
|
233
|
+
}
|
|
234
|
+
};
|
|
235
|
+
const tokens = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
236
|
+
__proto__: null,
|
|
237
|
+
animations,
|
|
238
|
+
aspectRatios,
|
|
239
|
+
blurs,
|
|
240
|
+
borderWidths,
|
|
241
|
+
breakpoints: breakpoints$1,
|
|
242
|
+
colors: colors$1,
|
|
243
|
+
containerSizes,
|
|
244
|
+
durations,
|
|
245
|
+
easings,
|
|
246
|
+
fontSizes,
|
|
247
|
+
fontWeights,
|
|
248
|
+
fonts,
|
|
249
|
+
keyframes: keyframes$1,
|
|
250
|
+
letterSpacings,
|
|
251
|
+
lineHeights,
|
|
252
|
+
numericSizes,
|
|
253
|
+
radii,
|
|
254
|
+
shadows,
|
|
255
|
+
sizes,
|
|
256
|
+
utilitySizes
|
|
257
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2
258
|
var conditions$1 = {
|
|
3
259
|
hover: "&:is(:hover, [data-hover])",
|
|
4
260
|
focus: "&:is(:focus, [data-focus])",
|
|
@@ -3242,586 +3498,6 @@ var preset = definePreset({
|
|
|
3242
3498
|
globalCss: globalCss$1
|
|
3243
3499
|
});
|
|
3244
3500
|
var index_default = preset;
|
|
3245
|
-
const colors$1 = defineTokens.colors({
|
|
3246
|
-
transparent: { value: "transparent" },
|
|
3247
|
-
current: { value: "currentColor" },
|
|
3248
|
-
neutral: {
|
|
3249
|
-
"0": { value: "#FFFFFF" },
|
|
3250
|
-
"10": { value: "#F8F8F8" },
|
|
3251
|
-
"20": { value: "#F0F1F2" },
|
|
3252
|
-
"30": { value: "#DDDEE1" },
|
|
3253
|
-
"40": { value: "#B7B9BE" },
|
|
3254
|
-
"50": { value: "#8C8F97" },
|
|
3255
|
-
"60": { value: "#7D818A" },
|
|
3256
|
-
"70": { value: "#6B6E76" },
|
|
3257
|
-
"80": { value: "#505258" },
|
|
3258
|
-
"90": { value: "#3B3D42" },
|
|
3259
|
-
"100": { value: "#292A2E" },
|
|
3260
|
-
"110": { value: "#1E1F21" }
|
|
3261
|
-
},
|
|
3262
|
-
neutralA: {
|
|
3263
|
-
"10": { value: "#17171708" },
|
|
3264
|
-
"20": { value: "#1717170F" },
|
|
3265
|
-
"30": { value: "#17171724" },
|
|
3266
|
-
"40": { value: "#1717174A" },
|
|
3267
|
-
"50": { value: "#17171775" }
|
|
3268
|
-
},
|
|
3269
|
-
darkNeutral: {
|
|
3270
|
-
"0": { value: "#18191A" },
|
|
3271
|
-
"10": { value: "#1F1F21" },
|
|
3272
|
-
"20": { value: "#242528" },
|
|
3273
|
-
"25": { value: "#2B2C2F" },
|
|
3274
|
-
"30": { value: "#303134" },
|
|
3275
|
-
"35": { value: "#3D3F43" },
|
|
3276
|
-
"40": { value: "#4B4D51" },
|
|
3277
|
-
"50": { value: "#63666B" },
|
|
3278
|
-
"60": { value: "#7E8188" },
|
|
3279
|
-
"70": { value: "#96999E" },
|
|
3280
|
-
"80": { value: "#A9ABAF" },
|
|
3281
|
-
"90": { value: "#BFC1C4" },
|
|
3282
|
-
"100": { value: "#CECFD2" },
|
|
3283
|
-
"110": { value: "#E2E3E4" }
|
|
3284
|
-
},
|
|
3285
|
-
darkNeutralA: {
|
|
3286
|
-
"-10": { value: "#01040475" },
|
|
3287
|
-
"10": { value: "#BDBDBD0A" },
|
|
3288
|
-
"20": { value: "#CECED912" },
|
|
3289
|
-
"25": { value: "#D9DAE71A" },
|
|
3290
|
-
"30": { value: "#E3E4F21F" },
|
|
3291
|
-
"35": { value: "#E8EDFD2E" },
|
|
3292
|
-
"40": { value: "#E5E9F640" },
|
|
3293
|
-
"50": { value: "#E9F0FB5C" }
|
|
3294
|
-
},
|
|
3295
|
-
gray: {
|
|
3296
|
-
"10": { value: "#fbfcfd" },
|
|
3297
|
-
"20": { value: "#e0e1e2" },
|
|
3298
|
-
"30": { value: "#c5c5c6" },
|
|
3299
|
-
"40": { value: "#a9aaab" },
|
|
3300
|
-
"50": { value: "#8e8f8f" },
|
|
3301
|
-
"60": { value: "#737374" },
|
|
3302
|
-
"70": { value: "#585858" },
|
|
3303
|
-
"80": { value: "#3c3d3d" },
|
|
3304
|
-
"90": { value: "#212121" },
|
|
3305
|
-
"100": { value: "#060606" }
|
|
3306
|
-
},
|
|
3307
|
-
red: {
|
|
3308
|
-
DEFAULT: { value: "#e2483d" },
|
|
3309
|
-
"10": { value: "#ffeceb" },
|
|
3310
|
-
"20": { value: "#ffd5d2" },
|
|
3311
|
-
"30": { value: "#fd9891" },
|
|
3312
|
-
"40": { value: "#f87168" },
|
|
3313
|
-
"50": { value: "#f15b50" },
|
|
3314
|
-
"60": { value: "#e2483d" },
|
|
3315
|
-
"70": { value: "#c9372c" },
|
|
3316
|
-
"80": { value: "#ae2e24" },
|
|
3317
|
-
"90": { value: "#5d1f1a" },
|
|
3318
|
-
"100": { value: "#42221f" }
|
|
3319
|
-
},
|
|
3320
|
-
orange: {
|
|
3321
|
-
DEFAULT: { value: "#e06c00" },
|
|
3322
|
-
"10": { value: "#fff5db" },
|
|
3323
|
-
"20": { value: "#fce4a6" },
|
|
3324
|
-
"30": { value: "#fbc828" },
|
|
3325
|
-
"40": { value: "#fca700" },
|
|
3326
|
-
"50": { value: "#f68909" },
|
|
3327
|
-
"60": { value: "#e06c00" },
|
|
3328
|
-
"70": { value: "#bd5b00" },
|
|
3329
|
-
"80": { value: "#9e4c00" },
|
|
3330
|
-
"90": { value: "#693200" },
|
|
3331
|
-
"100": { value: "#3a2c1f" }
|
|
3332
|
-
},
|
|
3333
|
-
yellow: {
|
|
3334
|
-
DEFAULT: { value: "#e5b00a" },
|
|
3335
|
-
"10": { value: "#fefbf3" },
|
|
3336
|
-
"20": { value: "#f9ecc4" },
|
|
3337
|
-
"30": { value: "#f4dd96" },
|
|
3338
|
-
"40": { value: "#efce67" },
|
|
3339
|
-
"50": { value: "#eabf39" },
|
|
3340
|
-
"60": { value: "#e5b00a" },
|
|
3341
|
-
"70": { value: "#b68e0f" },
|
|
3342
|
-
"80": { value: "#886c14" },
|
|
3343
|
-
"90": { value: "#594918" },
|
|
3344
|
-
"100": { value: "#2a271d" }
|
|
3345
|
-
},
|
|
3346
|
-
lime: {
|
|
3347
|
-
DEFAULT: { value: "#6a9a23" },
|
|
3348
|
-
"10": { value: "#efffd6" },
|
|
3349
|
-
"20": { value: "#d3f1a7" },
|
|
3350
|
-
"30": { value: "#b3df72" },
|
|
3351
|
-
"40": { value: "#94c748" },
|
|
3352
|
-
"50": { value: "#82b536" },
|
|
3353
|
-
"60": { value: "#6a9a23" },
|
|
3354
|
-
"70": { value: "#5b7f24" },
|
|
3355
|
-
"80": { value: "#4c6b1f" },
|
|
3356
|
-
"90": { value: "#37471f" },
|
|
3357
|
-
"100": { value: "#28311b" }
|
|
3358
|
-
},
|
|
3359
|
-
green: {
|
|
3360
|
-
DEFAULT: { value: "#22a06b" },
|
|
3361
|
-
"10": { value: "#dcfff1" },
|
|
3362
|
-
"20": { value: "#baf3db" },
|
|
3363
|
-
"30": { value: "#7ee2b8" },
|
|
3364
|
-
"40": { value: "#4bce97" },
|
|
3365
|
-
"50": { value: "#2abb7f" },
|
|
3366
|
-
"60": { value: "#22a06b" },
|
|
3367
|
-
"70": { value: "#1f845a" },
|
|
3368
|
-
"80": { value: "#216e4e" },
|
|
3369
|
-
"90": { value: "#164b35" },
|
|
3370
|
-
"100": { value: "#1c3329" }
|
|
3371
|
-
},
|
|
3372
|
-
teal: {
|
|
3373
|
-
DEFAULT: { value: "#2898bd" },
|
|
3374
|
-
"10": { value: "#e7f9ff" },
|
|
3375
|
-
"20": { value: "#c6edfb" },
|
|
3376
|
-
"30": { value: "#9dd9ee" },
|
|
3377
|
-
"40": { value: "#6cc3e0" },
|
|
3378
|
-
"50": { value: "#42b2d7" },
|
|
3379
|
-
"60": { value: "#2898bd" },
|
|
3380
|
-
"70": { value: "#227d9b" },
|
|
3381
|
-
"80": { value: "#206a83" },
|
|
3382
|
-
"90": { value: "#164555" },
|
|
3383
|
-
"100": { value: "#1e3137" }
|
|
3384
|
-
},
|
|
3385
|
-
blue: {
|
|
3386
|
-
DEFAULT: { value: "#357de8" },
|
|
3387
|
-
"10": { value: "#e9f2fe" },
|
|
3388
|
-
"20": { value: "#cfe1fd" },
|
|
3389
|
-
"30": { value: "#8fb8f6" },
|
|
3390
|
-
"40": { value: "#669df1" },
|
|
3391
|
-
"50": { value: "#4688ec" },
|
|
3392
|
-
"60": { value: "#357de8" },
|
|
3393
|
-
"70": { value: "#1868db" },
|
|
3394
|
-
"80": { value: "#1558bc" },
|
|
3395
|
-
"90": { value: "#123263" },
|
|
3396
|
-
"100": { value: "#1c2b42" }
|
|
3397
|
-
},
|
|
3398
|
-
indigo: {
|
|
3399
|
-
DEFAULT: { value: "#7665d1" },
|
|
3400
|
-
"10": { value: "#f1eff7" },
|
|
3401
|
-
"20": { value: "#e7e3fa" },
|
|
3402
|
-
"30": { value: "#cbc4f2" },
|
|
3403
|
-
"40": { value: "#afa5e8" },
|
|
3404
|
-
"50": { value: "#9287d8" },
|
|
3405
|
-
"60": { value: "#7665d1" },
|
|
3406
|
-
"70": { value: "#5e519e" },
|
|
3407
|
-
"80": { value: "#453c7b" },
|
|
3408
|
-
"90": { value: "#2e2c40" },
|
|
3409
|
-
"100": { value: "#18161d" }
|
|
3410
|
-
},
|
|
3411
|
-
purple: {
|
|
3412
|
-
DEFAULT: { value: "#af59e1" },
|
|
3413
|
-
"10": { value: "#f8eefe" },
|
|
3414
|
-
"20": { value: "#eed7fc" },
|
|
3415
|
-
"30": { value: "#d8a0f7" },
|
|
3416
|
-
"40": { value: "#c97cf4" },
|
|
3417
|
-
"50": { value: "#bf63f3" },
|
|
3418
|
-
"60": { value: "#af59e1" },
|
|
3419
|
-
"70": { value: "#964ac0" },
|
|
3420
|
-
"80": { value: "#803fa5" },
|
|
3421
|
-
"90": { value: "#48245d" },
|
|
3422
|
-
"100": { value: "#35243f" }
|
|
3423
|
-
},
|
|
3424
|
-
magenta: {
|
|
3425
|
-
DEFAULT: { value: "#cd519d" },
|
|
3426
|
-
"10": { value: "#ffecf8" },
|
|
3427
|
-
"20": { value: "#fdd0ec" },
|
|
3428
|
-
"30": { value: "#f797d2" },
|
|
3429
|
-
"40": { value: "#e774bb" },
|
|
3430
|
-
"50": { value: "#da62ac" },
|
|
3431
|
-
"60": { value: "#cd519d" },
|
|
3432
|
-
"70": { value: "#ae4787" },
|
|
3433
|
-
"80": { value: "#943d73" },
|
|
3434
|
-
"90": { value: "#50253f" },
|
|
3435
|
-
"100": { value: "#3d2232" }
|
|
3436
|
-
},
|
|
3437
|
-
tan: {
|
|
3438
|
-
DEFAULT: { value: "#8e704f" },
|
|
3439
|
-
"10": { value: "#f5f0e6" },
|
|
3440
|
-
"20": { value: "#f1e5cd" },
|
|
3441
|
-
"30": { value: "#dec69a" },
|
|
3442
|
-
"40": { value: "#c7a97b" },
|
|
3443
|
-
"50": { value: "#ad8b65" },
|
|
3444
|
-
"60": { value: "#8e704f" },
|
|
3445
|
-
"70": { value: "#6b5947" },
|
|
3446
|
-
"80": { value: "#4d4438" },
|
|
3447
|
-
"90": { value: "#322d26" },
|
|
3448
|
-
"100": { value: "#191714" }
|
|
3449
|
-
},
|
|
3450
|
-
slate: {
|
|
3451
|
-
"0": { value: "#FFFFFF" },
|
|
3452
|
-
"1": { value: "#FAFAFA" },
|
|
3453
|
-
"2": { value: "#F9F8F6" },
|
|
3454
|
-
"3": { value: "#F7F5F3" },
|
|
3455
|
-
"4": { value: "#F6F3EF" },
|
|
3456
|
-
"5": { value: "#F4F0EB" },
|
|
3457
|
-
"10": { value: "#E3E1DE" },
|
|
3458
|
-
"20": { value: "#CBCAC8" },
|
|
3459
|
-
"30": { value: "#AFADAB" },
|
|
3460
|
-
"40": { value: "#939190" },
|
|
3461
|
-
"50": { value: "#767675" },
|
|
3462
|
-
"60": { value: "#5F5F5E" },
|
|
3463
|
-
"70": { value: "#474747" },
|
|
3464
|
-
"80": { value: "#2E2E2E" },
|
|
3465
|
-
"90": { value: "#1E1E1E" },
|
|
3466
|
-
"100": { value: "#000000" }
|
|
3467
|
-
}
|
|
3468
|
-
});
|
|
3469
|
-
const numericSizes = {
|
|
3470
|
-
"0": { value: "0" },
|
|
3471
|
-
"1": { value: "0.0625rem" },
|
|
3472
|
-
"2": { value: "0.125rem" },
|
|
3473
|
-
"3": { value: "0.1875rem" },
|
|
3474
|
-
"4": { value: "0.25rem" },
|
|
3475
|
-
"5": { value: "0.3125rem" },
|
|
3476
|
-
"6": { value: "0.375rem" },
|
|
3477
|
-
"7": { value: "0.4375rem" },
|
|
3478
|
-
"8": { value: "0.5rem" },
|
|
3479
|
-
"9": { value: "0.5625rem" },
|
|
3480
|
-
"10": { value: "0.625rem" },
|
|
3481
|
-
"12": { value: "0.75rem" },
|
|
3482
|
-
"14": { value: "0.875rem" },
|
|
3483
|
-
"16": { value: "1rem" },
|
|
3484
|
-
"20": { value: "1.25rem" },
|
|
3485
|
-
"22": { value: "1.375rem" },
|
|
3486
|
-
"24": { value: "1.5rem" },
|
|
3487
|
-
"32": { value: "2rem" },
|
|
3488
|
-
"40": { value: "2.5rem" },
|
|
3489
|
-
"48": { value: "3rem" },
|
|
3490
|
-
"56": { value: "3.5rem" },
|
|
3491
|
-
"64": { value: "4rem" },
|
|
3492
|
-
"72": { value: "4.5rem" },
|
|
3493
|
-
"80": { value: "5rem" },
|
|
3494
|
-
"88": { value: "5.5rem" },
|
|
3495
|
-
"96": { value: "6rem" },
|
|
3496
|
-
"104": { value: "6.5rem" },
|
|
3497
|
-
"112": { value: "7rem" },
|
|
3498
|
-
"120": { value: "7.5rem" },
|
|
3499
|
-
"128": { value: "8rem" },
|
|
3500
|
-
"136": { value: "8.5rem" },
|
|
3501
|
-
"144": { value: "9rem" },
|
|
3502
|
-
"152": { value: "9.5rem" },
|
|
3503
|
-
"160": { value: "10rem" },
|
|
3504
|
-
"168": { value: "10.5rem" },
|
|
3505
|
-
"176": { value: "11rem" },
|
|
3506
|
-
"184": { value: "11.5rem" },
|
|
3507
|
-
"192": { value: "12rem" },
|
|
3508
|
-
"200": { value: "12.5rem" },
|
|
3509
|
-
"208": { value: "13rem" },
|
|
3510
|
-
"216": { value: "13.5rem" },
|
|
3511
|
-
"224": { value: "14rem" },
|
|
3512
|
-
"232": { value: "14.5rem" },
|
|
3513
|
-
"240": { value: "15rem" },
|
|
3514
|
-
"248": { value: "15.5rem" },
|
|
3515
|
-
"256": { value: "16rem" },
|
|
3516
|
-
"264": { value: "16.5rem" },
|
|
3517
|
-
"272": { value: "17rem" },
|
|
3518
|
-
"280": { value: "17.5rem" }
|
|
3519
|
-
};
|
|
3520
|
-
const containerSizes = {
|
|
3521
|
-
"2xs": { value: "16rem" },
|
|
3522
|
-
// 256px
|
|
3523
|
-
xs: { value: "20rem" },
|
|
3524
|
-
// 320px
|
|
3525
|
-
sm: { value: "24rem" },
|
|
3526
|
-
// 384px
|
|
3527
|
-
md: { value: "28rem" },
|
|
3528
|
-
// 448px
|
|
3529
|
-
lg: { value: "32rem" },
|
|
3530
|
-
// 512px
|
|
3531
|
-
xl: { value: "36rem" },
|
|
3532
|
-
// 576px
|
|
3533
|
-
"2xl": { value: "42rem" },
|
|
3534
|
-
// 672px
|
|
3535
|
-
"3xl": { value: "48rem" },
|
|
3536
|
-
// 768px
|
|
3537
|
-
"4xl": { value: "56rem" },
|
|
3538
|
-
// 896px
|
|
3539
|
-
"5xl": { value: "64rem" },
|
|
3540
|
-
// 1024px
|
|
3541
|
-
"6xl": { value: "72rem" },
|
|
3542
|
-
// 1152px
|
|
3543
|
-
"7xl": { value: "80rem" },
|
|
3544
|
-
// 1280px
|
|
3545
|
-
"8xl": { value: "90rem" }
|
|
3546
|
-
// 1440px
|
|
3547
|
-
};
|
|
3548
|
-
const utilitySizes = {
|
|
3549
|
-
full: { value: "100%" },
|
|
3550
|
-
half: { value: "50%" },
|
|
3551
|
-
min: { value: "min-content" },
|
|
3552
|
-
max: { value: "max-content" },
|
|
3553
|
-
fit: { value: "fit-content" },
|
|
3554
|
-
prose: { value: "65ch" },
|
|
3555
|
-
auto: { value: "auto" }
|
|
3556
|
-
};
|
|
3557
|
-
const sizes = {
|
|
3558
|
-
...numericSizes,
|
|
3559
|
-
...containerSizes,
|
|
3560
|
-
...utilitySizes
|
|
3561
|
-
};
|
|
3562
|
-
const breakpoints$1 = {
|
|
3563
|
-
xs: "480px",
|
|
3564
|
-
sm: "640px",
|
|
3565
|
-
md: "768px",
|
|
3566
|
-
lg: "1024px",
|
|
3567
|
-
xl: "1280px",
|
|
3568
|
-
"2xl": "1536px"
|
|
3569
|
-
};
|
|
3570
|
-
const fonts = {
|
|
3571
|
-
heading: { value: "'IBM Plex Sans', Geneva, Tahoma, Verdana, sans-serif" },
|
|
3572
|
-
sans: { value: "'IBM Plex Sans', Geneva, Tahoma, Verdana, sans-serif" },
|
|
3573
|
-
body: {
|
|
3574
|
-
value: "'Piazzolla Variable', 'Piazzolla', Georgia, 'Times New Roman', Times, serif"
|
|
3575
|
-
},
|
|
3576
|
-
serif: {
|
|
3577
|
-
value: "'Piazzolla Variable', 'Piazzolla', Georgia, 'Times New Roman', Times, serif"
|
|
3578
|
-
},
|
|
3579
|
-
mono: {
|
|
3580
|
-
value: "'IBM Plex Mono', Andale Mono, monaco, Consolas, Lucida Console, monospace"
|
|
3581
|
-
}
|
|
3582
|
-
};
|
|
3583
|
-
const fontSizes = {
|
|
3584
|
-
"12": { value: "0.75rem" },
|
|
3585
|
-
"14": { value: "0.875rem" },
|
|
3586
|
-
"16": { value: "1rem" },
|
|
3587
|
-
"20": { value: "1.25rem" },
|
|
3588
|
-
"24": { value: "1.5rem" },
|
|
3589
|
-
"32": { value: "2rem" },
|
|
3590
|
-
"40": { value: "2.5rem" },
|
|
3591
|
-
"48": { value: "3rem" },
|
|
3592
|
-
"56": { value: "3.5rem" },
|
|
3593
|
-
"64": { value: "4rem" },
|
|
3594
|
-
"72": { value: "4.5rem" },
|
|
3595
|
-
"80": { value: "5rem" },
|
|
3596
|
-
"88": { value: "5.5rem" },
|
|
3597
|
-
"96": { value: "6rem" }
|
|
3598
|
-
};
|
|
3599
|
-
const fontWeights = {
|
|
3600
|
-
light: { value: "300" },
|
|
3601
|
-
normal: { value: "400" },
|
|
3602
|
-
medium: { value: "500" },
|
|
3603
|
-
bold: { value: "700" },
|
|
3604
|
-
black: { value: "900" }
|
|
3605
|
-
};
|
|
3606
|
-
const lineHeights = {
|
|
3607
|
-
none: {
|
|
3608
|
-
value: "1"
|
|
3609
|
-
},
|
|
3610
|
-
tighter: {
|
|
3611
|
-
value: "1em + 0.125rem"
|
|
3612
|
-
},
|
|
3613
|
-
tight: {
|
|
3614
|
-
value: "1em + 0.25rem"
|
|
3615
|
-
},
|
|
3616
|
-
default: {
|
|
3617
|
-
value: "1em + 0.5rem"
|
|
3618
|
-
},
|
|
3619
|
-
loose: {
|
|
3620
|
-
value: "1em + 0.75rem"
|
|
3621
|
-
},
|
|
3622
|
-
looser: {
|
|
3623
|
-
value: "1em + 0.875rem"
|
|
3624
|
-
}
|
|
3625
|
-
};
|
|
3626
|
-
const letterSpacings = {
|
|
3627
|
-
tighter: {
|
|
3628
|
-
value: "-0.05em"
|
|
3629
|
-
},
|
|
3630
|
-
tight: {
|
|
3631
|
-
value: "-0.025em"
|
|
3632
|
-
},
|
|
3633
|
-
normal: {
|
|
3634
|
-
value: "0em"
|
|
3635
|
-
},
|
|
3636
|
-
wide: {
|
|
3637
|
-
value: "0.025em"
|
|
3638
|
-
},
|
|
3639
|
-
wider: {
|
|
3640
|
-
value: "0.05em"
|
|
3641
|
-
},
|
|
3642
|
-
widest: {
|
|
3643
|
-
value: "0.1em"
|
|
3644
|
-
}
|
|
3645
|
-
};
|
|
3646
|
-
const animations = {
|
|
3647
|
-
spin: {
|
|
3648
|
-
value: "spin 1s linear infinite"
|
|
3649
|
-
},
|
|
3650
|
-
ping: {
|
|
3651
|
-
value: "ping 1s cubic-bezier(0, 0, 0.2, 1) infinite"
|
|
3652
|
-
},
|
|
3653
|
-
pulse: {
|
|
3654
|
-
value: "pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite"
|
|
3655
|
-
},
|
|
3656
|
-
bounce: {
|
|
3657
|
-
value: "bounce 1s infinite"
|
|
3658
|
-
}
|
|
3659
|
-
};
|
|
3660
|
-
const keyframes$1 = {
|
|
3661
|
-
spin: {
|
|
3662
|
-
to: {
|
|
3663
|
-
transform: "rotate(360deg)"
|
|
3664
|
-
}
|
|
3665
|
-
},
|
|
3666
|
-
ping: {
|
|
3667
|
-
"75%, 100%": {
|
|
3668
|
-
transform: "scale(2)",
|
|
3669
|
-
opacity: "0"
|
|
3670
|
-
}
|
|
3671
|
-
},
|
|
3672
|
-
pulse: {
|
|
3673
|
-
"50%": {
|
|
3674
|
-
opacity: ".5"
|
|
3675
|
-
}
|
|
3676
|
-
},
|
|
3677
|
-
bounce: {
|
|
3678
|
-
"0%, 100%": {
|
|
3679
|
-
transform: "translateY(-25%)",
|
|
3680
|
-
animationTimingFunction: "cubic-bezier(0.8,0,1,1)"
|
|
3681
|
-
},
|
|
3682
|
-
"50%": {
|
|
3683
|
-
transform: "none",
|
|
3684
|
-
animationTimingFunction: "cubic-bezier(0,0,0.2,1)"
|
|
3685
|
-
}
|
|
3686
|
-
}
|
|
3687
|
-
};
|
|
3688
|
-
const easings = {
|
|
3689
|
-
default: {
|
|
3690
|
-
value: "cubic-bezier(0.4, 0, 0.2, 1)"
|
|
3691
|
-
},
|
|
3692
|
-
linear: {
|
|
3693
|
-
value: "linear"
|
|
3694
|
-
},
|
|
3695
|
-
in: {
|
|
3696
|
-
value: "cubic-bezier(0.4, 0, 1, 1)"
|
|
3697
|
-
},
|
|
3698
|
-
out: {
|
|
3699
|
-
value: "cubic-bezier(0, 0, 0.2, 1)"
|
|
3700
|
-
},
|
|
3701
|
-
"in-out": {
|
|
3702
|
-
value: "cubic-bezier(0.4, 0, 0.2, 1)"
|
|
3703
|
-
}
|
|
3704
|
-
};
|
|
3705
|
-
const durations = {
|
|
3706
|
-
fastest: {
|
|
3707
|
-
value: "50ms"
|
|
3708
|
-
},
|
|
3709
|
-
faster: {
|
|
3710
|
-
value: "100ms"
|
|
3711
|
-
},
|
|
3712
|
-
fast: {
|
|
3713
|
-
value: "150ms"
|
|
3714
|
-
},
|
|
3715
|
-
normal: {
|
|
3716
|
-
value: "200ms"
|
|
3717
|
-
},
|
|
3718
|
-
slow: {
|
|
3719
|
-
value: "300ms"
|
|
3720
|
-
},
|
|
3721
|
-
slower: {
|
|
3722
|
-
value: "400ms"
|
|
3723
|
-
},
|
|
3724
|
-
slowest: {
|
|
3725
|
-
value: "500ms"
|
|
3726
|
-
}
|
|
3727
|
-
};
|
|
3728
|
-
const radii = {
|
|
3729
|
-
"0": { value: "{sizes.0}" },
|
|
3730
|
-
"1": { value: "{sizes.1}" },
|
|
3731
|
-
"2": { value: "{sizes.2}" },
|
|
3732
|
-
"4": { value: "{sizes.4}" },
|
|
3733
|
-
"8": { value: "{sizes.8}" },
|
|
3734
|
-
"16": { value: "{sizes.16}" },
|
|
3735
|
-
"100": { value: "100%" }
|
|
3736
|
-
};
|
|
3737
|
-
const borderWidths = {
|
|
3738
|
-
"0": { value: "{sizes.0}" },
|
|
3739
|
-
"1": { value: "{sizes.1}" },
|
|
3740
|
-
"2": { value: "{sizes.2}" },
|
|
3741
|
-
"4": { value: "{sizes.4}" },
|
|
3742
|
-
"8": { value: "{sizes.8}" },
|
|
3743
|
-
"16": { value: "{sizes.16}" }
|
|
3744
|
-
};
|
|
3745
|
-
const shadows = {
|
|
3746
|
-
low: {
|
|
3747
|
-
value: "0px 1px 1px {colors.utility.shadowColor}, 0px 2px 2px {colors.utility.shadowColor}"
|
|
3748
|
-
},
|
|
3749
|
-
medium: {
|
|
3750
|
-
value: "0px 2px 2px {colors.utility.shadowColor}, 0px 4px 4px {colors.utility.shadowColor}, 0px 8px 8px {colors.utility.shadowColor}"
|
|
3751
|
-
},
|
|
3752
|
-
high: {
|
|
3753
|
-
value: "0px 2px 2px {colors.utility.shadowColor}, 0px 4px 4px {colors.utility.shadowColor}, 0px 8px 8px {colors.utility.shadowColor}, 0px 16px 16px {colors.utility.shadowColor}"
|
|
3754
|
-
},
|
|
3755
|
-
inset: {
|
|
3756
|
-
value: "inset 0px 2px 1px {colors.utility.shadowColor}, inset 0px 3px 2px {colors.utility.shadowColor}"
|
|
3757
|
-
}
|
|
3758
|
-
};
|
|
3759
|
-
const aspectRatios = {
|
|
3760
|
-
square: {
|
|
3761
|
-
value: "1 / 1"
|
|
3762
|
-
},
|
|
3763
|
-
landscape: {
|
|
3764
|
-
value: "4 / 3"
|
|
3765
|
-
},
|
|
3766
|
-
portrait: {
|
|
3767
|
-
value: "3 / 4"
|
|
3768
|
-
},
|
|
3769
|
-
wide: {
|
|
3770
|
-
value: "16 / 9"
|
|
3771
|
-
},
|
|
3772
|
-
ultrawide: {
|
|
3773
|
-
value: "18 / 5"
|
|
3774
|
-
},
|
|
3775
|
-
golden: {
|
|
3776
|
-
value: "1.618 / 1"
|
|
3777
|
-
}
|
|
3778
|
-
};
|
|
3779
|
-
const blurs = {
|
|
3780
|
-
sm: {
|
|
3781
|
-
value: "4px"
|
|
3782
|
-
},
|
|
3783
|
-
base: {
|
|
3784
|
-
value: "8px"
|
|
3785
|
-
},
|
|
3786
|
-
md: {
|
|
3787
|
-
value: "12px"
|
|
3788
|
-
},
|
|
3789
|
-
lg: {
|
|
3790
|
-
value: "16px"
|
|
3791
|
-
},
|
|
3792
|
-
xl: {
|
|
3793
|
-
value: "24px"
|
|
3794
|
-
},
|
|
3795
|
-
"2xl": {
|
|
3796
|
-
value: "40px"
|
|
3797
|
-
},
|
|
3798
|
-
"3xl": {
|
|
3799
|
-
value: "64px"
|
|
3800
|
-
}
|
|
3801
|
-
};
|
|
3802
|
-
const tokens = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
3803
|
-
__proto__: null,
|
|
3804
|
-
animations,
|
|
3805
|
-
aspectRatios,
|
|
3806
|
-
blurs,
|
|
3807
|
-
borderWidths,
|
|
3808
|
-
breakpoints: breakpoints$1,
|
|
3809
|
-
colors: colors$1,
|
|
3810
|
-
containerSizes,
|
|
3811
|
-
durations,
|
|
3812
|
-
easings,
|
|
3813
|
-
fontSizes,
|
|
3814
|
-
fontWeights,
|
|
3815
|
-
fonts,
|
|
3816
|
-
keyframes: keyframes$1,
|
|
3817
|
-
letterSpacings,
|
|
3818
|
-
lineHeights,
|
|
3819
|
-
numericSizes,
|
|
3820
|
-
radii,
|
|
3821
|
-
shadows,
|
|
3822
|
-
sizes,
|
|
3823
|
-
utilitySizes
|
|
3824
|
-
}, Symbol.toStringTag, { value: "Module" }));
|
|
3825
3501
|
const BRAND_PALETTE = "gray";
|
|
3826
3502
|
const brandPalette = (shade) => `{colors.${BRAND_PALETTE}.${shade}}`;
|
|
3827
3503
|
const colors = defineSemanticTokens.colors({
|