tailwind-styled-v4 5.0.0 → 5.0.1

package/dist/rspack.js

@@ -0,0 +1,55 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var path = require('path');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var path__default = /*#__PURE__*/_interopDefault(path);
+
+/* tailwind-styled-v4 v5.0.1 | MIT | https://github.com/dictionar32/tailwind-styled-v4 */
+
+var LOADER_PATH = path__default.default.resolve(__dirname, "loader.js");
+var TailwindStyledRspackPlugin = class {
+  constructor(opts = {}) {
+    this.opts = opts;
+  }
+  apply(compiler) {
+    const isDev = compiler.options.mode !== "production";
+    const loaderOpts = {
+      // v5: Always zero-runtime
+      mode: "zero-runtime",
+      addDataAttr: this.opts.addDataAttr ?? isDev,
+      // Preserve cv, cx, cn, etc — only tw.* is transformed
+      preserveImports: true
+    };
+    const include = this.opts.include ?? /\.[jt]sx?$/;
+    const exclude = this.opts.exclude ?? /node_modules/;
+    const existing = compiler.options.module?.rules ?? [];
+    const alreadyRegistered = existing.some((r) => r._tailwindStyledRspackMarker === true);
+    if (alreadyRegistered) return;
+    const rule = {
+      _tailwindStyledRspackMarker: true,
+      test: include,
+      exclude,
+      use: [
+        {
+          loader: LOADER_PATH,
+          options: loaderOpts
+        }
+      ]
+    };
+    compiler.options.module.rules = [rule, ...existing];
+  }
+};
+function tailwindStyledRspackPlugin(opts = {}) {
+  return new TailwindStyledRspackPlugin(opts);
+}
+var src_default = tailwindStyledRspackPlugin;
+
+exports.TailwindStyledRspackPlugin = TailwindStyledRspackPlugin;
+exports.default = src_default;
+exports.tailwindStyledRspackPlugin = tailwindStyledRspackPlugin;
+//# sourceMappingURL=rspack.js.map
+//# sourceMappingURL=rspack.js.map

package/dist/rspack.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../packages/rspack/src/index.ts"],"names":["path"],"mappings":";;;;;;;;;;;;AA6BA,IAAM,WAAA,GAAcA,qBAAA,CAAK,OAAA,CAAQ,SAAA,EAAW,WAAW,CAAA;AAEhD,IAAM,6BAAN,MAAiC;AAAA,EAGtC,WAAA,CAAY,IAAA,GAA4B,EAAC,EAAG;AAC1C,IAAA,IAAA,CAAK,IAAA,GAAO,IAAA;AAAA,EACd;AAAA,EAEA,MAAM,QAAA,EAAqB;AACzB,IAAA,MAAM,KAAA,GAAQ,QAAA,CAAS,OAAA,CAAQ,IAAA,KAAS,YAAA;AAExC,IAAA,MAAM,UAAA,GAAa;AAAA;AAAA,MAEjB,IAAA,EAAM,cAAA;AAAA,MACN,WAAA,EAAa,IAAA,CAAK,IAAA,CAAK,WAAA,IAAe,KAAA;AAAA;AAAA,MAEtC,eAAA,EAAiB;AAAA,KACnB;AAEA,IAAA,MAAM,OAAA,GAAU,IAAA,CAAK,IAAA,CAAK,OAAA,IAAW,YAAA;AACrC,IAAA,MAAM,OAAA,GAAU,IAAA,CAAK,IAAA,CAAK,OAAA,IAAW,cAAA;AAGrC,IAAA,MAAM,QAAA,GAAW,QAAA,CAAS,OAAA,CAAQ,MAAA,EAAQ,SAAS,EAAC;AACpD,IAAA,MAAM,oBAAoB,QAAA,CAAS,IAAA,CAAK,CAAC,CAAA,KAAW,CAAA,CAAE,gCAAgC,IAAI,CAAA;AAC1F,IAAA,IAAI,iBAAA,EAAmB;AAEvB,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,2BAAA,EAA6B,IAAA;AAAA,MAC7B,IAAA,EAAM,OAAA;AAAA,MACN,OAAA;AAAA,MACA,GAAA,EAAK;AAAA,QACH;AAAA,UACE,MAAA,EAAQ,WAAA;AAAA,UACR,OAAA,EAAS;AAAA;AACX;AACF,KACF;AAEA,IAAA,QAAA,CAAS,QAAQ,MAAA,CAAO,KAAA,GAAQ,CAAC,IAAA,EAAM,GAAG,QAAQ,CAAA;AAAA,EACpD;AACF;AAEO,SAAS,0BAAA,CACd,IAAA,GAA4B,EAAC,EACD;AAC5B,EAAA,OAAO,IAAI,2BAA2B,IAAI,CAAA;AAC5C;AAEA,IAAO,WAAA,GAAQ","file":"rspack.js","sourcesContent":["/**\n * tailwind-styled-v4 — Rspack Plugin v5 (stable)\n *\n * Usage:\n *   import { tailwindStyledRspackPlugin } from \"@tailwind-styled/rspack\"\n *\n *   export default defineConfig({\n *     plugins: [tailwindStyledRspackPlugin()],\n *   })\n *\n * v5:\n * - Simplified API\n * - Uses @tailwind-styled/engine for build\n * - Mode always zero-runtime\n */\n\nimport path from \"node:path\"\n\nexport interface RspackPluginOptions {\n  /** File patterns to include. Default: /\\.[jt]sx?$/ */\n  include?: RegExp\n  /** File patterns to exclude. Default: /node_modules/ */\n  exclude?: RegExp\n  /** Add data-tw debug attributes in dev. Default: true in dev */\n  addDataAttr?: boolean\n  /** Enable analyzer. Default: false */\n  analyze?: boolean\n}\n\nconst LOADER_PATH = path.resolve(__dirname, \"loader.js\")\n\nexport class TailwindStyledRspackPlugin {\n  private opts: RspackPluginOptions\n\n  constructor(opts: RspackPluginOptions = {}) {\n    this.opts = opts\n  }\n\n  apply(compiler: any): void {\n    const isDev = compiler.options.mode !== \"production\"\n\n    const loaderOpts = {\n      // v5: Always zero-runtime\n      mode: \"zero-runtime\" as const,\n      addDataAttr: this.opts.addDataAttr ?? isDev,\n      // Preserve cv, cx, cn, etc — only tw.* is transformed\n      preserveImports: true,\n    }\n\n    const include = this.opts.include ?? /\\.[jt]sx?$/\n    const exclude = this.opts.exclude ?? /node_modules/\n\n    // Check idempotency\n    const existing = compiler.options.module?.rules ?? []\n    const alreadyRegistered = existing.some((r: any) => r._tailwindStyledRspackMarker === true)\n    if (alreadyRegistered) return\n\n    const rule = {\n      _tailwindStyledRspackMarker: true,\n      test: include,\n      exclude: exclude,\n      use: [\n        {\n          loader: LOADER_PATH,\n          options: loaderOpts,\n        },\n      ],\n    }\n\n    compiler.options.module.rules = [rule, ...existing]\n  }\n}\n\nexport function tailwindStyledRspackPlugin(\n  opts: RspackPluginOptions = {}\n): TailwindStyledRspackPlugin {\n  return new TailwindStyledRspackPlugin(opts)\n}\n\nexport default tailwindStyledRspackPlugin\n"]}

