@konstructio/ui 0.0.2

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

@@ -0,0 +1,10 @@
+import { InputHTMLAttributes } from 'react';
+import { VariantProps } from 'class-variance-authority';
+import { textAreaVariants } from './TextArea.variants';
+export interface TextAreaProps extends InputHTMLAttributes<HTMLTextAreaElement>, VariantProps<typeof textAreaVariants> {
+    rows?: number;
+    label?: string;
+    name?: string;
+    initialValue?: string;
+    onChange?: () => void;
+}

package/dist/components/TextArea/TextArea.types.js

@@ -0,0 +1 @@
+

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

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

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

@@ -0,0 +1,34 @@
+import { c as e } from "../../index-BwYCDOHZ.js";
+const o = e(
+  [
+    "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-sm",
+    "text-base",
+    "w-full"
+  ],
+  {
+    variants: {
+      theme: {
+        colony: "focus:ring-red-700",
+        kubefirst: "focus:ring-kubefirst-purple-light",
+        konstruct: "focus:ring-orange-600"
+      }
+    },
+    defaultVariants: {
+      theme: "kubefirst"
+    }
+  }
+);
+export {
+  o as textAreaVariants
+};

package/dist/components/Toast/Toast.d.ts

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

package/dist/components/Toast/Toast.js

