@als-tp/als-react-ts-ui 0.4.0 → 0.5.0

package/dist/als-react-ts-ui76.js

@@ -1,7 +1,132 @@
-const o = "_root_krv6e_1", t = {
-  root: o
-};
+import { jsx as m } from "react/jsx-runtime";
+import * as c from "react";
+import { clsx as l } from "./als-react-ts-ui56.js";
+import r from "./als-react-ts-ui201.js";
+import { MeterRoot as R } from "./als-react-ts-ui202.js";
+import { MeterLabel as w } from "./als-react-ts-ui203.js";
+import { MeterTrack as b } from "./als-react-ts-ui204.js";
+import { MeterIndicator as y } from "./als-react-ts-ui205.js";
+import { MeterValue as $ } from "./als-react-ts-ui206.js";
+const f = c.createContext(null), i = () => {
+  const e = c.useContext(f);
+  if (!e)
+    throw new Error(
+      "ALSMeter subcomponents must be used within ALSMeter.Root"
+    );
+  return e;
+}, k = c.forwardRef(
+  ({
+    value: e,
+    min: a = 0,
+    max: s = 100,
+    variant: t = "primary",
+    size: o = "md",
+    className: n,
+    style: u,
+    children: M,
+    locale: d,
+    format: p,
+    "aria-valuetext": L,
+    getAriaValueText: A,
+    ...S
+  }, x) => {
+    const N = c.useMemo(
+      () => ({ variant: t, size: o }),
+      [t, o]
+    );
+    return /* @__PURE__ */ m(f.Provider, { value: N, children: /* @__PURE__ */ m(
+      R,
+      {
+        ref: x,
+        value: e,
+        min: a,
+        max: s,
+        locale: d,
+        format: p,
+        "aria-valuetext": L,
+        getAriaValueText: A,
+        className: l(
+          r.root,
+          r[`root--${o}`],
+          r[`root--${t}`],
+          n
+        ),
+        style: u,
+        ...S,
+        children: M
+      }
+    ) });
+  }
+);
+k.displayName = "ALSMeter.Root";
+const v = c.forwardRef(({ className: e, style: a, children: s, ...t }, o) => {
+  const { size: n } = i();
+  return /* @__PURE__ */ m(
+    w,
+    {
+      ref: o,
+      className: l(r.label, r[`label--${n}`], e),
+      style: a,
+      ...t,
+      children: s
+    }
+  );
+});
+v.displayName = "ALSMeter.Label";
+const C = c.forwardRef(({ className: e, style: a, children: s, ...t }, o) => {
+  const { size: n, variant: u } = i();
+  return /* @__PURE__ */ m(
+    b,
+    {
+      ref: o,
+      className: l(
+        r.track,
+        r[`track--${n}`],
+        r[`track--${u}`],
+        e
+      ),
+      style: a,
+      ...t,
+      children: s
+    }
+  );
+});
+C.displayName = "ALSMeter.Track";
+const V = c.forwardRef(({ className: e, style: a, ...s }, t) => {
+  const { variant: o } = i();
+  return /* @__PURE__ */ m(
+    y,
+    {
+      ref: t,
+      className: l(
+        r.indicator,
+        r[`indicator--${o}`],
+        e
+      ),
+      style: a,
+      ...s
+    }
+  );
+});
+V.displayName = "ALSMeter.Indicator";
+const h = c.forwardRef(({ className: e, style: a, children: s, ...t }, o) => {
+  const { size: n } = i();
+  return /* @__PURE__ */ m(
+    $,
+    {
+      ref: o,
+      className: l(r.value, r[`value--${n}`], e),
+      style: a,
+      ...t,
+      children: s
+    }
+  );
+});
+h.displayName = "ALSMeter.Value";
 export {
-  t as default,
-  o as root
+  V as ALSMeterIndicator,
+  v as ALSMeterLabel,
+  k as ALSMeterRoot,
+  C as ALSMeterTrack,
+  h as ALSMeterValue
 };

package/dist/als-react-ts-ui77.js

