@tachui/core 0.8.0-alpha → 0.8.5-alpha

package/README.md

@@ -24,9 +24,9 @@ tachUI core provides a SwiftUI-inspired declarative framework for building web a
 ### Installation
 
 ```bash
-npm install @tachui/core@0.8.0-alpha
+npm install @tachui/core@0.9.0
 # or
-pnpm add @tachui/core@0.8.0-alpha
+pnpm add @tachui/core@0.9.0
 ```
 
 ### Basic Example
@@ -101,6 +101,8 @@ Text('Hello tachUI')
   .build()
 ```
 
+> **Modifier registration:** Starting in 0.8.0 the concrete modifier implementations live in `@tachui/modifiers`. Import `@tachui/modifiers/preload/basic` (and optional bundles like `preload/effects`) once during app bootstrap so the builder proxy in `@tachui/core` can resolve the modifier factories from the shared registry.
+
 ### Available Modifiers
 
 - **Layout**: `.frame()`, `.padding()`, `.margin()`, `.position()`
@@ -164,6 +166,60 @@ tachUI's architecture provides:
 - **Memory-safe cleanup** - WeakMap-based automatic cleanup
 - **Sub-millisecond updates** - Direct DOM manipulation
 
+### Concatenation Optimization (New in 0.8.1-alpha)
+
+Revolutionary bundle size reduction for component concatenation patterns:
+
+```typescript
+// Before: Uses full 87.76KB concatenation runtime
+Text('Hello').build().concat(Text('World').build())
+
+// After: Smart optimization with 94.9% bundle reduction
+// • Static patterns: 0KB runtime (compile-time concatenation)
+// • Dynamic patterns: 1.2-1.9KB selective runtime based on accessibility needs
+```
+
+- **Automatic Detection**: TypeScript AST analysis finds `.build().concat()` patterns
+- **Smart Runtime Selection**: Minimal (1.18KB), ARIA (1.42KB), or Full (1.93KB) based on component needs
+- **CLI Integration**: Use `tachui analyze --concatenation` for optimization insights
+- **Production Ready**: 27 tests passing, handles 250+ files in <500ms
+
+## Modifier Type Generation
+
+tachUI ships tooling to keep modifier chaining types in sync with the registry.
+
+### One-off generation
+
+```bash
+pnpm --filter @tachui/core generate-modifier-types
+```
+
+### CI verification / conflict detection
+
+```bash
+# Verifies that generated files are up to date
+pnpm --filter @tachui/core generate-modifier-types -- --check
+
+# Optionally fail when metadata conflicts are detected
+pnpm --filter @tachui/core generate-modifier-types -- --check --fail-on-conflict
+```
+
+### Watch mode
+
+```bash
+pnpm --filter @tachui/core generate-modifier-types -- --watch
+```
+
+### Monorepo generation
+
+Generate declarations for multiple packages at once:
+
+```bash
+pnpm --filter @tachui/core generate-modifier-types:monorepo -- --packages core,forms,navigation
+```
+
+The tooling automatically hydrates modifier metadata via `@tachui/modifiers` (for runtime definitions) and `@tachui/devtools` (for parameter signatures/documentation).
+
 ## Plugin Ecosystem
 
 Extend tachUI with additional packages:

package/dist/assets/AssetCollection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AssetCollection.d.ts","sourceRoot":"","sources":["../../src/assets/AssetCollection.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAIpC,qBAAa,eAAe;IAC1B,OAAO,CAAC,MAAM,CAAgC;IAE9C,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAG,IAAI;IAIrC,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,KAAK,GAAG,SAAS;IAIpC,MAAM,IAAI,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC;IAK5B,OAAO,IAAI,MAAM,CAAC,MAAM,EAAE,KAAK,GAAG,OAAO,CAAC;CAwE3C"}
+{"version":3,"file":"AssetCollection.d.ts","sourceRoot":"","sources":["../../src/assets/AssetCollection.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAKpC,qBAAa,eAAe;IAC1B,OAAO,CAAC,MAAM,CAAgC;IAE9C,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAG,IAAI;IAIrC,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,KAAK,GAAG,SAAS;IAIpC,MAAM,IAAI,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC;IAK5B,OAAO,IAAI,MAAM,CAAC,MAAM,EAAE,KAAK,GAAG,OAAO,CAAC;CAmI3C"}

package/dist/assets/ColorAsset.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColorAsset.d.ts","sourceRoot":"","sources":["../../src/assets/ColorAsset.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAEpD;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;CACb;AAED,qBAAa,UAAW,SAAQ,KAAK;IACnC,SAAgB,OAAO,EAAE,MAAM,CAAA;IAC/B,SAAgB,KAAK,CAAC,EAAE,MAAM,CAAA;IAC9B,SAAgB,IAAI,CAAC,EAAE,MAAM,CAAA;gBAEjB,OAAO,EAAE,iBAAiB;IAiCtC,MAAM,CAAC,IAAI,CAAC,OAAO,EAAE,iBAAiB,GAAG,UAAU;IAInD;;;OAGG;IACH,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,qBAAqB;IAiI1D,MAAM,CAAC,eAAe,IAAI,MAAM;IAIhC,OAAO,IAAI,MAAM;CAUlB"}
+{"version":3,"file":"ColorAsset.d.ts","sourceRoot":"","sources":["../../src/assets/ColorAsset.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAOH,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAEpD;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;CACb;AAED,qBAAa,UAAW,SAAQ,KAAK;IACnC,SAAgB,OAAO,EAAE,MAAM,CAAA;IAC/B,SAAgB,KAAK,CAAC,EAAE,MAAM,CAAA;IAC9B,SAAgB,IAAI,CAAC,EAAE,MAAM,CAAA;gBAEjB,OAAO,EAAE,iBAAiB;IAyCtC,MAAM,CAAC,IAAI,CAAC,OAAO,EAAE,iBAAiB,GAAG,UAAU;IAInD;;;OAGG;IACH,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,qBAAqB;IAmI1D,MAAM,CAAC,eAAe,IAAI,MAAM;IAIhC,OAAO,IAAI,MAAM;CAsBlB"}

package/dist/assets/index.d.ts

@@ -23,4 +23,5 @@ export declare function createImageAsset(defaultPath: string, light?: string, da
 export declare function createFontAsset(family: string, fallbacks?: string[], name?: string, options?: FontAssetOptions): FontAsset;
 export declare function getAssetInfo(): AssetInfo[];
 export declare function listAssetNames(): string[];
+export { LinearGradient, StateGradient, RadialGradient } from '../gradients';
 //# sourceMappingURL=index.d.ts.map

package/dist/assets/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/assets/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAE/B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,SAAS,EAAE,KAAK,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAC9D,OAAO,KAAK,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AASzD,eAAO,MAAM,MAAM,EAAE,eAAgD,CAAA;AAGrE,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,CAAA;AACnD,cAAc,SAAS,CAAA;AACvB,OAAO,EACL,gBAAgB,IAAI,UAAU,EAC9B,SAAS,EACT,WAAW,EACX,gBAAgB,EAChB,gBAAgB,EAChB,kBAAkB,EAClB,KAAK,gBAAgB,EACrB,KAAK,eAAe,EACpB,KAAK,cAAc,EACpB,MAAM,aAAa,CAAA;AAGpB,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;AAC/D,wBAAgB,aAAa,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;AACjD,wBAAgB,aAAa,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;AAiBhE,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,MAAM,EACb,IAAI,EAAE,MAAM,EACZ,IAAI,GAAE,MAAW,GAChB,UAAU,CAOZ;AAED,wBAAgB,gBAAgB,CAC9B,WAAW,EAAE,MAAM,EACnB,KAAK,CAAC,EAAE,MAAM,EACd,IAAI,CAAC,EAAE,MAAM,EACb,IAAI,GAAE,MAAW,EACjB,OAAO,CAAC,EAAE;IAAE,GAAG,CAAC,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,CAAA;CAAE,GAC/C,UAAU,CAQZ;AAED,wBAAgB,eAAe,CAC7B,MAAM,EAAE,MAAM,EACd,SAAS,GAAE,MAAM,EAAO,EACxB,IAAI,GAAE,MAAW,EACjB,OAAO,CAAC,EAAE,gBAAgB,GACzB,SAAS,CAEX;AAGD,wBAAgB,YAAY,IAAI,SAAS,EAAE,CAuB1C;AAGD,wBAAgB,cAAc,IAAI,MAAM,EAAE,CAEzC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/assets/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAE/B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,SAAS,EAAE,KAAK,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAC9D,OAAO,KAAK,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AASzD,eAAO,MAAM,MAAM,EAAE,eAAgD,CAAA;AAGrE,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,CAAA;AACnD,cAAc,SAAS,CAAA;AACvB,OAAO,EACL,gBAAgB,IAAI,UAAU,EAC9B,SAAS,EACT,WAAW,EACX,gBAAgB,EAChB,gBAAgB,EAChB,kBAAkB,EAClB,KAAK,gBAAgB,EACrB,KAAK,eAAe,EACpB,KAAK,cAAc,EACpB,MAAM,aAAa,CAAA;AAGpB,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;AAC/D,wBAAgB,aAAa,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;AACjD,wBAAgB,aAAa,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;AAiBhE,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,MAAM,EACb,IAAI,EAAE,MAAM,EACZ,IAAI,GAAE,MAAW,GAChB,UAAU,CAOZ;AAED,wBAAgB,gBAAgB,CAC9B,WAAW,EAAE,MAAM,EACnB,KAAK,CAAC,EAAE,MAAM,EACd,IAAI,CAAC,EAAE,MAAM,EACb,IAAI,GAAE,MAAW,EACjB,OAAO,CAAC,EAAE;IAAE,GAAG,CAAC,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,CAAA;CAAE,GAC/C,UAAU,CAQZ;AAED,wBAAgB,eAAe,CAC7B,MAAM,EAAE,MAAM,EACd,SAAS,GAAE,MAAM,EAAO,EACxB,IAAI,GAAE,MAAW,EACjB,OAAO,CAAC,EAAE,gBAAgB,GACzB,SAAS,CAEX;AAGD,wBAAgB,YAAY,IAAI,SAAS,EAAE,CAuB1C;AAGD,wBAAgB,cAAc,IAAI,MAAM,EAAE,CAEzC;AAqDD,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA"}

package/dist/assets/index.js

@@ -0,0 +1,486 @@
+import { A as g } from "../index-JQ1sW1SK.js";
+import { L as se, R as ne, k as ae } from "../index-JQ1sW1SK.js";
+import { I as A, J as _, k as R } from "../theme-BFaKUcjZ.js";
+export * from "@tachui/types/assets";
+var V = Object.defineProperty, E = (n, e, t) => e in n ? V(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, x = (n, e, t) => E(n, typeof e != "symbol" ? e + "" : e, t);
+class i extends g {
+  constructor(e) {
+    if (super(e.name), x(this, "default"), x(this, "light"), x(this, "dark"), !e.default)
+      throw new Error(
+        `ColorAsset "${e.name}" must specify a default color`
+      );
+    const t = i.validateColor(e.default);
+    if (!t.isValid)
+      throw new Error(
+        `Invalid default color format for asset "${e.name}": ${t.error}`
+      );
+    if (e.light) {
+      const a = i.validateColor(e.light);
+      if (!a.isValid)
+        throw new Error(
+          `Invalid light color format for asset "${e.name}": ${a.error}`
+        );
+    }
+    if (e.dark) {
+      const a = i.validateColor(e.dark);
+      if (!a.isValid)
+        throw new Error(
+          `Invalid dark color format for asset "${e.name}": ${a.error}`
+        );
+    }
+    this.default = e.default, this.light = e.light, this.dark = e.dark;
+  }
+  static init(e) {
+    return new i(e);
+  }
+  /**
+   * Validates a color string format
+   * Supports: hex, rgb, rgba, hsl, hsla, and named colors
+   */
+  static validateColor(e) {
+    if (!e || typeof e != "string")
+      return {
+        isValid: !1,
+        error: "Color must be a non-empty string"
+      };
+    const t = e.trim();
+    if (/^#([A-Fa-f0-9]{3}|[A-Fa-f0-9]{6}|[A-Fa-f0-9]{8})$/.test(t))
+      return { isValid: !0, format: "hex" };
+    const s = /^rgb\s*\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)$/;
+    if (s.test(t)) {
+      const l = t.match(s), [, c, h, m] = l.map(Number);
+      return c <= 255 && h <= 255 && m <= 255 ? { isValid: !0, format: "rgb" } : {
+        isValid: !1,
+        error: "RGB values must be between 0 and 255"
+      };
+    }
+    const r = /^rgba\s*\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]*\.?[0-9]+)\s*\)$/;
+    if (r.test(t)) {
+      const l = t.match(r), [, c, h, m, S] = l, p = Number(c), C = Number(h), k = Number(m), w = Number(S);
+      return p <= 255 && C <= 255 && k <= 255 && w >= 0 && w <= 1 ? { isValid: !0, format: "rgba" } : {
+        isValid: !1,
+        error: "RGBA values must be: RGB 0-255, alpha 0-1"
+      };
+    }
+    const o = /^hsl\s*\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})%\s*,\s*([0-9]{1,3})%\s*\)$/;
+    if (o.test(t)) {
+      const l = t.match(o), [, c, h, m] = l.map(Number);
+      return c <= 360 && h <= 100 && m <= 100 ? { isValid: !0, format: "hsl" } : {
+        isValid: !1,
+        error: "HSL values must be: H 0-360, S/L 0-100%"
+      };
+    }
+    const d = /^hsla\s*\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})%\s*,\s*([0-9]{1,3})%\s*,\s*([0-9]*\.?[0-9]+)\s*\)$/;
+    if (d.test(t)) {
+      const l = t.match(d), [, c, h, m, S] = l, p = Number(c), C = Number(h), k = Number(m), w = Number(S);
+      return p <= 360 && C <= 100 && k <= 100 && w >= 0 && w <= 1 ? { isValid: !0, format: "hsla" } : {
+        isValid: !1,
+        error: "HSLA values must be: H 0-360, S/L 0-100%, alpha 0-1"
+      };
+    }
+    return [
+      "transparent",
+      "currentColor",
+      "inherit",
+      "initial",
+      "unset",
+      "black",
+      "white",
+      "red",
+      "green",
+      "blue",
+      "yellow",
+      "cyan",
+      "magenta",
+      "gray",
+      "grey",
+      "orange",
+      "purple",
+      "pink",
+      "brown",
+      "navy",
+      "teal",
+      "lime",
+      "olive",
+      "maroon",
+      "silver",
+      "aqua",
+      "fuchsia"
+    ].includes(t.toLowerCase()) ? { isValid: !0, format: "named" } : t.startsWith("var(--") && t.endsWith(")") ? { isValid: !0, format: "named" } : {
+      isValid: !1,
+      error: "Unsupported color format. Supported: hex, rgb, rgba, hsl, hsla, named colors, CSS custom properties"
+    };
+  }
+  static getCurrentTheme() {
+    return A();
+  }
+  resolve() {
+    const e = R() !== null;
+    let t;
+    return e ? t = _()() : t = i.getCurrentTheme(), t === "dark" ? this.dark || this.default : this.light || this.default;
+  }
+}
+var N = Object.defineProperty, L = (n, e, t) => e in n ? N(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, b = (n, e, t) => L(n, typeof e != "symbol" ? e + "" : e, t);
+class F extends g {
+  constructor(e) {
+    if (super(e.name), b(this, "default"), b(this, "light"), b(this, "dark"), b(this, "alt"), b(this, "placeholder"), !e.default)
+      throw new Error(`ImageAsset "${e.name}" must specify a default image path`);
+    this.default = e.default, this.light = e.light, this.dark = e.dark, this.alt = e.options?.alt, this.placeholder = e.options?.placeholder;
+  }
+  static init(e) {
+    return new F(e);
+  }
+  static getCurrentTheme() {
+    return A();
+  }
+  resolve() {
+    const e = R() !== null;
+    let t;
+    return e ? t = _()() : t = F.getCurrentTheme(), t === "dark" ? this.dark || this.default : this.light || this.default;
+  }
+  // Additional accessors
+  get src() {
+    return this.resolve();
+  }
+  get lightSrc() {
+    return this.light || this.default;
+  }
+  get darkSrc() {
+    return this.dark || this.default;
+  }
+  get defaultSrc() {
+    return this.default;
+  }
+}
+var G = Object.defineProperty, I = (n, e, t) => e in n ? G(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, v = (n, e, t) => I(n, typeof e != "symbol" ? e + "" : e, t);
+class f extends g {
+  constructor(e, t = [], a = "", s = {}) {
+    super(a || e), v(this, "family"), v(this, "fallbacks"), v(this, "options"), v(this, "loaded", !1), v(this, "loadPromise", null), this.family = e, this.fallbacks = t, this.options = {
+      loading: "lazy",
+      fontDisplay: "swap",
+      preconnect: !0,
+      ...s
+    }, this.options.loading === "eager" && this.load();
+  }
+  /**
+   * Static factory method for SwiftUI-style initialization
+   */
+  static init(e, t = [], a, s = {}) {
+    return new f(e, t, a, s);
+  }
+  /**
+   * Get the full font-family CSS value including fallbacks
+   */
+  get value() {
+    return [this.family, ...this.fallbacks].map((t) => t.includes(" ") ? `"${t}"` : t).join(", ");
+  }
+  /**
+   * Load the font if not already loaded
+   */
+  async load() {
+    if (!(this.loaded || !this.options.fontUrl)) {
+      if (this.loadPromise)
+        return this.loadPromise;
+      this.loadPromise = this.loadFont(), await this.loadPromise, this.loaded = !0;
+    }
+  }
+  /**
+   * Internal font loading implementation
+   */
+  async loadFont() {
+    const { fontUrl: e, preconnect: t } = this.options;
+    if (e) {
+      if (t && typeof document < "u" && document.querySelector)
+        try {
+          const s = new URL(e).origin;
+          if (!document.querySelector(`link[rel="preconnect"][href="${s}"]`)) {
+            const r = document.createElement("link");
+            r.rel = "preconnect", r.href = s, r.crossOrigin = "anonymous", document.head.appendChild(r);
+          }
+        } catch {
+        }
+      if (e.endsWith(".css") || e.includes("fonts.googleapis.com") ? await this.loadFontCSS(e) : await this.loadFontFile(e), "fonts" in document)
+        try {
+          await document.fonts.ready;
+          const s = `16px ${this.family.includes(" ") ? `"${this.family}"` : this.family}`;
+          document.fonts.check(s) || console.warn(`⚠️ Font "${this.family}" may not have loaded correctly`);
+        } catch {
+        }
+    }
+  }
+  /**
+   * Load a CSS file containing @font-face rules
+   */
+  async loadFontCSS(e) {
+    return new Promise((t, a) => {
+      if (document.querySelector(`link[href="${e}"]`)) {
+        t();
+        return;
+      }
+      const r = document.createElement("link");
+      r.rel = "stylesheet", r.href = e, r.onload = () => {
+        t();
+      }, r.onerror = (o) => {
+        console.warn(`⚠️ Failed to load font CSS for ${this.family}:`, e), t();
+      }, document.head.appendChild(r);
+    });
+  }
+  /**
+   * Load a font file directly and create @font-face rule
+   */
+  async loadFontFile(e) {
+    const { fontFormat: t, fontDisplay: a, weightRange: s, widthRange: r } = this.options;
+    let o = "";
+    t ? o = `format('${t}')` : e.endsWith(".woff2") ? o = "format('woff2')" : e.endsWith(".woff") ? o = "format('woff')" : e.endsWith(".ttf") && (o = "format('truetype')");
+    let d = `
+      @font-face {
+        font-family: "${this.family}";
+        src: url("${e}") ${o};
+        font-display: ${a || "swap"};
+    `;
+    s && (d += `font-weight: ${s[0]} ${s[1]};
+`), r && (d += `font-stretch: ${r[0]}% ${r[1]}%;
+`), d += "}";
+    const $ = document.createElement("style");
+    if ($.textContent = d, document.head.appendChild($), "FontFace" in window)
+      try {
+        const l = new FontFace(this.family, `url(${e})`, {
+          display: a || "swap",
+          weight: s ? `${s[0]} ${s[1]}` : void 0,
+          stretch: r ? `${r[0]}% ${r[1]}%` : void 0
+        });
+        await l.load(), document.fonts.add(l);
+      } catch {
+      }
+  }
+  /**
+   * Create a CSS variable for this font
+   */
+  toCSSVariable(e) {
+    return `${e || `--font-${this.name.toLowerCase().replace(/\s+/g, "-")}`}: ${this.value};`;
+  }
+  /**
+   * Get debug information
+   */
+  [Symbol.for("nodejs.util.inspect.custom")]() {
+    return `FontAsset(${this.family}, loaded: ${this.loaded})`;
+  }
+  /**
+   * Resolve the font value (required by Asset base class)
+   */
+  resolve() {
+    return this.options.loading === "lazy" && !this.loaded && this.options.fontUrl && this.load(), this.value;
+  }
+}
+const H = {
+  ultraLight: 100,
+  thin: 200,
+  light: 300,
+  regular: 400,
+  medium: 500,
+  semibold: 600,
+  bold: 700,
+  heavy: 800,
+  black: 900
+}, z = {
+  ultraCondensed: 50,
+  extraCondensed: 62.5,
+  condensed: 75,
+  semiCondensed: 87.5,
+  normal: 100,
+  semiExpanded: 112.5,
+  expanded: 125,
+  extraExpanded: 150,
+  ultraExpanded: 200
+}, P = {
+  sansSerif: ["system-ui", "-apple-system", "BlinkMacSystemFont", "Segoe UI", "Roboto", "Helvetica Neue", "Arial", "sans-serif"],
+  serif: ["Georgia", "Cambria", "Times New Roman", "Times", "serif"],
+  monospace: ["ui-monospace", "SFMono-Regular", "SF Mono", "Consolas", "Liberation Mono", "Menlo", "Courier", "monospace"],
+  cursive: ["cursive"],
+  fantasy: ["fantasy"]
+};
+function j(n = "sansSerif", e) {
+  return new f("", [...P[n]], e || `system-${n}`);
+}
+function O(n, e = [400], t, a = {}) {
+  const s = e.join(";"), o = `https://fonts.googleapis.com/css2?family=${n.replace(/\s+/g, "+")}:wght@${s}&display=swap`;
+  return new f(
+    n,
+    [...P.sansSerif],
+    t || n.toLowerCase().replace(/\s+/g, "-"),
+    {
+      ...a,
+      fontUrl: o,
+      preconnect: !0
+    }
+  );
+}
+function J(n, e, t, a = [...P.sansSerif], s) {
+  const r = {};
+  return t.slant && (r.slnt = t.slant), t.optical && (r.opsz = t.optical), t.custom && Object.assign(r, t.custom), new f(n, a, s, {
+    fontUrl: e,
+    weightRange: t.weight,
+    widthRange: t.width,
+    variableAxes: r,
+    fontDisplay: "swap"
+  });
+}
+var T = Object.defineProperty, W = (n, e, t) => e in n ? T(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, B = (n, e, t) => W(n, e + "", t);
+class D {
+  constructor() {
+    B(this, "assets", /* @__PURE__ */ new Map());
+  }
+  add(e, t) {
+    this.assets.set(e, t);
+  }
+  get(e) {
+    return this.assets.get(e);
+  }
+  getAll() {
+    return new Map(this.assets);
+  }
+  // Proxy handler for dot notation access
+  asProxy() {
+    return new Proxy(
+      {},
+      {
+        get: (e, t) => {
+          if (t === "toString" || t === "valueOf")
+            return () => "[Assets]";
+          const a = this.assets.get(t);
+          if (a)
+            return a instanceof i ? new Proxy(a, {
+              get: (s, r) => r === "light" || r === "dark" ? s[r] : r === "resolve" ? () => s.resolve() : r === "toString" || r === "valueOf" ? () => s.resolve() : s[r],
+              has: (s, r) => r === "resolve" ? !0 : r in s
+            }) : a instanceof F ? new Proxy(a, {
+              get: (s, r) => r === "lightSrc" || r === "darkSrc" || r === "src" || r === "defaultSrc" ? s[r] : r === "resolve" ? () => s.resolve() : r === "toString" || r === "valueOf" ? () => s.resolve() : s[r],
+              has: (s, r) => r === "resolve" ? !0 : r in s
+            }) : a instanceof f ? new Proxy(a, {
+              get: (s, r) => r === "family" || r === "fallbacks" || r === "options" ? s[r] : r === "resolve" ? () => s.resolve() : r === "toString" || r === "valueOf" ? () => s.resolve() : s[r],
+              has: (s, r) => r === "resolve" ? !0 : r in s
+            }) : a;
+        },
+        // Add ownKeys handler to support Object.keys() enumeration
+        ownKeys: (e) => Array.from(this.assets.keys()),
+        // Add has handler to support 'in' operator
+        has: (e, t) => this.assets.has(t)
+      }
+    );
+  }
+}
+const y = new D(), q = y.asProxy(), K = q;
+function u(n, e) {
+  if (typeof n == "string" && e instanceof g)
+    y.add(n, e);
+  else if (n instanceof g && typeof e == "string")
+    y.add(e, n);
+  else if (n instanceof g && e === void 0)
+    y.add(n.name, n);
+  else
+    throw new Error("registerAsset requires either (name, asset), (asset), or (asset, overrideName)");
+}
+function Q(n, e, t = "") {
+  return i.init({
+    default: n,
+    light: n,
+    dark: e,
+    name: t
+  });
+}
+function X(n, e, t, a = "", s) {
+  return F.init({
+    default: n,
+    light: e,
+    dark: t,
+    name: a,
+    options: s
+  });
+}
+function Y(n, e = [], t = "", a) {
+  return f.init(n, e, t, a);
+}
+function Z() {
+  const n = y.getAll(), e = [];
+  for (const [t, a] of n) {
+    let s = "custom";
+    a instanceof i ? s = "color" : a instanceof F ? s = "image" : a instanceof f && (s = "font"), e.push({
+      name: t,
+      type: s,
+      asset: a
+    });
+  }
+  return e.sort((t, a) => t.name.localeCompare(a.name));
+}
+function ee() {
+  return Array.from(y.getAll().keys()).sort();
+}
+u(i.init({
+  default: "#007AFF",
+  light: "#007AFF",
+  dark: "#0A84FF",
+  name: "systemBlue"
+}));
+u(i.init({
+  default: "#34C759",
+  light: "#34C759",
+  dark: "#30D158",
+  name: "systemGreen"
+}));
+u(i.init({
+  default: "#FF3B30",
+  light: "#FF3B30",
+  dark: "#FF453A",
+  name: "systemRed"
+}));
+u(i.init({
+  default: "#FF9500",
+  light: "#FF9500",
+  dark: "#FF9F0A",
+  name: "systemOrange"
+}));
+u(i.init({
+  default: "#5856D6",
+  light: "#5856D6",
+  dark: "#5E5CE6",
+  name: "systemPurple"
+}));
+u(i.init({
+  default: "#FF2D55",
+  light: "#FF2D55",
+  dark: "#FF375F",
+  name: "systemPink"
+}));
+u(i.init({
+  default: "#8E8E93",
+  name: "systemGray"
+}));
+u(i.init({
+  default: "#000000",
+  name: "systemBlack"
+}));
+u(i.init({
+  default: "#FFFFFF",
+  name: "systemWhite"
+}));
+export {
+  g as Asset,
+  K as Assets,
+  i as ColorAsset,
+  f as FontAsset,
+  H as FontWeight,
+  z as FontWidth,
+  F as ImageAsset,
+  se as LinearGradient,
+  ne as RadialGradient,
+  ae as StateGradient,
+  P as SystemFonts,
+  Q as createColorAsset,
+  Y as createFontAsset,
+  O as createGoogleFont,
+  X as createImageAsset,
+  j as createSystemFont,
+  J as createVariableFont,
+  Z as getAssetInfo,
+  ee as listAssetNames,
+  u as registerAsset
+};

package/dist/assets/types.d.ts

@@ -1,70 +1,10 @@
 /**
- * TypeScript types and interfaces for TachUI Assets System
- */
-import type { Asset } from './Asset';
-import type { ColorAsset } from './ColorAsset';
-import type { ImageAsset } from './ImageAsset';
-import type { FontAsset } from './FontAsset';
-export type { Asset };
-/**
- * Interface for ColorAsset with theme-specific access
- */
-export interface ColorAssetProxy extends ColorAsset {
-    light: string;
-    dark: string;
-    toString(): string;
-    valueOf(): string;
-}
-/**
- * Interface for ImageAsset with theme-specific access
- */
-export interface ImageAssetProxy extends ImageAsset {
-    lightSrc: string;
-    darkSrc: string;
-    toString(): string;
-    valueOf(): string;
-}
-/**
- * Built-in system assets interface
- */
-export interface SystemAssets {
-    systemBlue: ColorAssetProxy;
-    systemGreen: ColorAssetProxy;
-    systemRed: ColorAssetProxy;
-    systemOrange: ColorAssetProxy;
-    systemPurple: ColorAssetProxy;
-    systemPink: ColorAssetProxy;
-    systemGray: ColorAssetProxy;
-    systemBlack: ColorAssetProxy;
-    systemWhite: ColorAssetProxy;
-}
-/**
- * Interface for FontAsset with convenient access
- */
-export interface FontAssetProxy extends FontAsset {
-    toString(): string;
-    valueOf(): string;
-}
-/**
- * Main Assets interface with extensible custom asset support
- */
-export interface AssetsInterface extends SystemAssets {
-    [key: string]: ColorAssetProxy | ImageAssetProxy | FontAssetProxy | Asset;
-}
-/**
- * Asset discovery information
- */
-export interface AssetInfo {
-    name: string;
-    type: 'color' | 'image' | 'font' | 'custom';
-    asset: Asset;
-}
-/**
- * Color validation result
- */
-export interface ColorValidationResult {
-    isValid: boolean;
-    format?: 'hex' | 'rgb' | 'rgba' | 'hsl' | 'hsla' | 'named';
-    error?: string;
-}
+ * TachUI Asset System Types
+ * Re-exported from @tachui/types for backward compatibility
+ */
+export * from '@tachui/types/assets';
+export type { Asset } from './Asset';
+export type { ColorAsset } from './ColorAsset';
+export type { ImageAsset } from './ImageAsset';
+export type { FontAsset } from './FontAsset';
 //# sourceMappingURL=types.d.ts.map

package/dist/assets/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/assets/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AACpC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAC9C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAC9C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAG5C,YAAY,EAAE,KAAK,EAAE,CAAA;AAErB;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,UAAU;IACjD,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,IAAI,MAAM,CAAA;IAClB,OAAO,IAAI,MAAM,CAAA;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,UAAU;IACjD,QAAQ,EAAE,MAAM,CAAA;IAChB,OAAO,EAAE,MAAM,CAAA;IACf,QAAQ,IAAI,MAAM,CAAA;IAClB,OAAO,IAAI,MAAM,CAAA;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,YAAY;IAC3B,UAAU,EAAE,eAAe,CAAA;IAC3B,WAAW,EAAE,eAAe,CAAA;IAC5B,SAAS,EAAE,eAAe,CAAA;IAC1B,YAAY,EAAE,eAAe,CAAA;IAC7B,YAAY,EAAE,eAAe,CAAA;IAC7B,UAAU,EAAE,eAAe,CAAA;IAC3B,UAAU,EAAE,eAAe,CAAA;IAC3B,WAAW,EAAE,eAAe,CAAA;IAC5B,WAAW,EAAE,eAAe,CAAA;CAC7B;AAED;;GAEG;AACH,MAAM,WAAW,cAAe,SAAQ,SAAS;IAC/C,QAAQ,IAAI,MAAM,CAAA;IAClB,OAAO,IAAI,MAAM,CAAA;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,YAAY;IACnD,CAAC,GAAG,EAAE,MAAM,GAAG,eAAe,GAAG,eAAe,GAAG,cAAc,GAAG,KAAK,CAAA;CAC1E;AAED;;GAEG;AACH,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,OAAO,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAA;IAC3C,KAAK,EAAE,KAAK,CAAA;CACb;AAED;;GAEG;AACH,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,KAAK,GAAG,KAAK,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,GAAG,OAAO,CAAA;IAC1D,KAAK,CAAC,EAAE,MAAM,CAAA;CACf"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/assets/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,cAAc,sBAAsB,CAAA;AAGpC,YAAY,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AACpC,YAAY,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAC9C,YAAY,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAC9C,YAAY,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA"}