package/dist/rspack.mjs

@@ -0,0 +1,45 @@
+import path from 'path';
+
+/* tailwind-styled-v4 v5.0.1 | MIT | https://github.com/dictionar32/tailwind-styled-v4 */
+
+var LOADER_PATH = path.resolve(__dirname, "loader.js");
+var TailwindStyledRspackPlugin = class {
+  constructor(opts = {}) {
+    this.opts = opts;
+  }
+  apply(compiler) {
+    const isDev = compiler.options.mode !== "production";
+    const loaderOpts = {
+      // v5: Always zero-runtime
+      mode: "zero-runtime",
+      addDataAttr: this.opts.addDataAttr ?? isDev,
+      // Preserve cv, cx, cn, etc — only tw.* is transformed
+      preserveImports: true
+    };
+    const include = this.opts.include ?? /\.[jt]sx?$/;
+    const exclude = this.opts.exclude ?? /node_modules/;
+    const existing = compiler.options.module?.rules ?? [];
+    const alreadyRegistered = existing.some((r) => r._tailwindStyledRspackMarker === true);
+    if (alreadyRegistered) return;
+    const rule = {
+      _tailwindStyledRspackMarker: true,
+      test: include,
+      exclude,
+      use: [
+        {
+          loader: LOADER_PATH,
+          options: loaderOpts
+        }
+      ]
+    };
+    compiler.options.module.rules = [rule, ...existing];
+  }
+};
+function tailwindStyledRspackPlugin(opts = {}) {
+  return new TailwindStyledRspackPlugin(opts);
+}
+var src_default = tailwindStyledRspackPlugin;
+
+export { TailwindStyledRspackPlugin, src_default as default, tailwindStyledRspackPlugin };
+//# sourceMappingURL=rspack.mjs.map
+//# sourceMappingURL=rspack.mjs.map

