@alif-ui-test/core 1.11.0

package/dist/components/Sidebar/SidebarControlButton/SidebarControlButton.js

@@ -0,0 +1,16 @@
+import { jsx as o } from "react/jsx-runtime";
+import t from "./SidebarControlButton.module.css.js";
+import { useSidebarContext as s } from "../Sidebar.context.js";
+import { OutlineSystemSidebar as i } from "../../../icons/components/OutlineSystemSidebar.js";
+import { SolidSystemSidebar as l } from "../../../icons/components/SolidSystemSidebar.js";
+import { classNames as a } from "../../../utils/class-names.js";
+const C = () => {
+  const { handleToggleHover: r, hoverEnabled: e, isCompact: m } = s(), n = a(
+    t.controlButton,
+    m && t.controlButtonCompact
+  );
+  return /* @__PURE__ */ o("div", { onClick: r, className: n, children: e ? /* @__PURE__ */ o(i, {}) : /* @__PURE__ */ o(l, {}) });
+};
+export {
+  C as SidebarControlButton
+};

package/dist/components/Sidebar/SidebarControlButton/SidebarControlButton.module.css.js

@@ -0,0 +1,9 @@
+const t = "_controlButton_lz80a_1", o = "_controlButtonCompact_lz80a_11", n = {
+  controlButton: t,
+  controlButtonCompact: o
+};
+export {
+  t as controlButton,
+  o as controlButtonCompact,
+  n as default
+};

package/dist/components/Sidebar/SidebarElement/SidebarElement.js

@@ -0,0 +1,10 @@
+import { jsx as t } from "react/jsx-runtime";
+import r from "./SidebarElement.module.css.js";
+import { useSidebarContext as s } from "../Sidebar.context.js";
+const l = ({ children: o, icon: m }) => {
+  const { isCompact: e } = s();
+  return /* @__PURE__ */ t("div", { className: e ? r.element : r.default, children: e ? /* @__PURE__ */ t("span", { children: m }) : o });
+};
+export {
+  l as SidebarElement
+};

package/dist/components/Sidebar/SidebarElement/SidebarElement.module.css.js

@@ -0,0 +1,8 @@
+const e = "_element_nvqb0_1", t = {
+  element: e,
+  default: "_default_nvqb0_11"
+};
+export {
+  t as default,
+  e as element
+};

package/dist/components/Sidebar/SidebarHeader/SidebarHeader.js

@@ -0,0 +1,17 @@
+import { jsxs as o, jsx as s } from "react/jsx-runtime";
+import a from "./SidebarHeader.module.css.js";
+import { useSidebarContext as m } from "../Sidebar.context.js";
+import { SidebarControlButton as n } from "../SidebarControlButton/SidebarControlButton.js";
+const f = ({ children: t, logo: r }) => {
+  const { isCompact: e, showControlButton: i } = m();
+  return /* @__PURE__ */ o("div", { className: a.header, children: [
+    /* @__PURE__ */ o("div", { className: a.logo, children: [
+      r && /* @__PURE__ */ s("span", { children: e ? r.compact : r.default }),
+      i && (!e || !r) && /* @__PURE__ */ s(n, {})
+    ] }),
+    t && t
+  ] });
+};
+export {
+  f as SidebarHeader
+};

package/dist/components/Sidebar/SidebarHeader/SidebarHeader.module.css.js

@@ -0,0 +1,9 @@
+const o = "_header_zjs79_1", e = "_logo_zjs79_21", s = {
+  header: o,
+  logo: e
+};
+export {
+  s as default,
+  o as header,
+  e as logo
+};

package/dist/components/Sidebar/SidebarItem/SidebarItem.js

@@ -0,0 +1,36 @@
+import { jsxs as l, jsx as o } from "react/jsx-runtime";
+import s from "./SidebarItem.module.css.js";
+import { useSidebarContext as C } from "../Sidebar.context.js";
+import { classNames as m } from "../../../utils/class-names.js";
+const x = ({
+  children: t,
+  icon: e,
+  isCollapseParent: c,
+  count: n,
+  path: r,
+  active: d,
+  onClick: i
+}) => {
+  const { isCompact: a } = C(), p = m(
+    s.navigationButton,
+    c && s.collapse,
+    a && s.compact,
+    d && s.active
+  ), h = m(
+    s.badge,
+    a && !c && s.badgePosition
+  );
+  return /* @__PURE__ */ l("div", { className: p, onClick: () => {
+    i && i(r);
+  }, children: [
+    /* @__PURE__ */ l("div", { className: s.content, children: [
+      e && /* @__PURE__ */ o("span", { className: s.icon, children: e }),
+      !e && a && /* @__PURE__ */ o("span", { className: s.icon, children: t.slice(0, 2).toLocaleUpperCase() }),
+      !a && t
+    ] }),
+    !!n && /* @__PURE__ */ o("span", { className: h, children: n })
+  ] });
+};
+export {
+  x as SidebarItem
+};

