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

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

@@ -0,0 +1,196 @@
+import { jsx as s, jsxs as A } from "react/jsx-runtime";
+import * as i from "react";
+import { clsx as a } from "./als-react-ts-ui56.js";
+import r from "./als-react-ts-ui187.js";
+import { Form as C } from "./als-react-ts-ui188.js";
+import { FieldRoot as $ } from "./als-react-ts-ui179.js";
+import { FieldLabel as g } from "./als-react-ts-ui180.js";
+import { FieldControl as S } from "./als-react-ts-ui181.js";
+import { FieldDescription as v } from "./als-react-ts-ui182.js";
+import { FieldError as w } from "./als-react-ts-ui183.js";
+const N = i.createContext({
+  layout: "vertical",
+  size: "md"
+}), f = () => i.useContext(N), G = i.forwardRef(
+  function({
+    errors: o = {},
+    layout: e = "vertical",
+    size: n = "md",
+    className: c,
+    children: m,
+    ...l
+  }, d) {
+    const u = i.useMemo(
+      () => ({ layout: e, size: n }),
+      [e, n]
+    );
+    return /* @__PURE__ */ s(N.Provider, { value: u, children: /* @__PURE__ */ s(
+      C,
+      {
+        ref: d,
+        errors: o,
+        className: a(
+          r.root,
+          r[`layout-${e}`],
+          r[`size-${n}`],
+          c
+        ),
+        ...l,
+        children: m
+      }
+    ) });
+  }
+), M = i.forwardRef(
+  function({
+    name: o,
+    disabled: e = !1,
+    invalid: n,
+    validate: c,
+    validationMode: m = "onBlur",
+    validationDebounceTime: l = 0,
+    className: d,
+    children: u,
+    ...F
+  }, p) {
+    const { layout: L } = f();
+    return /* @__PURE__ */ s(
+      $,
+      {
+        ref: p,
+        name: o,
+        disabled: e,
+        invalid: n,
+        validate: c,
+        validationMode: m,
+        validationDebounceTime: l,
+        className: a(
+          r.field,
+          r[`field-${L}`],
+          d
+        ),
+        ...F,
+        children: u
+      }
+    );
+  }
+), P = i.forwardRef(function({ required: o = !1, className: e, children: n, ...c }, m) {
+  const { size: l } = f();
+  return /* @__PURE__ */ A(
+    g,
+    {
+      ref: m,
+      className: a(r.label, r[`label-${l}`], e),
+      ...c,
+      children: [
+        n,
+        o && /* @__PURE__ */ s("span", { className: r.required, "aria-hidden": "true", children: "*" })
+      ]
+    }
+  );
+}), V = i.forwardRef(function({ className: o, onValueChange: e, ...n }, c) {
+  const { size: m } = f();
+  return /* @__PURE__ */ s(
+    S,
+    {
+      ref: c,
+      onValueChange: e,
+      className: a(
+        r.control,
+        r[`control-${m}`],
+        o
+      ),
+      ...n
+    }
+  );
+}), k = ({
+  className: t,
+  cols: o,
+  rows: e,
+  placeholder: n,
+  disabled: c,
+  readOnly: m,
+  required: l,
+  maxLength: d,
+  minLength: u,
+  name: F,
+  defaultValue: p,
+  value: L,
+  autoComplete: x,
+  autoFocus: R
+}) => {
+  const { size: h } = f();
+  return /* @__PURE__ */ s(
+    S,
+    {
+      render: /* @__PURE__ */ s(
+        "textarea",
+        {
+          cols: o,
+          rows: e,
+          placeholder: n,
+          disabled: c,
+          readOnly: m,
+          required: l,
+          maxLength: d,
+          minLength: u,
+          name: F,
+          defaultValue: p,
+          value: L,
+          autoComplete: x,
+          autoFocus: R
+        }
+      ),
+      className: a(
+        r.textarea,
+        r[`textarea-${h}`],
+        t
+      )
+    }
+  );
+}, H = ({
+  match: t,
+  className: o,
+  children: e
+}) => /* @__PURE__ */ s(w, { match: t, className: a(r.error, o), children: e }), I = ({
+  className: t,
+  children: o
+}) => /* @__PURE__ */ s(v, { className: a(r.description, t), children: o }), J = ({
+  align: t = "right",
+  className: o,
+  children: e
+}) => /* @__PURE__ */ s(
+  "div",
+  {
+    className: a(
+      r.actions,
+      r[`actions-${t}`],
+      o
+    ),
+    children: e
+  }
+), K = ({
+  title: t,
+  description: o,
+  className: e,
+  children: n
+}) => /* @__PURE__ */ A("fieldset", { className: a(r.group, e), children: [
+  t && /* @__PURE__ */ s("legend", { className: r.groupTitle, children: t }),
+  o && /* @__PURE__ */ s("p", { className: r.groupDescription, children: o }),
+  /* @__PURE__ */ s("div", { className: r.groupContent, children: n })
+] }), O = ({
+  gap: t = "md",
+  className: o,
+  children: e
+}) => /* @__PURE__ */ s("div", { className: a(r.row, r[`row-gap-${t}`], o), children: e });
+export {
+  J as ALSFormActions,
+  V as ALSFormControl,
+  I as ALSFormDescription,
+  H as ALSFormError,
+  M as ALSFormField,
+  K as ALSFormGroup,
+  P as ALSFormLabel,
+  G as ALSFormRoot,
+  O as ALSFormRow,
+  k as ALSFormTextarea
+};

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

