@konstructio/ui 0.0.12-alpha.2 → 0.0.12-alpha.21

package/dist/components/Alert/Alert.js

@@ -1,6 +1,6 @@
 import { jsx as o, jsxs as m } from "react/jsx-runtime";
 import { useRef as V, useState as v, useMemo as x, isValidElement as k, useCallback as w, useEffect as y } from "react";
-import { V as A } from "../../index-Z1voPZOH.js";
+import { V as A } from "../../index-CbTU3cnP.js";
 import { cn as c } from "../../utils/index.js";
 import { closeButtonVariants as E, alertVariants as T } from "./Alert.variants.js";
 import { useTheme as g } from "../../contexts/theme.hook.js";

package/dist/components/AlertDialog/AlertDialog.js

@@ -1,5 +1,5 @@
 import { jsxs as t, jsx as e } from "react/jsx-runtime";
-import { R as C, A as b, P as y, O as N, C as O, T as A, D, a as T, b as v } from "../../index-3jTPaVvh.js";
+import { R as C, A as b, P as y, O as N, C as O, T as A, D, a as T, b as v } from "../../index-DUA6Y_AE.js";
 import { cn as l } from "../../utils/index.js";
 import { Button as r } from "../Button/Button.js";
 import { useAlertDialog as j } from "./hooks/useAlertDialog.js";

package/dist/components/AlertDialog/components/AlertDialogTrigger.js

@@ -1,5 +1,5 @@
 import "react/jsx-runtime";