package/dist/components/Sidebar/SidebarItem/SidebarItem.module.css.js

@@ -0,0 +1,21 @@
+const o = "_navigationButton_s33zo_1", t = "_icon_s33zo_23", n = "_content_s33zo_34", c = "_collapse_s33zo_41", s = "_compact_s33zo_47", _ = "_badge_s33zo_54", a = "_badgePosition_s33zo_71", e = "_active_s33zo_77", i = {
+  navigationButton: o,
+  icon: t,
+  content: n,
+  collapse: c,
+  compact: s,
+  badge: _,
+  badgePosition: a,
+  active: e
+};
+export {
+  e as active,
+  _ as badge,
+  a as badgePosition,
+  c as collapse,
+  s as compact,
+  n as content,
+  i as default,
+  t as icon,
+  o as navigationButton
+};

package/dist/components/Sidebar/SidebarItems/SidebarItems.js

@@ -0,0 +1,25 @@
+import { jsx as o, jsxs as p } from "react/jsx-runtime";
+import { Children as c, isValidElement as l, Fragment as d, cloneElement as u } from "react";
+import { useSidebarContext as v } from "../Sidebar.context.js";
+import { Divider as f } from "../../Divider/Divider.js";
+const j = ({ children: e }) => {
+  const { isCompact: s, variant: i } = v(), n = c.toArray(e);
+  return /* @__PURE__ */ o("div", { children: n.map((r, t) => {
+    const a = l(r) && r.props.collapseVariant === "group", m = t > 0 && a && s;
+    return /* @__PURE__ */ p(d, { children: [
+      m && /* @__PURE__ */ o(
+        f,
+        {
+          variant: i !== "default" ? "contrast" : "secondary",
+          size: "s"
+        }
+      ),
+      /* @__PURE__ */ o("div", { children: u(r, {
+        index: t
+      }) })
+    ] }, t);
+  }) });
+};
+export {
+  j as SidebarItems
+};

package/dist/components/Skeleton/Skeleton.js

@@ -0,0 +1,23 @@
+import { jsx as a } from "react/jsx-runtime";
+import i from "./Skeleton.module.css.js";
+import { getSkeletonStyles as p } from "./Skeleton.utils.js";
+import { classNames as c } from "../../utils/class-names.js";
+const g = ({
+  className: o,
+  style: t,
+  type: e = "rectangle",
+  height: r = "100%",
+  width: s = "100%",
+  radius: m,
+  ...l
+}) => /* @__PURE__ */ a(
+  "div",
+  {
+    className: c(i.root, o),
+    style: p(e, r, s, m, t),
+    ...l
+  }
+);
+export {
+  g as Skeleton
+};

package/dist/components/Skeleton/Skeleton.module.css.js

@@ -0,0 +1,7 @@
+const o = "_root_tx3xq_1", t = {
+  root: o
+};
+export {
+  t as default,
+  o as root
+};

package/dist/components/Skeleton/Skeleton.types.js

@@ -0,0 +1 @@
+

package/dist/components/Skeleton/Skeleton.utils.js

@@ -0,0 +1,9 @@
+const d = (r, o, t, e, s) => ({
+  "--skeleton-border-radius": r === "circle" ? "var(--skeleton-border-radius-circle)" : e ? `var(--border-radius-${e})` : "var(--border-radius-none)",
+  "--skeleton-height": o,
+  "--skeleton-width": t,
+  ...s
+});
+export {
+  d as getSkeletonStyles
+};

package/dist/components/Slider/Label/Label.js