@@ -0,0 +1,15 @@
+const p = "_input_1ph0q_5", n = {
+  input: p,
+  "input--outlined": "_input--outlined_1ph0q_25",
+  "input--filled": "_input--filled_1ph0q_40",
+  "input--sm": "_input--sm_1ph0q_59",
+  "input--md": "_input--md_1ph0q_64",
+  "input--lg": "_input--lg_1ph0q_69",
+  "input--success": "_input--success_1ph0q_78",
+  "input--warning": "_input--warning_1ph0q_87",
+  "input--error": "_input--error_1ph0q_96"
+};
+export {
+  n as default,
+  p as input
+};

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

@@ -0,0 +1,13 @@
+import * as t from "react";
+import { jsx as n } from "react/jsx-runtime";
+import { FieldControl as p } from "./als-react-ts-ui181.js";
+const e = /* @__PURE__ */ t.forwardRef(function(o, r) {
+  return /* @__PURE__ */ n(p, {
+    ref: r,
+    ...o
+  });
+});
+process.env.NODE_ENV !== "production" && (e.displayName = "Input");
+export {
+  e as Input
+};

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

@@ -0,0 +1,309 @@
+import { jsxs as u, jsx as e } from "react/jsx-runtime";
+import * as c from "react";
+import { clsx as i } from "./als-react-ts-ui56.js";
+import o from "./als-react-ts-ui196.js";
+import { MenuTrigger as N } from "./als-react-ts-ui197.js";
+import { MenuItem as C } from "./als-react-ts-ui164.js";
+import { MenuPortal as d } from "./als-react-ts-ui174.js";
+import { MenuPositioner as p } from "./als-react-ts-ui161.js";
+import { MenuPopup as L } from "./als-react-ts-ui162.js";
+import { MenuSubmenuTrigger as I } from "./als-react-ts-ui172.js";
+import { MenuSubmenuRoot as g } from "./als-react-ts-ui173.js";
+import { MenuRadioItem as A } from "./als-react-ts-ui168.js";
+import { MenuRadioItemIndicator as b } from "./als-react-ts-ui169.js";
+import { MenuRadioGroup as R } from "./als-react-ts-ui167.js";
+import { MenuCheckboxItem as x } from "./als-react-ts-ui170.js";
+import { MenuCheckboxItemIndicator as w } from "./als-react-ts-ui171.js";
+import { MenuGroupLabel as k } from "./als-react-ts-ui166.js";
+import { MenuGroup as v } from "./als-react-ts-ui165.js";
+import { Separator as y } from "./als-react-ts-ui107.js";
+import { MenuArrow as T } from "./als-react-ts-ui163.js";
+import { MenuRoot as G } from "./als-react-ts-ui198.js";
+function P(r) {
+  return /* @__PURE__ */ e("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", ...r, children: /* @__PURE__ */ e(
+    "path",
+    {
+      d: "M1 3.5L5 7.5L9 3.5",
+      stroke: "currentColor",
+      strokeWidth: "1.5"
+    }
+  ) });
+}
+function H(r) {
+  return /* @__PURE__ */ e("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", ...r, children: /* @__PURE__ */ e(
+    "path",
+    {
+      d: "M3.5 9L7.5 5L3.5 1",
+      stroke: "currentColor",
+      strokeWidth: "1.5"
+    }
+  ) });
+}
+function h(r) {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      fill: "currentColor",
+      width: "12",
+      height: "12",
+      viewBox: "0 0 10 10",
+      ...r,
+      children: /* @__PURE__ */ e("path", { d: "M9.1603 1.12218C9.50684 1.34873 9.60427 1.81354 9.37792 2.16038L5.13603 8.66012C5.01614 8.8438 4.82192 8.96576 4.60451 8.99384C4.3871 9.02194 4.1683 8.95335 4.00574 8.80615L1.24664 6.30769C0.939709 6.02975 0.916013 5.55541 1.19372 5.24822C1.47142 4.94102 1.94536 4.91731 2.2523 5.19524L4.36085 7.10461L8.12299 1.33999C8.34934 0.993152 8.81376 0.895638 9.1603 1.12218Z" })
+    }
+  );
+}
+function B(r) {
+  return /* @__PURE__ */ u("svg", { width: "20", height: "10", viewBox: "0 0 20 10", fill: "none", ...r, 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: o.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: o.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: o.ArrowInnerStroke
+      }
+    )
+  ] });
+}
+const V = c.createContext({
+  size: "md"
+}), Z = ({
+  children: r,
+  open: n,
+  onOpenChange: t,
+  defaultOpen: a = !1,
+  modal: m = !0,
+  className: s
+}) => /* @__PURE__ */ e(V.Provider, { value: { size: "md" }, children: /* @__PURE__ */ e(
+  G,
+  {
+    open: n,
+    onOpenChange: t,
+    defaultOpen: a,
+    modal: m,
+    children: /* @__PURE__ */ e("div", { className: s, children: r })
+  }
+) });
+Z.displayName = "ALSMenu.Root";
+const $ = c.forwardRef(({ children: r, openOnHover: n = !1, className: t, ...a }, m) => /* @__PURE__ */ u(
+  N,
+  {
+    ref: m,
+    openOnHover: n,
+    className: i(o.Trigger, t),
+    ...a,
+    children: [
+      r,
+      /* @__PURE__ */ e(P, { className: o.TriggerIcon })
+    ]
+  }
+));
+$.displayName = "ALSMenu.Trigger";
+const j = ({
+  children: r,
+  sideOffset: n = 8,
+  alignOffset: t = 0,
+  side: a = "bottom",
+  align: m = "start",
+  showArrow: s = !0,
+  className: l
+}) => /* @__PURE__ */ e(d, { children: /* @__PURE__ */ e(
+  p,
+  {
+    className: o.Positioner,
+    sideOffset: n,
+    alignOffset: t,
+    side: a,
+    align: m,
+    children: /* @__PURE__ */ u(L, { className: i(o.Popup, l), children: [
+      s && /* @__PURE__ */ e(T, { className: o.Arrow, children: /* @__PURE__ */ e(B, {}) }),
+      r
+    ] })
+  }
+) });
+j.displayName = "ALSMenu.Content";
+const z = c.forwardRef(
+  ({
+    children: r,
+    disabled: n = !1,
+    variant: t = "default",
+    onClick: a,
+    icon: m,
+    shortcut: s,
+    size: l = "md",
+    className: M,
+    ...S
+  }, f) => /* @__PURE__ */ u(
+    C,
+    {
+      ref: f,
+      disabled: n,
+      onClick: a,
+      className: i(
+        o.Item,
+        o[`Item--${l}`],
+        t === "danger" && o["Item--danger"],
+        M
+      ),
+      ...S,
+      children: [
+        m && /* @__PURE__ */ e("span", { className: o.ItemIcon, children: m }),
+        /* @__PURE__ */ e("span", { className: o.ItemLabel, children: r }),
+        s && /* @__PURE__ */ e("span", { className: o.ItemShortcut, children: s })
+      ]
+    }
+  )
+);
+z.displayName = "ALSMenu.Item";
+const W = ({
+  className: r
+}) => /* @__PURE__ */ e(y, { className: i(o.Separator, r) });
+W.displayName = "ALSMenu.Separator";
+const D = ({
+  children: r,
+  className: n
+}) => /* @__PURE__ */ e(v, { className: n, children: r });
+D.displayName = "ALSMenu.Group";
+const F = ({
+  children: r,
+  className: n
+}) => /* @__PURE__ */ e(k, { className: i(o.GroupLabel, n), children: r });
+F.displayName = "ALSMenu.GroupLabel";
+const O = ({
+  children: r,
+  checked: n = !1,
+  onCheckedChange: t,
+  disabled: a = !1,
+  size: m = "md",
+  closeOnClick: s = !1,
+  className: l
+}) => /* @__PURE__ */ u(
+  x,
+  {
+    checked: n,
+    onCheckedChange: t,
+    disabled: a,
+    closeOnClick: s,
+    className: i(
+      o.CheckboxItem,
+      o[`Item--${m}`],
+      l
+    ),
+    children: [
+      /* @__PURE__ */ e(
+        w,
+        {
+          className: o.CheckboxItemIndicator,
+          children: /* @__PURE__ */ e(h, {})
+        }
+      ),
+      /* @__PURE__ */ e("span", { className: o.CheckboxItemText, children: r })
+    ]
+  }
+);
+O.displayName = "ALSMenu.CheckboxItem";
+const q = ({
+  children: r,
+  value: n,
+  onValueChange: t,
+  className: a
+}) => /* @__PURE__ */ e(
+  R,
+  {
+    value: n,
+    onValueChange: t,
+    className: a,
+    children: r
+  }
+);
+q.displayName = "ALSMenu.RadioGroup";
+const E = ({
+  children: r,
+  value: n,
+  disabled: t = !1,
+  size: a = "md",
+  className: m
+}) => /* @__PURE__ */ u(
+  A,
+  {
+    value: n,
+    disabled: t,
+    className: i(
+      o.RadioItem,
+      o[`Item--${a}`],
+      m
+    ),
+    children: [
+      /* @__PURE__ */ e(b, { className: o.RadioItemIndicator, children: /* @__PURE__ */ e(h, {}) }),
+      /* @__PURE__ */ e("span", { className: o.RadioItemText, children: r })
+    ]
+  }
+);
+E.displayName = "ALSMenu.RadioItem";
+const J = ({
+  children: r
+}) => /* @__PURE__ */ e(g, { children: r });
+J.displayName = "ALSMenu.SubmenuRoot";
+const K = ({
+  children: r,
+  disabled: n = !1,
+  size: t = "md",
+  className: a
+}) => /* @__PURE__ */ u(
+  I,
+  {
+    disabled: n,
+    className: i(
+      o.SubmenuTrigger,
+      o[`Item--${t}`],
+      a
+    ),
+    children: [
+      /* @__PURE__ */ e("span", { className: o.SubmenuTriggerLabel, children: r }),
+      /* @__PURE__ */ e(H, { className: o.SubmenuTriggerIcon })
+    ]
+  }
+);
+K.displayName = "ALSMenu.SubmenuTrigger";
+const Q = ({
+  children: r,
+  sideOffset: n = -4,
+  alignOffset: t = -4,
+  className: a
+}) => /* @__PURE__ */ e(d, { children: /* @__PURE__ */ e(
+  p,
+  {
+    className: o.Positioner,
+    sideOffset: n,
+    alignOffset: t,
+    children: /* @__PURE__ */ e(L, { className: i(o.Popup, a), children: r })
+  }
+) });
+Q.displayName = "ALSMenu.SubmenuContent";
+export {
+  O as ALSMenuCheckboxItem,
+  j as ALSMenuContent,
+  D as ALSMenuGroup,
+  F as ALSMenuGroupLabel,
+  z as ALSMenuItem,
+  q as ALSMenuRadioGroup,
+  E as ALSMenuRadioItem,
+  Z as ALSMenuRoot,
+  W as ALSMenuSeparator,
+  Q as ALSMenuSubmenuContent,
+  J as ALSMenuSubmenuRoot,
+  K as ALSMenuSubmenuTrigger,
+  $ as ALSMenuTrigger
+};

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

@@ -0,0 +1,39 @@
+import { jsx as b } 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-ui199.js";
+import { Menubar as p } from "./als-react-ts-ui200.js";
+const L = c.forwardRef(function({
+  children: m,
+  disabled: o = !1,
+  loopFocus: a = !0,
+  modal: t = !0,
+  orientation: e = "horizontal",
+  className: s,
+  style: n
+}, u) {
+  const f = l(
+    r.menubar,
+    r[`menubar--${e}`],
+    {
+      [r["menubar--disabled"]]: o
+    },
+    s
+  );
+  return /* @__PURE__ */ b(
+    p,
+    {
+      ref: u,
+      className: f,
+      style: n,
+      disabled: o,
+      loopFocus: a,
+      modal: t,
+      orientation: e,
+      children: m
+    }
+  );
+});
+export {
+  L as ALSMenubarRoot
+};

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

@@ -0,0 +1,132 @@
+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 {
+  V as ALSMeterIndicator,
+  v as ALSMeterLabel,
+  k as ALSMeterRoot,
+  C as ALSMeterTrack,
+  h as ALSMeterValue
+};