@konstructio/ui 0.0.12-alpha.9 → 0.0.13-alpha.1

package/dist/components/Table/Table.js

@@ -0,0 +1,27 @@
+import { jsx as e } from "react/jsx-runtime";
+import { cn as i } from "../../utils/index.js";
+import { tableVariants as p } from "./Table.variants.js";
+import { Body as f } from "./components/Body.js";
+import { Filter as l } from "./components/Filter.js";
+import { Head as d } from "./components/Head.js";
+import { Row as s } from "./components/Row.js";
+const o = ({ children: r, className: m, theme: t, ...a }) => /* @__PURE__ */ e(
+  "table",
+  {
+    className: i(
+      p({
+        className: m
+      })
+    ),
+    "data-theme": t,
+    ...a,
+    children: r
+  }
+);
+o.Body = f;
+o.Filter = l;
+o.Head = d;
+o.Row = s;
+export {
+  o as Table
+};

package/dist/components/Table/Table.variants.js

@@ -0,0 +1,40 @@
+import { c as t } from "../../index-BNmRGtA6.js";
+const r = t([
+  "table-auto",
+  "w-full",
+  "border-collapse",
+  "border-spacing-0",
+  "rounded",
+  "shadow-sm"
+]), a = t(
+  [
+    "h-8",
+    "text-inherit",
+    "[&>td]:py-3",
+    "[&>td]:px-4",
+    "text-slate-700",
+    "hover:bg-zinc-100",
+    "hover:cursor-pointer"
+  ],
+  {
+    variants: {
+      isSelected: {
+        true: "bg-purple-50",
+        false: ""
+      }
+    }
+  }
+), s = t([
+  "h-[18px]",
+  "bg-slate-100",
+  "[&>tr>th]:py-3",
+  "[&>tr>th]:px-4",
+  "[&>tr>th]:uppercase",
+  "text-left"
+]), o = t([]);
+export {
+  o as bodyVariants,
+  s as headVariants,
+  a as rowVariants,
+  r as tableVariants
+};

package/dist/components/Table/components/Body.js

@@ -0,0 +1,18 @@
+import { jsx as t } from "react/jsx-runtime";
+import { cn as s } from "../../../utils/index.js";
+import { bodyVariants as a } from "../Table.variants.js";
+const d = ({ children: o, className: r, ...m }) => /* @__PURE__ */ t(
+  "tbody",
+  {
+    className: s(
+      a({
+        className: r
+      })
+    ),
+    ...m,
+    children: o
+  }
+);
+export {
+  d as Body
+};

package/dist/components/Table/components/Filter.js

@@ -0,0 +1,9 @@
+import { jsxs as t, jsx as s } from "react/jsx-runtime";
+import { Input as i } from "../../Input/Input.js";
+const o = ({ children: e, ...r }) => /* @__PURE__ */ t("div", { className: "flex px-4 py-6 rounded-t", children: [
+  /* @__PURE__ */ s(i, { className: "!w-1/3", ...r }),
+  /* @__PURE__ */ s("div", { className: "w-1/4 flex justify-end", children: e })
+] });
+export {
+  o as Filter
+};

package/dist/components/Table/components/Head.js

@@ -0,0 +1,18 @@
+import { jsx as m } from "react/jsx-runtime";
+import { cn as t } from "../../../utils/index.js";
+import { headVariants as e } from "../Table.variants.js";
+const c = ({ children: o, className: r, ...a }) => /* @__PURE__ */ m(
+  "thead",
+  {
+    className: t(
+      e({
+        className: r
+      })
+    ),
+    ...a,
+    children: o
+  }
+);
+export {
+  c as Head
+};

package/dist/components/Table/components/Row.js

