@konstructio/ui 0.1.2-alpha.8 → 0.1.2-alpha.81

package/dist/components/Sidebar/components/NavigationOption/NavigationOption.variants.js

@@ -1,43 +1,36 @@
-import { c as t } from "../../../../index-D29mdTf5.js";
-const a = t(
-  [
-    "[&>a]:flex",
-    "[&>a]:gap-2",
-    "[&>a]:no-underline",
-    "[&>a]:text-inherit",
-    "[&>a]:w-full",
-    "cursor-pointer",
-    "flex",
-    "font-normal",
-    "font-normal",
-    "gap-2",
-    "rounded-xl",
-    "md:px-4",
-    "md:py-2.5",
-    "p-2",
-    "text-black",
-    "w-full",
-    "text-[#9ea2c6]",
-    "hover:text-white",
-    "hover:bg-[#252a41]",
-    "selection:bg-powder-500",
-    "selection:text-white"
-  ],
-  {
-    variants: {
-      isActive: {
-        true: "",
-        false: ""
-      }
-    },
-    compoundVariants: [
-      {
-        isActive: !0,
-        class: ["text-white", "bg-[#252a41]"]
-      }
-    ]
-  }
-);
+import { t } from "../../../../dist-DtEbXv47.js";
+var a = t([
+  "[&>a]:flex",
+  "[&>a]:gap-2",
+  "[&>a]:no-underline",
+  "[&>a]:text-inherit",
+  "[&>a]:w-full",
+  "cursor-pointer",
+  "flex",
+  "font-normal",
+  "font-normal",
+  "gap-2",
+  "rounded-xl",
+  "md:px-4",
+  "md:py-2.5",
+  "p-2",
+  "text-black",
+  "w-full",
+  "text-[#9ea2c6]",
+  "hover:text-white",
+  "hover:bg-[#252a41]",
+  "selection:bg-powder-500",
+  "selection:text-white"
+], {
+  variants: { isActive: {
+    true: "",
+    false: ""
+  } },
+  compoundVariants: [{
+    isActive: !0,
+    class: ["text-white", "bg-[#252a41]"]
+  }]
+});
 export {
   a as navigationOptionVariants
 };

package/dist/components/Sidebar/components/NavigationSeparator/NavigationSeparator.js

