clases-tailwind 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/index.cjs +89 -0
  2. package/dist/index.cjs.map +1 -0
  3. package/dist/index.d.cts +142 -0
  4. package/dist/index.d.ts +142 -0
  5. package/dist/index.js +86 -0
  6. package/dist/index.js.map +1 -0
  7. package/package.json +20 -0
  8. package/src/index.test.ts +57 -0
  9. package/src/index.ts +90 -0
  10. package/src/test/tailwind.test.ts +23 -0
  11. package/tsconfig.json +14 -0
package/dist/index.cjs ADDED
@@ -0,0 +1,89 @@
1
+ 'use strict';
2
+
3
+ var clases = require('clases');
4
+
5
+ // src/index.ts
6
+ var tailwindPlugin = {
7
+ // --- Estructura y Pantallas ---
8
+ base: "base",
9
+ sm: "sm",
10
+ md: "md",
11
+ lg: "lg",
12
+ xl: "xl",
13
+ "2xl": "2xl",
14
+ // --- Estados de Usuario (Interacción) ---
15
+ hover: "hover",
16
+ focus: "focus",
17
+ active: "active",
18
+ visited: "visited",
19
+ target: "target",
20
+ "focus-within": "focus-within",
21
+ "focus-visible": "focus-visible",
22
+ // --- Estados de Formulario ---
23
+ disabled: "disabled",
24
+ enabled: "enabled",
25
+ checked: "checked",
26
+ indeterminate: "indeterminate",
27
+ default: "default",
28
+ required: "required",
29
+ valid: "valid",
30
+ invalid: "invalid",
31
+ "in-range": "in-range",
32
+ "out-of-range": "out-of-range",
33
+ "placeholder-shown": "placeholder-shown",
34
+ autofill: "autofill",
35
+ "read-only": "read-only",
36
+ // --- Posicionamiento y Árbol (Pseudo-clases) ---
37
+ first: "first",
38
+ last: "last",
39
+ only: "only",
40
+ odd: "odd",
41
+ even: "even",
42
+ "first-of-type": "first-of-type",
43
+ "last-of-type": "last-of-type",
44
+ "only-of-type": "only-of-type",
45
+ empty: "empty",
46
+ // --- Relaciones de Elementos (Group & Peer) ---
47
+ group: "group-hover",
48
+ // Alias amigable
49
+ "group-hover": "group-hover",
50
+ "group-focus": "group-focus",
51
+ "group-active": "group-active",
52
+ "group-visited": "group-visited",
53
+ "group-invalid": "group-invalid",
54
+ peer: "peer-hover",
55
+ // Alias amigable
56
+ "peer-hover": "peer-hover",
57
+ "peer-focus": "peer-focus",
58
+ "peer-active": "peer-active",
59
+ "peer-invalid": "peer-invalid",
60
+ // --- Media Queries (Preferencias de Sistema) ---
61
+ dark: "dark",
62
+ light: "light",
63
+ "motion-reduce": "motion-reduce",
64
+ "motion-safe": "motion-safe",
65
+ "contrast-more": "contrast-more",
66
+ "contrast-less": "contrast-less",
67
+ portrait: "portrait",
68
+ landscape: "landscape",
69
+ // --- Pseudo-elementos ---
70
+ marker: "marker",
71
+ selection: "selection",
72
+ "first-line": "first-line",
73
+ "first-letter": "first-letter",
74
+ backdrop: "backdrop",
75
+ placeholder: "placeholder",
76
+ before: "before",
77
+ after: "after",
78
+ file: "file",
79
+ // --- Varios y Print ---
80
+ print: "print",
81
+ rtl: "rtl",
82
+ ltr: "ltr"
83
+ };
84
+ var cl = clases.createCl(tailwindPlugin);
85
+
86
+ exports.cl = cl;
87
+ exports.tailwindPlugin = tailwindPlugin;
88
+ //# sourceMappingURL=index.cjs.map
89
+ //# sourceMappingURL=index.cjs.map
package/dist/index.cjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/index.ts"],"names":["createCl"],"mappings":";;;;;AAEO,IAAM,cAAA,GAAiB;AAAA;AAAA,EAE1B,IAAA,EAAM,MAAA;AAAA,EACN,EAAA,EAAI,IAAA;AAAA,EACJ,EAAA,EAAI,IAAA;AAAA,EACJ,EAAA,EAAI,IAAA;AAAA,EACJ,EAAA,EAAI,IAAA;AAAA,EACJ,KAAA,EAAO,KAAA;AAAA;AAAA,EAGP,KAAA,EAAO,OAAA;AAAA,EACP,KAAA,EAAO,OAAA;AAAA,EACP,MAAA,EAAQ,QAAA;AAAA,EACR,OAAA,EAAS,SAAA;AAAA,EACT,MAAA,EAAQ,QAAA;AAAA,EACR,cAAA,EAAgB,cAAA;AAAA,EAChB,eAAA,EAAiB,eAAA;AAAA;AAAA,EAGjB,QAAA,EAAU,UAAA;AAAA,EACV,OAAA,EAAS,SAAA;AAAA,EACT,OAAA,EAAS,SAAA;AAAA,EACT,aAAA,EAAe,eAAA;AAAA,EACf,OAAA,EAAS,SAAA;AAAA,EACT,QAAA,EAAU,UAAA;AAAA,EACV,KAAA,EAAO,OAAA;AAAA,EACP,OAAA,EAAS,SAAA;AAAA,EACT,UAAA,EAAY,UAAA;AAAA,EACZ,cAAA,EAAgB,cAAA;AAAA,EAChB,mBAAA,EAAqB,mBAAA;AAAA,EACrB,QAAA,EAAU,UAAA;AAAA,EACV,WAAA,EAAa,WAAA;AAAA;AAAA,EAGb,KAAA,EAAO,OAAA;AAAA,EACP,IAAA,EAAM,MAAA;AAAA,EACN,IAAA,EAAM,MAAA;AAAA,EACN,GAAA,EAAK,KAAA;AAAA,EACL,IAAA,EAAM,MAAA;AAAA,EACN,eAAA,EAAiB,eAAA;AAAA,EACjB,cAAA,EAAgB,cAAA;AAAA,EAChB,cAAA,EAAgB,cAAA;AAAA,EAChB,KAAA,EAAO,OAAA;AAAA;AAAA,EAGP,KAAA,EAAO,aAAA;AAAA;AAAA,EACP,aAAA,EAAe,aAAA;AAAA,EACf,aAAA,EAAe,aAAA;AAAA,EACf,cAAA,EAAgB,cAAA;AAAA,EAChB,eAAA,EAAiB,eAAA;AAAA,EACjB,eAAA,EAAiB,eAAA;AAAA,EACjB,IAAA,EAAM,YAAA;AAAA;AAAA,EACN,YAAA,EAAc,YAAA;AAAA,EACd,YAAA,EAAc,YAAA;AAAA,EACd,aAAA,EAAe,aAAA;AAAA,EACf,cAAA,EAAgB,cAAA;AAAA;AAAA,EAGhB,IAAA,EAAM,MAAA;AAAA,EACN,KAAA,EAAO,OAAA;AAAA,EACP,eAAA,EAAiB,eAAA;AAAA,EACjB,aAAA,EAAe,aAAA;AAAA,EACf,eAAA,EAAiB,eAAA;AAAA,EACjB,eAAA,EAAiB,eAAA;AAAA,EACjB,QAAA,EAAU,UAAA;AAAA,EACV,SAAA,EAAW,WAAA;AAAA;AAAA,EAGX,MAAA,EAAQ,QAAA;AAAA,EACR,SAAA,EAAW,WAAA;AAAA,EACX,YAAA,EAAc,YAAA;AAAA,EACd,cAAA,EAAgB,cAAA;AAAA,EAChB,QAAA,EAAU,UAAA;AAAA,EACV,WAAA,EAAa,aAAA;AAAA,EACb,MAAA,EAAQ,QAAA;AAAA,EACR,KAAA,EAAO,OAAA;AAAA,EACP,IAAA,EAAM,MAAA;AAAA;AAAA,EAGN,KAAA,EAAO,OAAA;AAAA,EACP,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK;AACT;AAEO,IAAM,EAAA,GAAKA,gBAAS,cAAc","file":"index.cjs","sourcesContent":["import { createCl } from \"clases\";\r\n\r\nexport const tailwindPlugin = {\r\n // --- Estructura y Pantallas ---\r\n base: 'base',\r\n sm: 'sm',\r\n md: 'md',\r\n lg: 'lg',\r\n xl: 'xl',\r\n '2xl': '2xl',\r\n\r\n // --- Estados de Usuario (Interacción) ---\r\n hover: 'hover',\r\n focus: 'focus',\r\n active: 'active',\r\n visited: 'visited',\r\n target: 'target',\r\n 'focus-within': 'focus-within',\r\n 'focus-visible': 'focus-visible',\r\n\r\n // --- Estados de Formulario ---\r\n disabled: 'disabled',\r\n enabled: 'enabled',\r\n checked: 'checked',\r\n indeterminate: 'indeterminate',\r\n default: 'default',\r\n required: 'required',\r\n valid: 'valid',\r\n invalid: 'invalid',\r\n 'in-range': 'in-range',\r\n 'out-of-range': 'out-of-range',\r\n 'placeholder-shown': 'placeholder-shown',\r\n autofill: 'autofill',\r\n 'read-only': 'read-only',\r\n\r\n // --- Posicionamiento y Árbol (Pseudo-clases) ---\r\n first: 'first',\r\n last: 'last',\r\n only: 'only',\r\n odd: 'odd',\r\n even: 'even',\r\n 'first-of-type': 'first-of-type',\r\n 'last-of-type': 'last-of-type',\r\n 'only-of-type': 'only-of-type',\r\n empty: 'empty',\r\n\r\n // --- Relaciones de Elementos (Group & Peer) ---\r\n group: 'group-hover', // Alias amigable\r\n 'group-hover': 'group-hover',\r\n 'group-focus': 'group-focus',\r\n 'group-active': 'group-active',\r\n 'group-visited': 'group-visited',\r\n 'group-invalid': 'group-invalid',\r\n peer: 'peer-hover', // Alias amigable\r\n 'peer-hover': 'peer-hover',\r\n 'peer-focus': 'peer-focus',\r\n 'peer-active': 'peer-active',\r\n 'peer-invalid': 'peer-invalid',\r\n\r\n // --- Media Queries (Preferencias de Sistema) ---\r\n dark: 'dark',\r\n light: 'light',\r\n 'motion-reduce': 'motion-reduce',\r\n 'motion-safe': 'motion-safe',\r\n 'contrast-more': 'contrast-more',\r\n 'contrast-less': 'contrast-less',\r\n portrait: 'portrait',\r\n landscape: 'landscape',\r\n\r\n // --- Pseudo-elementos ---\r\n marker: 'marker',\r\n selection: 'selection',\r\n 'first-line': 'first-line',\r\n 'first-letter': 'first-letter',\r\n backdrop: 'backdrop',\r\n placeholder: 'placeholder',\r\n before: 'before',\r\n after: 'after',\r\n file: 'file',\r\n\r\n // --- Varios y Print ---\r\n print: 'print',\r\n rtl: 'rtl',\r\n ltr: 'ltr'\r\n};\r\n\r\nexport const cl = createCl(tailwindPlugin);\r\n\r\n// Export the type so users can use it in their component props\r\nexport type TailwindKey = keyof typeof tailwindPlugin;\r\n"]}
package/dist/index.d.cts ADDED
@@ -0,0 +1,142 @@
1
+ import * as clsx from 'clsx';
2
+
3
+ declare const tailwindPlugin: {
4
+ base: string;
5
+ sm: string;
6
+ md: string;
7
+ lg: string;
8
+ xl: string;
9
+ '2xl': string;
10
+ hover: string;
11
+ focus: string;
12
+ active: string;
13
+ visited: string;
14
+ target: string;
15
+ 'focus-within': string;
16
+ 'focus-visible': string;
17
+ disabled: string;
18
+ enabled: string;
19
+ checked: string;
20
+ indeterminate: string;
21
+ default: string;
22
+ required: string;
23
+ valid: string;
24
+ invalid: string;
25
+ 'in-range': string;
26
+ 'out-of-range': string;
27
+ 'placeholder-shown': string;
28
+ autofill: string;
29
+ 'read-only': string;
30
+ first: string;
31
+ last: string;
32
+ only: string;
33
+ odd: string;
34
+ even: string;
35
+ 'first-of-type': string;
36
+ 'last-of-type': string;
37
+ 'only-of-type': string;
38
+ empty: string;
39
+ group: string;
40
+ 'group-hover': string;
41
+ 'group-focus': string;
42
+ 'group-active': string;
43
+ 'group-visited': string;
44
+ 'group-invalid': string;
45
+ peer: string;
46
+ 'peer-hover': string;
47
+ 'peer-focus': string;
48
+ 'peer-active': string;
49
+ 'peer-invalid': string;
50
+ dark: string;
51
+ light: string;
52
+ 'motion-reduce': string;
53
+ 'motion-safe': string;
54
+ 'contrast-more': string;
55
+ 'contrast-less': string;
56
+ portrait: string;
57
+ landscape: string;
58
+ marker: string;
59
+ selection: string;
60
+ 'first-line': string;
61
+ 'first-letter': string;
62
+ backdrop: string;
63
+ placeholder: string;
64
+ before: string;
65
+ after: string;
66
+ file: string;
67
+ print: string;
68
+ rtl: string;
69
+ ltr: string;
70
+ };
71
+ declare const cl: (...inputs: (clsx.ClassValue | {
72
+ [x: string & {}]: any;
73
+ base?: any;
74
+ sm?: any;
75
+ md?: any;
76
+ lg?: any;
77
+ xl?: any;
78
+ "2xl"?: any;
79
+ hover?: any;
80
+ focus?: any;
81
+ active?: any;
82
+ visited?: any;
83
+ target?: any;
84
+ "focus-within"?: any;
85
+ "focus-visible"?: any;
86
+ disabled?: any;
87
+ enabled?: any;
88
+ checked?: any;
89
+ indeterminate?: any;
90
+ default?: any;
91
+ required?: any;
92
+ valid?: any;
93
+ invalid?: any;
94
+ "in-range"?: any;
95
+ "out-of-range"?: any;
96
+ "placeholder-shown"?: any;
97
+ autofill?: any;
98
+ "read-only"?: any;
99
+ first?: any;
100
+ last?: any;
101
+ only?: any;
102
+ odd?: any;
103
+ even?: any;
104
+ "first-of-type"?: any;
105
+ "last-of-type"?: any;
106
+ "only-of-type"?: any;
107
+ empty?: any;
108
+ "group-hover"?: any;
109
+ "group-focus"?: any;
110
+ "group-active"?: any;
111
+ "group-visited"?: any;
112
+ "group-invalid"?: any;
113
+ "peer-hover"?: any;
114
+ "peer-focus"?: any;
115
+ "peer-active"?: any;
116
+ "peer-invalid"?: any;
117
+ dark?: any;
118
+ light?: any;
119
+ "motion-reduce"?: any;
120
+ "motion-safe"?: any;
121
+ "contrast-more"?: any;
122
+ "contrast-less"?: any;
123
+ portrait?: any;
124
+ landscape?: any;
125
+ marker?: any;
126
+ selection?: any;
127
+ "first-line"?: any;
128
+ "first-letter"?: any;
129
+ backdrop?: any;
130
+ placeholder?: any;
131
+ before?: any;
132
+ after?: any;
133
+ file?: any;
134
+ print?: any;
135
+ rtl?: any;
136
+ ltr?: any;
137
+ group?: any;
138
+ peer?: any;
139
+ })[]) => string;
140
+ type TailwindKey = keyof typeof tailwindPlugin;
141
+
142
+ export { type TailwindKey, cl, tailwindPlugin };
package/dist/index.d.ts ADDED
@@ -0,0 +1,142 @@
1
+ import * as clsx from 'clsx';
2
+
3
+ declare const tailwindPlugin: {
4
+ base: string;
5
+ sm: string;
6
+ md: string;
7
+ lg: string;
8
+ xl: string;
9
+ '2xl': string;
10
+ hover: string;
11
+ focus: string;
12
+ active: string;
13
+ visited: string;
14
+ target: string;
15
+ 'focus-within': string;
16
+ 'focus-visible': string;
17
+ disabled: string;
18
+ enabled: string;
19
+ checked: string;
20
+ indeterminate: string;
21
+ default: string;
22
+ required: string;
23
+ valid: string;
24
+ invalid: string;
25
+ 'in-range': string;
26
+ 'out-of-range': string;
27
+ 'placeholder-shown': string;
28
+ autofill: string;
29
+ 'read-only': string;
30
+ first: string;
31
+ last: string;
32
+ only: string;
33
+ odd: string;
34
+ even: string;
35
+ 'first-of-type': string;
36
+ 'last-of-type': string;
37
+ 'only-of-type': string;
38
+ empty: string;
39
+ group: string;
40
+ 'group-hover': string;
41
+ 'group-focus': string;
42
+ 'group-active': string;
43
+ 'group-visited': string;
44
+ 'group-invalid': string;
45
+ peer: string;
46
+ 'peer-hover': string;
47
+ 'peer-focus': string;
48
+ 'peer-active': string;
49
+ 'peer-invalid': string;
50
+ dark: string;
51
+ light: string;
52
+ 'motion-reduce': string;
53
+ 'motion-safe': string;
54
+ 'contrast-more': string;
55
+ 'contrast-less': string;
56
+ portrait: string;
57
+ landscape: string;
58
+ marker: string;
59
+ selection: string;
60
+ 'first-line': string;
61
+ 'first-letter': string;
62
+ backdrop: string;
63
+ placeholder: string;
64
+ before: string;
65
+ after: string;
66
+ file: string;
67
+ print: string;
68
+ rtl: string;
69
+ ltr: string;
70
+ };
71
+ declare const cl: (...inputs: (clsx.ClassValue | {
72
+ [x: string & {}]: any;
73
+ base?: any;
74
+ sm?: any;
75
+ md?: any;
76
+ lg?: any;
77
+ xl?: any;
78
+ "2xl"?: any;
79
+ hover?: any;
80
+ focus?: any;
81
+ active?: any;
82
+ visited?: any;
83
+ target?: any;
84
+ "focus-within"?: any;
85
+ "focus-visible"?: any;
86
+ disabled?: any;
87
+ enabled?: any;
88
+ checked?: any;
89
+ indeterminate?: any;
90
+ default?: any;
91
+ required?: any;
92
+ valid?: any;
93
+ invalid?: any;
94
+ "in-range"?: any;
95
+ "out-of-range"?: any;
96
+ "placeholder-shown"?: any;
97
+ autofill?: any;
98
+ "read-only"?: any;
99
+ first?: any;
100
+ last?: any;
101
+ only?: any;
102
+ odd?: any;
103
+ even?: any;
104
+ "first-of-type"?: any;
105
+ "last-of-type"?: any;
106
+ "only-of-type"?: any;
107
+ empty?: any;
108
+ "group-hover"?: any;
109
+ "group-focus"?: any;
110
+ "group-active"?: any;
111
+ "group-visited"?: any;
112
+ "group-invalid"?: any;
113
+ "peer-hover"?: any;
114
+ "peer-focus"?: any;
115
+ "peer-active"?: any;
116
+ "peer-invalid"?: any;
117
+ dark?: any;
118
+ light?: any;
119
+ "motion-reduce"?: any;
120
+ "motion-safe"?: any;
121
+ "contrast-more"?: any;
122
+ "contrast-less"?: any;
123
+ portrait?: any;
124
+ landscape?: any;
125
+ marker?: any;
126
+ selection?: any;
127
+ "first-line"?: any;
128
+ "first-letter"?: any;
129
+ backdrop?: any;
130
+ placeholder?: any;
131
+ before?: any;
132
+ after?: any;
133
+ file?: any;
134
+ print?: any;
135
+ rtl?: any;
136
+ ltr?: any;
137
+ group?: any;
138
+ peer?: any;
139
+ })[]) => string;
140
+ type TailwindKey = keyof typeof tailwindPlugin;
141
+
142
+ export { type TailwindKey, cl, tailwindPlugin };
package/dist/index.js ADDED
@@ -0,0 +1,86 @@
1
+ import { createCl } from 'clases';
2
+
3
+ // src/index.ts
4
+ var tailwindPlugin = {
5
+ // --- Estructura y Pantallas ---
6
+ base: "base",
7
+ sm: "sm",
8
+ md: "md",
9
+ lg: "lg",
10
+ xl: "xl",
11
+ "2xl": "2xl",
12
+ // --- Estados de Usuario (Interacción) ---
13
+ hover: "hover",
14
+ focus: "focus",
15
+ active: "active",
16
+ visited: "visited",
17
+ target: "target",
18
+ "focus-within": "focus-within",
19
+ "focus-visible": "focus-visible",
20
+ // --- Estados de Formulario ---
21
+ disabled: "disabled",
22
+ enabled: "enabled",
23
+ checked: "checked",
24
+ indeterminate: "indeterminate",
25
+ default: "default",
26
+ required: "required",
27
+ valid: "valid",
28
+ invalid: "invalid",
29
+ "in-range": "in-range",
30
+ "out-of-range": "out-of-range",
31
+ "placeholder-shown": "placeholder-shown",
32
+ autofill: "autofill",
33
+ "read-only": "read-only",
34
+ // --- Posicionamiento y Árbol (Pseudo-clases) ---
35
+ first: "first",
36
+ last: "last",
37
+ only: "only",
38
+ odd: "odd",
39
+ even: "even",
40
+ "first-of-type": "first-of-type",
41
+ "last-of-type": "last-of-type",
42
+ "only-of-type": "only-of-type",
43
+ empty: "empty",
44
+ // --- Relaciones de Elementos (Group & Peer) ---
45
+ group: "group-hover",
46
+ // Alias amigable
47
+ "group-hover": "group-hover",
48
+ "group-focus": "group-focus",
49
+ "group-active": "group-active",
50
+ "group-visited": "group-visited",
51
+ "group-invalid": "group-invalid",
52
+ peer: "peer-hover",
53
+ // Alias amigable
54
+ "peer-hover": "peer-hover",
55
+ "peer-focus": "peer-focus",
56
+ "peer-active": "peer-active",
57
+ "peer-invalid": "peer-invalid",
58
+ // --- Media Queries (Preferencias de Sistema) ---
59
+ dark: "dark",
60
+ light: "light",
61
+ "motion-reduce": "motion-reduce",
62
+ "motion-safe": "motion-safe",
63
+ "contrast-more": "contrast-more",
64
+ "contrast-less": "contrast-less",
65
+ portrait: "portrait",
66
+ landscape: "landscape",
67
+ // --- Pseudo-elementos ---
68
+ marker: "marker",
69
+ selection: "selection",
70
+ "first-line": "first-line",
71
+ "first-letter": "first-letter",
72
+ backdrop: "backdrop",
73
+ placeholder: "placeholder",
74
+ before: "before",
75
+ after: "after",
76
+ file: "file",
77
+ // --- Varios y Print ---
78
+ print: "print",
79
+ rtl: "rtl",
80
+ ltr: "ltr"
81
+ };
82
+ var cl = createCl(tailwindPlugin);
83
+
84
+ export { cl, tailwindPlugin };
85
+ //# sourceMappingURL=index.js.map
86
+ //# sourceMappingURL=index.js.map
package/dist/index.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;AAEO,IAAM,cAAA,GAAiB;AAAA;AAAA,EAE1B,IAAA,EAAM,MAAA;AAAA,EACN,EAAA,EAAI,IAAA;AAAA,EACJ,EAAA,EAAI,IAAA;AAAA,EACJ,EAAA,EAAI,IAAA;AAAA,EACJ,EAAA,EAAI,IAAA;AAAA,EACJ,KAAA,EAAO,KAAA;AAAA;AAAA,EAGP,KAAA,EAAO,OAAA;AAAA,EACP,KAAA,EAAO,OAAA;AAAA,EACP,MAAA,EAAQ,QAAA;AAAA,EACR,OAAA,EAAS,SAAA;AAAA,EACT,MAAA,EAAQ,QAAA;AAAA,EACR,cAAA,EAAgB,cAAA;AAAA,EAChB,eAAA,EAAiB,eAAA;AAAA;AAAA,EAGjB,QAAA,EAAU,UAAA;AAAA,EACV,OAAA,EAAS,SAAA;AAAA,EACT,OAAA,EAAS,SAAA;AAAA,EACT,aAAA,EAAe,eAAA;AAAA,EACf,OAAA,EAAS,SAAA;AAAA,EACT,QAAA,EAAU,UAAA;AAAA,EACV,KAAA,EAAO,OAAA;AAAA,EACP,OAAA,EAAS,SAAA;AAAA,EACT,UAAA,EAAY,UAAA;AAAA,EACZ,cAAA,EAAgB,cAAA;AAAA,EAChB,mBAAA,EAAqB,mBAAA;AAAA,EACrB,QAAA,EAAU,UAAA;AAAA,EACV,WAAA,EAAa,WAAA;AAAA;AAAA,EAGb,KAAA,EAAO,OAAA;AAAA,EACP,IAAA,EAAM,MAAA;AAAA,EACN,IAAA,EAAM,MAAA;AAAA,EACN,GAAA,EAAK,KAAA;AAAA,EACL,IAAA,EAAM,MAAA;AAAA,EACN,eAAA,EAAiB,eAAA;AAAA,EACjB,cAAA,EAAgB,cAAA;AAAA,EAChB,cAAA,EAAgB,cAAA;AAAA,EAChB,KAAA,EAAO,OAAA;AAAA;AAAA,EAGP,KAAA,EAAO,aAAA;AAAA;AAAA,EACP,aAAA,EAAe,aAAA;AAAA,EACf,aAAA,EAAe,aAAA;AAAA,EACf,cAAA,EAAgB,cAAA;AAAA,EAChB,eAAA,EAAiB,eAAA;AAAA,EACjB,eAAA,EAAiB,eAAA;AAAA,EACjB,IAAA,EAAM,YAAA;AAAA;AAAA,EACN,YAAA,EAAc,YAAA;AAAA,EACd,YAAA,EAAc,YAAA;AAAA,EACd,aAAA,EAAe,aAAA;AAAA,EACf,cAAA,EAAgB,cAAA;AAAA;AAAA,EAGhB,IAAA,EAAM,MAAA;AAAA,EACN,KAAA,EAAO,OAAA;AAAA,EACP,eAAA,EAAiB,eAAA;AAAA,EACjB,aAAA,EAAe,aAAA;AAAA,EACf,eAAA,EAAiB,eAAA;AAAA,EACjB,eAAA,EAAiB,eAAA;AAAA,EACjB,QAAA,EAAU,UAAA;AAAA,EACV,SAAA,EAAW,WAAA;AAAA;AAAA,EAGX,MAAA,EAAQ,QAAA;AAAA,EACR,SAAA,EAAW,WAAA;AAAA,EACX,YAAA,EAAc,YAAA;AAAA,EACd,cAAA,EAAgB,cAAA;AAAA,EAChB,QAAA,EAAU,UAAA;AAAA,EACV,WAAA,EAAa,aAAA;AAAA,EACb,MAAA,EAAQ,QAAA;AAAA,EACR,KAAA,EAAO,OAAA;AAAA,EACP,IAAA,EAAM,MAAA;AAAA;AAAA,EAGN,KAAA,EAAO,OAAA;AAAA,EACP,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK;AACT;AAEO,IAAM,EAAA,GAAK,SAAS,cAAc","file":"index.js","sourcesContent":["import { createCl } from \"clases\";\r\n\r\nexport const tailwindPlugin = {\r\n // --- Estructura y Pantallas ---\r\n base: 'base',\r\n sm: 'sm',\r\n md: 'md',\r\n lg: 'lg',\r\n xl: 'xl',\r\n '2xl': '2xl',\r\n\r\n // --- Estados de Usuario (Interacción) ---\r\n hover: 'hover',\r\n focus: 'focus',\r\n active: 'active',\r\n visited: 'visited',\r\n target: 'target',\r\n 'focus-within': 'focus-within',\r\n 'focus-visible': 'focus-visible',\r\n\r\n // --- Estados de Formulario ---\r\n disabled: 'disabled',\r\n enabled: 'enabled',\r\n checked: 'checked',\r\n indeterminate: 'indeterminate',\r\n default: 'default',\r\n required: 'required',\r\n valid: 'valid',\r\n invalid: 'invalid',\r\n 'in-range': 'in-range',\r\n 'out-of-range': 'out-of-range',\r\n 'placeholder-shown': 'placeholder-shown',\r\n autofill: 'autofill',\r\n 'read-only': 'read-only',\r\n\r\n // --- Posicionamiento y Árbol (Pseudo-clases) ---\r\n first: 'first',\r\n last: 'last',\r\n only: 'only',\r\n odd: 'odd',\r\n even: 'even',\r\n 'first-of-type': 'first-of-type',\r\n 'last-of-type': 'last-of-type',\r\n 'only-of-type': 'only-of-type',\r\n empty: 'empty',\r\n\r\n // --- Relaciones de Elementos (Group & Peer) ---\r\n group: 'group-hover', // Alias amigable\r\n 'group-hover': 'group-hover',\r\n 'group-focus': 'group-focus',\r\n 'group-active': 'group-active',\r\n 'group-visited': 'group-visited',\r\n 'group-invalid': 'group-invalid',\r\n peer: 'peer-hover', // Alias amigable\r\n 'peer-hover': 'peer-hover',\r\n 'peer-focus': 'peer-focus',\r\n 'peer-active': 'peer-active',\r\n 'peer-invalid': 'peer-invalid',\r\n\r\n // --- Media Queries (Preferencias de Sistema) ---\r\n dark: 'dark',\r\n light: 'light',\r\n 'motion-reduce': 'motion-reduce',\r\n 'motion-safe': 'motion-safe',\r\n 'contrast-more': 'contrast-more',\r\n 'contrast-less': 'contrast-less',\r\n portrait: 'portrait',\r\n landscape: 'landscape',\r\n\r\n // --- Pseudo-elementos ---\r\n marker: 'marker',\r\n selection: 'selection',\r\n 'first-line': 'first-line',\r\n 'first-letter': 'first-letter',\r\n backdrop: 'backdrop',\r\n placeholder: 'placeholder',\r\n before: 'before',\r\n after: 'after',\r\n file: 'file',\r\n\r\n // --- Varios y Print ---\r\n print: 'print',\r\n rtl: 'rtl',\r\n ltr: 'ltr'\r\n};\r\n\r\nexport const cl = createCl(tailwindPlugin);\r\n\r\n// Export the type so users can use it in their component props\r\nexport type TailwindKey = keyof typeof tailwindPlugin;\r\n"]}
package/package.json ADDED
@@ -0,0 +1,20 @@
1
+ {
2
+ "name": "clases-tailwind",
3
+ "version": "1.0.0",
4
+ "type": "module",
5
+ "main": "./dist/index.js",
6
+ "types": "./dist/index.d.ts",
7
+ "exports": {
8
+ ".": {
9
+ "types": "./dist/index.d.ts",
10
+ "import": "./dist/index.js"
11
+ }
12
+ },
13
+ "dependencies": {
14
+ "clases": "1.0.0"
15
+ },
16
+ "scripts": {
17
+ "build": "tsup src/index.ts --format cjs,esm --dts --clean",
18
+ "dev": "tsup src/index.ts --format cjs,esm --dts --watch"
19
+ }
20
+ }
package/src/index.test.ts ADDED
@@ -0,0 +1,57 @@
1
+ import { describe, it, expect } from 'vitest';
2
+ import { cl } from './index';
3
+
4
+ describe('cl utility (Tailwind version)', () => {
5
+ it('debe procesar clases base (sin prefijo)', () => {
6
+ const result = cl({ base: 'p-4 bg-red-500' });
7
+ expect(result).toBe('p-4 bg-red-500');
8
+ });
9
+
10
+ it('debe aplicar prefijos simples de Tailwind', () => {
11
+ const result = cl({
12
+ base: 'text-black',
13
+ md: 'text-lg',
14
+ hover: 'text-blue-500'
15
+ });
16
+ expect(result).toContain('text-black');
17
+ expect(result).toContain('md:text-lg');
18
+ expect(result).toContain('hover:text-blue-500');
19
+ });
20
+
21
+ it('debe manejar arrays de clases en los prefijos', () => {
22
+ const result = cl({
23
+ base: ['p-4', 'm-2'],
24
+ lg: ['flex', 'items-center']
25
+ });
26
+ expect(result).toBe('p-4 m-2 lg:flex lg:items-center');
27
+ });
28
+
29
+ it('debe limpiar clases conflictivas usando tailwind-merge', () => {
30
+ // Aquí p-4 y p-8 chocan, debería ganar p-8
31
+ const result = cl('p-4', { base: 'p-8' });
32
+ expect(result).toBe('p-8');
33
+ });
34
+
35
+ it('debe ignorar valores falsy (condicionales)', () => {
36
+ const isError = false;
37
+ const result = cl({
38
+ base: 'p-4',
39
+ md: isError && 'bg-red-500'
40
+ });
41
+ expect(result).toBe('p-4');
42
+ });
43
+
44
+ it('debe funcionar con prefijos custom no definidos (fallback)', () => {
45
+ const result = cl({
46
+ 'data-active': 'opacity-100'
47
+ });
48
+ expect(result).toBe('data-active:opacity-100');
49
+ });
50
+
51
+ it('debe manejar el alias especial "group"', () => {
52
+ const result = cl({
53
+ group: 'opacity-50'
54
+ });
55
+ expect(result).toBe('group-hover:opacity-50');
56
+ });
57
+ });
package/src/index.ts ADDED
@@ -0,0 +1,90 @@
1
+ import { createCl } from "clases";
2
+
3
+ export const tailwindPlugin = {
4
+ // --- Estructura y Pantallas ---
5
+ base: 'base',
6
+ sm: 'sm',
7
+ md: 'md',
8
+ lg: 'lg',
9
+ xl: 'xl',
10
+ '2xl': '2xl',
11
+
12
+ // --- Estados de Usuario (Interacción) ---
13
+ hover: 'hover',
14
+ focus: 'focus',
15
+ active: 'active',
16
+ visited: 'visited',
17
+ target: 'target',
18
+ 'focus-within': 'focus-within',
19
+ 'focus-visible': 'focus-visible',
20
+
21
+ // --- Estados de Formulario ---
22
+ disabled: 'disabled',
23
+ enabled: 'enabled',
24
+ checked: 'checked',
25
+ indeterminate: 'indeterminate',
26
+ default: 'default',
27
+ required: 'required',
28
+ valid: 'valid',
29
+ invalid: 'invalid',
30
+ 'in-range': 'in-range',
31
+ 'out-of-range': 'out-of-range',
32
+ 'placeholder-shown': 'placeholder-shown',
33
+ autofill: 'autofill',
34
+ 'read-only': 'read-only',
35
+
36
+ // --- Posicionamiento y Árbol (Pseudo-clases) ---
37
+ first: 'first',
38
+ last: 'last',
39
+ only: 'only',
40
+ odd: 'odd',
41
+ even: 'even',
42
+ 'first-of-type': 'first-of-type',
43
+ 'last-of-type': 'last-of-type',
44
+ 'only-of-type': 'only-of-type',
45
+ empty: 'empty',
46
+
47
+ // --- Relaciones de Elementos (Group & Peer) ---
48
+ group: 'group-hover', // Alias amigable
49
+ 'group-hover': 'group-hover',
50
+ 'group-focus': 'group-focus',
51
+ 'group-active': 'group-active',
52
+ 'group-visited': 'group-visited',
53
+ 'group-invalid': 'group-invalid',
54
+ peer: 'peer-hover', // Alias amigable
55
+ 'peer-hover': 'peer-hover',
56
+ 'peer-focus': 'peer-focus',
57
+ 'peer-active': 'peer-active',
58
+ 'peer-invalid': 'peer-invalid',
59
+
60
+ // --- Media Queries (Preferencias de Sistema) ---
61
+ dark: 'dark',
62
+ light: 'light',
63
+ 'motion-reduce': 'motion-reduce',
64
+ 'motion-safe': 'motion-safe',
65
+ 'contrast-more': 'contrast-more',
66
+ 'contrast-less': 'contrast-less',
67
+ portrait: 'portrait',
68
+ landscape: 'landscape',
69
+
70
+ // --- Pseudo-elementos ---
71
+ marker: 'marker',
72
+ selection: 'selection',
73
+ 'first-line': 'first-line',
74
+ 'first-letter': 'first-letter',
75
+ backdrop: 'backdrop',
76
+ placeholder: 'placeholder',
77
+ before: 'before',
78
+ after: 'after',
79
+ file: 'file',
80
+
81
+ // --- Varios y Print ---
82
+ print: 'print',
83
+ rtl: 'rtl',
84
+ ltr: 'ltr'
85
+ };
86
+
87
+ export const cl = createCl(tailwindPlugin);
88
+
89
+ // Export the type so users can use it in their component props
90
+ export type TailwindKey = keyof typeof tailwindPlugin;
package/src/test/tailwind.test.ts ADDED
@@ -0,0 +1,23 @@
1
+ // packages/tailwind/src/test/tailwind.test.ts
2
+ import { describe, it, expect } from 'vitest';
3
+ import { cl, tailwindPlugin } from '../index';
4
+
5
+ describe('Tailwind Plugin Integration', () => {
6
+ it('should work out of the box with tailwind presets', () => {
7
+ const result = cl({
8
+ hover: 'opacity-50',
9
+ '2xl': 'container'
10
+ });
11
+
12
+ expect(result).toBe('hover:opacity-50 2xl:container');
13
+ });
14
+
15
+ it('should support the base key for standard classes', () => {
16
+ const result = cl({
17
+ base: 'flex flex-col',
18
+ md: 'flex-row'
19
+ });
20
+
21
+ expect(result).toBe('flex flex-col md:flex-row');
22
+ });
23
+ });
package/tsconfig.json ADDED
@@ -0,0 +1,14 @@
1
+ {
2
+ "compilerOptions": {
3
+ "target": "ESNext",
4
+ "module": "ESNext",
5
+ "moduleResolution": "bundler",
6
+ "strict": true,
7
+ "skipLibCheck": true,
8
+ "composite": true, // Required for project references
9
+ "declaration": true,
10
+ "paths": {
11
+ "clases": ["./packages/core/src/index.ts"]
12
+ }
13
+ }
14
+ }