@new-black/lyra 0.0.9 → 0.0.11

package/dist/lyra49.js

@@ -1,68 +1,494 @@
-import * as s from "react";
-import { useContext as z, useRef as h, cloneElement as A, Children as F, isValidElement as K } from "react";
-import { useForceUpdate as b } from "./lyra105.js";
-import { useIsMounted as G } from "./lyra106.js";
-import { PresenceChild as g } from "./lyra107.js";
-import { LayoutGroupContext as N } from "./lyra108.js";
-import { useIsomorphicLayoutEffect as T } from "./lyra109.js";
-import { useUnmountEffect as U } from "./lyra110.js";
-import { invariant as V } from "./lyra111.js";
-const u = (o) => o.key || "";
-function $(o, c) {
-  o.forEach((i) => {
-    const f = u(i);
-    c.set(f, i);
+import { filterDOMProps as g, mergeProps as b, useObjectRef as F, mergeRefs as S, useLayoutEffect as B } from "./lyra37.js";
+import i, { forwardRef as $, useRef as v, useMemo as D, useContext as E, useEffect as G, useState as P, useCallback as y, createContext as f } from "react";
+import Q from "react-dom";
+import "./lyra91.js";
+import { useHover as I } from "./lyra40.js";
+import { useFocusRing as V, FocusableProvider as X } from "./lyra43.js";
+import { useButton as Y } from "./lyra67.js";
+import { useOverlayTriggerState as H } from "./lyra92.js";
+import { useOverlayTrigger as z, usePopover as J, Overlay as K, DismissButton as O, OverlayContainer as U, useOverlayPosition as W } from "./lyra69.js";
+import { useTextField as Z } from "./lyra75.js";
+import { useTooltipTriggerState as ee } from "./lyra93.js";
+import { useTooltipTrigger as te, useTooltip as ae } from "./lyra76.js";
+import { useDialog as re } from "./lyra68.js";
+import { useProgressBar as le } from "./lyra73.js";
+const oe = Symbol("callback"), w = Symbol("default");
+function C({ values: e, children: t }) {
+  for (let [a, r] of e)
+    t = /* @__PURE__ */ i.createElement(a.Provider, {
+      value: r
+    }, t);
+  return t;
+}
+function p(e) {
+  let { className: t, style: a, children: r, defaultClassName: l, defaultChildren: o, values: n } = e;
+  return D(() => {
+    let s, d, c;
+    return typeof t == "function" ? s = t(n) : s = t, typeof a == "function" ? d = a(n) : d = a, typeof r == "function" ? c = r(n) : r == null ? c = o : c = r, {
+      className: s ?? l,
+      style: d,
+      children: c
+    };
+  }, [
+    t,
+    a,
+    r,
+    l,
+    o,
+    n
+  ]);
+}
+function m(e, t, a) {
+  let r = E(a) || {};
+  if ("slots" in r && r.slots) {
+    if (!e.slot && !r.slots[w])
+      throw new Error("A slot prop is required");
+    let c = e.slot || w;
+    if (!r.slots[c])
+      throw new Error(`Invalid slot "${e.slot}". Valid slot names are ` + new Intl.ListFormat().format(Object.keys(r.slots).map((u) => `"${u}"`)) + ".");
+    r = r.slots[c];
+  }
+  let { ref: l, [oe]: o, ...n } = r, s = F(D(() => S(t, l), [
+    t,
+    l
+  ])), d = b(n, e);
+  return G(() => {
+    o && o(e);
+  }, [
+    o,
+    e
+  ]), [
+    d,
+    s
+  ];
+}
+function L() {
+  let [e, t] = P(!0), a = v(!1), r = y((l) => {
+    a.current = !0, t(!!l);
+  }, []);
+  return B(() => {
+    a.current || t(!1);
+  }, []), [
+    r,
+    e
+  ];
+}
+function M(e, t = !0) {
+  let [a, r] = P(!0);
+  return A(e, a && t, y(() => r(!1), [])), a && t;
+}
+function _(e, t) {
+  let [a, r] = P(!1), [l, o] = P("idle");
+  return !t && e.current && l === "idle" && (a = !0, r(!0), o("exiting")), !e.current && l === "exited" && o("idle"), A(e, a, y(() => {
+    o("exited"), r(!1);
+  }, [])), a;
+}
+function A(e, t, a) {
+  let r = v(null);
+  t && e.current && (r.current = window.getComputedStyle(e.current).animation), B(() => {
+    if (t && e.current) {
+      let l = window.getComputedStyle(e.current);
+      if (l.animationName !== "none" && l.animation !== r.current) {
+        let o = (s) => {
+          s.target === e.current && (n.removeEventListener("animationend", o), Q.flushSync(() => {
+            a();
+          }));
+        }, n = e.current;
+        return n.addEventListener("animationend", o), () => {
+          n.removeEventListener("animationend", o);
+        };
+      } else
+        a();
+    }
+  }, [
+    e,
+    t,
+    a
+  ]);
+}
+const se = /* @__PURE__ */ f(!1), ne = /* @__PURE__ */ f({}), ie = /* @__PURE__ */ new Set([
+  "form",
+  "formAction",
+  "formEncType",
+  "formMethod",
+  "formNoValidate",
+  "formTarget",
+  "name",
+  "value"
+]), T = /* @__PURE__ */ f({});
+function ce(e, t) {
+  [e, t] = m(e, t, T);
+  let a = e, { buttonProps: r, isPressed: l } = Y(e, t), { focusProps: o, isFocused: n, isFocusVisible: s } = V(e), { hoverProps: d, isHovered: c } = I(e), u = p({
+    ...e,
+    values: {
+      isHovered: c,
+      isPressed: l,
+      isFocused: n,
+      isFocusVisible: s,
+      isDisabled: e.isDisabled || !1
+    },
+    defaultClassName: "react-aria-Button"
+  });
+  return /* @__PURE__ */ i.createElement("button", {
+    ...g(e, {
+      propNames: ie
+    }),
+    ...b(r, o, d),
+    ...u,
+    ref: t,
+    slot: e.slot,
+    "data-pressed": a.isPressed || l || void 0,
+    "data-hovered": c || void 0,
+    "data-focus-visible": s || void 0
+  });
+}
+const Me = /* @__PURE__ */ $(ce), de = /* @__PURE__ */ f({}), h = /* @__PURE__ */ f({});
+function fe(e, t) {
+  [e, t] = m(e, t, h);
+  let { elementType: a = "label", ...r } = e;
+  return /* @__PURE__ */ i.createElement(a, {
+    className: "react-aria-Label",
+    ...r,
+    ref: t
   });
 }
-function q(o) {
-  const c = [];
-  return F.forEach(o, (i) => {
-    K(i) && c.push(i);
-  }), c;
-}
-const S = ({ children: o, custom: c, initial: i = !0, onExitComplete: f, exitBeforeEnter: P, presenceAffectsLayout: E = !0, mode: a = "sync" }) => {
-  V(!P, "Replace exitBeforeEnter with mode='wait'");
-  const I = z(N).forceRender || b()[0], R = G(), m = q(o);
-  let n = m;
-  const r = h(/* @__PURE__ */ new Map()).current, l = h(n), d = h(/* @__PURE__ */ new Map()).current, x = h(!0);
-  if (T(() => {
-    x.current = !1, $(m, d), l.current = n;
-  }), U(() => {
-    x.current = !0, d.clear(), r.clear();
-  }), x.current)
-    return s.createElement(s.Fragment, null, n.map((e) => s.createElement(g, { key: u(e), isPresent: !0, initial: i ? void 0 : !1, presenceAffectsLayout: E, mode: a }, e)));
-  n = [...n];
-  const y = l.current.map(u), w = m.map(u), v = y.length;
-  for (let e = 0; e < v; e++) {
-    const t = y[e];
-    w.indexOf(t) === -1 && !r.has(t) && r.set(t, void 0);
+const _e = /* @__PURE__ */ $(fe), k = /* @__PURE__ */ f({});
+function ue(e, t) {
+  [e, t] = m(e, t, k);
+  let { hoverProps: a, isHovered: r } = I({}), { isFocused: l, isFocusVisible: o, focusProps: n } = V({
+    isTextInput: !0,
+    autoFocus: e.autoFocus
+  }), s = p({
+    ...e,
+    values: {
+      isHovered: r,
+      isFocused: l,
+      isFocusVisible: o,
+      isDisabled: e.disabled || !1
+    },
+    defaultClassName: "react-aria-Input"
+  });
+  return /* @__PURE__ */ i.createElement("input", {
+    ...b(e, n, a),
+    ...s,
+    ref: t,
+    "data-hovered": r || void 0,
+    "data-focus-visible": o || void 0
+  });
+}
+const Ae = /* @__PURE__ */ $(ue), R = /* @__PURE__ */ f(null);
+function $e(e, t) {
+  let { arrowProps: a, placement: r } = E(R), l = {
+    ...a.style,
+    position: "absolute",
+    [r]: "100%",
+    transform: r === "top" || r === "bottom" ? "translateX(-50%)" : "translateY(-50%)"
+  }, o = p({
+    ...e,
+    defaultClassName: "react-aria-OverlayArrow",
+    values: {
+      placement: r
+    }
+  });
+  return /* @__PURE__ */ i.createElement("div", {
+    ...b(a, e),
+    ...o,
+    style: {
+      ...o.style,
+      ...l
+    },
+    ref: t,
+    "data-placement": r
+  });
+}
+const ke = /* @__PURE__ */ $($e), j = /* @__PURE__ */ f(null);
+function be(e, t) {
+  [e, t] = m(e, t, j);
+  let a = e, r = H(e), l = e.isOpen != null || e.defaultOpen != null || !(a != null && a.state) ? r : a.state, o = _(t, l.isOpen);
+  if (l && !l.isOpen && !o) {
+    let n = e.children;
+    return typeof n == "function" && (n = n({
+      placement: "bottom",
+      isEntering: !1,
+      isExiting: !1
+    })), a.preserveChildren ? /* @__PURE__ */ i.createElement(se.Provider, {
+      value: !0
+    }, n) : null;
   }
-  return a === "wait" && r.size && (n = []), r.forEach((e, t) => {
-    if (w.indexOf(t) !== -1)
-      return;
-    const C = d.get(t);
-    if (!C)
-      return;
-    const k = y.indexOf(t);
-    let p = e;
-    if (!p) {
-      const L = () => {
-        d.delete(t), r.delete(t);
-        const M = l.current.findIndex((O) => O.key === t);
-        if (l.current.splice(M, 1), !r.size) {
-          if (l.current = m, R.current === !1)
-            return;
-          I(), f && f();
+  return /* @__PURE__ */ i.createElement(me, {
+    ...e,
+    triggerRef: a.triggerRef,
+    state: l,
+    popoverRef: t,
+    isExiting: o
+  });
+}
+const je = /* @__PURE__ */ $(be);
+function me({ state: e, isExiting: t, ...a }) {
+  var r;
+  let { popoverProps: l, underlayProps: o, arrowProps: n, placement: s } = J({
+    ...a,
+    offset: (r = a.offset) !== null && r !== void 0 ? r : 8
+  }, e), d = a.popoverRef, c = M(d, !!s), u = p({
+    ...a,
+    defaultClassName: "react-aria-Popover",
+    values: {
+      placement: s,
+      isEntering: c,
+      isExiting: t
+    }
+  }), x = {
+    ...u.style,
+    ...l.style
+  };
+  return /* @__PURE__ */ i.createElement(K, null, !a.isNonModal && /* @__PURE__ */ i.createElement("div", {
+    ...o,
+    style: {
+      position: "fixed",
+      inset: 0
+    }
+  }), /* @__PURE__ */ i.createElement("div", {
+    ...b(g(a), l),
+    ...u,
+    ref: d,
+    slot: a.slot,
+    style: x,
+    "data-placement": s,
+    "data-entering": c || void 0,
+    "data-exiting": t || void 0
+  }, !a.isNonModal && /* @__PURE__ */ i.createElement(O, {
+    onDismiss: e.close
+  }), /* @__PURE__ */ i.createElement(R.Provider, {
+    value: {
+      arrowProps: n,
+      placement: s
+    }
+  }, u.children), /* @__PURE__ */ i.createElement(O, {
+    onDismiss: e.close
+  })));
+}
+const ve = /* @__PURE__ */ f(null), q = /* @__PURE__ */ f(null);
+function qe(e) {
+  let t = H(e), a = v(null), { triggerProps: r, overlayProps: l } = z({
+    type: "dialog"
+  }, t, a);
+  return /* @__PURE__ */ i.createElement(C, {
+    values: [
+      [
+        ve,
+        {
+          state: t
+        }
+      ],
+      [
+        q,
+        {
+          ...l,
+          onClose: t.close
+        }
+      ],
+      [
+        T,
+        {
+          ...r,
+          isPressed: t.isOpen,
+          ref: a
+        }
+      ],
+      [
+        j,
+        {
+          state: t,
+          triggerRef: a
+        }
+      ]
+    ]
+  }, e.children);
+}
+function pe(e, t) {
+  [e, t] = m(e, t, q);
+  let { dialogProps: a, titleProps: r } = re(e, t), l = e.children;
+  typeof l == "function" && (l = l({
+    close: e.onClose || (() => {
+    })
+  }));
+  var o;
+  return /* @__PURE__ */ i.createElement("section", {
+    ...g(e),
+    ...a,
+    ref: t,
+    slot: e.slot,
+    style: e.style,
+    className: (o = e.className) !== null && o !== void 0 ? o : "react-aria-Dialog"
+  }, /* @__PURE__ */ i.createElement(C, {
+    values: [
+      [
+        T,
+        void 0
+      ],
+      // TODO: clear context within dialog content?
+      [
+        ne,
+        {
+          ...r,
+          level: 2
         }
-      };
-      p = s.createElement(g, { key: u(C), isPresent: !1, onExitComplete: L, custom: c, presenceAffectsLayout: E, mode: a }, C), r.set(t, p);
+      ]
+    ]
+  }, l));
+}
+const Ge = /* @__PURE__ */ $(pe), xe = /* @__PURE__ */ f(null);
+function Pe(e, t) {
+  [e, t] = m(e, t, xe);
+  let { value: a = 0, minValue: r = 0, maxValue: l = 100, isIndeterminate: o = !1 } = e, [n, s] = L(), { progressBarProps: d, labelProps: c } = le({
+    ...e,
+    label: s
+  }), u = o ? void 0 : (a - r) / (l - r) * 100, x = p({
+    ...e,
+    defaultClassName: "react-aria-ProgressBar",
+    values: {
+      percentage: u,
+      valueText: d["aria-valuetext"],
+      isIndeterminate: o
     }
-    n.splice(k, 0, p);
-  }), n = n.map((e) => {
-    const t = e.key;
-    return r.has(t) ? e : s.createElement(g, { key: u(e), isPresent: !0, presenceAffectsLayout: E, mode: a }, e);
-  }), process.env.NODE_ENV !== "production" && a === "wait" && n.length > 1 && console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to "wait". This will lead to odd visual behaviour.`), s.createElement(s.Fragment, null, r.size ? n : n.map((e) => A(e)));
-};
+  });
+  return /* @__PURE__ */ i.createElement("div", {
+    ...d,
+    ...x,
+    ref: t,
+    slot: e.slot
+  }, /* @__PURE__ */ i.createElement(h.Provider, {
+    value: {
+      ...c,
+      ref: n,
+      elementType: "span"
+    }
+  }, x.children));
+}
+const Qe = /* @__PURE__ */ $(Pe), ge = /* @__PURE__ */ f(null);
+function Ee(e, t) {
+  [e, t] = m(e, t, ge);
+  let a = v(null), [r, l] = L(), { labelProps: o, inputProps: n, descriptionProps: s, errorMessageProps: d } = Z({
+    ...e,
+    label: l
+  }, a);
+  var c;
+  return /* @__PURE__ */ i.createElement("div", {
+    ...g(e),
+    ref: t,
+    slot: e.slot,
+    className: (c = e.className) !== null && c !== void 0 ? c : "react-aria-TextField",
+    style: e.style
+  }, /* @__PURE__ */ i.createElement(C, {
+    values: [
+      [
+        h,
+        {
+          ...o,
+          ref: r
+        }
+      ],
+      [
+        k,
+        {
+          ...n,
+          ref: a
+        }
+      ],
+      [
+        de,
+        {
+          slots: {
+            description: s,
+            errorMessage: d
+          }
+        }
+      ]
+    ]
+  }, e.children));
+}
+const Xe = /* @__PURE__ */ $(Ee), N = /* @__PURE__ */ f(null);
+function Ye(e) {
+  let t = ee(e), a = v(null), { triggerProps: r, tooltipProps: l } = te(e, t, a);
+  return /* @__PURE__ */ i.createElement(N.Provider, {
+    value: {
+      state: t,
+      triggerRef: a,
+      tooltipProps: l
+    }
+  }, /* @__PURE__ */ i.createElement(X, {
+    ...r,
+    ref: a
+  }, e.children));
+}
+function ye(e, t) {
+  let { state: a } = E(N), r = F(t), l = _(r, a.isOpen);
+  return !a.isOpen && !l ? null : /* @__PURE__ */ i.createElement(U, null, /* @__PURE__ */ i.createElement(Ce, {
+    ...e,
+    tooltipRef: r,
+    isExiting: l
+  }));
+}
+const ze = /* @__PURE__ */ $(ye);
+function Ce(e) {
+  let { state: t, triggerRef: a, tooltipProps: r } = E(N), l = v(null), { overlayProps: o, arrowProps: n, placement: s } = W({
+    placement: e.placement || "top",
+    targetRef: a,
+    overlayRef: l,
+    offset: e.offset,
+    crossOffset: e.crossOffset,
+    isOpen: t.isOpen
+  }), d = M(l, !!s), c = p({
+    ...e,
+    defaultClassName: "react-aria-Tooltip",
+    values: {
+      placement: s,
+      isEntering: d,
+      isExiting: e.isExiting
+    }
+  });
+  e = b(e, o);
+  let { tooltipProps: u } = ae(e, t);
+  return /* @__PURE__ */ i.createElement("div", {
+    ...b(r, u),
+    ref: S(l, e.tooltipRef),
+    ...c,
+    style: {
+      ...c.style,
+      ...o.style
+    },
+    "data-placement": s,
+    "data-entering": d || void 0,
+    "data-exiting": e.isExiting || void 0
+  }, /* @__PURE__ */ i.createElement(R.Provider, {
+    value: {
+      arrowProps: n,
+      placement: s
+    }
+  }, c.children));
+}
 export {
-  S as AnimatePresence
+  Me as Button,
+  T as ButtonContext,
+  Ge as Dialog,
+  q as DialogContext,
+  qe as DialogTrigger,
+  ne as HeadingContext,
+  Ae as Input,
+  k as InputContext,
+  _e as Label,
+  h as LabelContext,
+  ve as ModalContext,
+  ke as OverlayArrow,
+  je as Popover,
+  j as PopoverContext,
+  Qe as ProgressBar,
+  xe as ProgressBarContext,
+  C as Provider,
+  de as TextContext,
+  Xe as TextField,
+  ge as TextFieldContext,
+  ze as Tooltip,
+  Ye as TooltipTrigger,
+  m as useContextProps
 };

package/dist/lyra5.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./lyra32.cjs");require("./lyra33.cjs");const o=e.cva(["inline-flex","items-center","justify-center","h-[--badge-height]","px-[--badge-padding-x]","rounded-[--badge-radius]","text-[length:--badge-font-size]","leading-[--badge-line-height]","font-[--badge-font-weight]","inline-block","uppercase","tracking-[--badge-letter-spacing]"],{variants:{color:{primary:["[--badge-main-color:var(--badge-color-primary)]","[--badge-contrast-color:var(--badge-color-primary-foreground)]"],monochrome:["[--badge-main-color:var(--badge-color-monochrome)]","[--badge-contrast-color:var(--badge-color-monochrome-foreground)]"],success:["[--badge-main-color:var(--badge-color-success)]","[--badge-contrast-color:var(--badge-color-success-foreground)]"],warning:["[--badge-main-color:var(--badge-color-warning)]","[--badge-contrast-color:var(--badge-color-warning-foreground)]"],danger:["[--badge-main-color:var(--badge-color-danger)]","[--badge-contrast-color:var(--badge-color-danger-foreground)]"]},variant:{solid:["bg-[--badge-main-color]","text-[--badge-contrast-color]"],outline:["border","border-solid","border-[--badge-main-color]","text-[--badge-main-color]","bg-transparent"],dot:["relative","text-[--badge-main-color]","ps-2.5","bg-transparent","before:content-['']","before:absolute","before:bg-[--badge-main-color]","before:w-[--badge-dot-size]","before:h-[--badge-dot-size]","before:rounded-full","before:top-1/2","before:start-0","before:translate-y-[-50%]"]}},defaultVariants:{color:"primary",variant:"solid"}});exports.badgeStyles=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./lyra35.cjs");require("./lyra47.cjs");const o=t.cva(["rounded-base"],{variants:{isFocusVisible:{true:["ring-2","ring-primary-1","z-10"],false:["border-b last:border-b-0 border-solid border-[--accordion-divider-color]"]}}}),e=t.cva(["flex","items-center","justify-between","gap-4","rounded-base","w-full","outline-none","px-[--accordion-title-padding-x]","py-[--accordion-title-padding-y]","text-[length:var(--accordion-title-font-size)]","font-[--accordion-title-font-weight]","outline-none"],{variants:{isOpen:{true:["text-[--accordion-title-is-open-color]"],false:["text-[--accordion-title-color]"]},isDisabled:{true:["text-[--accordion-title-is-disabled-color]","cursor-not-allowed"]}}}),n=t.cva(["text-[length:var(--accordion-content-font-size)]","font-[--accordion-content-font-weight]","text-[--accordion-content-color]"],{variants:{disableAccordionContentPadding:{true:["p-0"],false:["px-[--accordion-content-padding-x]","py-[--accordion-content-padding-y]"]}},defaultVariants:{disableAccordionContentPadding:!1}});exports.accordionItemButtonStyles=e;exports.accordionItemContentStyles=n;exports.accordionItemStyles=o;