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

package/dist/components/TagSelect/components/Wrapper/Wrapper.js

@@ -1,135 +1,4 @@
-import "../Item/Item.js";
-import { List as j } from "../List/List.js";
-import { jsxs as g, jsx as i } from "react/jsx-runtime";
-import b, { forwardRef as w, useId as k, useImperativeHandle as T } from "react";
-import { Tag as P } from "../../../Tag/Tag.js";
-import { cn as l } from "../../../../utils/index.js";
-import { useTagSelect as C } from "../../hooks/useTagSelect.js";
-import { labelVariants as S, tagSelectVariants as z, wrapperVariants as R } from "../../TagSelect.variants.js";
-import { X as _ } from "../../../../x-4F_5p77m.js";
-import { P as p } from "../../../../index-N2OStZoU.js";
-import { useTagSelect as I } from "../../contexts/TagSelect.hook.js";
-function u() {
-  return u = Object.assign || function(e) {
-    for (var o = 1; o < arguments.length; o++) {
-      var t = arguments[o];
-      for (var r in t)
-        Object.prototype.hasOwnProperty.call(t, r) && (e[r] = t[r]);
-    }
-    return e;
-  }, u.apply(this, arguments);
-}
-function L(e, o) {
-  if (e == null) return {};
-  var t = W(e, o), r, n;
-  if (Object.getOwnPropertySymbols) {
-    var a = Object.getOwnPropertySymbols(e);
-    for (n = 0; n < a.length; n++)
-      r = a[n], !(o.indexOf(r) >= 0) && Object.prototype.propertyIsEnumerable.call(e, r) && (t[r] = e[r]);
-  }
-  return t;
-}
-function W(e, o) {
-  if (e == null) return {};
-  var t = {}, r = Object.keys(e), n, a;
-  for (a = 0; a < r.length; a++)
-    n = r[a], !(o.indexOf(n) >= 0) && (t[n] = e[n]);
-  return t;
-}
-var d = w(function(e, o) {
-  var t = e.color, r = t === void 0 ? "currentColor" : t, n = e.size, a = n === void 0 ? 24 : n, c = L(e, ["color", "size"]);
-  return /* @__PURE__ */ b.createElement("svg", u({
-    ref: o,
-    xmlns: "http://www.w3.org/2000/svg",
-    width: a,
-    height: a,
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: r,
-    strokeWidth: "2",
-    strokeLinecap: "round",
-    strokeLinejoin: "round"
-  }, c), /* @__PURE__ */ b.createElement("polyline", {
-    points: "18 15 12 9 6 15"
-  }));
-});
-d.propTypes = {
-  color: p.string,
-  size: p.oneOfType([p.string, p.number])
-};
-d.displayName = "ChevronUp";
-const G = w(
-  ({
-    label: e,
-    labelClassName: o,
-    name: t,
-    placeholder: r = "Select a value...",
-    theme: n,
-    wrapperClassName: a
-  }, c) => {
-    const h = k(), { selectedTags: v, isOpen: m, onOpen: x, onRemoveTag: y, inputRef: f } = I(), { wrapperRef: O, handleOpen: N } = C();
-    return T(c, () => f.current, [f]), /* @__PURE__ */ g(
-      "div",
-      {
-        ref: O,
-        className: l(
-          R({
-            className: a
-          })
-        ),
-        "data-theme": n,
-        children: [
-          e ? /* @__PURE__ */ i(
-            "label",
-            {
-              htmlFor: t ?? h,
-              className: l(
-                S({
-                  className: o
-                })
-              ),
-              onClick: () => x(!0),
-              children: e
-            }
-          ) : null,
-          /* @__PURE__ */ g(
-            "div",
-            {
-              id: t ?? h,
-              className: l(z()),
-              role: "combobox",
-              onClick: N,
-              "aria-expanded": m,
-              children: [
-                v.length === 0 ? /* @__PURE__ */ i("span", { className: "text-base text-inherit select-none", children: r }) : /* @__PURE__ */ i("div", { className: "flex flex-wrap gap-1.5", children: v.map((s) => /* @__PURE__ */ i(
-                  P,
-                  {
-                    ...s,
-                    className: "select-none",
-                    rightIcon: /* @__PURE__ */ i(_, { className: "w-3 h-3", onClick: () => y(s) }),
-                    "data-value": s.label
-                  },
-                  s.id
-                )) }),
-                /* @__PURE__ */ i(
-                  d,
-                  {
-                    className: l(
-                      "w-4 h-4 text-inherit transition-all duration-50 shrink-0",
-                      m ? "rotate-0" : "rotate-180"
-                    )
-                  }
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ i("input", { ref: f, type: "text", name: t, className: "hidden" }),
-          m ? /* @__PURE__ */ i(j, {}) : null
-        ]
-      }
-    );
-  }
-);
+import { t as p } from "../../../../Wrapper-CjUokv72.js";
 export {
-  G as Wrapper
+  p as Wrapper
 };

package/dist/components/TagSelect/components/index.js

@@ -1,8 +1,8 @@
-import { Item as e } from "./Item/Item.js";
-import { List as t } from "./List/List.js";
-import { Wrapper as f } from "./Wrapper/Wrapper.js";
+import { t as m } from "../../../Wrapper-CjUokv72.js";
+import { Item as t } from "./Item/Item.js";
+import { List as i } from "./List/List.js";
 export {
-  e as Item,
-  t as List,
-  f as Wrapper
+  t as Item,
+  i as List,
+  m as Wrapper
 };

package/dist/components/TagSelect/contexts/TagSelect.context.js

@@ -1,5 +1,5 @@
 import { createContext as e } from "react";
-const t = {
+var t = {
   tags: [],
   selectedTags: [],
   isOpen: !1,

package/dist/components/TagSelect/contexts/TagSelect.hook.js

@@ -1,11 +1,10 @@
-import { useContext as t } from "react";
-import { TagSelectContext as o } from "./TagSelect.context.js";
-const c = () => {
-  const e = t(o);
-  if (!e)
-    throw new Error("useTagSelect must be used within a TagSelectProvider");
+import { TagSelectContext as t } from "./TagSelect.context.js";
+import { useContext as r } from "react";
+var a = () => {
+  const e = r(t);
+  if (!e) throw new Error("useTagSelect must be used within a TagSelectProvider");
   return e;
 };
 export {
-  c as useTagSelect
+  a as useTagSelect
 };

package/dist/components/TagSelect/contexts/TagSelect.provider.js

@@ -1,68 +1,52 @@
-import { jsx as I } from "react/jsx-runtime";
-import { useRef as R, useState as T, useCallback as l } from "react";
-import { TagSelectContext as x } from "./TagSelect.context.js";
-import { useToggle as w } from "../../../hooks/useToggle.js";
-const k = ({
-  children: m,
-  defaultOptions: n = [],
-  multiselect: d = !0
-}) => {
-  const i = R(null), [p, a] = w(!1), [S, g] = T(n), [r, u] = T([]), o = l((t) => {
+import { useToggle as I } from "../../../hooks/useToggle.js";
+import { TagSelectContext as R } from "./TagSelect.context.js";
+import { useCallback as l, useRef as x, useState as T } from "react";
+import { jsx as w } from "react/jsx-runtime";
+var k = ({ children: m, defaultOptions: n = [], multiselect: d = !0 }) => {
+  const i = x(null), [p, c] = I(!1), [S, g] = T(n), [a, u] = T([]), o = l((t) => {
     if (i.current) {
-      const s = t.map(({ id: c, label: e }) => ({
-        id: c,
+      const s = t.map(({ id: r, label: e }) => ({
+        id: r,
         value: e
       }));
       i.current.value = JSON.stringify(s);
     }
-  }, []), f = l(
-    (t) => {
-      const s = [...d ? r : [], t];
-      u(s);
-      const c = s.map((e) => e.id);
-      g(() => d ? n.filter(
-        (e) => !c.includes(e.id)
-      ) : n.map((e) => ({
-        ...e,
-        isSelected: c.includes(e.id)
-      }))), o(s), a(!1);
+  }, []), f = l((t) => {
+    const s = [...d ? a : [], t];
+    u(s);
+    const r = s.map((e) => e.id);
+    g(() => d ? n.filter((e) => !r.includes(e.id)) : n.map((e) => ({
+      ...e,
+      isSelected: r.includes(e.id)
+    }))), o(s), c(!1);
+  }, [
+    n,
+    o,
+    d,
+    a,
+    c
+  ]), v = l((t) => {
+    const s = a.filter((e) => e.id !== t.id);
+    u(s);
+    const r = s.map((e) => e.id);
+    g(() => n.filter((e) => !r.includes(e.id))), o(s);
+  }, [
+    n,
+    o,
+    a
+  ]), h = l((t) => c(t), [c]);
+  return /* @__PURE__ */ w(R.Provider, {
+    value: {
+      tags: S,
+      selectedTags: a,
+      isOpen: p,
+      inputRef: i,
+      onSelectTag: f,
+      onRemoveTag: v,
+      onOpen: h
     },
-    [
-      n,
-      o,
-      d,
-      r,
-      a
-    ]
-  ), v = l(
-    (t) => {
-      const s = r.filter((e) => e.id !== t.id);
-      u(s);
-      const c = s.map((e) => e.id);
-      g(
-        () => n.filter((e) => !c.includes(e.id))
-      ), o(s);
-    },
-    [n, o, r]
-  ), h = l(
-    (t) => a(t),
-    [a]
-  );
-  return /* @__PURE__ */ I(
-    x.Provider,
-    {
-      value: {
-        tags: S,
-        selectedTags: r,
-        isOpen: p,
-        inputRef: i,
-        onSelectTag: f,
-        onRemoveTag: v,
-        onOpen: h
-      },
-      children: m
-    }
-  );
+    children: m
+  });
 };
 export {
   k as TagSelectProvider

package/dist/components/TagSelect/contexts/index.js

@@ -1,6 +1,6 @@
-import { useTagSelect as o } from "./TagSelect.hook.js";
-import { TagSelectProvider as a } from "./TagSelect.provider.js";
+import { useTagSelect as r } from "./TagSelect.hook.js";
+import { TagSelectProvider as t } from "./TagSelect.provider.js";
 export {
-  a as TagSelectProvider,
-  o as useTagSelect
+  t as TagSelectProvider,
+  r as useTagSelect
 };

package/dist/components/TagSelect/hooks/useTagSelect.js

@@ -1,32 +1,23 @@
-import { useRef as l, useEffect as c, useCallback as u } from "react";
-import { useTagSelect as i } from "../contexts/TagSelect.hook.js";
-const g = () => {
-  const n = l(null), { onOpen: e } = i();
-  c(() => {
-    const t = new AbortController(), s = (a) => {
+import { useTagSelect as o } from "../contexts/TagSelect.hook.js";
+import { useCallback as l, useEffect as c, useRef as u } from "react";
+var f = () => {
+  const n = u(null), { onOpen: e } = o();
+  return c(() => {
+    const t = new AbortController(), r = (a) => {
       a.key === "Escape" && e(!1);
-    }, o = (a) => {
+    }, s = (a) => {
       n.current?.contains(a.target) || e(!1);
     };
-    return document.addEventListener("keydown", s, {
-      signal: t.signal
-    }), document.addEventListener("mousedown", o, {
-      signal: t.signal
-    }), () => {
+    return document.addEventListener("keydown", r, { signal: t.signal }), document.addEventListener("mousedown", s, { signal: t.signal }), () => {
       t.abort();
     };
-  }, [e, n]);
-  const r = u(
-    (t) => {
-      t.target?.closest("[data-value]") || e(!0);
-    },
-    [e]
-  );
-  return {
+  }, [e, n]), {
     wrapperRef: n,
-    handleOpen: r
+    handleOpen: l((t) => {
+      t.target?.closest("[data-value]") || e(!0);
+    }, [e])
   };
 };
 export {
-  g as useTagSelect
+  f as useTagSelect
 };

package/dist/components/TextArea/TextArea.js

@@ -1,36 +1,30 @@
-import { jsxs as f, jsx as o } from "react/jsx-runtime";
-import { forwardRef as x, useId as u } from "react";
-import { cn as h } from "../../utils/index.js";
-import { textAreaVariants as p } from "./TextArea.variants.js";
-const I = x(
-  ({
-    initialValue: m,
-    label: e,
-    name: l,
-    placeholder: s,
-    rows: c = 3,
-    theme: i,
-    className: n,
-    ...r
-  }, d) => {
-    const t = u(), a = l ? `${t}-name` : t;
-    return /* @__PURE__ */ f("div", { className: "flex flex-col gap-2", "data-theme": i, children: [
-      e ? /* @__PURE__ */ o("label", { htmlFor: a, className: "cursor-pointer", children: e }) : null,
-      /* @__PURE__ */ o(
-        "textarea",
-        {
-          id: a,
-          ref: d,
-          className: h(p({ className: n })),
-          rows: c,
-          placeholder: s,
-          value: m ?? r.value,
-          ...r
-        }
-      )
-    ] });
-  }
-);
+import { t as m } from "../../utils-DHuiYnx1.js";
+import { textAreaVariants as h } from "./TextArea.variants.js";
+import { forwardRef as u, useId as p } from "react";
+import { jsx as e, jsxs as v } from "react/jsx-runtime";
+var g = u(({ initialValue: s, label: r, labelWrapperClassName: o, name: i, placeholder: c, rows: d = 3, theme: n, className: f, ...a }, x) => {
+  const t = p(), l = i ? `${t}-name` : t;
+  return /* @__PURE__ */ v("div", {
+    className: "flex flex-col gap-2",
+    "data-theme": n,
+    children: [r ? /* @__PURE__ */ e("div", {
+      className: m(o),
+      children: /* @__PURE__ */ e("label", {
+        htmlFor: l,
+        className: "cursor-pointer",
+        children: r
+      })
+    }) : null, /* @__PURE__ */ e("textarea", {
+      id: l,
+      ref: x,
+      className: m(h({ className: f })),
+      rows: d,
+      placeholder: c,
+      value: s ?? a.value,
+      ...a
+    })]
+  });
+});
 export {
-  I as TextArea
+  g as TextArea
 };

package/dist/components/TextArea/TextArea.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 i = r([
   "border",
   "border-gray-200",
   "disabled:cursor-not-allowed",
@@ -16,5 +16,5 @@ const o = r([
   "focus:ring-kubefirst-primary"
 ]);
 export {
-  o as textAreaVariants
+  i as textAreaVariants
 };

package/dist/components/TimePicker/TimePicker.js

@@ -1,8 +1,17 @@
+import { TimePickerProvider as c } from "./contexts/time-picker.provider.js";
+import { Wrapper as a } from "./components/Wrapper/Wrapper.js";
 import { jsx as r } from "react/jsx-runtime";
-import { TimePickerProvider as m } from "./contexts/time-picker.provider.js";
-import { Wrapper as o } from "./components/Wrapper/Wrapper.js";
-const p = ({ format: i = "12", ...e }) => /* @__PURE__ */ r(m, { format: i, children: /* @__PURE__ */ r(o, { ...e }) });
-p.displayName = "TimePicker";
+var s = ({ format: e = "12", mode: i = "select", showList: m = !0, time: o, onChange: t, ...p }) => /* @__PURE__ */ r(c, {
+  format: e,
+  time: o,
+  onChange: t,
+  children: /* @__PURE__ */ r(a, {
+    mode: i,
+    showList: m,
+    ...p
+  })
+});
+s.displayName = "KonstructTimePicker";
 export {
-  p as TimePicker
+  s as TimePicker
 };

package/dist/components/TimePicker/TimePicker.variants.js

@@ -1,46 +1,57 @@
-import { c as r } from "../../index-D29mdTf5.js";
-const t = r([
+import { t } from "../../dist-DtEbXv47.js";
+var r = t([
   "border",
   "rounded",
-  "p-[0.625rem]",
+  "p-2.5",
   "w-full",
   "flex",
   "items-center",
   "justify-between",
+  "bg-white",
   "border-gray-300",
+  "dark:border-metal-700",
+  "dark:bg-metal-800",
   "cursor-pointer",
   "transition-all",
   "transition-duration-100",
   "data-[open=true]:border-aurora-500",
-  "text-sm"
-]), o = r([
+  "text-sm",
+  "text-slate-800",
+  "dark:text-slate-50"
+]), e = t([
   "snap-y",
   "snap-mandatory",
   "overflow-y-scroll",
   "scrollbar-none",
   "flex",
-  "flex-col"
-]), n = r([
-  "w-[60px]",
-  "h-[40px]",
+  "flex-col",
+  "dark:text-metal-50"
+]), o = t([
+  "w-15",
+  "h-10",
   "snap-start",
   "rounded",
   "transition-all",
   "transition-duration-100",
-  "focus-within:outline-2",
+  "outline-none",
   "border-2",
   "border-transparent",
-  "outline-none",
   "hover:bg-gray-100",
-  "hover:border-2",
-  "hover:border-white",
+  "focus-within:bg-gray-100",
   "data-[active=true]:bg-blue-600",
-  "data-[active=true]:hover:border-blue-200",
   "data-[active=true]:text-white",
   "data-[active=true]:font-medium",
-  "focus-visible:border-blue-200",
-  "focus-within:border-blue-200"
-]), a = r([
+  "data-[active=true]:hover:border-blue-200",
+  "data-[active=true]:focus-within:bg-blue-600",
+  "data-[active=true]:focus-within:border-blue-200",
+  "dark:data-[active=true]:bg-aurora-500",
+  "dark:data-[active=true]:text-metal-900",
+  "dark:data-[active=true]:hover:border-aurora-50",
+  "dark:data-[active=true]:focus-within:bg-aurora-500",
+  "dark:data-[active=true]:focus-within:border-aurora-50",
+  "dark:hover:bg-metal-700",
+  "dark:focus-within:bg-metal-700"
+]), i = t([
   "flex",
   "items-center",
   "justify-center",
@@ -50,12 +61,11 @@ const t = r([
   "px-6",
   "py-3",
   "outline-none",
-  "focus:border-blue-200",
   "text-sm"
 ]);
 export {
-  a as buttonVariants,
-  n as liVariants,
-  t as timePickerVariants,
-  o as ulVariants
+  i as buttonVariants,
+  o as liVariants,
+  r as timePickerVariants,
+  e as ulVariants
 };