package/dist/rspack.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../packages/rspack/src/index.ts"],"names":[],"mappings":";;;;AA6BA,IAAM,WAAA,GAAc,IAAA,CAAK,OAAA,CAAQ,SAAA,EAAW,WAAW,CAAA;AAEhD,IAAM,6BAAN,MAAiC;AAAA,EAGtC,WAAA,CAAY,IAAA,GAA4B,EAAC,EAAG;AAC1C,IAAA,IAAA,CAAK,IAAA,GAAO,IAAA;AAAA,EACd;AAAA,EAEA,MAAM,QAAA,EAAqB;AACzB,IAAA,MAAM,KAAA,GAAQ,QAAA,CAAS,OAAA,CAAQ,IAAA,KAAS,YAAA;AAExC,IAAA,MAAM,UAAA,GAAa;AAAA;AAAA,MAEjB,IAAA,EAAM,cAAA;AAAA,MACN,WAAA,EAAa,IAAA,CAAK,IAAA,CAAK,WAAA,IAAe,KAAA;AAAA;AAAA,MAEtC,eAAA,EAAiB;AAAA,KACnB;AAEA,IAAA,MAAM,OAAA,GAAU,IAAA,CAAK,IAAA,CAAK,OAAA,IAAW,YAAA;AACrC,IAAA,MAAM,OAAA,GAAU,IAAA,CAAK,IAAA,CAAK,OAAA,IAAW,cAAA;AAGrC,IAAA,MAAM,QAAA,GAAW,QAAA,CAAS,OAAA,CAAQ,MAAA,EAAQ,SAAS,EAAC;AACpD,IAAA,MAAM,oBAAoB,QAAA,CAAS,IAAA,CAAK,CAAC,CAAA,KAAW,CAAA,CAAE,gCAAgC,IAAI,CAAA;AAC1F,IAAA,IAAI,iBAAA,EAAmB;AAEvB,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,2BAAA,EAA6B,IAAA;AAAA,MAC7B,IAAA,EAAM,OAAA;AAAA,MACN,OAAA;AAAA,MACA,GAAA,EAAK;AAAA,QACH;AAAA,UACE,MAAA,EAAQ,WAAA;AAAA,UACR,OAAA,EAAS;AAAA;AACX;AACF,KACF;AAEA,IAAA,QAAA,CAAS,QAAQ,MAAA,CAAO,KAAA,GAAQ,CAAC,IAAA,EAAM,GAAG,QAAQ,CAAA;AAAA,EACpD;AACF;AAEO,SAAS,0BAAA,CACd,IAAA,GAA4B,EAAC,EACD;AAC5B,EAAA,OAAO,IAAI,2BAA2B,IAAI,CAAA;AAC5C;AAEA,IAAO,WAAA,GAAQ","file":"rspack.mjs","sourcesContent":["/**\n * tailwind-styled-v4 — Rspack Plugin v5 (stable)\n *\n * Usage:\n *   import { tailwindStyledRspackPlugin } from \"@tailwind-styled/rspack\"\n *\n *   export default defineConfig({\n *     plugins: [tailwindStyledRspackPlugin()],\n *   })\n *\n * v5:\n * - Simplified API\n * - Uses @tailwind-styled/engine for build\n * - Mode always zero-runtime\n */\n\nimport path from \"node:path\"\n\nexport interface RspackPluginOptions {\n  /** File patterns to include. Default: /\\.[jt]sx?$/ */\n  include?: RegExp\n  /** File patterns to exclude. Default: /node_modules/ */\n  exclude?: RegExp\n  /** Add data-tw debug attributes in dev. Default: true in dev */\n  addDataAttr?: boolean\n  /** Enable analyzer. Default: false */\n  analyze?: boolean\n}\n\nconst LOADER_PATH = path.resolve(__dirname, \"loader.js\")\n\nexport class TailwindStyledRspackPlugin {\n  private opts: RspackPluginOptions\n\n  constructor(opts: RspackPluginOptions = {}) {\n    this.opts = opts\n  }\n\n  apply(compiler: any): void {\n    const isDev = compiler.options.mode !== \"production\"\n\n    const loaderOpts = {\n      // v5: Always zero-runtime\n      mode: \"zero-runtime\" as const,\n      addDataAttr: this.opts.addDataAttr ?? isDev,\n      // Preserve cv, cx, cn, etc — only tw.* is transformed\n      preserveImports: true,\n    }\n\n    const include = this.opts.include ?? /\\.[jt]sx?$/\n    const exclude = this.opts.exclude ?? /node_modules/\n\n    // Check idempotency\n    const existing = compiler.options.module?.rules ?? []\n    const alreadyRegistered = existing.some((r: any) => r._tailwindStyledRspackMarker === true)\n    if (alreadyRegistered) return\n\n    const rule = {\n      _tailwindStyledRspackMarker: true,\n      test: include,\n      exclude: exclude,\n      use: [\n        {\n          loader: LOADER_PATH,\n          options: loaderOpts,\n        },\n      ],\n    }\n\n    compiler.options.module.rules = [rule, ...existing]\n  }\n}\n\nexport function tailwindStyledRspackPlugin(\n  opts: RspackPluginOptions = {}\n): TailwindStyledRspackPlugin {\n  return new TailwindStyledRspackPlugin(opts)\n}\n\nexport default tailwindStyledRspackPlugin\n"]}

package/dist/runtime.d.mts

@@ -0,0 +1,62 @@
+import React from 'react';
+export { L as LiveTokenEngineBridge, a as LiveTokenSet, T as TokenMap, b as TokenSubscriber, c as applyTokenSet, d as createUseTokens, g as generateTokenCssString, e as getToken, f as getTokens, l as liveToken, h as liveTokenEngine, s as setToken, i as setTokens, j as subscribeTokens, t as tokenRef, k as tokenVar } from './liveTokenEngine-DYN3Zale.mjs';
+
+/**
+ * @tailwind-styled/runtime v5
+ *
+ * Lightweight runtime helpers for compiled tailwind-styled-v5 components.
+ * Live token engine has been moved to @tailwind-styled/theme package.
+ */
+
+interface SubComponentDef {
+    /** HTML tag to render (default: "span") */
+    tag?: string;
+    /** Scoped CSS class generated by Rust, e.g. "Button_icon_abc123" */
+    class: string;
+}
+type SubComponentMap = Record<string, SubComponentDef>;
+/**
+ * Map of prop name → CSS class appended when the prop is truthy.
+ * e.g. { fullWidth: "w-full", large: "text-lg px-6 py-3" }
+ */
+type ConditionalProps = Record<string, string>;
+/**
+ * A compound styled component: base ForwardRef + attached .SubName properties.
+ * The generic params are intentionally loose so callers don't need to repeat them.
+ */
+type StyledComponent<S extends SubComponentMap = SubComponentMap> = React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>> & {
+    [K in keyof S]: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
+};
+/** Metadata for one compound component produced by Rust. */
+interface ComponentMetadata {
+    component: string;
+    tag: string;
+    baseClass: string;
+    subComponents: SubComponentMap;
+}
+type ClassInput = string | number | false | null | undefined | ClassInput[];
+declare function cx(...inputs: ClassInput[]): string;
+/**
+ * Build a compound styled React component from Rust-generated metadata.
+ *
+ * @param tag           HTML element tag, e.g. "button" | "div"
+ * @param baseClass     Scoped base class from Rust, e.g. "Button_abc123"
+ * @param subComponents Map of subcomponent definitions (optional)
+ * @param conditionals  Map of prop name → CSS class (optional)
+ *
+ * @example
+ * // Injected automatically by the compiler — do not call manually
+ * const Button = createComponent("button", "Button_abc123", {
+ *   icon: { tag: "span", class: "Button_icon_abc123" },
+ *   text: { tag: "span", class: "Button_text_abc123" },
+ * }, { fullWidth: "w-full" })
+ *
+ * // Usage in JSX:
+ * <Button fullWidth>
+ *   <Button.icon>🔍</Button.icon>
+ *   <Button.text>Search</Button.text>
+ * </Button>
+ */
+declare function createComponent<S extends SubComponentMap = SubComponentMap>(tag: string, baseClass: string, subComponents?: S, conditionals?: ConditionalProps): StyledComponent<S>;
+
+export { type ComponentMetadata, type ConditionalProps, type StyledComponent, type SubComponentDef, type SubComponentMap, createComponent, cx };