-import { A as p } from "../../../index-3jTPaVvh.js";
+import { A as p } from "../../../index-DUA6Y_AE.js";
 import "../../Button/Button.js";
 import "../../../contexts/theme.hook.js";
 export {

package/dist/components/AlertDialog/components/index.js

@@ -1,4 +1,4 @@
-import { A as g } from "../../../index-3jTPaVvh.js";
+import { A as g } from "../../../index-DUA6Y_AE.js";
 export {
   g as AlertDialogTrigger
 };

package/dist/components/Autocomplete/Autocomplete.variants.js

@@ -7,7 +7,6 @@ const r = e(
     "border",
     "border-zinc-200",
     "bg-transparent",
-    "text-base",
     "text-zinc-700",
     "transition-colors",
     "placeholder:text-muted-foreground",

package/dist/components/Breadcrumb/Breadcrumb.variants.js

@@ -1,22 +1,25 @@
 import { c as e } from "../../index-BNmRGtA6.js";
-const a = e(["text-slate-500"], {
-  variants: {
-    theme: {
-      kubefirst: "",
-      colony: "",
-      civo: ""
+const a = e(
+  ["text-slate-500", "cursor-pointer"],
+  {
+    variants: {
+      theme: {
+        kubefirst: "",
+        colony: "",
+        civo: ""
+      },
+      size: {
+        sm: "",
+        base: "",
+        lg: "",
+        xl: ""
+      }
     },
-    size: {
-      sm: "",
-      base: "",
-      lg: "",
-      xl: ""
+    defaultVariants: {
+      theme: "kubefirst"
     }
-  },
-  defaultVariants: {
-    theme: "kubefirst"
   }
-}), s = e(["flex", "gap-1", "items-center"], {
+), s = e(["flex", "gap-1", "items-center"], {
   variants: {
     theme: {
       kubefirst: "",

package/dist/components/Checkbox/Checkbox.js

@@ -5,7 +5,7 @@ import { u as K } from "../../index-B_6_jmOO.js";
 import { a as W, c as $, b as I } from "../../index-Cva-e5M4.js";
 import { u as q, a as F } from "../../index-4ecjw_Aj.js";
 import { P as V } from "../../index-Dj1pom3_.js";
-import { P as T } from "../../index-BTeAm7mx.js";
+import { P as T } from "../../index-D7QNmo_D.js";
 import { cn as N } from "../../utils/index.js";
 import { checkboxVariants as X, labelVariants as G } from "./Checkbox.variants.js";
 import { useToggle as J } from "../../hooks/useToggle.js";

package/dist/components/Command/Command.js

@@ -0,0 +1,32 @@
+import { jsx as o, jsxs as i } from "react/jsx-runtime";
+import { R as t, D as s } from "../../index-DyKo5ZJT.js";
+import { V as p } from "../../index-CbTU3cnP.js";
+import { cn as r } from "../../utils/index.js";
+import { wrapperVariants as l } from "./Command.variants.js";
+import { DialogContent as f } from "./components/DialogContent.js";
+import { Command as c } from "./components/Command.js";
+import { CommandGroup as R } from "./components/CommandGroup.js";
+import { CommandItem as v } from "./components/CommandItem.js";
+import { CommandSeparator as G } from "./components/CommandSeparator.js";
+const g = ({
+  children: m,
+  title: a,
+  titleClassName: e,
+  wrapperClassName: n,
+  ...d
+}) => /* @__PURE__ */ o(t, { ...d, children: /* @__PURE__ */ i(f, { className: "overflow-hidden p-0 border-0 !rounded-none", children: [
+  /* @__PURE__ */ o(s, { className: r("hidden", e), children: /* @__PURE__ */ o(p, { children: a }) }),
+  /* @__PURE__ */ o(
+    c,
+    {
+      className: r(l({ className: n })),
+      children: m
+    }
+  )
+] }) });
+export {
+  g as Command,
+  R as CommandGroup,
+  v as CommandItem,
+  G as CommandSeparator
+};

package/dist/components/Command/Command.variants.js

@@ -0,0 +1,97 @@
+import { c as e } from "../../index-BNmRGtA6.js";
+const r = e([], {
+  variants: {
+    theme: {
+      colony: "",
+      kubefirst: "",
+      civo: ""
+    }
+  },
+  defaultVariants: {
+    theme: "kubefirst"
+  }
+}), o = e(
+  [
+    "[&_[cmdk-group-heading]]:font-medium",
+    "[&_[cmdk-group-heading]]:px-2",
+    "[&_[cmdk-group-heading]]:text-muted-foreground",
+    "[&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0",
+    "[&_[cmdk-group]]:px-2",
+    "[&_[cmdk-input-wrapper]_svg]:h-5",
+    "[&_[cmdk-input-wrapper]_svg]:w-5",
+    "[&_[cmdk-input]]:h-12",
+    "[&_[cmdk-item]]:px-2",
+    "[&_[cmdk-item]]:py-3",
+    "[&_[cmdk-item]_svg]:h-5",
+    "[&_[cmdk-item]_svg]:w-5",
+    "bg-popover",
+    "flex",
+    "items-center",
+    "justify-center",
+    "overflow-hidden",
+    "text-popover-foreground",
+    "border",
+    "rounded-md",
+    "border-neutral-900/35",
+    "bg-neutral-900/30"
+  ],
+  {
+    variants: {
+      theme: {
+        colony: "",
+        kubefirst: "",
+        civo: ""
+      }
+    },
+    defaultVariants: {
+      theme: "kubefirst"
+    }
+  }
+), n = e(
+  [
+    "bg-transparent",
+    "disabled:cursor-not-allowed",
+    "disabled:opacity-50",
+    "flex",
+    "h-10",
+    "outline-none",
+    "placeholder:text-muted-foreground",
+    "py-3",
+    "rounded-md",
+    "text-sm",
+    "w-full",
+    "text-white/80"
+  ],
+  {
+    variants: {
+      theme: {
+        colony: "",
+        kubefirst: "",
+        civo: ""
+      }
+    },
+    defaultVariants: {
+      theme: "kubefirst"
+    }
+  }
+), i = e(
+  ["mr-2", "h-4", "w-4", "shrink-0", "opacity-80", "text-white"],
+  {
+    variants: {
+      theme: {
+        colony: "",
+        kubefirst: "",
+        civo: ""
+      }
+    },
+    defaultVariants: {
+      theme: "kubefirst"
+    }
+  }
+);
+export {
+  r as commandVariants,
+  n as inputVariants,
+  i as searchInconInputVariants,
+  o as wrapperVariants
+};

package/dist/components/Command/components/Command.js

@@ -0,0 +1,8 @@
+import { jsx as m } from "react/jsx-runtime";
+import { forwardRef as p } from "react";
+import { V as o } from "../../../index-CzSBQN5S.js";
+const s = p(({ className: r, children: a, ...e }, i) => /* @__PURE__ */ m(o, { ref: i, className: r, ...e, children: /* @__PURE__ */ m("div", { className: "w-[500px]", children: a }) }));
+s.displayName = o.displayName;
+export {
+  s as Command
+};

package/dist/components/Command/components/CommandEmpty.js

@@ -0,0 +1,15 @@
+import { jsx as o } from "react/jsx-runtime";
+import { forwardRef as p } from "react";
+import { V as m } from "../../../index-CzSBQN5S.js";
+const r = p((t, e) => /* @__PURE__ */ o(
+  m.Empty,
+  {
+    ref: e,
+    className: "py-6 text-center text-sm",
+    ...t
+  }
+));
+r.displayName = m.Empty.displayName;
+export {
+  r as CommandEmpty
+};

package/dist/components/Command/components/CommandGroup.js

@@ -0,0 +1,19 @@
+import { jsx as e } from "react/jsx-runtime";
+import { forwardRef as p } from "react";
+import { V as o } from "../../../index-CzSBQN5S.js";
+import { cn as a } from "../../../utils/index.js";
+const t = p(({ className: r, ...m }, d) => /* @__PURE__ */ e(
+  o.Group,
+  {
+    ref: d,
+    className: a(
+      "overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground",
+      r
+    ),
+    ...m
+  }
+));
+t.displayName = o.Group.displayName;
+export {
+  t as CommandGroup
+};

package/dist/components/Command/components/CommandInput.js

@@ -0,0 +1,84 @@
+import { jsxs as y, jsx as c } from "react/jsx-runtime";
+import { V as m } from "../../../index-CzSBQN5S.js";
+import s, { forwardRef as u } from "react";
+import { cn as f } from "../../../utils/index.js";
+import { searchInconInputVariants as v, inputVariants as g } from "../Command.variants.js";
+import { P as a } from "../../../index-C5psggHV.js";
+function p() {
+  return p = Object.assign || function(r) {
+    for (var n = 1; n < arguments.length; n++) {
+      var e = arguments[n];
+      for (var t in e)
+        Object.prototype.hasOwnProperty.call(e, t) && (r[t] = e[t]);
+    }
+    return r;
+  }, p.apply(this, arguments);
+}
+function h(r, n) {
+  if (r == null) return {};
+  var e = b(r, n), t, o;
+  if (Object.getOwnPropertySymbols) {
+    var i = Object.getOwnPropertySymbols(r);
+    for (o = 0; o < i.length; o++)
+      t = i[o], !(n.indexOf(t) >= 0) && Object.prototype.propertyIsEnumerable.call(r, t) && (e[t] = r[t]);
+  }
+  return e;
+}
+function b(r, n) {
+  if (r == null) return {};
+  var e = {}, t = Object.keys(r), o, i;
+  for (i = 0; i < t.length; i++)
+    o = t[i], !(n.indexOf(o) >= 0) && (e[o] = r[o]);
+  return e;
+}
+var l = u(function(r, n) {
+  var e = r.color, t = e === void 0 ? "currentColor" : e, o = r.size, i = o === void 0 ? 24 : o, d = h(r, ["color", "size"]);
+  return /* @__PURE__ */ s.createElement("svg", p({
+    ref: n,
+    xmlns: "http://www.w3.org/2000/svg",
+    width: i,
+    height: i,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: t,
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, d), /* @__PURE__ */ s.createElement("circle", {
+    cx: "11",
+    cy: "11",
+    r: "8"
+  }), /* @__PURE__ */ s.createElement("line", {
+    x1: "21",
+    y1: "21",
+    x2: "16.65",
+    y2: "16.65"
+  }));
+});
+l.propTypes = {
+  color: a.string,
+  size: a.oneOfType([a.string, a.number])
+};
+l.displayName = "Search";
+const x = u(({ className: r, ...n }, e) => /* @__PURE__ */ y(
+  "div",
+  {
+    className: "flex items-center px-3 border-b border-neutral-900/35",
+    "cmdk-input-wrapper": "",
+    children: [
+      /* @__PURE__ */ c(l, { className: f(v({ className: r })) }),
+      /* @__PURE__ */ c(
+        m.Input,
+        {
+          ref: e,
+          className: f(g({ className: r })),
+          ...n
+        }
+      )
+    ]
+  }
+));
+x.displayName = m.Input.displayName;
+export {
+  x as CommandInput
+};

package/dist/components/Command/components/CommandItem.js

@@ -0,0 +1,29 @@
+import { jsx as d } from "react/jsx-runtime";
+import { forwardRef as i, useContext as p, useCallback as c } from "react";
+import { V as r } from "../../../index-CzSBQN5S.js";
+import { cn as l } from "../../../utils/index.js";
+import { CommandContext as u } from "../contexts/Command.context.js";
+const f = i(({ className: a, onSelect: e, ...s }, o) => {
+  const { setOpen: t } = p(u), n = c(
+    (m) => {
+      e == null || e(m), t(!1);
+    },
+    [t, e]
+  );
+  return /* @__PURE__ */ d(
+    r.Item,
+    {
+      ref: o,
+      className: l(
+        "relative flex cursor-pointer gap-2 select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+        a
+      ),
+      onSelect: n,
+      ...s
+    }
+  );
+});
+f.displayName = r.Item.displayName;
+export {
+  f as CommandItem
+};

package/dist/components/Command/components/CommandList.js

@@ -0,0 +1,16 @@
+import { jsx as i } from "react/jsx-runtime";
+import { forwardRef as s } from "react";
+import { V as o } from "../../../index-CzSBQN5S.js";
+import { cn as t } from "../../../utils/index.js";
+const e = s(({ className: m, ...r }, a) => /* @__PURE__ */ i(
+  o.List,
+  {
+    ref: a,
+    className: t("max-h-[300px] overflow-y-auto overflow-x-hidden", m),
+    ...r
+  }
+));
+e.displayName = o.List.displayName;
+export {
+  e as CommandList
+};

package/dist/components/Command/components/CommandSeparator.js

@@ -0,0 +1,16 @@
+import { jsx as e } from "react/jsx-runtime";
+import { forwardRef as p } from "react";
+import { V as r } from "../../../index-CzSBQN5S.js";
+import { cn as t } from "../../../utils/index.js";
+const s = p(({ className: o, ...a }, m) => /* @__PURE__ */ e(
+  r.Separator,
+  {
+    ref: m,
+    className: t("-mx-1 h-px border-t border-neutral-900/45 mb-2", o),
+    ...a
+  }
+));
+s.displayName = r.Separator.displayName;
+export {
+  s as CommandSeparator
+};

package/dist/components/Command/components/CommandShortcut.js

@@ -0,0 +1,19 @@
+import { jsx as m } from "react/jsx-runtime";
+import { cn as r } from "../../../utils/index.js";
+const a = ({
+  className: t,
+  ...o
+}) => /* @__PURE__ */ m(
+  "span",
+  {
+    className: r(
+      "ml-auto text-xs tracking-widest text-muted-foreground",
+      t
+    ),
+    ...o
+  }
+);
+a.displayName = "CommandShortcut";
+export {
+  a as CommandShortcut
+};

package/dist/components/Command/components/DialogContent.js

@@ -0,0 +1,31 @@
+import { jsxs as t, jsx as a } from "react/jsx-runtime";
+import { forwardRef as i } from "react";
+import { a as r, C as o, b as l } from "../../../index-DyKo5ZJT.js";
+import { cn as m } from "../../../utils/index.js";
+import { DialogOverlay as p } from "./DialogOverlay.js";
+import { X as c } from "../../../x-DU-Zw-L_.js";
+const f = i(({ className: e, children: s, ...n }, d) => /* @__PURE__ */ t(r, { children: [
+  /* @__PURE__ */ a(p, {}),
+  /* @__PURE__ */ t(
+    o,
+    {
+      ref: d,
+      className: m(
+        "fixed text-white left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
+        e
+      ),
+      ...n,
+      children: [
+        s,
+        /* @__PURE__ */ t(l, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground text-white", children: [
+          /* @__PURE__ */ a(c, { className: "h-4 w-4" }),
+          /* @__PURE__ */ a("span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
+    }
+  )
+] }));
+f.displayName = o.displayName;
+export {
+  f as DialogContent
+};

package/dist/components/Command/components/DialogOverlay.js

@@ -0,0 +1,19 @@
+import { jsx as s } from "react/jsx-runtime";
+import { forwardRef as i } from "react";
+import { O as a } from "../../../index-DyKo5ZJT.js";
+import { cn as m } from "../../../utils/index.js";
+const r = i(({ className: t, ...e }, o) => /* @__PURE__ */ s(
+  a,
+  {
+    ref: o,
+    className: m(
+      "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      t
+    ),
+    ...e
+  }
+));
+r.displayName = a.displayName;
+export {
+  r as DialogOverlay
+};

package/dist/components/Command/components/index.js

@@ -0,0 +1,20 @@
+import { CommandEmpty as r } from "./CommandEmpty.js";
+import { CommandGroup as p } from "./CommandGroup.js";
+import { CommandInput as a } from "./CommandInput.js";
+import { CommandItem as f } from "./CommandItem.js";
+import { CommandList as C } from "./CommandList.js";
+import { CommandSeparator as u } from "./CommandSeparator.js";
+import { CommandShortcut as I } from "./CommandShortcut.js";
+import { DialogContent as c } from "./DialogContent.js";
+import { Command as h } from "./Command.js";
+export {
+  h as Command,
+  r as CommandEmpty,
+  p as CommandGroup,
+  a as CommandInput,
+  f as CommandItem,
+  C as CommandList,
+  u as CommandSeparator,
+  I as CommandShortcut,
+  c as DialogContent
+};

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

@@ -0,0 +1,13 @@
+import { createContext as e } from "react";
+const t = {
+  isOpen: !1,
+  setOpen: () => {
+    throw new Error("onOpen is not implemented");
+  },
+  toggleOpen: () => {
+    throw new Error("toggleOpen is not implemented");
+  }
+}, o = e(t);
+export {
+  o as CommandContext
+};

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

@@ -0,0 +1,24 @@
+import { CommandContext as s } from "./Command.context.js";
+import { jsx as a } from "react/jsx-runtime";
+import { useCallback as e } from "react";
+import { useToggle as p } from "../../../hooks/useToggle.js";
+const f = ({ children: t }) => {
+  const [r, o] = p(!1), n = e(
+    (l) => o(l),
+    [o]
+  ), m = e(() => o(), [o]);
+  return /* @__PURE__ */ a(
+    s.Provider,
+    {
+      value: {
+        isOpen: r,
+        setOpen: n,
+        toggleOpen: m
+      },
+      children: t
+    }
+  );
+};
+export {
+  f as CommandProvider
+};

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

@@ -0,0 +1,6 @@
+import { CommandContext as r } from "./Command.context.js";
+import { CommandProvider as t } from "./Command.provider.js";
+export {
+  r as CommandContext,
+  t as CommandProvider
+};

package/dist/components/Dropdown/Dropdown.js

@@ -1,8 +1,8 @@
-import { jsx as r } from "react/jsx-runtime";
-import { forwardRef as f } from "react";
-import { DropdownProvider as i } from "./contexts/dropdown.provider.js";
-import { Wrapper as t } from "./components/Wrapper.js";
-const a = f(({ onChange: o, ...p }, m) => /* @__PURE__ */ r(i, { onChange: o, children: /* @__PURE__ */ r(t, { ref: m, ...p }) }));
+import { jsx as o } from "react/jsx-runtime";
+import { forwardRef as t } from "react";
+import { DropdownProvider as d } from "./contexts/dropdown.provider.js";
+import { Wrapper as e } from "./components/Wrapper.js";
+const x = t(({ onChange: p, value: m, name: r, ...f }, i) => /* @__PURE__ */ o(d, { onChange: p, value: m, name: r, children: /* @__PURE__ */ o(e, { name: r, ref: i, ...f }) }));
 export {
-  a as Dropdown
+  x as Dropdown
 };

package/dist/components/Dropdown/Dropdown.variants.js

@@ -1,5 +1,5 @@
 import { c as e } from "../../index-BNmRGtA6.js";
-const a = e(
+const t = e(
   [
     "border",
     "cursor-pointer",
@@ -13,7 +13,8 @@ const a = e(
     "rounded-md",
     "transition-all",
     "w-full",
-    "outline-none"
+    "outline-none",
+    "h-9"
   ],
   {
     variants: {
@@ -35,7 +36,25 @@ const a = e(
       theme: "kubefirst"
     }
   }
+), a = e(
+  [
+    "mb-1",
+    "cursor-pointer",
+    "text-[14px]",
+    "leading-[20px]",
+    "tracking-[0.1px]"
+  ],
+  {
+    variants: {
+      theme: {
+        kubefirst: "",
+        colony: "",
+        civo: ""
+      }
+    }
+  }
 );
 export {
-  a as dropdownVariants
+  t as dropdownVariants,
+  a as labelVariants
 };