tailwind-clamp 4.2.0 → 4.2.2

package/README.md

@@ -117,6 +117,41 @@ All spacing and sizing properties (`p`, `m`, `w`, etc.) accept unitless numbers
 - `decoration`
 - `underline-offset`
 
+## Usage with tailwind-merge
+
+If you use [tailwind-merge](https://github.com/dcastil/tailwind-merge) to resolve conflicting Tailwind classes, install the `tailwind-clamp-merge` plugin so that clamp utilities are correctly merged with their static counterparts:
+
+```sh
+npm i tailwind-clamp-merge
+```
+
+```js
+
+const twMerge = extendTailwindMerge(withTailwindClamp);
+```
+
+This teaches tailwind-merge that `clamp-[p,1,3]` belongs to the same class group as `p-4`, so conflicts are resolved correctly:
+
+```js
+twMerge('p-4 clamp-[p,1,3]')
+// => 'clamp-[p,1,3]'
+
+twMerge('clamp-[p,1,3] p-4')
+// => 'p-4'
+
+twMerge('text-lg clamp-[text,lg,3xl]')
+// => 'clamp-[text,lg,3xl]'
+
+// Hierarchical conflicts work too
+twMerge('px-4 py-2 clamp-[p,1,3]')
+// => 'clamp-[p,1,3]'
+
+twMerge('w-4 h-8 clamp-[size,10,20]')
+// => 'clamp-[size,10,20]'
+```
+
+All supported properties and their conflict hierarchies (e.g. `p` vs `px`/`py`, `size` vs `w`/`h`, `rounded` vs `rounded-tl`, `border` vs `border-t`) are handled automatically.
+
 ## Credits & mentions
 
 The plugin is based on the formula presented in this [article](https://chriskirknielsen.com/blog/modern-fluid-typography-with-clamp/).

package/dist/index.d.ts

@@ -0,0 +1,15 @@
+import type { PluginCreator } from 'tailwindcss/types/config';
+
+interface TailwindClampOptions {
+  /** Minimum viewport width for clamp calculation. Default: '23.4375rem' (375px) */
+  minSize?: string;
+  /** Maximum viewport width for clamp calculation. Default: '90rem' (1440px) */
+  maxSize?: string;
+}
+
+declare const plugin: {
+  (options?: TailwindClampOptions): { handler: PluginCreator };
+  __isOptionsFunction: true;
+};
+
+export default plugin;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwind-clamp",
-  "version": "4.2.0",
+  "version": "4.2.2",
   "description": "Plugin to leverage the CSS clamp function in your Tailwind CSS project.",
   "main": "dist/index.umd.cjs",
   "module": "dist/index.js",
@@ -18,10 +18,10 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "vite build",
+    "build": "vite build && cp lib/index.d.ts dist/index.d.ts",
     "test": "vitest run",
     "preview": "vite preview",
-    "prepublishOnly": "vite build"
+    "prepublishOnly": "pnpm run build"
   },
   "repository": {
     "type": "git",