@konstructio/ui 0.0.2

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

@@ -0,0 +1,61 @@
+import { c as t } from "../../index-BwYCDOHZ.js";
+const s = t(["flex", "gap-1.5", "items-center"], {
+  variants: {
+    theme: {
+      kubefirst: "",
+      konstruct: "",
+      colony: ""
+    },
+    size: {
+      sm: "",
+      base: "",
+      lg: "",
+      xl: ""
+    }
+  },
+  defaultVariants: {
+    theme: "kubefirst",
+    size: "base"
+  }
+}), a = t(["text-slate-400", "font-semibold"], {
+  variants: {
+    theme: {
+      kubefirst: "",
+      konstruct: "",
+      colony: ""
+    },
+    size: {
+      sm: "text-sm",
+      base: "text-base",
+      lg: "text-lg",
+      xl: "text-xl"
+    }
+  },
+  defaultVariants: {
+    theme: "kubefirst",
+    size: "base"
+  }
+}), r = t("", {
+  variants: {
+    theme: {
+      kubefirst: "text-kubefirst-purple-light",
+      konstruct: "text-orange-500",
+      colony: "text-red-500"
+    },
+    size: {
+      sm: ["w-2", "h-2"],
+      base: ["w-3", "h-3"],
+      lg: ["w-4", "h-4"],
+      xl: ["w-5", "h-5"]
+    }
+  },
+  defaultVariants: {
+    theme: "kubefirst",
+    size: "base"
+  }
+});
+export {
+  a as breadcrumbItemVariants,
+  s as breadcrumbVariants,
+  r as chevronVariants
+};

package/dist/components/Breadcrumb/hooks/useBreadcrumb.d.ts

@@ -0,0 +1,3 @@
+export declare const useBreadcrumb: () => {
+    isInsideRouter: boolean;
+};

package/dist/components/Breadcrumb/hooks/useBreadcrumb.js

@@ -0,0 +1,5 @@
+import "react";
+import { g as o } from "../../../useBreadcrumb-BSMnc4Fu.js";
+export {
+  o as useBreadcrumb
+};

package/dist/components/Button/Button.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { ButtonProps } from './Button.types';
+declare const Button: FC<ButtonProps>;
+export { Button };

package/dist/components/Button/Button.js

@@ -0,0 +1,42 @@
+import { jsx as a } from "react/jsx-runtime";
+import { forwardRef as h } from "react";
+import { S as c } from "../../index-CCavb-1K.js";
+import { cn as u } from "../../utils/index.js";
+import "../../contexts/theme.context.js";
+import { useTheme as l } from "../../contexts/theme.hook.js";
+import "../../js.cookie-OLEfuq_g.js";
+import { buttonVariants as x } from "./Button.variants.js";
+const T = h(
+  ({
+    className: o,
+    variant: m,
+    theme: e,
+    size: r,
+    disabled: t = !1,
+    asChild: n = !1,
+    ...i
+  }, s) => {
+    const p = n ? c : "button", { theme: f } = l();
+    return /* @__PURE__ */ a(
+      p,
+      {
+        ref: s,
+        className: u(
+          x({
+            variant: m,
+            disabled: t,
+            theme: e ?? f,
+            size: r,
+            className: o
+          })
+        ),
+        disabled: t,
+        ...i
+      }
+    );
+  }
+);
+T.displayName = "Button";
+export {
+  T as Button
+};

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

@@ -0,0 +1,7 @@
+import { VariantProps } from 'class-variance-authority';
+import { ButtonHTMLAttributes } from 'react';
+import { buttonVariants } from './Button.variants';
+export interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'disabled'>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+    disabled?: boolean;
+}

package/dist/components/Button/Button.types.js

@@ -0,0 +1 @@
+

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

