@exem-ui/tailwindcss3 0.2.0-next.20260227074038 → 0.2.0-next.20260227074335

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/README.en.md +5 -18
  2. package/README.md +4 -21
  3. package/dist/{chunk-GQI4KKR5.mjs → chunk-JMQYNTP2.mjs} +2 -2
  4. package/dist/{chunk-GQI4KKR5.mjs.map → chunk-JMQYNTP2.mjs.map} +1 -1
  5. package/dist/index.d.mts +3 -30
  6. package/dist/index.d.ts +3 -30
  7. package/dist/index.mjs +1 -1
  8. package/dist/plugin.d.mts +33 -0
  9. package/dist/plugin.d.ts +33 -0
  10. package/dist/{preset.js → plugin.js} +3 -10
  11. package/dist/plugin.js.map +1 -0
  12. package/dist/plugin.mjs +3 -0
  13. package/dist/plugin.mjs.map +1 -0
  14. package/package.json +6 -6
  15. package/dist/preset.d.mts +0 -21
  16. package/dist/preset.d.ts +0 -21
  17. package/dist/preset.js.map +0 -1
  18. package/dist/preset.mjs +0 -12
  19. package/dist/preset.mjs.map +0 -1
package/README.en.md CHANGED
@@ -19,11 +19,11 @@
19
19
 
20
20
  ## Introduction
21
21
 
22
- `@exem-ui/tailwindcss3` is a plugin that brings the EXEM Design System's colors, radii, shadows, and more directly into your Tailwind CSS v3 project. Apply the full EXEM theme with a single line using the Preset approach.
22
+ `@exem-ui/tailwindcss3` is a plugin that brings the EXEM Design System's colors, radii, shadows, and more directly into your Tailwind CSS v3 project.
23
23
 
24
24
  ## Key Features
25
25
 
26
- - **Preset-based Setup** — Apply the full theme with one line in `tailwind.config`
26
+ - **Plugin-based Setup** — Apply the full theme with one line in `tailwind.config`
27
27
  - **450+ Design Tokens** — Colors, radii, shadows, breakpoints auto-mapped
28
28
  - **CSS Variable Sync** — Automatically synchronized with `@exem-ui/core` CSS custom properties
29
29
  - **Zero Runtime** — Processed at build time with no runtime overhead
@@ -47,25 +47,12 @@ yarn add @exem-ui/tailwindcss3 @exem-ui/core
47
47
 
48
48
  ## Usage
49
49
 
50
- ### Preset (Recommended)
51
-
52
- ```ts
53
- // tailwind.config.ts
54
- import { exemPreset } from '@exem-ui/tailwindcss3/preset';
55
-
56
- export default {
57
- presets: [exemPreset],
58
- content: ['./src/**/*.{ts,tsx}'],
59
- };
60
- ```
61
-
62
- ### Plugin
63
-
64
50
  ```ts
65
51
  // tailwind.config.ts
66
- import { exemPlugin } from '@exem-ui/tailwindcss3';
52
+ import exemPlugin from '@exem-ui/tailwindcss3/plugin';
67
53
 
68
54
  export default {
55
+ darkMode: 'class',
69
56
  plugins: [exemPlugin],
70
57
  content: ['./src/**/*.{ts,tsx}'],
71
58
  };
@@ -85,7 +72,7 @@ export default {
85
72
  | Path | Description |
86
73
  |------|-------------|
87
74
  | `@exem-ui/tailwindcss3` | Main entry (plugin) |
88
- | `@exem-ui/tailwindcss3/preset` | Tailwind Preset |
75
+ | `@exem-ui/tailwindcss3/plugin` | Plugin direct import |
89
76
 
90
77
  ## Related Packages
91
78
 
package/README.md CHANGED
@@ -19,11 +19,11 @@
19
19
 
20
20
  ## 소개
21
21
 
22
- `@exem-ui/tailwindcss3`는 EXEM 디자인 시스템의 색상, 반경, 그림자 등을 Tailwind CSS v3 프로젝트에서 바로 사용할 수 있게 해주는 플러그인입니다. Preset 방식으로 한 줄 설정만으로 EXEM 테마를 적용할 수 있습니다.
22
+ `@exem-ui/tailwindcss3`는 EXEM 디자인 시스템의 색상, 반경, 그림자 등을 Tailwind CSS v3 프로젝트에서 바로 사용할 수 있게 해주는 플러그인입니다.
23
23
 
24
24
  ## 주요 특징
25
25
 
26
- - **Preset 기반 설정** — `tailwind.config`에 한 줄 추가로 전체 테마 적용
26
+ - **플러그인 기반 설정** — `tailwind.config`에 한 줄 추가로 전체 테마 적용
27
27
  - **450+ 디자인 토큰** — 색상, 반경, 그림자, 브레이크포인트 자동 매핑
28
28
  - **CSS 변수 연동** — `@exem-ui/core`의 CSS 커스텀 프로퍼티와 자동 동기화
29
29
  - **Zero Runtime** — 빌드 타임에 처리되어 런타임 오버헤드 없음
@@ -49,34 +49,17 @@ yarn add @exem-ui/tailwindcss3 @exem-ui/core
49
49
 
50
50
  ### 1. Tailwind 설정
51
51
 
52
- #### Preset 방식 (권장)
53
-
54
52
  ```ts
55
53
  // tailwind.config.ts
56
- import { exemPreset } from '@exem-ui/tailwindcss3/preset';
54
+ import exemPlugin from '@exem-ui/tailwindcss3/plugin';
57
55
 
58
56
  export default {
59
- presets: [exemPreset],
60
57
  darkMode: 'class',
61
- content: ['./src/**/*.{ts,tsx}'],
62
- };
63
- ```
64
-
65
- #### 플러그인 방식
66
-
67
- ```ts
68
- // tailwind.config.ts
69
- import { exemPlugin } from '@exem-ui/tailwindcss3';
70
-
71
- export default {
72
58
  plugins: [exemPlugin],
73
- darkMode: 'class',
74
59
  content: ['./src/**/*.{ts,tsx}'],
75
60
  };