@@ -0,0 +1,471 @@
+import { jsxs as k, jsx as c, Fragment as ne } from "react/jsx-runtime";
+import * as s from "react";
+import { useState as xe, useRef as Re, useEffect as be, useMemo as te, isValidElement as oe, useCallback as ge } from "react";
+import { r as Se } from "../../index-2hJuj4UN.js";
+import { c as Ie, a as Ne, b as X, d as b, u as Ae } from "../../index-8vgf-x5i.js";
+import { u as se, S as j } from "../../index-CCavb-1K.js";
+import { c as Fe } from "../../index-BqM_XclQ.js";
+import { B as _e, R as De, P as Le } from "../../index-2K8qjK4R.js";
+import { P as Oe } from "../../index-B_GWswUP.js";
+import { P as D, d as Me } from "../../index-BJ7FQg17.js";
+import { V as ae, X as ke } from "../../index-4qm4jAkj.js";
+import "../../contexts/theme.context.js";
+import { useTheme as Ve } from "../../contexts/theme.hook.js";
+import "../../js.cookie-OLEfuq_g.js";
+import { toastVariants as Ke, closeToastVariants as He, viewportToastVariants as We } from "./Toast.variants.js";
+var Q = "ToastProvider", [Z, Xe, Ue] = Fe("Toast"), [ie, bt] = Ie("Toast", [Ue]), [$e, U] = ie(Q), ce = (e) => {
+  const {
+    __scopeToast: r,
+    label: o = "Notification",
+    duration: t = 5e3,
+    swipeDirection: u = "right",
+    swipeThreshold: d = 50,
+    children: f
+  } = e, [m, v] = s.useState(null), [n, w] = s.useState(0), E = s.useRef(!1), I = s.useRef(!1);
+  return o.trim() || console.error(
+    `Invalid prop \`label\` supplied to \`${Q}\`. Expected non-empty \`string\`.`
+  ), /* @__PURE__ */ c(Z.Provider, { scope: r, children: /* @__PURE__ */ c(
+    $e,
+    {
+      scope: r,
+      label: o,
+      duration: t,
+      swipeDirection: u,
+      swipeThreshold: d,
+      toastCount: n,
+      viewport: m,
+      onViewportChange: v,
+      onToastAdd: s.useCallback(() => w((R) => R + 1), []),
+      onToastRemove: s.useCallback(() => w((R) => R - 1), []),
+      isFocusedToastEscapeKeyDownRef: E,
+      isClosePausedRef: I,
+      children: f
+    }
+  ) });
+};
+ce.displayName = Q;
+var ue = "ToastViewport", Ye = ["F8"], z = "toast.viewportPause", G = "toast.viewportResume", le = s.forwardRef(
+  (e, r) => {
+    const {
+      __scopeToast: o,
+      hotkey: t = Ye,
+      label: u = "Notifications ({hotkey})",
+      ...d
+    } = e, f = U(ue, o), m = Xe(o), v = s.useRef(null), n = s.useRef(null), w = s.useRef(null), E = s.useRef(null), I = se(r, E, f.onViewportChange), R = t.join("+").replace(/Key/g, "").replace(/Digit/g, ""), g = f.toastCount > 0;
+    s.useEffect(() => {
+      const a = (P) => {
+        var T;
+        t.length !== 0 && t.every((h) => P[h] || P.code === h) && ((T = E.current) == null || T.focus());
+      };
+      return document.addEventListener("keydown", a), () => document.removeEventListener("keydown", a);
+    }, [t]), s.useEffect(() => {
+      const a = v.current, P = E.current;
+      if (g && a && P) {
+        const p = () => {
+          if (!f.isClosePausedRef.current) {
+            const C = new CustomEvent(z);
+            P.dispatchEvent(C), f.isClosePausedRef.current = !0;
+          }
+        }, T = () => {
+          if (f.isClosePausedRef.current) {
+            const C = new CustomEvent(G);
+            P.dispatchEvent(C), f.isClosePausedRef.current = !1;
+          }
+        }, h = (C) => {
+          !a.contains(C.relatedTarget) && T();
+        }, y = () => {
+          a.contains(document.activeElement) || T();
+        };
+        return a.addEventListener("focusin", p), a.addEventListener("focusout", h), a.addEventListener("pointermove", p), a.addEventListener("pointerleave", y), window.addEventListener("blur", p), window.addEventListener("focus", T), () => {
+          a.removeEventListener("focusin", p), a.removeEventListener("focusout", h), a.removeEventListener("pointermove", p), a.removeEventListener("pointerleave", y), window.removeEventListener("blur", p), window.removeEventListener("focus", T);
+        };
+      }
+    }, [g, f.isClosePausedRef]);
+    const l = s.useCallback(
+      ({ tabbingDirection: a }) => {
+        const p = m().map((T) => {
+          const h = T.ref.current, y = [h, ...nt(h)];
+          return a === "forwards" ? y : y.reverse();
+        });
+        return (a === "forwards" ? p.reverse() : p).flat();
+      },
+      [m]
+    );
+    return s.useEffect(() => {
+      const a = E.current;
+      if (a) {
+        const P = (p) => {
+          var y, C, N;
+          const T = p.altKey || p.ctrlKey || p.metaKey;
+          if (p.key === "Tab" && !T) {
+            const L = document.activeElement, F = p.shiftKey;
+            if (p.target === a && F) {
+              (y = n.current) == null || y.focus();
+              return;
+            }
+            const A = l({ tabbingDirection: F ? "backwards" : "forwards" }), V = A.findIndex((i) => i === L);
+            q(A.slice(V + 1)) ? p.preventDefault() : F ? (C = n.current) == null || C.focus() : (N = w.current) == null || N.focus();
+          }
+        };
+        return a.addEventListener("keydown", P), () => a.removeEventListener("keydown", P);
+      }
+    }, [m, l]), /* @__PURE__ */ k(
+      _e,
+      {
+        ref: v,
+        role: "region",
+        "aria-label": u.replace("{hotkey}", R),
+        tabIndex: -1,
+        style: { pointerEvents: g ? void 0 : "none" },
+        children: [
+          g && /* @__PURE__ */ c(
+            J,
+            {
+              ref: n,
+              onFocusFromOutsideViewport: () => {
+                const a = l({
+                  tabbingDirection: "forwards"
+                });
+                q(a);
+              }
+            }
+          ),
+          /* @__PURE__ */ c(Z.Slot, { scope: o, children: /* @__PURE__ */ c(D.ol, { tabIndex: -1, ...d, ref: I }) }),
+          g && /* @__PURE__ */ c(
+            J,
+            {
+              ref: w,
+              onFocusFromOutsideViewport: () => {
+                const a = l({
+                  tabbingDirection: "backwards"
+                });
+                q(a);
+              }
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+le.displayName = ue;
+var de = "ToastFocusProxy", J = s.forwardRef(
+  (e, r) => {
+    const { __scopeToast: o, onFocusFromOutsideViewport: t, ...u } = e, d = U(de, o);
+    return /* @__PURE__ */ c(
+      ae,
+      {
+        "aria-hidden": !0,
+        tabIndex: 0,
+        ...u,
+        ref: r,
+        style: { position: "fixed" },
+        onFocus: (f) => {
+          var n;
+          const m = f.relatedTarget;
+          !((n = d.viewport) != null && n.contains(m)) && t();
+        }
+      }
+    );
+  }
+);
+J.displayName = de;
+var $ = "Toast", Be = "toast.swipeStart", je = "toast.swipeMove", qe = "toast.swipeCancel", ze = "toast.swipeEnd", fe = s.forwardRef(
+  (e, r) => {
+    const { forceMount: o, open: t, defaultOpen: u, onOpenChange: d, ...f } = e, [m = !0, v] = Ne({
+      prop: t,
+      defaultProp: u,
+      onChange: d
+    });
+    return /* @__PURE__ */ c(Oe, { present: o || m, children: /* @__PURE__ */ c(
+      Qe,
+      {
+        open: m,
+        ...f,
+        ref: r,
+        onClose: () => v(!1),
+        onPause: X(e.onPause),
+        onResume: X(e.onResume),
+        onSwipeStart: b(e.onSwipeStart, (n) => {
+          n.currentTarget.setAttribute("data-swipe", "start");
+        }),
+        onSwipeMove: b(e.onSwipeMove, (n) => {
+          const { x: w, y: E } = n.detail.delta;
+          n.currentTarget.setAttribute("data-swipe", "move"), n.currentTarget.style.setProperty("--radix-toast-swipe-move-x", `${w}px`), n.currentTarget.style.setProperty("--radix-toast-swipe-move-y", `${E}px`);
+        }),
+        onSwipeCancel: b(e.onSwipeCancel, (n) => {
+          n.currentTarget.setAttribute("data-swipe", "cancel"), n.currentTarget.style.removeProperty("--radix-toast-swipe-move-x"), n.currentTarget.style.removeProperty("--radix-toast-swipe-move-y"), n.currentTarget.style.removeProperty("--radix-toast-swipe-end-x"), n.currentTarget.style.removeProperty("--radix-toast-swipe-end-y");
+        }),
+        onSwipeEnd: b(e.onSwipeEnd, (n) => {
+          const { x: w, y: E } = n.detail.delta;
+          n.currentTarget.setAttribute("data-swipe", "end"), n.currentTarget.style.removeProperty("--radix-toast-swipe-move-x"), n.currentTarget.style.removeProperty("--radix-toast-swipe-move-y"), n.currentTarget.style.setProperty("--radix-toast-swipe-end-x", `${w}px`), n.currentTarget.style.setProperty("--radix-toast-swipe-end-y", `${E}px`), v(!1);
+        })
+      }
+    ) });
+  }
+);
+fe.displayName = $;
+var [Ge, Je] = ie($, {
+  onClose() {
+  }
+}), Qe = s.forwardRef(
+  (e, r) => {
+    const {
+      __scopeToast: o,
+      type: t = "foreground",
+      duration: u,
+      open: d,
+      onClose: f,
+      onEscapeKeyDown: m,
+      onPause: v,
+      onResume: n,
+      onSwipeStart: w,
+      onSwipeMove: E,
+      onSwipeCancel: I,
+      onSwipeEnd: R,
+      ...g
+    } = e, l = U($, o), [a, P] = s.useState(null), p = se(r, (i) => P(i)), T = s.useRef(null), h = s.useRef(null), y = u || l.duration, C = s.useRef(0), N = s.useRef(y), L = s.useRef(0), { onToastAdd: F, onToastRemove: Y } = l, _ = X(() => {
+      var x;
+      (a == null ? void 0 : a.contains(document.activeElement)) && ((x = l.viewport) == null || x.focus()), f();
+    }), A = s.useCallback(
+      (i) => {
+        !i || i === 1 / 0 || (window.clearTimeout(L.current), C.current = (/* @__PURE__ */ new Date()).getTime(), L.current = window.setTimeout(_, i));
+      },
+      [_]
+    );
+    s.useEffect(() => {
+      const i = l.viewport;
+      if (i) {
+        const x = () => {
+          A(N.current), n == null || n();
+        }, S = () => {
+          const O = (/* @__PURE__ */ new Date()).getTime() - C.current;
+          N.current = N.current - O, window.clearTimeout(L.current), v == null || v();
+        };
+        return i.addEventListener(z, S), i.addEventListener(G, x), () => {
+          i.removeEventListener(z, S), i.removeEventListener(G, x);
+        };
+      }
+    }, [l.viewport, y, v, n, A]), s.useEffect(() => {
+      d && !l.isClosePausedRef.current && A(y);
+    }, [d, y, l.isClosePausedRef, A]), s.useEffect(() => (F(), () => Y()), [F, Y]);
+    const V = s.useMemo(() => a ? ye(a) : null, [a]);
+    return l.viewport ? /* @__PURE__ */ k(ne, { children: [
+      V && /* @__PURE__ */ c(
+        Ze,
+        {
+          __scopeToast: o,
+          role: "status",
+          "aria-live": t === "foreground" ? "assertive" : "polite",
+          "aria-atomic": !0,
+          children: V
+        }
+      ),
+      /* @__PURE__ */ c(Ge, { scope: o, onClose: _, children: Se.createPortal(
+        /* @__PURE__ */ c(Z.ItemSlot, { scope: o, children: /* @__PURE__ */ c(
+          De,
+          {
+            asChild: !0,
+            onEscapeKeyDown: b(m, () => {
+              l.isFocusedToastEscapeKeyDownRef.current || _(), l.isFocusedToastEscapeKeyDownRef.current = !1;
+            }),
+            children: /* @__PURE__ */ c(
+              D.li,
+              {
+                role: "status",
+                "aria-live": "off",
+                "aria-atomic": !0,
+                tabIndex: 0,
+                "data-state": d ? "open" : "closed",
+                "data-swipe-direction": l.swipeDirection,
+                ...g,
+                ref: p,
+                style: { userSelect: "none", touchAction: "none", ...e.style },
+                onKeyDown: b(e.onKeyDown, (i) => {
+                  i.key === "Escape" && (m == null || m(i.nativeEvent), i.nativeEvent.defaultPrevented || (l.isFocusedToastEscapeKeyDownRef.current = !0, _()));
+                }),
+                onPointerDown: b(e.onPointerDown, (i) => {
+                  i.button === 0 && (T.current = { x: i.clientX, y: i.clientY });
+                }),
+                onPointerMove: b(e.onPointerMove, (i) => {
+                  if (!T.current) return;
+                  const x = i.clientX - T.current.x, S = i.clientY - T.current.y, O = !!h.current, M = ["left", "right"].includes(l.swipeDirection), K = ["left", "up"].includes(l.swipeDirection) ? Math.min : Math.max, Pe = M ? K(0, x) : 0, Ce = M ? 0 : K(0, S), B = i.pointerType === "touch" ? 10 : 2, H = { x: Pe, y: Ce }, ee = { originalEvent: i, delta: H };
+                  O ? (h.current = H, W(je, E, ee, {
+                    discrete: !1
+                  })) : re(H, l.swipeDirection, B) ? (h.current = H, W(Be, w, ee, {
+                    discrete: !1
+                  }), i.target.setPointerCapture(i.pointerId)) : (Math.abs(x) > B || Math.abs(S) > B) && (T.current = null);
+                }),
+                onPointerUp: b(e.onPointerUp, (i) => {
+                  const x = h.current, S = i.target;
+                  if (S.hasPointerCapture(i.pointerId) && S.releasePointerCapture(i.pointerId), h.current = null, T.current = null, x) {
+                    const O = i.currentTarget, M = { originalEvent: i, delta: x };
+                    re(x, l.swipeDirection, l.swipeThreshold) ? W(ze, R, M, {
+                      discrete: !0
+                    }) : W(
+                      qe,
+                      I,
+                      M,
+                      {
+                        discrete: !0
+                      }
+                    ), O.addEventListener("click", (K) => K.preventDefault(), {
+                      once: !0
+                    });
+                  }
+                })
+              }
+            )
+          }
+        ) }),
+        l.viewport
+      ) })
+    ] }) : null;
+  }
+), Ze = (e) => {
+  const { __scopeToast: r, children: o, ...t } = e, u = U($, r), [d, f] = s.useState(!1), [m, v] = s.useState(!1);
+  return ot(() => f(!0)), s.useEffect(() => {
+    const n = window.setTimeout(() => v(!0), 1e3);
+    return () => window.clearTimeout(n);
+  }, []), m ? null : /* @__PURE__ */ c(Le, { asChild: !0, children: /* @__PURE__ */ c(ae, { ...t, children: d && /* @__PURE__ */ k(ne, { children: [
+    u.label,
+    " ",
+    o
+  ] }) }) });
+}, et = "ToastTitle", pe = s.forwardRef(
+  (e, r) => {
+    const { __scopeToast: o, ...t } = e;
+    return /* @__PURE__ */ c(D.div, { ...t, ref: r });
+  }
+);
+pe.displayName = et;
+var tt = "ToastDescription", me = s.forwardRef(
+  (e, r) => {
+    const { __scopeToast: o, ...t } = e;
+    return /* @__PURE__ */ c(D.div, { ...t, ref: r });
+  }
+);
+me.displayName = tt;
+var Te = "ToastAction", ve = s.forwardRef(
+  (e, r) => {
+    const { altText: o, ...t } = e;
+    return o.trim() ? /* @__PURE__ */ c(he, { altText: o, asChild: !0, children: /* @__PURE__ */ c(Ee, { ...t, ref: r }) }) : (console.error(
+      `Invalid prop \`altText\` supplied to \`${Te}\`. Expected non-empty \`string\`.`
+    ), null);
+  }
+);
+ve.displayName = Te;
+var we = "ToastClose", Ee = s.forwardRef(
+  (e, r) => {
+    const { __scopeToast: o, ...t } = e, u = Je(we, o);
+    return /* @__PURE__ */ c(he, { asChild: !0, children: /* @__PURE__ */ c(
+      D.button,
+      {
+        type: "button",
+        ...t,
+        ref: r,
+        onClick: b(e.onClick, u.onClose)
+      }
+    ) });
+  }
+);
+Ee.displayName = we;
+var he = s.forwardRef((e, r) => {
+  const { __scopeToast: o, altText: t, ...u } = e;
+  return /* @__PURE__ */ c(
+    D.div,
+    {
+      "data-radix-toast-announce-exclude": "",
+      "data-radix-toast-announce-alt": t || void 0,
+      ...u,
+      ref: r
+    }
+  );
+});
+function ye(e) {
+  const r = [];
+  return Array.from(e.childNodes).forEach((t) => {
+    if (t.nodeType === t.TEXT_NODE && t.textContent && r.push(t.textContent), rt(t)) {
+      const u = t.ariaHidden || t.hidden || t.style.display === "none", d = t.dataset.radixToastAnnounceExclude === "";
+      if (!u)
+        if (d) {
+          const f = t.dataset.radixToastAnnounceAlt;
+          f && r.push(f);
+        } else
+          r.push(...ye(t));
+    }
+  }), r;
+}
+function W(e, r, o, { discrete: t }) {
+  const u = o.originalEvent.currentTarget, d = new CustomEvent(e, { bubbles: !0, cancelable: !0, detail: o });
+  r && u.addEventListener(e, r, { once: !0 }), t ? Me(u, d) : u.dispatchEvent(d);
+}
+var re = (e, r, o = 0) => {
+  const t = Math.abs(e.x), u = Math.abs(e.y), d = t > u;
+  return r === "left" || r === "right" ? d && t > o : !d && u > o;
+};
+function ot(e = () => {
+}) {
+  const r = X(e);
+  Ae(() => {
+    let o = 0, t = 0;
+    return o = window.requestAnimationFrame(() => t = window.requestAnimationFrame(r)), () => {
+      window.cancelAnimationFrame(o), window.cancelAnimationFrame(t);
+    };
+  }, [r]);
+}
+function rt(e) {
+  return e.nodeType === e.ELEMENT_NODE;
+}
+function nt(e) {
+  const r = [], o = document.createTreeWalker(e, NodeFilter.SHOW_ELEMENT, {
+    acceptNode: (t) => {
+      const u = t.tagName === "INPUT" && t.type === "hidden";
+      return t.disabled || t.hidden || u ? NodeFilter.FILTER_SKIP : t.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
+    }
+  });
+  for (; o.nextNode(); ) r.push(o.currentNode);
+  return r;
+}
+function q(e) {
+  const r = document.activeElement;
+  return e.some((o) => o === r ? !0 : (o.focus(), document.activeElement !== r));
+}
+var st = ce, at = le, it = fe, ct = pe, ut = me, lt = ve;
+const gt = ({
+  title: e,
+  duration: r = 5e3,
+  titleClassName: o,
+  descriptionClassName: t,
+  description: u,
+  children: d,
+  theme: f,
+  showCloseButton: m = !0,
+  className: v
+}) => {
+  const [n, w] = xe(!1), E = Re(0), { theme: I } = Ve(), R = f ?? I;
+  be(() => () => clearTimeout(E.current), []);
+  const g = te(() => oe(e) ? /* @__PURE__ */ c(j, { className: o, children: e }) : /* @__PURE__ */ c("h6", { className: o, children: e }), [e, o]), l = te(() => oe(u) ? /* @__PURE__ */ c(j, { className: t, children: u }) : /* @__PURE__ */ c("h6", { className: t, children: u }), [u, t]), a = ge(() => {
+    w(!1), E.current = window.setTimeout(() => w(!0), 100);
+  }, []);
+  return /* @__PURE__ */ k(st, { swipeDirection: "right", duration: r, children: [
+    /* @__PURE__ */ c(j, { onClick: a, children: d }),
+    /* @__PURE__ */ k(
+      it,
+      {
+        className: Ke({ theme: R, className: v }),
+        open: n,
+        onOpenChange: w,
+        children: [
+          /* @__PURE__ */ c(ct, { asChild: !0, className: "text-lg mb-2 font-semibold", children: g }),
+          /* @__PURE__ */ c(ut, { asChild: !0, children: l }),
+          m && /* @__PURE__ */ c(lt, { className: "absolute", asChild: !0, altText: "Close the toast", children: /* @__PURE__ */ c(ke, { className: He({ theme: R }) }) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ c(at, { className: We({ theme: R }) })
+  ] });
+};
+export {
+  gt as Toast
+};

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

@@ -0,0 +1,12 @@
+import { PropsWithChildren, ReactNode } from 'react';
+import { VariantProps } from 'class-variance-authority';
+import { toastVariants } from './Toast.variants';
+export interface ToastProps extends PropsWithChildren, VariantProps<typeof toastVariants> {
+    className?: string;
+    description: string | ReactNode;
+    descriptionClassName?: string;
+    duration?: number;
+    showCloseButton?: boolean;
+    title: string | ReactNode;
+    titleClassName?: string;
+}

package/dist/components/Toast/Toast.types.js

@@ -0,0 +1 @@
+

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

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

package/dist/components/Toast/Toast.variants.js

@@ -0,0 +1,74 @@
+import { c as t } from "../../index-BwYCDOHZ.js";
+const a = t(
+  [
+    "bg-white",
+    "rounded-md",
+    "shadow-md",
+    "p-4",
+    "flex",
+    "flex-col",
+    "relative",
+    "border",
+    "overflow-hidden",
+    "data-[state=open]:animate-slide-in",
+    "data-[state=closed]:animate-hide",
+    "data-[swipe=move]:translate-x-4",
+    "data-[swipe=cancel]:translate-x-0",
+    "data-[swipe=end]:animate-swipe-out"
+  ],
+  {
+    variants: {
+      theme: {
+        kubefirst: ["shadow-purple-200", "border-purple-100"],
+        konstruct: ["shadow-orange-200", "border-orange-100"],
+        colony: ["shadow-red-200", "border-red-100"]
+      }
+    },
+    defaultVariants: {
+      theme: "kubefirst"
+    }
+  }
+), r = t(
+  [
+    "fixed",
+    "bottom-0",
+    "right-0",
+    "flex",
+    "flex-col",
+    "p-[var(--viewport-padding)]",
+    "gap-8",
+    "w-[390px]",
+    "max-w-[100vw]",
+    "m-0",
+    "z-50",
+    "outline-none"
+  ],
+  {
+    variants: {
+      theme: {
+        kubefirst: "",
+        konstruct: "",
+        colony: ""
+      }
+    },
+    defaultVariants: {
+      theme: "kubefirst"
+    }
+  }
+), o = t(["top-2", "right-2", "w-4", "h-4"], {
+  variants: {
+    theme: {
+      kubefirst: ["text-kubefirst-purple-light"],
+      konstruct: ["text-orange-400"],
+      colony: ["text-red-400"]
+    }
+  },
+  defaultVariants: {
+    theme: "kubefirst"
+  }
+});
+export {
+  o as closeToastVariants,
+  a as toastVariants,
+  r as viewportToastVariants
+};

package/dist/components/Tooltip/Tooltip.d.ts

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

package/dist/components/Tooltip/Tooltip.js

@@ -0,0 +1,42 @@
+import { jsx as e, jsxs as s } from "react/jsx-runtime";
+import { forwardRef as N, useRef as v, useImperativeHandle as w, useMemo as R, isValidElement as T } from "react";
+import { S as i } from "../../index-CCavb-1K.js";
+import "../../contexts/theme.context.js";
+import { useTheme as V } from "../../contexts/theme.hook.js";
+import "../../js.cookie-OLEfuq_g.js";
+import { cn as a } from "../../utils/index.js";
+import { tooltipVariants as j, arrowVariants as C } from "./Tooltip.variants.js";
+import { useTooltip as S } from "./hooks/useTooltip.js";
+const z = N(
+  ({ children: r, content: n, className: l, theme: p, position: t, wrapperClassName: c }, f) => {
+    const d = v(null), { theme: h } = V(), m = p ?? h, { isVisible: u, componentRef: o } = S();
+    w(f, () => o.current, [o]);
+    const x = R(
+      () => T(r) ? r : /* @__PURE__ */ e("p", { className: "p-2", children: r }),
+      [r]
+    );
+    return /* @__PURE__ */ e("div", { className: a("w-full", c), children: /* @__PURE__ */ s("div", { className: "relative w-max", children: [
+      /* @__PURE__ */ e(i, { ref: o, className: a("cursor-pointer ", l), children: x }),
+      /* @__PURE__ */ s(
+        "div",
+        {
+          ref: d,
+          className: j({ theme: m, position: t }),
+          "aria-expanded": u,
+          children: [
+            /* @__PURE__ */ e(
+              "span",
+              {
+                className: C({ theme: m, position: t })
+              }
+            ),
+            /* @__PURE__ */ e(i, { children: n })
+          ]
+        }
+      )
+    ] }) });
+  }
+);
+export {
+  z as Tooltip
+};