package/dist/runtime.d.ts

@@ -0,0 +1,62 @@
+import React from 'react';
+export { L as LiveTokenEngineBridge, a as LiveTokenSet, T as TokenMap, b as TokenSubscriber, c as applyTokenSet, d as createUseTokens, g as generateTokenCssString, e as getToken, f as getTokens, l as liveToken, h as liveTokenEngine, s as setToken, i as setTokens, j as subscribeTokens, t as tokenRef, k as tokenVar } from './liveTokenEngine-DYN3Zale.js';
+
+/**
+ * @tailwind-styled/runtime v5
+ *
+ * Lightweight runtime helpers for compiled tailwind-styled-v5 components.
+ * Live token engine has been moved to @tailwind-styled/theme package.
+ */
+
+interface SubComponentDef {
+    /** HTML tag to render (default: "span") */
+    tag?: string;
+    /** Scoped CSS class generated by Rust, e.g. "Button_icon_abc123" */
+    class: string;
+}
+type SubComponentMap = Record<string, SubComponentDef>;
+/**
+ * Map of prop name → CSS class appended when the prop is truthy.
+ * e.g. { fullWidth: "w-full", large: "text-lg px-6 py-3" }
+ */
+type ConditionalProps = Record<string, string>;
+/**
+ * A compound styled component: base ForwardRef + attached .SubName properties.
+ * The generic params are intentionally loose so callers don't need to repeat them.
+ */
+type StyledComponent<S extends SubComponentMap = SubComponentMap> = React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>> & {
+    [K in keyof S]: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
+};
+/** Metadata for one compound component produced by Rust. */
+interface ComponentMetadata {
+    component: string;
+    tag: string;
+    baseClass: string;
+    subComponents: SubComponentMap;
+}
+type ClassInput = string | number | false | null | undefined | ClassInput[];
+declare function cx(...inputs: ClassInput[]): string;
+/**
+ * Build a compound styled React component from Rust-generated metadata.
+ *
+ * @param tag           HTML element tag, e.g. "button" | "div"
+ * @param baseClass     Scoped base class from Rust, e.g. "Button_abc123"
+ * @param subComponents Map of subcomponent definitions (optional)
+ * @param conditionals  Map of prop name → CSS class (optional)
+ *
+ * @example
+ * // Injected automatically by the compiler — do not call manually
+ * const Button = createComponent("button", "Button_abc123", {
+ *   icon: { tag: "span", class: "Button_icon_abc123" },
+ *   text: { tag: "span", class: "Button_text_abc123" },
+ * }, { fullWidth: "w-full" })
+ *
+ * // Usage in JSX:
+ * <Button fullWidth>
+ *   <Button.icon>🔍</Button.icon>
+ *   <Button.text>Search</Button.text>
+ * </Button>
+ */
+declare function createComponent<S extends SubComponentMap = SubComponentMap>(tag: string, baseClass: string, subComponents?: S, conditionals?: ConditionalProps): StyledComponent<S>;
+
+export { type ComponentMetadata, type ConditionalProps, type StyledComponent, type SubComponentDef, type SubComponentMap, createComponent, cx };

package/dist/runtime.js

