tailwind-variants 0.0.25 → 0.0.27

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -18,9 +18,85 @@
18
18
  </p>
19
19
 
20
20
 
21
- # Tailwind Variants
21
+ ## Features
22
+
23
+ - Zero runtime
24
+ - First-class variant API
25
+ - Responsive variants
26
+ - Slots support
27
+ - Composition support
28
+ - Fully typed
29
+ - Framework agnostic
30
+ - Automatic conflict resolution
31
+
32
+ ## Documentation
33
+
34
+ For full documentation, visit [tailwind-variants.org](https://tailwind-variants.org)
35
+
36
+ ## Quick Start
37
+
38
+ 1. Installation:
39
+ To use Tailwind Variants in your project, you can install it as a dependency:
40
+
41
+ ```bash
42
+ yarn add tailwind-variants
43
+ # or
44
+ npm i tailwind-variants
45
+ ```
46
+
47
+ 2. Usage:
48
+
49
+ ```js
50
+ import { tv } from 'tailwind-variants';
51
+
52
+ const button = tv({
53
+ base: "font-medium bg-blue-500 text-white rounded-full active:opacity-80",
54
+ variants: {
55
+ color: {
56
+ primary: "bg-blue-500 text-white",
57
+ secondary: "bg-purple-500 text-white",
58
+ },
59
+ size: {
60
+ sm: "text-sm",
61
+ md: "text-base",
62
+ lg: "px-4 py-3 text-lg",
63
+ },
64
+ },
65
+ compoundVariants: [
66
+ {
67
+ size: ["sm", "md"],
68
+ class: "px-3 py-1",
69
+ },
70
+ ],
71
+ defaultVariants: {
72
+ size: "md",
73
+ color: "primary",
74
+ }
75
+ });
76
+
77
+ return (
78
+ <button className={button({ size: 'sm', color: 'secondary' })}>Click me</button>
79
+ )
80
+ ```
81
+
82
+ 3. Responsive variants configuration (optional): If you want to use responsive variants
83
+ you need to add the Tailwind Variants `wrapper` to your TailwindCSS config file `tailwind.config.js`.
84
+
85
+ ```js
86
+ // tailwind.config.js
87
+
88
+ const { withTV } = require('tailwind-variants/transformer')
89
+
90
+ /** @type {import('tailwindcss').Config} */
91
+ module.exports = withTV({
92
+ content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
93
+ theme: {
94
+ extend: {},
95
+ },
96
+ plugins: [],
97
+ })
98
+ ```
22
99
 
23
- 🚧 Under construction - please check back later
24
100
 
25
101
  ## Acknowledgements
26
102
 
@@ -30,13 +106,15 @@
30
106
  - [**Stitches**](https://stitches.dev/) ([Modulz](https://modulz.app))
31
107
  The pioneers of the `variants` API movement. Inmense thanks to [Modulz](https://modulz.app) for their work on Stitches and the community around it. 🙏
32
108
 
33
- ## Installation
34
109
 
35
- ```sh
36
- yarn add tailwind-variants
37
- #or
38
- npm i tailwind-variants
39
- ```
110
+ ## Community
111
+
112
+ We're excited to see the community adopt NextUI, raise issues, and provide feedback. Whether it's a feature request, bug report, or a project to showcase, please get involved!
113
+
114
+ - [Discord](https://discord.gg/9b6yyZKmH4)
115
+ - [Twitter](https://twitter.com/getnextui)
116
+ - [GitHub Discussions](https://github.com/nextui-org/tailwind-variants/discussions)
117
+
40
118
  ## Contributing
41
119
 
42
120
  Contributions are always welcome!
@@ -0,0 +1,5 @@
1
+ import { twMerge, extendTailwindMerge } from 'tailwind-merge';
2
+
3
+ var o=(...e)=>e.flat(1/0).filter(Boolean).join(" "),l=e=>typeof e=="boolean"?`${e}`:e===0?"0":e,c=e=>!e||typeof e!="object"||Object.keys(e).length===0,a=(...e)=>[...e].flat().filter(Boolean),g=(...e)=>(r={})=>r.twMerge?(c(r.twMergeConfig)?twMerge:extendTailwindMerge(r.twMergeConfig))(o(e)):o(e),x=(e,r)=>{let n={};return typeof e!="object"||typeof r!="object"||Object.keys(e).forEach(t=>{r[t]?n[t]=o([e[t],r[t]]):n[t]=e[t];}),n},i=(e,r)=>{let n={};for(let t in e)r!=null&&r.hasOwnProperty(t)?n[t]=typeof e[t]=="object"?i(e[t],r[t]):r[t]+" "+e[t]:n[t]=e[t];for(let t in r)n.hasOwnProperty(t)||(n[t]=r[t]);return n},y=e=>!e||typeof e!="string"?e:e.replace(/\s+/g," ").trim();
4
+
5
+ export { o as a, l as b, c, a as d, g as e, x as f, i as g, y as h };
package/dist/index.cjs CHANGED
@@ -2,6 +2,6 @@
2
2
 
3
3
  var tailwindMerge = require('tailwind-merge');
4
4
 
5
- var O=(...t)=>t.flat(1/0).filter(Boolean).join(" "),M=t=>typeof t=="boolean"?`${t}`:t===0?"0":t,m=t=>t&&Object.keys(t).length>0,j=(...t)=>(l={})=>l.twMerge?(m(l.twMergeConfig)?tailwindMerge.extendTailwindMerge(l.twMergeConfig):tailwindMerge.twMerge)(O(t)):O(t),S=(t,l)=>{let b={};return typeof t!="object"||typeof l!="object"||Object.keys(t).forEach(c=>{l[c]?b[c]=O([t[c],l[c]]):b[c]=t[c];}),b},w=t=>!t||typeof t!="string"?t:t.replace(/\s+/g," ").trim();var G=(t,l={twMerge:!0,twMergeConfig:{}})=>{let{slots:b={},variants:c={},compoundVariants:g=[],defaultVariants:o={}}=t,$=i=>{var A;if(c==null&&!m(b))return j(t==null?void 0:t.base,i==null?void 0:i.class,i==null?void 0:i.className)(l);if(g&&!Array.isArray(g))throw new TypeError(`The "compoundVariants" prop must be an array. Received: ${typeof g}`);let d={base:t==null?void 0:t.base,...b},T=(e,r,n=[],f)=>{let a=n;if(typeof r=="string")a.push(w(r).split(" ").map(u=>`${e}:${u}`));else if(Array.isArray(r))a.push(r.flatMap(u=>`${e}:${u}`));else if(typeof r=="object"&&typeof f=="string"){let u=r==null?void 0:r[f];if(u&&typeof u=="string"){let s=w(u);a[f]=a[f]?[...a[f],...s.split(" ").map(y=>`${e}:${y}`)]:s.split(" ").map(y=>`${e}:${y}`);}else Array.isArray(u)&&u.length>0&&(a[f]=u.flatMap(s=>`${e}:${s}`));}return a},C=(e,r=null)=>{let n=c==null?void 0:c[e];if(typeof n!="object"||!m(n))return null;let f=i==null?void 0:i[e],a=o==null?void 0:o[e],u=[];if(f===null)return null;let s=M(f);typeof s=="object"&&(u=Object.keys(s).reduce((N,x)=>{let E=s[x],U=n==null?void 0:n[E];return x==="initial"?(a=E,N):T(x,U,N,r)},[]));let y=n[s]||n[M(a)];return typeof u=="object"&&typeof r=="string"&&u[r]?S(u,y):u.length>0?[y,...u]:y},v=c?Object.keys(c).map(C):null,F=e=>!c||typeof c!="object"?null:Object.keys(c).map(r=>{let n=C(r,e);return e==="base"&&typeof n=="string"?n:n&&n[e]}).filter(Boolean),I=i&&Object.fromEntries(Object.entries(i).filter(([,e])=>e!==void 0)),h=g==null?void 0:g.filter(({class:e,className:r,...n})=>Object.entries(n).every(([f,a])=>{var y;let u=typeof(i==null?void 0:i[f])=="object"?(y=i[f])==null?void 0:y.initial:{},s={...o,...u,...I};return Array.isArray(a)?a.includes(s[f]):s[f]===a})).flatMap(({class:e,className:r})=>[e,r]),R=()=>{let e=h;return Array.isArray(e)?e.reduce((r,n)=>(typeof n=="string"&&(r.base=j(r.base,n)(l)),typeof n=="object"&&Object.entries(n).forEach(([f,a])=>{r[f]=j(r[f],a)(l);}),r),{}):e};if(m(b)){let e=(A=R())!=null?A:[];return {...typeof d=="object"&&m(d)?Object.keys(d).reduce((n,f)=>(n[f]=a=>j(d[f],F(f),e==null?void 0:e[f],a==null?void 0:a.class,a==null?void 0:a.className)(l),n),{}):{}}}return j(t==null?void 0:t.base,v,h,i==null?void 0:i.class,i==null?void 0:i.className)(l)},B=()=>{if(!(!c||typeof c!="object"))return Object.keys(c)};return $.variantkeys=B(),$};
5
+ var h=(...e)=>e.flat(1/0).filter(Boolean).join(" "),v=e=>typeof e=="boolean"?`${e}`:e===0?"0":e,i=e=>!e||typeof e!="object"||Object.keys(e).length===0,B=(...e)=>[...e].flat().filter(Boolean),j=(...e)=>(l={})=>l.twMerge?(i(l.twMergeConfig)?tailwindMerge.twMerge:tailwindMerge.extendTailwindMerge(l.twMergeConfig))(h(e)):h(e),E=(e,l)=>{let y={};return typeof e!="object"||typeof l!="object"||Object.keys(e).forEach(f=>{l[f]?y[f]=h([e[f],l[f]]):y[f]=e[f];}),y},S=(e,l)=>{let y={};for(let f in e)l!=null&&l.hasOwnProperty(f)?y[f]=typeof e[f]=="object"?S(e[f],l[f]):l[f]+" "+e[f]:y[f]=e[f];for(let f in l)y.hasOwnProperty(f)||(y[f]=l[f]);return y},N=e=>!e||typeof e!="string"?e:e.replace(/\s+/g," ").trim();var re=(e,l={twMerge:!0,twMergeConfig:{}})=>{var T,k,F,I,R;let{slots:y={},variants:f={},compoundVariants:b=[],defaultVariants:J={}}=e,A=h((T=e==null?void 0:e.extend)==null?void 0:T.base,e==null?void 0:e.base),d=S(f,(k=e==null?void 0:e.extend)==null?void 0:k.variants),M=Object.assign({},(F=e==null?void 0:e.extend)==null?void 0:F.defaultVariants,J),C=i(y)?{}:{base:e==null?void 0:e.base,...y},w=i((I=e==null?void 0:e.extend)==null?void 0:I.slots)?C:E((R=e==null?void 0:e.extend)==null?void 0:R.slots,i(C)?{base:e==null?void 0:e.base}:C),x=u=>{var q,z,D;if(i(d)&&i(y)&&i((q=e==null?void 0:e.extend)==null?void 0:q.slots))return j(A,u==null?void 0:u.class,u==null?void 0:u.className)(l);if(b&&!Array.isArray(b))throw new TypeError(`The "compoundVariants" prop must be an array. Received: ${typeof b}`);let P=(t,r,n=[],a)=>{let c=n;if(typeof r=="string")c.push(N(r).split(" ").map(s=>`${t}:${s}`));else if(Array.isArray(r))c.push(r.flatMap(s=>`${t}:${s}`));else if(typeof r=="object"&&typeof a=="string"){let s=r==null?void 0:r[a];if(s&&typeof s=="string"){let m=N(s);c[a]=c[a]?[...c[a],...m.split(" ").map(g=>`${t}:${g}`)]:m.split(" ").map(g=>`${t}:${g}`);}else Array.isArray(s)&&s.length>0&&(c[a]=s.flatMap(m=>`${t}:${m}`));}return c},V=(t,r=d,n=null)=>{let a=r==null?void 0:r[t];if(typeof a!="object"||i(a))return null;let c=u==null?void 0:u[t],s=M==null?void 0:M[t],m=[];if(c===null)return null;let g=v(c);typeof g=="object"&&(m=Object.keys(g).reduce((G,$)=>{let H=g[$],_=a==null?void 0:a[H];return $==="initial"?(s=H,G):P($,_,G,n)},[]));let O=a[g]||a[v(s)];return typeof m=="object"&&typeof n=="string"&&m[n]?E(m,O):m.length>0?[O,...m]:O},Q=()=>{var n;let t=d?Object.keys(d).map(a=>V(a,d)):null,r=(n=e==null?void 0:e.extend)!=null&&n.variants?Object.keys(e.extend.variants).map(a=>V(a,e.extend.variants)):null;return B(r,t)},X=t=>!d||typeof d!="object"?null:Object.keys(d).map(r=>{let n=V(r,d,t);return t==="base"&&typeof n=="string"?n:n&&n[t]}).filter(Boolean),Y=u&&Object.fromEntries(Object.entries(u).filter(([,t])=>t!==void 0)),U=(t=[])=>t==null?void 0:t.filter(({class:r,className:n,...a})=>Object.entries(a).every(([c,s])=>{var O;let m=typeof(u==null?void 0:u[c])=="object"?(O=u[c])==null?void 0:O.initial:{},g={...M,...m,...Y};return Array.isArray(s)?s.includes(g[c]):g[c]===s})).flatMap(({class:r,className:n})=>[r,n]),W=()=>{var n;let t=U(b),r=U((n=e==null?void 0:e.extend)==null?void 0:n.compoundVariants);return B(r,t)},Z=()=>{let t=W();return Array.isArray(t)?t.reduce((r,n)=>(typeof n=="string"&&(r.base=j(r.base,n)(l)),typeof n=="object"&&Object.entries(n).forEach(([a,c])=>{r[a]=j(r[a],c)(l);}),r),{}):t};if(!i(y)||!i((z=e==null?void 0:e.extend)==null?void 0:z.slots)){let t=(D=Z())!=null?D:[];return {...typeof w=="object"&&!i(w)?Object.keys(w).reduce((n,a)=>(n[a]=c=>j(w[a],X(a),t==null?void 0:t[a],c==null?void 0:c.class,c==null?void 0:c.className)(l),n),{}):{}}}return j(A,Q(),W(),u==null?void 0:u.class,u==null?void 0:u.className)(l)},L=()=>{if(!(!d||typeof d!="object"))return Object.keys(d)};return x.variantkeys=L(),x.base=A,x.slots=w,x.variants=d,x.defaultVariants=M,x.compoundVariants=b,x};
6
6
 
7
- exports.tv = G;
7
+ exports.tv = re;
package/dist/index.d.ts CHANGED
@@ -15,56 +15,111 @@ type SlotsClassValue<S extends TVSlots, B extends ClassValue> = {
15
15
  [K in TVSlotsWithBase<S, B>]?: ClassValue;
16
16
  };
17
17
 
18
- export type TVVariants<S extends TVSlots, B extends ClassValue> = {
18
+ type TVVariantsDefault<S extends TVSlots, B extends ClassValue> = {
19
19
  [key: string]: {
20
20
  [key: string]: S extends TVSlots ? SlotsClassValue<S, B> | ClassValue : ClassValue;
21
21
  };
22
22
  };
23
23
 
24
+ export type TVVariants<
25
+ S extends TVSlots,
26
+ B extends ClassValue,
27
+ EV extends TVVariants = undefined,
28
+ > = EV extends undefined
29
+ ? TVVariantsDefault<S, B>
30
+ :
31
+ | {
32
+ [K in keyof EV]?:
33
+ | {
34
+ [K2 in keyof EV[K]]?: S extends TVSlots
35
+ ? SlotsClassValue<S, B> | ClassValue
36
+ : ClassValue;
37
+ };
38
+ }
39
+ | TVVariantsDefault<S, B>;
40
+
24
41
  export type TVCompoundVariants<
25
42
  V extends TVVariants<S>,
43
+ EV extends TVVariants,
26
44
  S extends TVSlots,
27
45
  B extends ClassValue,
28
46
  > = Array<
29
47
  {
30
- [K in keyof V]?: StringToBoolean<keyof V[K]> | StringToBoolean<keyof V[K]>[];
48
+ [K in keyof V | keyof EV]?:
49
+ | StringToBoolean<keyof V[K] | keyof EV[K]>
50
+ | StringToBoolean<keyof V[K]>[];
31
51
  } & ClassProp<SlotsClassValue<S, B> | ClassValue>
32
52
  >;
33
53
 
34
- export type TVDefaultVariants<V extends TVVariants<S>, S extends TVSlots> = {
35
- [K in keyof V]?: StringToBoolean<keyof V[K]>;
54
+ export type TVDefaultVariants<V extends TVVariants<S>, EV extends TVVariants, S extends TVSlots> = {
55
+ [K in keyof V | keyof EV]?: StringToBoolean<keyof V[K] | keyof EV[K]>;
36
56
  };
37
57
 
38
- export type TVScreenPropsValue<V extends TVVariants<S>, K extends keyof V> = {
39
- [K2 in TVScreens]?: StringToBoolean<keyof V[K]>;
58
+ export type TVScreenPropsValue<V extends TVVariants, K extends keyof V> = {
59
+ [Screen in TVScreens]?: StringToBoolean<keyof V[K]>;
40
60
  };
41
61
 
42
- export type TVProps<V extends TVVariants<S>, S extends TVSlots> = V extends undefined
43
- ? ClassProp<ClassValue>
62
+ export type TVProps<
63
+ V extends TVVariants<S>,
64
+ EV extends TVVariants,
65
+ S extends TVSlots,
66
+ > = EV extends undefined
67
+ ? V extends undefined
68
+ ? ClassProp<ClassValue>
69
+ : {
70
+ [K in keyof V]?: StringToBoolean<keyof V[K]> | TVScreenPropsValue<V, K>;
71
+ } & ClassProp<ClassValue>
72
+ : V extends undefined
73
+ ? {
74
+ [K in keyof EV]?: StringToBoolean<keyof EV[K]> | TVScreenPropsValue<EV, K>;
75
+ } & ClassProp<ClassValue>
44
76
  : {
45
- [K in keyof V]?: StringToBoolean<keyof V[K]> | TVScreenPropsValue<V, K>;
77
+ [K in keyof V | keyof EV]?:
78
+ | StringToBoolean<keyof V[K] | keyof EV[K]>
79
+ | TVScreenPropsValue<EV & V, K>;
46
80
  } & ClassProp<ClassValue>;
47
81
 
48
82
  export type TVVariantKeys<V extends TVVariants<S>, S extends TVSlots> = V extends Object
49
83
  ? Array<keyof V>
50
84
  : undefined;
51
85
 
52
- export type TVReturnType<V extends TVVariants<S>, S extends TVSlots, B extends ClassValue> = {
53
- (props?: TVProps<V, S>): S extends undefined
54
- ? string
55
- : {[K in TVSlotsWithBase<S, B>]: (slotProps?: ClassProp) => string};
56
- } & Record<"variantkeys", TVVariantKeys<V, S>>;
86
+ export type TVReturnProps<V extends TVVariants<S>, S extends TVSlots, B extends ClassValue> = {
87
+ base: B;
88
+ slots: S;
89
+ variants: V;
90
+ defaultVariants: TVDefaultVariants<V, S>;
91
+ compoundVariants: TVCompoundVariants<V, S, B>;
92
+ variantkeys: TVVariantKeys<V, S>;
93
+ };
94
+
95
+ export type TVReturnType<
96
+ V extends TVVariants<S>,
97
+ EV extends TVVariants,
98
+ S extends TVSlots,
99
+ ES extends TVSlots,
100
+ B extends ClassValue,
101
+ > = {
102
+ (props?: TVProps<V, EV, S>): ES extends undefined
103
+ ? S extends undefined
104
+ ? string
105
+ : {[K in TVSlotsWithBase<S, B>]: (slotProps?: ClassProp) => string}
106
+ : {[K in TVSlotsWithBase<ES & S, B>]: (slotProps?: ClassProp) => string};
107
+ } & TVReturnProps<V, S, B>;
57
108
 
58
109
  export type TV = {
59
110
  <
60
- V extends TVVariants<S> = undefined,
61
- CV extends TVCompoundVariants<V, S, B> = undefined,
62
- DV extends TVDefaultVariants<V, S> = undefined,
111
+ V extends TVVariants<S, B, EV> = undefined,
112
+ CV extends TVCompoundVariants<V, EV, S, B> = undefined,
113
+ DV extends TVDefaultVariants<V, EV, S> = undefined,
63
114
  C extends TVConfig,
64
115
  B extends ClassValue = undefined,
65
116
  S extends TVSlots = undefined,
117
+ E extends ReturnType<TV> = undefined,
118
+ EV extends TVVariants = E["variants"] extends TVVariants ? E["variants"] : undefined,
119
+ ES extends TVSlots = E["slots"] extends TVSlots ? E["slots"] : undefined,
66
120
  >(
67
121
  options: {
122
+ extend?: E;
68
123
  base?: B;
69
124
  slots?: S;
70
125
  variants?: V;
@@ -72,7 +127,7 @@ export type TV = {
72
127
  defaultVariants?: DV;
73
128
  },
74
129
  config?: C,
75
- ): TVReturnType<V, S, B>;
130
+ ): TVReturnType<V, EV, S, ES, B>;
76
131
  };
77
132
 
78
133
  export declare const tv: TV;
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
- import { c, d, b, e, f } from './chunk-K6NVJFM7.js';
1
+ import { a, g, c, f, e, d, b, h } from './chunk-C5RUXROF.js';
2
2
 
3
- var q=(l,m={twMerge:!0,twMergeConfig:{}})=>{let{slots:$={},variants:u={},compoundVariants:b$1=[],defaultVariants:g={}}=l,h=f$1=>{var E;if(u==null&&!c($))return d(l==null?void 0:l.base,f$1==null?void 0:f$1.class,f$1==null?void 0:f$1.className)(m);if(b$1&&!Array.isArray(b$1))throw new TypeError(`The "compoundVariants" prop must be an array. Received: ${typeof b$1}`);let d$1={base:l==null?void 0:l.base,...$},k=(t,e,n=[],a)=>{let r=n;if(typeof e=="string")r.push(f(e).split(" ").map(i=>`${t}:${i}`));else if(Array.isArray(e))r.push(e.flatMap(i=>`${t}:${i}`));else if(typeof e=="object"&&typeof a=="string"){let i=e==null?void 0:e[a];if(i&&typeof i=="string"){let c=f(i);r[a]=r[a]?[...r[a],...c.split(" ").map(y=>`${t}:${y}`)]:c.split(" ").map(y=>`${t}:${y}`);}else Array.isArray(i)&&i.length>0&&(r[a]=i.flatMap(c=>`${t}:${c}`));}return r},N=(t,e$1=null)=>{let n=u==null?void 0:u[t];if(typeof n!="object"||!c(n))return null;let a=f$1==null?void 0:f$1[t],r=g==null?void 0:g[t],i=[];if(a===null)return null;let c$1=b(a);typeof c$1=="object"&&(i=Object.keys(c$1).reduce((M,A)=>{let S=c$1[A],U=n==null?void 0:n[S];return A==="initial"?(r=S,M):k(A,U,M,e$1)},[]));let y=n[c$1]||n[b(r)];return typeof i=="object"&&typeof e$1=="string"&&i[e$1]?e(i,y):i.length>0?[y,...i]:y},B=u?Object.keys(u).map(N):null,T=t=>!u||typeof u!="object"?null:Object.keys(u).map(e=>{let n=N(e,t);return t==="base"&&typeof n=="string"?n:n&&n[t]}).filter(Boolean),F=f$1&&Object.fromEntries(Object.entries(f$1).filter(([,t])=>t!==void 0)),v=b$1==null?void 0:b$1.filter(({class:t,className:e,...n})=>Object.entries(n).every(([a,r])=>{var y;let i=typeof(f$1==null?void 0:f$1[a])=="object"?(y=f$1[a])==null?void 0:y.initial:{},c={...g,...i,...F};return Array.isArray(r)?r.includes(c[a]):c[a]===r})).flatMap(({class:t,className:e})=>[t,e]),R=()=>{let t=v;return Array.isArray(t)?t.reduce((e,n)=>(typeof n=="string"&&(e.base=d(e.base,n)(m)),typeof n=="object"&&Object.entries(n).forEach(([a,r])=>{e[a]=d(e[a],r)(m);}),e),{}):t};if(c($)){let t=(E=R())!=null?E:[];return {...typeof d$1=="object"&&c(d$1)?Object.keys(d$1).reduce((n,a)=>(n[a]=r=>d(d$1[a],T(a),t==null?void 0:t[a],r==null?void 0:r.class,r==null?void 0:r.className)(m),n),{}):{}}}return d(l==null?void 0:l.base,B,v,f$1==null?void 0:f$1.class,f$1==null?void 0:f$1.className)(m)},x=()=>{if(!(!u||typeof u!="object"))return Object.keys(u)};return h.variantkeys=x(),h};
3
+ var o=(e$1,x={twMerge:!0,twMergeConfig:{}})=>{var E,k,w,B,T;let{slots:V={},variants:I={},compoundVariants:s=[],defaultVariants:J={}}=e$1,A=a((E=e$1==null?void 0:e$1.extend)==null?void 0:E.base,e$1==null?void 0:e$1.base),l=g(I,(k=e$1==null?void 0:e$1.extend)==null?void 0:k.variants),i=Object.assign({},(w=e$1==null?void 0:e$1.extend)==null?void 0:w.defaultVariants,J),$=c(V)?{}:{base:e$1==null?void 0:e$1.base,...V},O=c((B=e$1==null?void 0:e$1.extend)==null?void 0:B.slots)?$:f((T=e$1==null?void 0:e$1.extend)==null?void 0:T.slots,c($)?{base:e$1==null?void 0:e$1.base}:$),y=c$1=>{var U,W,q;if(c(l)&&c(V)&&c((U=e$1==null?void 0:e$1.extend)==null?void 0:U.slots))return e(A,c$1==null?void 0:c$1.class,c$1==null?void 0:c$1.className)(x);if(s&&!Array.isArray(s))throw new TypeError(`The "compoundVariants" prop must be an array. Received: ${typeof s}`);let Q=(t,a,n=[],r)=>{let u=n;if(typeof a=="string")u.push(h(a).split(" ").map(f=>`${t}:${f}`));else if(Array.isArray(a))u.push(a.flatMap(f=>`${t}:${f}`));else if(typeof a=="object"&&typeof r=="string"){let f=a==null?void 0:a[r];if(f&&typeof f=="string"){let d=h(f);u[r]=u[r]?[...u[r],...d.split(" ").map(b=>`${t}:${b}`)]:d.split(" ").map(b=>`${t}:${b}`);}else Array.isArray(f)&&f.length>0&&(u[r]=f.flatMap(d=>`${t}:${d}`));}return u},v=(t,a=l,n=null)=>{let r=a==null?void 0:a[t];if(typeof r!="object"||c(r))return null;let u=c$1==null?void 0:c$1[t],f$1=i==null?void 0:i[t],d=[];if(u===null)return null;let b$1=b(u);typeof b$1=="object"&&(d=Object.keys(b$1).reduce((z,C)=>{let D=b$1[C],P=r==null?void 0:r[D];return C==="initial"?(f$1=D,z):Q(C,P,z,n)},[]));let j=r[b$1]||r[b(f$1)];return typeof d=="object"&&typeof n=="string"&&d[n]?f(d,j):d.length>0?[j,...d]:j},X=()=>{var n;let t=l?Object.keys(l).map(r=>v(r,l)):null,a=(n=e$1==null?void 0:e$1.extend)!=null&&n.variants?Object.keys(e$1.extend.variants).map(r=>v(r,e$1.extend.variants)):null;return d(a,t)},Y=t=>!l||typeof l!="object"?null:Object.keys(l).map(a=>{let n=v(a,l,t);return t==="base"&&typeof n=="string"?n:n&&n[t]}).filter(Boolean),Z=c$1&&Object.fromEntries(Object.entries(c$1).filter(([,t])=>t!==void 0)),F=(t=[])=>t==null?void 0:t.filter(({class:a,className:n,...r})=>Object.entries(r).every(([u,f])=>{var j;let d=typeof(c$1==null?void 0:c$1[u])=="object"?(j=c$1[u])==null?void 0:j.initial:{},b={...i,...d,...Z};return Array.isArray(f)?f.includes(b[u]):b[u]===f})).flatMap(({class:a,className:n})=>[a,n]),R=()=>{var n;let t=F(s),a=F((n=e$1==null?void 0:e$1.extend)==null?void 0:n.compoundVariants);return d(a,t)},_=()=>{let t=R();return Array.isArray(t)?t.reduce((a,n)=>(typeof n=="string"&&(a.base=e(a.base,n)(x)),typeof n=="object"&&Object.entries(n).forEach(([r,u])=>{a[r]=e(a[r],u)(x);}),a),{}):t};if(!c(V)||!c((W=e$1==null?void 0:e$1.extend)==null?void 0:W.slots)){let t=(q=_())!=null?q:[];return {...typeof O=="object"&&!c(O)?Object.keys(O).reduce((n,r)=>(n[r]=u=>e(O[r],Y(r),t==null?void 0:t[r],u==null?void 0:u.class,u==null?void 0:u.className)(x),n),{}):{}}}return e(A,X(),R(),c$1==null?void 0:c$1.class,c$1==null?void 0:c$1.className)(x)},L=()=>{if(!(!l||typeof l!="object"))return Object.keys(l)};return y.variantkeys=L(),y.base=A,y.slots=O,y.variants=l,y.defaultVariants=i,y.compoundVariants=s,y};
4
4
 
5
- export { q as tv };
5
+ export { o as tv };
@@ -1,11 +1,12 @@
1
1
  'use strict';
2
2
 
3
- var v=["xs","sm","md","lg","xl","2xl"],l={tv:/tv\({[\s\S]*?}\)/g,tvContent:/\({[\s\S]*?}\)/g,comment:/\/\*[\s\S]*?\*\/|([^\\:]|^)\/\/.*$/gm,blankLine:/^\s*$(?:\r\n?|\n)/gm},u=t=>Array.isArray(t),s=t=>!!(!t||u(t)&&t.length===0||typeof t=="string"&&t.length===0||typeof t=="object"&&Object.keys(t).length===0),y=t=>t.replace(l.comment,"$1").toString().replace(l.blankLine,"").toString().match(l.tv),d=t=>{let n=y(t);if(!s(n))return n.map(e=>new Function(`return ${e.match(l.tvContent).toString()}`)())},p=t=>t.flatMap(n=>n).toString().replaceAll(","," ").split(" "),h=t=>{let n={};for(let[e,r]of Object.entries(t))n[e]={},n[e].original=r,!s(r)&&(n.temp=u(r)?p(r):r.split(" "),v.forEach(i=>{let o="";n.temp.forEach(c=>{o+=`${i}:${c} `;}),n[e][i]=o.trimEnd();}),delete n.temp);return n},b=t=>typeof t=="string"?t.split(" "):u(t)?p(t):t instanceof Object?h(t):t,j=t=>{let{variants:n={}}=t;if(s(n))return;let e={};for(let[r,i]of Object.entries(n))if(e[r]={},!s(i))for(let[o,c]of Object.entries(i)){if(e[r][o]={},e[r][o].original=c,s(c))continue;let f=b(c);if(!s(f)){if(!u(f)){e[r][o]=f;continue}v.forEach(m=>{let g="";f.forEach(C=>{g+=`${m}:${C} `;}),e[r][o][m]=g.trimEnd();});}}return e},a=t=>{try{if(!t.includes("tailwind-variants"))return t;let n=d(t);if(s(n))return t;let e=JSON.stringify(n.map(r=>j(r)),void 0,2);return t.concat(`
3
+ var b=["xs","sm","md","lg","xl","2xl"],a={tv:/tv\({[\s\S]*?}\)/g,tvContent:/\({[\s\S]*?}\)/g,comment:/\/\*[\s\S]*?\*\/|([^\\:]|^)\/\/.*$/gm,blankLine:/^\s*$(?:\r\n?|\n)/gm,ext:/\.\w+/g},u=n=>Array.isArray(n),g=n=>typeof n=="string",m=n=>typeof n=="object",y=n=>typeof n=="function",f=n=>!!(!n||u(n)&&n.length===0||g(n)&&n.length===0||m(n)&&Object.keys(n).length===0),E=(...n)=>t=>n.reduce((e,r)=>r(e),t),O=n=>n.replace(a.comment,"$1").toString().replace(a.blankLine,"").toString().match(a.tv),S=n=>{let t=O(n);if(!f(t))return t.map(e=>new Function(`return ${e.match(a.tvContent).toString()}`)())},h=n=>n.flatMap(t=>t).toString().replaceAll(","," ").split(" "),C=n=>{let t={};for(let[e,r]of Object.entries(n))t[e]={},t[e].original=r,!f(r)&&(t.temp=u(r)?h(r):r.split(" "),b.forEach(o=>{let s="";t.temp.forEach(i=>{s+=`${o}:${i} `;}),t[e][o]=s.trimEnd();}),delete t.temp);return t},$=n=>g(n)?n.split(" "):u(n)?h(n):m(n)?C(n):n,d=n=>{let{variants:t={}}=n;if(f(t))return;let e={};for(let[r,o]of Object.entries(t))if(e[r]={},!f(o))for(let[s,i]of Object.entries(o)){if(e[r][s]={},e[r][s].original=i,f(i))continue;let c=$(i);if(!f(c)){if(!u(c)){e[r][s]=c;continue}b.forEach(v=>{let x="";c.forEach(j=>{x+=`${v}:${j} `;}),e[r][s][v]=x.trimEnd();});}}return e},l=n=>{try{if(!n.includes("tailwind-variants"))return n;let t=S(n);if(f(t))return n;let e=JSON.stringify(t.map(r=>d(r)),void 0,2);return n.concat(`
4
4
  /*
5
5
 
6
6
  ${e}
7
7
 
8
8
  */
9
- `)}catch{return t}},S={tsx:t=>a(t),ts:t=>a(t),jsx:t=>a(t),js:t=>a(t)};
9
+ `)}catch{return n}},p=n=>{let t=n.map(e=>{if(m(e)&&e.extension)return e.extension;let r=e.match(a.ext);return r||(r=e.split("{"),r=r.pop().replace("}","").split(",")),r.map(o=>o.replace(".","").split(".")).flat()}).flatMap(e=>e);return Array.from(new Set(t)).filter(e=>e!=="html")},T=n=>{var e,r;let t=Object.assign({},n);if(f(t==null?void 0:t.content)||g(t.content))return t;if(u(t.content)){let s=p(t.content).map(i=>[i,l]);return t.content={},t.content.files=n.content,t.content.transform=Object.fromEntries(s),t}if(m(t.content)){if(f((e=t.content)==null?void 0:e.files)||g(t.content.files))return t;if(f((r=t.content)==null?void 0:r.transform)){let s=p(t.content.files).map(i=>[i,l]);return t.content.transform=Object.fromEntries(s),t}if(y(t.content.transform)){let{transform:o}=n.content,i=p(t.content.files).map(c=>[c,E(l,o)]);return t.content.transform=Object.fromEntries(i),t}if(m(t.content.transform)){let{transform:o}=n.content,i=p(t.content.files).map(c=>[c,E(l,o[c]&&o[c])]);return t.content.transform=Object.fromEntries(i),t}return t}return t};
10
10
 
11
- exports.transformer = S;
11
+ exports.tvTransformer = l;
12
+ exports.withTV = T;
@@ -1,8 +1,13 @@
1
- export type TVTransformer = {
2
- tsx(content: string): string;
3
- ts(content: string): string;
4
- jsx(content: string): string;
5
- js(content: string): string;
1
+ import type {Config} from "tailwindcss/types/config";
2
+
3
+ export type TailwindConfig = Config;
4
+
5
+ export type WithTV = {
6
+ <TC extends TailwindConfig>(tvConfig: TailwindConfig): TC;
6
7
  };
7
8
 
8
- export declare const transformer: TVTransformer;
9
+ export declare const withTV: WithTV;
10
+
11
+ export type TVTransformer = {(content: string): string};
12
+
13
+ export declare const tvTransformer: TVTransformer;
@@ -1,9 +1,9 @@
1
- var v=["xs","sm","md","lg","xl","2xl"],l={tv:/tv\({[\s\S]*?}\)/g,tvContent:/\({[\s\S]*?}\)/g,comment:/\/\*[\s\S]*?\*\/|([^\\:]|^)\/\/.*$/gm,blankLine:/^\s*$(?:\r\n?|\n)/gm},u=t=>Array.isArray(t),s=t=>!!(!t||u(t)&&t.length===0||typeof t=="string"&&t.length===0||typeof t=="object"&&Object.keys(t).length===0),y=t=>t.replace(l.comment,"$1").toString().replace(l.blankLine,"").toString().match(l.tv),d=t=>{let n=y(t);if(!s(n))return n.map(e=>new Function(`return ${e.match(l.tvContent).toString()}`)())},p=t=>t.flatMap(n=>n).toString().replaceAll(","," ").split(" "),h=t=>{let n={};for(let[e,r]of Object.entries(t))n[e]={},n[e].original=r,!s(r)&&(n.temp=u(r)?p(r):r.split(" "),v.forEach(i=>{let o="";n.temp.forEach(c=>{o+=`${i}:${c} `;}),n[e][i]=o.trimEnd();}),delete n.temp);return n},b=t=>typeof t=="string"?t.split(" "):u(t)?p(t):t instanceof Object?h(t):t,j=t=>{let{variants:n={}}=t;if(s(n))return;let e={};for(let[r,i]of Object.entries(n))if(e[r]={},!s(i))for(let[o,c]of Object.entries(i)){if(e[r][o]={},e[r][o].original=c,s(c))continue;let f=b(c);if(!s(f)){if(!u(f)){e[r][o]=f;continue}v.forEach(m=>{let g="";f.forEach(C=>{g+=`${m}:${C} `;}),e[r][o][m]=g.trimEnd();});}}return e},a=t=>{try{if(!t.includes("tailwind-variants"))return t;let n=d(t);if(s(n))return t;let e=JSON.stringify(n.map(r=>j(r)),void 0,2);return t.concat(`
1
+ var b=["xs","sm","md","lg","xl","2xl"],a={tv:/tv\({[\s\S]*?}\)/g,tvContent:/\({[\s\S]*?}\)/g,comment:/\/\*[\s\S]*?\*\/|([^\\:]|^)\/\/.*$/gm,blankLine:/^\s*$(?:\r\n?|\n)/gm,ext:/\.\w+/g},u=n=>Array.isArray(n),g=n=>typeof n=="string",m=n=>typeof n=="object",y=n=>typeof n=="function",f=n=>!!(!n||u(n)&&n.length===0||g(n)&&n.length===0||m(n)&&Object.keys(n).length===0),E=(...n)=>t=>n.reduce((e,r)=>r(e),t),O=n=>n.replace(a.comment,"$1").toString().replace(a.blankLine,"").toString().match(a.tv),S=n=>{let t=O(n);if(!f(t))return t.map(e=>new Function(`return ${e.match(a.tvContent).toString()}`)())},h=n=>n.flatMap(t=>t).toString().replaceAll(","," ").split(" "),C=n=>{let t={};for(let[e,r]of Object.entries(n))t[e]={},t[e].original=r,!f(r)&&(t.temp=u(r)?h(r):r.split(" "),b.forEach(o=>{let s="";t.temp.forEach(i=>{s+=`${o}:${i} `;}),t[e][o]=s.trimEnd();}),delete t.temp);return t},$=n=>g(n)?n.split(" "):u(n)?h(n):m(n)?C(n):n,d=n=>{let{variants:t={}}=n;if(f(t))return;let e={};for(let[r,o]of Object.entries(t))if(e[r]={},!f(o))for(let[s,i]of Object.entries(o)){if(e[r][s]={},e[r][s].original=i,f(i))continue;let c=$(i);if(!f(c)){if(!u(c)){e[r][s]=c;continue}b.forEach(v=>{let x="";c.forEach(j=>{x+=`${v}:${j} `;}),e[r][s][v]=x.trimEnd();});}}return e},l=n=>{try{if(!n.includes("tailwind-variants"))return n;let t=S(n);if(f(t))return n;let e=JSON.stringify(t.map(r=>d(r)),void 0,2);return n.concat(`
2
2
  /*
3
3
 
4
4
  ${e}
5
5
 
6
6
  */
7
- `)}catch{return t}},S={tsx:t=>a(t),ts:t=>a(t),jsx:t=>a(t),js:t=>a(t)};
7
+ `)}catch{return n}},p=n=>{let t=n.map(e=>{if(m(e)&&e.extension)return e.extension;let r=e.match(a.ext);return r||(r=e.split("{"),r=r.pop().replace("}","").split(",")),r.map(o=>o.replace(".","").split(".")).flat()}).flatMap(e=>e);return Array.from(new Set(t)).filter(e=>e!=="html")},T=n=>{var e,r;let t=Object.assign({},n);if(f(t==null?void 0:t.content)||g(t.content))return t;if(u(t.content)){let s=p(t.content).map(i=>[i,l]);return t.content={},t.content.files=n.content,t.content.transform=Object.fromEntries(s),t}if(m(t.content)){if(f((e=t.content)==null?void 0:e.files)||g(t.content.files))return t;if(f((r=t.content)==null?void 0:r.transform)){let s=p(t.content.files).map(i=>[i,l]);return t.content.transform=Object.fromEntries(s),t}if(y(t.content.transform)){let{transform:o}=n.content,i=p(t.content.files).map(c=>[c,E(l,o)]);return t.content.transform=Object.fromEntries(i),t}if(m(t.content.transform)){let{transform:o}=n.content,i=p(t.content.files).map(c=>[c,E(l,o[c]&&o[c])]);return t.content.transform=Object.fromEntries(i),t}return t}return t};
8
8
 
9
- export { S as transformer };
9
+ export { l as tvTransformer, T as withTV };
package/dist/utils.cjs CHANGED
@@ -2,11 +2,13 @@
2
2
 
3
3
  var tailwindMerge = require('tailwind-merge');
4
4
 
5
- var n=(...e)=>e.flat(1/0).filter(Boolean).join(" "),p=e=>typeof e=="boolean"?`${e}`:e===0?"0":e,s=e=>e&&Object.keys(e).length>0,g=(...e)=>(t={})=>t.twMerge?(s(t.twMergeConfig)?tailwindMerge.extendTailwindMerge(t.twMergeConfig):tailwindMerge.twMerge)(n(e)):n(e),x=(e,t)=>{let o={};return typeof e!="object"||typeof t!="object"||Object.keys(e).forEach(r=>{t[r]?o[r]=n([e[r],t[r]]):o[r]=e[r];}),o},a=e=>!e||typeof e!="string"?e:e.replace(/\s+/g," ").trim();
5
+ var o=(...e)=>e.flat(1/0).filter(Boolean).join(" "),l=e=>typeof e=="boolean"?`${e}`:e===0?"0":e,c=e=>!e||typeof e!="object"||Object.keys(e).length===0,a=(...e)=>[...e].flat().filter(Boolean),g=(...e)=>(r={})=>r.twMerge?(c(r.twMergeConfig)?tailwindMerge.twMerge:tailwindMerge.extendTailwindMerge(r.twMergeConfig))(o(e)):o(e),x=(e,r)=>{let n={};return typeof e!="object"||typeof r!="object"||Object.keys(e).forEach(t=>{r[t]?n[t]=o([e[t],r[t]]):n[t]=e[t];}),n},i=(e,r)=>{let n={};for(let t in e)r!=null&&r.hasOwnProperty(t)?n[t]=typeof e[t]=="object"?i(e[t],r[t]):r[t]+" "+e[t]:n[t]=e[t];for(let t in r)n.hasOwnProperty(t)||(n[t]=r[t]);return n},y=e=>!e||typeof e!="string"?e:e.replace(/\s+/g," ").trim();
6
6
 
7
7
  exports.cx = g;
8
- exports.cxBase = n;
9
- exports.falsyToString = p;
10
- exports.isNotEmptyObject = s;
8
+ exports.cxBase = o;
9
+ exports.falsyToString = l;
10
+ exports.flatMergeArrays = a;
11
+ exports.isEmptyObject = c;
11
12
  exports.joinObjects = x;
12
- exports.removeExtraSpaces = a;
13
+ exports.mergeObjects = i;
14
+ exports.removeExtraSpaces = y;
package/dist/utils.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import {TVConfig} from "./config";
2
2
 
3
- export declare type ClassValue = string | string[] | null | undefined;
3
+ export declare type ClassValue = string | string[] | null | undefined | ClassValue[];
4
4
 
5
5
  export declare type ClassProp<V extends unknown = ClassValue> =
6
6
  | {
@@ -22,8 +22,12 @@ export declare const cx: <T extends CxOptions>(...classes: T) => (config: TVConf
22
22
 
23
23
  export declare const falsyToString: <T extends unknown>(value: T) => string | T;
24
24
 
25
- export declare const isNotEmptyObject: (obj: object) => boolean;
25
+ export declare const isEmptyObject: (obj: object) => boolean;
26
26
 
27
27
  export declare const joinObjects: (obj1: object, obj2: object) => object;
28
28
 
29
+ export declare const mergeObjects: (obj1: object, obj2: object) => object;
30
+
29
31
  export declare const removeExtraSpaces: (str: string) => string;
32
+
33
+ export declare const flatMergeArrays: <T>(...arrays: T[]) => T;
package/dist/utils.js CHANGED
@@ -1 +1 @@
1
- export { d as cx, a as cxBase, b as falsyToString, c as isNotEmptyObject, e as joinObjects, f as removeExtraSpaces } from './chunk-K6NVJFM7.js';
1
+ export { e as cx, a as cxBase, b as falsyToString, d as flatMergeArrays, c as isEmptyObject, f as joinObjects, g as mergeObjects, h as removeExtraSpaces } from './chunk-C5RUXROF.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tailwind-variants",
3
- "version": "0.0.25",
3
+ "version": "0.0.27",
4
4
  "description": "🦄 Tailwindcss first-class variant API",
5
5
  "author": "Junior Garcia <jrgarciadev@gmail.com>",
6
6
  "license": "MIT",
@@ -62,12 +62,16 @@
62
62
  "prettier": "^2.2.1",
63
63
  "prettier-eslint": "^12.0.0",
64
64
  "prettier-eslint-cli": "^5.0.1",
65
+ "tailwindcss": "^3.2.4",
65
66
  "ts-node": "^10.9.1",
66
67
  "tslib": "^2.4.1",
67
68
  "tsup": "6.4.0",
68
69
  "typescript": "4.6.2",
69
70
  "webpack": "^5.53.0"
70
71
  },
72
+ "peerDependencies": {
73
+ "tailwindcss": "*"
74
+ },
71
75
  "keywords": [
72
76
  "tailwindcss",
73
77
  "classes",
@@ -1,5 +0,0 @@
1
- import { extendTailwindMerge, twMerge } from 'tailwind-merge';
2
-
3
- var n=(...e)=>e.flat(1/0).filter(Boolean).join(" "),p=e=>typeof e=="boolean"?`${e}`:e===0?"0":e,s=e=>e&&Object.keys(e).length>0,g=(...e)=>(t={})=>t.twMerge?(s(t.twMergeConfig)?extendTailwindMerge(t.twMergeConfig):twMerge)(n(e)):n(e),x=(e,t)=>{let o={};return typeof e!="object"||typeof t!="object"||Object.keys(e).forEach(r=>{t[r]?o[r]=n([e[r],t[r]]):o[r]=e[r];}),o},a=e=>!e||typeof e!="string"?e:e.replace(/\s+/g," ").trim();
4
-
5
- export { n as a, p as b, s as c, g as d, x as e, a as f };