@@ -1,7 +1,307 @@
-const o = "_root_qmqvr_1", t = {
-  root: o
-};
+import { jsx as e, jsxs as g } from "react/jsx-runtime";
+import * as s from "react";
+import { clsx as u } from "./als-react-ts-ui56.js";
+import r from "./als-react-ts-ui207.js";
+import { NavigationMenuRoot as f } from "./als-react-ts-ui208.js";
+import { NavigationMenuList as L } from "./als-react-ts-ui209.js";
+import { NavigationMenuItem as M } from "./als-react-ts-ui210.js";
+import { NavigationMenuTrigger as A } from "./als-react-ts-ui211.js";
+import { NavigationMenuIcon as S } from "./als-react-ts-ui212.js";
+import { NavigationMenuContent as w } from "./als-react-ts-ui213.js";
+import { NavigationMenuLink as C } from "./als-react-ts-ui214.js";
+import { NavigationMenuPositioner as h } from "./als-react-ts-ui215.js";
+import { NavigationMenuPopup as k } from "./als-react-ts-ui216.js";
+import { NavigationMenuViewport as R } from "./als-react-ts-ui217.js";
+import { NavigationMenuArrow as y } from "./als-react-ts-ui218.js";
+import { NavigationMenuBackdrop as x } from "./als-react-ts-ui219.js";
+import { NavigationMenuPortal as P } from "./als-react-ts-ui220.js";
+const d = s.createContext({
+  size: "md",
+  variant: "default",
+  orientation: "horizontal"
+}), c = () => s.useContext(d), I = s.forwardRef(
+  ({
+    orientation: a = "horizontal",
+    size: o = "md",
+    variant: n = "default",
+    className: i,
+    style: t,
+    children: N,
+    ...m
+  }, l) => {
+    const v = s.useMemo(
+      () => ({ size: o, variant: n, orientation: a }),
+      [o, n, a]
+    );
+    return /* @__PURE__ */ e(d.Provider, { value: v, children: /* @__PURE__ */ e(
+      f,
+      {
+        ref: l,
+        orientation: a,
+        className: u(
+          r.root,
+          r[`root--${o}`],
+          r[`root--${n}`],
+          i
+        ),
+        style: t,
+        ...m,
+        children: N
+      }
+    ) });
+  }
+);
+I.displayName = "ALSNavigationMenu.Root";
+const V = s.forwardRef(({ className: a, style: o, children: n, ...i }, t) => /* @__PURE__ */ e(
+  L,
+  {
+    ref: t,
+    className: u(r.list, a),
+    style: o,
+    ...i,
+    children: n
+  }
+));
+V.displayName = "ALSNavigationMenu.List";
+const H = s.forwardRef(({ className: a, style: o, children: n, ...i }, t) => /* @__PURE__ */ e(
+  M,
+  {
+    ref: t,
+    className: u(r.item, a),
+    style: o,
+    ...i,
+    children: n
+  }
+));
+H.displayName = "ALSNavigationMenu.Item";
+const $ = s.forwardRef(({ className: a, style: o, children: n, ...i }, t) => {
+  const { size: N, variant: m } = c();
+  return /* @__PURE__ */ e(
+    A,
+    {
+      ref: t,
+      className: u(
+        r.trigger,
+        r[`trigger--${N}`],
+        r[`trigger--${m}`],
+        a
+      ),
+      style: o,
+      ...i,
+      children: n
+    }
+  );
+});
+$.displayName = "ALSNavigationMenu.Trigger";
+const B = s.forwardRef(({ className: a, style: o, children: n, ...i }, t) => /* @__PURE__ */ e(
+  S,
+  {
+    ref: t,
+    className: u(r.icon, a),
+    style: o,
+    ...i,
+    children: n ?? /* @__PURE__ */ e(O, {})
+  }
+));
+B.displayName = "ALSNavigationMenu.Icon";
+const T = s.forwardRef(({ className: a, style: o, children: n, ...i }, t) => /* @__PURE__ */ e(
+  w,
+  {
+    ref: t,
+    className: u(r.content, a),
+    style: o,
+    ...i,
+    children: n
+  }
+));
+T.displayName = "ALSNavigationMenu.Content";
+const p = s.forwardRef(
+  ({
+    active: a = !1,
+    closeOnClick: o = !1,
+    className: n,
+    style: i,
+    children: t,
+    ...N
+  }, m) => {
+    const { size: l } = c();
+    return /* @__PURE__ */ e(
+      C,
+      {
+        ref: m,
+        active: a,
+        closeOnClick: o,
+        className: u(
+          r.link,
+          r[`link--${l}`],
+          n
+        ),
+        style: i,
+        render: /* @__PURE__ */ e("a", {}),
+        ...N,
+        children: t
+      }
+    );
+  }
+);
+p.displayName = "ALSNavigationMenu.Link";
+const z = ({ className: a, style: o, children: n, ...i }) => /* @__PURE__ */ e(P, { className: a, style: o, ...i, children: n });
+z.displayName = "ALSNavigationMenu.Portal";
+const Z = s.forwardRef(
+  ({
+    sideOffset: a = 10,
+    collisionPadding: o = { top: 5, bottom: 5, left: 20, right: 20 },
+    className: n,
+    style: i,
+    children: t,
+    ...N
+  }, m) => /* @__PURE__ */ e(
+    h,
+    {
+      ref: m,
+      sideOffset: a,
+      collisionPadding: o,
+      className: u(r.positioner, n),
+      style: i,
+      ...N,
+      children: t
+    }
+  )
+);
+Z.displayName = "ALSNavigationMenu.Positioner";
+const b = s.forwardRef(({ className: a, style: o, children: n, ...i }, t) => {
+  const { variant: N } = c();
+  return /* @__PURE__ */ e(
+    k,
+    {
+      ref: t,
+      className: u(
+        r.popup,
+        r[`popup--${N}`],
+        a
+      ),
+      style: o,
+      ...i,
+      children: n
+    }
+  );
+});
+b.displayName = "ALSNavigationMenu.Popup";
+const j = s.forwardRef(({ className: a, style: o, ...n }, i) => /* @__PURE__ */ e(
+  R,
+  {
+    ref: i,
+    className: u(r.viewport, a),
+    style: o,
+    ...n
+  }
+));
+j.displayName = "ALSNavigationMenu.Viewport";
+const D = s.forwardRef(({ className: a, style: o, children: n, ...i }, t) => /* @__PURE__ */ e(
+  y,
+  {
+    ref: t,
+    className: u(r.arrow, a),
+    style: o,
+    ...i,
+    children: n ?? /* @__PURE__ */ e(W, {})
+  }
+));
+D.displayName = "ALSNavigationMenu.Arrow";
+const F = s.forwardRef(({ className: a, style: o, ...n }, i) => /* @__PURE__ */ e(
+  x,
+  {
+    ref: i,
+    className: u(r.backdrop, a),
+    style: o,
+    ...n
+  }
+));
+F.displayName = "ALSNavigationMenu.Backdrop";
+function O(a) {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      width: "10",
+      height: "10",
+      viewBox: "0 0 10 10",
+      fill: "none",
+      "aria-hidden": "true",
+      ...a,
+      children: /* @__PURE__ */ e(
+        "path",
+        {
+          d: "M1 3.5L5 7.5L9 3.5",
+          stroke: "currentColor",
+          strokeWidth: "1.5"
+        }
+      )
+    }
+  );
+}
+function W(a) {
+  return /* @__PURE__ */ g(
+    "svg",
+    {
+      width: "20",
+      height: "10",
+      viewBox: "0 0 20 10",
+      fill: "none",
+      "aria-hidden": "true",
+      ...a,
+      children: [
+        /* @__PURE__ */ e(
+          "path",
+          {
+            d: "M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z",
+            className: r.arrowFill
+          }
+        ),
+        /* @__PURE__ */ e(
+          "path",
+          {
+            d: "M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z",
+            className: r.arrowOuterStroke
+          }
+        ),
+        /* @__PURE__ */ e(
+          "path",
+          {
+            d: "M10.3333 3.34539L5.47654 7.71648C4.55842 8.54279 3.36693 9 2.13172 9H0V8H2.13172C3.11989 8 4.07308 7.63423 4.80758 6.97318L9.66437 2.60207C10.0447 2.25979 10.622 2.2598 11.0023 2.60207L15.8591 6.97318C16.5936 7.63423 17.5468 8 18.5349 8H20V9H18.5349C17.2998 9 16.1083 8.54278 15.1901 7.71648L10.3333 3.34539Z",
+            className: r.arrowInnerStroke
+          }
+        )
+      ]
+    }
+  );
+}
+const q = s.forwardRef(({ title: a, description: o, className: n, children: i, ...t }, N) => /* @__PURE__ */ g(
+  p,
+  {
+    ref: N,
+    className: u(r.linkCard, n),
+    ...t,
+    children: [
+      /* @__PURE__ */ e("span", { className: r.linkCardTitle, children: a }),
+      o && /* @__PURE__ */ e("span", { className: r.linkCardDescription, children: o }),
+      i
+    ]
+  }
+));
+q.displayName = "ALSNavigationMenu.LinkCard";
 export {
-  t as default,
-  o as root
+  D as ALSNavigationMenuArrow,
+  F as ALSNavigationMenuBackdrop,
+  T as ALSNavigationMenuContent,
+  B as ALSNavigationMenuIcon,
+  H as ALSNavigationMenuItem,
+  p as ALSNavigationMenuLink,
+  q as ALSNavigationMenuLinkCard,
+  V as ALSNavigationMenuList,
+  b as ALSNavigationMenuPopup,
+  z as ALSNavigationMenuPortal,
+  Z as ALSNavigationMenuPositioner,
+  I as ALSNavigationMenuRoot,
+  $ as ALSNavigationMenuTrigger,
+  j as ALSNavigationMenuViewport
 };

