@tachui/core 0.8.22 → 0.8.24

package/dist/factories-B05hE6kc.js

@@ -0,0 +1,644 @@
+import { LayoutModifier as P, AppearanceModifier as S, AnimationModifier as y, LifecycleModifier as C, InteractionModifier as g, BaseModifier as F } from "./modifiers/base.js";
+import { ModifierPriority as h } from "@tachui/types/modifiers";
+import { globalModifierRegistry as k } from "@tachui/registry";
+import { c as w } from "./effect-DgNm6jk9.js";
+import { i as b } from "./signal-BRoiFOO7.js";
+h.LAYOUT;
+const z = (e) => new P({ alignment: e });
+function H(e) {
+  return z(e);
+}
+h.LAYOUT;
+const O = (e) => new P({ layoutPriority: e });
+function T(e) {
+  return O(e);
+}
+h.APPEARANCE;
+const j = (e) => new S({ opacity: e });
+function D(e) {
+  return j(e);
+}
+h.APPEARANCE;
+const $ = (e) => new S({ cornerRadius: e });
+function V(e) {
+  return $(e);
+}
+function c(e, ...r) {
+  const t = k.get(e);
+  if (!t)
+    throw new Error(
+      `Modifier '${e}' not found in registry. Import '@tachui/modifiers' or the relevant segmented bundle before using preset helpers.`
+    );
+  return t(...r);
+}
+const v = {
+  /**
+   * Set foreground (text) color
+   */
+  foregroundColor(e) {
+    return c("foregroundColor", e);
+  },
+  /**
+   * Set frame dimensions with support for infinity
+   */
+  frame(e, r, t) {
+    let i = t || {};
+    return (e !== void 0 || r !== void 0) && (i = {
+      ...i,
+      ...e !== void 0 ? { width: e } : {},
+      ...r !== void 0 ? { height: r } : {}
+    }), new P({ frame: i });
+  },
+  /**
+   * Set padding on all sides
+   */
+  padding(e) {
+    return c("padding", e);
+  },
+  /**
+   * Set margin on all sides
+   */
+  margin(e) {
+    return c("margin", e);
+  },
+  /**
+   * Set content alignment
+   */
+  alignment(e) {
+    return H(e);
+  },
+  /**
+   * Set layout priority for ZStack container sizing and flexible layout
+   * Higher priority views determine container size in ZStack
+   */
+  layoutPriority(e) {
+    return T(e);
+  }
+}, p = {
+  /**
+   * Set foreground (text) color
+   */
+  foregroundColor(e) {
+    return c("foregroundColor", e);
+  },
+  /**
+   * Set background color
+   */
+  backgroundColor(e) {
+    return c("backgroundColor", e);
+  },
+  /**
+   * Set background (supports gradients)
+   */
+  background(e) {
+    return c("background", e);
+  },
+  /**
+   * Set font properties
+   */
+  font(e) {
+    return c("font", e);
+  },
+  /**
+   * Set font size
+   */
+  fontSize(e) {
+    return c("fontSize", e);
+  },
+  /**
+   * Set font weight
+   */
+  fontWeight(e) {
+    return c("fontWeight", e);
+  },
+  /**
+   * Set font family
+   */
+  fontFamily(e) {
+    return c("fontFamily", e);
+  },
+  /**
+   * Set opacity
+   */
+  opacity(e) {
+    return D(e);
+  },
+  /**
+   * Set corner radius (enhanced)
+   */
+  cornerRadius(e) {
+    return V(e);
+  },
+  /**
+   * Set border
+   */
+  border(e, r = "#000000", t = "solid") {
+    return c("border", e, r, t);
+  },
+  /**
+   * Set detailed border properties
+   */
+  borderDetailed(e) {
+    return c("border", e);
+  }
+  // Shadow functionality moved to @tachui/modifiers/effects entry point
+}, A = {
+  /**
+   * Add tap handler
+   */
+  onTap(e) {
+    return new g({ onTap: e });
+  },
+  /**
+   * Add hover handler
+   */
+  onHover(e) {
+    return new g({ onHover: e });
+  },
+  /**
+   * Add focus handler
+   */
+  onFocus(e) {
+    return new g({ onFocus: e });
+  },
+  /**
+   * Set disabled state
+   */
+  disabled(e = !0) {
+    return new g({ disabled: e });
+  },
+  /**
+   * Set accessibility label
+   */
+  accessibilityLabel(e) {
+    return new g({ accessibilityLabel: e });
+  },
+  /**
+   * Set accessibility hint
+   */
+  accessibilityHint(e) {
+    return new g({ accessibilityHint: e });
+  }
+}, L = {
+  /**
+   * Add transition
+   */
+  transition(e = "all", r = 300, t = "ease", i = 0) {
+    return new y({
+      transition: { property: e, duration: r, easing: t, delay: i }
+    });
+  },
+  /**
+   * Add detailed transition
+   */
+  transitionDetailed(e) {
+    return new y({ transition: e });
+  },
+  /**
+   * Add animation
+   */
+  animation(e) {
+    return new y({ animation: e });
+  },
+  /**
+   * Add fade in animation
+   */
+  fadeIn(e = 300) {
+    return new y({
+      animation: {
+        keyframes: {
+          "0%": { opacity: "0" },
+          "100%": { opacity: "1" }
+        },
+        duration: e,
+        easing: "ease-out"
+      }
+    });
+  },
+  /**
+   * Add fade out animation
+   */
+  fadeOut(e = 300) {
+    return new y({
+      animation: {
+        keyframes: {
+          "0%": { opacity: "1" },
+          "100%": { opacity: "0" }
+        },
+        duration: e,
+        easing: "ease-in"
+      }
+    });
+  },
+  /**
+   * Add slide in animation
+   */
+  slideIn(e = "up", r = 300, t = 20) {
+    const i = {
+      up: [`translateY(${t}px)`, "translateY(0)"],
+      down: [`translateY(-${t}px)`, "translateY(0)"],
+      left: [`translateX(${t}px)`, "translateX(0)"],
+      right: [`translateX(-${t}px)`, "translateX(0)"]
+    }, [s, o] = i[e];
+    return new y({
+      animation: {
+        keyframes: {
+          "0%": { transform: s, opacity: "0" },
+          "100%": { transform: o, opacity: "1" }
+        },
+        duration: r,
+        easing: "ease-out"
+      }
+    });
+  },
+  /**
+   * Add scale animation
+   */
+  scaleAnimation(e = 0.8, r = 1, t = 300) {
+    return new y({
+      animation: {
+        keyframes: {
+          "0%": { transform: `scale(${e})`, opacity: "0" },
+          "100%": { transform: `scale(${r})`, opacity: "1" }
+        },
+        duration: t,
+        easing: "ease-out"
+      }
+    });
+  }
+}, W = {
+  /**
+   * Execute handler when component appears in viewport
+   */
+  onAppear(e) {
+    return new C({ onAppear: e });
+  },
+  /**
+   * Execute handler when component disappears from viewport
+   */
+  onDisappear(e) {
+    return new C({ onDisappear: e });
+  },
+  /**
+   * Execute async task with automatic cancellation on component unmount
+   */
+  task(e, r) {
+    return new C({
+      task: {
+        operation: e,
+        id: r?.id,
+        priority: r?.priority || "default"
+      }
+    });
+  },
+  /**
+   * Add pull-to-refresh functionality
+   */
+  refreshable(e, r) {
+    return new C({
+      refreshable: {
+        onRefresh: e,
+        isRefreshing: r
+      }
+    });
+  }
+}, Y = {
+  /**
+   * Card-like appearance
+   */
+  card(e = 16) {
+    return [
+      p.backgroundColor("#ffffff"),
+      p.cornerRadius(8),
+      // shadow moved to @tachui/modifiers/effects entry point
+      v.padding(e)
+    ];
+  },
+  /**
+   * Button-like appearance
+   */
+  button(e = "#007AFF", r = "#ffffff") {
+    return [
+      p.backgroundColor(e),
+      p.foregroundColor(r),
+      p.cornerRadius(6),
+      v.padding(12),
+      // Simplified to single value for now
+      A.onHover((t) => {
+      }),
+      L.transition("all", 150)
+    ];
+  },
+  /**
+   * Input field appearance
+   */
+  input() {
+    return [
+      p.border(1, "#d1d5db"),
+      p.cornerRadius(4),
+      v.padding(8),
+      L.transition("border-color", 150),
+      A.onFocus((e) => {
+      })
+    ];
+  },
+  /**
+   * Typography presets
+   */
+  typography: {
+    title: () => [
+      p.fontSize(24),
+      p.fontWeight("bold")
+    ],
+    heading: () => [
+      p.fontSize(20),
+      p.fontWeight("600")
+    ],
+    body: () => [
+      p.fontSize(16),
+      p.fontWeight("normal")
+    ],
+    caption: () => [
+      p.fontSize(12),
+      p.fontWeight("normal"),
+      p.opacity(0.7)
+    ]
+  }
+}, Z = {
+  ...v,
+  ...p,
+  ...A,
+  ...L,
+  ...W,
+  presets: Y
+};
+var I = Object.defineProperty, N = (e, r, t) => r in e ? I(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, _ = (e, r, t) => N(e, typeof r != "symbol" ? r + "" : r, t);
+const E = {
+  /**
+   * Check if a value is a reactive signal
+   */
+  isReactive(e) {
+    return b(e);
+  },
+  /**
+   * Resolve a potentially reactive value
+   */
+  resolveValue(e) {
+    return b(e) ? e() : e;
+  },
+  /**
+   * Create a reactive effect for a value
+   */
+  createReactiveEffect(e, r) {
+    if (b(e)) {
+      const t = w(() => {
+        const i = e();
+        r(i);
+      });
+      return () => t.dispose();
+    }
+    return null;
+  },
+  /**
+   * Merge modifier properties
+   */
+  mergeProperties(e, r) {
+    const t = { ...e };
+    for (const [i, s] of Object.entries(r))
+      s !== void 0 && (t[i] = s);
+    return t;
+  },
+  /**
+   * Convert a CSS property name to camelCase
+   */
+  toCamelCase(e) {
+    return e.replace(
+      /-([a-z])/g,
+      (r, t) => t.toUpperCase()
+    );
+  },
+  /**
+   * Convert a camelCase property to CSS kebab-case
+   */
+  toKebabCase(e) {
+    return e.replace(/([A-Z])/g, "-$1").toLowerCase();
+  },
+  /**
+   * Normalize a CSS value
+   */
+  normalizeCSSValue(e) {
+    return typeof e == "number" ? `${e}px` : typeof e == "string" ? e : String(e);
+  }
+};
+function l(e, r, t) {
+  class i extends F {
+    constructor() {
+      super(...arguments), _(this, "type", e), _(this, "priority", r);
+    }
+    apply(o, n) {
+      return t(o, n, this.properties);
+    }
+  }
+  return (s) => new i(s);
+}
+function x(e, r, t = 100) {
+  return l(e, t, (i, s, o) => {
+    if (s.element instanceof HTMLElement) {
+      const n = r(o);
+      Object.assign(s.element.style, n);
+    }
+    return i;
+  });
+}
+function G(e, r, t = 100) {
+  return () => l(e, t, (i, s) => (s.element instanceof HTMLElement && Object.assign(s.element.style, r), i))({});
+}
+function J(e, ...r) {
+  return console.warn("createComponentVariant is not yet implemented"), e;
+}
+function Q(e, r = "combined", t = 999) {
+  return l(r, t, (i, s, o) => {
+    let n = i;
+    for (const a of e) {
+      const f = a.apply(n, s);
+      f && typeof f == "object" && "type" in f && (n = f);
+    }
+    return n;
+  })({});
+}
+function ee(e, r) {
+  return l(
+    `conditional-${r.type}`,
+    r.priority,
+    (t, i, s) => {
+      if (E.resolveValue(e))
+        return r.apply(t, i);
+      if (b(e)) {
+        const n = w(() => {
+          const a = e();
+          i.element && a && r.apply(t, i);
+        });
+        if (!t.dispose)
+          t.dispose = () => n.dispose();
+        else {
+          const a = t.dispose;
+          t.dispose = () => {
+            n.dispose(), a();
+          };
+        }
+      }
+      return t;
+    }
+  )({});
+}
+function re(e, r) {
+  return l("state", 500, (t, i, s) => {
+    let o = t;
+    const n = (f) => {
+      const d = r[f] || [];
+      for (const M of d) {
+        const u = M.apply(o, i);
+        u && typeof u == "object" && "type" in u && (o = u);
+      }
+    };
+    n(e());
+    const a = w(() => {
+      const f = e();
+      n(f);
+    });
+    if (!t.dispose)
+      t.dispose = () => a.dispose();
+    else {
+      const f = t.dispose;
+      t.dispose = () => {
+        a.dispose(), f();
+      };
+    }
+    return o;
+  })({});
+}
+function te(e, r = []) {
+  return l("responsive", 100, (t, i, s) => {
+    let o = t;
+    const n = () => {
+      const d = window.innerWidth;
+      let M = r;
+      for (const [u, m] of Object.entries(e)) {
+        const R = parseInt(u);
+        d >= R && (M = m);
+      }
+      for (const u of M) {
+        const m = u.apply(o, i);
+        m && typeof m == "object" && "type" in m && (o = m);
+      }
+    };
+    n();
+    const a = () => n();
+    window.addEventListener("resize", a);
+    const f = () => window.removeEventListener("resize", a);
+    if (!t.dispose)
+      t.dispose = f;
+    else {
+      const d = t.dispose;
+      t.dispose = () => {
+        f(), d();
+      };
+    }
+    return o;
+  })({});
+}
+function ne(e) {
+  return l("class", 50, (r, t, i) => {
+    if (!t.element) return r;
+    const s = (o) => {
+      const n = Array.isArray(o) ? o : o.split(" ").filter(Boolean);
+      t.element instanceof HTMLElement && t.element.classList.add(...n);
+    };
+    if (b(e)) {
+      let o = [];
+      const n = w(() => {
+        const a = e(), f = Array.isArray(a) ? a : a.split(" ").filter(Boolean);
+        t.element instanceof HTMLElement && (t.element.classList.remove(...o), t.element.classList.add(...f), o = f);
+      });
+      if (!r.dispose)
+        r.dispose = () => n.dispose();
+      else {
+        const a = r.dispose;
+        r.dispose = () => {
+          n.dispose(), a();
+        };
+      }
+    } else
+      s(e);
+    return r;
+  })({});
+}
+function ie(e) {
+  return l("style", 200, (r, t, i) => {
+    if (!t.element) return r;
+    const s = (o) => {
+      if (t.element instanceof HTMLElement)
+        for (const [n, a] of Object.entries(o)) {
+          const f = E.toKebabCase(n), d = E.normalizeCSSValue(a);
+          t.element.style.setProperty(f, d);
+        }
+    };
+    if (b(e)) {
+      const o = w(() => {
+        const n = e();
+        s(n);
+      });
+      if (!r.dispose)
+        r.dispose = () => o.dispose();
+      else {
+        const n = r.dispose;
+        r.dispose = () => {
+          o.dispose(), n();
+        };
+      }
+    } else
+      s(e);
+    return r;
+  })({});
+}
+function oe(e) {
+  return l("event", 300, (r, t, i) => {
+    if (!t.element) return r;
+    const s = [];
+    for (const [n, a] of Object.entries(e))
+      t.element.addEventListener(n, a), s.push(() => {
+        t.element?.removeEventListener(n, a);
+      });
+    const o = () => s.forEach((n) => n());
+    if (!r.dispose)
+      r.dispose = o;
+    else {
+      const n = r.dispose;
+      r.dispose = () => {
+        o(), n();
+      };
+    }
+    return r;
+  })({});
+}
+export {
+  L as a,
+  p as b,
+  Z as c,
+  ne as d,
+  Q as e,
+  ee as f,
+  l as g,
+  x as h,
+  A as i,
+  oe as j,
+  ie as k,
+  v as l,
+  E as m,
+  W as n,
+  G as o,
+  Y as p,
+  J as q,
+  te as r,
+  re as s
+};