@konstructio/ui 0.0.2 → 0.0.3

package/dist/components/Button/Button.variants.js

@@ -1,42 +1,47 @@
-import { c as e } from "../../index-BwYCDOHZ.js";
+import { c as e } from "../../index-BNmRGtA6.js";
 const t = e(
   [
-    "border-2",
+    "border",
+    "cursor-pointer",
     "disabled:pointer-events-none",
+    "flex",
     "focus-visible:outline-none",
     "focus-visible:ring-1",
     "focus-visible:ring-ring",
-    "gap-1",
+    "font-semibold",
+    "gap-2",
     "inline-flex",
     "items-center",
     "justify-center",
-    "rounded-md",
-    "text-base",
+    "rounded",
     "transition-colors",
-    "whitespace-nowrap",
-    "cursor-pointer",
-    "font-semibold"
+    "whitespace-nowrap"
   ],
   {
     variants: {
       variant: {
-        primary: ["text-white", "border-current"],
+        primary: ["text-white"],
         secondary: ["bg-white"],
         danger: [
-          "border-current",
+          "border-red-600",
           "bg-red-600",
           "text-white",
-          "hover:bg-red-700"
+          "hover:bg-red-700",
+          "hover:border-red-700"
         ],
         text: ["bg-transparent", "border-transparent", "text-slate-500"]
       },
+      version: {
+        default: "",
+        alternate: ""
+      },
       theme: {
+        civo: "",
         colony: "",
-        konstruct: "",
         kubefirst: ""
       },
       size: {
-        default: "px-5 py-2"
+        default: "h-10 p-4 text-sm"
       },
       disabled: {
         true: ["text-zinc-500", "border-zinc-200", "bg-zinc-200"],
@@ -48,40 +53,133 @@ const t = e(
         variant: "primary",
         theme: "kubefirst",
         disabled: !1,
-        class: ["bg-kubefirst-purple-light", "hover:bg-kubefirst-purple-dark"]
+        class: [
+          "border-kubefirst-primary",
+          "bg-kubefirst-primary",
+          "hover:bg-kubefirst-secondary",
+          "hover:border-kubefirst-secondary"
+        ]
       },
       {
         variant: "primary",
         theme: "colony",
         disabled: !1,
-        class: ["bg-red-700", "hover:bg-red-900"]
+        class: [
+          "bg-colony-primary",
+          "border-colony-primary",
+          "hover:bg-colony-secondary",
+          "hover:border-colony-secondary"
+        ]
       },
       {
         variant: "primary",
-        theme: "konstruct",
+        theme: "civo",
         disabled: !1,
-        class: ["bg-orange-500", "hover:bg-orange-700"]
+        class: [
+          "bg-civo-primary",
+          "border-civo-primary",
+          "hover:bg-civo-secondary",
+          "hover:border-civo-secondary"
+        ]
       },
       {
         variant: "secondary",
+        theme: "kubefirst",
         disabled: !1,
         class: [
-          "text-kubefirst-purple-light",
-          "border-kubefirst-purple-light",
-          "hover:text-kubefirst-purple-dark",
-          "hover:border-kubefirst-purple-dark",
+          "text-kubefirst-primary",
+          "border-kubefirst-primary",
+          "hover:text-kubefirst-secondary",
+          "hover:border-kubefirst-secondary",
           "hover:bg-purple-50"
         ]
       },
       {
         variant: "secondary",
+        theme: "colony",
+        disabled: !1,
+        class: [
+          "text-colony-primary",
+          "border-colony-primary",
+          "hover:text-colony-secondary",
+          "hover:border-colony-secondary",
+          "hover:bg-pink-50"
+        ]
+      },
+      {
+        variant: "secondary",
+        theme: "civo",
+        disabled: !1,
+        class: [
+          "text-[#324154]",
+          "border-[#cbd5e0]",
+          "hover:text-[#5d6776]",
+          "hover:border-[#d6dde6]"
+        ]
+      },
+      {
+        variant: "primary",
         disabled: !0,
-        class: ["border-zinc-500"]
+        class: ["bg-zinc-200", "border-zinc-200", "text-zinc-500"]
+      },
+      {
+        variant: "secondary",
+        disabled: !0,
+        class: ["bg-white", "border-zinc-500", "text-zinc-500"]
+      },
+      {
+        variant: "text",
+        theme: "kubefirst",
+        disabled: !1,
+        version: "default",
+        class: ["hover:text-kubefirst-primary", "hover:bg-purple-50"]
+      },
+      {
+        variant: "text",
+        theme: "colony",
+        disabled: !1,
+        version: "default",
+        class: ["hover:text-colony-primary", "hover:bg-pink-50"]
       },
       {
         variant: "text",
+        theme: "civo",
         disabled: !1,
-        class: ["hover:text-kubefirst-purple-dark", "hover:bg-purple-50"]
+        version: "default",
+        class: ["hover:text-civo-primary", "hover:bg-blue-50"]
+      },
+      {
+        variant: "text",
+        theme: "kubefirst",
+        disabled: !1,
+        version: "alternate",
+        class: [
+          "text-kubefirst-primary",
+          "hover:text-kubefirst-primary",
+          "hover:bg-purple-50"
+        ]
+      },
+      {
+        variant: "text",
+        theme: "colony",
+        disabled: !1,
+        version: "alternate",
+        class: [
+          "text-colony-primary",
+          "hover:text-colony-primary",
+          "hover:bg-pink-50"
+        ]
+      },
+      {
+        variant: "text",
+        theme: "civo",
+        disabled: !1,
+        version: "alternate",
+        class: [
+          "text-civo-primary",
+          "hover:text-civo-primary",
+          "hover:bg-blue-50"
+        ]
       },
       {
         variant: "text",
@@ -92,6 +190,7 @@ const t = e(
     defaultVariants: {
       variant: "primary",
       theme: "kubefirst",
+      version: "default",
       size: "default",
       disabled: !1
     }

package/dist/components/Checkbox/Checkbox.js

@@ -1,17 +1,17 @@
 import { jsxs as N, jsx as p } from "react/jsx-runtime";
 import * as f from "react";
 import j, { forwardRef as S, useId as M, useCallback as A } from "react";
-import { u as H } from "../../index-CCavb-1K.js";
+import { u as H } from "../../index-DoOsnuB6.js";
 import { c as K, a as W, d as I } from "../../index-8vgf-x5i.js";
 import { u as $, a as q } from "../../index-BxeV34ij.js";
-import { P as F } from "../../index-B_GWswUP.js";
-import { P as _ } from "../../index-BJ7FQg17.js";
+import { P as F } from "../../index-D4Q2rMby.js";
+import { P as _ } from "../../index-OOfdXoxx.js";
 import { useToggle as V } from "../../hooks/useToggle.js";
 import { checkboxVariants as X, labelVariants as G } from "./Checkbox.variants.js";
 import "../../contexts/theme.context.js";
 import { useTheme as J } from "../../contexts/theme.hook.js";
 import "../../js.cookie-OLEfuq_g.js";
-import { P as y } from "../../index-DQMInta3.js";
+import { P as y } from "../../index-D68N8v8R.js";
 function w() {
   return w = Object.assign || function(e) {
     for (var s = 1; s < arguments.length; s++) {

package/dist/components/Checkbox/Checkbox.variants.d.ts

@@ -1,9 +1,9 @@
 export declare const checkboxVariants: (props?: ({
     variant?: "default" | null | undefined;
-    theme?: "kubefirst" | "konstruct" | "colony" | null | undefined;
+    theme?: "kubefirst" | "colony" | "civo" | null | undefined;
     checked?: boolean | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export declare const labelVariants: (props?: ({
     variant?: "default" | null | undefined;
-    theme?: "kubefirst" | "konstruct" | "colony" | null | undefined;
+    theme?: "kubefirst" | "colony" | "civo" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/components/Checkbox/Checkbox.variants.js

@@ -1,4 +1,4 @@
-import { c as e } from "../../index-BwYCDOHZ.js";
+import { c as e } from "../../index-BNmRGtA6.js";
 const r = e(
   [
     "cursor-pointer",
@@ -18,8 +18,8 @@ const r = e(
       },
       theme: {
         colony: "",
-        konstruct: "",
-        kubefirst: ""
+        kubefirst: "",
+        civo: ""
       },
       checked: {
         true: "",
@@ -29,21 +29,12 @@ const r = e(
     compoundVariants: [
       {
         theme: "kubefirst",
-        class: ["border-kubefirst-purple-light"]
+        class: ["border-kubefirst-primary"]
       },
       {
         theme: "kubefirst",
         checked: !0,
-        class: ["bg-kubefirst-purple-light"]
-      },
-      {
-        theme: "konstruct",
-        class: ["border-orange-600"]
-      },
-      {
-        theme: "konstruct",
-        checked: !0,
-        class: ["bg-orange-600"]
+        class: ["bg-kubefirst-primary"]
       },
       {
         theme: "colony",
@@ -67,8 +58,8 @@ const r = e(
     },
     theme: {
       colony: "",
-      konstruct: "",
-      kubefirst: ""
+      kubefirst: "",
+      civo: ""
     }
   },
   defaultVariants: {

package/dist/components/Dropdown/Dropdown.js

@@ -1,10 +1,10 @@
 import { jsx as r } from "react/jsx-runtime";
-import { forwardRef as m } from "react";
+import { forwardRef as i } from "react";
 import "./components/List/List.js";
-import { Wrapper as i } from "./components/Wrapper.js";
+import { Wrapper as t } from "./components/Wrapper.js";
 import "./contexts/dropdown.context.js";
-import { DropdownProvider as t } from "./contexts/dropdown.provider.js";
-const c = m(({ ...o }, p) => /* @__PURE__ */ r(t, { children: /* @__PURE__ */ r(i, { ref: p, ...o }) }));
+import { DropdownProvider as f } from "./contexts/dropdown.provider.js";
+const s = i(({ onChange: o, ...p }, m) => /* @__PURE__ */ r(f, { onChange: o, children: /* @__PURE__ */ r(t, { ref: m, ...p }) }));
 export {
-  c as Dropdown
+  s as Dropdown
 };

package/dist/components/Dropdown/Dropdown.types.d.ts

@@ -12,4 +12,5 @@ export interface DropdownProps extends VariantProps<typeof dropdownVariants> {
     name?: string;
     options: Option[];
     placeholder?: string;
+    onChange?: (value: Option) => void;
 }

package/dist/components/Dropdown/Dropdown.variants.d.ts

@@ -1,3 +1,3 @@
 export declare const dropdownVariants: (props?: ({
-    theme?: "kubefirst" | "konstruct" | "colony" | null | undefined;
+    theme?: "kubefirst" | "colony" | "civo" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

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

@@ -1,4 +1,4 @@
-import { c as e } from "../../index-BwYCDOHZ.js";
+import { c as e } from "../../index-BNmRGtA6.js";
 const a = e(
   [
     "border",
@@ -18,21 +18,17 @@ const a = e(
   {
     variants: {
       theme: {
-        konstruct: [
-          "aria-expanded:border-orange-400",
-          "aria-expanded:text-orange-400",
-          "focus-visible:bg-orange-100"
-        ],
         kubefirst: [
-          "aria-expanded:border-kubefirst-purple-light",
-          "aria-expanded:text-kubefirst-purple-dark",
+          "aria-expanded:border-kubefirst-primary",
+          "aria-expanded:text-kubefirst-secondary",
           "focus-visible:bg-purple-100"
         ],
         colony: [
           "aria-expanded:border-red-400",
           "aria-expanded:text-red-400",
           "focus-visible:bg-red-100"
-        ]
+        ],
+        civo: ""
       }
     },
     defaultVariants: {

package/dist/components/Dropdown/components/List/List.d.ts

@@ -1,3 +1,3 @@
-import { ElementRef, ForwardRefExoticComponent, RefAttributes } from 'react';
+import { ComponentRef, ForwardRefExoticComponent, RefAttributes } from 'react';
 import { ListProps } from './List.types';
-export declare const List: ForwardRefExoticComponent<ListProps & RefAttributes<ElementRef<'ul'>>>;
+export declare const List: ForwardRefExoticComponent<ListProps & RefAttributes<ComponentRef<'ul'>>>;

package/dist/components/Dropdown/components/List/List.types.d.ts

@@ -1,8 +1,8 @@
-import { RefObject } from 'react';
+import { ComponentRef, RefObject } from 'react';
 import { DropdownProps } from '../../Dropdown.types';
 export type ListProps = {
     options: DropdownProps['options'];
     theme: DropdownProps['theme'];
-    wrapperRef: RefObject<HTMLDivElement>;
-    wrapperInputRef: RefObject<HTMLDivElement>;
+    wrapperRef: RefObject<ComponentRef<'div'> | null>;
+    wrapperInputRef: RefObject<ComponentRef<'div'> | null>;
 };

package/dist/components/Dropdown/components/List/List.variants.d.ts

@@ -1,3 +1,3 @@
 export declare const listVariants: (props?: ({
-    theme?: "kubefirst" | "konstruct" | "colony" | null | undefined;
+    theme?: "kubefirst" | "colony" | "civo" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

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

@@ -1,4 +1,4 @@
-import { c as r } from "../../../../index-BwYCDOHZ.js";
+import { c as r } from "../../../../index-BNmRGtA6.js";
 const t = r(
   [
     "absolute",
@@ -20,8 +20,8 @@ const t = r(
     variants: {
       theme: {
         colony: ["border-red-400"],
-        konstruct: ["border-orange-400"],
-        kubefirst: ["border-kubefirst-purple-light"]
+        kubefirst: ["border-kubefirst-primary"],
+        civo: ""
       }
     },
     defaultVariants: {

package/dist/components/Dropdown/components/ListItem/ListItem.variants.d.ts

@@ -1,3 +1,3 @@
 export declare const listItemVariants: (props?: ({
-    theme?: "kubefirst" | "konstruct" | "colony" | null | undefined;
+    theme?: "kubefirst" | "colony" | "civo" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

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

@@ -1,12 +1,12 @@
-import { c as e } from "../../../../index-BwYCDOHZ.js";
+import { c as e } from "../../../../index-BNmRGtA6.js";
 const o = e(
   ["cursor-pointer", "py-1", "px-2", "h-full", "focus-visible:outline-none"],
   {
     variants: {
       theme: {
         kubefirst: ["focus:bg-purple-100", "hover:bg-purple-100"],
-        konstruct: ["focus:bg-orange-100", "hover:bg-orange-100"],
-        colony: ["focus:bg-red-100", "hover:bg-red-100"]
+        colony: ["focus:bg-red-100", "hover:bg-red-100"],
+        civo: ""
       }
     },
     defaultVariants: {

package/dist/components/Dropdown/components/Wrapper.d.ts

@@ -1,3 +1,3 @@
-import { ElementRef, ForwardRefExoticComponent, RefAttributes } from 'react';
+import { ComponentRef, ForwardRefExoticComponent, RefAttributes } from 'react';
 import { DropdownProps } from '../Dropdown.types';
-export declare const Wrapper: ForwardRefExoticComponent<DropdownProps & RefAttributes<ElementRef<'input'>>>;
+export declare const Wrapper: ForwardRefExoticComponent<DropdownProps & RefAttributes<ComponentRef<'input'>>>;

package/dist/components/Dropdown/components/Wrapper.js

@@ -9,7 +9,7 @@ import { useDropdown as U } from "../hooks/useDropdown.js";
 import { useDropdownContext as W } from "../contexts/dropdown.hook.js";
 import "../contexts/dropdown.context.js";
 import { List as q } from "./List/List.js";
-import { C as z } from "../../../chevron-up-Cmu1oXfj.js";
+import { C as z } from "../../../chevron-up-CvquEaNg.js";
 const _ = D(
   ({ theme: R, label: f, placeholder: g, name: i, options: l, defaultValue: c }, O) => {
     const p = F(), r = b(null), u = b(null), { wrapperRef: n, wrapperInputRef: d, handleOpen: j, handleOpenIfClosed: E } = U({ ulRef: u }), { isOpen: h, value: e, setValue: x, toggleOpen: w } = W(), { theme: T } = A(), v = R ?? T, C = i ? `${p}-${i}` : p;

package/dist/components/Dropdown/contexts/dropdown.provider.d.ts

@@ -1,2 +1,5 @@
 import { FC, PropsWithChildren } from 'react';
-export declare const DropdownProvider: FC<PropsWithChildren>;
+import { DropdownProps } from '../Dropdown.types';
+export declare const DropdownProvider: FC<PropsWithChildren & {
+    onChange?: DropdownProps['onChange'];
+}>;

package/dist/components/Dropdown/contexts/dropdown.provider.js

@@ -1,11 +1,22 @@
-import { jsx as p } from "react/jsx-runtime";
-import { useState as s } from "react";
-import { useToggle as l } from "../../../hooks/useToggle.js";
-import { DropdownContext as m } from "./dropdown.context.js";
-const d = ({ children: o }) => {
-  const [e, r] = l(!1), [t, n] = s(null);
-  return /* @__PURE__ */ p(m.Provider, { value: { value: t, isOpen: e, setValue: n, toggleOpen: r }, children: o });
+import { jsx as u } from "react/jsx-runtime";
+import { useState as i, useCallback as c } from "react";
+import { useToggle as d } from "../../../hooks/useToggle.js";
+import { DropdownContext as f } from "./dropdown.context.js";
+const w = ({ children: t, onChange: o }) => {
+  const [e, s] = d(!1), [l, p] = i(null), m = c(
+    (r) => {
+      o == null || o(r), p(r);
+    },
+    [o]
+  );
+  return /* @__PURE__ */ u(
+    f.Provider,
+    {
+      value: { value: l, isOpen: e, setValue: m, toggleOpen: s },
+      children: t
+    }
+  );
 };
 export {
-  d as DropdownProvider
+  w as DropdownProvider
 };

package/dist/components/Dropdown/hooks/useDropdown.d.ts

@@ -1,10 +1,10 @@
-import { ElementRef, RefObject } from 'react';
+import { ComponentRef, RefObject } from 'react';
 type UseDropDownParams = {
-    ulRef: RefObject<ElementRef<'ul'>>;
+    ulRef: RefObject<ComponentRef<'ul'> | null>;
 };
 export declare const useDropdown: ({ ulRef }: UseDropDownParams) => {
-    wrapperRef: RefObject<HTMLDivElement>;
-    wrapperInputRef: RefObject<HTMLDivElement>;
+    wrapperRef: RefObject<HTMLDivElement | null>;
+    wrapperInputRef: RefObject<HTMLDivElement | null>;
     handleOpen: () => void;
     handleOpenIfClosed: () => void;
 };

package/dist/components/Dropdown/hooks/useNavigationList.d.ts

@@ -1,8 +1,8 @@
-import { RefObject } from 'react';
+import { ComponentRef, RefObject } from 'react';
 type UseNavigationListProps = {
-    ulRef: RefObject<HTMLUListElement>;
-    wrapperRef: RefObject<HTMLDivElement>;
-    wrapperInputRef: RefObject<HTMLDivElement>;
+    ulRef: RefObject<ComponentRef<'ul'> | null>;
+    wrapperRef: RefObject<ComponentRef<'div'> | null>;
+    wrapperInputRef: RefObject<ComponentRef<'div'> | null>;
 };
 export declare const useNavigationUlList: ({ ulRef, wrapperRef, wrapperInputRef, }: UseNavigationListProps) => void;
 export {};

package/dist/components/Input/Input.js

@@ -5,7 +5,7 @@ import { inputVariants as j } from "./Input.variants.js";
 import "../../contexts/theme.context.js";
 import { useTheme as N } from "../../contexts/theme.hook.js";
 import "../../js.cookie-OLEfuq_g.js";
-import { P as l } from "../../index-DQMInta3.js";
+import { P as l } from "../../index-D68N8v8R.js";
 function p() {
   return p = Object.assign || function(e) {
     for (var o = 1; o < arguments.length; o++) {

package/dist/components/Input/Input.variants.d.ts

@@ -1,4 +1,4 @@
 export declare const inputVariants: (props?: ({
     variant?: "default" | "error" | null | undefined;
-    theme?: "kubefirst" | "konstruct" | "colony" | null | undefined;
+    theme?: "kubefirst" | "colony" | "civo" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

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

@@ -1,4 +1,4 @@
-import { c as r } from "../../index-BwYCDOHZ.js";
+import { c as r } from "../../index-BNmRGtA6.js";
 const t = r(
   [
     "bg-transparent",
@@ -27,9 +27,9 @@ const t = r(
         error: ["border-red-600", "pr-8", "focus-visible:ring-transparent"]
       },
       theme: {
-        kubefirst: "focus:ring-kubefirst-purple-light",
+        kubefirst: "focus:ring-kubefirst-primary",
         colony: "",
-        konstruct: ""
+        civo: ""
       }
     },
     defaultVariants: {

package/dist/components/Modal/Modal.js

@@ -1,9 +1,9 @@
 import "react/jsx-runtime";
-import "../../index-2hJuj4UN.js";
+import "../../index-OOfdXoxx.js";
 import "./components/Body/Body.js";
 import "./components/Footer/Footer.js";
 import "./components/Header/Header.js";
-import { M as d } from "../../Modal-CO0_SnXD.js";
+import { M as d } from "../../Modal-Bg9UG35z.js";
 import "./hooks/useModal.js";
 export {
   d as Modal

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-CCavb-1K.js";
+import { S as n } from "../../../../index-DoOsnuB6.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 n } from "react/jsx-runtime";
-import { S as m } from "../../../../index-CCavb-1K.js";
+import { S as m } from "../../../../index-DoOsnuB6.js";
 const i = ({ children: o, asChild: t, className: r }) => /* @__PURE__ */ n(t ? m : "div", { className: r, children: o });
 export {
   i as Footer

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

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

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

@@ -1,13 +1,14 @@
 import "react/jsx-runtime";
 import "react";
-import { W as x } from "../../../../Modal-CO0_SnXD.js";
+import { W as b } from "../../../../Modal-Bg9UG35z.js";
 import "../../../../Combination-Cmu9JRkv.js";
-import "../../../../index-4qm4jAkj.js";
+import "../../../../index-ffjBR8Av.js";
 import "../../../../contexts/theme.context.js";
 import "../../../../contexts/theme.hook.js";
 import "../../../../js.cookie-OLEfuq_g.js";
 import "../../hooks/useModal.js";
 import "./Wrapper.variants.js";
+import "../../../../x-CRBgmX1Q.js";
 export {
-  x as Wrapper
+  b as Wrapper
 };

package/dist/components/Modal/components/Wrapper/Wrapper.variants.d.ts

@@ -1,6 +1,6 @@
 export declare const modalVariants: (props?: ({
-    theme?: "kubefirst" | "konstruct" | "colony" | null | undefined;
+    theme?: "kubefirst" | "colony" | "civo" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export declare const buttonCloseVariants: (props?: ({
-    theme?: "kubefirst" | "konstruct" | "colony" | null | undefined;
+    theme?: "kubefirst" | "colony" | "civo" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;