76
61
  ```
77
62
 
78
- > Preset 방식은 플러그인 등록 + 테마 확장을 한 번에 처리합니다.
79
-
80
63
  ### 2. CSS 설정
81
64
 
82
65
  ```css
@@ -102,7 +85,7 @@ export default {
102
85
  | 경로 | 설명 |
103
86
  |------|------|
104
87
  | `@exem-ui/tailwindcss3` | 메인 엔트리 (플러그인) |
105
- | `@exem-ui/tailwindcss3/preset` | Tailwind Preset (권장) |
88
+ | `@exem-ui/tailwindcss3/plugin` | 플러그인 직접 import |
106
89
 
107
90
  ## 관련 패키지
108
91
 
package/dist/{chunk-GQI4KKR5.mjs → chunk-JMQYNTP2.mjs} RENAMED
@@ -92,5 +92,5 @@ var plugin_default = plugin(
92
92
  );
93
93
 
94
94
  export { plugin_default };
95
- //# sourceMappingURL=chunk-GQI4KKR5.mjs.map
96
- //# sourceMappingURL=chunk-GQI4KKR5.mjs.map
95
+ //# sourceMappingURL=chunk-JMQYNTP2.mjs.map
96
+ //# sourceMappingURL=chunk-JMQYNTP2.mjs.map
package/dist/{chunk-GQI4KKR5.mjs.map → chunk-JMQYNTP2.mjs.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/plugin.ts"],"names":[],"mappings":";;;;AAgBA,SAAS,gBAAgB,SAAA,EAAkC;AACzD,EAAA,MAAM,QAAA,uBAAe,GAAA,EAAY;AAEjC,EAAA,KAAA,MAAW,OAAO,SAAA,EAAW;AAC3B,IAAA,MAAM,SAAA,GAAY,GAAA,CAAI,KAAA,CAAM,GAAG,EAAE,CAAC,CAAA;AAClC,IAAA,IAAI,SAAA,EAAW;AACb,MAAA,QAAA,CAAS,IAAI,SAAS,CAAA;AAAA,IACxB;AAAA,EACF;AAEA,EAAA,OAAO,QAAA;AACT;AAOA,SAAS,wBAAA,GAA2B;AAClC,EAAA,MAAM,SAAA,GAAY,MAAA,CAAO,IAAA,CAAK,UAAU,CAAA;AACxC,EAAA,MAAM,UAAA,GAAa,MAAA,CAAO,IAAA,CAAK,MAAM,CAAA;AACrC,EAAA,MAAM,UAAA,GAAa,MAAA,CAAO,IAAA,CAAK,MAAM,CAAA;AAErC,EAAA,MAAM,aAAA,GAAgB,gBAAgB,SAAS,CAAA;AAC/C,EAAA,MAAM,WAAuC,EAAC;AAG9C,EAAA,KAAA,MAAW,UAAU,aAAA,EAAe;AAClC,IAAA,QAAA,CAAS,IAAA,CAAK,EAAE,OAAA,EAAS,IAAI,OAAO,CAAA,IAAA,EAAO,MAAM,CAAA,IAAA,CAAM,CAAA,EAAG,CAAA;AAAA,EAC5D;AAGA,EAAA,KAAA,MAAW,UAAU,aAAA,EAAe;AAClC,IAAA,QAAA,CAAS,IAAA,CAAK,EAAE,OAAA,EAAS,IAAI,OAAO,CAAA,MAAA,EAAS,MAAM,CAAA,IAAA,CAAM,CAAA,EAAG,CAAA;AAAA,EAC9D;AAGA,EAAA,KAAA,MAAW,UAAU,aAAA,EAAe;AAClC,IAAA,QAAA,CAAS,IAAA,CAAK,EAAE,OAAA,EAAS,IAAI,OAAO,CAAA,QAAA,EAAW,MAAM,CAAA,IAAA,CAAM,CAAA,EAAG,CAAA;AAAA,EAChE;AAGA,EAAA,KAAA,MAAW,OAAO,UAAA,EAAY;AAC5B,IAAA,QAAA,CAAS,IAAA,CAAK,EAAE,OAAA,EAAS,IAAI,OAAO,CAAA,SAAA,EAAY,GAAG,CAAA,CAAA,CAAG,CAAA,EAAG,CAAA;AAAA,EAC3D;AAGA,EAAA,KAAA,MAAW,OAAO,UAAA,EAAY;AAC5B,IAAA,QAAA,CAAS,IAAA,CAAK,EAAE,OAAA,EAAS,IAAI,OAAO,CAAA,QAAA,EAAW,GAAG,CAAA,CAAA,CAAG,CAAA,EAAG,CAAA;AAAA,EAC1D;AAGA,EAAA,QAAA,CAAS,IAAA,CAAK,EAAE,OAAA,EAAS,uCAAA,EAAyC,CAAA;AAClE,EAAA,QAAA,CAAS,IAAA,CAAK,EAAE,OAAA,EAAS,aAAA,EAAe,CAAA;AAGxC,EAAA,MAAM,iBAAiB,MAAA,CAAO,IAAA,CAAK,UAAU,CAAA,CAAE,KAAK,GAAG,CAAA;AACvD,EAAA,QAAA,CAAS,IAAA,CAAK,EAAE,OAAA,EAAS,IAAI,OAAO,CAAA,OAAA,EAAU,cAAc,CAAA,EAAA,CAAI,CAAA,EAAG,CAAA;AAEnE,EAAA,OAAO,QAAA;AACT;AA2BA,IAAO,cAAA,GAAQ,MAAA;AAAA,EACb,CAAC,EAAE,cAAA,EAAgB,YAAA,EAAa,KAAM;AAEpC,IAAA,MAAM,gBAAwD,EAAC;AAC/D,IAAA,KAAA,MAAW,CAAC,IAAA,EAAM,KAAK,KAAK,MAAA,CAAO,OAAA,CAAQ,UAAU,CAAA,EAAG;AACtD,MAAA,aAAA,CAAc,CAAA,MAAA,EAAS,IAAI,CAAA,CAAE,CAAA,GAAI;AAAA,QAC/B,eAAe,KAAA,CAAM,UAAA;AAAA,QACrB,eAAe,KAAA,CAAM;AAAA,OACvB;AAAA,IACF;AACA,IAAA,YAAA,CAAa,aAAa,CAAA;AAG1B,IAAA,YAAA,CAAa;AAAA,MACX,YAAA,EAAc;AAAA,QACZ,aAAA,EAAe;AAAA;AACjB,KACD,CAAA;AAED,IAAA,KAAA,MAAW,CAAC,IAAA,EAAM,UAAU,KAAK,MAAA,CAAO,OAAA,CAAQ,cAAc,CAAA,EAAG;AAC/D,MAAA,cAAA;AAAA,QACE;AAAA,UACE,CAAC,CAAA,YAAA,EAAe,IAAI,CAAA,CAAE,GAAG,CAAC,SAAA,MAAuB;AAAA,YAC/C,eAAA,EAAiB,CAAA,gBAAA,EAAmB,SAAS,CAAA,EAAA,EAAK,UAAU,CAAA,CAAA;AAAA,WAC9D;AAAA,SACF;AAAA,QACA;AAAA,UACE,MAAA,EAAQ,EAAE,GAAG,kBAAA;AAAmB;AAClC,OACF;AAAA,IACF;AAAA,EACF,CAAA;AAAA,EACA;AAAA,IACE,UAAU,wBAAA,EAAyB;AAAA,IACnC,KAAA,EAAO;AAAA,MACL,OAAA,EAAS;AAAA,QACP,GAAG;AAAA,OACL;AAAA,MACA,SAAA,EAAW;AAAA,QACT,GAAG;AAAA,OACL;AAAA,MACA,QAAA,EAAU;AAAA,QACR,GAAG;AAAA,OACL;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,MAAA,EAAQ;AAAA,UACN,GAAG;AAAA,SACL;AAAA,QACA,YAAA,EAAc;AAAA,UACZ,GAAG;AAAA;AACL;AACF;AACF;AAEJ","file":"chunk-GQI4KKR5.mjs","sourcesContent":["import {\n breakpoint,\n colorKebab,\n fontPreset,\n gradientDirections,\n gradientTokens,\n radius,\n shadow,\n textPreset,\n} from '@exem-ui/core/tailwindcss';\nimport plugin from 'tailwindcss/plugin';\n\n/**\n * 토큰에서 prefix 그룹을 추출하는 함수.\n * 예: 'text-primary' -> 'text', 'solid-accent-default' -> 'solid'\n */\nfunction extractPrefixes(tokenKeys: string[]): Set<string> {\n const prefixes = new Set<string>();\n\n for (const key of tokenKeys) {\n const firstPart = key.split('-')[0];\n if (firstPart) {\n prefixes.add(firstPart);\n }\n }\n\n return prefixes;\n}\n\n/**\n * 동적으로 safelist 패턴을 생성합니다.\n * 토큰에서 자동으로 prefix를 추출하여 패턴을 만듭니다.\n * 토큰이 변경되면 safelist도 자동으로 업데이트됩니다.\n */\nfunction generateSafelistPatterns() {\n const colorKeys = Object.keys(colorKebab);\n const radiusKeys = Object.keys(radius);\n const shadowKeys = Object.keys(shadow);\n\n const colorPrefixes = extractPrefixes(colorKeys);\n const patterns: Array<{ pattern: RegExp }> = [];\n\n // 배경색 패턴 (bg-)\n for (const prefix of colorPrefixes) {\n patterns.push({ pattern: new RegExp(`^bg-${prefix}-.+$`) });\n }\n\n // 텍스트 색상 패턴 (text-)\n for (const prefix of colorPrefixes) {\n patterns.push({ pattern: new RegExp(`^text-${prefix}-.+$`) });\n }\n\n // 보더 색상 패턴 (border-)\n for (const prefix of colorPrefixes) {\n patterns.push({ pattern: new RegExp(`^border-${prefix}-.+$`) });\n }\n\n // 반경 패턴 (rounded-)\n for (const key of radiusKeys) {\n patterns.push({ pattern: new RegExp(`^rounded-${key}$`) });\n }\n\n // 그림자 패턴 (shadow-)\n for (const key of shadowKeys) {\n patterns.push({ pattern: new RegExp(`^shadow-${key}$`) });\n }\n\n // 폰트 크기 패턴\n patterns.push({ pattern: /^text-(header|title|body|caption)-.+$/ });\n patterns.push({ pattern: /^text-code$/ });\n\n // 폰트 스타일 패턴 (fontPreset 토큰에서 자동 생성)\n const fontPresetKeys = Object.keys(fontPreset).join('|');\n patterns.push({ pattern: new RegExp(`^font-(${fontPresetKeys})$`) });\n\n return patterns;\n}\n\n/**\n * EXEM 디자인 시스템 Tailwind CSS(v3.x) 플러그인.\n *\n * `@exem-ui/core/tailwindcss` 공통 토큰을 활용하여 Tailwind 테마를 확장하고\n * 동적 그라데이션 유틸리티와 자동 safelist를 제공합니다.\n *\n * 제공 기능:\n * - 색상: `@exem-ui/core` 디자인 토큰 색상 (extend)\n * - 반경: weak, medium, strong, hard (extend)\n * - 그림자: weak, medium, strong, hard\n * - 타이포그래피: text-header-1/2, text-title-1/2, text-body-1/2/3, text-caption, text-code\n * - 동적 그라데이션: bg-gradient-exem-logo-[to-right] 등\n * - 브레이크포인트: md, lg, xl\n * - 동적 safelist: 토큰 기반 자동 패턴 생성\n *\n * @example\n * ```ts\n * // tailwind.config.ts\n * import exemPlugin from '@exem-ui/tailwindcss3';\n *\n * export default {\n * plugins: [exemPlugin],\n * };\n * ```\n */\nexport default plugin(\n ({ matchUtilities, addUtilities }) => {\n // font-* 유틸리티 (fontWeight + lineHeight)\n const fontUtilities: Record<string, Record<string, string>> = {};\n for (const [name, value] of Object.entries(fontPreset)) {\n fontUtilities[`.font-${name}`] = {\n 'font-weight': value.fontWeight,\n 'line-height': value.lineHeight,\n };\n }\n addUtilities(fontUtilities);\n\n // text-code: font-family 오버라이드 (font-size는 theme.fontSize에서 처리)\n addUtilities({\n '.text-code': {\n 'font-family': \"'JetBrains Mono', monospace\",\n },\n });\n\n for (const [name, colorStops] of Object.entries(gradientTokens)) {\n matchUtilities(\n {\n [`bg-gradient-${name}`]: (direction: string) => ({\n backgroundImage: `linear-gradient(${direction}, ${colorStops})`,\n }),\n },\n {\n values: { ...gradientDirections },\n },\n );\n }\n },\n {\n safelist: generateSafelistPatterns(),\n theme: {\n screens: {\n ...breakpoint,\n },\n boxShadow: {\n ...shadow,\n },\n fontSize: {\n ...textPreset,\n },\n extend: {\n colors: {\n ...colorKebab,\n },\n borderRadius: {\n ...radius,\n },\n },\n },\n },\n);\n"]}
1
+ {"version":3,"sources":["../src/plugin.ts"],"names":[],"mappings":"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","file":"chunk-JMQYNTP2.mjs","sourcesContent":["import {\n breakpoint,\n colorKebab,\n fontPreset,\n gradientDirections,\n gradientTokens,\n radius,\n shadow,\n textPreset,\n} from '@exem-ui/core/tailwindcss';\nimport plugin from 'tailwindcss/plugin';\n\n/**\n * 토큰에서 prefix 그룹을 추출하는 함수.\n * 예: 'text-primary' -> 'text', 'solid-accent-default' -> 'solid'\n */\nfunction extractPrefixes(tokenKeys: string[]): Set<string> {\n const prefixes = new Set<string>();\n\n for (const key of tokenKeys) {\n const firstPart = key.split('-')[0];\n if (firstPart) {\n prefixes.add(firstPart);\n }\n }\n\n return prefixes;\n}\n\n/**\n * 동적으로 safelist 패턴을 생성합니다.\n * 토큰에서 자동으로 prefix를 추출하여 패턴을 만듭니다.\n * 토큰이 변경되면 safelist도 자동으로 업데이트됩니다.\n */\nfunction generateSafelistPatterns() {\n const colorKeys = Object.keys(colorKebab);\n const radiusKeys = Object.keys(radius);\n const shadowKeys = Object.keys(shadow);\n\n const colorPrefixes = extractPrefixes(colorKeys);\n const patterns: Array<{ pattern: RegExp }> = [];\n\n // 배경색 패턴 (bg-)\n for (const prefix of colorPrefixes) {\n patterns.push({ pattern: new RegExp(`^bg-${prefix}-.+$`) });\n }\n\n // 텍스트 색상 패턴 (text-)\n for (const prefix of colorPrefixes) {\n patterns.push({ pattern: new RegExp(`^text-${prefix}-.+$`) });\n }\n\n // 보더 색상 패턴 (border-)\n for (const prefix of colorPrefixes) {\n patterns.push({ pattern: new RegExp(`^border-${prefix}-.+$`) });\n }\n\n // 반경 패턴 (rounded-)\n for (const key of radiusKeys) {\n patterns.push({ pattern: new RegExp(`^rounded-${key}$`) });\n }\n\n // 그림자 패턴 (shadow-)\n for (const key of shadowKeys) {\n patterns.push({ pattern: new RegExp(`^shadow-${key}$`) });\n }\n\n // 폰트 크기 패턴\n patterns.push({ pattern: /^text-(header|title|body|caption)-.+$/ });\n patterns.push({ pattern: /^text-code$/ });\n\n // 폰트 스타일 패턴 (fontPreset 토큰에서 자동 생성)\n const fontPresetKeys = Object.keys(fontPreset).join('|');\n patterns.push({ pattern: new RegExp(`^font-(${fontPresetKeys})$`) });\n\n return patterns;\n}\n\n/**\n * EXEM 디자인 시스템 Tailwind CSS(v3.x) 플러그인.\n *\n * `@exem-ui/core/tailwindcss` 공통 토큰을 활용하여 Tailwind 테마를 확장하고\n * 동적 그라데이션 유틸리티와 자동 safelist를 제공합니다.\n *\n * 제공 기능:\n * - 색상: `@exem-ui/core` 디자인 토큰 색상 (extend)\n * - 반경: weak, medium, strong, hard (extend)\n * - 그림자: weak, medium, strong, hard\n * - 타이포그래피: text-header-1/2, text-title-1/2, text-body-1/2/3, text-caption, text-code\n * - 동적 그라데이션: bg-gradient-exem-logo-[to-right] 등\n * - 브레이크포인트: md, lg, xl\n * - 동적 safelist: 토큰 기반 자동 패턴 생성\n *\n * @example\n * ```ts\n * // tailwind.config.ts\n * import exemPlugin from '@exem-ui/tailwindcss3';\n *\n * export default {\n * plugins: [exemPlugin],\n * };\n * ```\n */\nexport default plugin(\n ({ matchUtilities, addUtilities }) => {\n // font-* 유틸리티 (fontWeight + lineHeight)\n const fontUtilities: Record<string, Record<string, string>> = {};\n for (const [name, value] of Object.entries(fontPreset)) {\n fontUtilities[`.font-${name}`] = {\n 'font-weight': value.fontWeight,\n 'line-height': value.lineHeight,\n };\n }\n addUtilities(fontUtilities);\n\n // text-code: font-family 오버라이드 (font-size는 theme.fontSize에서 처리)\n addUtilities({\n '.text-code': {\n 'font-family': \"'JetBrains Mono', monospace\",\n },\n });\n\n for (const [name, colorStops] of Object.entries(gradientTokens)) {\n matchUtilities(\n {\n [`bg-gradient-${name}`]: (direction: string) => ({\n backgroundImage: `linear-gradient(${direction}, ${colorStops})`,\n }),\n },\n {\n values: { ...gradientDirections },\n },\n );\n }\n },\n {\n safelist: generateSafelistPatterns(),\n theme: {\n screens: {\n ...breakpoint,\n },\n boxShadow: {\n ...shadow,\n },\n fontSize: {\n ...textPreset,\n },\n extend: {\n colors: {\n ...colorKebab,\n },\n borderRadius: {\n ...radius,\n },\n },\n },\n },\n);\n"]}
package/dist/index.d.mts CHANGED
@@ -1,33 +1,6 @@
1
- import * as tailwindcss_types_config from 'tailwindcss/types/config';
1
+ import _default from './plugin.mjs';
2
+ import 'tailwindcss/types/config';
3
+
2
4
 
3
- /**
4
- * EXEM 디자인 시스템 Tailwind CSS(v3.x) 플러그인.
5
- *
6
- * `@exem-ui/core/tailwindcss` 공통 토큰을 활용하여 Tailwind 테마를 확장하고
7
- * 동적 그라데이션 유틸리티와 자동 safelist를 제공합니다.
8
- *
9
- * 제공 기능:
10
- * - 색상: `@exem-ui/core` 디자인 토큰 색상 (extend)
11
- * - 반경: weak, medium, strong, hard (extend)
12
- * - 그림자: weak, medium, strong, hard
13
- * - 타이포그래피: text-header-1/2, text-title-1/2, text-body-1/2/3, text-caption, text-code
14
- * - 동적 그라데이션: bg-gradient-exem-logo-[to-right] 등
15
- * - 브레이크포인트: md, lg, xl
16
- * - 동적 safelist: 토큰 기반 자동 패턴 생성
17
- *
18
- * @example
19
- * ```ts
20
- * // tailwind.config.ts
21
- * import exemPlugin from '@exem-ui/tailwindcss3';
22
- *
23
- * export default {
24
- * plugins: [exemPlugin],
25
- * };
26
- * ```
27
- */
28
- declare const _default: {
29
- handler: tailwindcss_types_config.PluginCreator;
30
- config?: Partial<tailwindcss_types_config.Config>;
31
- };
32
5
 
33
6
  export { _default as default };
package/dist/index.d.ts CHANGED
@@ -1,33 +1,6 @@
1
- import * as tailwindcss_types_config from 'tailwindcss/types/config';
1
+ import _default from './plugin.js';
2
+ import 'tailwindcss/types/config';
3
+
2
4
 
3
- /**
4
- * EXEM 디자인 시스템 Tailwind CSS(v3.x) 플러그인.
5
- *
6
- * `@exem-ui/core/tailwindcss` 공통 토큰을 활용하여 Tailwind 테마를 확장하고
7
- * 동적 그라데이션 유틸리티와 자동 safelist를 제공합니다.
8
- *
9
- * 제공 기능:
10
- * - 색상: `@exem-ui/core` 디자인 토큰 색상 (extend)
11
- * - 반경: weak, medium, strong, hard (extend)
12
- * - 그림자: weak, medium, strong, hard
13
- * - 타이포그래피: text-header-1/2, text-title-1/2, text-body-1/2/3, text-caption, text-code
14
- * - 동적 그라데이션: bg-gradient-exem-logo-[to-right] 등
15
- * - 브레이크포인트: md, lg, xl
16
- * - 동적 safelist: 토큰 기반 자동 패턴 생성
17
- *
18
- * @example
19
- * ```ts
20
- * // tailwind.config.ts
21
- * import exemPlugin from '@exem-ui/tailwindcss3';
22
- *
23
- * export default {
24
- * plugins: [exemPlugin],
25
- * };
26
- * ```
27
- */
28
- declare const _default: {
29
- handler: tailwindcss_types_config.PluginCreator;
30
- config?: Partial<tailwindcss_types_config.Config>;
31
- };
32
5
 
33
6
  export { _default as default };
package/dist/index.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import { plugin_default } from './chunk-GQI4KKR5.mjs';
1
+ import { plugin_default } from './chunk-JMQYNTP2.mjs';
2
2
 
3
3
  // src/index.ts
4
4
  var src_default = plugin_default;
package/dist/plugin.d.mts ADDED
@@ -0,0 +1,33 @@
1
+ import * as tailwindcss_types_config from 'tailwindcss/types/config';
2
+
3
+ /**
4
+ * EXEM 디자인 시스템 Tailwind CSS(v3.x) 플러그인.
5
+ *
6
+ * `@exem-ui/core/tailwindcss` 공통 토큰을 활용하여 Tailwind 테마를 확장하고
7
+ * 동적 그라데이션 유틸리티와 자동 safelist를 제공합니다.
8
+ *
9
+ * 제공 기능:
10
+ * - 색상: `@exem-ui/core` 디자인 토큰 색상 (extend)
11
+ * - 반경: weak, medium, strong, hard (extend)
12
+ * - 그림자: weak, medium, strong, hard
13
+ * - 타이포그래피: text-header-1/2, text-title-1/2, text-body-1/2/3, text-caption, text-code
14
+ * - 동적 그라데이션: bg-gradient-exem-logo-[to-right] 등
15
+ * - 브레이크포인트: md, lg, xl
16
+ * - 동적 safelist: 토큰 기반 자동 패턴 생성
17
+ *
18
+ * @example
19
+ * ```ts
20
+ * // tailwind.config.ts
21
+ * import exemPlugin from '@exem-ui/tailwindcss3';
22
+ *
23
+ * export default {
24
+ * plugins: [exemPlugin],
25
+ * };
26
+ * ```
27
+ */
28
+ declare const _default: {
29
+ handler: tailwindcss_types_config.PluginCreator;
30
+ config?: Partial<tailwindcss_types_config.Config>;
31
+ };
32
+
33
+ export { _default as default };
package/dist/plugin.d.ts ADDED
@@ -0,0 +1,33 @@
1
+ import * as tailwindcss_types_config from 'tailwindcss/types/config';
2
+
3
+ /**
4
+ * EXEM 디자인 시스템 Tailwind CSS(v3.x) 플러그인.
5
+ *
6
+ * `@exem-ui/core/tailwindcss` 공통 토큰을 활용하여 Tailwind 테마를 확장하고
7
+ * 동적 그라데이션 유틸리티와 자동 safelist를 제공합니다.
8
+ *
9
+ * 제공 기능:
10
+ * - 색상: `@exem-ui/core` 디자인 토큰 색상 (extend)
11
+ * - 반경: weak, medium, strong, hard (extend)
12
+ * - 그림자: weak, medium, strong, hard
13
+ * - 타이포그래피: text-header-1/2, text-title-1/2, text-body-1/2/3, text-caption, text-code
14
+ * - 동적 그라데이션: bg-gradient-exem-logo-[to-right] 등
15
+ * - 브레이크포인트: md, lg, xl
16
+ * - 동적 safelist: 토큰 기반 자동 패턴 생성
17
+ *
18
+ * @example
19
+ * ```ts
20
+ * // tailwind.config.ts
21
+ * import exemPlugin from '@exem-ui/tailwindcss3';
22
+ *
23
+ * export default {
24
+ * plugins: [exemPlugin],
25
+ * };
26
+ * ```
27
+ */
28
+ declare const _default: {
29
+ handler: tailwindcss_types_config.PluginCreator;
30
+ config?: Partial<tailwindcss_types_config.Config>;
31
+ };
32
+
33
+ export { _default as default };
package/dist/{preset.js → plugin.js} RENAMED
@@ -97,13 +97,6 @@ var plugin_default = plugin__default.default(
97
97
  }
98
98
  );
99
99
 
100
- // src/preset.ts
101
- var preset = {
102
- content: [],
103
- plugins: [plugin_default]
104
- };
105
- var preset_default = preset;
106
-
107
- module.exports = preset_default;
108
- //# sourceMappingURL=preset.js.map
109
- //# sourceMappingURL=preset.js.map
100
+ module.exports = plugin_default;
101
+ //# sourceMappingURL=plugin.js.map
102
+ //# sourceMappingURL=plugin.js.map
package/dist/plugin.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/plugin.ts"],"names":["colorKebab","radius","shadow","fontPreset","plugin","gradientTokens","gradientDirections","breakpoint","textPreset"],"mappings":"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","file":"plugin.js","sourcesContent":["import {\n breakpoint,\n colorKebab,\n fontPreset,\n gradientDirections,\n gradientTokens,\n radius,\n shadow,\n textPreset,\n} from '@exem-ui/core/tailwindcss';\nimport plugin from 'tailwindcss/plugin';\n\n/**\n * 토큰에서 prefix 그룹을 추출하는 함수.\n * 예: 'text-primary' -> 'text', 'solid-accent-default' -> 'solid'\n */\nfunction extractPrefixes(tokenKeys: string[]): Set<string> {\n const prefixes = new Set<string>();\n\n for (const key of tokenKeys) {\n const firstPart = key.split('-')[0];\n if (firstPart) {\n prefixes.add(firstPart);\n }\n }\n\n return prefixes;\n}\n\n/**\n * 동적으로 safelist 패턴을 생성합니다.\n * 토큰에서 자동으로 prefix를 추출하여 패턴을 만듭니다.\n * 토큰이 변경되면 safelist도 자동으로 업데이트됩니다.\n */\nfunction generateSafelistPatterns() {\n const colorKeys = Object.keys(colorKebab);\n const radiusKeys = Object.keys(radius);\n const shadowKeys = Object.keys(shadow);\n\n const colorPrefixes = extractPrefixes(colorKeys);\n const patterns: Array<{ pattern: RegExp }> = [];\n\n // 배경색 패턴 (bg-)\n for (const prefix of colorPrefixes) {\n patterns.push({ pattern: new RegExp(`^bg-${prefix}-.+$`) });\n }\n\n // 텍스트 색상 패턴 (text-)\n for (const prefix of colorPrefixes) {\n patterns.push({ pattern: new RegExp(`^text-${prefix}-.+$`) });\n }\n\n // 보더 색상 패턴 (border-)\n for (const prefix of colorPrefixes) {\n patterns.push({ pattern: new RegExp(`^border-${prefix}-.+$`) });\n }\n\n // 반경 패턴 (rounded-)\n for (const key of radiusKeys) {\n patterns.push({ pattern: new RegExp(`^rounded-${key}$`) });\n }\n\n // 그림자 패턴 (shadow-)\n for (const key of shadowKeys) {\n patterns.push({ pattern: new RegExp(`^shadow-${key}$`) });\n }\n\n // 폰트 크기 패턴\n patterns.push({ pattern: /^text-(header|title|body|caption)-.+$/ });\n patterns.push({ pattern: /^text-code$/ });\n\n // 폰트 스타일 패턴 (fontPreset 토큰에서 자동 생성)\n const fontPresetKeys = Object.keys(fontPreset).join('|');\n patterns.push({ pattern: new RegExp(`^font-(${fontPresetKeys})$`) });\n\n return patterns;\n}\n\n/**\n * EXEM 디자인 시스템 Tailwind CSS(v3.x) 플러그인.\n *\n * `@exem-ui/core/tailwindcss` 공통 토큰을 활용하여 Tailwind 테마를 확장하고\n * 동적 그라데이션 유틸리티와 자동 safelist를 제공합니다.\n *\n * 제공 기능:\n * - 색상: `@exem-ui/core` 디자인 토큰 색상 (extend)\n * - 반경: weak, medium, strong, hard (extend)\n * - 그림자: weak, medium, strong, hard\n * - 타이포그래피: text-header-1/2, text-title-1/2, text-body-1/2/3, text-caption, text-code\n * - 동적 그라데이션: bg-gradient-exem-logo-[to-right] 등\n * - 브레이크포인트: md, lg, xl\n * - 동적 safelist: 토큰 기반 자동 패턴 생성\n *\n * @example\n * ```ts\n * // tailwind.config.ts\n * import exemPlugin from '@exem-ui/tailwindcss3';\n *\n * export default {\n * plugins: [exemPlugin],\n * };\n * ```\n */\nexport default plugin(\n ({ matchUtilities, addUtilities }) => {\n // font-* 유틸리티 (fontWeight + lineHeight)\n const fontUtilities: Record<string, Record<string, string>> = {};\n for (const [name, value] of Object.entries(fontPreset)) {\n fontUtilities[`.font-${name}`] = {\n 'font-weight': value.fontWeight,\n 'line-height': value.lineHeight,\n };\n }\n addUtilities(fontUtilities);\n\n // text-code: font-family 오버라이드 (font-size는 theme.fontSize에서 처리)\n addUtilities({\n '.text-code': {\n 'font-family': \"'JetBrains Mono', monospace\",\n },\n });\n\n for (const [name, colorStops] of Object.entries(gradientTokens)) {\n matchUtilities(\n {\n [`bg-gradient-${name}`]: (direction: string) => ({\n backgroundImage: `linear-gradient(${direction}, ${colorStops})`,\n }),\n },\n {\n values: { ...gradientDirections },\n },\n );\n }\n },\n {\n safelist: generateSafelistPatterns(),\n theme: {\n screens: {\n ...breakpoint,\n },\n boxShadow: {\n ...shadow,\n },\n fontSize: {\n ...textPreset,\n },\n extend: {\n colors: {\n ...colorKebab,\n },\n borderRadius: {\n ...radius,\n },\n },\n },\n },\n);\n"]}
package/dist/plugin.mjs ADDED
@@ -0,0 +1,3 @@
1
+ export { plugin_default as default } from './chunk-JMQYNTP2.mjs';
2
+ //# sourceMappingURL=plugin.mjs.map
3
+ //# sourceMappingURL=plugin.mjs.map
package/dist/plugin.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"names":[],"mappings":"","file":"plugin.mjs"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@exem-ui/tailwindcss3",
3
- "version": "0.2.0-next.20260227074038",
3
+ "version": "0.2.0-next.20260227074335",
4
4
  "description": "EXEM Design System - Tailwind CSS 3 Plugin",
5
5
  "author": "EXEM Design Team",
6
6
  "license": "Apache-2.0",
@@ -13,10 +13,10 @@
13
13
  "import": "./dist/index.mjs",
14
14
  "require": "./dist/index.js"
15
15
  },
16
- "./preset": {
17
- "types": "./dist/preset.d.ts",
18
- "import": "./dist/preset.mjs",
19
- "require": "./dist/preset.js"
16
+ "./plugin": {
17
+ "types": "./dist/plugin.d.ts",
18
+ "import": "./dist/plugin.mjs",
19
+ "require": "./dist/plugin.js"
20
20
  }
21
21
  },
22
22
  "sideEffects": false,
@@ -44,7 +44,7 @@
44
44
  "css"
45
45
  ],
46
46
  "dependencies": {
47
- "@exem-ui/core": "0.2.0-next.20260227074038"
47
+ "@exem-ui/core": "0.2.0-next.20260227074335"
48
48
  },
49
49
  "devDependencies": {
50
50
  "tailwindcss": "^3.4.18",
package/dist/preset.d.mts DELETED
@@ -1,21 +0,0 @@
1
- import { Config } from 'tailwindcss';
2
-
3
- /**
4
- * EXEM 디자인 시스템 Tailwind CSS v3 프리셋.
5
- * 플러그인 + content 경로를 포함하는 완전한 설정입니다.
6
- * 기존 `@exem-ui/ui`의 Tailwind preset 기능을 대체합니다.
7
- *
8
- * @example
9
- * ```ts
10
- * // tailwind.config.ts
11
- * import exemPreset from '@exem-ui/tailwindcss3/preset';
12
- *
13
- * export default {
14
- * presets: [exemPreset],
15
- * content: ['./src/**\/*.{ts,tsx}'],
16
- * } satisfies Config;
17
- * ```
18
- */
19
- declare const preset: Config;
20
-
21
- export { preset as default };
package/dist/preset.d.ts DELETED
@@ -1,21 +0,0 @@
1
- import { Config } from 'tailwindcss';
2
-
3
- /**
4
- * EXEM 디자인 시스템 Tailwind CSS v3 프리셋.
5
- * 플러그인 + content 경로를 포함하는 완전한 설정입니다.
6
- * 기존 `@exem-ui/ui`의 Tailwind preset 기능을 대체합니다.
7
- *
8
- * @example
9
- * ```ts
10
- * // tailwind.config.ts
11
- * import exemPreset from '@exem-ui/tailwindcss3/preset';
12
- *
13
- * export default {
14
- * presets: [exemPreset],
15
- * content: ['./src/**\/*.{ts,tsx}'],
16
- * } satisfies Config;
17
- * ```
18
- */
19
- declare const preset: Config;
20
-
21
- export { preset as default };
package/dist/preset.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/plugin.ts","../src/preset.ts"],"names":["colorKebab","radius","shadow","fontPreset","plugin","gradientTokens","gradientDirections","breakpoint","textPreset"],"mappings":"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","file":"preset.js","sourcesContent":["import {\n breakpoint,\n colorKebab,\n fontPreset,\n gradientDirections,\n gradientTokens,\n radius,\n shadow,\n textPreset,\n} from '@exem-ui/core/tailwindcss';\nimport plugin from 'tailwindcss/plugin';\n\n/**\n * 토큰에서 prefix 그룹을 추출하는 함수.\n * 예: 'text-primary' -> 'text', 'solid-accent-default' -> 'solid'\n */\nfunction extractPrefixes(tokenKeys: string[]): Set<string> {\n const prefixes = new Set<string>();\n\n for (const key of tokenKeys) {\n const firstPart = key.split('-')[0];\n if (firstPart) {\n prefixes.add(firstPart);\n }\n }\n\n return prefixes;\n}\n\n/**\n * 동적으로 safelist 패턴을 생성합니다.\n * 토큰에서 자동으로 prefix를 추출하여 패턴을 만듭니다.\n * 토큰이 변경되면 safelist도 자동으로 업데이트됩니다.\n */\nfunction generateSafelistPatterns() {\n const colorKeys = Object.keys(colorKebab);\n const radiusKeys = Object.keys(radius);\n const shadowKeys = Object.keys(shadow);\n\n const colorPrefixes = extractPrefixes(colorKeys);\n const patterns: Array<{ pattern: RegExp }> = [];\n\n // 배경색 패턴 (bg-)\n for (const prefix of colorPrefixes) {\n patterns.push({ pattern: new RegExp(`^bg-${prefix}-.+$`) });\n }\n\n // 텍스트 색상 패턴 (text-)\n for (const prefix of colorPrefixes) {\n patterns.push({ pattern: new RegExp(`^text-${prefix}-.+$`) });\n }\n\n // 보더 색상 패턴 (border-)\n for (const prefix of colorPrefixes) {\n patterns.push({ pattern: new RegExp(`^border-${prefix}-.+$`) });\n }\n\n // 반경 패턴 (rounded-)\n for (const key of radiusKeys) {\n patterns.push({ pattern: new RegExp(`^rounded-${key}$`) });\n }\n\n // 그림자 패턴 (shadow-)\n for (const key of shadowKeys) {\n patterns.push({ pattern: new RegExp(`^shadow-${key}$`) });\n }\n\n // 폰트 크기 패턴\n patterns.push({ pattern: /^text-(header|title|body|caption)-.+$/ });\n patterns.push({ pattern: /^text-code$/ });\n\n // 폰트 스타일 패턴 (fontPreset 토큰에서 자동 생성)\n const fontPresetKeys = Object.keys(fontPreset).join('|');\n patterns.push({ pattern: new RegExp(`^font-(${fontPresetKeys})$`) });\n\n return patterns;\n}\n\n/**\n * EXEM 디자인 시스템 Tailwind CSS(v3.x) 플러그인.\n *\n * `@exem-ui/core/tailwindcss` 공통 토큰을 활용하여 Tailwind 테마를 확장하고\n * 동적 그라데이션 유틸리티와 자동 safelist를 제공합니다.\n *\n * 제공 기능:\n * - 색상: `@exem-ui/core` 디자인 토큰 색상 (extend)\n * - 반경: weak, medium, strong, hard (extend)\n * - 그림자: weak, medium, strong, hard\n * - 타이포그래피: text-header-1/2, text-title-1/2, text-body-1/2/3, text-caption, text-code\n * - 동적 그라데이션: bg-gradient-exem-logo-[to-right] 등\n * - 브레이크포인트: md, lg, xl\n * - 동적 safelist: 토큰 기반 자동 패턴 생성\n *\n * @example\n * ```ts\n * // tailwind.config.ts\n * import exemPlugin from '@exem-ui/tailwindcss3';\n *\n * export default {\n * plugins: [exemPlugin],\n * };\n * ```\n */\nexport default plugin(\n ({ matchUtilities, addUtilities }) => {\n // font-* 유틸리티 (fontWeight + lineHeight)\n const fontUtilities: Record<string, Record<string, string>> = {};\n for (const [name, value] of Object.entries(fontPreset)) {\n fontUtilities[`.font-${name}`] = {\n 'font-weight': value.fontWeight,\n 'line-height': value.lineHeight,\n };\n }\n addUtilities(fontUtilities);\n\n // text-code: font-family 오버라이드 (font-size는 theme.fontSize에서 처리)\n addUtilities({\n '.text-code': {\n 'font-family': \"'JetBrains Mono', monospace\",\n },\n });\n\n for (const [name, colorStops] of Object.entries(gradientTokens)) {\n matchUtilities(\n {\n [`bg-gradient-${name}`]: (direction: string) => ({\n backgroundImage: `linear-gradient(${direction}, ${colorStops})`,\n }),\n },\n {\n values: { ...gradientDirections },\n },\n );\n }\n },\n {\n safelist: generateSafelistPatterns(),\n theme: {\n screens: {\n ...breakpoint,\n },\n boxShadow: {\n ...shadow,\n },\n fontSize: {\n ...textPreset,\n },\n extend: {\n colors: {\n ...colorKebab,\n },\n borderRadius: {\n ...radius,\n },\n },\n },\n },\n);\n","import type { Config } from 'tailwindcss';\nimport exemPlugin from './plugin';\n\n/**\n * EXEM 디자인 시스템 Tailwind CSS v3 프리셋.\n * 플러그인 + content 경로를 포함하는 완전한 설정입니다.\n * 기존 `@exem-ui/ui`의 Tailwind preset 기능을 대체합니다.\n *\n * @example\n * ```ts\n * // tailwind.config.ts\n * import exemPreset from '@exem-ui/tailwindcss3/preset';\n *\n * export default {\n * presets: [exemPreset],\n * content: ['./src/**\\/*.{ts,tsx}'],\n * } satisfies Config;\n * ```\n */\nconst preset: Config = {\n content: [],\n plugins: [exemPlugin],\n};\n\nexport default preset;\n"]}
package/dist/preset.mjs DELETED
@@ -1,12 +0,0 @@
1
- import { plugin_default } from './chunk-GQI4KKR5.mjs';
2
-
3
- // src/preset.ts
4
- var preset = {
5
- content: [],
6
- plugins: [plugin_default]
7
- };
8
- var preset_default = preset;
9
-
10
- export { preset_default as default };
11
- //# sourceMappingURL=preset.mjs.map
12
- //# sourceMappingURL=preset.mjs.map
package/dist/preset.mjs.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/preset.ts"],"names":[],"mappings":";;;AAmBA,IAAM,MAAA,GAAiB;AAAA,EACrB,SAAS,EAAC;AAAA,EACV,OAAA,EAAS,CAAC,cAAU;AACtB,CAAA;AAEA,IAAO,cAAA,GAAQ","file":"preset.mjs","sourcesContent":["import type { Config } from 'tailwindcss';\nimport exemPlugin from './plugin';\n\n/**\n * EXEM 디자인 시스템 Tailwind CSS v3 프리셋.\n * 플러그인 + content 경로를 포함하는 완전한 설정입니다.\n * 기존 `@exem-ui/ui`의 Tailwind preset 기능을 대체합니다.\n *\n * @example\n * ```ts\n * // tailwind.config.ts\n * import exemPreset from '@exem-ui/tailwindcss3/preset';\n *\n * export default {\n * presets: [exemPreset],\n * content: ['./src/**\\/*.{ts,tsx}'],\n * } satisfies Config;\n * ```\n */\nconst preset: Config = {\n content: [],\n plugins: [exemPlugin],\n};\n\nexport default preset;\n"]}