@@ -0,0 +1,6 @@
+export declare const buttonVariants: (props?: ({
+    variant?: "primary" | "secondary" | "danger" | "text" | null | undefined;
+    theme?: "kubefirst" | "konstruct" | "colony" | null | undefined;
+    size?: "default" | null | undefined;
+    disabled?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;

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

@@ -0,0 +1,102 @@
+import { c as e } from "../../index-BwYCDOHZ.js";
+const t = e(
+  [
+    "border-2",
+    "disabled:pointer-events-none",
+    "focus-visible:outline-none",
+    "focus-visible:ring-1",
+    "focus-visible:ring-ring",
+    "gap-1",
+    "inline-flex",
+    "items-center",
+    "justify-center",
+    "rounded-md",
+    "text-base",
+    "transition-colors",
+    "whitespace-nowrap",
+    "cursor-pointer",
+    "font-semibold"
+  ],
+  {
+    variants: {
+      variant: {
+        primary: ["text-white", "border-current"],
+        secondary: ["bg-white"],
+        danger: [
+          "border-current",
+          "bg-red-600",
+          "text-white",
+          "hover:bg-red-700"
+        ],
+        text: ["bg-transparent", "border-transparent", "text-slate-500"]
+      },
+      theme: {
+        colony: "",
+        konstruct: "",
+        kubefirst: ""
+      },
+      size: {
+        default: "px-5 py-2"
+      },
+      disabled: {
+        true: ["text-zinc-500", "border-zinc-200", "bg-zinc-200"],
+        false: ""
+      }
+    },
+    compoundVariants: [
+      {
+        variant: "primary",
+        theme: "kubefirst",
+        disabled: !1,
+        class: ["bg-kubefirst-purple-light", "hover:bg-kubefirst-purple-dark"]
+      },
+      {
+        variant: "primary",
+        theme: "colony",
+        disabled: !1,
+        class: ["bg-red-700", "hover:bg-red-900"]
+      },
+      {
+        variant: "primary",
+        theme: "konstruct",
+        disabled: !1,
+        class: ["bg-orange-500", "hover:bg-orange-700"]
+      },
+      {
+        variant: "secondary",
+        disabled: !1,
+        class: [
+          "text-kubefirst-purple-light",
+          "border-kubefirst-purple-light",
+          "hover:text-kubefirst-purple-dark",
+          "hover:border-kubefirst-purple-dark",
+          "hover:bg-purple-50"
+        ]
+      },
+      {
+        variant: "secondary",
+        disabled: !0,
+        class: ["border-zinc-500"]
+      },
+      {
+        variant: "text",
+        disabled: !1,
+        class: ["hover:text-kubefirst-purple-dark", "hover:bg-purple-50"]
+      },
+      {
+        variant: "text",
+        disabled: !0,
+        class: ["bg-transparent", "border-transparent", "text-zinc-400"]
+      }
+    ],
+    defaultVariants: {
+      variant: "primary",
+      theme: "kubefirst",
+      size: "default",
+      disabled: !1
+    }
+  }
+);
+export {
+  t as buttonVariants
+};

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

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { CheckboxProps } from './Checkbox.types';
+export declare const Checkbox: FC<CheckboxProps>;

package/dist/components/Checkbox/Checkbox.js

@@ -0,0 +1,233 @@
+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 { 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 { 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";
+function w() {
+  return w = Object.assign || function(e) {
+    for (var s = 1; s < arguments.length; s++) {
+      var t = arguments[s];
+      for (var o in t)
+        Object.prototype.hasOwnProperty.call(t, o) && (e[o] = t[o]);
+    }
+    return e;
+  }, w.apply(this, arguments);
+}
+function Q(e, s) {
+  if (e == null) return {};
+  var t = U(e, s), o, n;
+  if (Object.getOwnPropertySymbols) {
+    var r = Object.getOwnPropertySymbols(e);
+    for (n = 0; n < r.length; n++)
+      o = r[n], !(s.indexOf(o) >= 0) && Object.prototype.propertyIsEnumerable.call(e, o) && (t[o] = e[o]);
+  }
+  return t;
+}
+function U(e, s) {
+  if (e == null) return {};
+  var t = {}, o = Object.keys(e), n, r;
+  for (r = 0; r < o.length; r++)
+    n = o[r], !(s.indexOf(n) >= 0) && (t[n] = e[n]);
+  return t;
+}
+var E = S(function(e, s) {
+  var t = e.color, o = t === void 0 ? "currentColor" : t, n = e.size, r = n === void 0 ? 24 : n, i = Q(e, ["color", "size"]);
+  return /* @__PURE__ */ j.createElement("svg", w({
+    ref: s,
+    xmlns: "http://www.w3.org/2000/svg",
+    width: r,
+    height: r,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: o,
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, i), /* @__PURE__ */ j.createElement("polyline", {
+    points: "20 6 9 17 4 12"
+  }));
+});
+E.propTypes = {
+  color: y.string,
+  size: y.oneOfType([y.string, y.number])
+};
+E.displayName = "Check";
+var O = "Checkbox", [Y, be] = K(O), [Z, ee] = Y(O), T = f.forwardRef(
+  (e, s) => {
+    const {
+      __scopeCheckbox: t,
+      name: o,
+      checked: n,
+      defaultChecked: r,
+      required: i,
+      disabled: l,
+      value: d = "on",
+      onCheckedChange: v,
+      form: u,
+      ...h
+    } = e, [c, k] = f.useState(null), C = H(s, (a) => k(a)), g = f.useRef(!1), R = c ? u || !!c.closest("form") : !0, [b = !1, P] = W({
+      prop: n,
+      defaultProp: r,
+      onChange: v
+    }), B = f.useRef(b);
+    return f.useEffect(() => {
+      const a = c == null ? void 0 : c.form;
+      if (a) {
+        const x = () => P(B.current);
+        return a.addEventListener("reset", x), () => a.removeEventListener("reset", x);
+      }
+    }, [c, P]), /* @__PURE__ */ N(Z, { scope: t, state: b, disabled: l, children: [
+      /* @__PURE__ */ p(
+        _.button,
+        {
+          type: "button",
+          role: "checkbox",
+          "aria-checked": m(b) ? "mixed" : b,
+          "aria-required": i,
+          "data-state": D(b),
+          "data-disabled": l ? "" : void 0,
+          disabled: l,
+          value: d,
+          ...h,
+          ref: C,
+          onKeyDown: I(e.onKeyDown, (a) => {
+            a.key === "Enter" && a.preventDefault();
+          }),
+          onClick: I(e.onClick, (a) => {
+            P((x) => m(x) ? !0 : !x), R && (g.current = a.isPropagationStopped(), g.current || a.stopPropagation());
+          })
+        }
+      ),
+      R && /* @__PURE__ */ p(
+        te,
+        {
+          control: c,
+          bubbles: !g.current,
+          name: o,
+          value: d,
+          checked: b,
+          required: i,
+          disabled: l,
+          form: u,
+          style: { transform: "translateX(-100%)" },
+          defaultChecked: m(r) ? !1 : r
+        }
+      )
+    ] });
+  }
+);
+T.displayName = O;
+var z = "CheckboxIndicator", L = f.forwardRef(
+  (e, s) => {
+    const { __scopeCheckbox: t, forceMount: o, ...n } = e, r = ee(z, t);
+    return /* @__PURE__ */ p(F, { present: o || m(r.state) || r.state === !0, children: /* @__PURE__ */ p(
+      _.span,
+      {
+        "data-state": D(r.state),
+        "data-disabled": r.disabled ? "" : void 0,
+        ...n,
+        ref: s,
+        style: { pointerEvents: "none", ...e.style }
+      }
+    ) });
+  }
+);
+L.displayName = z;
+var te = (e) => {
+  const { control: s, checked: t, bubbles: o = !0, defaultChecked: n, ...r } = e, i = f.useRef(null), l = $(t), d = q(s);
+  f.useEffect(() => {
+    const u = i.current, h = window.HTMLInputElement.prototype, k = Object.getOwnPropertyDescriptor(h, "checked").set;
+    if (l !== t && k) {
+      const C = new Event("click", { bubbles: o });
+      u.indeterminate = m(t), k.call(u, m(t) ? !1 : t), u.dispatchEvent(C);
+    }
+  }, [l, t, o]);
+  const v = f.useRef(m(t) ? !1 : t);
+  return /* @__PURE__ */ p(
+    "input",
+    {
+      type: "checkbox",
+      "aria-hidden": !0,
+      defaultChecked: n ?? v.current,
+      ...r,
+      tabIndex: -1,
+      ref: i,
+      style: {
+        ...e.style,
+        ...d,
+        position: "absolute",
+        pointerEvents: "none",
+        opacity: 0,
+        margin: 0
+      }
+    }
+  );
+};
+function m(e) {
+  return e === "indeterminate";
+}
+function D(e) {
+  return m(e) ? "indeterminate" : e ? "checked" : "unchecked";
+}
+var re = T, oe = L;
+const ve = S(
+  ({
+    className: e,
+    defaultChecked: s,
+    disabled: t,
+    label: o,
+    labelClassName: n,
+    name: r,
+    theme: i,
+    variant: l,
+    onChange: d
+  }, v) => {
+    const [u, h] = V(s), c = M(), { theme: k } = J(), C = A(() => {
+      h(), d == null || d();
+    }, [d, h]);
+    return /* @__PURE__ */ N("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ p(
+        re,
+        {
+          id: r ?? c,
+          checked: u,
+          ref: v,
+          name: r,
+          disabled: t,
+          className: X({
+            className: e,
+            theme: i ?? k,
+            variant: l,
+            checked: u
+          }),
+          onCheckedChange: C,
+          children: /* @__PURE__ */ p(oe, { children: /* @__PURE__ */ p(E, { className: "w-4 h-4 stroke-2" }) })
+        }
+      ),
+      o ? /* @__PURE__ */ p(
+        "label",
+        {
+          htmlFor: r ?? c,
+          className: G({
+            variant: l,
+            theme: i,
+            className: n
+          }),
+          children: o
+        }
+      ) : null
+    ] });
+  }
+);
+export {
+  ve as Checkbox
+};

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

@@ -0,0 +1,12 @@
+import { InputHTMLAttributes } from 'react';
+import { VariantProps } from 'class-variance-authority';
+import { checkboxVariants } from './Checkbox.variants';
+export interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'checked'>, VariantProps<typeof checkboxVariants> {
+    className?: string;
+    defaultChecked?: boolean;
+    disabled?: boolean;
+    label?: string;
+    labelClassName?: string;
+    name?: string;
+    onChange?: () => void;
+}

package/dist/components/Checkbox/Checkbox.types.js

@@ -0,0 +1 @@
+

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

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

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

@@ -0,0 +1,82 @@
+import { c as e } from "../../index-BwYCDOHZ.js";
+const r = e(
+  [
+    "cursor-pointer",
+    "border",
+    "rounded",
+    "w-5",
+    "h-5",
+    "flex",
+    "justify-center",
+    "items-center",
+    "text-white"
+  ],
+  {
+    variants: {
+      variant: {
+        default: ""
+      },
+      theme: {
+        colony: "",
+        konstruct: "",
+        kubefirst: ""
+      },
+      checked: {
+        true: "",
+        false: ""
+      }
+    },
+    compoundVariants: [
+      {
+        theme: "kubefirst",
+        class: ["border-kubefirst-purple-light"]
+      },
+      {
+        theme: "kubefirst",
+        checked: !0,
+        class: ["bg-kubefirst-purple-light"]
+      },
+      {
+        theme: "konstruct",
+        class: ["border-orange-600"]
+      },
+      {
+        theme: "konstruct",
+        checked: !0,
+        class: ["bg-orange-600"]
+      },
+      {
+        theme: "colony",
+        class: ["border-red-700"]
+      },
+      {
+        theme: "colony",
+        checked: !0,
+        class: ["bg-red-700"]
+      }
+    ],
+    defaultVariants: {
+      variant: "default",
+      theme: "kubefirst"
+    }
+  }
+), a = e(["cursor-pointer"], {
+  variants: {
+    variant: {
+      default: ""
+    },
+    theme: {
+      colony: "",
+      konstruct: "",
+      kubefirst: ""
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    theme: "kubefirst"
+  }
+});
+export {
+  r as checkboxVariants,
+  a as labelVariants
+};

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

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { DropdownProps } from './Dropdown.types';
+export declare const Dropdown: FC<DropdownProps>;

package/dist/components/Dropdown/Dropdown.js

@@ -0,0 +1,10 @@
+import { jsx as r } from "react/jsx-runtime";
+import { forwardRef as m } from "react";
+import "./components/List/List.js";
+import { Wrapper as i } 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 }) }));
+export {
+  c as Dropdown
+};

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

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+import { VariantProps } from 'class-variance-authority';
+import { dropdownVariants } from './Dropdown.variants';
+export type Option = {
+    label: string | ReactNode;
+    leftIcon?: ReactNode | string;
+    value: string;
+};
+export interface DropdownProps extends VariantProps<typeof dropdownVariants> {
+    defaultValue?: string;
+    label?: string;
+    name?: string;
+    options: Option[];
+    placeholder?: string;
+}