@@ -0,0 +1,35 @@
+import { jsxs as c, jsx as t } from "react/jsx-runtime";
+import s from "../Slider.module.css.js";
+import { Typography as a } from "../../Typography/Typography.js";
+import { classNames as l } from "../../../utils/class-names.js";
+const b = ({
+  label: o = "",
+  counter: r = "",
+  disabled: e = !1
+}) => {
+  const n = l(s.label, e && s.disabled), i = l(s.counter, e && s.disabled);
+  return /* @__PURE__ */ c("div", { children: [
+    String(o) && /* @__PURE__ */ t(
+      a,
+      {
+        element: "span",
+        category: "body",
+        proportions: "s",
+        className: n,
+        children: o
+      }
+    ),
+    String(r) && /* @__PURE__ */ t(
+      a,
+      {
+        category: "body",
+        proportions: "xs",
+        className: i,
+        children: r
+      }
+    )
+  ] });
+};
+export {
+  b as Label
+};

package/dist/components/Slider/Label/Label.types.js

@@ -0,0 +1 @@
+

package/dist/components/Slider/Marks/Marks.js

@@ -0,0 +1,33 @@
+import { jsx as a } from "react/jsx-runtime";
+import r from "../Slider.module.css.js";
+import { getPercent as p } from "../Slider.utils.js";
+import { Typography as c } from "../../Typography/Typography.js";
+import { classNames as f } from "../../../utils/class-names.js";
+const h = ({
+  disabled: t = !1,
+  marks: o = [],
+  min: m = 0,
+  max: l = 100
+}) => {
+  const n = f(r.mark, t && r.disabledMark);
+  return /* @__PURE__ */ a("div", { className: r.marksContainer, children: o.map((e) => {
+    const s = e.value, i = {
+      left: `${p(s, m, l)}%`
+    };
+    return /* @__PURE__ */ a(
+      c,
+      {
+        element: "span",
+        className: n,
+        style: i,
+        category: "description",
+        proportions: "s",
+        children: e.label
+      },
+      s
+    );
+  }) });
+};
+export {
+  h as Marks
+};

package/dist/components/Slider/Marks/Marks.types.js

@@ -0,0 +1 @@
+

package/dist/components/Slider/RangeSlider/RangeSlider.js

