@gentleduck/variants
Advanced tools
+2
-2
@@ -35,3 +35,3 @@ //#region src/variants.types.d.ts | ||
| * Array of objects that specify additional `class` or `className` entries when | ||
| * multiple variant keys match simultaneously. Each object’s own keys correspond | ||
| * multiple variant keys match simultaneously. Each object's own keys correspond | ||
| * to variant names (or arrays of variant names) indicating the match conditions. | ||
@@ -103,3 +103,3 @@ * | ||
| /** | ||
| * Extracts only the variant-related props from a CVA function’s signature, | ||
| * Extracts only the variant-related props from a CVA function's signature, | ||
| * omitting `class` and `className`. | ||
@@ -106,0 +106,0 @@ * |
+1
-1
@@ -1,1 +0,1 @@ | ||
| function e(e){let t=Object.entries(e),n=``;for(let e=0;e<t.length;e++){let[r,i]=t[e];Array.isArray(i)?n+=`${r}:[${i.map(String).join(`,`)}]`:n+=`${r}:${String(i)}`,e<t.length-1&&(n+=`|`)}return n}function t(e,n){if(e!=null){if(typeof e==`string`||typeof e==`number`||typeof e==`boolean`){let t=String(e).split(/\s+/);for(let e=0;e<t.length;e++){let r=t[e];r&&n.push(r)}return}if(Array.isArray(e)){for(let r=0;r<e.length;r++)t(e[r],n);return}for(let t in e)Object.hasOwn(e,t)&&e[t]&&n.push(t)}}function n(n,r){let i=typeof n==`string`?{base:n,...r}:n,{base:a=``,variants:o,defaultVariants:s={},compoundVariants:c=[]}=i,l=new Map;return(n={})=>{let r=e(n),i=l.get(r);if(i)return i;let u=[],d=new Set;t(a,u);let f={...s,...n};for(let e in o){let n=f[e];if(n==null||n===`unset`)continue;let r=o[e][String(n)];t(r,u)}for(let e=0;e<c.length;e++){let n=c[e],r=!0;for(let e in n){if(e===`class`||e===`className`)continue;let t=n[e],i=f[e];if(Array.isArray(t)&&i){if(!t.includes(i.toString())){r=!1;break}}else if(i!==t){r=!1;break}}r&&(t(n.class,u),t(n.className,u))}t(n.className,u),t(n.class,u);for(let e=0;e<u.length;e++)d.add(u[e]);let p=Array.from(d).join(` `);return l.set(r,p),p}}export{n as cva}; | ||
| function e(e){let t=Object.entries(e),n=``;for(let e=0;e<t.length;e++){let[r,i]=t[e];Array.isArray(i)?n+=`${r}:[${i.map(String).join(`,`)}]`:n+=`${r}:${String(i)}`,e<t.length-1&&(n+=`|`)}return n}function t(e,n){if(e!=null){if(typeof e==`string`||typeof e==`number`||typeof e==`boolean`){let t=String(e).split(/\s+/);for(let e=0;e<t.length;e++){let r=t[e];r&&n.push(r)}return}if(Array.isArray(e)){for(let r=0;r<e.length;r++)t(e[r],n);return}for(let t in e)Object.hasOwn(e,t)&&e[t]&&n.push(t)}}function n(n,r){let{base:i=``,variants:a,defaultVariants:o={},compoundVariants:s=[]}=typeof n==`string`?{base:n,...r}:n,c=new Map;return(n={})=>{let r=e(n),l=c.get(r);if(l)return l;let u=[],d=new Set;t(i,u);let f={...o,...n};for(let e in a){let n=f[e];if(n==null||n===`unset`)continue;let r=a[e][String(n)];t(r,u)}for(let e=0;e<s.length;e++){let n=s[e],r=!0;for(let e in n){if(e===`class`||e===`className`)continue;let t=n[e],i=f[e];if(Array.isArray(t)&&i){if(!t.includes(i.toString())){r=!1;break}}else if(i!==t){r=!1;break}}r&&(t(n.class,u),t(n.className,u))}t(n.className,u),t(n.class,u);for(let e=0;e<u.length;e++)d.add(u[e]);let p=Array.from(d).join(` `);return c.set(r,p),p}}export{n as cva}; |
+23
-23
| { | ||
| "author": "wilddcuk", | ||
| "$schema": "https://json.schemastore.org/package.json", | ||
| "engines": { | ||
| "node": ">=22.0.0" | ||
| }, | ||
| "author": "gentleduck contributors", | ||
| "bugs": { | ||
@@ -8,14 +12,10 @@ "url": "https://github.com/gentleeduck/duck-ui/issues" | ||
| "devDependencies": { | ||
| "@changesets/cli": "^2.29.7", | ||
| "@gentleduck/tsdown-config": "workspace:*", | ||
| "@gentleduck/typescript-config": "workspace:*", | ||
| "clsx": "^2.1.1", | ||
| "cva": "1.0.0-beta.3", | ||
| "husky": "^9.1.7", | ||
| "tsdown": "^0.11", | ||
| "typescript": "^5.8.3", | ||
| "@gentleduck/typescript-config": "0.1.0", | ||
| "@gentleduck/tsdown-config": "0.0.1" | ||
| "tsdown": "0.18.3", | ||
| "typescript": "5.9.3", | ||
| "vitest": "^4.0.16" | ||
| }, | ||
| "engines": { | ||
| "node": ">=22.0.0" | ||
| }, | ||
| "exports": { | ||
@@ -52,20 +52,20 @@ ".": "./dist/index.js" | ||
| "name": "@gentleduck/variants", | ||
| "peerDependencies": {}, | ||
| "packageManager": "bun@1.3.5", | ||
| "private": false, | ||
| "publishConfig": { | ||
| "access": "public" | ||
| }, | ||
| "repository": { | ||
| "type": "git", | ||
| "url": "https://github.com/gentleeduck/duck-ui/tree/master/packages/duck-variants" | ||
| "url": "git+https://github.com/gentleeduck/duck-ui.git", | ||
| "directory": "packages/duck-variants" | ||
| }, | ||
| "scripts": { | ||
| "build": "tsdown", | ||
| "test": "vitest", | ||
| "check-types": "tsc -p tsconfig.json --noEmit --pretty false --skipLibCheck" | ||
| }, | ||
| "type": "module", | ||
| "types": "./dist/index.d.ts", | ||
| "version": "0.1.16", | ||
| "scripts": { | ||
| "build": "tsdown", | ||
| "ci": "pnpm run lint && pnpm run format && pnpm run build", | ||
| "clean": "git clean -xdf .cache .turbo node_modules dist", | ||
| "format": "biome format --write ./", | ||
| "lint": "biome lint --write ./", | ||
| "release": "changeset version", | ||
| "test": "vitest" | ||
| } | ||
| } | ||
| "version": "0.1.17" | ||
| } |
+23
-23
| <p align="center"> | ||
| <img src="https://raw.githubusercontent.com/gentleeduck/ui/98ac7d1f4ec2fdead848d865445312f05bbbf24a/public/variants.png" alt="@gentleduck/variants" width="900"/> | ||
| <img src="https://raw.githubusercontent.com/gentleeduck/duck-ui/98ac7d1f4ec2fdead848d865445312f05bbbf24a/public/variants.png" alt="@gentleduck/variants" width="900"/> | ||
| </p> | ||
@@ -12,6 +12,6 @@ | ||
| At **GentleDuck**, we believe that developer tools should be **fast**, **reliable**, and **actively maintained** — not abandoned. While `class-variance-authority` initially inspired the idea of variant-based class management, its situation has become unacceptable: | ||
| At **gentleduck**, we believe that developer tools should be **fast**, **reliable**, and **actively maintained** — not abandoned. While `class-variance-authority` initially inspired the idea of variant-based class management, its situation has become unacceptable: | ||
| despite having **over 6 million weekly downloads**, the project has been left **poorly maintained for more than 6 months**, with important pull requests and bug fixes sitting untouched. | ||
| Leaving a critical utility like this in a broken or half-maintained state is **unacceptable** to us at **GentleDuck**. | ||
| Leaving a critical utility like this in a broken or half-maintained state is **unacceptable** to us at **gentleduck**. | ||
| So, we took action: we rewrote the library from scratch with our own vision and philosophy — making it **more modern**, **more reliable**, and **up to 7× faster**. | ||
@@ -26,7 +26,7 @@ | ||
| - 🧠 **Declarative variant-based styling** | ||
| - 🎯 **Type-safe API with intelligent autocompletion** | ||
| - 🧱 **Composable and extendable utility** | ||
| - 🎨 **Supports default variants and compound variants** | ||
| - 🪶 **Lightweight, zero dependencies, blazing fast** | ||
| - **Declarative variant-based styling** | ||
| - **Type-safe API with intelligent autocompletion** | ||
| - **Composable and extendable utility** | ||
| - **Supports default variants and compound variants** | ||
| - **Lightweight, zero dependencies, blazing fast** | ||
@@ -37,8 +37,8 @@ --- | ||
| - ✅ **Zero dependencies**, tiny bundle footprint. | ||
| - 🔐 **Fully type-safe**, IDE-friendly autocompletion. | ||
| - 🎨 **Flexible styling** via variants, nested arrays & conditionals. | ||
| - 🚀 **Minimal runtime & memoized** with zero runtime dependencies (just a few dozen lines of code). | ||
| - ⚡ **Blazing fast**: ~7× faster than the reference `(class-variance-authority)[https://www.npmjs.com/package/class-variance-authority]`. | ||
| - 🧠 **Powerful system** for defaults, compounds, and custom classes. | ||
| - **Zero dependencies**, tiny bundle footprint. | ||
| - **Fully type-safe**, IDE-friendly autocompletion. | ||
| - **Flexible styling** via variants, nested arrays & conditionals. | ||
| - **Minimal runtime & memoized** with zero runtime dependencies (just a few dozen lines of code). | ||
| - **Blazing fast**: ~7x faster than the reference [class-variance-authority](https://www.npmjs.com/package/class-variance-authority). | ||
| - **Powerful system** for defaults, compounds, and custom classes. | ||
@@ -50,8 +50,8 @@ --- | ||
| ### **Vitest Benchmark** | ||
| **@gentleduck/variants**: ~7x faster than `(class-variance-authority)[https://www.npmjs.com/package/class-variance-authority]` | ||
| <img src="https://github.com/gentleeduck/ui/blob/master/public/vite_benchmark.png" alt="Benchmark" /> | ||
| <img src="https://raw.githubusercontent.com/gentleeduck/ui/3ae21ea9d8311c330fa85cde3e562fd213d83239/public/vite-bench-cases.png" alt="Benchmark" /> | ||
| **@gentleduck/variants**: ~7x faster than `[class-variance-authority](https://www.npmjs.com/package/class-variance-authority)` | ||
| <img src="https://raw.githubusercontent.com/gentleeduck/duck-ui/master/public/vite_benchmark.png" alt="Benchmark" /> | ||
| <img src="https://raw.githubusercontent.com/gentleeduck/duck-ui/3ae21ea9d8311c330fa85cde3e562fd213d83239/public/vite-bench-cases.png" alt="Benchmark" /> | ||
| ### **Duck Benchmark** | ||
| <img src="https://github.com/gentleeduck/ui/blob/master/public/duck_benchmark.png" alt="Benchmark" /> | ||
| <img src="https://raw.githubusercontent.com/gentleeduck/duck-ui/master/public/duck_benchmark.png" alt="Benchmark" /> | ||
@@ -69,3 +69,3 @@ | ||
| # or | ||
| pnpm add @gentleduck/variants | ||
| bun add @gentleduck/variants | ||
| ``` | ||
@@ -186,6 +186,6 @@ | ||
| // ✅ | ||
| // OK | ||
| alert({ severity: 'error' }) | ||
| // ❌ TS Error: 'warning' is not a valid severity | ||
| // TS Error: 'warning' is not a valid severity | ||
| alert({ severity: 'warning' }) | ||
@@ -241,3 +241,3 @@ ``` | ||
| - **`base: string`** — always-included classes | ||
| - **`variants`** — map of variant names → (value → class/string[]) | ||
| - **`variants`** — map of variant names -> (value -> class/string[]) | ||
| - **`defaultVariants?`** — fallback values | ||
@@ -260,2 +260,2 @@ - **`compoundVariants?`** — apply extra classes when multiple values match | ||
| MIT © [GentleDuck](./LICENSE) | ||
| MIT © [gentleduck](./LICENSE) |
+2
-2
@@ -16,4 +16,4 @@ { | ||
| }, | ||
| "exclude": ["node_modules", "dist"], | ||
| "include": ["."] | ||
| "exclude": ["node_modules", "dist", "**/*.tsbuildinfo", "tsconfig.tsbuildinfo"], | ||
| "include": ["./src/**/*.ts", "./src/**/*.tsx"] | ||
| } |
7
-12.5%18146
-0.02%