@@ -0,0 +1,28 @@
+import { jsx as a } from "react/jsx-runtime";
+import { cn as c } from "../../../utils/index.js";
+import { rowVariants as n } from "../Table.variants.js";
+const l = ({
+  children: o,
+  className: r,
+  width: t,
+  isSelected: m,
+  onSelect: s,
+  ...i
+}) => /* @__PURE__ */ a(
+  "tr",
+  {
+    style: { width: t },
+    onClick: s,
+    className: c(
+      n({
+        className: r,
+        isSelected: m
+      })
+    ),
+    ...i,
+    children: o
+  }
+);
+export {
+  l as Row
+};

package/dist/components/Table/components/index.js

@@ -0,0 +1,10 @@
+import { Body as e } from "./Body.js";
+import { Filter as f } from "./Filter.js";
+import { Head as p } from "./Head.js";
+import { Row as d } from "./Row.js";
+export {
+  e as Body,
+  f as Filter,
+  p as Head,
+  d as Row
+};

package/dist/components/Tag/Tag.js

@@ -1,5 +1,5 @@
 import { jsxs as n, jsx as a } from "react/jsx-runtime";
-import { S as r } from "../../index-B_6_jmOO.js";
+import { S as r } from "../../index-Bk324h27.js";
 import { cn as o } from "../../utils/index.js";
 import { tagVariants as c } from "./Tag.variants.js";
 const u = ({

package/dist/components/TagSelect/TagSelect.variants.js

@@ -1,59 +1,27 @@
 import { c as e } from "../../index-BNmRGtA6.js";
-const r = e(
-  ["flex", "flex-col", "w-full", "relative", "text-zinc-500"],
-  {
-    variants: {
-      theme: {
-        colony: "",
-        kubefirst: "",
-        civo: ""
-      }
-    },
-    defaultVariants: {
-      theme: "kubefirst"
-    }
-  }
-), a = e(["my-2", "cursor-pointer"], {
-  variants: {
-    theme: {
-      colony: "",
-      kubefirst: "",
-      civo: ""
-    }
-  },
-  defaultVariants: {
-    theme: "kubefirst"
-  }
-}), i = e(
-  [
-    "border",
-    "cursor-pointer",
-    "duration-250",
-    "ease-in-out",
-    "flex",
-    "items-center",
-    "justify-between",
-    "px-2",
-    "py-1",
-    "rounded",
-    "transition-all",
-    "w-full"
-  ],
-  {
-    variants: {
-      theme: {
-        colony: "",
-        kubefirst: "",
-        civo: ""
-      }
-    },
-    defaultVariants: {
-      theme: "kubefirst"
-    }
-  }
-);
+const t = e([
+  "flex",
+  "flex-col",
+  "w-full",
+  "relative",
+  "text-zinc-500"
+]), a = e(["my-2", "cursor-pointer"]), o = e([
+  "border",
+  "cursor-pointer",
+  "duration-250",
+  "ease-in-out",
+  "flex",
+  "items-center",
+  "justify-between",
+  "px-2",
+  "py-1",
+  "rounded",
+  "transition-all",
+  "w-full",
+  "border-gray-200"
+]);
 export {
   a as labelVariants,
-  i as tagSelectVariants,
-  r as wrapperVariants
+  o as tagSelectVariants,
+  t as wrapperVariants
 };

package/dist/components/TagSelect/components/Item/Item.js

@@ -1,23 +1,21 @@
-import { jsx as t } from "react/jsx-runtime";
-import { Tag as i } from "../../../Tag/Tag.js";
-import { cn as c } from "../../../../utils/index.js";
-import { wrapperVariants as n } from "./Item.variants.js";
-import { useTagSelect as s } from "../../contexts/TagSelect.hook.js";
-import { useTheme as h } from "../../../../contexts/theme.hook.js";
-const g = ({ option: e, theme: r }) => {
-  const { theme: m } = h(), { onSelectTag: o } = s();
-  return /* @__PURE__ */ t(
+import { jsx as r } from "react/jsx-runtime";
+import { Tag as m } from "../../../Tag/Tag.js";
+import { cn as a } from "../../../../utils/index.js";
+import { wrapperVariants as c } from "./Item.variants.js";
+import { useTagSelect as i } from "../../contexts/TagSelect.hook.js";
+const d = ({ option: e, theme: t }) => {
+  const { onSelectTag: o } = i();
+  return /* @__PURE__ */ r(
     "li",
     {
       role: "option",
-      className: c(
-        n({ theme: r ?? m, isSelected: e.isSelected })
-      ),
+      "data-theme": t,
+      className: a(c({ isSelected: e.isSelected })),
       onClick: () => o(e),
-      children: /* @__PURE__ */ t(i, { ...e })
+      children: /* @__PURE__ */ r(m, { ...e })
     }
   );
 };
 export {
-  g as Item
+  d as Item
 };

package/dist/components/TagSelect/components/Item/Item.variants.js

@@ -1,13 +1,16 @@
 import { c as e } from "../../../../index-BNmRGtA6.js";
-const r = e(
-  ["cursor-pointer", "py-1.5", "px-2", "last:pb-2", "first:pt-2", "h-full"],
+const t = e(
+  [
+    "cursor-pointer",
+    "py-1.5",
+    "px-2",
+    "last:pb-2",
+    "first:pt-2",
+    "h-full",
+    "hover:bg-purple-100"
+  ],
   {
     variants: {
-      theme: {
-        colony: "",
-        kubefirst: ["hover:bg-purple-100"],
-        civo: ""
-      },
       isSelected: {
         true: "",
         false: ""
@@ -15,17 +18,15 @@ const r = e(
     },
     compoundVariants: [
       {
-        theme: "kubefirst",
         isSelected: !0,
         class: ["bg-purple-100"]
       }
     ],
     defaultVariants: {
-      theme: "kubefirst",
       isSelected: !1
     }
   }
 );
 export {
-  r as wrapperVariants
+  t as wrapperVariants
 };

package/dist/components/TagSelect/components/List/List.js

@@ -1,13 +1,12 @@
-import { jsx as e } from "react/jsx-runtime";
-import { cn as i } from "../../../../utils/index.js";
-import { Item as n } from "../Item/Item.js";
-import { wrapperVariants as p } from "./List.variants.js";
-import { useTagSelect as a } from "../../contexts/TagSelect.hook.js";
-import { useTheme as c } from "../../../../contexts/theme.hook.js";
-const d = ({ theme: m }) => {
-  const { tags: t } = a(), { theme: s } = c(), o = m ?? s;
-  return /* @__PURE__ */ e("ul", { role: "listbox", className: i(p({ theme: o })), children: t.length > 0 ? t.map((r) => /* @__PURE__ */ e(n, { theme: o, option: r }, r.id)) : /* @__PURE__ */ e("span", { className: "text-center text-sm px-4 py-2", children: "There is not options available" }) });
+import { jsx as t } from "react/jsx-runtime";
+import { cn as m } from "../../../../utils/index.js";
+import { Item as s } from "../Item/Item.js";
+import { wrapperVariants as a } from "./List.variants.js";
+import { useTagSelect as i } from "../../contexts/TagSelect.hook.js";
+const f = ({ theme: o }) => {
+  const { tags: e } = i();
+  return /* @__PURE__ */ t("ul", { role: "listbox", "data-theme": o, className: m(a()), children: e.length > 0 ? e.map((r) => /* @__PURE__ */ t(s, { option: r }, r.id)) : /* @__PURE__ */ t("span", { className: "text-center text-sm px-4 py-2", children: "There is not options available" }) });
 };
 export {
-  d as List
+  f as List
 };

package/dist/components/TagSelect/components/List/List.variants.js

@@ -1,37 +1,23 @@
-import { c as e } from "../../../../index-BNmRGtA6.js";
-const t = e(
-  [
-    "absolute",
-    "bg-white",
-    "border",
-    "duration-100",
-    "flex",
-    "flex-col",
-    "mt-0.5",
-    "rounded",
-    "shadow-sm",
-    "top-full",
-    "transition-all",
-    "w-full",
-    "z-10",
-    "animate-in",
-    "fade-in-60",
-    "zoom-in-95",
-    "overflow-hidden"
-  ],
-  {
-    variants: {
-      theme: {
-        colony: "",
-        kubefirst: "",
-        civo: ""
-      }
-    },
-    defaultVariants: {
-      theme: "kubefirst"
-    }
-  }
-);
+import { c as o } from "../../../../index-BNmRGtA6.js";
+const a = o([
+  "absolute",
+  "bg-white",
+  "border",
+  "duration-100",
+  "flex",
+  "flex-col",
+  "mt-0.5",
+  "rounded",
+  "shadow-xs",
+  "top-full",
+  "transition-all",
+  "w-full",
+  "z-10",
+  "animate-in",
+  "fade-in-50",
+  "overflow-hidden",
+  "border-gray-200"
+]);
 export {
-  t as wrapperVariants
+  a as wrapperVariants
 };

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

@@ -1,88 +1,86 @@
 import "../Item/Item.js";
-import { List as w } from "../List/List.js";
-import { jsxs as c, jsx as e } from "react/jsx-runtime";
-import { forwardRef as C, useId as b, useImperativeHandle as S } from "react";
-import { Tag as k } from "../../../Tag/Tag.js";
-import { cn as a } from "../../../../utils/index.js";
-import { useTagSelect as R } from "../../hooks/useTagSelect.js";
-import { labelVariants as I, tagSelectVariants as O, wrapperVariants as V } from "../../TagSelect.variants.js";
-import { X as j } from "../../../../x-DU-Zw-L_.js";
-import { C as y } from "../../../../chevron-up-DgLBQCKD.js";
-import { useTheme as F } from "../../../../contexts/theme.hook.js";
-import { useTagSelect as H } from "../../contexts/TagSelect.hook.js";
-const J = C(
+import { List as g } from "../List/List.js";
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import { forwardRef as w, useId as T, useImperativeHandle as b } from "react";
+import { Tag as C } from "../../../Tag/Tag.js";
+import { cn as r } from "../../../../utils/index.js";
+import { useTagSelect as S } from "../../hooks/useTagSelect.js";
+import { labelVariants as k, tagSelectVariants as R, wrapperVariants as I } from "../../TagSelect.variants.js";
+import { X as O } from "../../../../x-DU-Zw-L_.js";
+import { C as V } from "../../../../chevron-up-DgLBQCKD.js";
+import { useTagSelect as j } from "../../contexts/TagSelect.hook.js";
+const B = w(
   ({
-    label: n,
-    labelClassName: p,
-    name: s,
-    placeholder: h = "Select a value...",
+    label: o,
+    labelClassName: c,
+    name: t,
+    placeholder: p = "Select a value...",
     theme: d,
     wrapperClassName: f
-  }, u) => {
-    const l = b(), { theme: x } = F(), { selectedTags: m, isOpen: o, onOpen: N, onRemoveTag: v, inputRef: i } = H(), { wrapperRef: T, handleOpen: g } = R(), t = d ?? x;
-    return S(u, () => i.current, [i]), /* @__PURE__ */ c(
+  }, h) => {
+    const i = T(), { selectedTags: n, isOpen: s, onOpen: u, onRemoveTag: x, inputRef: l } = j(), { wrapperRef: N, handleOpen: v } = S();
+    return b(h, () => l.current, [l]), /* @__PURE__ */ m(
       "div",
       {
-        ref: T,
-        className: a(
-          V({
-            theme: t,
+        ref: N,
+        className: r(
+          I({
             className: f
           })
         ),
+        "data-theme": d,
         children: [
-          n ? /* @__PURE__ */ e(
+          o ? /* @__PURE__ */ e(
             "label",
             {
-              htmlFor: s ?? l,
-              className: a(
-                I({
-                  theme: t,
-                  className: p
+              htmlFor: t ?? i,
+              className: r(
+                k({
+                  className: c
                 })
               ),
-              onClick: () => N(!0),
-              children: n
+              onClick: () => u(!0),
+              children: o
             }
           ) : null,
-          /* @__PURE__ */ c(
+          /* @__PURE__ */ m(
             "div",
             {
-              id: s ?? l,
-              className: a(O({ theme: t })),
+              id: t ?? i,
+              className: r(R()),
               role: "combobox",
-              onClick: g,
-              "aria-expanded": o,
+              onClick: v,
+              "aria-expanded": s,
               children: [
-                m.length === 0 ? /* @__PURE__ */ e("span", { className: "text-base text-inherit select-none", children: h }) : /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-1.5", children: m.map((r) => /* @__PURE__ */ e(
-                  k,
+                n.length === 0 ? /* @__PURE__ */ e("span", { className: "text-base text-inherit select-none", children: p }) : /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-1.5", children: n.map((a) => /* @__PURE__ */ e(
+                  C,
                   {
-                    ...r,
+                    ...a,
                     className: "select-none",
-                    rightIcon: /* @__PURE__ */ e(j, { className: "w-3 h-3", onClick: () => v(r) }),
-                    "data-value": r.label
+                    rightIcon: /* @__PURE__ */ e(O, { className: "w-3 h-3", onClick: () => x(a) }),
+                    "data-value": a.label
                   },
-                  r.id
+                  a.id
                 )) }),
                 /* @__PURE__ */ e(
-                  y,
+                  V,
                   {
-                    className: a(
+                    className: r(
                       "w-4 h-4 text-inherit transition-all duration-50 shrink-0",
-                      o ? "rotate-0" : "rotate-180"
+                      s ? "rotate-0" : "rotate-180"
                     )
                   }
                 )
               ]
             }
           ),
-          /* @__PURE__ */ e("input", { ref: i, type: "text", name: s, className: "hidden" }),
-          o ? /* @__PURE__ */ e(w, { theme: t }) : null
+          /* @__PURE__ */ e("input", { ref: l, type: "text", name: t, className: "hidden" }),
+          s ? /* @__PURE__ */ e(g, {}) : null
         ]
       }
     );
   }
 );
 export {
-  J as Wrapper
+  B as Wrapper
 };

package/dist/components/TextArea/TextArea.js

@@ -1,33 +1,30 @@
-import { jsxs as d, jsx as o } from "react/jsx-runtime";
-import { forwardRef as h, useId as u } from "react";
-import { cn as p } from "../../utils/index.js";
-import { textAreaVariants as v } from "./TextArea.variants.js";
-import { useTheme as N } from "../../contexts/theme.hook.js";
-const w = h(
+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: a,
+    initialValue: m,
     label: e,
-    name: s,
-    placeholder: l,
+    name: l,
+    placeholder: s,
     rows: c = 3,
-    theme: n,
-    className: i,
+    theme: i,
+    className: n,
     ...r
-  }, f) => {
-    const t = u(), { theme: x } = N(), m = s ? `${t}-name` : t;
-    return /* @__PURE__ */ d("div", { className: "flex flex-col gap-2", children: [
-      e ? /* @__PURE__ */ o("label", { htmlFor: m, className: "cursor-pointer", children: e }) : null,
+  }, 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: m,
-          ref: f,
-          className: p(
-            v({ className: i, theme: n ?? x })
-          ),
+          id: a,
+          ref: d,
+          className: h(p({ className: n })),
           rows: c,
-          placeholder: l,
-          value: a ?? r.value,
+          placeholder: s,
+          value: m ?? r.value,
           ...r
         }
       )
@@ -35,5 +32,5 @@ const w = h(
   }
 );
 export {
-  w as TextArea
+  I as TextArea
 };