@konstructio/ui 0.1.2-alpha.75 → 0.1.2-alpha.77

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

@@ -1,69 +1,79 @@
-import { jsx as I } from "react/jsx-runtime";
-import { useRef as R, useState as T, useCallback as l } from "react";
-import { TagSelectContext as x } from "./TagSelect.context.js";
-import { useToggle as w } from "../../../hooks/useToggle.js";
-const k = ({
-  children: m,
-  defaultOptions: n = [],
-  multiselect: d = !0
-}) => {
-  const i = R(null), [p, a] = w(!1), [S, g] = T(n), [r, u] = T([]), o = l((t) => {
-    if (i.current) {
-      const s = t.map(({ id: c, label: e }) => ({
-        id: c,
-        value: e
-      }));
-      i.current.value = JSON.stringify(s);
+import { jsx as E } from "react/jsx-runtime";
+import { c as J } from "../../../compiler-runtime-DA41awpA.js";
+import { useRef as N, useState as C } from "react";
+import { TagSelectContext as U } from "./TagSelect.context.js";
+import { useToggle as V } from "../../../hooks/useToggle.js";
+const G = (o) => {
+  const e = J.c(24), {
+    children: a,
+    defaultOptions: d,
+    multiselect: y
+  } = o;
+  let u;
+  e[0] !== d ? (u = d === void 0 ? [] : d, e[0] = d, e[1] = u) : u = e[1];
+  const n = u, f = y === void 0 ? !0 : y, h = N(null), [O, i] = V(!1), [R, w] = C(n);
+  let m;
+  e[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (m = [], e[2] = m) : m = e[2];
+  const [t, P] = C(m);
+  let p;
+  e[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (p = (c) => {
+    if (h.current) {
+      const s = c.map($);
+      h.current.value = JSON.stringify(s);
     }
-  }, []), f = l(
-    (t) => {
-      const s = [...d ? r : [], t];
-      u(s);
-      const c = s.map((e) => e.id);
-      g(() => d ? n.filter(
-        (e) => !c.includes(e.id)
-      ) : n.map((e) => ({
-        ...e,
-        isSelected: c.includes(e.id)
-      }))), o(s), a(!1);
-    },
-    [
-      n,
-      o,
-      d,
-      r,
-      a
-    ]
-  ), v = l(
-    (t) => {
-      const s = r.filter((e) => e.id !== t.id);
-      u(s);
-      const c = s.map((e) => e.id);
-      g(
-        () => n.filter((e) => !c.includes(e.id))
-      ), o(s);
-    },
-    [n, o, r]
-  ), h = l(
-    (t) => a(t),
-    [a]
-  );
-  return /* @__PURE__ */ I(
-    x.Provider,
-    {
-      value: {
-        tags: S,
-        selectedTags: r,
-        isOpen: p,
-        inputRef: i,
-        onSelectTag: f,
-        onRemoveTag: v,
-        onOpen: h
-      },
-      children: m
-    }
-  );
+  }, e[3] = p) : p = e[3];
+  const j = p;
+  let g;
+  e[4] !== n || e[5] !== f || e[6] !== t || e[7] !== i ? (g = (c) => {
+    const s = [...f ? t : [], c];
+    P(s);
+    const _ = s.map(k);
+    w(() => f ? n.filter((l) => !_.includes(l.id)) : n.map((l) => ({
+      ...l,
+      isSelected: _.includes(l.id)
+    }))), j(s), i(!1);
+  }, e[4] = n, e[5] = f, e[6] = t, e[7] = i, e[8] = g) : g = e[8];
+  const x = g;
+  let T;
+  e[9] !== n || e[10] !== t ? (T = (c) => {
+    const s = t.filter((l) => l.id !== c.id);
+    P(s);
+    const _ = s.map(q);
+    w(() => n.filter((l) => !_.includes(l.id))), j(s);
+  }, e[9] = n, e[10] = t, e[11] = T) : T = e[11];
+  const I = T;
+  let S;
+  e[12] !== i ? (S = (c) => i(c), e[12] = i, e[13] = S) : S = e[13];
+  const b = S;
+  let r;
+  e[14] !== b || e[15] !== I || e[16] !== x || e[17] !== O || e[18] !== t || e[19] !== R ? (r = {
+    tags: R,
+    selectedTags: t,
+    isOpen: O,
+    inputRef: h,
+    onSelectTag: x,
+    onRemoveTag: I,
+    onOpen: b
+  }, e[14] = b, e[15] = I, e[16] = x, e[17] = O, e[18] = t, e[19] = R, e[20] = r) : r = e[20];
+  let v;
+  return e[21] !== a || e[22] !== r ? (v = /* @__PURE__ */ E(U.Provider, { value: r, children: a }), e[21] = a, e[22] = r, e[23] = v) : v = e[23], v;
 };
+function $(o) {
+  const {
+    id: e,
+    label: a
+  } = o;
+  return {
+    id: e,
+    value: a
+  };
+}
+function k(o) {
+  return o.id;
+}
+function q(o) {
+  return o.id;
+}
 export {
-  k as TagSelectProvider
+  G as TagSelectProvider
 };

package/dist/components/TagSelect/contexts/TagSelect.types.d.ts

@@ -1,5 +1,5 @@
 import { PropsWithChildren, RefObject } from 'react';
-import { TagProps } from '../../Tag/Tag.types';
+import { Props as TagProps } from '../../Tag/Tag.types';
 export type State = {
     tags: TagProps[];
     selectedTags: TagProps[];

package/dist/components/TagSelect/hooks/useTagSelect.js

@@ -1,32 +1,36 @@
-import { useRef as l, useEffect as c, useCallback as u } from "react";
-import { useTagSelect as i } from "../contexts/TagSelect.hook.js";
-const g = () => {
-  const n = l(null), { onOpen: e } = i();
-  c(() => {
-    const t = new AbortController(), s = (a) => {
-      a.key === "Escape" && e(!1);
-    }, o = (a) => {
-      n.current?.contains(a.target) || e(!1);
+import { c as d } from "../../../compiler-runtime-DA41awpA.js";
+import { useRef as p, useEffect as g } from "react";
+import { useTagSelect as m } from "../contexts/TagSelect.hook.js";
+const b = () => {
+  const e = d.c(7), l = p(null), {
+    onOpen: t
+  } = m();
+  let a, s;
+  e[0] !== t ? (a = () => {
+    const n = new AbortController(), u = (i) => {
+      i.key === "Escape" && t(!1);
+    }, f = (i) => {
+      l.current?.contains(i.target) || t(!1);
     };
-    return document.addEventListener("keydown", s, {
-      signal: t.signal
-    }), document.addEventListener("mousedown", o, {
-      signal: t.signal
+    return document.addEventListener("keydown", u, {
+      signal: n.signal
+    }), document.addEventListener("mousedown", f, {
+      signal: n.signal
     }), () => {
-      t.abort();
+      n.abort();
     };
-  }, [e, n]);
-  const r = u(
-    (t) => {
-      t.target?.closest("[data-value]") || e(!0);
-    },
-    [e]
-  );
-  return {
-    wrapperRef: n,
-    handleOpen: r
-  };
+  }, s = [t, l], e[0] = t, e[1] = a, e[2] = s) : (a = e[1], s = e[2]), g(a, s);
+  let o;
+  e[3] !== t ? (o = (n) => {
+    n.target?.closest("[data-value]") || t(!0);
+  }, e[3] = t, e[4] = o) : o = e[4];
+  const c = o;
+  let r;
+  return e[5] !== c ? (r = {
+    wrapperRef: l,
+    handleOpen: c
+  }, e[5] = c, e[6] = r) : r = e[6], r;
 };
 export {
-  g as useTagSelect
+  b as useTagSelect
 };

package/dist/components/TextArea/TextArea.d.ts

@@ -1,5 +1,5 @@
 import { FC } from 'react';
-import { TextAreaProps } from './TextArea.types';
+import { Props } from './TextArea.types';
 /**
  * A multiline text input component with optional label.
  *
@@ -21,4 +21,4 @@ import { TextAreaProps } from './TextArea.types';
  *
  * @see {@link https://konstructio.github.io/konstruct-ui/?path=/docs/components-textarea--docs Storybook}
  */
-export declare const TextArea: FC<TextAreaProps>;
+export declare const TextArea: FC<Props>;

package/dist/components/TextArea/TextArea.js

@@ -1,37 +1,38 @@
-import { jsxs as h, jsx as e } from "react/jsx-runtime";
-import { forwardRef as u, useId as p } from "react";
-import { cn as m } from "../../utils/index.js";
-import { textAreaVariants as v } from "./TextArea.variants.js";
-const g = u(
-  ({
-    initialValue: o,
-    label: r,
+import { jsx as b, jsxs as A } from "react/jsx-runtime";
+import { c as I } from "../../compiler-runtime-DA41awpA.js";
+import { forwardRef as R, useId as V } from "react";
+import { cn as j } from "../../utils/index.js";
+import { textAreaVariants as $ } from "./TextArea.variants.js";
+const W = R((h, u) => {
+  const e = I.c(28);
+  let a, d, l, s, f, r, t, p, o;
+  e[0] !== h ? ({
+    initialValue: d,
+    label: l,
     labelWrapperClassName: s,
-    name: c,
-    placeholder: i,
-    rows: n = 3,
-    theme: d,
-    className: f,
-    ...a
-  }, x) => {
-    const t = p(), l = c ? `${t}-name` : t;
-    return /* @__PURE__ */ h("div", { className: "flex flex-col gap-2", "data-theme": d, children: [
-      r ? /* @__PURE__ */ e("div", { className: m(s), children: /* @__PURE__ */ e("label", { htmlFor: l, className: "cursor-pointer", children: r }) }) : null,
-      /* @__PURE__ */ e(
-        "textarea",
-        {
-          id: l,
-          ref: x,
-          className: m(v({ className: f })),
-          rows: n,
-          placeholder: i,
-          value: o ?? a.value,
-          ...a
-        }
-      )
-    ] });
-  }
-);
+    name: f,
+    placeholder: r,
+    rows: p,
+    theme: o,
+    className: a,
+    ...t
+  } = h, e[0] = h, e[1] = a, e[2] = d, e[3] = l, e[4] = s, e[5] = f, e[6] = r, e[7] = t, e[8] = p, e[9] = o) : (a = e[1], d = e[2], l = e[3], s = e[4], f = e[5], r = e[6], t = e[7], p = e[8], o = e[9]);
+  const N = p === void 0 ? 3 : p, w = V(), i = f ? `${w}-name` : w;
+  let m;
+  e[10] !== i || e[11] !== l || e[12] !== s ? (m = l ? /* @__PURE__ */ b("div", { className: j(s), children: /* @__PURE__ */ b("label", { htmlFor: i, className: "cursor-pointer", children: l }) }) : null, e[10] = i, e[11] = l, e[12] = s, e[13] = m) : m = e[13];
+  let c;
+  e[14] !== a ? (c = j($({
+    className: a
+  })), e[14] = a, e[15] = c) : c = e[15];
+  const v = d ?? t.value;
+  let n;
+  e[16] !== i || e[17] !== r || e[18] !== t || e[19] !== u || e[20] !== N || e[21] !== c || e[22] !== v ? (n = /* @__PURE__ */ b("textarea", { id: i, ref: u, className: c, rows: N, placeholder: r, value: v, ...t }), e[16] = i, e[17] = r, e[18] = t, e[19] = u, e[20] = N, e[21] = c, e[22] = v, e[23] = n) : n = e[23];
+  let x;
+  return e[24] !== m || e[25] !== n || e[26] !== o ? (x = /* @__PURE__ */ A("div", { className: "flex flex-col gap-2", "data-theme": o, children: [
+    m,
+    n
+  ] }), e[24] = m, e[25] = n, e[26] = o, e[27] = x) : x = e[27], x;
+});
 export {
-  g as TextArea
+  W as TextArea
 };

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

@@ -12,7 +12,7 @@ import { textAreaVariants } from './TextArea.variants';
  * <TextArea name="bio" initialValue="Default text" />
  * ```
  */
-export interface TextAreaProps extends InputHTMLAttributes<HTMLTextAreaElement>, VariantProps<typeof textAreaVariants> {
+export interface Props extends InputHTMLAttributes<HTMLTextAreaElement>, VariantProps<typeof textAreaVariants> {
     /** Number of visible text rows (default: 3) */
     rows?: number;
     /** Label displayed above the textarea */
@@ -26,3 +26,5 @@ export interface TextAreaProps extends InputHTMLAttributes<HTMLTextAreaElement>,
     /** Theme override for this component */
     theme?: Theme;
 }
+/** @deprecated Use Props instead */
+export type TextAreaProps = Props;

package/dist/components/TextArea/TextArea.variants.js

@@ -1,20 +1,5 @@
 import { c as r } from "../../index-D29mdTf5.js";
-const o = r([
-  "border",
-  "border-gray-200",
-  "disabled:cursor-not-allowed",
-  "disabled:opacity-50",
-  "focus-visible:outline-none",
-  "focus-visible:ring-1",
-  "focus-visible:ring-ring",
-  "p-2",
-  "placeholder:text-gray-300",
-  "resize-none",
-  "rounded-md",
-  "shadow-xs",
-  "w-full",
-  "focus:ring-kubefirst-primary"
-]);
+const o = r(["border", "border-gray-200", "disabled:cursor-not-allowed", "disabled:opacity-50", "focus-visible:outline-none", "focus-visible:ring-1", "focus-visible:ring-ring", "p-2", "placeholder:text-gray-300", "resize-none", "rounded-md", "shadow-xs", "w-full", "focus:ring-kubefirst-primary"]);
 export {
   o as textAreaVariants
 };

package/dist/components/TimePicker/TimePicker.d.ts

@@ -1,5 +1,5 @@
 import { FC } from 'react';
-import { TimePickerProps } from './TimePicker.types';
+import { Props } from './TimePicker.types';
 /**
  * A scrollable time picker component with 12 or 24 hour format support.
  * Features smooth scroll navigation through hours, minutes, and AM/PM options.
@@ -17,5 +17,5 @@ import { TimePickerProps } from './TimePicker.types';
  *
  * @see {@link https://konstructio.github.io/konstruct-ui/?path=/docs/components-timepicker--docs Storybook}
  */
-declare const TimePicker: FC<TimePickerProps>;
+declare const TimePicker: FC<Props>;
 export { TimePicker };

package/dist/components/TimePicker/TimePicker.js

@@ -1,14 +1,24 @@
-import { jsx as r } from "react/jsx-runtime";
-import { TimePickerProvider as p } from "./contexts/time-picker.provider.js";
-import { Wrapper as s } from "./components/Wrapper/Wrapper.js";
-const P = ({
-  format: e = "12",
-  mode: i = "select",
-  showList: m = !0,
-  time: o,
-  onChange: t,
-  ...c
-}) => /* @__PURE__ */ r(p, { format: e, time: o, onChange: t, children: /* @__PURE__ */ r(s, { mode: i, showList: m, ...c }) });
+import { jsx as a } from "react/jsx-runtime";
+import { c as h } from "../../compiler-runtime-DA41awpA.js";
+import { TimePickerProvider as u } from "./contexts/time-picker.provider.js";
+import { Wrapper as v } from "./components/Wrapper/Wrapper.js";
+const P = (n) => {
+  const e = h.c(16);
+  let t, o, m, s, l, r;
+  e[0] !== n ? ({
+    format: m,
+    mode: s,
+    showList: l,
+    time: r,
+    onChange: o,
+    ...t
+  } = n, e[0] = n, e[1] = t, e[2] = o, e[3] = m, e[4] = s, e[5] = l, e[6] = r) : (t = e[1], o = e[2], m = e[3], s = e[4], l = e[5], r = e[6]);
+  const d = m === void 0 ? "12" : m, p = s === void 0 ? "select" : s, f = l === void 0 ? !0 : l;
+  let i;
+  e[7] !== t || e[8] !== p || e[9] !== f ? (i = /* @__PURE__ */ a(v, { mode: p, showList: f, ...t }), e[7] = t, e[8] = p, e[9] = f, e[10] = i) : i = e[10];
+  let c;
+  return e[11] !== d || e[12] !== o || e[13] !== i || e[14] !== r ? (c = /* @__PURE__ */ a(u, { format: d, time: r, onChange: o, children: i }), e[11] = d, e[12] = o, e[13] = i, e[14] = r, e[15] = c) : c = e[15], c;
+};
 P.displayName = "KonstructTimePicker";
 export {
   P as TimePicker

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

@@ -15,7 +15,7 @@ import { timePickerVariants } from './TimePicker.variants';
  * />
  * ```
  */
-export type TimePickerProps = VariantProps<typeof timePickerVariants> & {
+export type Props = VariantProps<typeof timePickerVariants> & {
     /** Time format: '12' for AM/PM or '24' for military time */
     format?: '12' | '24';
     /** Input mode: 'select' for dropdown only, 'input' for typing */
@@ -51,3 +51,5 @@ export type TimePickerProps = VariantProps<typeof timePickerVariants> & {
     /** Direction to open the dropdown list (default: 'bottom') */
     listPosition?: 'top' | 'bottom';
 };
+/** @deprecated Use Props instead */
+export type TimePickerProps = Props;

package/dist/components/TimePicker/TimePicker.variants.js

@@ -1,68 +1,5 @@
 import { c as t } from "../../index-D29mdTf5.js";
-const r = t([
-  "border",
-  "rounded",
-  "p-2.5",
-  "w-full",
-  "flex",
-  "items-center",
-  "justify-between",
-  "bg-white",
-  "border-gray-300",
-  "dark:border-metal-700",
-  "dark:bg-metal-800",
-  "cursor-pointer",
-  "transition-all",
-  "transition-duration-100",
-  "data-[open=true]:border-aurora-500",
-  "text-sm",
-  "text-slate-800",
-  "dark:text-slate-50"
-]), e = t([
-  "snap-y",
-  "snap-mandatory",
-  "overflow-y-scroll",
-  "scrollbar-none",
-  "flex",
-  "flex-col",
-  "dark:text-metal-50"
-]), o = t([
-  "w-15",
-  "h-10",
-  "snap-start",
-  "rounded",
-  "transition-all",
-  "transition-duration-100",
-  "outline-none",
-  "border-2",
-  "border-transparent",
-  "hover:bg-gray-100",
-  "focus-within:bg-gray-100",
-  "data-[active=true]:bg-blue-600",
-  "data-[active=true]:text-white",
-  "data-[active=true]:font-medium",
-  "data-[active=true]:hover:border-blue-200",
-  "data-[active=true]:focus-within:bg-blue-600",
-  "data-[active=true]:focus-within:border-blue-200",
-  "dark:data-[active=true]:bg-aurora-500",
-  "dark:data-[active=true]:text-metal-900",
-  "dark:data-[active=true]:hover:border-aurora-50",
-  "dark:data-[active=true]:focus-within:bg-aurora-500",
-  "dark:data-[active=true]:focus-within:border-aurora-50",
-  "dark:hover:bg-metal-700",
-  "dark:focus-within:bg-metal-700"
-]), i = t([
-  "flex",
-  "items-center",
-  "justify-center",
-  "cursor-pointer",
-  "w-full",
-  "h-full",
-  "px-6",
-  "py-3",
-  "outline-none",
-  "text-sm"
-]);
+const r = t(["border", "rounded", "p-2.5", "w-full", "flex", "items-center", "justify-between", "bg-white", "border-gray-300", "dark:border-metal-700", "dark:bg-metal-800", "cursor-pointer", "transition-all", "transition-duration-100", "data-[open=true]:border-aurora-500", "text-sm", "text-slate-800", "dark:text-slate-50"]), e = t(["snap-y", "snap-mandatory", "overflow-y-scroll", "scrollbar-none", "flex", "flex-col", "dark:text-metal-50"]), o = t(["w-15", "h-10", "snap-start", "rounded", "transition-all", "transition-duration-100", "outline-none", "border-2", "border-transparent", "hover:bg-gray-100", "focus-within:bg-gray-100", "data-[active=true]:bg-blue-600", "data-[active=true]:text-white", "data-[active=true]:font-medium", "data-[active=true]:hover:border-blue-200", "data-[active=true]:focus-within:bg-blue-600", "data-[active=true]:focus-within:border-blue-200", "dark:data-[active=true]:bg-aurora-500", "dark:data-[active=true]:text-metal-900", "dark:data-[active=true]:hover:border-aurora-50", "dark:data-[active=true]:focus-within:bg-aurora-500", "dark:data-[active=true]:focus-within:border-aurora-50", "dark:hover:bg-metal-700", "dark:focus-within:bg-metal-700"]), i = t(["flex", "items-center", "justify-center", "cursor-pointer", "w-full", "h-full", "px-6", "py-3", "outline-none", "text-sm"]);
 export {
   i as buttonVariants,
   o as liVariants,