package/dist/als-react-ts-ui78.js

@@ -1,7 +1,200 @@
-const o = "_root_1jbox_1", t = {
-  root: o
-};
+import { jsx as t } from "react/jsx-runtime";
+import d, { forwardRef as l } from "react";
+import { clsx as m } from "./als-react-ts-ui56.js";
+import e from "./als-react-ts-ui221.js";
+import { NumberFieldRoot as N } from "./als-react-ts-ui222.js";
+import { NumberFieldGroup as p } from "./als-react-ts-ui223.js";
+import { NumberFieldInput as L } from "./als-react-ts-ui224.js";
+import { NumberFieldIncrement as A } from "./als-react-ts-ui225.js";
+import { NumberFieldDecrement as F } from "./als-react-ts-ui226.js";
+import { NumberFieldScrubArea as S } from "./als-react-ts-ui227.js";
+import { NumberFieldScrubAreaCursor as h } from "./als-react-ts-ui228.js";
+const b = d.createContext({
+  size: "md",
+  variant: "outlined"
+}), c = () => d.useContext(b), f = l(
+  ({ size: r = "md", variant: o = "outlined", className: n, children: i, ...a }, u) => {
+    const s = d.useMemo(
+      () => ({ size: r, variant: o }),
+      [r, o]
+    );
+    return /* @__PURE__ */ t(b.Provider, { value: s, children: /* @__PURE__ */ t(
+      N,
+      {
+        ref: u,
+        className: m(
+          e.root,
+          e[`root--${r}`],
+          e[`root--${o}`],
+          n
+        ),
+        ...a,
+        children: i
+      }
+    ) });
+  }
+);
+f.displayName = "ALSNumberField.Root";
+const v = l(({ className: r, children: o, ...n }, i) => {
+  const { size: a, variant: u } = c();
+  return /* @__PURE__ */ t(
+    p,
+    {
+      ref: i,
+      className: m(
+        e.group,
+        e[`group--${a}`],
+        e[`group--${u}`],
+        r
+      ),
+      ...n,
+      children: o
+    }
+  );
+});
+v.displayName = "ALSNumberField.Group";
+const C = l(({ className: r, ...o }, n) => {
+  const { size: i, variant: a } = c();
+  return /* @__PURE__ */ t(
+    L,
+    {
+      ref: n,
+      className: m(
+        e.input,
+        e[`input--${i}`],
+        e[`input--${a}`],
+        r
+      ),
+      ...o
+    }
+  );
+});
+C.displayName = "ALSNumberField.Input";
+const x = l(
+  ({
+    className: r,
+    children: o,
+    "aria-label": n = "Increment",
+    ...i
+  }, a) => {
+    const { size: u, variant: s } = c();
+    return /* @__PURE__ */ t(
+      A,
+      {
+        ref: a,
+        className: m(
+          e.button,
+          e.increment,
+          e[`button--${u}`],
+          e[`button--${s}`],
+          r
+        ),
+        "aria-label": n,
+        ...i,
+        children: o ?? /* @__PURE__ */ t(
+          "svg",
+          {
+            className: e.icon,
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            "aria-hidden": "true",
+            children: /* @__PURE__ */ t("path", { d: "M12 5v14M5 12h14" })
+          }
+        )
+      }
+    );
+  }
+);
+x.displayName = "ALSNumberField.Increment";
+const $ = l(
+  ({
+    className: r,
+    children: o,
+    "aria-label": n = "Decrement",
+    ...i
+  }, a) => {
+    const { size: u, variant: s } = c();
+    return /* @__PURE__ */ t(
+      F,
+      {
+        ref: a,
+        className: m(
+          e.button,
+          e.decrement,
+          e[`button--${u}`],
+          e[`button--${s}`],
+          r
+        ),
+        "aria-label": n,
+        ...i,
+        children: o ?? /* @__PURE__ */ t(
+          "svg",
+          {
+            className: e.icon,
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            "aria-hidden": "true",
+            children: /* @__PURE__ */ t("path", { d: "M5 12h14" })
+          }
+        )
+      }
+    );
+  }
+);
+$.displayName = "ALSNumberField.Decrement";
+const k = l(
+  ({
+    className: r,
+    children: o,
+    direction: n = "horizontal",
+    pixelSensitivity: i = 2,
+    ...a
+  }, u) => /* @__PURE__ */ t(
+    S,
+    {
+      ref: u,
+      className: m(e.scrubArea, r),
+      direction: n,
+      pixelSensitivity: i,
+      ...a,
+      children: o
+    }
+  )
+);
+k.displayName = "ALSNumberField.ScrubArea";
+const y = l(({ className: r, children: o, ...n }, i) => /* @__PURE__ */ t(
+  h,
+  {
+    ref: i,
+    className: m(e.scrubAreaCursor, r),
+    ...n,
+    children: o ?? /* @__PURE__ */ t(
+      "svg",
+      {
+        className: e.scrubCursorIcon,
+        viewBox: "0 0 24 24",
+        fill: "currentColor",
+        "aria-hidden": "true",
+        children: /* @__PURE__ */ t("path", { d: "M9.293 12L5.146 7.854a.5.5 0 01.708-.708L10 11.293V5.5a.5.5 0 011 0v5.793l4.146-4.147a.5.5 0 01.708.708L11.707 12l4.147 4.146a.5.5 0 01-.708.708L11 12.707V18.5a.5.5 0 01-1 0v-5.793l-4.146 4.147a.5.5 0 01-.708-.708L9.293 12z" })
+      }
+    )
+  }
+));
+y.displayName = "ALSNumberField.ScrubAreaCursor";
 export {
-  t as default,
-  o as root
+  $ as ALSNumberFieldDecrement,
+  v as ALSNumberFieldGroup,
+  x as ALSNumberFieldIncrement,
+  C as ALSNumberFieldInput,
+  f as ALSNumberFieldRoot,
+  k as ALSNumberFieldScrubArea,
+  y as ALSNumberFieldScrubAreaCursor
 };

package/dist/als-react-ts-ui8.js

@@ -1,9 +1,8 @@
-import { jsx as o } from "react/jsx-runtime";
-import r from "./als-react-ts-ui62.js";
-function m(t) {
-  return /* @__PURE__ */ o("div", { className: r.root });
-}
+import { ALSCheckboxIndicator as o, ALSCheckboxRoot as t } from "./als-react-ts-ui62.js";
+const r = {
+  Root: t,
+  Indicator: o
+};
 export {
-  m as ALSCheckbox,
-  m as default
+  r as ALSCheckbox
 };