@@ -0,0 +1,207 @@
+'use strict';
+
+var React2 = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React2__default = /*#__PURE__*/_interopDefault(React2);
+
+/* tailwind-styled-v4 v5.0.1 | MIT | https://github.com/dictionar32/tailwind-styled-v4 */
+
+var _currentTokens = {};
+var _subscribers = /* @__PURE__ */ new Set();
+var _styleEl = null;
+function tokenVar(name) {
+  const normalized = name.replace(/[^a-zA-Z0-9-]/g, "-").toLowerCase();
+  return `--tw-token-${normalized}`;
+}
+function tokenRef(name) {
+  return `var(${tokenVar(name)})`;
+}
+function buildRootCss(tokens) {
+  const vars = Object.entries(tokens).map(([name, value]) => `  ${tokenVar(name)}: ${value};`).join("\n");
+  return `:root {
+${vars}
+}`;
+}
+function syncStyleEl() {
+  if (typeof document === "undefined") return;
+  if (!_styleEl) {
+    _styleEl = document.createElement("style");
+    _styleEl.id = "tw-live-tokens";
+    _styleEl.setAttribute("data-tw-tokens", "true");
+    document.head.appendChild(_styleEl);
+  }
+  _styleEl.textContent = buildRootCss(_currentTokens);
+}
+function notifySubscribers() {
+  const snapshot = { ..._currentTokens };
+  for (const subscriber of _subscribers) {
+    try {
+      subscriber(snapshot);
+    } catch {
+    }
+  }
+}
+function liveToken(tokens) {
+  _currentTokens = { ..._currentTokens, ...tokens };
+  syncStyleEl();
+  notifySubscribers();
+  const vars = {};
+  for (const name of Object.keys(tokens)) {
+    vars[name] = tokenRef(name);
+  }
+  return {
+    vars,
+    get(name) {
+      return _currentTokens[name];
+    },
+    set(name, value) {
+      setToken(name, value);
+    },
+    setAll(nextTokens) {
+      setTokens(nextTokens);
+    },
+    snapshot() {
+      return { ..._currentTokens };
+    }
+  };
+}
+function setToken(name, value) {
+  _currentTokens = { ..._currentTokens, [name]: value };
+  if (typeof document !== "undefined") {
+    document.documentElement.style.setProperty(tokenVar(name), value);
+  }
+  notifySubscribers();
+}
+function setTokens(tokens) {
+  _currentTokens = { ..._currentTokens, ...tokens };
+  if (typeof document !== "undefined") {
+    const root = document.documentElement;
+    for (const [name, value] of Object.entries(tokens)) {
+      root.style.setProperty(tokenVar(name), value);
+    }
+  }
+  notifySubscribers();
+}
+function applyTokenSet(tokens) {
+  if (typeof document !== "undefined") {
+    const root = document.documentElement;
+    for (const name of Object.keys(_currentTokens)) {
+      if (!(name in tokens)) {
+        root.style.removeProperty(tokenVar(name));
+      }
+    }
+  }
+  _currentTokens = { ...tokens };
+  syncStyleEl();
+  notifySubscribers();
+}
+function getToken(name) {
+  return _currentTokens[name];
+}
+function getTokens() {
+  return { ..._currentTokens };
+}
+function subscribeTokens(fn) {
+  _subscribers.add(fn);
+  return () => {
+    _subscribers.delete(fn);
+  };
+}
+function generateTokenCssString() {
+  return buildRootCss(_currentTokens);
+}
+function createUseTokens() {
+  return function useTokens() {
+    const [tokens, setTokensState] = React2__default.default.useState({ ..._currentTokens });
+    React2__default.default.useEffect(() => {
+      setTokensState({ ..._currentTokens });
+      return subscribeTokens((nextTokens) => setTokensState({ ...nextTokens }));
+    }, []);
+    return tokens;
+  };
+}
+var liveTokenEngine = {
+  getToken,
+  getTokens,
+  setToken,
+  applyTokenSet,
+  subscribeTokens,
+  subscribe: subscribeTokens
+};
+globalThis.__TW_TOKEN_ENGINE__ = liveTokenEngine;
+if (typeof window !== "undefined") {
+  window.__TW_TOKEN_ENGINE__ = liveTokenEngine;
+}
+
+// packages/runtime/src/index.ts
+function cx(...inputs) {
+  const out = [];
+  for (const input of inputs) {
+    if (!input) continue;
+    if (typeof input === "string") {
+      out.push(input);
+    } else if (typeof input === "number") {
+      out.push(String(input));
+    } else if (Array.isArray(input)) {
+      const nested = cx(...input);
+      if (nested) out.push(nested);
+    }
+  }
+  return out.join(" ");
+}
+function createComponent(tag, baseClass, subComponents, conditionals) {
+  const Base = React2__default.default.forwardRef(function TwBase(props, ref) {
+    const extra = [];
+    if (conditionals) {
+      for (const [prop, cls] of Object.entries(conditionals)) {
+        if (props[prop]) extra.push(cls);
+      }
+    }
+    const clean = {};
+    const stripKeys = /* @__PURE__ */ new Set([
+      "className",
+      ...conditionals ? Object.keys(conditionals) : [],
+      ...subComponents ? Object.keys(subComponents) : []
+    ]);
+    for (const [k, v] of Object.entries(props)) {
+      if (!stripKeys.has(k)) clean[k] = v;
+    }
+    const className = cx(baseClass, ...extra, props.className ?? "");
+    return React2__default.default.createElement(tag, { ...clean, ref, className: className || void 0 });
+  });
+  Base.displayName = "tw." + String(tag);
+  if (subComponents) {
+    for (const [subName, def] of Object.entries(subComponents)) {
+      const subTag = def.tag ?? "span";
+      const subClass = def.class;
+      const SubComp = React2__default.default.forwardRef(function TwSub(props, ref) {
+        const className = cx(subClass, props.className ?? "");
+        const clean = { ...props };
+        delete clean.className;
+        return React2__default.default.createElement(subTag, { ...clean, ref, className: className || void 0 });
+      });
+      SubComp.displayName = "tw." + String(tag) + "." + String(subName);
+      Base[subName] = SubComp;
+    }
+  }
+  return Base;
+}
+
+exports.applyTokenSet = applyTokenSet;
+exports.createComponent = createComponent;
+exports.createUseTokens = createUseTokens;
+exports.cx = cx;
+exports.generateTokenCssString = generateTokenCssString;
+exports.getToken = getToken;
+exports.getTokens = getTokens;
+exports.liveToken = liveToken;
+exports.liveTokenEngine = liveTokenEngine;
+exports.setToken = setToken;
+exports.setTokens = setTokens;
+exports.subscribeTokens = subscribeTokens;
+exports.tokenRef = tokenRef;
+exports.tokenVar = tokenVar;
+//# sourceMappingURL=runtime.js.map
+//# sourceMappingURL=runtime.js.map

