@plexui/ui 0.15.2 → 0.15.3

package/dist/es/styles/index.css

@@ -1,10 +1,16 @@
 /* Tailwind & Reset */
 @import "./base";
-/* Tailwind v4 @theme — radii, fonts, font-weights, breakpoints. MUST come
-   before any tier that references --radius-* / --font-*. Semantic and
-   components both do. Without this, consumers of `@plexui/ui/css` lose
-   pill buttons, control radii, and the system font stack. */
-@import "./variables-tailwind-theme";
+/* Tier 0 — radius / font / font-weight tokens, declared in :root so
+   semantic and components tiers can reference `var(--radius-*)`,
+   `var(--font-sans)`, `var(--font-weight-*)`. We deliberately do NOT
+   use `@theme static {…}` here: that would write into Tailwind's theme
+   layer, reset Tailwind's own `--radius-*` defaults via `--radius-*:
+   initial`, and break consumer-side Tailwind utilities like
+   `rounded-md`, `rounded-full`, `text-sm`. The standalone
+   `@plexui/ui/styles/variables-tailwind-theme.css` sub-export remains
+   for consumers who explicitly want Plex's scale to power their
+   Tailwind utilities. */
+@import "./variables-tokens-root";
 /* Tier 1 tokens: Primitives */
 @import "./variables-primitive";
 /* Tier 2 tokens: Semantic */

package/dist/es/styles/variables-tokens-root.css

@@ -0,0 +1,41 @@
+/*
+ * Plex UI tokens that semantic + components tiers reference via var(...).
+ *
+ * These live in `:root` (NOT in `@theme static`) so they don't interfere
+ * with the consumer's Tailwind theme. With this layout:
+ *   - Plex UI components see `--radius-md`, `--font-sans`, `--font-weight-medium`
+ *     and render correctly.
+ *   - Consumer's Tailwind utilities (`rounded-md`, `rounded-full`, `text-sm`)
+ *     keep using Tailwind's own `@theme` defaults — Plex UI doesn't reset
+ *     them with `--radius-*: initial`.
+ *
+ * If a consumer wants the Plex scale to also drive their Tailwind utilities,
+ * they import the standalone `@plexui/ui/styles/variables-tailwind-theme.css`
+ * file in addition to `@plexui/ui/css` (see /docs/installation).
+ */
+:root {
+  /* Radii */
+  --radius-2xs: 0.125rem; /* 2px */
+  --radius-xs: 0.25rem; /* 4px */
+  --radius-sm: 0.375rem; /* 6px */
+  --radius-md: 0.5rem; /* 8px */
+  --radius-lg: 0.625rem; /* 10px */
+  --radius-xl: 0.75rem; /* 12px */
+  --radius-2xl: 1rem; /* 16px */
+  --radius-3xl: 1.25rem; /* 20px */
+  --radius-4xl: 1.5rem; /* 24px */
+  --radius-full: 9999px;
+
+  /* Font stacks */
+  --font-sans: ui-sans-serif, -apple-system, system-ui, "Segoe UI", "Noto Sans", "Helvetica",
+    "Arial", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
+  --font-serif: ui-serif, Georgia, "Times New Roman", serif;
+  --font-mono: ui-monospace, "SFMono-Regular", "SF Mono", "Menlo", "Monaco", "Consolas",
+    "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
+
+  /* Font weights */
+  --font-weight-normal: 400;
+  --font-weight-medium: 500;
+  --font-weight-semibold: 600;
+  --font-weight-bold: 700;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plexui/ui",
-  "version": "0.15.2",
+  "version": "0.15.3",
   "description": "Modern design system for building high-quality applications",
   "type": "module",
   "license": "MIT",
@@ -36,6 +36,7 @@
     "./styles/variables-primitive.css": "./dist/es/styles/variables-primitive.css",
     "./styles/variables-semantic.css": "./dist/es/styles/variables-semantic.css",
     "./styles/variables-tailwind-theme.css": "./dist/es/styles/variables-tailwind-theme.css",
+    "./styles/variables-tokens-root.css": "./dist/es/styles/variables-tokens-root.css",
     "./styles/variables-components.css": "./dist/es/styles/variables-components.css",
     "./components/*": {
       "types": "./dist/types/components/*/index.d.ts",