@@ -0,0 +1,78 @@
+import { jsxs as y, jsx as h } from "react/jsx-runtime";
+import { getTrackStyle as D } from "./RangeSlider.utils.js";
+import { SliderBase as V } from "../SliderBase/SliderBase.js";
+import { calculateSliderValue as d } from "../Slider.utils.js";
+import { Thumb as u } from "../Thumb/Thumb.js";
+const q = ({
+  min: a = 0,
+  max: c = 100,
+  step: t = 1,
+  disabled: e,
+  value: l,
+  onChange: m,
+  counter: g,
+  label: k,
+  withTooltip: f = !1,
+  marks: x
+}) => {
+  const n = l.min, o = l.max, C = (r) => {
+    r <= o - t && m({
+      min: r,
+      max: o
+    });
+  }, S = (r) => {
+    r >= n + t && m({
+      min: n,
+      max: r
+    });
+  }, M = (r) => {
+    if (e) return;
+    const i = d(r, a, c, t), T = Math.abs(i - n), j = Math.abs(i - o), s = T < j;
+    m({
+      min: s ? i : n,
+      max: s ? o : i
+    });
+  };
+  return /* @__PURE__ */ y(
+    V,
+    {
+      label: k,
+      counter: g,
+      disabled: e,
+      rangeStyle: D(n, o, a, c),
+      onTrackClick: M,
+      min: a,
+      max: c,
+      marks: x,
+      children: [
+        /* @__PURE__ */ h(
+          u,
+          {
+            onChange: C,
+            value: n,
+            min: a,
+            max: c,
+            step: t,
+            disabled: e,
+            withTooltip: f
+          }
+        ),
+        /* @__PURE__ */ h(
+          u,
+          {
+            onChange: S,
+            value: o,
+            min: a,
+            max: c,
+            step: t,
+            disabled: e,
+            withTooltip: f
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  q as RangeSlider
+};

package/dist/components/Slider/RangeSlider/RangeSlider.types.js

@@ -0,0 +1 @@
+

package/dist/components/Slider/RangeSlider/RangeSlider.utils.js

@@ -0,0 +1,11 @@
+import { getPercent as c } from "../Slider.utils.js";
+const s = (n, o, t, e) => {
+  const r = c(n, t, e), i = c(o, t, e);
+  return {
+    left: `${r}%`,
+    width: `calc(${i - r}% + var(--slider-thumb-width)/2)`
+  };
+};
+export {
+  s as getTrackStyle
+};

package/dist/components/Slider/Slider/Slider.js

@@ -0,0 +1,48 @@
+import { jsx as f } from "react/jsx-runtime";
+import { getTrackStyle as u } from "./Slider.utils.js";
+import { SliderBase as S } from "../SliderBase/SliderBase.js";
+import { calculateSliderValue as T } from "../Slider.utils.js";
+import { Thumb as s } from "../Thumb/Thumb.js";
+const j = ({
+  label: i = "",
+  counter: a = "",
+  min: r = 0,
+  max: e = 100,
+  value: o,
+  step: t = 1,
+  onChange: c,
+  disabled: l = !1,
+  marks: k,
+  withTooltip: n = !1
+}) => /* @__PURE__ */ f(
+  S,
+  {
+    min: r,
+    max: e,
+    label: i,
+    counter: a,
+    disabled: l,
+    onTrackClick: (m) => {
+      if (l) return;
+      const p = T(m, r, e, t);
+      c(p);
+    },
+    rangeStyle: u(o, r, e),
+    marks: k,
+    children: /* @__PURE__ */ f(
+      s,
+      {
+        disabled: l,
+        value: o,
+        min: r,
+        max: e,
+        step: t,
+        onChange: c,
+        withTooltip: n
+      }
+    )
+  }
+);
+export {
+  j as Slider
+};

package/dist/components/Slider/Slider/Slider.types.js

@@ -0,0 +1 @@
+

package/dist/components/Slider/Slider/Slider.utils.js

@@ -0,0 +1,8 @@
+import { getPercent as c } from "../Slider.utils.js";
+const m = (t, e, r) => ({
+  left: "0%",
+  width: `calc(${c(t, e, r)}% + var(--slider-thumb-width)/2)`
+});
+export {
+  m as getTrackStyle
+};

package/dist/components/Slider/Slider.module.css.js

@@ -0,0 +1,33 @@
+const e = "_root_488v2_1", r = "_label_488v2_35", s = "_disabled_488v2_45", _ = "_counter_488v2_49", t = "_sliderContainer_488v2_58", a = "_marksContainer_488v2_71", o = "_mark_488v2_71", i = "_disabledMark_488v2_83", n = "_slider_488v2_58", l = "_sliderTrack_488v2_91", d = "_sliderRange_488v2_92", c = "_sliderDisabledRange_488v2_109", b = "_thumb_488v2_118", v = "_tooltipTrigger_488v2_153", g = {
+  root: e,
+  label: r,
+  disabled: s,
+  counter: _,
+  sliderContainer: t,
+  marksContainer: a,
+  mark: o,
+  disabledMark: i,
+  slider: n,
+  sliderTrack: l,
+  sliderRange: d,
+  sliderDisabledRange: c,
+  thumb: b,
+  tooltipTrigger: v
+};
+export {
+  _ as counter,
+  g as default,
+  s as disabled,
+  i as disabledMark,
+  r as label,
+  o as mark,
+  a as marksContainer,
+  e as root,
+  n as slider,
+  t as sliderContainer,
+  c as sliderDisabledRange,
+  d as sliderRange,
+  l as sliderTrack,
+  b as thumb,
+  v as tooltipTrigger
+};

package/dist/components/Slider/Slider.types.js

@@ -0,0 +1 @@
+

package/dist/components/Slider/Slider.utils.js

@@ -0,0 +1,16 @@
+const d = (e, t, c) => {
+  const n = Math.round((e - t) / (c - t) * 100);
+  return Math.max(0, Math.min(100, n));
+}, l = (e, t, c, n) => {
+  if (!t) return e;
+  const r = Math.round(e / t) * t;
+  return Math.max(c, Math.min(n, r));
+}, h = (e, t, c, n, r) => {
+  const a = r || e.currentTarget.getBoundingClientRect(), o = (e.clientX - a.left) / a.width, u = t + (c - t) * o;
+  return l(u, n, t, c);
+};
+export {
+  h as calculateSliderValue,
+  d as getPercent,
+  l as getSteppedValue
+};

package/dist/components/Slider/SliderBase/SliderBase.js

@@ -0,0 +1,38 @@
+import { jsxs as e, jsx as o } from "react/jsx-runtime";
+import m from "../Slider.module.css.js";
+import { Track as N } from "../Track/Track.js";
+import { Label as d } from "../Label/Label.js";
+import { Marks as h } from "../Marks/Marks.js";
+import { classNames as i } from "../../../utils/class-names.js";
+const B = ({
+  label: t = "",
+  counter: a = "",
+  disabled: r = !1,
+  className: l,
+  children: c,
+  onTrackClick: f,
+  rangeStyle: n,
+  marks: s,
+  min: p,
+  max: x
+}) => /* @__PURE__ */ e("div", { className: i(m.root, l), children: [
+  /* @__PURE__ */ o(d, { label: t, counter: a, disabled: r }),
+  /* @__PURE__ */ e(
+    "div",
+    {
+      className: i(
+        m.sliderContainer,
+        r && m.disabled
+      ),
+      onClick: f,
+      children: [
+        c,
+        /* @__PURE__ */ o(N, { rangeStyle: n, disabled: r })
+      ]
+    }
+  ),
+  s && /* @__PURE__ */ o(h, { marks: s, min: p, max: x, disabled: r })
+] });
+export {
+  B as SliderBase
+};

package/dist/components/Slider/SliderBase/SliderBase.types.js

@@ -0,0 +1 @@
+

package/dist/components/Slider/Thumb/Thumb.js

@@ -0,0 +1,70 @@
+import { jsx as u } from "react/jsx-runtime";
+import { useRef as v, useState as E, useEffect as P } from "react";
+import { getPercent as h, calculateSliderValue as k } from "../Slider.utils.js";
+import p from "../Slider.module.css.js";
+import { Tooltip as L } from "../../Tooltip/Tooltip.js";
+import { classNames as A } from "../../../utils/class-names.js";
+const V = ({
+  disabled: r,
+  onChange: o,
+  value: n,
+  min: i,
+  max: s,
+  step: c,
+  withTooltip: l
+}) => {
+  const f = v(null), [m, w] = E(!1);
+  P(() => {
+    if (!m || r || !o) return;
+    const e = f.current?.parentElement;
+    if (!e) return;
+    const t = (d) => {
+      const D = e.getBoundingClientRect(), y = k(d, i, s, c, D);
+      o(y);
+    }, a = () => w(!1);
+    return window.addEventListener("pointermove", t), window.addEventListener("pointerup", a), () => {
+      window.removeEventListener("pointermove", t), window.removeEventListener("pointerup", a);
+    };
+  }, [m, r, o, i, s, c]);
+  const g = (e) => {
+    if (!o || r) return;
+    let t = n;
+    if (e.key === "ArrowRight" || e.key === "ArrowUp")
+      t = Math.min(n + c, s);
+    else if (e.key === "ArrowLeft" || e.key === "ArrowDown")
+      t = Math.max(n - c, i);
+    else
+      return;
+    e.preventDefault(), t !== n && o(t);
+  };
+  return /* @__PURE__ */ u(
+    "div",
+    {
+      ref: f,
+      className: A(p.thumb, r && p.disabled),
+      tabIndex: r ? -1 : 0,
+      onPointerDown: (e) => {
+        r || (f.current?.focus(), w(!0), l || e.currentTarget.setPointerCapture(e.pointerId));
+      },
+      onKeyDown: g,
+      style: {
+        left: `${h(n, i, s)}%`
+      },
+      children: l && /* @__PURE__ */ u(L, { label: String(n), position: "top", children: /* @__PURE__ */ u(
+        "div",
+        {
+          className: p.tooltipTrigger,
+          onPointerDown: (e) => (
+            // The Element will continue to receive all pointer events (like pointermove, pointerup, etc.),
+            // even if the pointer moves outside the element’s bounds.
+            // So it prevents the tooltip from closing.
+            e.currentTarget.setPointerCapture(e.pointerId)
+          )
+        }
+      ) })
+    }
+  );
+};
+export {
+  V as Thumb
+};

package/dist/components/Slider/Thumb/Thumb.types.js

@@ -0,0 +1 @@
+

package/dist/components/Slider/Track/Track.js

@@ -0,0 +1,16 @@
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import s from "../Slider.module.css.js";
+import { classNames as d } from "../../../utils/class-names.js";
+const t = ({ rangeStyle: r, disabled: a }) => {
+  const i = d(
+    s.sliderRange,
+    a && s.sliderDisabledRange
+  );
+  return /* @__PURE__ */ l("div", { className: s.slider, children: [
+    /* @__PURE__ */ e("div", { className: s.sliderTrack }),
+    /* @__PURE__ */ e("div", { className: i, style: r })
+  ] });
+};
+export {
+  t as Track
+};

package/dist/components/Slider/Track/Track.types.js

@@ -0,0 +1 @@
+