@@ -1,7 +1,7 @@
-import { jsx as r } from "react/jsx-runtime";
-import { cn as o } from "../../../../utils/index.js";
-import { navigationSeparatorVariant as t } from "./NavigationSeparator.variants.js";
-const i = ({ className: a }) => /* @__PURE__ */ r("div", { className: o(t({ className: a })) });
+import { t as r } from "../../../../utils-DHuiYnx1.js";
+import { navigationSeparatorVariant as o } from "./NavigationSeparator.variants.js";
+import { jsx as t } from "react/jsx-runtime";
+var i = ({ className: a }) => /* @__PURE__ */ t("div", { className: r(o({ className: a })) });
 i.displayName = "KonstructSidebarNavigationSeparator";
 export {
   i as NavigationSeparator

package/dist/components/Sidebar/components/NavigationSeparator/NavigationSeparator.variants.js

@@ -1,5 +1,5 @@
-import { c as r } from "../../../../index-D29mdTf5.js";
-const o = r([
+import { t as r } from "../../../../dist-DtEbXv47.js";
+var o = r([
   "border-t",
   "rounded-full",
   "my-1.5"

package/dist/components/Sidebar/components/NavigationTitle/NavigationTitle.js

@@ -1,12 +1,11 @@
-import { jsx as a } from "react/jsx-runtime";
-import { cn as n } from "../../../../utils/index.js";
-import { navigationTitleVariants as o } from "./NavigationTitle.variants.js";
-const e = ({
-  title: i,
-  className: t,
-  isVisible: r = !0
-}) => r ? /* @__PURE__ */ a("h2", { className: n(o({ className: t })), children: i }) : null;
-e.displayName = "KonstructSidebarNavigationTitle";
+import { t as a } from "../../../../utils-DHuiYnx1.js";
+import { navigationTitleVariants as e } from "./NavigationTitle.variants.js";
+import { jsx as n } from "react/jsx-runtime";
+var o = ({ title: i, className: r, isVisible: t = !0 }) => t ? /* @__PURE__ */ n("h2", {
+  className: a(e({ className: r })),
+  children: i
+}) : null;
+o.displayName = "KonstructSidebarNavigationTitle";
 export {
-  e as NavigationTitle
+  o as NavigationTitle
 };

package/dist/components/Sidebar/components/NavigationTitle/NavigationTitle.variants.js

@@ -1,5 +1,5 @@
-import { c as t } from "../../../../index-D29mdTf5.js";
-const o = t([
+import { t } from "../../../../dist-DtEbXv47.js";
+var i = t([
   "text-sm",
   "font-bold",
   "px-4",
@@ -10,5 +10,5 @@ const o = t([
   "selection:text-white"
 ]);
 export {
-  o as navigationTitleVariants
+  i as navigationTitleVariants
 };

package/dist/components/Sidebar/components/Wrapper/Wrapper.js

@@ -1,84 +1,38 @@
+import { t as y } from "../../../../utils-DHuiYnx1.js";
 import { Footer as b } from "../Footer/Footer.js";
 import { Logo as C } from "../Logo/Logo.js";
 import { Navigation as D } from "../Navigation/Navigation.js";
-import "../NavigationGroup/NavigationGroup.js";
-import "../NavigationOption/NavigationOption.js";
-import "../NavigationSeparator/NavigationSeparator.js";
-import "../NavigationTitle/NavigationTitle.js";
-import { jsxs as V, jsx as j } from "react/jsx-runtime";
-import { useRef as d, useCallback as f, useMemo as s, Children as a, isValidElement as l } from "react";
-import { cn as y } from "../../../../utils/index.js";
-import { dragVariants as x, wrapperSiderbarVariants as z } from "../../Sidebar.variants.js";
-const S = ({
-  canResize: g = !0,
-  children: v,
-  dividerClassName: L,
-  maxWith: i = 300,
-  minWith: m = 240,
-  theme: M,
-  wrapperClassName: N
-}) => {
-  const r = d(null), c = d(null), u = d(!1), n = f(
-    (e) => {
-      if (!u.current) {
-        r.current && (r.current.style.opacity = "0");
-        return;
-      }
-      let o = e.clientX;
-      o < m && (o = m), o > i && (o = i), c.current && r.current && (c.current.style.width = `${o}px`, r.current.classList.add("opacity-100"));
-    },
-    [i, m]
-  ), p = f(() => {
-    u.current = !1, r.current && r.current.classList.remove("opacity-100"), document.removeEventListener("mousemove", n), document.removeEventListener("mouseup", p);
-  }, [n]), w = f(
-    (e) => {
-      e.preventDefault(), e.stopPropagation(), u.current = !0, document.addEventListener("mousemove", n), document.addEventListener("mouseup", p);
-    },
-    [n, p]
-  ), t = s(
-    () => a.toArray(v),
-    [v]
-  ), E = s(
-    () => a.toArray(t).find(
-      (e) => l(e) && e.type === C
-    ),
-    [t]
-  ), R = s(
-    () => a.toArray(t).find(
-      (e) => l(e) && e.type === D
-    ),
-    [t]
-  ), A = s(
-    () => a.toArray(t).find(
-      (e) => l(e) && e.type === b
-    ),
-    [t]
-  );
-  return /* @__PURE__ */ V(
-    "aside",
-    {
-      ref: c,
-      className: y(
-        z({
-          className: N
-        })
-      ),
-      "data-theme": M,
-      children: [
-        E,
-        R,
-        A,
-        g && /* @__PURE__ */ j(
-          "div",
-          {
-            ref: r,
-            className: y(x({ className: L })),
-            onMouseDown: w
-          }
-        )
-      ]
+import { dragVariants as V, wrapperSiderbarVariants as j } from "../../Sidebar.variants.js";
+import { Children as s, isValidElement as p, useCallback as f, useMemo as a, useRef as l } from "react";
+import { jsx as x, jsxs as z } from "react/jsx-runtime";
+var S = ({ canResize: g = !0, children: v, dividerClassName: L, maxWith: i = 300, minWith: u = 240, theme: M, wrapperClassName: N }) => {
+  const r = l(null), c = l(null), m = l(!1), n = f((e) => {
+    if (!m.current) {
+      r.current && (r.current.style.opacity = "0");
+      return;
     }
-  );
+    let o = e.clientX;
+    o < u && (o = u), o > i && (o = i), c.current && r.current && (c.current.style.width = `${o}px`, r.current.classList.add("opacity-100"));
+  }, [i, u]), d = f(() => {
+    m.current = !1, r.current && r.current.classList.remove("opacity-100"), document.removeEventListener("mousemove", n), document.removeEventListener("mouseup", d);
+  }, [n]), w = f((e) => {
+    e.preventDefault(), e.stopPropagation(), m.current = !0, document.addEventListener("mousemove", n), document.addEventListener("mouseup", d);
+  }, [n, d]), t = a(() => s.toArray(v), [v]), E = a(() => s.toArray(t).find((e) => p(e) && e.type === C), [t]), R = a(() => s.toArray(t).find((e) => p(e) && e.type === D), [t]), A = a(() => s.toArray(t).find((e) => p(e) && e.type === b), [t]);
+  return /* @__PURE__ */ z("aside", {
+    ref: c,
+    className: y(j({ className: N })),
+    "data-theme": M,
+    children: [
+      E,
+      R,
+      A,
+      g && /* @__PURE__ */ x("div", {
+        ref: r,
+        className: y(V({ className: L })),
+        onMouseDown: w
+      })
+    ]
+  });
 };
 S.displayName = "Sidebar.Wrapper";
 export {

package/dist/components/Sidebar/components/index.js

@@ -1,18 +1,18 @@
-import { Footer as t } from "./Footer/Footer.js";
-import { Logo as p } from "./Logo/Logo.js";
-import { Navigation as i } from "./Navigation/Navigation.js";
-import { NavigationGroup as m } from "./NavigationGroup/NavigationGroup.js";
-import { NavigationOption as g } from "./NavigationOption/NavigationOption.js";
+import { Footer as r } from "./Footer/Footer.js";
+import { Logo as t } from "./Logo/Logo.js";
+import { NavigationTitle as p } from "./NavigationTitle/NavigationTitle.js";
+import { NavigationGroup as f } from "./NavigationGroup/NavigationGroup.js";
+import { NavigationOption as n } from "./NavigationOption/NavigationOption.js";
 import { NavigationSeparator as v } from "./NavigationSeparator/NavigationSeparator.js";
-import { NavigationTitle as l } from "./NavigationTitle/NavigationTitle.js";
-import { Wrapper as F } from "./Wrapper/Wrapper.js";
+import { Navigation as l } from "./Navigation/Navigation.js";
+import { Wrapper as x } from "./Wrapper/Wrapper.js";
 export {
-  t as Footer,
-  p as Logo,
-  i as Navigation,
-  m as NavigationGroup,
-  g as NavigationOption,
+  r as Footer,
+  t as Logo,
+  l as Navigation,
+  f as NavigationGroup,
+  n as NavigationOption,
   v as NavigationSeparator,
-  l as NavigationTitle,
-  F as Wrapper
+  p as NavigationTitle,
+  x as Wrapper
 };

package/dist/components/Slider/Slider.js

@@ -1,49 +1,41 @@
-import { jsxs as l, jsx as a } from "react/jsx-runtime";
-import { R as x, T as N, b as v } from "../../index-l3NwplN0.js";
-import { forwardRef as V, useRef as b, useState as R, useImperativeHandle as g, useEffect as j, useCallback as k } from "react";
-import { cn as r } from "../../utils/index.js";
-import { trackVariants as w, thumbVariants as y, sliderVariants as C } from "./Slider.variants.js";
-const q = V(
-  ({ label: s, defaultValue: c = [0], name: i, theme: u, size: n, showValue: m, ...o }, f) => {
-    const e = b(null), [t, d] = R(c);
-    g(f, () => e.current, [e]), j(() => {
-      e.current && (e.current.value = t.toString());
-    }, [t]);
-    const h = k(
-      (p) => d(p),
-      []
-    );
-    return /* @__PURE__ */ l("div", { className: "w-full relative flex flex-col gap-3", "data-theme": u, children: [
-      /* @__PURE__ */ l(
-        "div",
-        {
-          className: r(
-            "flex items-center",
-            s ? "justify-between" : "justify-end"
-          ),
-          children: [
-            s ? /* @__PURE__ */ a("label", { children: s }) : null,
-            m ? /* @__PURE__ */ a("span", { className: "text-xs", children: t }) : null
-          ]
-        }
-      ),
-      /* @__PURE__ */ a("input", { ref: e, name: i, className: "hidden", type: "number" }),
-      /* @__PURE__ */ l(
-        x,
-        {
-          value: t,
-          className: r(C()),
-          onValueChange: h,
-          ...o,
-          children: [
-            /* @__PURE__ */ a(N, { className: r(w({ size: n })) }),
-            /* @__PURE__ */ a(v, { className: r(y({ size: n })) })
-          ]
-        }
-      )
-    ] });
-  }
-);
+import { t } from "../../utils-DHuiYnx1.js";
+import { i as v, n as N, r as V } from "../../dist-BL8l9uRy.js";
+import { sliderVariants as b, thumbVariants as g, trackVariants as j } from "./Slider.variants.js";
+import { forwardRef as R, useCallback as k, useEffect as w, useImperativeHandle as y, useRef as C, useState as S } from "react";
+import { jsx as a, jsxs as l } from "react/jsx-runtime";
+var A = R(({ label: s, labelWrapperClassName: i, defaultValue: c = [0], name: u, theme: m, size: n, showValue: o, ...f }, d) => {
+  const e = C(null), [r, h] = S(c);
+  y(d, () => e.current, [e]), w(() => {
+    e.current && (e.current.value = r.toString());
+  }, [r]);
+  const p = k((x) => h(x), []);
+  return /* @__PURE__ */ l("div", {
+    className: "w-full relative flex flex-col gap-3",
+    "data-theme": m,
+    children: [
+      /* @__PURE__ */ l("div", {
+        className: t("flex items-center", s ? "justify-between" : "justify-end", i),
+        children: [s ? /* @__PURE__ */ a("label", { children: s }) : null, o ? /* @__PURE__ */ a("span", {
+          className: "text-xs",
+          children: r
+        }) : null]
+      }),
+      /* @__PURE__ */ a("input", {
+        ref: e,
+        name: u,
+        className: "hidden",
+        type: "number"
+      }),
+      /* @__PURE__ */ l(N, {
+        value: r,
+        className: t(b()),
+        onValueChange: p,
+        ...f,
+        children: [/* @__PURE__ */ a(v, { className: t(j({ size: n })) }), /* @__PURE__ */ a(V, { className: t(g({ size: n })) })]
+      })
+    ]
+  });
+});
 export {
-  q as Slider
+  A as Slider
 };

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

@@ -1,51 +1,42 @@
-import { c as e } from "../../index-D29mdTf5.js";
-const s = e([
+import { t as r } from "../../dist-DtEbXv47.js";
+var a = r([
   "relative",
   "flex",
   "items-center",
   "w-full"
-]), a = e(
-  ["relative", "flex-grow", "rounded-full", "bg-kubefirst-secondary"],
-  {
-    variants: {
-      size: {
-        sm: ["h-1"],
-        md: ["h-2"],
-        lg: ["h-3"]
-      }
-    },
-    defaultVariants: {
-      size: "md"
-    }
-  }
-), t = e(
-  [
-    "block",
-    "w-5",
-    "h-5",
-    "rounded-full",
-    "cursor-pointer",
-    "focus-visible:outline-none",
-    "shadow-md",
-    "bg-white",
-    "border",
-    "border-gray-300"
-  ],
-  {
-    variants: {
-      size: {
-        sm: ["w-5", "h-5"],
-        md: ["w-6", "h-6"],
-        lg: ["w-7", "h-7"]
-      }
-    },
-    defaultVariants: {
-      size: "md"
-    }
-  }
-);
+]), i = r([
+  "relative",
+  "flex-grow",
+  "rounded-full",
+  "bg-kubefirst-secondary"
+], {
+  variants: { size: {
+    sm: ["h-1"],
+    md: ["h-2"],
+    lg: ["h-3"]
+  } },
+  defaultVariants: { size: "md" }
+}), s = r([
+  "block",
+  "w-5",
+  "h-5",
+  "rounded-full",
+  "cursor-pointer",
+  "focus-visible:outline-none",
+  "shadow-md",
+  "bg-white",
+  "border",
+  "border-gray-300"
+], {
+  variants: { size: {
+    sm: ["w-5", "h-5"],
+    md: ["w-6", "h-6"],
+    lg: ["w-7", "h-7"]
+  } },
+  defaultVariants: { size: "md" }
+});
 export {
-  s as sliderVariants,
-  t as thumbVariants,
-  a as trackVariants
+  a as sliderVariants,
+  s as thumbVariants,
+  i as trackVariants
 };

package/dist/components/Spinner/Spinner.js

@@ -0,0 +1,4 @@
+import { t as o } from "../../Spinner-CyuXAaC8.js";
+export {
+  o as Spinner
+};

package/dist/components/Spinner/Spinner.variants.js

@@ -0,0 +1,40 @@
+import { t as a } from "../../dist-DtEbXv47.js";
+var r = a([
+  "h-full",
+  "flex",
+  "justify-center",
+  "items-center",
+  "flex-col",
+  "gap-6",
+  "animate-in",
+  "fade-in-80"
+], {
+  variants: { size: {
+    sm: [],
+    md: [],
+    lg: []
+  } },
+  defaultVariants: { size: "md" }
+}), e = a([
+  "animate-spin",
+  "animate-duration-time-2",
+  "bg-linear-to-r",
+  "from-black/20",
+  "from-1%",
+  "via-black/50",
+  "via-40%",
+  "to-aurora-500",
+  "dark:from-white/20",
+  "dark:via-white/50"
+], {
+  variants: { size: {
+    sm: ["w-20", "h-20"],
+    md: ["w-40", "h-40"],
+    lg: ["w-60", "h-60"]
+  } },
+  defaultVariants: { size: "md" }
+});
+export {
+  e as spinnerIconVariants,
+  r as spinnerVariants
+};

package/dist/components/Stepper/Stepper.js

@@ -0,0 +1,48 @@
+import { t as s } from "../../utils-DHuiYnx1.js";
+import { stepItemVariants as S, stepListVariants as b, stepperVariants as k } from "./Stepper.variants.js";
+import { StepItem as C } from "./components/StepItem/StepItem.js";
+import { useMemo as I } from "react";
+import { jsx as e } from "react/jsx-runtime";
+var P = ({ className: u, classNames: r, clickable: c = !1, currentStep: a, icons: f, orientation: p = "vertical", showConnector: v = !0, size: h = "sm", steps: l, theme: d, variant: g = "inline", onStepClick: z }) => {
+  const m = g ?? "inline", o = m === "horizontal" ? "horizontal" : p ?? "vertical", V = h ?? "sm", n = I(() => l.map((t, i) => t.status ? t : a !== void 0 ? i < a ? {
+    ...t,
+    status: "completed"
+  } : i === a ? {
+    ...t,
+    status: "active"
+  } : {
+    ...t,
+    status: "pending"
+  } : {
+    ...t,
+    status: "pending"
+  }), [l, a]);
+  return /* @__PURE__ */ e("nav", {
+    className: s(k({ orientation: o }), u, r?.root),
+    "data-theme": d,
+    "aria-label": "Progress steps",
+    children: /* @__PURE__ */ e("ol", {
+      className: s(b({ orientation: o }), r?.list),
+      children: n.map((t, i) => /* @__PURE__ */ e("li", {
+        className: s(S({ orientation: o }), r?.item),
+        children: /* @__PURE__ */ e(C, {
+          step: t,
+          index: i,
+          isLast: i === n.length - 1,
+          orientation: o,
+          clickable: c ?? !1,
+          onClick: () => z?.(t, i),
+          size: V,
+          showConnector: v ?? !0,
+          nextStepStatus: n[i + 1]?.status,
+          variant: m,
+          classNames: r,
+          icons: f
+        })
+      }, t.id))
+    })
+  });
+};
+export {
+  P as Stepper
+};