package/dist/runtime.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../packages/theme/src/liveTokenEngine.ts","../packages/runtime/src/index.ts"],"names":["React"],"mappings":"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","file":"runtime.js","sourcesContent":["import React from \"react\"\n\nexport type TokenMap = Record<string, string>\nexport type TokenSubscriber = (tokens: TokenMap) => void\n\nexport interface LiveTokenSet {\n  vars: Record<string, string>\n  get(name: string): string | undefined\n  set(name: string, value: string): void\n  setAll(tokens: TokenMap): void\n  snapshot(): TokenMap\n}\n\nexport interface LiveTokenEngineBridge {\n  getToken(name: string): string | undefined\n  getTokens(): TokenMap\n  setToken(name: string, value: string): void\n  applyTokenSet(tokens: TokenMap): void\n  subscribeTokens(fn: TokenSubscriber): () => void\n  subscribe?(fn: TokenSubscriber): () => void\n}\n\ndeclare global {\n  var __TW_TOKEN_ENGINE__: LiveTokenEngineBridge | undefined\n}\n\nlet _currentTokens: TokenMap = {}\nconst _subscribers = new Set<TokenSubscriber>()\nlet _styleEl: HTMLStyleElement | null = null\n\nexport function tokenVar(name: string): string {\n  const normalized = name.replace(/[^a-zA-Z0-9-]/g, \"-\").toLowerCase()\n  return `--tw-token-${normalized}`\n}\n\nexport function tokenRef(name: string): string {\n  return `var(${tokenVar(name)})`\n}\n\nfunction buildRootCss(tokens: TokenMap): string {\n  const vars = Object.entries(tokens)\n    .map(([name, value]) => `  ${tokenVar(name)}: ${value};`)\n    .join(\"\\n\")\n  return `:root {\\n${vars}\\n}`\n}\n\nfunction syncStyleEl(): void {\n  if (typeof document === \"undefined\") return\n\n  if (!_styleEl) {\n    _styleEl = document.createElement(\"style\")\n    _styleEl.id = \"tw-live-tokens\"\n    _styleEl.setAttribute(\"data-tw-tokens\", \"true\")\n    document.head.appendChild(_styleEl)\n  }\n\n  _styleEl.textContent = buildRootCss(_currentTokens)\n}\n\nfunction notifySubscribers(): void {\n  const snapshot = { ..._currentTokens }\n  for (const subscriber of _subscribers) {\n    try {\n      subscriber(snapshot)\n    } catch {\n      // intentionally ignore subscriber errors\n    }\n  }\n}\n\nexport function liveToken(tokens: TokenMap): LiveTokenSet {\n  _currentTokens = { ..._currentTokens, ...tokens }\n  syncStyleEl()\n  notifySubscribers()\n\n  const vars: Record<string, string> = {}\n  for (const name of Object.keys(tokens)) {\n    vars[name] = tokenRef(name)\n  }\n\n  return {\n    vars,\n    get(name) {\n      return _currentTokens[name]\n    },\n    set(name, value) {\n      setToken(name, value)\n    },\n    setAll(nextTokens) {\n      setTokens(nextTokens)\n    },\n    snapshot() {\n      return { ..._currentTokens }\n    },\n  }\n}\n\nexport function setToken(name: string, value: string): void {\n  _currentTokens = { ..._currentTokens, [name]: value }\n\n  if (typeof document !== \"undefined\") {\n    document.documentElement.style.setProperty(tokenVar(name), value)\n  }\n\n  notifySubscribers()\n}\n\nexport function setTokens(tokens: TokenMap): void {\n  _currentTokens = { ..._currentTokens, ...tokens }\n\n  if (typeof document !== \"undefined\") {\n    const root = document.documentElement\n    for (const [name, value] of Object.entries(tokens)) {\n      root.style.setProperty(tokenVar(name), value)\n    }\n  }\n\n  notifySubscribers()\n}\n\nexport function applyTokenSet(tokens: TokenMap): void {\n  if (typeof document !== \"undefined\") {\n    const root = document.documentElement\n    for (const name of Object.keys(_currentTokens)) {\n      if (!(name in tokens)) {\n        root.style.removeProperty(tokenVar(name))\n      }\n    }\n  }\n\n  _currentTokens = { ...tokens }\n  syncStyleEl()\n  notifySubscribers()\n}\n\nexport function getToken(name: string): string | undefined {\n  return _currentTokens[name]\n}\n\nexport function getTokens(): TokenMap {\n  return { ..._currentTokens }\n}\n\nexport function subscribeTokens(fn: TokenSubscriber): () => void {\n  _subscribers.add(fn)\n  return () => {\n    _subscribers.delete(fn)\n  }\n}\n\nexport function generateTokenCssString(): string {\n  return buildRootCss(_currentTokens)\n}\n\nexport function createUseTokens() {\n  return function useTokens(): TokenMap {\n    const [tokens, setTokensState] = React.useState<TokenMap>({ ..._currentTokens })\n\n    React.useEffect(() => {\n      setTokensState({ ..._currentTokens })\n      return subscribeTokens((nextTokens) => setTokensState({ ...nextTokens }))\n    }, [])\n\n    return tokens\n  }\n}\n\nexport const liveTokenEngine: LiveTokenEngineBridge = {\n  getToken,\n  getTokens,\n  setToken,\n  applyTokenSet,\n  subscribeTokens,\n  subscribe: subscribeTokens,\n}\n\nglobalThis.__TW_TOKEN_ENGINE__ = liveTokenEngine\nif (typeof window !== \"undefined\") {\n  ;(window as any).__TW_TOKEN_ENGINE__ = liveTokenEngine\n}\n","/**\n * @tailwind-styled/runtime v5\n *\n * Lightweight runtime helpers for compiled tailwind-styled-v5 components.\n * Live token engine has been moved to @tailwind-styled/theme package.\n */\n\nimport React from \"react\"\n\n// Re-export live token engine from @tailwind-styled/theme\nexport type {\n  LiveTokenEngineBridge,\n  LiveTokenSet,\n  TokenMap,\n  TokenSubscriber,\n} from \"@tailwind-styled/theme\"\nexport {\n  applyTokenSet,\n  createUseTokens,\n  generateTokenCssString,\n  getToken,\n  getTokens,\n  liveToken,\n  liveTokenEngine,\n  setToken,\n  setTokens,\n  subscribeTokens,\n  tokenRef,\n  tokenVar,\n} from \"@tailwind-styled/theme\"\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Types\n// ─────────────────────────────────────────────────────────────────────────────\n\nexport interface SubComponentDef {\n  /** HTML tag to render (default: \"span\") */\n  tag?: string\n  /** Scoped CSS class generated by Rust, e.g. \"Button_icon_abc123\" */\n  class: string\n}\n\nexport type SubComponentMap = Record<string, SubComponentDef>\n\n/**\n * Map of prop name → CSS class appended when the prop is truthy.\n * e.g. { fullWidth: \"w-full\", large: \"text-lg px-6 py-3\" }\n */\nexport type ConditionalProps = Record<string, string>\n\n/**\n * A compound styled component: base ForwardRef + attached .SubName properties.\n * The generic params are intentionally loose so callers don't need to repeat them.\n */\nexport type StyledComponent<S extends SubComponentMap = SubComponentMap> =\n  React.ForwardRefExoticComponent<\n    React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>\n  > & {\n    [K in keyof S]: React.ForwardRefExoticComponent<\n      React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>\n    >\n  }\n\n/** Metadata for one compound component produced by Rust. */\nexport interface ComponentMetadata {\n  component: string\n  tag: string\n  baseClass: string\n  subComponents: SubComponentMap\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// cx — tiny className utility (no external dependency)\n// ─────────────────────────────────────────────────────────────────────────────\n\ntype ClassInput = string | number | false | null | undefined | ClassInput[]\n\nexport function cx(...inputs: ClassInput[]): string {\n  const out: string[] = []\n  for (const input of inputs) {\n    if (!input) continue // filters 0, false, null, undefined, \"\"\n    if (typeof input === \"string\") {\n      out.push(input)\n    } else if (typeof input === \"number\") {\n      out.push(String(input))\n    } else if (Array.isArray(input)) {\n      const nested = cx(...input)\n      if (nested) out.push(nested)\n    }\n  }\n  return out.join(\" \")\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// createComponent\n// ─────────────────────────────────────────────────────────────────────────────\n\n/**\n * Build a compound styled React component from Rust-generated metadata.\n *\n * @param tag           HTML element tag, e.g. \"button\" | \"div\"\n * @param baseClass     Scoped base class from Rust, e.g. \"Button_abc123\"\n * @param subComponents Map of subcomponent definitions (optional)\n * @param conditionals  Map of prop name → CSS class (optional)\n *\n * @example\n * // Injected automatically by the compiler — do not call manually\n * const Button = createComponent(\"button\", \"Button_abc123\", {\n *   icon: { tag: \"span\", class: \"Button_icon_abc123\" },\n *   text: { tag: \"span\", class: \"Button_text_abc123\" },\n * }, { fullWidth: \"w-full\" })\n *\n * // Usage in JSX:\n * <Button fullWidth>\n *   <Button.icon>🔍</Button.icon>\n *   <Button.text>Search</Button.text>\n * </Button>\n */\nexport function createComponent<S extends SubComponentMap = SubComponentMap>(\n  tag: string,\n  baseClass: string,\n  subComponents?: S,\n  conditionals?: ConditionalProps\n): StyledComponent<S> {\n  type Props = React.HTMLAttributes<HTMLElement> &\n    React.RefAttributes<HTMLElement> &\n    Record<string, unknown>\n\n  // ── Base component ─────────────────────────────────────────────────────────\n  const Base = React.forwardRef<HTMLElement, Props>(function TwBase(props, ref) {\n    const extra: string[] = []\n\n    // Collect conditional classes\n    if (conditionals) {\n      for (const [prop, cls] of Object.entries(conditionals)) {\n        if (props[prop]) extra.push(cls)\n      }\n    }\n\n    // Build clean props — strip conditional + subcomponent boolean props\n    const clean: Record<string, unknown> = {}\n    const stripKeys = new Set([\n      \"className\",\n      ...(conditionals ? Object.keys(conditionals) : []),\n      ...(subComponents ? Object.keys(subComponents) : []),\n    ])\n    for (const [k, v] of Object.entries(props)) {\n      if (!stripKeys.has(k)) clean[k] = v\n    }\n\n    const className = cx(baseClass, ...extra, (props.className as string) ?? \"\")\n\n    return React.createElement(tag, { ...clean, ref, className: className || undefined })\n  })\n\n  ;(Base as { displayName?: string }).displayName = \"tw.\" + String(tag)\n\n  // ── Attach subcomponent properties ────────────────────────────────────────\n  if (subComponents) {\n    for (const [subName, def] of Object.entries(subComponents)) {\n      const subTag = def.tag ?? \"span\"\n      const subClass = def.class\n\n      const SubComp = React.forwardRef<HTMLElement, Props>(function TwSub(props, ref) {\n        const className = cx(subClass, (props.className as string) ?? \"\")\n        const clean: Record<string, unknown> = { ...props }\n        delete clean.className\n        return React.createElement(subTag, { ...clean, ref, className: className || undefined })\n      })\n\n      ;(SubComp as { displayName?: string }).displayName =\n        \"tw.\" + String(tag) + \".\" + String(subName)\n\n      ;(Base as unknown as Record<string, unknown>)[subName] = SubComp\n    }\n  }\n\n  return Base as unknown as StyledComponent<S>\n}\n"]}