package/dist/components/Dropdown/Dropdown.types.js

@@ -0,0 +1 @@
+

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

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

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

@@ -0,0 +1,45 @@
+import { c as e } from "../../index-BwYCDOHZ.js";
+const a = e(
+  [
+    "border",
+    "cursor-pointer",
+    "ease-in-out",
+    "flex",
+    "items-center",
+    "justify-between",
+    "px-3",
+    "py-1",
+    "relative",
+    "rounded-md",
+    "transition-all",
+    "w-full",
+    "outline-none"
+  ],
+  {
+    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",
+          "focus-visible:bg-purple-100"
+        ],
+        colony: [
+          "aria-expanded:border-red-400",
+          "aria-expanded:text-red-400",
+          "focus-visible:bg-red-100"
+        ]
+      }
+    },
+    defaultVariants: {
+      theme: "kubefirst"
+    }
+  }
+);
+export {
+  a as dropdownVariants
+};

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

@@ -0,0 +1,2 @@
+import { FC } from 'react';
+export declare const EmptyList: FC;

package/dist/components/Dropdown/components/EmptyList.js

@@ -0,0 +1,5 @@
+import { jsx as t } from "react/jsx-runtime";
+const i = () => /* @__PURE__ */ t("div", { children: "EmptyList" });
+export {
+  i as EmptyList
+};