@kolking/react-ui 1.5.0 → 1.6.0

package/dist/{Input-DbQTM4UI.js → Input-D46mAsdt.js}

@@ -2,7 +2,7 @@ import { jsxs as _, jsx as s } from "react/jsx-runtime";
 import u from "classnames";
 import h from "react";
 import { cssProps as m } from "./utils/helpers.js";
-import { s as t, V as x } from "./ValidationTooltip-BgSwl0hJ.js";
+import { s as t, V as x } from "./ValidationTooltip-D8d9O6Re.js";
 const w = "styles_checkbox_pxrU4", v = "styles_radio_0QV8R", k = "styles_label_K65D1", g = "styles_input_j6Qji", N = {
   checkbox: w,
   radio: v,

package/dist/ValidationTooltip-D8d9O6Re.js

@@ -0,0 +1,31 @@
+import { jsx as s } from "react/jsx-runtime";
+import r from "classnames";
+import { Tooltip as o } from "./components/Tooltip/Tooltip.js";
+const a = "styles_input_a-JHN", p = "styles_wrapper_b3-VW", c = "styles_date_S0YpO", l = "styles_time_3ywit", _ = "styles_search_y6sAm", n = "styles_number_auDA-", i = "styles_textarea_KRYGO", y = "styles_select_qhElj", m = "styles_tooltip_tBrt4", w = "styles_range_tSqtV", u = "styles_wrapper_prefix_KI25W", d = "styles_wrapper_accessory_yZjv0", x = {
+  input: a,
+  wrapper: p,
+  date: c,
+  time: l,
+  search: _,
+  number: n,
+  textarea: i,
+  select: y,
+  tooltip: m,
+  range: w,
+  wrapper_prefix: u,
+  wrapper_accessory: d
+}, h = ({ className: e, ...t }) => /* @__PURE__ */ s(
+  o,
+  {
+    placement: "top-start",
+    trigger: "hover focus click",
+    ...t,
+    "data-tooltip-validation": !0,
+    disabled: !t.content,
+    className: r(x.tooltip, e)
+  }
+);
+export {
+  h as V,
+  x as s
+};

package/dist/components/Breadcrumbs/Breadcrumbs.d.ts

@@ -0,0 +1,11 @@
+import { default as React } from 'react';
+export type Breadcrumb = React.AnchorHTMLAttributes<HTMLAnchorElement> & {
+    label: React.ReactNode;
+};
+export type BreadcrumbsProps = React.HTMLAttributes<HTMLOListElement> & {
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    items: Breadcrumb[];
+    separator?: React.ReactNode;
+    margin?: React.CSSProperties['margin'];
+};
+export declare const Breadcrumbs: ({ size, items, separator, margin, style, className, ...props }: BreadcrumbsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Breadcrumbs/Breadcrumbs.js

@@ -0,0 +1,40 @@
+import { jsx as a, jsxs as i } from "react/jsx-runtime";
+import p from "classnames";
+import { cssProps as h } from "../../utils/helpers.js";
+const f = "Breadcrumbs_breadcrumbs_a3ubb", g = {
+  breadcrumbs: f
+}, _ = ({
+  size: t,
+  items: s = [],
+  separator: b = "›",
+  margin: d,
+  style: m,
+  className: o,
+  ...n
+}) => /* @__PURE__ */ a(
+  "ol",
+  {
+    ...n,
+    "data-breadcrumbs": !0,
+    className: p(g.breadcrumbs, o),
+    style: { ...m, ...h({ size: t, margin: d }) },
+    children: s.map(({ label: u, ...e }, r) => {
+      const c = r === s.length - 1, l = e.href ? "a" : "span";
+      return /* @__PURE__ */ i("li", { children: [
+        /* @__PURE__ */ a(
+          l,
+          {
+            ...e,
+            "data-breadcrumbs-item": r,
+            "aria-current": c ? "page" : void 0,
+            children: u
+          }
+        ),
+        !c && /* @__PURE__ */ a("span", { "aria-hidden": !0, "data-breadcrumbs-separator": !0, children: b })
+      ] }, r);
+    })
+  }
+);
+export {
+  _ as Breadcrumbs
+};

package/dist/components/Breadcrumbs/index.d.ts

@@ -0,0 +1 @@
+export * from './Breadcrumbs';

package/dist/components/Breadcrumbs/index.js

@@ -0,0 +1,4 @@
+import { Breadcrumbs as m } from "./Breadcrumbs.js";
+export {
+  m as Breadcrumbs
+};

package/dist/components/Button/Button.js

@@ -48,7 +48,7 @@ function A({
       children: [
         o ? d(o, "span") : /* @__PURE__ */ u(B, { children: [
           i === "start" && n,
-          e && d(e, "span"),
+          e !== void 0 && d(e, "span"),
           i === "end" && n
         ] }),
         t && /* @__PURE__ */ v(N, { overlay: !0 })

package/dist/components/Dialog/Dialog.d.ts

@@ -1,15 +1,19 @@
 import { default as React } from 'react';
 import { ButtonProps } from '../Button';
 import { HeadingProps } from '../Heading';
-export type DialogProps = React.DialogHTMLAttributes<HTMLDialogElement> & {
+export type DialogProps = React.HTMLAttributes<HTMLDivElement> & {
+    open?: boolean;
     size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
     width?: React.CSSProperties['width'];
+    requestClose: () => void;
 };
-export declare const Dialog: React.ForwardRefExoticComponent<React.DialogHTMLAttributes<HTMLDialogElement> & {
+export declare const Dialog: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    open?: boolean;
     size?: "xs" | "sm" | "md" | "lg" | "xl";
     width?: React.CSSProperties["width"];
-} & React.RefAttributes<HTMLDialogElement>>;
+    requestClose: () => void;
+} & React.RefAttributes<HTMLDivElement>>;
 export declare const DialogTitle: ({ className, children, ...props }: Omit<HeadingProps, "title">) => import("react/jsx-runtime").JSX.Element;
-export declare const DialogContent: ({ className, children, ...props }: React.HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export declare const DialogFooter: ({ className, children, ...props }: React.HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const DialogContent: (props: React.HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const DialogFooter: ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
 export declare const DialogClose: ({ className, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Dialog/Dialog.js

@@ -1,53 +1,76 @@
-import { jsx as t } from "react/jsx-runtime";
-import g from "react";
-import i from "classnames";
-import { Icon as m } from "../Icon/Icon.js";
-import { Button as p } from "../Button/Button.js";
-import { Heading as f } from "../Heading/Heading.js";
-import { DialogFocusTrap as u } from "./DialogFocusTrap.js";
-import { cssProps as D } from "../../utils/helpers.js";
-const _ = "Dialog_dialog_G3gxL", w = "Dialog_wrapper_BMuhR", v = "Dialog_footer_N-aEV", N = "Dialog_close_JSEkn", e = {
-  dialog: _,
-  wrapper: w,
-  footer: v,
-  close: N
-}, F = g.forwardRef(
-  ({ open: o = !1, size: a, width: r, style: l, className: s, children: c, ...d }, n) => /* @__PURE__ */ t(u, { active: o, children: /* @__PURE__ */ t(
-    "dialog",
-    {
-      ...d,
-      ref: n,
-      "data-floating-root": !0,
-      "data-dialog": o ? "open" : "closed",
-      className: i(e.dialog, s),
-      style: { ...l, ...D({ size: a, width: r }) },
-      children: /* @__PURE__ */ t("div", { "data-dialog-wrapper": !0, className: e.wrapper, children: c })
-    }
-  ) })
-), T = ({ className: o, children: a, ...r }) => /* @__PURE__ */ t(f, { as: "h4", ...r, "data-dialog-title": !0, title: a, className: o }), j = ({
-  className: o,
-  children: a,
-  ...r
-}) => /* @__PURE__ */ t("div", { ...r, "data-dialog-content": !0, className: o, children: a }), k = ({
-  className: o,
-  children: a,
-  ...r
-}) => /* @__PURE__ */ t("div", { ...r, "data-dialog-footer": !0, className: i(e.footer, o), children: a }), G = ({ className: o, ...a }) => /* @__PURE__ */ t(
-  p,
+import { jsx as o } from "react/jsx-runtime";
+import y, { useRef as D, useImperativeHandle as _, useEffect as E } from "react";
+import { createPortal as k } from "react-dom";
+import { FocusTrap as h } from "focus-trap-react";
+import s from "classnames";
+import { Icon as L } from "../Icon/Icon.js";
+import { Button as N } from "../Button/Button.js";
+import { Heading as b } from "../Heading/Heading.js";
+import { cssProps as w } from "../../utils/helpers.js";
+const x = "Dialog_overlay_C98Qt", R = "Dialog_dialog_G3gxL", T = "Dialog_footer_N-aEV", I = "Dialog_close_JSEkn", i = {
+  overlay: x,
+  dialog: R,
+  footer: T,
+  close: I
+}, P = { escapeDeactivates: !1 }, Q = y.forwardRef(
+  ({ open: t = !1, size: e, width: l, style: m, className: g, children: u, requestClose: n, ...p }, v) => {
+    const c = D(null);
+    return _(v, () => c.current), E(() => {
+      const r = c.current;
+      if (r && t) {
+        let d = function(a) {
+          a.target === a.currentTarget && n();
+        }, f = function(a) {
+          a.key === "Escape" && (a.stopPropagation(), a.preventDefault(), n());
+        };
+        return r.addEventListener("click", d), r.addEventListener("keydown", f), () => {
+          r.removeEventListener("click", d), r.removeEventListener("keydown", f);
+        };
+      }
+    }, [t, n]), t ? k(
+      /* @__PURE__ */ o(h, { active: t, focusTrapOptions: P, children: /* @__PURE__ */ o(
+        "div",
+        {
+          ...p,
+          ref: c,
+          tabIndex: 0,
+          "data-dialog": !0,
+          "data-open": t,
+          "data-floating-root": !0,
+          className: i.overlay,
+          children: /* @__PURE__ */ o(
+            "div",
+            {
+              role: "alertdialog",
+              "aria-modal": "true",
+              "data-dialog-wrapper": !0,
+              className: s(i.dialog, g),
+              style: { ...m, ...w({ size: e, width: l }) },
+              children: u
+            }
+          )
+        }
+      ) }),
+      // Append to an element with data-floating-root attribute
+      document.querySelector("[data-floating-root]") ?? document.body
+    ) : null;
+  }
+), V = ({ className: t, children: e, ...l }) => /* @__PURE__ */ o(b, { as: "h4", ...l, "data-dialog-title": !0, title: e, className: t }), z = (t) => /* @__PURE__ */ o("div", { ...t, "data-dialog-content": !0 }), A = ({ className: t, ...e }) => /* @__PURE__ */ o("div", { ...e, "data-dialog-footer": !0, className: s(i.footer, t) }), K = ({ className: t, ...e }) => /* @__PURE__ */ o(
+  N,
   {
-    ...a,
+    ...e,
     type: "button",
     variant: "tertiary",
     "data-dialog-close": !0,
     "aria-label": "dismiss dialog",
-    icon: /* @__PURE__ */ t(m, { name: "close" }),
-    className: i(e.close, o)
+    icon: /* @__PURE__ */ o(L, { name: "close" }),
+    className: s(i.close, t)
   }
 );
 export {
-  F as Dialog,
-  G as DialogClose,
-  j as DialogContent,
-  k as DialogFooter,
-  T as DialogTitle
+  Q as Dialog,
+  K as DialogClose,
+  z as DialogContent,
+  A as DialogFooter,
+  V as DialogTitle
 };

package/dist/components/Dialog/useDialog.d.ts

@@ -7,8 +7,9 @@ export type DialogOptions<T, R> = {
 export type DialogType<T, R> = ReturnType<typeof useDialog<T, R>>;
 export declare function useDialog<T, R>(options?: DialogOptions<T, R>): {
     props: {
-        ref: import('react').RefObject<HTMLDialogElement>;
+        ref: import('react').RefObject<HTMLDivElement>;
         open: boolean;
+        requestClose: () => void;
     };
     data: T | undefined;
     show: (values: T) => void;

package/dist/components/Dialog/useDialog.js

@@ -1,52 +1,39 @@
-import { useRef as v, useState as g, useCallback as u, useEffect as h } from "react";
-function S(o) {
-  const a = v(null), i = v(o), s = v(!1), [d, E] = g((o == null ? void 0 : o.defaultOpen) ?? !1), [w, k] = g();
-  i.current = o;
-  const y = u((e) => {
-    var n, t;
-    s.current || (k(e), E(!0), (t = (n = i.current) == null ? void 0 : n.onShow) == null || t.call(n, e));
-  }, []), c = u((e) => {
-    s.current || E((n) => {
-      var t;
-      return n && (s.current = !0, (t = a.current) == null || t.addEventListener("transitionend", function r(b) {
-        var f, p, l, m;
-        b.target === a.current && (e !== void 0 ? (p = (f = i.current) == null ? void 0 : f.onConfirm) == null || p.call(f, e) : (m = (l = i.current) == null ? void 0 : l.onCancel) == null || m.call(l), k(void 0), s.current = !1, this.removeEventListener("transitionend", r));
-      })), !1;
-    });
-  }, []);
-  h(() => {
-    var e, n;
-    d ? (e = a.current) == null || e.showModal() : (n = a.current) == null || n.close();
-  }, [d]), h(() => {
-    const e = a.current;
-    if (e) {
-      let n = function(r) {
-        r.target === r.currentTarget && c();
-      }, t = function(r) {
-        r.key === "Escape" && (r.stopPropagation(), r.preventDefault(), c());
-      };
-      return e.addEventListener("click", n), e.addEventListener("keydown", t), () => {
-        e.removeEventListener("click", n), e.removeEventListener("keydown", t);
-      };
-    }
-  }, [c]);
-  const L = u(() => c(), [c]), C = u((e) => c(e), [c]), D = u(async (e) => {
-    s.current = !0;
+import { useRef as l, useState as y, useCallback as a } from "react";
+function g(t, u) {
+  setTimeout(
+    u,
+    t ? parseFloat(getComputedStyle(t).transitionDuration) * 1e3 : 0
+  );
+}
+function v(t) {
+  const u = l(null), s = l(t), c = l(!1), [D, i] = y((t == null ? void 0 : t.defaultOpen) ?? !1), [b, d] = y();
+  s.current = t;
+  const w = a((e) => {
+    var r, n;
+    c.current || (i(!0), d(e), (n = (r = s.current) == null ? void 0 : r.onShow) == null || n.call(r, e));
+  }, []), o = a((e) => {
+    var r;
+    c.current || (c.current = !0, (r = u.current) == null || r.setAttribute("data-open", "false"), g(u.current, () => {
+      var n, C, f, m;
+      e !== void 0 ? (C = (n = s.current) == null ? void 0 : n.onConfirm) == null || C.call(n, e) : (m = (f = s.current) == null ? void 0 : f.onCancel) == null || m.call(f), i(!1), d(void 0), c.current = !1;
+    }));
+  }, []), p = a(() => o(), [o]), O = a((e) => o(e), [o]), S = a(async (e) => {
+    c.current = !0;
     try {
       return await e;
     } finally {
-      s.current = !1;
+      c.current = !1;
     }
   }, []);
   return {
-    props: { ref: a, open: d },
-    data: w,
-    show: y,
-    cancel: L,
-    confirm: C,
-    preventClose: D
+    props: { ref: u, open: D, requestClose: p },
+    data: b,
+    show: w,
+    cancel: p,
+    confirm: O,
+    preventClose: S
   };
 }
 export {
-  S as useDialog
+  v as useDialog
 };

package/dist/components/Dialog/withDialog.d.ts

@@ -1,7 +1,7 @@
 import { default as React } from 'react';
 import { DialogProps } from './Dialog';
 import { DialogOptions, DialogType } from './useDialog';
-type ComponentProps<T, R> = Omit<DialogProps, 'children'> & DialogOptions<T, R> & {
+type ComponentProps<T, R> = Omit<DialogProps, 'children' | 'ref' | 'requestClose'> & DialogOptions<T, R> & {
     children: (dialog: DialogType<T, R>) => React.ReactNode;
 };
 export type WithDialogProps<T extends object, R> = T & {

package/dist/components/Fields/Checkbox.js

@@ -2,7 +2,7 @@ import { jsxs as i, jsx as l } from "react/jsx-runtime";
 import p from "classnames";
 import h, { useRef as x, useImperativeHandle as k, useEffect as b } from "react";
 import { cssProps as R } from "../../utils/helpers.js";
-import { I as y, s as n } from "../../Input-DbQTM4UI.js";
+import { I as y, s as n } from "../../Input-D46mAsdt.js";
 const q = h.forwardRef(
   ({ size: c, error: a, label: t, className: f, style: u, required: m, indeterminate: r, ...s }, d) => {
     const o = s.checked, e = x(null);

package/dist/components/Fields/Input.js

@@ -2,8 +2,8 @@ import "react/jsx-runtime";
 import "classnames";
 import "react";
 import "../../utils/helpers.js";
-import "../../ValidationTooltip-BgSwl0hJ.js";
-import { I as a } from "../../Input-DbQTM4UI.js";
+import "../../ValidationTooltip-D8d9O6Re.js";
+import { I as a } from "../../Input-D46mAsdt.js";
 export {
   a as Input
 };

package/dist/components/Fields/Numeric.js

@@ -3,7 +3,7 @@ import b from "classnames";
 import f, { useRef as y, useImperativeHandle as _, useCallback as c } from "react";
 import { Icon as i } from "../Icon/Icon.js";
 import { Button as o } from "../Button/Button.js";
-import { I as h } from "../../Input-DbQTM4UI.js";
+import { I as h } from "../../Input-D46mAsdt.js";
 const v = "styles_numeric_dzUSE", w = "styles_increase_5S-Jo", E = "styles_decrease_j8UR6", s = {
   numeric: v,
   increase: w,

package/dist/components/Fields/Radio.js

@@ -2,7 +2,7 @@ import { jsxs as l, jsx as o } from "react/jsx-runtime";
 import c from "classnames";
 import f from "react";
 import { cssProps as n } from "../../utils/helpers.js";
-import { I as u, s } from "../../Input-DbQTM4UI.js";
+import { I as u, s } from "../../Input-D46mAsdt.js";
 const I = f.forwardRef(
   ({ size: r, error: t, label: a, className: e, style: i, required: d, ...m }, p) => /* @__PURE__ */ l(
     "label",

package/dist/components/Fields/Range.d.ts

@@ -0,0 +1,20 @@
+import { default as React } from 'react';
+import { BaseInputProps } from './Input';
+type TickMarksProps = {
+    ticks: number | (string | number)[];
+};
+export type RangeProps = Omit<BaseInputProps, 'min' | 'max' | 'value' | 'defaultValue'> & {
+    min?: number;
+    max?: number;
+    value?: number;
+    defaultValue?: number;
+    ticks?: TickMarksProps['ticks'];
+};
+export declare const Range: React.ForwardRefExoticComponent<Omit<BaseInputProps, "max" | "min" | "defaultValue" | "value"> & {
+    min?: number;
+    max?: number;
+    value?: number;
+    defaultValue?: number;
+    ticks?: TickMarksProps["ticks"];
+} & React.RefAttributes<HTMLInputElement>>;
+export {};

package/dist/components/Fields/Range.js

@@ -0,0 +1,54 @@
+import { jsxs as g, jsx as t } from "react/jsx-runtime";
+import R from "classnames";
+import w, { useRef as x, useState as T, useEffect as j, useCallback as P } from "react";
+import { V } from "../../ValidationTooltip-D8d9O6Re.js";
+import { cssProps as A, wrapNode as E } from "../../utils/helpers.js";
+const J = "styles_range_j9iED", D = "styles_range_thumb_6aftN", F = "styles_range_wrapper_LTcAf", H = "styles_range_track_HdlJx", L = "styles_ticks_YaeJb", n = {
+  range: J,
+  range_thumb: D,
+  range_wrapper: F,
+  range_track: H,
+  ticks: L
+};
+function f(r, a, e, s) {
+  r == null || r.style.setProperty("--progress", `${(s - a) / (e - a)}`);
+}
+const M = ({ ticks: r }) => {
+  const a = typeof r == "number" ? [...Array(r)] : r;
+  return a.length < 2 ? null : /* @__PURE__ */ t("ul", { "data-range-ticks": !0, className: n.ticks, children: a.map((e, s) => /* @__PURE__ */ t("li", { children: e !== void 0 && /* @__PURE__ */ t("small", { children: e }) }, s)) });
+}, B = w.forwardRef(
+  ({ size: r, height: a, error: e, ticks: s, className: m, style: y, children: u, onChange: c, ...i }, h) => {
+    const { min: l = 0, max: o = 100, defaultValue: v = 50, value: p = v } = i, d = x(null), [k, b] = T(null);
+    j(() => {
+      f(d.current, l, o, p);
+    }, [l, o, p]);
+    const N = P(
+      (_) => {
+        f(d.current, l, o, parseFloat(_.currentTarget.value)), c == null || c(_);
+      },
+      [l, o, c]
+    );
+    return /* @__PURE__ */ g(
+      "div",
+      {
+        ref: d,
+        "data-input": "range",
+        "data-disabled": i.disabled,
+        "data-invalid": e ? !0 : void 0,
+        className: R(n.range, m),
+        style: { ...y, ...A({ size: r, height: a }) },
+        children: [
+          /* @__PURE__ */ g("div", { className: n.range_wrapper, children: [
+            /* @__PURE__ */ t("div", { "data-range-track": !0, className: n.range_track }),
+            /* @__PURE__ */ t("div", { ref: b, "data-range-thumb": !0, className: n.range_thumb, children: u !== void 0 && E(u, "small") }),
+            /* @__PURE__ */ t(V, { content: e, placement: "top", anchor: k, children: /* @__PURE__ */ t("input", { ...i, ref: h, type: "range", onChange: N }) })
+          ] }),
+          s !== void 0 && /* @__PURE__ */ t(M, { ticks: s })
+        ]
+      }
+    );
+  }
+);
+export {
+  B as Range
+};

package/dist/components/Fields/Select.js

@@ -2,7 +2,7 @@ import { jsx as e } from "react/jsx-runtime";
 import l from "classnames";
 import c from "react";
 import { cssProps as m } from "../../utils/helpers.js";
-import { V as d, s as f } from "../../ValidationTooltip-BgSwl0hJ.js";
+import { V as d, s as f } from "../../ValidationTooltip-D8d9O6Re.js";
 const y = c.forwardRef(
   ({ size: o, error: t, className: s, style: a, ...r }, i) => /* @__PURE__ */ e(d, { content: t, children: /* @__PURE__ */ e(
     "select",

package/dist/components/Fields/Switch.js

@@ -1,8 +1,8 @@
 import { jsxs as d, jsx as t } from "react/jsx-runtime";
 import m from "react";
-import u from "classnames";
-import { cssProps as h } from "../../utils/helpers.js";
-import { V as f } from "../../ValidationTooltip-BgSwl0hJ.js";
+import h from "classnames";
+import { cssProps as u } from "../../utils/helpers.js";
+import { V as f } from "../../ValidationTooltip-D8d9O6Re.js";
 const _ = "styles_label_p-D4Y", w = "styles_input_VteBP", s = {
   switch: "styles_switch_UNvH8",
   label: _,
@@ -13,8 +13,8 @@ const _ = "styles_label_p-D4Y", w = "styles_input_VteBP", s = {
     {
       "data-input": "switch",
       "data-required": l,
-      className: u(s.switch, c),
-      style: { ...n, ...h({ size: a, checkedColor: o }) },
+      className: h(s.switch, c),
+      style: { ...n, ...u({ size: a, checkedColor: o }) },
       children: [
         /* @__PURE__ */ t(f, { content: i, children: /* @__PURE__ */ t(
           "input",

package/dist/components/Fields/Textarea.js

@@ -3,7 +3,7 @@ import c from "classnames";
 import d from "react";
 import f from "react-textarea-autosize";
 import { cssProps as l } from "../../utils/helpers.js";
-import { V as x, s as u } from "../../ValidationTooltip-BgSwl0hJ.js";
+import { V as x, s as u } from "../../ValidationTooltip-D8d9O6Re.js";
 const _ = d.forwardRef(
   ({ autosize: t = !0, size: e, error: o, className: s, style: m, ...a }, i) => {
     const n = t ? f : "textarea", p = t ? { minRows: 2, ...a } : a;

package/dist/components/Fields/ValidationTooltip.d.ts

@@ -1,2 +1,2 @@
 import { TooltipProps } from '../Tooltip';
-export declare const ValidationTooltip: (props: TooltipProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ValidationTooltip: ({ className, ...props }: TooltipProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Fields/ValidationTooltip.js

@@ -1,6 +1,7 @@
 import "react/jsx-runtime";
+import "classnames";
 import "../Tooltip/Tooltip.js";
-import { V as r } from "../../ValidationTooltip-BgSwl0hJ.js";
+import { V as m } from "../../ValidationTooltip-D8d9O6Re.js";
 export {
-  r as ValidationTooltip
+  m as ValidationTooltip
 };

package/dist/components/Fields/index.d.ts

@@ -3,6 +3,7 @@ export * from './Field';
 export * from './Input';
 export * from './Numeric';
 export * from './Radio';
+export * from './Range';
 export * from './Select';
 export * from './Switch';
 export * from './Textarea';

package/dist/components/Fields/index.js

@@ -1,22 +1,24 @@
 import { Checkbox as e } from "./Checkbox.js";
-import { Field as p, FieldDescription as i, FieldLabel as x } from "./Field.js";
-import { I as f } from "../../Input-DbQTM4UI.js";
+import { Field as p, FieldDescription as x, FieldLabel as i } from "./Field.js";
+import { I as f } from "../../Input-D46mAsdt.js";
 import { Numeric as l } from "./Numeric.js";
 import { Radio as d } from "./Radio.js";
-import { Select as s } from "./Select.js";
-import { Switch as b } from "./Switch.js";
-import { Textarea as u } from "./Textarea.js";
-import { V as S } from "../../ValidationTooltip-BgSwl0hJ.js";
+import { Range as s } from "./Range.js";
+import { Select as b } from "./Select.js";
+import { Switch as u } from "./Switch.js";
+import { Textarea as R } from "./Textarea.js";
+import { V as T } from "../../ValidationTooltip-D8d9O6Re.js";
 export {
   e as Checkbox,
   p as Field,
-  i as FieldDescription,
-  x as FieldLabel,
+  x as FieldDescription,
+  i as FieldLabel,
   f as Input,
   l as Numeric,
   d as Radio,
-  s as Select,
-  b as Switch,
-  u as Textarea,
-  S as ValidationTooltip
+  s as Range,
+  b as Select,
+  u as Switch,
+  R as Textarea,
+  T as ValidationTooltip
 };

package/dist/components/Menu/Menu.d.ts

@@ -1,9 +1,13 @@
 import { default as React } from 'react';
 import { Placement } from '@floating-ui/react';
-export type MenuProps = React.HTMLAttributes<HTMLDivElement> & {
+export type MenuProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> & {
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
     placement?: Placement;
     trigger: React.JSX.Element;
     minWidth?: React.CSSProperties['minWidth'];
     maxWidth?: React.CSSProperties['maxWidth'];
+    minHeight?: React.CSSProperties['minHeight'];
+    maxHeight?: React.CSSProperties['maxHeight'];
+    onSelect?: (index: number) => void;
 };
-export declare const Menu: ({ placement, trigger, minWidth, maxWidth, className, children, ...props }: MenuProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Menu: ({ size, placement, trigger, minWidth, maxWidth, minHeight, maxHeight, className, children, onSelect, ...props }: MenuProps) => import("react/jsx-runtime").JSX.Element;