@hex-core/components 1.2.0 → 1.2.1

package/README.md

@@ -20,6 +20,15 @@ If you want to import the built components directly:
 pnpm add @hex-core/components
 ```
 
+**Tailwind v4 consumers must register this package's bundle so utility classes resolve.** One line in your app's `globals.css`:
+
+```css
+@import "tailwindcss";
+@import "@hex-core/components/tailwind.css";
+```
+
+Without it, classes like `inset-ring-foreground/[0.06]` (used by Button outline, Input, Card, etc.) appear in the rendered HTML but have no CSS rule, and components render unstyled. Tailwind v4 doesn't auto-scan `node_modules`.
+
 ```tsx
 import { Button } from "@hex-core/components";
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hex-core/components",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "description": "AI-native React components for Hex UI — Radix UI + Tailwind CSS with machine-readable schemas.",
   "keywords": [
     "react",
@@ -30,10 +30,12 @@
     ".": {
       "import": "./dist/index.js",
       "types": "./dist/index.d.ts"
-    }
+    },
+    "./tailwind.css": "./tailwind.css"
   },
   "files": [
     "dist",
+    "tailwind.css",
     "README.md",
     "LICENSE"
   ],

package/tailwind.css

@@ -0,0 +1,18 @@
+/*
+ * Tailwind v4 content-scan registration for @hex-core/components.
+ *
+ * Tailwind v4 doesn't auto-scan node_modules — without an explicit @source,
+ * utility classes embedded in this package's published JS bundle (e.g.
+ * `inset-ring-foreground/[0.06]` used by Button, Input, Checkbox, etc.)
+ * appear in the rendered HTML but have no matching CSS rule, so components
+ * render unstyled.
+ *
+ * Consumer usage (one line in the app's globals.css):
+ *
+ *   @import "tailwindcss";
+ *   @import "@hex-core/components/tailwind.css";
+ *
+ * The path resolves through the package's installed location, so it works
+ * with pnpm, npm, yarn, and any monorepo layout.
+ */
+@source "./dist/*.js";