package/dist/runtime.mjs

@@ -0,0 +1,188 @@
+import React2 from 'react';
+
+/* tailwind-styled-v4 v5.0.1 | MIT | https://github.com/dictionar32/tailwind-styled-v4 */
+
+var _currentTokens = {};
+var _subscribers = /* @__PURE__ */ new Set();
+var _styleEl = null;
+function tokenVar(name) {
+  const normalized = name.replace(/[^a-zA-Z0-9-]/g, "-").toLowerCase();
+  return `--tw-token-${normalized}`;
+}
+function tokenRef(name) {
+  return `var(${tokenVar(name)})`;
+}
+function buildRootCss(tokens) {
+  const vars = Object.entries(tokens).map(([name, value]) => `  ${tokenVar(name)}: ${value};`).join("\n");
+  return `:root {
+${vars}
+}`;
+}
+function syncStyleEl() {
+  if (typeof document === "undefined") return;
+  if (!_styleEl) {
+    _styleEl = document.createElement("style");
+    _styleEl.id = "tw-live-tokens";
+    _styleEl.setAttribute("data-tw-tokens", "true");
+    document.head.appendChild(_styleEl);
+  }
+  _styleEl.textContent = buildRootCss(_currentTokens);
+}
+function notifySubscribers() {
+  const snapshot = { ..._currentTokens };
+  for (const subscriber of _subscribers) {
+    try {
+      subscriber(snapshot);
+    } catch {
+    }
+  }
+}
+function liveToken(tokens) {
+  _currentTokens = { ..._currentTokens, ...tokens };
+  syncStyleEl();
+  notifySubscribers();
+  const vars = {};
+  for (const name of Object.keys(tokens)) {
+    vars[name] = tokenRef(name);
+  }
+  return {
+    vars,
+    get(name) {
+      return _currentTokens[name];
+    },
+    set(name, value) {
+      setToken(name, value);
+    },
+    setAll(nextTokens) {
+      setTokens(nextTokens);
+    },
+    snapshot() {
+      return { ..._currentTokens };
+    }
+  };
+}
+function setToken(name, value) {
+  _currentTokens = { ..._currentTokens, [name]: value };
+  if (typeof document !== "undefined") {
+    document.documentElement.style.setProperty(tokenVar(name), value);
+  }
+  notifySubscribers();
+}
+function setTokens(tokens) {
+  _currentTokens = { ..._currentTokens, ...tokens };
+  if (typeof document !== "undefined") {
+    const root = document.documentElement;
+    for (const [name, value] of Object.entries(tokens)) {
+      root.style.setProperty(tokenVar(name), value);
+    }
+  }
+  notifySubscribers();
+}
+function applyTokenSet(tokens) {
+  if (typeof document !== "undefined") {
+    const root = document.documentElement;
+    for (const name of Object.keys(_currentTokens)) {
+      if (!(name in tokens)) {
+        root.style.removeProperty(tokenVar(name));
+      }
+    }
+  }
+  _currentTokens = { ...tokens };
+  syncStyleEl();
+  notifySubscribers();
+}
+function getToken(name) {
+  return _currentTokens[name];
+}
+function getTokens() {
+  return { ..._currentTokens };
+}
+function subscribeTokens(fn) {
+  _subscribers.add(fn);
+  return () => {
+    _subscribers.delete(fn);
+  };
+}
+function generateTokenCssString() {
+  return buildRootCss(_currentTokens);
+}
+function createUseTokens() {
+  return function useTokens() {
+    const [tokens, setTokensState] = React2.useState({ ..._currentTokens });
+    React2.useEffect(() => {
+      setTokensState({ ..._currentTokens });
+      return subscribeTokens((nextTokens) => setTokensState({ ...nextTokens }));
+    }, []);
+    return tokens;
+  };
+}
+var liveTokenEngine = {
+  getToken,
+  getTokens,
+  setToken,
+  applyTokenSet,
+  subscribeTokens,
+  subscribe: subscribeTokens
+};
+globalThis.__TW_TOKEN_ENGINE__ = liveTokenEngine;
+if (typeof window !== "undefined") {
+  window.__TW_TOKEN_ENGINE__ = liveTokenEngine;
+}
+
+// packages/runtime/src/index.ts
+function cx(...inputs) {
+  const out = [];
+  for (const input of inputs) {
+    if (!input) continue;
+    if (typeof input === "string") {
+      out.push(input);
+    } else if (typeof input === "number") {
+      out.push(String(input));
+    } else if (Array.isArray(input)) {
+      const nested = cx(...input);
+      if (nested) out.push(nested);
+    }
+  }
+  return out.join(" ");
+}
+function createComponent(tag, baseClass, subComponents, conditionals) {
+  const Base = React2.forwardRef(function TwBase(props, ref) {
+    const extra = [];
+    if (conditionals) {
+      for (const [prop, cls] of Object.entries(conditionals)) {
+        if (props[prop]) extra.push(cls);
+      }
+    }
+    const clean = {};
+    const stripKeys = /* @__PURE__ */ new Set([
+      "className",
+      ...conditionals ? Object.keys(conditionals) : [],
+      ...subComponents ? Object.keys(subComponents) : []
+    ]);
+    for (const [k, v] of Object.entries(props)) {
+      if (!stripKeys.has(k)) clean[k] = v;
+    }
+    const className = cx(baseClass, ...extra, props.className ?? "");
+    return React2.createElement(tag, { ...clean, ref, className: className || void 0 });
+  });
+  Base.displayName = "tw." + String(tag);
+  if (subComponents) {
+    for (const [subName, def] of Object.entries(subComponents)) {
+      const subTag = def.tag ?? "span";
+      const subClass = def.class;
+      const SubComp = React2.forwardRef(function TwSub(props, ref) {
+        const className = cx(subClass, props.className ?? "");
+        const clean = { ...props };
+        delete clean.className;
+        return React2.createElement(subTag, { ...clean, ref, className: className || void 0 });
+      });
+      SubComp.displayName = "tw." + String(tag) + "." + String(subName);
+      Base[subName] = SubComp;
+    }
+  }
+  return Base;
+}
+
+export { applyTokenSet, createComponent, createUseTokens, cx, generateTokenCssString, getToken, getTokens, liveToken, liveTokenEngine, setToken, setTokens, subscribeTokens, tokenRef, tokenVar };
+//# sourceMappingURL=runtime.mjs.map
+//# sourceMappingURL=runtime.mjs.map