@lindaui/tokens 0.3.0 → 0.4.0

package/llms.txt

@@ -7,6 +7,9 @@
 
 ## Install
 
+The migration stylesheet entries and utility layer require tokens >=0.4.0.
+UI/blocks 0.5.0 declare this floor; tokens 0.3.1 does not provide these entries.
+
 ```bash
 pnpm add @lindaui/tokens
 ```
@@ -83,5 +86,14 @@ Toggle with `document.documentElement.dataset.theme = "ocean"` + the `.dark` cla
   apps that run their own Tailwind pass and need the custom utilities to resolve there too;
   normal consumers never import this.
 - `@lindaui/tokens/theme-template.css` → commented theme template to copy (not imported).
+- `@lindaui/tokens/heroui.css` → HeroUI defaults only; import after Tailwind.
+- `@lindaui/tokens/lead-converter.css` → Tailwind source entry: HeroUI defaults +
+  original violet light/dark accents, field border/background, notice CTAs and
+  scrollbars. Does NOT inherit teal tokens or the 18px root font size. Import
+  after `tailwindcss`, instead of `@heroui/styles`, and scan app + ui/blocks
+  `dist`/`src` via relative `@source` paths to their installed node_modules paths.
+- `@lindaui/tokens/lead-converter/compiled.css` → standalone prebuilt variant
+  including library utilities for apps without Tailwind. Never combine it with
+  source `/lead-converter.css`, `/css`, or another compiled Tailwind bundle.
 - No JS entry point. `@lindaui/ui` and `@lindaui/blocks` declare this as a peer.
 - If a layout looks unstyled ("just text"), the consumer usually forgot the `/css` import.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lindaui/tokens",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "Brand design tokens (OKLCH light/dark) + HeroUI v3 + Tailwind v4 compiled into a single CSS bundle.",
   "author": "Franco Carballar <francocarballar@gmail.com>",
   "license": "MIT",
@@ -27,12 +27,16 @@
   "exports": {
     "./css": "./dist/index.css",
     "./theme.css": "./src/theme.css",
+    "./heroui.css": "./src/heroui.css",
+    "./lead-converter.css": "./src/lead-converter.css",
+    "./lead-converter/compiled.css": "./dist/lead-converter.css",
     "./theme-template.css": "./theme-template.css",
     "./package.json": "./package.json"
   },
   "files": [
     "dist",
-    "src/theme.css",
+    "!dist/.build-css-*",
+    "src",
     "LICENSE",
     "README.md",
     "llms.txt",
@@ -41,10 +45,13 @@
   "sideEffects": [
     "*.css"
   ],
+  "dependencies": {
+    "@heroui/styles": "3.2.6"
+  },
   "devDependencies": {
-    "tailwindcss": "^4.0.0",
-    "@tailwindcss/cli": "^4.0.0",
-    "@heroui/react": "^3.2.1"
+    "@heroui/react": "^3.2.6",
+    "@tailwindcss/cli": "^4.3.3",
+    "tailwindcss": "^4.3.3"
   },
   "scripts": {
     "build": "node scripts/build-css.mjs",

package/src/heroui.css

@@ -0,0 +1,2 @@
+/* HeroUI defaults only. Import Tailwind in the consuming application first. */
+@import "@heroui/styles";

package/src/lead-converter.css

@@ -0,0 +1,58 @@
+@import "./heroui.css";
+@custom-variant dark (&:is(.dark *));
+
+/* LeadConverter preserves HeroUI defaults except for these existing overrides.
+   Deliberately does not import the default Lindaui teal theme. */
+:root,
+.light,
+[data-theme="light"] {
+  --accent: oklch(0.541 0.281 293.009);
+  --accent-foreground: oklch(1 0 0);
+}
+
+.dark,
+[data-theme="dark"] {
+  --accent: oklch(0.606 0.25 292.717);
+  --accent-foreground: oklch(1 0 0);
+}
+
+:root,
+.light,
+.dark,
+[data-theme="light"],
+[data-theme="dark"] {
+  --field-border-width: 1px;
+  --field-border: color-mix(
+    in oklab,
+    var(--muted) 34%,
+    var(--surface-secondary)
+  );
+  --field-background: var(--surface-secondary);
+}
+
+.notice-action.button--primary {
+  --button-bg: color-mix(in oklab, var(--accent) 92%, black);
+  --button-bg-hover: color-mix(in oklab, var(--accent) 85%, black);
+  --button-bg-pressed: var(--button-bg-hover);
+}
+
+.notice-action.button--danger {
+  --button-bg: color-mix(in oklab, var(--danger) 80%, black);
+  --button-bg-hover: color-mix(in oklab, var(--danger) 72%, black);
+  --button-bg-pressed: var(--button-bg-hover);
+}
+
+@layer utilities {
+  ::-webkit-scrollbar {
+    width: 6px;
+    height: 8px;
+  }
+
+  ::-webkit-scrollbar-track {
+    background: transparent;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    @apply bg-muted/70 rounded-full hover:bg-muted transition-colors;
+  }
+}