@tachui/core 0.8.23 → 0.8.25

package/dist/factories-Bz6LZlk6.js

@@ -0,0 +1,653 @@
+import { LayoutModifier as S, AppearanceModifier as F, AnimationModifier as y, LifecycleModifier as C, InteractionModifier as g, BaseModifier as z } from "./modifiers/base.js";
+import { ModifierPriority as v } from "@tachui/types/modifiers";
+import { globalModifierRegistry as j } from "@tachui/registry";
+import { c as w } from "./effect-DgNm6jk9.js";
+import { i as b } from "./signal-BRoiFOO7.js";
+v.LAYOUT;
+const O = (e) => new S({ alignment: e });
+function T(e) {
+  return O(e);
+}
+v.LAYOUT;
+const D = (e) => new S({ layoutPriority: e });
+function $(e) {
+  return D(e);
+}
+v.APPEARANCE;
+const H = (e) => new F({ opacity: e });
+function V(e) {
+  return H(e);
+}
+v.APPEARANCE;
+const W = (e) => new F({ cornerRadius: e });
+function Y(e) {
+  return W(e);
+}
+function u(e, ...r) {
+  const t = j.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 h = {
+  /**
+   * Set foreground (text) color
+   */
+  foregroundColor(e) {
+    return u("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 S({ frame: i });
+  },
+  /**
+   * Set padding on all sides
+   */
+  padding(e) {
+    return u("padding", e);
+  },
+  /**
+   * Set margin on all sides
+   */
+  margin(e) {
+    return u("margin", e);
+  },
+  /**
+   * Set content alignment
+   */
+  alignment(e) {
+    return T(e);
+  },
+  /**
+   * Set layout priority for ZStack container sizing and flexible layout
+   * Higher priority views determine container size in ZStack
+   */
+  layoutPriority(e) {
+    return $(e);
+  }
+}, p = {
+  /**
+   * Set foreground (text) color
+   */
+  foregroundColor(e) {
+    return u("foregroundColor", e);
+  },
+  /**
+   * Set background color
+   */
+  backgroundColor(e) {
+    return u("backgroundColor", e);
+  },
+  /**
+   * Set background (supports gradients)
+   */
+  background(e) {
+    return u("background", e);
+  },
+  /**
+   * Set font properties
+   */
+  font(e) {
+    return u("font", e);
+  },
+  /**
+   * Set font size
+   */
+  fontSize(e) {
+    return u("fontSize", e);
+  },
+  /**
+   * Set font weight
+   */
+  fontWeight(e) {
+    return u("fontWeight", e);
+  },
+  /**
+   * Set font family
+   */
+  fontFamily(e) {
+    return u("fontFamily", e);
+  },
+  /**
+   * Set opacity
+   */
+  opacity(e) {
+    return V(e);
+  },
+  /**
+   * Set corner radius (enhanced)
+   */
+  cornerRadius(e) {
+    return Y(e);
+  },
+  /**
+   * Set border
+   */
+  border(e, r = "#000000", t = "solid") {
+    return u("border", e, r, t);
+  },
+  /**
+   * Set detailed border properties
+   */
+  borderDetailed(e) {
+    return u("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"
+      }
+    });
+  }
+}, I = {
+  /**
+   * 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
+      }
+    });
+  }
+}, B = {
+  /**
+   * Card-like appearance
+   */
+  card(e = 16) {
+    return [
+      p.backgroundColor("#ffffff"),
+      p.cornerRadius(8),
+      // shadow moved to @tachui/modifiers/effects entry point
+      h.padding(e)
+    ];
+  },
+  /**
+   * Button-like appearance
+   */
+  button(e = "#007AFF", r = "#ffffff") {
+    return [
+      p.backgroundColor(e),
+      p.foregroundColor(r),
+      p.cornerRadius(6),
+      h.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),
+      h.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)
+    ]
+  }
+}, J = {
+  ...h,
+  ...p,
+  ...A,
+  ...L,
+  ...I,
+  presets: B
+};
+var N = Object.defineProperty, X = (e, r, t) => r in e ? N(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, E = (e, r, t) => X(e, typeof r != "symbol" ? r + "" : r, t);
+function R(e) {
+  return typeof HTMLElement < "u" && e instanceof HTMLElement;
+}
+function _(e) {
+  return typeof e == "object" && e !== null && "style" in e && !!e.style;
+}
+function U(e) {
+  return _(e) && typeof e.style.setProperty == "function";
+}
+const P = {
+  /**
+   * 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 c(e, r, t) {
+  class i extends z {
+    constructor() {
+      super(...arguments), E(this, "type", e), E(this, "priority", r);
+    }
+    apply(o, n) {
+      return t(o, n, this.properties);
+    }
+  }
+  return (s) => new i(s);
+}
+function Q(e, r, t = 100) {
+  return c(e, t, (i, s, o) => {
+    if (_(s.element)) {
+      const n = r(o);
+      Object.assign(s.element.style, n);
+    }
+    return i;
+  });
+}
+function ee(e, r, t = 100) {
+  return () => c(e, t, (i, s) => (_(s.element) && Object.assign(s.element.style, r), i))({});
+}
+function re(e, ...r) {
+  return console.warn("createComponentVariant is not yet implemented"), e;
+}
+function te(e, r = "combined", t = 999) {
+  return c(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 ne(e, r) {
+  return c(
+    `conditional-${r.type}`,
+    r.priority,
+    (t, i, s) => {
+      if (P.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 ie(e, r) {
+  return c("state", 500, (t, i, s) => {
+    let o = t;
+    const n = (f) => {
+      const d = r[f] || [];
+      for (const M of d) {
+        const l = M.apply(o, i);
+        l && typeof l == "object" && "type" in l && (o = l);
+      }
+    };
+    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 oe(e, r = []) {
+  return c("responsive", 100, (t, i, s) => {
+    let o = t;
+    const n = () => {
+      const d = window.innerWidth;
+      let M = r;
+      for (const [l, m] of Object.entries(e)) {
+        const k = parseInt(l);
+        d >= k && (M = m);
+      }
+      for (const l of M) {
+        const m = l.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 se(e) {
+  return c("class", 50, (r, t, i) => {
+    if (!t.element) return r;
+    const s = (o) => {
+      const n = Array.isArray(o) ? o : o.split(" ").filter(Boolean);
+      R(t.element) && 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);
+        R(t.element) && (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 ae(e) {
+  return c("style", 200, (r, t, i) => {
+    if (!t.element) return r;
+    const s = (o) => {
+      if (U(t.element))
+        for (const [n, a] of Object.entries(o)) {
+          const f = P.toKebabCase(n), d = P.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 fe(e) {
+  return c("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,
+  J as c,
+  se as d,
+  te as e,
+  ne as f,
+  c as g,
+  Q as h,
+  A as i,
+  fe as j,
+  ae as k,
+  h as l,
+  P as m,
+  I as n,
+  ee as o,
+  B as p,
+  re as q,
+  oe as r,
+  ie as s
+};