@charcoal-ui/tailwind-config 6.2.0 → 6.3.0-beta.1

package/dist/index.js

@@ -155,8 +155,9 @@ function colorsToTailwindConfig(version, colors, effects) {
 //#region src/colors/pluginTokenV1.ts
 function defineCssVariablesV1(themeMap) {
 	return (0, _charcoal_ui_utils.mapObject)(themeMap, (key, theme) => {
-		if (key.startsWith("@media")) return [key, { ":root": defineColorVariableCSS(theme) }];
-		else return [key, defineColorVariableCSS(theme)];
+		const css = defineColorVariableCSS(theme);
+		if (key.startsWith("@media")) return [key, { ":root": css }];
+		else return [key, css];
 	});
 }
 const defineColorVariableCSS = (theme) => {
@@ -249,7 +250,7 @@ function cssVariableColorPlugin(gradients, effects, selectorOrMediaQuery) {
 		const css = (0, _charcoal_ui_utils.mapKeys)(utilities, (name) => `${VAR_PREFIX}${name}`);
 		if (selectorOrMediaQuery.startsWith("@media")) addBase({ [selectorOrMediaQuery]: { ":root": css } });
 		else addBase({ [selectorOrMediaQuery]: css });
-		addUtilities(classRules, { variants: ["responsive"] });
+		addUtilities(classRules);
 	});
 }
 const DIRECTIONS = {
@@ -312,7 +313,7 @@ const typographyPlugin = (0, tailwindcss_plugin_js.default)(({ addUtilities }) =
 			"&::before": { content: "none" },
 			"&::after": { content: "none" }
 		}
-	}, { variants: ["responsive"] });
+	});
 });
 //#endregion
 //#region src/tokenV2.ts

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["cssVariableColorPlugin","TYPOGRAPHY_SIZE","light","flattenKeys","mapDefaultKeys","iconsV2","iconsV1","light","SPACING","COLUMN_UNIT","GUTTER_UNIT","BORDER_RADIUS","cssVariableColorPlugin","cssVariableGradientPlugin"],"sources":["../src/foundation.ts","../src/util.ts","../src/colors/utils.ts","../src/colors/toTailwindConfig.ts","../src/colors/pluginTokenV1.ts","../src/colors/plugin.ts","../src/focusring/index.ts","../src/gradient/plugin.ts","../src/typography/plugin.ts","../src/tokenV2.ts","../src/icons.ts","../src/index.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 { Config } from 'tailwindcss'\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(version: TailwindVersion): Partial<Config> {\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      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): Record<string, unknown> => {\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\n/**\n * `DEFAULT` はkey名に結合しない\n */\nexport const flattenKeyWithoutDefault = <O extends object>(\n  o: O,\n  join?: (key: string) => boolean,\n): Record<string, unknown> => {\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        const isDefaultKey = kk === 'DEFAULT' || kk === 'default'\n        const outputKey = isDefaultKey\n          ? key\n          : (join?.(key) ?? true)\n            ? [key, kk].join('-')\n            : kk\n        return [outputKey, vv]\n      })\n    }),\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 { applyEffect, filterObject, mapObject } from '@charcoal-ui/utils'\nimport type { Config } from 'tailwindcss'\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): NonNullable<Config['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 {\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 { 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 from 'tailwindcss/plugin.js'\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): ReturnType<typeof plugin> {\n  // `:root` 以外のケースで各 CSS Variable がどういう値を取るかを定義する\n  const { ':root': _defaultTheme, ...otherThemes } = themeMap\n  const definitions = defineCssVariables(otherThemes)\n\n  return plugin(({ addBase }) => {\n    addBase(definitions)\n\n    // styledのTokenInjector移植(background処理除く)\n    if (cssVariablesV1) {\n      const cssVariablesV1 = defineCssVariablesV1(themeMap)\n      // @ts-expect-error FIXME\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 plugin from 'tailwindcss/plugin.js'\nimport { CSSRuleObject } from 'tailwindcss/types/config'\n\nexport const createFocusRingUtilities = (): {\n  [key: string]: CSSRuleObject\n} => ({\n  '.ch-focus-ring': {\n    \"&:not(:disabled):not([aria-disabled]):focus-visible, &[aria-disabled='false']:focus-visible\":\n      {\n        outline: 'none',\n        boxShadow:\n          '0 0 0 4px var(--charcoal-color-border-focus-legacy, rgba(0, 150, 250, 0.32))',\n        transition: '0.2s box-shadow',\n      },\n  },\n})\n\nexport const charcoalFocusRing: ReturnType<typeof plugin> = plugin(\n  ({ addUtilities }) => {\n    addUtilities(createFocusRingUtilities())\n  },\n)\n","import plugin from 'tailwindcss/plugin.js'\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      addBase({\n        [selectorOrMediaQuery]: {\n          ':root': css,\n        },\n      })\n    } else {\n      addBase({\n        [selectorOrMediaQuery]: css,\n      })\n    }\n\n    addUtilities(classRules, {\n      // @ts-expect-error FIXME\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.js'\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  addUtilities(\n    {\n      ...typographyClasses,\n      '.preserve-half-leading': {\n        '&::before': {\n          content: 'none',\n        },\n        '&::after': {\n          content: 'none',\n        },\n      },\n    },\n    {\n      // @ts-expect-error FIXME\n      variants: ['responsive'],\n    },\n  )\n})\n\nexport default typographyPlugin\n","import light from '@charcoal-ui/theme/tokens/css-variables.json' with { type: 'json' }\nimport type { Config } from 'tailwindcss'\nimport {\n  flattenKey as flattenKeys,\n  flattenKeyWithoutDefault,\n  mapDefaultKey as mapDefaultKeys,\n} from './util'\n\nexport function unstable_createTailwindConfigTokenV2(): Omit<\n  Config,\n  'content'\n> {\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 NonNullable<Config['theme']>['fontSize']\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: Omit<Config, 'content'> = {\n    darkMode: 'media',\n    theme: {\n      // borderWidth.m -> border-m\n      // borderWidth.focus.1 -> border-focus-1\n      borderWidth: flattenKeyWithoutDefault({\n        'width-ch': flattenKeys(light['border-width']), // unstable border width token\n      }),\n      borderRadius: light.radius,\n      borderColor: flattenKeyWithoutDefault({ ch: flattenKeys(colors.border) }),\n\n      colors,\n\n      fontSize,\n      fontWeight: flattenKeys({ ch: light.text['font-weight'] }),\n\n      spacing,\n      gap: spacing,\n      width: light['paragraph-width'],\n    },\n  }\n\n  return config\n}\n","import plugin from 'tailwindcss/plugin.js'\nimport iconsV2 from '@charcoal-ui/icon-files/v2/datauri'\nimport iconsV1 from '@charcoal-ui/icon-files/v1/datauri'\nimport { CSSRuleObject } from 'tailwindcss/types/config'\n\nconst transformClassNameV2 = (fileName: string) => {\n  const [size, variant, name] = fileName.split('/')\n  return [\n    '.icon-v2',\n    name.replaceAll('.', '-'),\n    ...(variant === 'regular' ? [] : [variant]),\n    ...(size === '24' ? [] : [size]),\n  ]\n    .join('-')\n    .toLowerCase()\n}\n\nconst transformClassNameV1 = (fileName: string) => {\n  const [size, name] = fileName.split('/')\n  return [\n    '.icon-v1',\n    name.replaceAll('.', '-'),\n    ...(size === '24' ? [] : [size]),\n  ]\n    .join('-')\n    .toLowerCase()\n}\n\nexport const createIconUtilities = ({\n  v2 = false,\n}: {\n  v2?: boolean\n}): {\n  [key: string]: CSSRuleObject\n} => {\n  const newUtilities: { [key: string]: CSSRuleObject } = {}\n  const icons = v2 ? iconsV2 : iconsV1\n  for (const [fileName, { uri, isSetCurrentcolor }] of Object.entries(icons)) {\n    const className = v2\n      ? transformClassNameV2(fileName)\n      : transformClassNameV1(fileName)\n\n    newUtilities[className] = {\n      display: 'inline-block',\n      width: '1em',\n      height: '1em',\n      maskImage: `url(${uri})`,\n      maskSize: '100% 100%',\n      background: isSetCurrentcolor ? 'currentColor' : null,\n      aspectRatio: '1/1',\n    }\n  }\n  return newUtilities\n}\n\nexport const charcoalIconsV2: ReturnType<typeof plugin> = plugin(\n  ({ addUtilities }) => {\n    addUtilities(createIconUtilities({ v2: true }))\n  },\n)\n\nexport const charcoalIconsV1: ReturnType<typeof plugin> = plugin(\n  ({ addUtilities }) => {\n    addUtilities(createIconUtilities({ v2: false }))\n  },\n)\n","import { GRID_COUNT, mergeEffect } from './foundation'\n\nimport type { Config } from 'tailwindcss'\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 { charcoalFocusRing } from './focusring'\nimport cssVariableGradientPlugin from './gradient/plugin'\nimport typographyPlugin from './typography/plugin'\nimport { unstable_createTailwindConfigTokenV2 } from './tokenV2'\nimport { charcoalIconsV1, charcoalIconsV2 } from './icons'\nexport { unstable_createTailwindConfigTokenV2 }\n\ninterface Options {\n  version?: TailwindVersion\n  theme?: ThemeMap\n  cssVariablesV1?: boolean\n  unstableTokenV2?: boolean\n  iconsV2?: boolean\n  iconsV1?: boolean\n}\n\nexport function createTailwindConfig({\n  theme = { ':root': light },\n  version = 'v3',\n  cssVariablesV1 = true,\n  unstableTokenV2 = false,\n  iconsV2 = false,\n  iconsV1 = false,\n}: Options): Omit<Config, 'content'> {\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<NonNullable<Config['theme']>> = 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            extend: {\n              borderWidth: borderWidthV2,\n              fontWeight: fontWeightV2,\n              fontSize: fontSizeV2,\n            },\n          }\n        : {}),\n    },\n\n    ...getVariantOption(version),\n\n    corePlugins: {\n      lineHeight: false,\n    },\n    plugins: [\n      typographyPlugin,\n      charcoalFocusRing,\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      ...(iconsV2 ? [charcoalIconsV2] : []),\n      ...(iconsV1 ? [charcoalIconsV1] : []),\n    ],\n  }\n}\n\nexport const config: Omit<Config, 'content'> = createTailwindConfig({})\n\nexport default config\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["cssVariableColorPlugin","TYPOGRAPHY_SIZE","light","flattenKeys","mapDefaultKeys","iconsV2","iconsV1","light","SPACING","COLUMN_UNIT","GUTTER_UNIT","BORDER_RADIUS","cssVariableColorPlugin","cssVariableGradientPlugin"],"sources":["../src/foundation.ts","../src/util.ts","../src/colors/utils.ts","../src/colors/toTailwindConfig.ts","../src/colors/pluginTokenV1.ts","../src/colors/plugin.ts","../src/focusring/index.ts","../src/gradient/plugin.ts","../src/typography/plugin.ts","../src/tokenV2.ts","../src/icons.ts","../src/index.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 { Config } from 'tailwindcss'\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(version: TailwindVersion): Partial<Config> {\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      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): Record<string, unknown> => {\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\n/**\n * `DEFAULT` はkey名に結合しない\n */\nexport const flattenKeyWithoutDefault = <O extends object>(\n  o: O,\n  join?: (key: string) => boolean,\n): Record<string, unknown> => {\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        const isDefaultKey = kk === 'DEFAULT' || kk === 'default'\n        const outputKey = isDefaultKey\n          ? key\n          : (join?.(key) ?? true)\n            ? [key, kk].join('-')\n            : kk\n        return [outputKey, vv]\n      })\n    }),\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 { applyEffect, filterObject, mapObject } from '@charcoal-ui/utils'\nimport type { Config } from 'tailwindcss'\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): NonNullable<Config['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 {\n  applyEffect,\n  customPropertyToken,\n  filterObject,\n  flatMapObject,\n  mapObject,\n} from '@charcoal-ui/utils'\nimport { Definition, ThemeMap } from '../types'\nimport {\n  CharcoalAbstractTheme,\n  EffectType,\n  Key,\n  CharcoalTheme as Theme,\n} from '@charcoal-ui/theme'\n\ntype CssVariablesEntryValue =\n  Record<string, string> | { ':root': Record<string, string> }\n\nexport function defineCssVariablesV1(themeMap: ThemeMap) {\n  return mapObject(themeMap, (key, theme): [string, CssVariablesEntryValue] => {\n    const css = defineColorVariableCSS(theme)\n\n    if (key.startsWith('@media')) {\n      return [\n        key,\n        {\n          ':root': css,\n        },\n      ]\n    } else {\n      return [key, css]\n    }\n  }) as Definition\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 { 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 from 'tailwindcss/plugin.js'\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): ReturnType<typeof plugin> {\n  // `:root` 以外のケースで各 CSS Variable がどういう値を取るかを定義する\n  const { ':root': _defaultTheme, ...otherThemes } = themeMap\n  const definitions = defineCssVariables(otherThemes)\n\n  return plugin(({ addBase }) => {\n    addBase(definitions)\n\n    // styledのTokenInjector移植(background処理除く)\n    if (cssVariablesV1) {\n      const cssVariablesV1 = defineCssVariablesV1(themeMap)\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 plugin from 'tailwindcss/plugin.js'\nimport { CSSRuleObject } from 'tailwindcss/types/config'\n\nexport const createFocusRingUtilities = (): {\n  [key: string]: CSSRuleObject\n} => ({\n  '.ch-focus-ring': {\n    \"&:not(:disabled):not([aria-disabled]):focus-visible, &[aria-disabled='false']:focus-visible\":\n      {\n        outline: 'none',\n        boxShadow:\n          '0 0 0 4px var(--charcoal-color-border-focus-legacy, rgba(0, 150, 250, 0.32))',\n        transition: '0.2s box-shadow',\n      },\n  },\n})\n\nexport const charcoalFocusRing: ReturnType<typeof plugin> = plugin(\n  ({ addUtilities }) => {\n    addUtilities(createFocusRingUtilities())\n  },\n)\n","import plugin from 'tailwindcss/plugin.js'\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      addBase({\n        [selectorOrMediaQuery]: {\n          ':root': css,\n        },\n      })\n    } else {\n      addBase({\n        [selectorOrMediaQuery]: css,\n      })\n    }\n\n    // `responsive` variants are generated automatically by Tailwind 3's JIT engine for\n    // every utility, so no `variants` option is needed (Tailwind 3's `addUtilities` doesn't\n    // accept one — that was a Tailwind 1/2 API this call was never updated to drop).\n    addUtilities(classRules)\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.js'\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  // `responsive` variants are generated automatically by Tailwind 3's JIT engine for\n  // every utility, so no `variants` option is needed (Tailwind 3's `addUtilities` doesn't\n  // accept one — that was a Tailwind 1/2 API this call was never updated to drop).\n  addUtilities({\n    ...typographyClasses,\n    '.preserve-half-leading': {\n      '&::before': {\n        content: 'none',\n      },\n      '&::after': {\n        content: 'none',\n      },\n    },\n  })\n})\n\nexport default typographyPlugin\n","import light from '@charcoal-ui/theme/tokens/css-variables.json' with { type: 'json' }\nimport type { Config } from 'tailwindcss'\nimport {\n  flattenKey as flattenKeys,\n  flattenKeyWithoutDefault,\n  mapDefaultKey as mapDefaultKeys,\n} from './util'\n\nexport function unstable_createTailwindConfigTokenV2(): Omit<\n  Config,\n  'content'\n> {\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 NonNullable<Config['theme']>['fontSize']\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: Omit<Config, 'content'> = {\n    darkMode: 'media',\n    theme: {\n      // borderWidth.m -> border-m\n      // borderWidth.focus.1 -> border-focus-1\n      borderWidth: flattenKeyWithoutDefault({\n        'width-ch': flattenKeys(light['border-width']), // unstable border width token\n      }),\n      borderRadius: light.radius,\n      borderColor: flattenKeyWithoutDefault({ ch: flattenKeys(colors.border) }),\n\n      colors,\n\n      fontSize,\n      fontWeight: flattenKeys({ ch: light.text['font-weight'] }),\n\n      spacing,\n      gap: spacing,\n      width: light['paragraph-width'],\n    },\n  }\n\n  return config\n}\n","import plugin from 'tailwindcss/plugin.js'\nimport iconsV2 from '@charcoal-ui/icon-files/v2/datauri'\nimport iconsV1 from '@charcoal-ui/icon-files/v1/datauri'\nimport { CSSRuleObject } from 'tailwindcss/types/config'\n\nconst transformClassNameV2 = (fileName: string) => {\n  const [size, variant, name] = fileName.split('/')\n  return [\n    '.icon-v2',\n    name.replaceAll('.', '-'),\n    ...(variant === 'regular' ? [] : [variant]),\n    ...(size === '24' ? [] : [size]),\n  ]\n    .join('-')\n    .toLowerCase()\n}\n\nconst transformClassNameV1 = (fileName: string) => {\n  const [size, name] = fileName.split('/')\n  return [\n    '.icon-v1',\n    name.replaceAll('.', '-'),\n    ...(size === '24' ? [] : [size]),\n  ]\n    .join('-')\n    .toLowerCase()\n}\n\nexport const createIconUtilities = ({\n  v2 = false,\n}: {\n  v2?: boolean\n}): {\n  [key: string]: CSSRuleObject\n} => {\n  const newUtilities: { [key: string]: CSSRuleObject } = {}\n  const icons = v2 ? iconsV2 : iconsV1\n  for (const [fileName, { uri, isSetCurrentcolor }] of Object.entries(icons)) {\n    const className = v2\n      ? transformClassNameV2(fileName)\n      : transformClassNameV1(fileName)\n\n    newUtilities[className] = {\n      display: 'inline-block',\n      width: '1em',\n      height: '1em',\n      maskImage: `url(${uri})`,\n      maskSize: '100% 100%',\n      background: isSetCurrentcolor ? 'currentColor' : null,\n      aspectRatio: '1/1',\n    }\n  }\n  return newUtilities\n}\n\nexport const charcoalIconsV2: ReturnType<typeof plugin> = plugin(\n  ({ addUtilities }) => {\n    addUtilities(createIconUtilities({ v2: true }))\n  },\n)\n\nexport const charcoalIconsV1: ReturnType<typeof plugin> = plugin(\n  ({ addUtilities }) => {\n    addUtilities(createIconUtilities({ v2: false }))\n  },\n)\n","import { GRID_COUNT, mergeEffect } from './foundation'\n\nimport type { Config } from 'tailwindcss'\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 { charcoalFocusRing } from './focusring'\nimport cssVariableGradientPlugin from './gradient/plugin'\nimport typographyPlugin from './typography/plugin'\nimport { unstable_createTailwindConfigTokenV2 } from './tokenV2'\nimport { charcoalIconsV1, charcoalIconsV2 } from './icons'\nexport { unstable_createTailwindConfigTokenV2 }\n\ninterface Options {\n  version?: TailwindVersion\n  theme?: ThemeMap\n  cssVariablesV1?: boolean\n  unstableTokenV2?: boolean\n  iconsV2?: boolean\n  iconsV1?: boolean\n}\n\nexport function createTailwindConfig({\n  theme = { ':root': light },\n  version = 'v3',\n  cssVariablesV1 = true,\n  unstableTokenV2 = false,\n  iconsV2 = false,\n  iconsV1 = false,\n}: Options): Omit<Config, 'content'> {\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<NonNullable<Config['theme']>> = 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            extend: {\n              borderWidth: borderWidthV2,\n              fontWeight: fontWeightV2,\n              fontSize: fontSizeV2,\n            },\n          }\n        : {}),\n    },\n\n    ...getVariantOption(version),\n\n    corePlugins: {\n      lineHeight: false,\n    },\n    plugins: [\n      typographyPlugin,\n      charcoalFocusRing,\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      ...(iconsV2 ? [charcoalIconsV2] : []),\n      ...(iconsV1 ? [charcoalIconsV1] : []),\n    ],\n  }\n}\n\nexport const config: Omit<Config, 'content'> = createTailwindConfig({})\n\nexport default config\n"],"mappings":"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"}

package/dist/index.mjs

@@ -125,8 +125,9 @@ function colorsToTailwindConfig(version, colors, effects) {
 //#region src/colors/pluginTokenV1.ts
 function defineCssVariablesV1(themeMap) {
 	return mapObject(themeMap, (key, theme) => {
-		if (key.startsWith("@media")) return [key, { ":root": defineColorVariableCSS(theme) }];
-		else return [key, defineColorVariableCSS(theme)];
+		const css = defineColorVariableCSS(theme);
+		if (key.startsWith("@media")) return [key, { ":root": css }];
+		else return [key, css];
 	});
 }
 const defineColorVariableCSS = (theme) => {
@@ -219,7 +220,7 @@ function cssVariableColorPlugin(gradients, effects, selectorOrMediaQuery) {
 		const css = mapKeys(utilities, (name) => `${VAR_PREFIX}${name}`);
 		if (selectorOrMediaQuery.startsWith("@media")) addBase({ [selectorOrMediaQuery]: { ":root": css } });
 		else addBase({ [selectorOrMediaQuery]: css });
-		addUtilities(classRules, { variants: ["responsive"] });
+		addUtilities(classRules);
 	});
 }
 const DIRECTIONS = {
@@ -282,7 +283,7 @@ const typographyPlugin = plugin(({ addUtilities }) => {
 			"&::before": { content: "none" },
 			"&::after": { content: "none" }
 		}
-	}, { variants: ["responsive"] });
+	});
 });
 //#endregion
 //#region src/tokenV2.ts

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["cssVariableColorPlugin","light","flattenKeys","mapDefaultKeys","cssVariableColorPlugin","cssVariableGradientPlugin"],"sources":["../src/foundation.ts","../src/util.ts","../src/colors/utils.ts","../src/colors/toTailwindConfig.ts","../src/colors/pluginTokenV1.ts","../src/colors/plugin.ts","../src/focusring/index.ts","../src/gradient/plugin.ts","../src/typography/plugin.ts","../src/tokenV2.ts","../src/icons.ts","../src/index.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 { Config } from 'tailwindcss'\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(version: TailwindVersion): Partial<Config> {\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      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): Record<string, unknown> => {\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\n/**\n * `DEFAULT` はkey名に結合しない\n */\nexport const flattenKeyWithoutDefault = <O extends object>(\n  o: O,\n  join?: (key: string) => boolean,\n): Record<string, unknown> => {\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        const isDefaultKey = kk === 'DEFAULT' || kk === 'default'\n        const outputKey = isDefaultKey\n          ? key\n          : (join?.(key) ?? true)\n            ? [key, kk].join('-')\n            : kk\n        return [outputKey, vv]\n      })\n    }),\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 { applyEffect, filterObject, mapObject } from '@charcoal-ui/utils'\nimport type { Config } from 'tailwindcss'\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): NonNullable<Config['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 {\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 { 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 from 'tailwindcss/plugin.js'\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): ReturnType<typeof plugin> {\n  // `:root` 以外のケースで各 CSS Variable がどういう値を取るかを定義する\n  const { ':root': _defaultTheme, ...otherThemes } = themeMap\n  const definitions = defineCssVariables(otherThemes)\n\n  return plugin(({ addBase }) => {\n    addBase(definitions)\n\n    // styledのTokenInjector移植(background処理除く)\n    if (cssVariablesV1) {\n      const cssVariablesV1 = defineCssVariablesV1(themeMap)\n      // @ts-expect-error FIXME\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 plugin from 'tailwindcss/plugin.js'\nimport { CSSRuleObject } from 'tailwindcss/types/config'\n\nexport const createFocusRingUtilities = (): {\n  [key: string]: CSSRuleObject\n} => ({\n  '.ch-focus-ring': {\n    \"&:not(:disabled):not([aria-disabled]):focus-visible, &[aria-disabled='false']:focus-visible\":\n      {\n        outline: 'none',\n        boxShadow:\n          '0 0 0 4px var(--charcoal-color-border-focus-legacy, rgba(0, 150, 250, 0.32))',\n        transition: '0.2s box-shadow',\n      },\n  },\n})\n\nexport const charcoalFocusRing: ReturnType<typeof plugin> = plugin(\n  ({ addUtilities }) => {\n    addUtilities(createFocusRingUtilities())\n  },\n)\n","import plugin from 'tailwindcss/plugin.js'\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      addBase({\n        [selectorOrMediaQuery]: {\n          ':root': css,\n        },\n      })\n    } else {\n      addBase({\n        [selectorOrMediaQuery]: css,\n      })\n    }\n\n    addUtilities(classRules, {\n      // @ts-expect-error FIXME\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.js'\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  addUtilities(\n    {\n      ...typographyClasses,\n      '.preserve-half-leading': {\n        '&::before': {\n          content: 'none',\n        },\n        '&::after': {\n          content: 'none',\n        },\n      },\n    },\n    {\n      // @ts-expect-error FIXME\n      variants: ['responsive'],\n    },\n  )\n})\n\nexport default typographyPlugin\n","import light from '@charcoal-ui/theme/tokens/css-variables.json' with { type: 'json' }\nimport type { Config } from 'tailwindcss'\nimport {\n  flattenKey as flattenKeys,\n  flattenKeyWithoutDefault,\n  mapDefaultKey as mapDefaultKeys,\n} from './util'\n\nexport function unstable_createTailwindConfigTokenV2(): Omit<\n  Config,\n  'content'\n> {\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 NonNullable<Config['theme']>['fontSize']\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: Omit<Config, 'content'> = {\n    darkMode: 'media',\n    theme: {\n      // borderWidth.m -> border-m\n      // borderWidth.focus.1 -> border-focus-1\n      borderWidth: flattenKeyWithoutDefault({\n        'width-ch': flattenKeys(light['border-width']), // unstable border width token\n      }),\n      borderRadius: light.radius,\n      borderColor: flattenKeyWithoutDefault({ ch: flattenKeys(colors.border) }),\n\n      colors,\n\n      fontSize,\n      fontWeight: flattenKeys({ ch: light.text['font-weight'] }),\n\n      spacing,\n      gap: spacing,\n      width: light['paragraph-width'],\n    },\n  }\n\n  return config\n}\n","import plugin from 'tailwindcss/plugin.js'\nimport iconsV2 from '@charcoal-ui/icon-files/v2/datauri'\nimport iconsV1 from '@charcoal-ui/icon-files/v1/datauri'\nimport { CSSRuleObject } from 'tailwindcss/types/config'\n\nconst transformClassNameV2 = (fileName: string) => {\n  const [size, variant, name] = fileName.split('/')\n  return [\n    '.icon-v2',\n    name.replaceAll('.', '-'),\n    ...(variant === 'regular' ? [] : [variant]),\n    ...(size === '24' ? [] : [size]),\n  ]\n    .join('-')\n    .toLowerCase()\n}\n\nconst transformClassNameV1 = (fileName: string) => {\n  const [size, name] = fileName.split('/')\n  return [\n    '.icon-v1',\n    name.replaceAll('.', '-'),\n    ...(size === '24' ? [] : [size]),\n  ]\n    .join('-')\n    .toLowerCase()\n}\n\nexport const createIconUtilities = ({\n  v2 = false,\n}: {\n  v2?: boolean\n}): {\n  [key: string]: CSSRuleObject\n} => {\n  const newUtilities: { [key: string]: CSSRuleObject } = {}\n  const icons = v2 ? iconsV2 : iconsV1\n  for (const [fileName, { uri, isSetCurrentcolor }] of Object.entries(icons)) {\n    const className = v2\n      ? transformClassNameV2(fileName)\n      : transformClassNameV1(fileName)\n\n    newUtilities[className] = {\n      display: 'inline-block',\n      width: '1em',\n      height: '1em',\n      maskImage: `url(${uri})`,\n      maskSize: '100% 100%',\n      background: isSetCurrentcolor ? 'currentColor' : null,\n      aspectRatio: '1/1',\n    }\n  }\n  return newUtilities\n}\n\nexport const charcoalIconsV2: ReturnType<typeof plugin> = plugin(\n  ({ addUtilities }) => {\n    addUtilities(createIconUtilities({ v2: true }))\n  },\n)\n\nexport const charcoalIconsV1: ReturnType<typeof plugin> = plugin(\n  ({ addUtilities }) => {\n    addUtilities(createIconUtilities({ v2: false }))\n  },\n)\n","import { GRID_COUNT, mergeEffect } from './foundation'\n\nimport type { Config } from 'tailwindcss'\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 { charcoalFocusRing } from './focusring'\nimport cssVariableGradientPlugin from './gradient/plugin'\nimport typographyPlugin from './typography/plugin'\nimport { unstable_createTailwindConfigTokenV2 } from './tokenV2'\nimport { charcoalIconsV1, charcoalIconsV2 } from './icons'\nexport { unstable_createTailwindConfigTokenV2 }\n\ninterface Options {\n  version?: TailwindVersion\n  theme?: ThemeMap\n  cssVariablesV1?: boolean\n  unstableTokenV2?: boolean\n  iconsV2?: boolean\n  iconsV1?: boolean\n}\n\nexport function createTailwindConfig({\n  theme = { ':root': light },\n  version = 'v3',\n  cssVariablesV1 = true,\n  unstableTokenV2 = false,\n  iconsV2 = false,\n  iconsV1 = false,\n}: Options): Omit<Config, 'content'> {\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<NonNullable<Config['theme']>> = 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            extend: {\n              borderWidth: borderWidthV2,\n              fontWeight: fontWeightV2,\n              fontSize: fontSizeV2,\n            },\n          }\n        : {}),\n    },\n\n    ...getVariantOption(version),\n\n    corePlugins: {\n      lineHeight: false,\n    },\n    plugins: [\n      typographyPlugin,\n      charcoalFocusRing,\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      ...(iconsV2 ? [charcoalIconsV2] : []),\n      ...(iconsV1 ? [charcoalIconsV1] : []),\n    ],\n  }\n}\n\nexport const config: Omit<Config, 'content'> = createTailwindConfig({})\n\nexport default config\n"],"mappings":"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"}
+{"version":3,"file":"index.mjs","names":["cssVariableColorPlugin","light","flattenKeys","mapDefaultKeys","cssVariableColorPlugin","cssVariableGradientPlugin"],"sources":["../src/foundation.ts","../src/util.ts","../src/colors/utils.ts","../src/colors/toTailwindConfig.ts","../src/colors/pluginTokenV1.ts","../src/colors/plugin.ts","../src/focusring/index.ts","../src/gradient/plugin.ts","../src/typography/plugin.ts","../src/tokenV2.ts","../src/icons.ts","../src/index.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 { Config } from 'tailwindcss'\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(version: TailwindVersion): Partial<Config> {\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      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): Record<string, unknown> => {\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\n/**\n * `DEFAULT` はkey名に結合しない\n */\nexport const flattenKeyWithoutDefault = <O extends object>(\n  o: O,\n  join?: (key: string) => boolean,\n): Record<string, unknown> => {\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        const isDefaultKey = kk === 'DEFAULT' || kk === 'default'\n        const outputKey = isDefaultKey\n          ? key\n          : (join?.(key) ?? true)\n            ? [key, kk].join('-')\n            : kk\n        return [outputKey, vv]\n      })\n    }),\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 { applyEffect, filterObject, mapObject } from '@charcoal-ui/utils'\nimport type { Config } from 'tailwindcss'\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): NonNullable<Config['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 {\n  applyEffect,\n  customPropertyToken,\n  filterObject,\n  flatMapObject,\n  mapObject,\n} from '@charcoal-ui/utils'\nimport { Definition, ThemeMap } from '../types'\nimport {\n  CharcoalAbstractTheme,\n  EffectType,\n  Key,\n  CharcoalTheme as Theme,\n} from '@charcoal-ui/theme'\n\ntype CssVariablesEntryValue =\n  Record<string, string> | { ':root': Record<string, string> }\n\nexport function defineCssVariablesV1(themeMap: ThemeMap) {\n  return mapObject(themeMap, (key, theme): [string, CssVariablesEntryValue] => {\n    const css = defineColorVariableCSS(theme)\n\n    if (key.startsWith('@media')) {\n      return [\n        key,\n        {\n          ':root': css,\n        },\n      ]\n    } else {\n      return [key, css]\n    }\n  }) as Definition\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 { 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 from 'tailwindcss/plugin.js'\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): ReturnType<typeof plugin> {\n  // `:root` 以外のケースで各 CSS Variable がどういう値を取るかを定義する\n  const { ':root': _defaultTheme, ...otherThemes } = themeMap\n  const definitions = defineCssVariables(otherThemes)\n\n  return plugin(({ addBase }) => {\n    addBase(definitions)\n\n    // styledのTokenInjector移植(background処理除く)\n    if (cssVariablesV1) {\n      const cssVariablesV1 = defineCssVariablesV1(themeMap)\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 plugin from 'tailwindcss/plugin.js'\nimport { CSSRuleObject } from 'tailwindcss/types/config'\n\nexport const createFocusRingUtilities = (): {\n  [key: string]: CSSRuleObject\n} => ({\n  '.ch-focus-ring': {\n    \"&:not(:disabled):not([aria-disabled]):focus-visible, &[aria-disabled='false']:focus-visible\":\n      {\n        outline: 'none',\n        boxShadow:\n          '0 0 0 4px var(--charcoal-color-border-focus-legacy, rgba(0, 150, 250, 0.32))',\n        transition: '0.2s box-shadow',\n      },\n  },\n})\n\nexport const charcoalFocusRing: ReturnType<typeof plugin> = plugin(\n  ({ addUtilities }) => {\n    addUtilities(createFocusRingUtilities())\n  },\n)\n","import plugin from 'tailwindcss/plugin.js'\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      addBase({\n        [selectorOrMediaQuery]: {\n          ':root': css,\n        },\n      })\n    } else {\n      addBase({\n        [selectorOrMediaQuery]: css,\n      })\n    }\n\n    // `responsive` variants are generated automatically by Tailwind 3's JIT engine for\n    // every utility, so no `variants` option is needed (Tailwind 3's `addUtilities` doesn't\n    // accept one — that was a Tailwind 1/2 API this call was never updated to drop).\n    addUtilities(classRules)\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.js'\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  // `responsive` variants are generated automatically by Tailwind 3's JIT engine for\n  // every utility, so no `variants` option is needed (Tailwind 3's `addUtilities` doesn't\n  // accept one — that was a Tailwind 1/2 API this call was never updated to drop).\n  addUtilities({\n    ...typographyClasses,\n    '.preserve-half-leading': {\n      '&::before': {\n        content: 'none',\n      },\n      '&::after': {\n        content: 'none',\n      },\n    },\n  })\n})\n\nexport default typographyPlugin\n","import light from '@charcoal-ui/theme/tokens/css-variables.json' with { type: 'json' }\nimport type { Config } from 'tailwindcss'\nimport {\n  flattenKey as flattenKeys,\n  flattenKeyWithoutDefault,\n  mapDefaultKey as mapDefaultKeys,\n} from './util'\n\nexport function unstable_createTailwindConfigTokenV2(): Omit<\n  Config,\n  'content'\n> {\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 NonNullable<Config['theme']>['fontSize']\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: Omit<Config, 'content'> = {\n    darkMode: 'media',\n    theme: {\n      // borderWidth.m -> border-m\n      // borderWidth.focus.1 -> border-focus-1\n      borderWidth: flattenKeyWithoutDefault({\n        'width-ch': flattenKeys(light['border-width']), // unstable border width token\n      }),\n      borderRadius: light.radius,\n      borderColor: flattenKeyWithoutDefault({ ch: flattenKeys(colors.border) }),\n\n      colors,\n\n      fontSize,\n      fontWeight: flattenKeys({ ch: light.text['font-weight'] }),\n\n      spacing,\n      gap: spacing,\n      width: light['paragraph-width'],\n    },\n  }\n\n  return config\n}\n","import plugin from 'tailwindcss/plugin.js'\nimport iconsV2 from '@charcoal-ui/icon-files/v2/datauri'\nimport iconsV1 from '@charcoal-ui/icon-files/v1/datauri'\nimport { CSSRuleObject } from 'tailwindcss/types/config'\n\nconst transformClassNameV2 = (fileName: string) => {\n  const [size, variant, name] = fileName.split('/')\n  return [\n    '.icon-v2',\n    name.replaceAll('.', '-'),\n    ...(variant === 'regular' ? [] : [variant]),\n    ...(size === '24' ? [] : [size]),\n  ]\n    .join('-')\n    .toLowerCase()\n}\n\nconst transformClassNameV1 = (fileName: string) => {\n  const [size, name] = fileName.split('/')\n  return [\n    '.icon-v1',\n    name.replaceAll('.', '-'),\n    ...(size === '24' ? [] : [size]),\n  ]\n    .join('-')\n    .toLowerCase()\n}\n\nexport const createIconUtilities = ({\n  v2 = false,\n}: {\n  v2?: boolean\n}): {\n  [key: string]: CSSRuleObject\n} => {\n  const newUtilities: { [key: string]: CSSRuleObject } = {}\n  const icons = v2 ? iconsV2 : iconsV1\n  for (const [fileName, { uri, isSetCurrentcolor }] of Object.entries(icons)) {\n    const className = v2\n      ? transformClassNameV2(fileName)\n      : transformClassNameV1(fileName)\n\n    newUtilities[className] = {\n      display: 'inline-block',\n      width: '1em',\n      height: '1em',\n      maskImage: `url(${uri})`,\n      maskSize: '100% 100%',\n      background: isSetCurrentcolor ? 'currentColor' : null,\n      aspectRatio: '1/1',\n    }\n  }\n  return newUtilities\n}\n\nexport const charcoalIconsV2: ReturnType<typeof plugin> = plugin(\n  ({ addUtilities }) => {\n    addUtilities(createIconUtilities({ v2: true }))\n  },\n)\n\nexport const charcoalIconsV1: ReturnType<typeof plugin> = plugin(\n  ({ addUtilities }) => {\n    addUtilities(createIconUtilities({ v2: false }))\n  },\n)\n","import { GRID_COUNT, mergeEffect } from './foundation'\n\nimport type { Config } from 'tailwindcss'\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 { charcoalFocusRing } from './focusring'\nimport cssVariableGradientPlugin from './gradient/plugin'\nimport typographyPlugin from './typography/plugin'\nimport { unstable_createTailwindConfigTokenV2 } from './tokenV2'\nimport { charcoalIconsV1, charcoalIconsV2 } from './icons'\nexport { unstable_createTailwindConfigTokenV2 }\n\ninterface Options {\n  version?: TailwindVersion\n  theme?: ThemeMap\n  cssVariablesV1?: boolean\n  unstableTokenV2?: boolean\n  iconsV2?: boolean\n  iconsV1?: boolean\n}\n\nexport function createTailwindConfig({\n  theme = { ':root': light },\n  version = 'v3',\n  cssVariablesV1 = true,\n  unstableTokenV2 = false,\n  iconsV2 = false,\n  iconsV1 = false,\n}: Options): Omit<Config, 'content'> {\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<NonNullable<Config['theme']>> = 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            extend: {\n              borderWidth: borderWidthV2,\n              fontWeight: fontWeightV2,\n              fontSize: fontSizeV2,\n            },\n          }\n        : {}),\n    },\n\n    ...getVariantOption(version),\n\n    corePlugins: {\n      lineHeight: false,\n    },\n    plugins: [\n      typographyPlugin,\n      charcoalFocusRing,\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      ...(iconsV2 ? [charcoalIconsV2] : []),\n      ...(iconsV1 ? [charcoalIconsV1] : []),\n    ],\n  }\n}\n\nexport const config: Omit<Config, 'content'> = createTailwindConfig({})\n\nexport default config\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@charcoal-ui/tailwind-config",
-  "version": "6.2.0",
+  "version": "6.3.0-beta.1",
   "license": "Apache-2.0",
   "type": "commonjs",
   "main": "./dist/index.js",
@@ -26,10 +26,10 @@
     "tailwindcss": "^3.4.17"
   },
   "dependencies": {
-    "@charcoal-ui/foundation": "6.2.0",
-    "@charcoal-ui/icon-files": "6.2.0",
-    "@charcoal-ui/theme": "6.2.0",
-    "@charcoal-ui/utils": "6.2.0"
+    "@charcoal-ui/foundation": "6.3.0-beta.1",
+    "@charcoal-ui/icon-files": "6.3.0-beta.1",
+    "@charcoal-ui/utils": "6.3.0-beta.1",
+    "@charcoal-ui/theme": "6.3.0-beta.1"
   },
   "peerDependencies": {
     "csstype": ">=3.0.0",

package/src/colors/plugin.ts

@@ -30,7 +30,6 @@ export default function cssVariableColorPlugin(
     // styledのTokenInjector移植(background処理除く)
     if (cssVariablesV1) {
       const cssVariablesV1 = defineCssVariablesV1(themeMap)
-      // @ts-expect-error FIXME
       addBase(cssVariablesV1)
     }
   })

package/src/colors/pluginTokenV1.ts

@@ -5,7 +5,7 @@ import {
   flatMapObject,
   mapObject,
 } from '@charcoal-ui/utils'
-import { ThemeMap } from '../types'
+import { Definition, ThemeMap } from '../types'
 import {
   CharcoalAbstractTheme,
   EffectType,
@@ -13,20 +13,24 @@ import {
   CharcoalTheme as Theme,
 } from '@charcoal-ui/theme'
 
+type CssVariablesEntryValue =
+  Record<string, string> | { ':root': Record<string, string> }
+
 export function defineCssVariablesV1(themeMap: ThemeMap) {
-  // @ts-expect-error FIXME
-  return mapObject(themeMap, (key, theme) => {
+  return mapObject(themeMap, (key, theme): [string, CssVariablesEntryValue] => {
+    const css = defineColorVariableCSS(theme)
+
     if (key.startsWith('@media')) {
       return [
         key,
         {
-          ':root': defineColorVariableCSS(theme),
+          ':root': css,
         },
       ]
     } else {
-      return [key, defineColorVariableCSS(theme)]
+      return [key, css]
     }
-  })
+  }) as Definition
 }
 
 export const defineColorVariableCSS = (theme: Theme) => {

package/src/docs/colors/Colors.tsx

@@ -55,8 +55,9 @@ export const Colors: React.FC = () => {
     <div className="space-y-24">
       {Object.entries(colors).map(([colorName, values]) => (
         <div className="flex" key={colorName}>
-          {/* @ts-expect-error FIXME */}
-          {typeof values === 'object' && 'DEFAULT' in values ? (
+          {values !== null &&
+          typeof values === 'object' &&
+          'DEFAULT' in values ? (
             <>
               <ColorBox
                 bgColorClass={`bg-${colorName}`}

package/src/gradient/plugin.ts

@@ -41,10 +41,10 @@ export default function cssVariableColorPlugin(
       })
     }
 
-    addUtilities(classRules, {
-      // @ts-expect-error FIXME
-      variants: ['responsive'],
-    })
+    // `responsive` variants are generated automatically by Tailwind 3's JIT engine for
+    // every utility, so no `variants` option is needed (Tailwind 3's `addUtilities` doesn't
+    // accept one — that was a Tailwind 1/2 API this call was never updated to drop).
+    addUtilities(classRules)
   })
 }
 

package/src/icons.test.ts

@@ -20,8 +20,9 @@ describe('createTailwindConfigIconsV2', async () => {
     plugins: [charcoalIconsV2],
   }
   const result = await TailwindBuild.run(
-    // @ts-expect-error FIXME: missing content
-    config,
+    // `config` has no `content` field; `content: []` is fine here because
+    // TailwindBuild disables purge via `safelist`.
+    { ...config, content: [] },
     `
         @import 'tailwindcss/base';
         @import 'tailwindcss/utilities';
@@ -42,8 +43,9 @@ describe('createTailwindConfigIconsV1', async () => {
     plugins: [charcoalIconsV1],
   }
   const result = await TailwindBuild.run(
-    // @ts-expect-error FIXME: missing content
-    config,
+    // `config` has no `content` field; `content: []` is fine here because
+    // TailwindBuild disables purge via `safelist`.
+    { ...config, content: [] },
     `
         @import 'tailwindcss/base';
         @import 'tailwindcss/utilities';

package/src/index.test.ts

@@ -19,8 +19,9 @@ describe('tailwind.config.js', () => {
 
   beforeAll(async () => {
     result = await TailwindBuild.run(
-      // @ts-expect-error FIXME: missing content
-      defaultConfig,
+      // `defaultConfig` omits `content` since consumers supply their own;
+      // `content: []` is fine here because TailwindBuild disables purge via `safelist`.
+      { ...defaultConfig, content: [] },
       `
         @import 'tailwindcss/base';
         @import 'tailwindcss/utilities';

package/src/tokenV2.test.ts

@@ -4,8 +4,9 @@ import { unstable_createTailwindConfigTokenV2 } from './tokenV2'
 describe('unstable_createTailwindConfigTokenV2', async () => {
   const config = unstable_createTailwindConfigTokenV2()
   const result = await TailwindBuild.run(
-    // @ts-expect-error FIXME: missing content
-    config,
+    // `config` omits `content` since consumers supply their own;
+    // `content: []` is fine here because TailwindBuild disables purge via `safelist`.
+    { ...config, content: [] },
     `
         @import 'tailwindcss/base';
         @import 'tailwindcss/utilities';

package/src/typography/plugin.ts

@@ -38,23 +38,20 @@ const typographyPlugin = plugin(({ addUtilities }) => {
     typographyStyle(style),
   ])
 
-  addUtilities(
-    {
-      ...typographyClasses,
-      '.preserve-half-leading': {
-        '&::before': {
-          content: 'none',
-        },
-        '&::after': {
-          content: 'none',
-        },
+  // `responsive` variants are generated automatically by Tailwind 3's JIT engine for
+  // every utility, so no `variants` option is needed (Tailwind 3's `addUtilities` doesn't
+  // accept one — that was a Tailwind 1/2 API this call was never updated to drop).
+  addUtilities({
+    ...typographyClasses,
+    '.preserve-half-leading': {
+      '&::before': {
+        content: 'none',
+      },
+      '&::after': {
+        content: 'none',
       },
     },
-    {
-      // @ts-expect-error FIXME
-      variants: ['responsive'],
-    },
-  )
+  })
 })
 
 export default typographyPlugin