@konstructio/ui 0.1.0-alpha.2 → 0.1.0-alpha.4

package/dist/components/Input/Input.js

@@ -1,100 +1,39 @@
-import { jsxs as O, jsx as c } from "react/jsx-runtime";
-import l, { forwardRef as p, useState as E, useId as k } from "react";
-import { cn as w } from "../../utils/index.js";
-import { inputVariants as z } from "./Input.variants.js";
+import { jsxs as h, jsx as l } from "react/jsx-runtime";
+import s, { forwardRef as v, useId as E, useState as _ } from "react";
+import { cn as d } from "../../utils/index.js";
+import { inputVariants as k } from "./Input.variants.js";
 import { P as a } from "../../index-C5psggHV.js";
-function u() {
-  return u = Object.assign || function(e) {
-    for (var o = 1; o < arguments.length; o++) {
-      var r = arguments[o];
-      for (var t in r)
-        Object.prototype.hasOwnProperty.call(r, t) && (e[t] = r[t]);
-    }
-    return e;
-  }, u.apply(this, arguments);
-}
-function N(e, o) {
-  if (e == null) return {};
-  var r = $(e, o), t, n;
-  if (Object.getOwnPropertySymbols) {
-    var i = Object.getOwnPropertySymbols(e);
-    for (n = 0; n < i.length; n++)
-      t = i[n], !(o.indexOf(t) >= 0) && Object.prototype.propertyIsEnumerable.call(e, t) && (r[t] = e[t]);
-  }
-  return r;
-}
-function $(e, o) {
-  if (e == null) return {};
-  var r = {}, t = Object.keys(e), n, i;
-  for (i = 0; i < t.length; i++)
-    n = t[i], !(o.indexOf(n) >= 0) && (r[n] = e[n]);
-  return r;
-}
-var h = p(function(e, o) {
-  var r = e.color, t = r === void 0 ? "currentColor" : r, n = e.size, i = n === void 0 ? 24 : n, s = N(e, ["color", "size"]);
-  return /* @__PURE__ */ l.createElement("svg", u({
-    ref: o,
-    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"
-  }, s), /* @__PURE__ */ l.createElement("circle", {
-    cx: "12",
-    cy: "12",
-    r: "10"
-  }), /* @__PURE__ */ l.createElement("line", {
-    x1: "12",
-    y1: "8",
-    x2: "12",
-    y2: "12"
-  }), /* @__PURE__ */ l.createElement("line", {
-    x1: "12",
-    y1: "16",
-    x2: "12.01",
-    y2: "16"
-  }));
-});
-h.propTypes = {
-  color: a.string,
-  size: a.oneOfType([a.string, a.number])
-};
-h.displayName = "AlertCircle";
 function m() {
   return m = Object.assign || function(e) {
-    for (var o = 1; o < arguments.length; o++) {
-      var r = arguments[o];
-      for (var t in r)
-        Object.prototype.hasOwnProperty.call(r, t) && (e[t] = r[t]);
+    for (var r = 1; r < arguments.length; r++) {
+      var o = arguments[r];
+      for (var t in o)
+        Object.prototype.hasOwnProperty.call(o, t) && (e[t] = o[t]);
     }
     return e;
   }, m.apply(this, arguments);
 }
-function _(e, o) {
+function z(e, r) {
   if (e == null) return {};
-  var r = L(e, o), t, n;
+  var o = L(e, r), t, n;
   if (Object.getOwnPropertySymbols) {
     var i = Object.getOwnPropertySymbols(e);
     for (n = 0; n < i.length; n++)
-      t = i[n], !(o.indexOf(t) >= 0) && Object.prototype.propertyIsEnumerable.call(e, t) && (r[t] = e[t]);
+      t = i[n], !(r.indexOf(t) >= 0) && Object.prototype.propertyIsEnumerable.call(e, t) && (o[t] = e[t]);
   }
-  return r;
+  return o;
 }
-function L(e, o) {
+function L(e, r) {
   if (e == null) return {};
-  var r = {}, t = Object.keys(e), n, i;
+  var o = {}, t = Object.keys(e), n, i;
   for (i = 0; i < t.length; i++)
-    n = t[i], !(o.indexOf(n) >= 0) && (r[n] = e[n]);
-  return r;
+    n = t[i], !(r.indexOf(n) >= 0) && (o[n] = e[n]);
+  return o;
 }
-var v = p(function(e, o) {
-  var r = e.color, t = r === void 0 ? "currentColor" : r, n = e.size, i = n === void 0 ? 24 : n, s = _(e, ["color", "size"]);
-  return /* @__PURE__ */ l.createElement("svg", m({
-    ref: o,
+var w = v(function(e, r) {
+  var o = e.color, t = o === void 0 ? "currentColor" : o, n = e.size, i = n === void 0 ? 24 : n, c = z(e, ["color", "size"]);
+  return /* @__PURE__ */ s.createElement("svg", m({
+    ref: r,
     xmlns: "http://www.w3.org/2000/svg",
     width: i,
     height: i,
@@ -104,51 +43,51 @@ var v = p(function(e, o) {
     strokeWidth: "2",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }, s), /* @__PURE__ */ l.createElement("path", {
+  }, c), /* @__PURE__ */ s.createElement("path", {
     d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"
-  }), /* @__PURE__ */ l.createElement("line", {
+  }), /* @__PURE__ */ s.createElement("line", {
     x1: "1",
     y1: "1",
     x2: "23",
     y2: "23"
   }));
 });
-v.propTypes = {
+w.propTypes = {
   color: a.string,
   size: a.oneOfType([a.string, a.number])
 };
-v.displayName = "EyeOff";
-function y() {
-  return y = Object.assign || function(e) {
-    for (var o = 1; o < arguments.length; o++) {
-      var r = arguments[o];
-      for (var t in r)
-        Object.prototype.hasOwnProperty.call(r, t) && (e[t] = r[t]);
+w.displayName = "EyeOff";
+function g() {
+  return g = Object.assign || function(e) {
+    for (var r = 1; r < arguments.length; r++) {
+      var o = arguments[r];
+      for (var t in o)
+        Object.prototype.hasOwnProperty.call(o, t) && (e[t] = o[t]);
     }
     return e;
-  }, y.apply(this, arguments);
+  }, g.apply(this, arguments);
 }
-function W(e, o) {
+function I(e, r) {
   if (e == null) return {};
-  var r = I(e, o), t, n;
+  var o = M(e, r), t, n;
   if (Object.getOwnPropertySymbols) {
     var i = Object.getOwnPropertySymbols(e);
     for (n = 0; n < i.length; n++)
-      t = i[n], !(o.indexOf(t) >= 0) && Object.prototype.propertyIsEnumerable.call(e, t) && (r[t] = e[t]);
+      t = i[n], !(r.indexOf(t) >= 0) && Object.prototype.propertyIsEnumerable.call(e, t) && (o[t] = e[t]);
   }
-  return r;
+  return o;
 }
-function I(e, o) {
+function M(e, r) {
   if (e == null) return {};
-  var r = {}, t = Object.keys(e), n, i;
+  var o = {}, t = Object.keys(e), n, i;
   for (i = 0; i < t.length; i++)
-    n = t[i], !(o.indexOf(n) >= 0) && (r[n] = e[n]);
-  return r;
+    n = t[i], !(r.indexOf(n) >= 0) && (o[n] = e[n]);
+  return o;
 }
-var g = p(function(e, o) {
-  var r = e.color, t = r === void 0 ? "currentColor" : r, n = e.size, i = n === void 0 ? 24 : n, s = W(e, ["color", "size"]);
-  return /* @__PURE__ */ l.createElement("svg", y({
-    ref: o,
+var x = v(function(e, r) {
+  var o = e.color, t = o === void 0 ? "currentColor" : o, n = e.size, i = n === void 0 ? 24 : n, c = I(e, ["color", "size"]);
+  return /* @__PURE__ */ s.createElement("svg", g({
+    ref: r,
     xmlns: "http://www.w3.org/2000/svg",
     width: i,
     height: i,
@@ -158,64 +97,94 @@ var g = p(function(e, o) {
     strokeWidth: "2",
     strokeLinecap: "round",
     strokeLinejoin: "round"
-  }, s), /* @__PURE__ */ l.createElement("path", {
+  }, c), /* @__PURE__ */ s.createElement("path", {
     d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"
-  }), /* @__PURE__ */ l.createElement("circle", {
+  }), /* @__PURE__ */ s.createElement("circle", {
     cx: "12",
     cy: "12",
     r: "3"
   }));
 });
-g.propTypes = {
+x.propTypes = {
   color: a.string,
   size: a.oneOfType([a.string, a.number])
 };
-g.displayName = "Eye";
-const T = p(
+x.displayName = "Eye";
+const V = "data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='currentColor'%20xmlns='http://www.w3.org/2000/svg'%20%3e%3cg%20id='Icon'%20clip-path='url(%23clip0_252_122)'%3e%3cpath%20id='Vector'%20d='M12.9167%2011.6667H12.2583L12.025%2011.4417C12.8417%2010.4917%2013.3333%209.25833%2013.3333%207.91667C13.3333%204.925%2010.9083%202.5%207.91667%202.5C4.925%202.5%202.5%204.925%202.5%207.91667C2.5%2010.9083%204.925%2013.3333%207.91667%2013.3333C9.25833%2013.3333%2010.4917%2012.8417%2011.4417%2012.025L11.6667%2012.2583V12.9167L15.8333%2017.075L17.075%2015.8333L12.9167%2011.6667ZM7.91667%2011.6667C5.84167%2011.6667%204.16667%209.99167%204.16667%207.91667C4.16667%205.84167%205.84167%204.16667%207.91667%204.16667C9.99167%204.16667%2011.6667%205.84167%2011.6667%207.91667C11.6667%209.99167%209.99167%2011.6667%207.91667%2011.6667Z'%20fill='currentColor'%20/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_252_122'%3e%3crect%20width='20'%20height='20'%20fill='currentColor'%20/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e", W = "data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='currentColor'%20xmlns='http://www.w3.org/2000/svg'%20%3e%3cg%3e%3cpath%20d='M9.16663%2012.5H10.8333V14.1667H9.16663V12.5ZM9.16663%205.83335H10.8333V10.8334H9.16663V5.83335ZM9.99163%201.66669C5.39163%201.66669%201.66663%205.40002%201.66663%2010C1.66663%2014.6%205.39163%2018.3334%209.99163%2018.3334C14.6%2018.3334%2018.3333%2014.6%2018.3333%2010C18.3333%205.40002%2014.6%201.66669%209.99163%201.66669ZM9.99996%2016.6667C6.31663%2016.6667%203.33329%2013.6834%203.33329%2010C3.33329%206.31669%206.31663%203.33335%209.99996%203.33335C13.6833%203.33335%2016.6666%206.31669%2016.6666%2010C16.6666%2013.6834%2013.6833%2016.6667%209.99996%2016.6667Z'%20fill='currentColor'%20/%3e%3c/g%3e%3c/svg%3e", $ = v(
   ({
     className: e,
-    error: o,
-    label: r,
-    labelClassName: t,
-    name: n,
-    type: i,
-    theme: s,
-    ...b
-  }, x) => {
-    const [f, j] = E(!1), d = k(), P = f ? g : v;
-    return /* @__PURE__ */ O("div", { className: "flex flex-col gap-1.5 w-full", "data-theme": s, children: [
-      r ? /* @__PURE__ */ c("label", { htmlFor: d, className: w("cursor-pointer", t), children: r }) : null,
-      /* @__PURE__ */ O("div", { className: "relative", children: [
-        /* @__PURE__ */ c(
+    error: r,
+    isRequired: o = !1,
+    isSearch: t = !1,
+    label: n,
+    labelClassName: i,
+    name: c,
+    theme: b,
+    type: f = "text",
+    helperText: y,
+    ...C
+  }, j) => {
+    const O = E(), [u, N] = _(() => f !== "password"), p = typeof r == "string" && r.length >= 0, P = u ? x : w;
+    return /* @__PURE__ */ h("div", { className: "flex flex-col gap-2 w-full relative", "data-theme": b, children: [
+      n ? /* @__PURE__ */ h(
+        "label",
+        {
+          htmlFor: O,
+          className: d(
+            "cursor-pointer text-slate-500 flex gap-1 text-sm font-medium",
+            i
+          ),
+          children: [
+            n,
+            " ",
+            o ? /* @__PURE__ */ l("span", { className: "text-red-600 text-xs mt-0.5", children: "*" }) : null
+          ]
+        }
+      ) : null,
+      /* @__PURE__ */ h("div", { className: "relative", children: [
+        t ? /* @__PURE__ */ l(
+          "i",
+          {
+            className: d(
+              "absolute left-2.5 top-1/2 -translate-y-[50%] text-slate-400",
+              p && "text-red-600"
+            ),
+            children: /* @__PURE__ */ l(V, { className: "w-5 h-5" })
+          }
+        ) : null,
+        /* @__PURE__ */ l(
           "input",
           {
-            id: d,
-            ref: x,
-            name: n,
-            type: f ? "text" : i,
-            className: w(
-              z({
+            id: O,
+            ref: j,
+            name: c,
+            type: u ? "text" : "password",
+            className: d(
+              k({
                 className: e,
-                variant: o ? "error" : "default"
-              })
+                variant: p ? "error" : "default"
+              }),
+              (f === "password" || p) && "pr-10",
+              t && "pl-8"
             ),
-            ...b
+            ...C
           }
         ),
-        o ? /* @__PURE__ */ c("i", { className: "absolute right-3 text-red-600 top-0 translate-y-[40%]", children: /* @__PURE__ */ c(h, { className: "w-5 h-5" }) }) : null,
-        i === "password" && !o ? /* @__PURE__ */ c("i", { className: "absolute right-3 text-slate-400 top-0 translate-y-[40%]", children: /* @__PURE__ */ c(
+        p ? /* @__PURE__ */ l("i", { className: "absolute right-3 text-red-600 top-1/2 -translate-y-[50%]", children: /* @__PURE__ */ l(W, { className: "w-5 h-5" }) }) : null,
+        f === "password" && !r ? /* @__PURE__ */ l("i", { className: "absolute right-3 text-slate-400 top-1/2 -translate-y-[50%]", children: /* @__PURE__ */ l(
           P,
           {
             className: "w-5 h-5 cursor-pointer",
-            onClick: () => j(!f)
+            onClick: () => N(!u)
           }
         ) }) : null
       ] }),
-      o ? /* @__PURE__ */ c("span", { className: "text-xs text-red-600 -mt-0.5", children: o }) : null
+      r ? /* @__PURE__ */ l("span", { className: "text-xs text-red-600", children: r }) : null,
+      !r && y ? /* @__PURE__ */ l("span", { className: "text-xs text-slate-600", children: y }) : null
     ] });
   }
 );
-T.displayName = "Input";
+$.displayName = "Input";
 export {
-  T as Input
+  $ as Input
 };

package/dist/components/Input/Input.variants.js

@@ -1,24 +1,26 @@
 import { c as r } from "../../index-BNmRGtA6.js";
-const i = r(
+const a = r(
   [
     "bg-white",
+    "border-gray-300",
     "border",
-    "border-zinc-200",
+    "civo:focus:ring-civo-primary",
+    "disabled:bg-gray-50",
     "disabled:cursor-not-allowed",
-    "disabled:opacity-50",
+    "disabled:text-slate-500",
     "flex",
     "focus-visible:outline-none",
     "focus-visible:ring-1",
-    "h-9",
-    "placeholder:text-muted-foreground",
-    "pl-3",
-    "pr-10",
-    "py-1",
-    "rounded-md",
-    "shadow-2xs",
-    "transition-colors",
+    "focus:ring-kubefirst-primary",
+    "h-10",
+    "placeholder:text-slate-400",
+    "px-2.5",
+    "py-2",
+    "rounded",
+    "text-slate-800",
+    "text-sm",
     "w-full",
-    "focus:ring-kubefirst-primary"
+    "transition-all"
   ],
   {
     variants: {
@@ -33,5 +35,5 @@ const i = r(
   }
 );
 export {
-  i as inputVariants
+  a as inputVariants
 };

package/dist/components/Loading/Loading.js

@@ -1,9 +1,9 @@
 import { jsx as e } from "react/jsx-runtime";
 import { cn as c } from "../../utils/index.js";
 import { loadingVariants as i } from "./Loading.variants.js";
-import { c as t } from "../../createLucideIcon-CoF3ywd5.js";
+import { c as t } from "../../createLucideIcon-vyksFS6P.js";
 /**
-* @license lucide-react v0.488.0 - ISC
+* @license lucide-react v0.511.0 - ISC
 *
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.

package/dist/components/Modal/Modal.js

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
 import "react";
-import "../../index-g-TFwd6Y.js";
-import { M as d } from "../../Modal-i7eolhYH.js";
+import "../../index-BCGvACM9.js";
+import { M as d } from "../../Modal-DXYBiafI.js";
 import "./components/Header/Header.js";
 import "./components/Body/Body.js";
 import "./components/Footer/Footer.js";

package/dist/components/Modal/components/Body/Body.js

@@ -1,5 +1,5 @@
 import { jsx as r } from "react/jsx-runtime";
-import { S as n } from "../../../../index-Bk324h27.js";
+import { S as n } from "../../../../index-B5MIi2tR.js";
 import { cn as e } from "../../../../utils/index.js";
 const i = ({ children: o, asChild: t, className: m }) => /* @__PURE__ */ r(t ? n : "div", { className: e("flex-1", m), children: o });
 export {

package/dist/components/Modal/components/Footer/Footer.js

@@ -1,5 +1,5 @@
 import { jsx as m } from "react/jsx-runtime";
-import { S as n } from "../../../../index-Bk324h27.js";
+import { S as n } from "../../../../index-B5MIi2tR.js";
 import { cn as e } from "../../../../utils/index.js";
 const a = ({ children: o, asChild: r, className: t }) => /* @__PURE__ */ m(r ? n : "div", { className: e("border-zinc-200", t), children: o });
 export {

package/dist/components/Modal/components/Header/Header.js

@@ -1,5 +1,5 @@
 import { jsx as m } from "react/jsx-runtime";
-import { S as n } from "../../../../index-Bk324h27.js";
+import { S as n } from "../../../../index-B5MIi2tR.js";
 import { cn as e } from "../../../../utils/index.js";
 const a = ({ children: o, asChild: r, className: t }) => /* @__PURE__ */ m(r ? n : "div", { className: e("border-zinc-200", t), children: o });
 export {

package/dist/components/Modal/components/Wrapper/Wrapper.js

@@ -1,8 +1,8 @@
 import "react/jsx-runtime";
-import "../../../../index-CWKdynYu.js";
+import "../../../../index--EmNlyHx.js";
 import "react";
-import { W as f } from "../../../../Modal-i7eolhYH.js";
-import "../../../../Combination-b348x__d.js";
+import { W as f } from "../../../../Modal-DXYBiafI.js";
+import "../../../../Combination-Cvr3uETz.js";
 import "../../../../utils/index.js";
 import "./Wrapper.variants.js";
 import "../../../../x-DU-Zw-L_.js";

package/dist/components/Modal/components/index.js

@@ -1,7 +1,7 @@
 import { Body as e } from "./Body/Body.js";
 import { Footer as t } from "./Footer/Footer.js";
 import { Header as m } from "./Header/Header.js";
-import { W as a } from "../../../Modal-i7eolhYH.js";
+import { W as a } from "../../../Modal-DXYBiafI.js";
 export {
   e as Body,
   t as Footer,

package/dist/components/NumberInput/NumberInput.js

@@ -1,5 +1,5 @@
 import { jsxs as m, jsx as u } from "react/jsx-runtime";
-import { R as O } from "../../index-CWKdynYu.js";
+import { R as O } from "../../index--EmNlyHx.js";
 import p, { forwardRef as d, useId as N, useCallback as w } from "react";
 import { cn as y } from "../../utils/index.js";
 import { labelVariants as z, buttonVariants as j, numberInputVariants as _ } from "./NumberInput.variants.js";

package/dist/components/Radio/Radio.variants.js

@@ -12,10 +12,10 @@ const a = e(
       disabled: !1
     }
   }
-), c = e(
+), o = e(
   [
     "border",
-    "border-zinc-400",
+    "border-gray-300",
     "duration-300",
     "inline-block",
     "rounded-full",
@@ -52,15 +52,17 @@ const a = e(
         checked: [!0, !1],
         class: [
           "peer-checked:border-kubefirst-primary",
-          "peer-checked:before:bg-kubefirst-primary"
+          "peer-checked:before:bg-kubefirst-primary",
+          "civo:peer-checked:border-civo-primary",
+          "civo:peer-checked:before:bg-civo-primary"
         ]
       },
       {
         disabled: !0,
         checked: !0,
         class: [
-          "peer-checked:border-zinc-400",
-          "peer-checked:before:bg-zinc-400",
+          "peer-checked:border-gray-300",
+          "peer-checked:before:bg-gray-300",
           "cursor-not-allowed",
           "[&+span]:cursor-not-allowed"
         ]
@@ -69,12 +71,12 @@ const a = e(
         disabled: !0,
         checked: !1,
         class: [
-          "peer-checked:border-zinc-300",
-          "peer-checked:border-zinc-300",
-          "peer-checked:before:bg-zinc-300",
+          "peer-checked:border-gray-200",
+          "peer-checked:border-gray-200",
+          "peer-checked:before:bg-gray-200",
           "cursor-not-allowed",
           "[&+span]:cursor-not-allowed",
-          "bg-zinc-50"
+          "bg-gray-50"
         ]
       }
     ],
@@ -82,9 +84,9 @@ const a = e(
       disabled: !1
     }
   }
-), o = e(["text-sm", "text-zinc-700"]);
+), c = e(["text-sm", "text-zinc-700"]);
 export {
-  o as labelRadioVariants,
-  c as radioVariants,
+  c as labelRadioVariants,
+  o as radioVariants,
   a as wrapperRadioVariants
 };

package/dist/components/RadioGroup/RadioGroup.js

@@ -1,5 +1,5 @@
 import { jsx as r } from "react/jsx-runtime";
-import { S as x } from "../../index-Bk324h27.js";
+import { S as x } from "../../index-B5MIi2tR.js";
 import { useState as G, useCallback as R } from "react";
 import { cn as m } from "../../utils/index.js";
 import { Radio as b } from "../Radio/Radio.js";

package/dist/components/Range/Range.js

@@ -1,5 +1,5 @@
 import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { R as g, T as R, a as V, b as c } from "../../index-BOx5P4tS.js";
+import { R as g, T as R, a as V, b as c } from "../../index-BvCZBMfr.js";
 import { forwardRef as v, useRef as b, useState as j, useImperativeHandle as k, useEffect as w, useCallback as y } from "react";
 import { cn as a } from "../../utils/index.js";
 import { rangeOutsideVariants as C, trackVariants as T, thumbVariants as i, rangeVariants as S } from "./Range.variants.js";

package/dist/components/Slider/Slider.js

@@ -1,5 +1,5 @@
 import { jsxs as l, jsx as a } from "react/jsx-runtime";
-import { R as x, T as N, b as v } from "../../index-BOx5P4tS.js";
+import { R as x, T as N, b as v } from "../../index-BvCZBMfr.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";