@charcoal-ui/tailwind-config 4.0.0-beta.8 → 4.0.0-rc.1
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/README.md +1 -1
- package/dist/_lib/TailwindBuild.d.ts.map +1 -1
- package/dist/colors/plugin.d.ts +3 -2
- package/dist/colors/plugin.d.ts.map +1 -1
- package/dist/colors/pluginTokenV1.d.ts +32 -0
- package/dist/colors/pluginTokenV1.d.ts.map +1 -0
- package/dist/index.cjs.js +194 -45
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +5 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.esm.js +187 -33
- package/dist/index.esm.js.map +1 -1
- package/dist/tokenV2.d.ts +3 -0
- package/dist/tokenV2.d.ts.map +1 -0
- package/dist/tokenV2.test.d.ts +2 -0
- package/dist/tokenV2.test.d.ts.map +1 -0
- package/dist/util.d.ts +4 -0
- package/dist/util.d.ts.map +1 -1
- package/package.json +10 -7
- package/src/Custom.mdx +122 -0
- package/src/README.mdx +61 -0
- package/src/__snapshots__/index.test.ts.snap +373 -5
- package/src/__snapshots__/tokenV2.test.ts.snap +6082 -0
- package/src/_lib/TailwindBuild.ts +3 -4
- package/src/colors/plugin.ts +17 -6
- package/src/colors/pluginTokenV1.ts +99 -0
- package/src/docs/colors/__snapshots__/TextBgColor.story.storyshot +1 -1
- package/src/index.test.ts +4 -0
- package/src/index.ts +47 -8
- package/src/tokenV2.test.ts +21 -0
- package/src/tokenV2.ts +72 -0
- package/src/util.ts +29 -0
package/dist/index.esm.js
CHANGED
|
@@ -64,6 +64,27 @@ Got: ${JSON.stringify(Array.from(effectKeys))}`);
|
|
|
64
64
|
function camelToKebab(value) {
|
|
65
65
|
return value.replace(/(?<small>[\da-z]|(?=[A-Z]))(?<capital>[A-Z])/gu, "$1-$2").toLowerCase();
|
|
66
66
|
}
|
|
67
|
+
var mapDefaultKey = (o) => {
|
|
68
|
+
return JSON.parse(JSON.stringify(o), function reviver(k, v) {
|
|
69
|
+
if (k === "default") {
|
|
70
|
+
const DefaultKey = getDefaultKeyName("v3");
|
|
71
|
+
this[DefaultKey] = v;
|
|
72
|
+
return void 0;
|
|
73
|
+
}
|
|
74
|
+
return v;
|
|
75
|
+
});
|
|
76
|
+
};
|
|
77
|
+
var flattenKey = (o, join) => {
|
|
78
|
+
return Object.fromEntries(
|
|
79
|
+
Object.entries(o).flatMap(([key, v]) => {
|
|
80
|
+
if (typeof v === "string")
|
|
81
|
+
return [[key, v]];
|
|
82
|
+
return Object.entries(v).map(([kk, vv]) => {
|
|
83
|
+
return [join?.(key) ?? true ? [key, kk].join("-") : kk, vv];
|
|
84
|
+
});
|
|
85
|
+
})
|
|
86
|
+
);
|
|
87
|
+
};
|
|
67
88
|
|
|
68
89
|
// src/index.ts
|
|
69
90
|
import {
|
|
@@ -72,8 +93,8 @@ import {
|
|
|
72
93
|
SPACING,
|
|
73
94
|
BORDER_RADIUS
|
|
74
95
|
} from "@charcoal-ui/foundation";
|
|
75
|
-
import { light } from "@charcoal-ui/theme";
|
|
76
|
-
import { mapObject as
|
|
96
|
+
import { light as light2 } from "@charcoal-ui/theme";
|
|
97
|
+
import { mapObject as mapObject6, px as px2 } from "@charcoal-ui/utils";
|
|
77
98
|
|
|
78
99
|
// src/colors/toTailwindConfig.ts
|
|
79
100
|
import { applyEffect, filterObject, mapObject } from "@charcoal-ui/utils";
|
|
@@ -105,24 +126,79 @@ function colorsToTailwindConfig(version, colors, effects) {
|
|
|
105
126
|
}
|
|
106
127
|
|
|
107
128
|
// src/colors/plugin.ts
|
|
129
|
+
import {
|
|
130
|
+
applyEffect as applyEffect3,
|
|
131
|
+
filterObject as filterObject3,
|
|
132
|
+
flatMapObject as flatMapObject2,
|
|
133
|
+
mapObject as mapObject3
|
|
134
|
+
} from "@charcoal-ui/utils";
|
|
135
|
+
import plugin from "tailwindcss/plugin";
|
|
136
|
+
|
|
137
|
+
// src/colors/pluginTokenV1.ts
|
|
108
138
|
import {
|
|
109
139
|
applyEffect as applyEffect2,
|
|
140
|
+
customPropertyToken,
|
|
110
141
|
filterObject as filterObject2,
|
|
111
142
|
flatMapObject,
|
|
112
143
|
mapObject as mapObject2
|
|
113
144
|
} from "@charcoal-ui/utils";
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
145
|
+
function defineCssVariablesV1(themeMap) {
|
|
146
|
+
return mapObject2(themeMap, (key, theme) => {
|
|
147
|
+
if (key.startsWith("@media")) {
|
|
148
|
+
return [
|
|
149
|
+
key,
|
|
150
|
+
{
|
|
151
|
+
":root": defineColorVariableCSS(theme)
|
|
152
|
+
}
|
|
153
|
+
];
|
|
154
|
+
} else {
|
|
155
|
+
return [key, defineColorVariableCSS(theme)];
|
|
156
|
+
}
|
|
157
|
+
});
|
|
158
|
+
}
|
|
159
|
+
var defineColorVariableCSS = (theme) => {
|
|
160
|
+
const borders = mapObject2(theme.border, (name, { color }) => [
|
|
161
|
+
withPrefixes("border", name),
|
|
162
|
+
color
|
|
163
|
+
]);
|
|
164
|
+
const colors = defineThemeVariables({ ...theme.color, ...borders })({ theme });
|
|
165
|
+
return colors;
|
|
166
|
+
};
|
|
167
|
+
var isPresent = (value) => value != null;
|
|
168
|
+
function defineThemeVariables(colorParams, effectParams) {
|
|
169
|
+
return function toCssObject(props) {
|
|
170
|
+
const colors = filterObject2(colorParams, isPresent);
|
|
171
|
+
const effects = Object.entries({
|
|
172
|
+
...props.theme.effect,
|
|
173
|
+
...effectParams
|
|
174
|
+
});
|
|
175
|
+
return flatMapObject(colors, (colorKey, color) => [
|
|
176
|
+
[customPropertyToken(colorKey), color],
|
|
177
|
+
...effects.map(([effectKey, effect]) => [
|
|
178
|
+
customPropertyToken(colorKey, [effectKey]),
|
|
179
|
+
applyEffect2(color, [effect])
|
|
180
|
+
])
|
|
181
|
+
]);
|
|
182
|
+
};
|
|
183
|
+
}
|
|
184
|
+
function withPrefixes(...parts) {
|
|
185
|
+
return parts.join("-");
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
// src/colors/plugin.ts
|
|
189
|
+
function cssVariableColorPlugin(themeMap, cssVariablesV1) {
|
|
190
|
+
const { ":root": _defaultTheme, ...otherThemes } = themeMap;
|
|
191
|
+
const definitions = defineCssVariables(otherThemes);
|
|
120
192
|
return plugin(({ addBase }) => {
|
|
121
193
|
addBase(definitions);
|
|
194
|
+
if (cssVariablesV1) {
|
|
195
|
+
const cssVariablesV12 = defineCssVariablesV1(themeMap);
|
|
196
|
+
addBase(cssVariablesV12);
|
|
197
|
+
}
|
|
122
198
|
});
|
|
123
199
|
}
|
|
124
200
|
function defineCssVariables(themes) {
|
|
125
|
-
return
|
|
201
|
+
return mapObject3(themes, (selectorOrMediaQuery, theme) => {
|
|
126
202
|
const css = toCssVariables(theme);
|
|
127
203
|
if (selectorOrMediaQuery.startsWith("@media")) {
|
|
128
204
|
return [
|
|
@@ -137,15 +213,15 @@ function defineCssVariables(themes) {
|
|
|
137
213
|
});
|
|
138
214
|
}
|
|
139
215
|
function toCssVariables(theme) {
|
|
140
|
-
const colors =
|
|
216
|
+
const colors = filterObject3(theme.color, isSingleColor);
|
|
141
217
|
const effects = Object.entries(mergeEffect(theme));
|
|
142
|
-
return
|
|
218
|
+
return flatMapObject2(colors, (name, color) => {
|
|
143
219
|
const varName = `${COLOR_PREFIX}${name}`;
|
|
144
220
|
return [
|
|
145
221
|
[varName, color],
|
|
146
222
|
...effects.map(([type, effect]) => [
|
|
147
223
|
`${varName}--${type}`,
|
|
148
|
-
|
|
224
|
+
applyEffect3(color, effect)
|
|
149
225
|
])
|
|
150
226
|
];
|
|
151
227
|
});
|
|
@@ -155,15 +231,15 @@ function toCssVariables(theme) {
|
|
|
155
231
|
import plugin2 from "tailwindcss/plugin";
|
|
156
232
|
import {
|
|
157
233
|
applyEffectToGradient,
|
|
158
|
-
flatMapObject as
|
|
234
|
+
flatMapObject as flatMapObject3,
|
|
159
235
|
gradient,
|
|
160
236
|
mapKeys,
|
|
161
|
-
mapObject as
|
|
237
|
+
mapObject as mapObject4
|
|
162
238
|
} from "@charcoal-ui/utils";
|
|
163
239
|
var VAR_PREFIX = "--tailwind-gradient-";
|
|
164
240
|
function cssVariableColorPlugin2(gradients, effects, selectorOrMediaQuery) {
|
|
165
241
|
const utilities = getUtilities(gradients, effects);
|
|
166
|
-
const classRules =
|
|
242
|
+
const classRules = mapObject4(utilities, (name) => [
|
|
167
243
|
`.bg-${name}`,
|
|
168
244
|
{ backgroundImage: `var(${VAR_PREFIX}${name})` }
|
|
169
245
|
]);
|
|
@@ -194,7 +270,7 @@ var DIRECTIONS = {
|
|
|
194
270
|
function getUtilities(gradients, effect) {
|
|
195
271
|
const effects = Object.entries(effect);
|
|
196
272
|
const directions = Object.entries(DIRECTIONS);
|
|
197
|
-
return
|
|
273
|
+
return flatMapObject3(
|
|
198
274
|
gradients,
|
|
199
275
|
(name, colors) => directions.flatMap(([direction, className]) => {
|
|
200
276
|
const toLinearGradient = (colors2) => {
|
|
@@ -223,7 +299,7 @@ function createUtilityName(gradientName, direction, suffix = "") {
|
|
|
223
299
|
// src/typography/plugin.ts
|
|
224
300
|
import plugin3 from "tailwindcss/plugin";
|
|
225
301
|
import { TYPOGRAPHY_SIZE } from "@charcoal-ui/foundation";
|
|
226
|
-
import { halfLeading, mapObject as
|
|
302
|
+
import { halfLeading, mapObject as mapObject5, px } from "@charcoal-ui/utils";
|
|
227
303
|
var leadingCancel = {
|
|
228
304
|
display: "block",
|
|
229
305
|
width: 0,
|
|
@@ -246,7 +322,7 @@ var typographyStyle = (style) => {
|
|
|
246
322
|
};
|
|
247
323
|
};
|
|
248
324
|
var typographyPlugin = plugin3(({ addUtilities }) => {
|
|
249
|
-
const typographyClasses =
|
|
325
|
+
const typographyClasses = mapObject5(TYPOGRAPHY_SIZE, (fontSize, style) => [
|
|
250
326
|
`.typography-${fontSize}`,
|
|
251
327
|
typographyStyle(style)
|
|
252
328
|
]);
|
|
@@ -269,15 +345,74 @@ var typographyPlugin = plugin3(({ addUtilities }) => {
|
|
|
269
345
|
});
|
|
270
346
|
var plugin_default = typographyPlugin;
|
|
271
347
|
|
|
348
|
+
// src/tokenV2.ts
|
|
349
|
+
import light from "@charcoal-ui/theme/unstable-tokens/css-variables.json";
|
|
350
|
+
function unstable_createTailwindConfigTokenV2() {
|
|
351
|
+
const fontSize = Object.fromEntries(
|
|
352
|
+
Object.entries(light.text["font-size"]).flatMap(([k, v]) => {
|
|
353
|
+
if (typeof v === "string") {
|
|
354
|
+
return [
|
|
355
|
+
[
|
|
356
|
+
k,
|
|
357
|
+
[
|
|
358
|
+
v,
|
|
359
|
+
{ lineHeight: light.text["line-height"][k] }
|
|
360
|
+
]
|
|
361
|
+
]
|
|
362
|
+
];
|
|
363
|
+
}
|
|
364
|
+
return Object.entries(v).map(([kk, vv]) => {
|
|
365
|
+
return [
|
|
366
|
+
[k, kk].join("-"),
|
|
367
|
+
[
|
|
368
|
+
vv,
|
|
369
|
+
{ lineHeight: light.text["line-height"][k][kk] }
|
|
370
|
+
]
|
|
371
|
+
];
|
|
372
|
+
});
|
|
373
|
+
})
|
|
374
|
+
);
|
|
375
|
+
const spacing = flattenKey(light.space, (key) => !/(gap|padding)/.test(key));
|
|
376
|
+
const colors = mapDefaultKey(light.color);
|
|
377
|
+
const config2 = {
|
|
378
|
+
darkMode: "media",
|
|
379
|
+
theme: {
|
|
380
|
+
borderWidth: flattenKey(light["border-width"]),
|
|
381
|
+
borderRadius: light.radius,
|
|
382
|
+
borderColor: flattenKey(colors.border),
|
|
383
|
+
colors,
|
|
384
|
+
fontSize,
|
|
385
|
+
fontWeight: light.text["font-weight"],
|
|
386
|
+
spacing,
|
|
387
|
+
gap: spacing,
|
|
388
|
+
width: light["paragraph-width"]
|
|
389
|
+
}
|
|
390
|
+
};
|
|
391
|
+
return config2;
|
|
392
|
+
}
|
|
393
|
+
|
|
272
394
|
// src/index.ts
|
|
273
395
|
function createTailwindConfig({
|
|
274
|
-
theme = { ":root":
|
|
275
|
-
version = "v3"
|
|
396
|
+
theme = { ":root": light2 },
|
|
397
|
+
version = "v3",
|
|
398
|
+
cssVariablesV1 = true,
|
|
399
|
+
unstableTokenV2 = false
|
|
276
400
|
}) {
|
|
277
401
|
assertAllThemeHaveSameKeys(theme);
|
|
278
402
|
const defaultTheme = theme[":root"];
|
|
279
403
|
const effects = mergeEffect(defaultTheme);
|
|
280
404
|
const DEFAULT = getDefaultKeyName(version);
|
|
405
|
+
const {
|
|
406
|
+
borderWidth: borderWidthV2,
|
|
407
|
+
borderRadius: borderRadiusV2,
|
|
408
|
+
borderColor: borderColorV2,
|
|
409
|
+
colors: colorsV2,
|
|
410
|
+
fontSize: fontSizeV2,
|
|
411
|
+
fontWeight: fontWeightV2,
|
|
412
|
+
spacing: spacingV2,
|
|
413
|
+
gap: gapV2,
|
|
414
|
+
width: widthV2
|
|
415
|
+
} = unstableTokenV2 ? unstable_createTailwindConfigTokenV2().theme : {};
|
|
281
416
|
return {
|
|
282
417
|
theme: {
|
|
283
418
|
screens: {
|
|
@@ -292,16 +427,24 @@ function createTailwindConfig({
|
|
|
292
427
|
white: "#fff",
|
|
293
428
|
transparent: "transparent",
|
|
294
429
|
current: "currentColor",
|
|
295
|
-
...colorsToTailwindConfig(version, defaultTheme.color, effects)
|
|
430
|
+
...colorsToTailwindConfig(version, defaultTheme.color, effects),
|
|
431
|
+
...colorsV2
|
|
296
432
|
},
|
|
297
433
|
borderColor: {
|
|
298
434
|
...colorsToTailwindConfig(
|
|
299
435
|
version,
|
|
300
|
-
|
|
436
|
+
mapObject6(defaultTheme.border, (k, v) => [k, v.color]),
|
|
301
437
|
effects
|
|
302
|
-
)
|
|
438
|
+
),
|
|
439
|
+
...borderColorV2
|
|
440
|
+
},
|
|
441
|
+
spacing: {
|
|
442
|
+
...mapObject6(
|
|
443
|
+
SPACING,
|
|
444
|
+
(name, pixel) => [name, px2(pixel)]
|
|
445
|
+
),
|
|
446
|
+
...spacingV2
|
|
303
447
|
},
|
|
304
|
-
spacing: mapObject5(SPACING, (name, pixel) => [name, px2(pixel)]),
|
|
305
448
|
width: {
|
|
306
449
|
full: "100%",
|
|
307
450
|
screen: "100vw",
|
|
@@ -320,18 +463,28 @@ function createTailwindConfig({
|
|
|
320
463
|
[`${i}/${GRID_COUNT}`]: `${i / GRID_COUNT * 100}%`
|
|
321
464
|
}),
|
|
322
465
|
{}
|
|
323
|
-
)
|
|
466
|
+
),
|
|
467
|
+
...widthV2
|
|
324
468
|
},
|
|
325
469
|
gap: {
|
|
326
|
-
fixed: px2(GUTTER_UNIT)
|
|
470
|
+
fixed: px2(GUTTER_UNIT),
|
|
471
|
+
...gapV2
|
|
472
|
+
},
|
|
473
|
+
borderRadius: {
|
|
474
|
+
...mapObject6(
|
|
475
|
+
BORDER_RADIUS,
|
|
476
|
+
(name, value) => [name, px2(value)]
|
|
477
|
+
),
|
|
478
|
+
...borderRadiusV2
|
|
327
479
|
},
|
|
328
|
-
borderRadius: mapObject5(BORDER_RADIUS, (name, value) => [
|
|
329
|
-
name,
|
|
330
|
-
px2(value)
|
|
331
|
-
]),
|
|
332
480
|
transitionDuration: {
|
|
333
481
|
[DEFAULT]: "0.2s"
|
|
334
|
-
}
|
|
482
|
+
},
|
|
483
|
+
...unstableTokenV2 ? {
|
|
484
|
+
borderWidth: borderWidthV2,
|
|
485
|
+
fontSize: fontSizeV2,
|
|
486
|
+
fontWeight: fontWeightV2
|
|
487
|
+
} : {}
|
|
335
488
|
},
|
|
336
489
|
...getVariantOption(version),
|
|
337
490
|
corePlugins: {
|
|
@@ -339,7 +492,7 @@ function createTailwindConfig({
|
|
|
339
492
|
},
|
|
340
493
|
plugins: [
|
|
341
494
|
plugin_default,
|
|
342
|
-
cssVariableColorPlugin(theme),
|
|
495
|
+
cssVariableColorPlugin(theme, Boolean(cssVariablesV1)),
|
|
343
496
|
...Object.entries(theme).map(
|
|
344
497
|
([selectorOrMediaQuery, theme2]) => cssVariableColorPlugin2(
|
|
345
498
|
theme2.gradientColor,
|
|
@@ -353,6 +506,7 @@ function createTailwindConfig({
|
|
|
353
506
|
var config = createTailwindConfig({});
|
|
354
507
|
export {
|
|
355
508
|
config,
|
|
356
|
-
createTailwindConfig
|
|
509
|
+
createTailwindConfig,
|
|
510
|
+
unstable_createTailwindConfigTokenV2
|
|
357
511
|
};
|
|
358
512
|
//# sourceMappingURL=index.esm.js.map
|
package/dist/index.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/foundation.ts","../src/util.ts","../src/index.ts","../src/colors/toTailwindConfig.ts","../src/colors/utils.ts","../src/colors/plugin.ts","../src/gradient/plugin.ts","../src/typography/plugin.ts"],"sourcesContent":["import { Effect } from '@charcoal-ui/foundation'\nimport { CharcoalTheme as Theme } from '@charcoal-ui/theme'\n\nexport const GRID_COUNT = 12\n\nexport function mergeEffect({\n elementEffect,\n effect,\n}: Pick<Theme, 'elementEffect' | 'effect'>): MergedEffect {\n return {\n ...elementEffect,\n ...effect,\n outline: {\n type: 'opacity',\n opacity: 0.32,\n } as Effect,\n }\n}\n\nexport type MergedEffect = Record<string, Effect>\n","import type { TailwindConfig } from 'tailwindcss/tailwind-config'\nimport { TailwindVersion, ThemeMap } from './types'\n\n/**\n * the key \"default\" or \"DEFAULT\" has special meaning and dropped from class name\n *\n * @see https://tailwindcss.com/docs/upgrading-to-v2#update-default-theme-keys-to-default\n */\nexport function getDefaultKeyName(version: TailwindVersion) {\n switch (version) {\n case 'v3':\n case 'v2': {\n return 'DEFAULT'\n }\n\n case 'v1': {\n return 'default'\n }\n }\n}\n\nexport function getVariantOption(\n version: TailwindVersion\n): Partial<TailwindConfig> {\n switch (version) {\n case 'v3': {\n // v3 以上では variants は variantOrders に改名された\n // そしてこれは上書きをしたいモチベがない\n // https://v2.tailwindcss.com/docs/configuration#variant-order\n return {}\n }\n\n case 'v2':\n case 'v1': {\n return { variants: {} }\n }\n }\n}\n\nfunction setEquals<T>(a: Set<T>, b: Set<T>) {\n return a.size === b.size && Array.from(a).every((value) => b.has(value))\n}\n\nexport function assertAllThemeHaveSameKeys(themeMap: ThemeMap): void {\n const defaultTheme = themeMap[':root']\n const expectedColorKeys = new Set(Object.keys(defaultTheme.color))\n const expectedEffectKeys = new Set(Object.keys(defaultTheme.effect))\n\n for (const [name, theme] of Object.entries(themeMap)) {\n const colorKeys = new Set(Object.keys(theme.color))\n const effectKeys = new Set(Object.keys(theme.effect))\n\n if (!setEquals(colorKeys, expectedColorKeys)) {\n throw new Error(`:root and ${name} does not have same colors.\n\nExpected( :root ): ${JSON.stringify(Array.from(expectedColorKeys))}\nGot: ${JSON.stringify(Array.from(colorKeys))}`)\n }\n\n if (!setEquals(effectKeys, expectedEffectKeys)) {\n throw new Error(`:root and ${name} does not have same effects.\n\nExpected( :root ): ${JSON.stringify(Array.from(expectedEffectKeys))}\nGot: ${JSON.stringify(Array.from(effectKeys))}`)\n }\n }\n}\n\nexport function camelToKebab(value: string) {\n return value\n .replace(/(?<small>[\\da-z]|(?=[A-Z]))(?<capital>[A-Z])/gu, '$1-$2')\n .toLowerCase()\n}\n","import { GRID_COUNT, mergeEffect } from './foundation'\n\nimport type { TailwindConfig } from 'tailwindcss/tailwind-config'\nimport { TailwindVersion, ThemeMap } from './types'\n\nimport {\n assertAllThemeHaveSameKeys,\n getDefaultKeyName,\n getVariantOption,\n} from './util'\nimport {\n COLUMN_UNIT,\n GUTTER_UNIT,\n SPACING,\n BORDER_RADIUS,\n} from '@charcoal-ui/foundation'\nimport { light } from '@charcoal-ui/theme'\nimport { mapObject, px } from '@charcoal-ui/utils'\nimport { colorsToTailwindConfig } from './colors/toTailwindConfig'\n\nimport cssVariableColorPlugin from './colors/plugin'\nimport cssVariableGradientPlugin from './gradient/plugin'\nimport typographyPlugin from './typography/plugin'\n\ninterface Options {\n version?: TailwindVersion\n theme?: ThemeMap\n}\n\nexport function createTailwindConfig({\n theme = { ':root': light },\n version = 'v3',\n}: Options): TailwindConfig {\n assertAllThemeHaveSameKeys(theme)\n\n const defaultTheme = theme[':root']\n const effects = mergeEffect(defaultTheme)\n const DEFAULT = getDefaultKeyName(version)\n\n return {\n theme: {\n screens: {\n screen1: px(0),\n screen2: px(defaultTheme.breakpoint.screen1),\n screen3: px(defaultTheme.breakpoint.screen2),\n screen4: px(defaultTheme.breakpoint.screen3),\n screen5: px(defaultTheme.breakpoint.screen4),\n },\n colors: {\n // @deprecated\n black: '#000',\n\n // @deprecated\n white: '#fff',\n\n transparent: 'transparent',\n current: 'currentColor',\n ...colorsToTailwindConfig(version, defaultTheme.color, effects),\n },\n borderColor: {\n ...colorsToTailwindConfig(\n version,\n mapObject(defaultTheme.border, (k, v) => [k, v.color]),\n effects\n ),\n },\n spacing: mapObject(SPACING, (name, pixel) => [name, px(pixel)]),\n width: {\n full: '100%',\n screen: '100vw',\n auto: 'auto',\n fit: 'fit-content',\n\n /**\n * generates classes like \"w-col-span-1\"\n */\n ...Array.from({ length: GRID_COUNT }, (_, i) => i + 1).reduce(\n (styles, i) => ({\n ...styles,\n [`col-span-${i}`]: px(COLUMN_UNIT * i + GUTTER_UNIT * (i - 1)),\n }),\n {}\n ),\n\n /**\n * generates classes like \"w-1/12\" (except for 12/12, which just equals to w-full)\n */\n ...Array.from({ length: GRID_COUNT - 1 }, (_, i) => i + 1).reduce(\n (styles, i) => ({\n ...styles,\n [`${i}/${GRID_COUNT}`]: `${(i / GRID_COUNT) * 100}%`,\n }),\n {}\n ),\n },\n gap: {\n fixed: px(GUTTER_UNIT),\n },\n borderRadius: mapObject(BORDER_RADIUS, (name, value) => [\n name,\n px(value),\n ]),\n transitionDuration: {\n [DEFAULT]: '0.2s',\n },\n },\n\n ...getVariantOption(version),\n\n corePlugins: {\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-expect-error 配列にしろと言ってくるが、たぶん @types が間違っている\n lineHeight: false,\n },\n plugins: [\n typographyPlugin,\n cssVariableColorPlugin(theme),\n\n ...Object.entries(theme).map(([selectorOrMediaQuery, theme]) =>\n cssVariableGradientPlugin(\n theme.gradientColor,\n mergeEffect(theme),\n selectorOrMediaQuery\n )\n ),\n ],\n }\n}\n\nexport const config: TailwindConfig = createTailwindConfig({})\n","import { Material } from '@charcoal-ui/foundation'\nimport { applyEffect, filterObject, mapObject } from '@charcoal-ui/utils'\nimport type { TailwindConfig } from 'tailwindcss/tailwind-config'\nimport { MergedEffect } from '../foundation'\n\nimport { TailwindVersion } from '../types'\nimport { getDefaultKeyName } from '../util'\n\nimport { AnyColorTheme, COLOR_PREFIX, isSingleColor } from './utils'\n\nexport function colorsToTailwindConfig(\n version: TailwindVersion,\n colors: AnyColorTheme,\n effects: MergedEffect\n): TailwindConfig['theme']['colors'] {\n const targetColors = filterObject(colors, isSingleColor)\n const DEFAULT = getDefaultKeyName(version)\n\n /**\n * こういう感じのを吐き出す\n *\n * ```js\n * {\n * DEFAULT: 'var(--tailwind-color-hoge1, #fff)',\n * hover: 'var(--tailwind-color-hoge1--hover, #eee)',\n * press: 'var(--tailwind-color-hoge1--press, #ddd)',\n * disabled: 'var(--tailwind-color-hoge1--disabled, #eee)',\n * }\n * ```\n */\n function colorsForAllEffects(name: string, color: Material) {\n const varName = `${COLOR_PREFIX}${name}`\n\n return {\n [DEFAULT]: `var(${varName}, ${color})`,\n\n ...mapObject(effects, (effectName, effect) => [\n effectName,\n `var(${varName}--${effectName}, ${applyEffect(color, effect)})`,\n ]),\n }\n }\n\n return mapObject(targetColors, (name, color) => [\n name,\n colorsForAllEffects(name, color),\n ])\n}\n","import { GradientMaterial, Material } from '@charcoal-ui/foundation'\n\nexport const COLOR_PREFIX = '--tailwind-color-'\n\nexport function isSingleColor(color: AnyColor): color is Material {\n return typeof color === 'string'\n}\n\ntype AnyColor = Material | GradientMaterial\n\nexport type AnyColorTheme = Record<string, AnyColor>\n","import { Material } from '@charcoal-ui/foundation'\nimport { CharcoalTheme as Theme } from '@charcoal-ui/theme'\nimport {\n applyEffect,\n filterObject,\n flatMapObject,\n mapObject,\n} from '@charcoal-ui/utils'\nimport plugin, { TailwindPlugin } from 'tailwindcss/plugin'\nimport { mergeEffect } from '../foundation'\nimport { CSSVariableName, CSSVariables, Definition, ThemeMap } from '../types'\nimport { COLOR_PREFIX, isSingleColor } from './utils'\n\n/**\n * `:root` 以外のケースで各 CSS Variable がどういう値を取るかを定義する\n */\nexport default function cssVariableColorPlugin({\n ':root': _defaultTheme,\n ...themes\n}: ThemeMap): TailwindPlugin {\n const definitions = defineCssVariables(themes)\n\n return plugin(({ addBase }) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n addBase(definitions)\n })\n}\n\nexport function defineCssVariables(themes: Omit<ThemeMap, ':root'>) {\n return mapObject(themes, (selectorOrMediaQuery, theme) => {\n const css = toCssVariables(theme)\n\n if (selectorOrMediaQuery.startsWith('@media')) {\n return [\n selectorOrMediaQuery,\n {\n ':root': css,\n },\n ]\n } else {\n return [selectorOrMediaQuery, css]\n }\n }) as Definition\n}\n\nfunction toCssVariables(theme: Theme): CSSVariables {\n const colors = filterObject(theme.color, isSingleColor)\n const effects = Object.entries(mergeEffect(theme))\n\n return flatMapObject(colors, (name, color) => {\n const varName: keyof CSSVariables = `${COLOR_PREFIX}${name}`\n\n return [\n [varName, color],\n\n ...effects.map<[CSSVariableName, Material]>(([type, effect]) => [\n `${varName}--${type}`,\n applyEffect(color, effect),\n ]),\n ]\n })\n}\n","import plugin from 'tailwindcss/plugin'\nimport { camelToKebab } from '../util'\nimport { GradientMaterial } from '@charcoal-ui/foundation'\nimport { ThemeColorGradient } from '@charcoal-ui/theme'\nimport {\n applyEffectToGradient,\n flatMapObject,\n gradient,\n GradientDirection,\n mapKeys,\n mapObject,\n} from '@charcoal-ui/utils'\nimport { Values } from '../types'\nimport { MergedEffect } from '../foundation'\n\nconst VAR_PREFIX = '--tailwind-gradient-'\n\nexport default function cssVariableColorPlugin(\n gradients: ThemeColorGradient,\n effects: MergedEffect,\n selectorOrMediaQuery: string\n) {\n const utilities = getUtilities(gradients, effects)\n\n const classRules = mapObject(utilities, (name) => [\n `.bg-${name}`,\n { backgroundImage: `var(${VAR_PREFIX}${name})` },\n ])\n\n return plugin(({ addBase, addUtilities }) => {\n const css = mapKeys(utilities, (name) => `${VAR_PREFIX}${name}`)\n if (selectorOrMediaQuery.startsWith('@media')) {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n addBase({\n [selectorOrMediaQuery]: {\n ':root': css,\n },\n })\n } else {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n addBase({\n [selectorOrMediaQuery]: css,\n })\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n addUtilities(classRules, {\n variants: ['responsive'],\n })\n })\n}\n\nconst DIRECTIONS = {\n 'to top': 'top',\n 'to bottom': 'bottom',\n 'to left': 'left',\n 'to right': 'right',\n} as const\n\n/**\n * こういう感じのやつ。この時点では `--tailwind-gradient-` のような CSS 変数名になってない\n *\n * ```js\n * {\n * 'hoge1': 'linear-gradient(to top, ...)',\n * ...\n * }\n * ```\n */\ntype Utilities = Record<string, LinearGradient>\n\ntype LinearGradient = `linear-gradient(${string})`\n\nexport function getUtilities(\n gradients: Record<string, GradientMaterial>,\n effect: MergedEffect\n): Utilities {\n const effects = Object.entries(effect)\n const directions = Object.entries(DIRECTIONS) as [\n GradientDirection,\n Values<typeof DIRECTIONS>\n ][]\n\n return flatMapObject(gradients, (name, colors) =>\n directions.flatMap(([direction, className]) => {\n const toLinearGradient = (colors: GradientMaterial) => {\n const style = gradient(direction)(colors)\n\n if (!('backgroundImage' in style)) {\n throw new Error(\n `Could not generate linear-gradient() from ${name} ${direction} ${className}`\n )\n }\n\n // 本当は backgroundColor も同時に生成されるんだけど、使うにはそれ用の CSS 変数も一緒に作らないといけない\n // とりあえず background-image だけで動くのでこっちだけを利用する\n return style.backgroundImage as LinearGradient\n }\n\n return [\n // こういう感じのやつ\n // { 'hoge1': 'linear-gradient(to top, ...)' }\n [createUtilityName(name, className), toLinearGradient(colors)],\n\n // こういう感じのやつ\n // { 'hoge1--hover': 'linear-gradient(to top, ...)' }\n ...effects.map<[string, LinearGradient]>(([effectName, effect]) => [\n createUtilityName(name, className, effectName),\n toLinearGradient(applyEffectToGradient(effect)(colors)),\n ]),\n ]\n })\n )\n}\n\nfunction createUtilityName(\n gradientName: string,\n direction: Values<typeof DIRECTIONS>,\n suffix = ''\n) {\n return [camelToKebab(gradientName), direction, suffix]\n .filter(Boolean)\n .join('-')\n}\n","import plugin from 'tailwindcss/plugin'\nimport { TypographyDescriptor, TYPOGRAPHY_SIZE } from '@charcoal-ui/foundation'\nimport { halfLeading, mapObject, px } from '@charcoal-ui/utils'\n\nconst leadingCancel = {\n display: 'block',\n width: 0,\n height: 0,\n content: '\"\"',\n}\n\nconst typographyStyle = (style: TypographyDescriptor) => {\n const margin = -halfLeading(style)\n\n return {\n 'font-size': px(style.fontSize),\n 'line-height': px(style.lineHeight),\n\n /**\n * cancel leading\n *\n * @see https://yuyakinoshita.com/blog/2020/01/20/line-height-crop/\n */\n '&::before': {\n ...leadingCancel,\n marginTop: px(margin),\n },\n '&::after': {\n ...leadingCancel,\n marginBottom: px(margin),\n },\n }\n}\n\nconst typographyPlugin = plugin(({ addUtilities }) => {\n const typographyClasses = mapObject(TYPOGRAPHY_SIZE, (fontSize, style) => [\n `.typography-${fontSize}`,\n typographyStyle(style),\n ])\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n addUtilities(\n {\n ...typographyClasses,\n '.preserve-half-leading': {\n '&::before': {\n content: 'none',\n },\n '&::after': {\n content: 'none',\n },\n },\n },\n {\n variants: ['responsive'],\n }\n )\n})\n\nexport default typographyPlugin\n"],"mappings":"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","names":["mapObject","px","applyEffect","filterObject","mapObject","mapObject","filterObject","applyEffect","plugin","flatMapObject","mapObject","cssVariableColorPlugin","plugin","colors","effect","plugin","mapObject","px","mapObject","theme","cssVariableColorPlugin"]}
|
|
1
|
+
{"version":3,"sources":["../src/foundation.ts","../src/util.ts","../src/index.ts","../src/colors/toTailwindConfig.ts","../src/colors/utils.ts","../src/colors/plugin.ts","../src/colors/pluginTokenV1.ts","../src/gradient/plugin.ts","../src/typography/plugin.ts","../src/tokenV2.ts"],"sourcesContent":["import { Effect } from '@charcoal-ui/foundation'\nimport { CharcoalTheme as Theme } from '@charcoal-ui/theme'\n\nexport const GRID_COUNT = 12\n\nexport function mergeEffect({\n elementEffect,\n effect,\n}: Pick<Theme, 'elementEffect' | 'effect'>): MergedEffect {\n return {\n ...elementEffect,\n ...effect,\n outline: {\n type: 'opacity',\n opacity: 0.32,\n } as Effect,\n }\n}\n\nexport type MergedEffect = Record<string, Effect>\n","import type { TailwindConfig } from 'tailwindcss/tailwind-config'\nimport { TailwindVersion, ThemeMap } from './types'\n\n/**\n * the key \"default\" or \"DEFAULT\" has special meaning and dropped from class name\n *\n * @see https://tailwindcss.com/docs/upgrading-to-v2#update-default-theme-keys-to-default\n */\nexport function getDefaultKeyName(version: TailwindVersion) {\n switch (version) {\n case 'v3':\n case 'v2': {\n return 'DEFAULT'\n }\n\n case 'v1': {\n return 'default'\n }\n }\n}\n\nexport function getVariantOption(\n version: TailwindVersion\n): Partial<TailwindConfig> {\n switch (version) {\n case 'v3': {\n // v3 以上では variants は variantOrders に改名された\n // そしてこれは上書きをしたいモチベがない\n // https://v2.tailwindcss.com/docs/configuration#variant-order\n return {}\n }\n\n case 'v2':\n case 'v1': {\n return { variants: {} }\n }\n }\n}\n\nfunction setEquals<T>(a: Set<T>, b: Set<T>) {\n return a.size === b.size && Array.from(a).every((value) => b.has(value))\n}\n\nexport function assertAllThemeHaveSameKeys(themeMap: ThemeMap): void {\n const defaultTheme = themeMap[':root']\n const expectedColorKeys = new Set(Object.keys(defaultTheme.color))\n const expectedEffectKeys = new Set(Object.keys(defaultTheme.effect))\n\n for (const [name, theme] of Object.entries(themeMap)) {\n const colorKeys = new Set(Object.keys(theme.color))\n const effectKeys = new Set(Object.keys(theme.effect))\n\n if (!setEquals(colorKeys, expectedColorKeys)) {\n throw new Error(`:root and ${name} does not have same colors.\n\nExpected( :root ): ${JSON.stringify(Array.from(expectedColorKeys))}\nGot: ${JSON.stringify(Array.from(colorKeys))}`)\n }\n\n if (!setEquals(effectKeys, expectedEffectKeys)) {\n throw new Error(`:root and ${name} does not have same effects.\n\nExpected( :root ): ${JSON.stringify(Array.from(expectedEffectKeys))}\nGot: ${JSON.stringify(Array.from(effectKeys))}`)\n }\n }\n}\n\nexport function camelToKebab(value: string) {\n return value\n .replace(/(?<small>[\\da-z]|(?=[A-Z]))(?<capital>[A-Z])/gu, '$1-$2')\n .toLowerCase()\n}\n\nexport const mapDefaultKey = <O extends object>(o: O) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-return\n return JSON.parse(JSON.stringify(o), function reviver(k: string, v: string) {\n if (k === 'default') {\n const DefaultKey = getDefaultKeyName('v3')\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n this[DefaultKey] = v\n return undefined\n }\n return v\n })\n}\n\nexport const flattenKey = <O extends object>(\n o: O,\n join?: (key: string) => boolean\n) => {\n return Object.fromEntries(\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n Object.entries(o).flatMap(([key, v]) => {\n if (typeof v === 'string') return [[key, v]]\n return Object.entries(v as object).map(([kk, vv]) => {\n return [join?.(key) ?? true ? [key, kk].join('-') : kk, vv]\n })\n })\n )\n}\n","import { GRID_COUNT, mergeEffect } from './foundation'\n\nimport type { TailwindConfig, TailwindTheme } from 'tailwindcss/tailwind-config'\nimport { TailwindVersion, ThemeMap } from './types'\n\nimport {\n assertAllThemeHaveSameKeys,\n getDefaultKeyName,\n getVariantOption,\n} from './util'\nimport {\n COLUMN_UNIT,\n GUTTER_UNIT,\n SPACING,\n BORDER_RADIUS,\n} from '@charcoal-ui/foundation'\nimport { light } from '@charcoal-ui/theme'\nimport { mapObject, px } from '@charcoal-ui/utils'\nimport { colorsToTailwindConfig } from './colors/toTailwindConfig'\n\nimport cssVariableColorPlugin from './colors/plugin'\nimport cssVariableGradientPlugin from './gradient/plugin'\nimport typographyPlugin from './typography/plugin'\nimport { unstable_createTailwindConfigTokenV2 } from './tokenV2'\nexport { unstable_createTailwindConfigTokenV2 }\n\ninterface Options {\n version?: TailwindVersion\n theme?: ThemeMap\n cssVariablesV1?: boolean\n unstableTokenV2?: boolean\n}\n\nexport function createTailwindConfig({\n theme = { ':root': light },\n version = 'v3',\n cssVariablesV1 = true,\n unstableTokenV2 = false,\n}: Options): TailwindConfig {\n assertAllThemeHaveSameKeys(theme)\n\n const defaultTheme = theme[':root']\n const effects = mergeEffect(defaultTheme)\n const DEFAULT = getDefaultKeyName(version)\n\n const {\n borderWidth: borderWidthV2,\n borderRadius: borderRadiusV2,\n borderColor: borderColorV2,\n colors: colorsV2,\n fontSize: fontSizeV2,\n fontWeight: fontWeightV2,\n spacing: spacingV2,\n gap: gapV2,\n width: widthV2,\n }: Partial<TailwindTheme> = unstableTokenV2\n ? unstable_createTailwindConfigTokenV2().theme\n : {}\n\n return {\n theme: {\n screens: {\n screen1: px(0),\n screen2: px(defaultTheme.breakpoint.screen1),\n screen3: px(defaultTheme.breakpoint.screen2),\n screen4: px(defaultTheme.breakpoint.screen3),\n screen5: px(defaultTheme.breakpoint.screen4),\n },\n colors: {\n // @deprecated\n black: '#000',\n\n // @deprecated\n white: '#fff',\n\n transparent: 'transparent',\n current: 'currentColor',\n ...colorsToTailwindConfig(version, defaultTheme.color, effects),\n ...colorsV2,\n },\n borderColor: {\n ...colorsToTailwindConfig(\n version,\n mapObject(defaultTheme.border, (k, v) => [k, v.color]),\n effects\n ),\n ...borderColorV2,\n },\n spacing: {\n ...mapObject(\n SPACING,\n (name, pixel) => [name, px(pixel)] as [string, string]\n ),\n ...spacingV2,\n },\n width: {\n full: '100%',\n screen: '100vw',\n auto: 'auto',\n fit: 'fit-content',\n\n /**\n * generates classes like \"w-col-span-1\"\n */\n ...Array.from({ length: GRID_COUNT }, (_, i) => i + 1).reduce(\n (styles, i) => ({\n ...styles,\n [`col-span-${i}`]: px(COLUMN_UNIT * i + GUTTER_UNIT * (i - 1)),\n }),\n {}\n ),\n\n /**\n * generates classes like \"w-1/12\" (except for 12/12, which just equals to w-full)\n */\n ...Array.from({ length: GRID_COUNT - 1 }, (_, i) => i + 1).reduce(\n (styles, i) => ({\n ...styles,\n [`${i}/${GRID_COUNT}`]: `${(i / GRID_COUNT) * 100}%`,\n }),\n {}\n ),\n ...widthV2,\n },\n gap: {\n fixed: px(GUTTER_UNIT),\n ...gapV2,\n },\n borderRadius: {\n ...mapObject(\n BORDER_RADIUS,\n (name, value) => [name, px(value)] as [string, string]\n ),\n ...borderRadiusV2,\n },\n transitionDuration: {\n [DEFAULT]: '0.2s',\n },\n ...(unstableTokenV2\n ? {\n borderWidth: borderWidthV2,\n fontSize: fontSizeV2,\n fontWeight: fontWeightV2,\n }\n : {}),\n },\n\n ...getVariantOption(version),\n\n corePlugins: {\n // @ts-expect-error 配列にしろと言ってくるが、たぶん @types が間違っている\n lineHeight: false,\n },\n plugins: [\n typographyPlugin,\n cssVariableColorPlugin(theme, Boolean(cssVariablesV1)),\n\n ...Object.entries(theme).map(([selectorOrMediaQuery, theme]) =>\n cssVariableGradientPlugin(\n theme.gradientColor,\n mergeEffect(theme),\n selectorOrMediaQuery\n )\n ),\n ],\n }\n}\n\nexport const config: TailwindConfig = createTailwindConfig({})\n","import { Material } from '@charcoal-ui/foundation'\nimport { applyEffect, filterObject, mapObject } from '@charcoal-ui/utils'\nimport type { TailwindConfig } from 'tailwindcss/tailwind-config'\nimport { MergedEffect } from '../foundation'\n\nimport { TailwindVersion } from '../types'\nimport { getDefaultKeyName } from '../util'\n\nimport { AnyColorTheme, COLOR_PREFIX, isSingleColor } from './utils'\n\nexport function colorsToTailwindConfig(\n version: TailwindVersion,\n colors: AnyColorTheme,\n effects: MergedEffect\n): TailwindConfig['theme']['colors'] {\n const targetColors = filterObject(colors, isSingleColor)\n const DEFAULT = getDefaultKeyName(version)\n\n /**\n * こういう感じのを吐き出す\n *\n * ```js\n * {\n * DEFAULT: 'var(--tailwind-color-hoge1, #fff)',\n * hover: 'var(--tailwind-color-hoge1--hover, #eee)',\n * press: 'var(--tailwind-color-hoge1--press, #ddd)',\n * disabled: 'var(--tailwind-color-hoge1--disabled, #eee)',\n * }\n * ```\n */\n function colorsForAllEffects(name: string, color: Material) {\n const varName = `${COLOR_PREFIX}${name}`\n\n return {\n [DEFAULT]: `var(${varName}, ${color})`,\n\n ...mapObject(effects, (effectName, effect) => [\n effectName,\n `var(${varName}--${effectName}, ${applyEffect(color, effect)})`,\n ]),\n }\n }\n\n return mapObject(targetColors, (name, color) => [\n name,\n colorsForAllEffects(name, color),\n ])\n}\n","import { GradientMaterial, Material } from '@charcoal-ui/foundation'\n\nexport const COLOR_PREFIX = '--tailwind-color-'\n\nexport function isSingleColor(color: AnyColor): color is Material {\n return typeof color === 'string'\n}\n\ntype AnyColor = Material | GradientMaterial\n\nexport type AnyColorTheme = Record<string, AnyColor>\n","import { Material } from '@charcoal-ui/foundation'\nimport { CharcoalTheme as Theme } from '@charcoal-ui/theme'\nimport {\n applyEffect,\n filterObject,\n flatMapObject,\n mapObject,\n} from '@charcoal-ui/utils'\nimport plugin, { TailwindPlugin } from 'tailwindcss/plugin'\nimport { mergeEffect } from '../foundation'\nimport { CSSVariableName, CSSVariables, Definition, ThemeMap } from '../types'\nimport { COLOR_PREFIX, isSingleColor } from './utils'\nimport { defineCssVariablesV1 } from './pluginTokenV1'\n\n/**\n * --tailwind-* また --charcoal-* を生成する\n * TODO: --tailwindをやめる\n */\nexport default function cssVariableColorPlugin(\n themeMap: ThemeMap,\n cssVariablesV1: boolean\n): TailwindPlugin {\n // `:root` 以外のケースで各 CSS Variable がどういう値を取るかを定義する\n const { ':root': _defaultTheme, ...otherThemes } = themeMap\n const definitions = defineCssVariables(otherThemes)\n\n return plugin(({ addBase }) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n addBase(definitions)\n\n // styledのTokenInjector移植(background処理除く)\n if (cssVariablesV1) {\n const cssVariablesV1 = defineCssVariablesV1(themeMap)\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n addBase(cssVariablesV1)\n }\n })\n}\n\nexport function defineCssVariables(themes: Omit<ThemeMap, ':root'>) {\n return mapObject(themes, (selectorOrMediaQuery, theme) => {\n const css = toCssVariables(theme)\n\n if (selectorOrMediaQuery.startsWith('@media')) {\n return [\n selectorOrMediaQuery,\n {\n ':root': css,\n },\n ]\n } else {\n return [selectorOrMediaQuery, css]\n }\n }) as Definition\n}\n\nfunction toCssVariables(theme: Theme): CSSVariables {\n const colors = filterObject(theme.color, isSingleColor)\n const effects = Object.entries(mergeEffect(theme))\n\n return flatMapObject(colors, (name, color) => {\n const varName: keyof CSSVariables = `${COLOR_PREFIX}${name}`\n\n return [\n [varName, color],\n\n ...effects.map<[CSSVariableName, Material]>(([type, effect]) => [\n `${varName}--${type}`,\n applyEffect(color, effect),\n ]),\n ]\n })\n}\n","import {\n applyEffect,\n customPropertyToken,\n filterObject,\n flatMapObject,\n mapObject,\n} from '@charcoal-ui/utils'\nimport { ThemeMap } from '../types'\nimport {\n CharcoalAbstractTheme,\n EffectType,\n Key,\n CharcoalTheme as Theme,\n} from '@charcoal-ui/theme'\n\nexport function defineCssVariablesV1(themeMap: ThemeMap) {\n // @ts-expect-error FIXME\n return mapObject(themeMap, (key, theme) => {\n if (key.startsWith('@media')) {\n return [\n key,\n {\n ':root': defineColorVariableCSS(theme),\n },\n ]\n } else {\n return [key, defineColorVariableCSS(theme)]\n }\n })\n}\n\nexport const defineColorVariableCSS = (theme: Theme) => {\n const borders = mapObject(theme.border, (name, { color }) => [\n // REVIEW: もしtheme.colorにたまたまborder-〇〇で始まる色名がいたら被りうる\n withPrefixes('border', name),\n color,\n ])\n\n const colors = defineThemeVariables({ ...theme.color, ...borders })({ theme })\n return colors\n}\n\n/**\n * Check whether a value is non-null and non-undefined\n *\n * @param value nullable\n */\nexport const isPresent = <T>(value: T): value is NonNullable<T> => value != null\n\n/**\n * 子孫要素で使われるカラーテーマの CSS Variables を上書きする\n *\n * @params colorParams - 上書きしたい色の定義( `theme.color` の一部だけ書けば良い )\n * @params effectParams - effect の定義を上書きしたい場合は渡す(必須ではない)\n *\n * @example\n * ```tsx\n * const LocalTheme = styled.div`\n * ${defineThemeVariables({ text1: '#ff0000' })}\n * // `text1` is now defined as red\n * ${theme((o) => [o.font.text1])}\n * `\n * ```\n */\nexport function defineThemeVariables(\n colorParams: Partial<CharcoalAbstractTheme['color']>,\n effectParams?: Partial<CharcoalAbstractTheme['effect']>\n) {\n return function toCssObject(props: {\n theme: Pick<CharcoalAbstractTheme, 'effect'>\n }) {\n const colors = filterObject(colorParams, isPresent)\n\n // flatMapObject の中で毎回 Object.entries を呼ぶのは無駄なので外で呼ぶ\n const effects = Object.entries({\n ...props.theme.effect,\n ...effectParams,\n })\n\n return flatMapObject(colors, (colorKey, color) => [\n [customPropertyToken(colorKey), color],\n\n ...effects.map<[string, string]>(([effectKey, effect]) => [\n customPropertyToken(colorKey, [effectKey]),\n applyEffect(color, [effect]),\n ]),\n ])\n }\n}\n\nexport function isSupportedEffect(effect: Key): effect is EffectType {\n return ['hover', 'press', 'disabled'].includes(effect as string)\n}\n\nexport const variable = (value: string) => `var(${value})`\n\nexport function withPrefixes(...parts: string[]) {\n return parts.join('-')\n}\n","import plugin from 'tailwindcss/plugin'\nimport { camelToKebab } from '../util'\nimport { GradientMaterial } from '@charcoal-ui/foundation'\nimport { ThemeColorGradient } from '@charcoal-ui/theme'\nimport {\n applyEffectToGradient,\n flatMapObject,\n gradient,\n GradientDirection,\n mapKeys,\n mapObject,\n} from '@charcoal-ui/utils'\nimport { Values } from '../types'\nimport { MergedEffect } from '../foundation'\n\nconst VAR_PREFIX = '--tailwind-gradient-'\n\nexport default function cssVariableColorPlugin(\n gradients: ThemeColorGradient,\n effects: MergedEffect,\n selectorOrMediaQuery: string\n) {\n const utilities = getUtilities(gradients, effects)\n\n const classRules = mapObject(utilities, (name) => [\n `.bg-${name}`,\n { backgroundImage: `var(${VAR_PREFIX}${name})` },\n ])\n\n return plugin(({ addBase, addUtilities }) => {\n const css = mapKeys(utilities, (name) => `${VAR_PREFIX}${name}`)\n if (selectorOrMediaQuery.startsWith('@media')) {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n addBase({\n [selectorOrMediaQuery]: {\n ':root': css,\n },\n })\n } else {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n addBase({\n [selectorOrMediaQuery]: css,\n })\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n addUtilities(classRules, {\n variants: ['responsive'],\n })\n })\n}\n\nconst DIRECTIONS = {\n 'to top': 'top',\n 'to bottom': 'bottom',\n 'to left': 'left',\n 'to right': 'right',\n} as const\n\n/**\n * こういう感じのやつ。この時点では `--tailwind-gradient-` のような CSS 変数名になってない\n *\n * ```js\n * {\n * 'hoge1': 'linear-gradient(to top, ...)',\n * ...\n * }\n * ```\n */\ntype Utilities = Record<string, LinearGradient>\n\ntype LinearGradient = `linear-gradient(${string})`\n\nexport function getUtilities(\n gradients: Record<string, GradientMaterial>,\n effect: MergedEffect\n): Utilities {\n const effects = Object.entries(effect)\n const directions = Object.entries(DIRECTIONS) as [\n GradientDirection,\n Values<typeof DIRECTIONS>\n ][]\n\n return flatMapObject(gradients, (name, colors) =>\n directions.flatMap(([direction, className]) => {\n const toLinearGradient = (colors: GradientMaterial) => {\n const style = gradient(direction)(colors)\n\n if (!('backgroundImage' in style)) {\n throw new Error(\n `Could not generate linear-gradient() from ${name} ${direction} ${className}`\n )\n }\n\n // 本当は backgroundColor も同時に生成されるんだけど、使うにはそれ用の CSS 変数も一緒に作らないといけない\n // とりあえず background-image だけで動くのでこっちだけを利用する\n return style.backgroundImage as LinearGradient\n }\n\n return [\n // こういう感じのやつ\n // { 'hoge1': 'linear-gradient(to top, ...)' }\n [createUtilityName(name, className), toLinearGradient(colors)],\n\n // こういう感じのやつ\n // { 'hoge1--hover': 'linear-gradient(to top, ...)' }\n ...effects.map<[string, LinearGradient]>(([effectName, effect]) => [\n createUtilityName(name, className, effectName),\n toLinearGradient(applyEffectToGradient(effect)(colors)),\n ]),\n ]\n })\n )\n}\n\nfunction createUtilityName(\n gradientName: string,\n direction: Values<typeof DIRECTIONS>,\n suffix = ''\n) {\n return [camelToKebab(gradientName), direction, suffix]\n .filter(Boolean)\n .join('-')\n}\n","import plugin from 'tailwindcss/plugin'\nimport { TypographyDescriptor, TYPOGRAPHY_SIZE } from '@charcoal-ui/foundation'\nimport { halfLeading, mapObject, px } from '@charcoal-ui/utils'\n\nconst leadingCancel = {\n display: 'block',\n width: 0,\n height: 0,\n content: '\"\"',\n}\n\nconst typographyStyle = (style: TypographyDescriptor) => {\n const margin = -halfLeading(style)\n\n return {\n 'font-size': px(style.fontSize),\n 'line-height': px(style.lineHeight),\n\n /**\n * cancel leading\n *\n * @see https://yuyakinoshita.com/blog/2020/01/20/line-height-crop/\n */\n '&::before': {\n ...leadingCancel,\n marginTop: px(margin),\n },\n '&::after': {\n ...leadingCancel,\n marginBottom: px(margin),\n },\n }\n}\n\nconst typographyPlugin = plugin(({ addUtilities }) => {\n const typographyClasses = mapObject(TYPOGRAPHY_SIZE, (fontSize, style) => [\n `.typography-${fontSize}`,\n typographyStyle(style),\n ])\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n addUtilities(\n {\n ...typographyClasses,\n '.preserve-half-leading': {\n '&::before': {\n content: 'none',\n },\n '&::after': {\n content: 'none',\n },\n },\n },\n {\n variants: ['responsive'],\n }\n )\n})\n\nexport default typographyPlugin\n","/* eslint-disable @typescript-eslint/no-unsafe-assignment */\n/* eslint-disable @typescript-eslint/no-unsafe-member-access */\nimport light from '@charcoal-ui/theme/unstable-tokens/css-variables.json'\nimport {\n TailwindConfig,\n TailwindThemeFontSizes,\n} from 'tailwindcss/tailwind-config'\nimport {\n flattenKey as flattenKeys,\n mapDefaultKey as mapDefaultKeys,\n} from './util'\n\nexport function unstable_createTailwindConfigTokenV2() {\n const fontSize = Object.fromEntries(\n Object.entries(light.text['font-size']).flatMap(([k, v]) => {\n // text.fontSize.paragraph + text.lineHeight.paragraph -> text-paragraph\n if (typeof v === 'string') {\n return [\n [\n k,\n [\n v,\n // @ts-expect-error k is keyof line-height\n { lineHeight: light.text['line-height'][k] },\n ],\n ],\n ]\n }\n\n // text.fontSize.heading.s + text.lineHeight.heading.s -> text-heading-s\n return Object.entries(v as Record<string, string>).map(([kk, vv]) => {\n return [\n [k, kk].join('-'),\n [\n vv,\n // @ts-expect-error k is keyof line-height\n { lineHeight: light.text['line-height'][k][kk] },\n ],\n ]\n })\n })\n ) as TailwindThemeFontSizes\n\n // space.target.s -> p-target-s\n // space.gap.gapButtons -> p-gap-buttons\n const spacing = flattenKeys(light.space, (key) => !/(gap|padding)/.test(key))\n // color.container.default -> bg-container\n // color.container.hover -> bg-container-hover\n const colors = mapDefaultKeys(light.color)\n\n const config: TailwindConfig = {\n darkMode: 'media',\n theme: {\n // borderWidth.m -> border-m\n // borderWidth.focus.1 -> border-focus-1\n borderWidth: flattenKeys(light['border-width']),\n borderRadius: light.radius,\n borderColor: flattenKeys(colors.border),\n\n colors,\n\n fontSize,\n fontWeight: light.text['font-weight'],\n\n spacing: spacing,\n gap: spacing,\n width: light['paragraph-width'],\n },\n }\n\n return config\n}\n"],"mappings":"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","names":["light","mapObject","px","applyEffect","filterObject","flatMapObject","mapObject","applyEffect","filterObject","mapObject","cssVariablesV1","mapObject","filterObject","flatMapObject","applyEffect","plugin","flatMapObject","mapObject","cssVariableColorPlugin","plugin","colors","effect","plugin","mapObject","config","light","px","mapObject","theme","cssVariableColorPlugin"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tokenV2.d.ts","sourceRoot":"","sources":["../src/tokenV2.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,cAAc,EAEf,MAAM,6BAA6B,CAAA;AAMpC,wBAAgB,oCAAoC,mBA2DnD"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tokenV2.test.d.ts","sourceRoot":"","sources":["../src/tokenV2.test.ts"],"names":[],"mappings":""}
|
package/dist/util.d.ts
CHANGED
|
@@ -9,4 +9,8 @@ export declare function getDefaultKeyName(version: TailwindVersion): "DEFAULT" |
|
|
|
9
9
|
export declare function getVariantOption(version: TailwindVersion): Partial<TailwindConfig>;
|
|
10
10
|
export declare function assertAllThemeHaveSameKeys(themeMap: ThemeMap): void;
|
|
11
11
|
export declare function camelToKebab(value: string): string;
|
|
12
|
+
export declare const mapDefaultKey: <O extends object>(o: O) => any;
|
|
13
|
+
export declare const flattenKey: <O extends object>(o: O, join?: ((key: string) => boolean) | undefined) => {
|
|
14
|
+
[k: string]: any;
|
|
15
|
+
};
|
|
12
16
|
//# sourceMappingURL=util.d.ts.map
|
package/dist/util.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../src/util.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AACjE,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEnD;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,eAAe,yBAWzD;AAED,wBAAgB,gBAAgB,CAC9B,OAAO,EAAE,eAAe,GACvB,OAAO,CAAC,cAAc,CAAC,CAczB;AAMD,wBAAgB,0BAA0B,CAAC,QAAQ,EAAE,QAAQ,GAAG,IAAI,CAuBnE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,UAIzC"}
|
|
1
|
+
{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../src/util.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AACjE,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEnD;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,eAAe,yBAWzD;AAED,wBAAgB,gBAAgB,CAC9B,OAAO,EAAE,eAAe,GACvB,OAAO,CAAC,cAAc,CAAC,CAczB;AAMD,wBAAgB,0BAA0B,CAAC,QAAQ,EAAE,QAAQ,GAAG,IAAI,CAuBnE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,UAIzC;AAED,eAAO,MAAM,aAAa,iCAWzB,CAAA;AAED,eAAO,MAAM,UAAU,yCAER,MAAM,KAAK,OAAO;;CAYhC,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@charcoal-ui/tailwind-config",
|
|
3
|
-
"version": "4.0.0-
|
|
3
|
+
"version": "4.0.0-rc.1",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"main": "./dist/index.cjs.js",
|
|
6
6
|
"module": "./dist/index.esm.js",
|
|
@@ -17,21 +17,24 @@
|
|
|
17
17
|
"build:bundle": "FORCE_COLOR=1 tsup",
|
|
18
18
|
"build:dts": "tsc --project tsconfig.build.json --pretty --emitDeclarationOnly",
|
|
19
19
|
"typecheck": "tsc --project tsconfig.build.json --pretty --noEmit",
|
|
20
|
-
"clean": "rimraf dist .tsbuildinfo"
|
|
20
|
+
"clean": "rimraf dist .tsbuildinfo",
|
|
21
|
+
"test": "vitest run --passWithNoTests"
|
|
21
22
|
},
|
|
22
23
|
"devDependencies": {
|
|
24
|
+
"jsdom": "^24.1.0",
|
|
23
25
|
"postcss": "^8.4.5",
|
|
24
26
|
"postcss-selector-parser": "^6.0.9",
|
|
25
27
|
"react": "^18.0.0",
|
|
26
28
|
"rimraf": "^3.0.2",
|
|
27
29
|
"tailwindcss": "^3.0.5",
|
|
28
30
|
"tsup": "^6.5.0",
|
|
29
|
-
"typescript": "^4.9.5"
|
|
31
|
+
"typescript": "^4.9.5",
|
|
32
|
+
"vitest": "^2.0.2"
|
|
30
33
|
},
|
|
31
34
|
"dependencies": {
|
|
32
|
-
"@charcoal-ui/foundation": "^4.0.0-
|
|
33
|
-
"@charcoal-ui/theme": "^4.0.0-
|
|
34
|
-
"@charcoal-ui/utils": "^4.0.0-
|
|
35
|
+
"@charcoal-ui/foundation": "^4.0.0-rc.1",
|
|
36
|
+
"@charcoal-ui/theme": "^4.0.0-rc.1",
|
|
37
|
+
"@charcoal-ui/utils": "^4.0.0-rc.1"
|
|
35
38
|
},
|
|
36
39
|
"peerDependencies": {
|
|
37
40
|
"csstype": ">=3.0.0",
|
|
@@ -50,5 +53,5 @@
|
|
|
50
53
|
"url": "https://github.com/pixiv/charcoal.git",
|
|
51
54
|
"directory": "packages/tailwind-config"
|
|
52
55
|
},
|
|
53
|
-
"gitHead": "
|
|
56
|
+
"gitHead": "e2979aac203a72591a6e0ccf9642f502382c1895"
|
|
54
57
|
}
|