quirk-ui 0.0.6 → 0.0.7

package/dist/components/DatePicker/index.js

@@ -1,15 +1,16 @@
-import { jsxs as h, jsx as t } from "react/jsx-runtime";
-import { useState as n } from "react";
+import { jsxs as h, jsx as e } from "react/jsx-runtime";
+import { useState as i } from "react";
+import "../Tabs/index.js";
 import { Label as w } from "../Label/index.js";
-import { f as x, C as D } from "../../index-DhqFdMqD.js";
-import '../../assets/index24.css';const S = "_wrapper_13tha_1", N = "_input_13tha_7", O = "_popover_13tha_25", s = {
+import { f as x, C as D } from "../../index-RF23qrF-.js";
+import '../../assets/index40.css';const S = "_wrapper_13tha_1", N = "_input_13tha_7", O = "_popover_13tha_25", s = {
   wrapper: S,
   input: N,
   popover: O
 };
-function F({
+function I({
   id: o,
-  name: i,
+  name: n,
   label: m,
   onValueChange: r,
   required: a = !1,
@@ -19,18 +20,18 @@ function F({
   className: d,
   ...v
 }) {
-  const [p, y] = n(null), [u, l] = n(!1);
+  const [p, y] = i(null), [u, l] = i(!1);
   return /* @__PURE__ */ h("div", { className: `${s.wrapper} ${d ?? ""}`, children: [
-    /* @__PURE__ */ t(w, { htmlFor: o, required: a, disabled: c, children: m }),
-    /* @__PURE__ */ t(
+    /* @__PURE__ */ e(w, { htmlFor: o, required: a, disabled: c, children: m }),
+    /* @__PURE__ */ e(
       "input",
       {
         id: o,
-        name: i,
+        name: n,
         type: "text",
         readOnly: !0,
         value: p ? x(p, "yyyy-MM-dd") : "",
-        onClick: () => l((e) => !e),
+        onClick: () => l((t) => !t),
         placeholder: "Select date",
         required: a,
         disabled: c,
@@ -40,17 +41,17 @@ function F({
         ...v
       }
     ),
-    u && /* @__PURE__ */ t("div", { className: s.popover, children: /* @__PURE__ */ t(
+    u && /* @__PURE__ */ e("div", { className: s.popover, children: /* @__PURE__ */ e(
       D,
       {
         selectedDate: p,
-        onSelectDate: (e) => {
-          r == null || r(e), y(e), l(!1);
+        onSelectDate: (t) => {
+          r == null || r(t), y(t), l(!1);
         }
       }
     ) })
   ] });
 }
 export {
-  F as DatePicker
+  I as DatePicker
 };

package/dist/components/Divider/Divider.test.js

@@ -1,18 +1,19 @@
 import { jsx as r } from "react/jsx-runtime";
-import { d as c, i as e, r as i, g as a } from "../../index-BWTAh3RO.js";
-import { Divider as t } from "./index.js";
-c("Spacer", () => {
+import { d as o, i as e, r as i, g as t } from "../../vi.B-PuvDzu-a048kFcX.js";
+import { Divider as a } from "./index.js";
+import "../../index-Bgo8MuTU.js";
+o("Spacer", () => {
   e("renders with default props", () => {
-    const { container: s } = i(/* @__PURE__ */ r(t, {}));
-    a(s.firstChild).toHaveClass("horizontal", "divider");
+    const { container: s } = i(/* @__PURE__ */ r(a, {}));
+    t(s.firstChild).toHaveClass("horizontal", "divider");
   }), e("renders the correct classes", () => {
-    const { container: s } = i(/* @__PURE__ */ r(t, { axis: "vertical" }));
-    a(s.firstChild).toHaveClass("vertical", "divider");
+    const { container: s } = i(/* @__PURE__ */ r(a, { axis: "vertical" }));
+    t(s.firstChild).toHaveClass("vertical", "divider");
   }), e("renders custom classes", () => {
     const { container: s } = i(
-      /* @__PURE__ */ r(t, { className: "custom-class", axis: "vertical" })
+      /* @__PURE__ */ r(a, { className: "custom-class", axis: "vertical" })
     );
-    a(s.firstChild).toHaveClass(
+    t(s.firstChild).toHaveClass(
       "custom-class",
       "vertical",
       "divider"

package/dist/components/Drawer/Drawer.test.js

@@ -0,0 +1,35 @@
+import { jsx as e, jsxs as f } from "react/jsx-runtime";
+import { d as h, i as r, r as s, v as t, g as l, s as c, f as a } from "../../vi.B-PuvDzu-a048kFcX.js";
+import { Drawer as i } from "./index.js";
+import "../../index-Bgo8MuTU.js";
+h("Drawer", () => {
+  const n = /* @__PURE__ */ e("nav", { children: /* @__PURE__ */ f("ul", { children: [
+    /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e("a", { href: "/profile", children: "Profile" }) }),
+    /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e("a", { href: "/settings", children: "Settings" }) })
+  ] }) });
+  r("renders drawer content when open", () => {
+    s(
+      /* @__PURE__ */ e(i, { isOpen: !0, onClose: t.fn(), position: "left", overlay: !0, children: n })
+    ), l(c.getByRole("dialog")).toHaveClass("open");
+  }), r("does not render drawer content when open", () => {
+    s(
+      /* @__PURE__ */ e(i, { isOpen: !1, onClose: t.fn(), position: "left", overlay: !0, children: n })
+    ), l(c.getByRole("dialog")).not.toHaveClass("open");
+  }), r("calls onClose when clicking outside the drawer", () => {
+    const o = t.fn();
+    s(
+      /* @__PURE__ */ e(i, { isOpen: !0, onClose: o, position: "left", overlay: !0, children: n })
+    ), a.mouseDown(document.body), l(o).toHaveBeenCalled();
+  }), r("does not call onClose when clicking inside the drawer", () => {
+    const o = t.fn(), { container: p } = s(
+      /* @__PURE__ */ e(i, { isOpen: !1, onClose: o, position: "left", overlay: !0, children: n })
+    ), d = p.querySelector(".drawer");
+    if (!d) throw new Error("Drawer not found");
+    a.mouseDown(d), l(o).not.toHaveBeenCalled();
+  }), r("calls onClose when Escape key is pressed", () => {
+    const o = t.fn();
+    s(
+      /* @__PURE__ */ e(i, { isOpen: !0, onClose: o, position: "left", overlay: !0, children: n })
+    ), a.keyDown(document, { key: "Escape", code: "Escape" }), l(o).toHaveBeenCalled();
+  });
+});

package/dist/components/Drawer/__mocks__/styles.module.css.js

@@ -0,0 +1,9 @@
+const t = {
+  left: "left",
+  right: "right",
+  top: "top",
+  bottom: "bottom"
+};
+export {
+  t as default
+};

package/dist/components/Drawer/index.js

@@ -0,0 +1,55 @@
+import { jsxs as f, Fragment as y, jsx as s } from "react/jsx-runtime";
+import { useRef as w, useEffect as d } from "react";
+import '../../assets/index31.css';const l = "_drawer_55xty_1", h = "_right_55xty_12", p = "_left_55xty_18", x = "_top_55xty_24", v = "_bottom_55xty_32", g = "_open_55xty_40", b = "_overlay_55xty_50", E = "_show_55xty_60", e = {
+  drawer: l,
+  right: h,
+  left: p,
+  top: x,
+  bottom: v,
+  open: g,
+  overlay: b,
+  show: E
+}, $ = {
+  left: e.left,
+  right: e.right,
+  top: e.top,
+  bottom: e.bottom
+};
+function j({
+  isOpen: o,
+  onClose: t,
+  position: _ = "left",
+  overlay: c = !0,
+  ariaLabel: i = "Sidebar",
+  children: m,
+  className: u
+}) {
+  const n = w(null);
+  return d(() => {
+    const r = (a) => {
+      a.key === "Escape" && (t == null || t());
+    };
+    return document.addEventListener("keydown", r), () => document.removeEventListener("keydown", r);
+  }, [t]), d(() => {
+    const r = (a) => {
+      o && n.current && !n.current.contains(a.target) && (t == null || t());
+    };
+    return document.addEventListener("mousedown", r), () => document.removeEventListener("mousedown", r);
+  }, [o, t, c]), /* @__PURE__ */ f(y, { children: [
+    c && /* @__PURE__ */ s("div", { className: `${e.overlay} ${o ? e.show : ""}` }),
+    /* @__PURE__ */ s(
+      "aside",
+      {
+        ref: n,
+        className: `${e.drawer} ${$[_]} ${o ? e.open : ""} ${u ?? ""}`,
+        role: "dialog",
+        "aria-label": i,
+        "aria-modal": "true",
+        children: m
+      }
+    )
+  ] });
+}
+export {
+  j as Drawer
+};

package/dist/components/Fieldset/Fieldset.test.js

@@ -1,7 +1,8 @@
 import { jsx as e } from "react/jsx-runtime";
-import { d as l, i as t, r, g as n, s as d } from "../../index-BWTAh3RO.js";
+import { d as o, i as t, r, g as n, s as d } from "../../vi.B-PuvDzu-a048kFcX.js";
 import { Fieldset as i } from "./index.js";
-l("Fieldset", () => {
+import "../../index-Bgo8MuTU.js";
+o("Fieldset", () => {
   t("renders children", () => {
     r(
       /* @__PURE__ */ e(i, { children: /* @__PURE__ */ e("input", { type: "text", placeholder: "Text input" }) })

package/dist/components/Fieldset/index.js

@@ -1,5 +1,5 @@
 import { jsxs as i, jsx as n } from "react/jsx-runtime";
-import '../../assets/index22.css';const c = "_fieldset_1i2zv_1", f = "_legend_1i2zv_8", s = {
+import '../../assets/index35.css';const c = "_fieldset_1i2zv_1", f = "_legend_1i2zv_8", s = {
   fieldset: c,
   legend: f
 };

package/dist/components/FileUpload/FileUpload.test.js

@@ -1,6 +1,7 @@
 import { jsx as o } from "react/jsx-runtime";
-import { d as c, i as t, r as l, g as s, s as n, v as a, f as d } from "../../index-BWTAh3RO.js";
+import { d as c, i as t, r as l, g as s, s as n, v as a, f as d } from "../../vi.B-PuvDzu-a048kFcX.js";
 import { FileUpload as r } from "./index.js";
+import "../../index-Bgo8MuTU.js";
 c("FileUpload", () => {
   t("renders the label correctly", () => {
     l(/* @__PURE__ */ o(r, { label: "Upload your resume", onFilesChange: () => {

package/dist/components/FileUpload/index.js

@@ -1,16 +1,17 @@
 import { jsxs as c, jsx as n } from "react/jsx-runtime";
 import { useRef as x, useState as h } from "react";
 import { IconButton as N } from "../IconButton/index.js";
+import "../Tabs/index.js";
 import { Label as Z } from "../Label/index.js";
 import { T as z } from "../../trash-2-2Rn0a4s6.js";
-import '../../assets/index25.css';const I = "_wrapper_s8dew_1", R = "_dropZone_s8dew_7", T = "_dragging_s8dew_25", j = "_input_s8dew_30", A = "_fileList_s8dew_34", i = {
+import '../../assets/index42.css';const I = "_wrapper_s8dew_1", R = "_dropZone_s8dew_7", T = "_dragging_s8dew_25", j = "_input_s8dew_30", A = "_fileList_s8dew_34", i = {
   wrapper: I,
   dropZone: R,
   dragging: T,
   input: j,
   fileList: A
 };
-function b({
+function E({
   id: D,
   name: w,
   label: p = "Upload files",
@@ -95,5 +96,5 @@ function b({
   ] });
 }
 export {
-  b as FileUpload
+  E as FileUpload
 };

package/dist/components/FloatingActionButton/FloatingActionButton.test.js

@@ -1,36 +1,27 @@
 import { jsx as e } from "react/jsx-runtime";
-import { d as r, i as o, r as c, g as i, s, v as d, f as m } from "../../index-BWTAh3RO.js";
-import { FloatingActionButton as l } from "./index.js";
-import { c as h } from "../../createLucideIcon-C8GTh_Qx.js";
-/**
- * @license lucide-react v0.488.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
-const p = [
-  ["path", { d: "M5 12h14", key: "1ays0h" }],
-  ["path", { d: "M12 5v14", key: "s699le" }]
-], n = h("plus", p);
+import { d as r, i as o, r as i, g as l, s, v as d, f as m } from "../../vi.B-PuvDzu-a048kFcX.js";
+import { FloatingActionButton as c } from "./index.js";
+import "../../index-Bgo8MuTU.js";
+import { P as n } from "../../plus-Cs7TaIK9.js";
 r("FloatingActionButton", () => {
   o("renders the icon", () => {
-    c(/* @__PURE__ */ e(l, { icon: /* @__PURE__ */ e(n, {}), "aria-label": "Add" })), i(s.getByLabelText("Add")).toBeInTheDocument();
+    i(/* @__PURE__ */ e(c, { icon: /* @__PURE__ */ e(n, {}), "aria-label": "Add" })), l(s.getByLabelText("Add")).toBeInTheDocument();
   }), o("calls onClick when clicked", () => {
     const t = d.fn();
-    c(
+    i(
       /* @__PURE__ */ e(
-        l,
+        c,
         {
           onClick: t,
           icon: /* @__PURE__ */ e(n, {}),
           "aria-label": "Add"
         }
       )
-    ), m.click(s.getByLabelText("Add")), i(t).toHaveBeenCalledTimes(1);
+    ), m.click(s.getByLabelText("Add")), l(t).toHaveBeenCalledTimes(1);
   }), o("applies the correct size class", () => {
-    const { container: t } = c(
-      /* @__PURE__ */ e(l, { icon: /* @__PURE__ */ e(n, {}), "aria-label": "Add", size: "lg" })
+    const { container: t } = i(
+      /* @__PURE__ */ e(c, { icon: /* @__PURE__ */ e(n, {}), "aria-label": "Add", size: "lg" })
     ), a = t.querySelector("button");
-    i(a == null ? void 0 : a.className).toMatch(/lg/);
+    l(a == null ? void 0 : a.className).toMatch(/lg/);
   });
 });

package/dist/components/Form/Form.test.js

@@ -1,6 +1,7 @@
 import { jsx as e } from "react/jsx-runtime";
-import { d as i, i as o, r, g as s, s as a } from "../../index-BWTAh3RO.js";
+import { d as i, i as o, r, g as s, s as a } from "../../vi.B-PuvDzu-a048kFcX.js";
 import { Form as m } from "./index.js";
+import "../../index-Bgo8MuTU.js";
 i("Form", () => {
   o("renders children", () => {
     r(

package/dist/components/Form/index.js

@@ -1,5 +1,5 @@
 import { jsx as n } from "react/jsx-runtime";
-import '../../assets/index20.css';const c = "_form_s0yvj_1", a = {
+import '../../assets/index33.css';const c = "_form_s0yvj_1", a = {
   form: c
 };
 function p({

package/dist/components/Grid/Grid.test.js

@@ -1,17 +1,18 @@
 import { jsxs as n, jsx as e } from "react/jsx-runtime";
-import { d as o, i as d, r as s, g as i, s as m } from "../../index-BWTAh3RO.js";
-import { Grid as l } from "./index.js";
+import { d as o, i as d, r as m, g as i, s as l } from "../../vi.B-PuvDzu-a048kFcX.js";
+import { Grid as s } from "./index.js";
+import "../../index-Bgo8MuTU.js";
 o("Grid", () => {
   d("renders children", () => {
-    s(
-      /* @__PURE__ */ n(l, { columns: 2, children: [
+    m(
+      /* @__PURE__ */ n(s, { columns: 2, children: [
         /* @__PURE__ */ e("div", { children: "Item 1" }),
         /* @__PURE__ */ e("div", { children: "Item 2" })
       ] })
-    ), i(m.getByText("Item 1")).toBeInTheDocument(), i(m.getByText("Item 2")).toBeInTheDocument();
+    ), i(l.getByText("Item 1")).toBeInTheDocument(), i(l.getByText("Item 2")).toBeInTheDocument();
   }), d("applies correct number of columns", () => {
-    const { container: t } = s(
-      /* @__PURE__ */ n(l, { columns: 3, children: [
+    const { container: t } = m(
+      /* @__PURE__ */ n(s, { columns: 3, children: [
         /* @__PURE__ */ e("div", { children: "Item 1" }),
         /* @__PURE__ */ e("div", { children: "Item 2" }),
         /* @__PURE__ */ e("div", { children: "Item 3" })
@@ -19,8 +20,8 @@ o("Grid", () => {
     ), r = t.firstChild;
     i(r.style.gridTemplateColumns).toBe("repeat(3, 1fr)");
   }), d("uses auto-fit minmax", () => {
-    const { container: t } = s(
-      /* @__PURE__ */ n(l, { columns: 3, autoFitMinMax: "250px", gap: "2rem", children: [
+    const { container: t } = m(
+      /* @__PURE__ */ n(s, { columns: 3, autoFitMinMax: "250px", gap: "2rem", children: [
         /* @__PURE__ */ e("div", { children: "Item 1" }),
         /* @__PURE__ */ e("div", { children: "Item 2" }),
         /* @__PURE__ */ e("div", { children: "Item 3" })
@@ -34,8 +35,8 @@ o("Grid", () => {
       ["header", "header"],
       ["sidebar", "main"],
       ["footer, footer"]
-    ], { container: r } = s(
-      /* @__PURE__ */ n(l, { columns: 3, areas: t, gap: "2rem", children: [
+    ], { container: r } = m(
+      /* @__PURE__ */ n(s, { columns: 3, areas: t, gap: "2rem", children: [
         /* @__PURE__ */ e("div", { children: "Item 1" }),
         /* @__PURE__ */ e("div", { children: "Item 2" }),
         /* @__PURE__ */ e("div", { children: "Item 3" })
@@ -47,8 +48,8 @@ o("Grid", () => {
       r.firstChild.style.gridTemplateAreas
     ).toContain("main");
   }), d("applies custom gap", () => {
-    const { container: t } = s(
-      /* @__PURE__ */ n(l, { columns: 3, gap: "2rem", children: [
+    const { container: t } = m(
+      /* @__PURE__ */ n(s, { columns: 3, gap: "2rem", children: [
         /* @__PURE__ */ e("div", { children: "Item 1" }),
         /* @__PURE__ */ e("div", { children: "Item 2" }),
         /* @__PURE__ */ e("div", { children: "Item 3" })

package/dist/components/Grid/index.js

@@ -1,32 +1,68 @@
-import { jsx as a } from "react/jsx-runtime";
-import '../../assets/index16.css';const g = "_grid_1ua6c_1", n = {
-  grid: g
+import { jsx as u } from "react/jsx-runtime";
+import '../../assets/index16.css';const y = "_grid_1pzcn_1", $ = {
+  grid: y
 };
-function y({
+function v({
   columns: r = 1,
-  gap: d = "1rem",
-  areas: i,
-  autoFitMinMax: t,
+  gap: a = "1rem",
+  areas: o,
+  autoFitMinMax: l,
   className: s,
-  children: m,
-  style: l,
-  ...o
+  children: p,
+  style: n,
+  ...m
 }) {
   const e = {
-    ...l,
+    ...n,
     display: "grid",
-    gap: d
+    gap: a
   };
-  return i ? e.gridTemplateAreas = i.map((p) => `"${p.join(" ")}"`).join(" ") : t ? e.gridTemplateColumns = `repeat(auto-fit, minmax(${t}, 1fr))` : e.gridTemplateColumns = typeof r == "number" ? `repeat(${r}, 1fr)` : r, /* @__PURE__ */ a(
+  if (o)
+    e.gridTemplateAreas = o.map((t) => `"${t.join(" ")}"`).join(" ");
+  else if (l)
+    e.gridTemplateColumns = `repeat(auto-fit, minmax(${l}, 1fr))`;
+  else if (typeof r == "object") {
+    const { xs: t, sm: d, md: f, lg: g, xl: x, "2xl": b } = r;
+    [
+      {
+        breakpoint: "xs",
+        value: t
+      },
+      {
+        breakpoint: "sm",
+        value: d
+      },
+      {
+        breakpoint: "md",
+        value: f
+      },
+      {
+        breakpoint: "lg",
+        value: g
+      },
+      {
+        breakpoint: "xl",
+        value: x
+      },
+      {
+        breakpoint: "2xl",
+        value: b
+      }
+    ].forEach(({ breakpoint: c, value: i }) => {
+      i && (e[`--${c}-columns`] = typeof i == "number" ? `repeat(${i}, 1fr)` : i);
+    });
+  } else
+    e.gridTemplateColumns = typeof r == "number" ? `repeat(${r}, 1fr)` : r;
+  return console.log(e), /* @__PURE__ */ u(
     "div",
     {
-      className: `${n.grid} ${s ?? ""}`,
+      className: `${$.grid} ${s ?? ""}`,
       style: e,
-      ...o,
-      children: m
+      ...m,
+      children: p
     }
   );
 }
 export {
-  y as Grid
+  v as Grid
 };

package/dist/components/Heading/Heading.test.js

@@ -1,6 +1,7 @@
 import { jsx as t } from "react/jsx-runtime";
-import { d as i, i as a, r as s, s as d, g as l } from "../../index-BWTAh3RO.js";
+import { d as i, i as a, r as s, s as d, g as l } from "../../vi.B-PuvDzu-a048kFcX.js";
 import { Heading as n } from "./index.js";
+import "../../index-Bgo8MuTU.js";
 i("Heading", () => {
   a("renders with default level (h1)", () => {
     s(/* @__PURE__ */ t(n, { children: "Test Heading" }));

package/dist/components/IconButton/IconButton.test.js

@@ -1,16 +1,17 @@
 import { jsx as t } from "react/jsx-runtime";
-import { d as r, i as a, r as o, s as n, g as s, v as m, f as b } from "../../index-BWTAh3RO.js";
+import { d as r, i as o, r as a, s as n, g as s, v as m, f as b } from "../../vi.B-PuvDzu-a048kFcX.js";
 import { IconButton as l } from "./index.js";
+import "../../index-Bgo8MuTU.js";
 import { T as c } from "../../trash-2-2Rn0a4s6.js";
 r("IconButton", () => {
-  a("renders with icon and accessible label", () => {
-    o(
+  o("renders with icon and accessible label", () => {
+    a(
       /* @__PURE__ */ t(l, { icon: /* @__PURE__ */ t(c, { size: 21 }), srOnlyLabel: "Delete item" })
     );
     const e = n.getByRole("button", { name: /delete item/i });
     s(e).toBeInTheDocument();
-  }), a("applies the correct size and intent classes", () => {
-    o(
+  }), o("applies the correct size and intent classes", () => {
+    a(
       /* @__PURE__ */ t(
         l,
         {
@@ -24,15 +25,15 @@ r("IconButton", () => {
     );
     const e = n.getByRole("button", { name: /delete item/i });
     s(e.className).toMatch("custom-class"), s(e.className).toMatch("iconButton"), s(e.className).toMatch("lg"), s(e.className).toMatch("error");
-  }), a("can be disabled", () => {
-    o(
+  }), o("can be disabled", () => {
+    a(
       /* @__PURE__ */ t(l, { icon: /* @__PURE__ */ t(c, { size: 21 }), disabled: !0, srOnlyLabel: "Disabled" })
     );
     const e = n.getByRole("button", { name: /disabled/i });
     s(e.className).toBeDisabled;
-  }), a("calls onClick when clicked", () => {
+  }), o("calls onClick when clicked", () => {
     const e = m.fn();
-    o(
+    a(
       /* @__PURE__ */ t(
         l,
         {

package/dist/components/Input/Input.test.js

@@ -1,11 +1,12 @@
-import { jsx as r } from "react/jsx-runtime";
-import { d as m, i, r as t, g as e, s as a } from "../../index-BWTAh3RO.js";
+import { jsx as a } from "react/jsx-runtime";
+import { d as m, i, r as t, g as e, s as r } from "../../vi.B-PuvDzu-a048kFcX.js";
 import { Input as l } from "./index.js";
+import "../../index-Bgo8MuTU.js";
 m("Input", () => {
   i("renders an input with a label", () => {
-    t(/* @__PURE__ */ r(l, { label: "email", name: "email" })), e(a.getByLabelText("email")).toBeInTheDocument();
+    t(/* @__PURE__ */ a(l, { label: "email", name: "email" })), e(r.getByLabelText("email")).toBeInTheDocument();
   }), i("renders an error message if provided", () => {
-    t(/* @__PURE__ */ r(l, { label: "email", name: "email", error: "Required field" })), e(a.getByText("Required field")).toBeInTheDocument(), e(a.getByLabelText("email")).toHaveAttribute(
+    t(/* @__PURE__ */ a(l, { label: "email", name: "email", error: "Required field" })), e(r.getByText("Required field")).toBeInTheDocument(), e(r.getByLabelText("email")).toHaveAttribute(
       "aria-invalid",
       "true"
     );

package/dist/components/Input/index.js

@@ -1,37 +1,38 @@
-import { jsxs as m, jsx as n } from "react/jsx-runtime";
+import { jsxs as _, jsx as t } from "react/jsx-runtime";
 import "react";
+import "../Tabs/index.js";
 import { Label as u } from "../Label/index.js";
-import '../../assets/index21.css';const d = "_wrapper_1fwv5_1", l = "_input_1fwv5_7", w = "_error_1fwv5_25", f = "_errorMessage_1fwv5_29", e = {
+import '../../assets/index34.css';const d = "_wrapper_1fwv5_1", l = "_input_1fwv5_7", w = "_error_1fwv5_25", f = "_errorMessage_1fwv5_29", e = {
   wrapper: d,
   input: l,
   error: w,
   errorMessage: f
 };
-function M({
-  label: t,
+function $({
+  label: n,
   id: o,
   className: a,
   error: r,
   required: p,
   optional: c,
-  tooltip: _,
+  tooltip: m,
   ...s
 }) {
   const i = o ?? s.name ?? `input-${Math.random().toString(36).slice(2)}`;
-  return /* @__PURE__ */ m("div", { className: `${e.wrapper} ${a ?? ""}`, children: [
-    t && /* @__PURE__ */ n(
+  return /* @__PURE__ */ _("div", { className: `${e.wrapper} ${a ?? ""}`, children: [
+    n && /* @__PURE__ */ t(
       u,
       {
         htmlFor: i,
         required: p,
         optional: c,
         intent: r ? "error" : "default",
-        tooltip: _,
+        tooltip: m,
         showErrorIcon: !!r,
-        children: t
+        children: n
       }
     ),
-    /* @__PURE__ */ n(
+    /* @__PURE__ */ t(
       "input",
       {
         id: i,
@@ -40,9 +41,9 @@ function M({
         ...s
       }
     ),
-    r && /* @__PURE__ */ n("div", { className: e.errorMessage, children: r })
+    r && /* @__PURE__ */ t("div", { className: e.errorMessage, children: r })
   ] });
 }
 export {
-  M as Input
+  $ as Input
 };

package/dist/components/Label/Label.test.js

@@ -1,6 +1,7 @@
 import { jsx as t } from "react/jsx-runtime";
-import { d as s, i as o, r as n, g as e, s as r } from "../../index-BWTAh3RO.js";
+import { d as s, i as o, r as n, g as e, s as r } from "../../vi.B-PuvDzu-a048kFcX.js";
 import { Label as l } from "./index.js";
+import "../../index-Bgo8MuTU.js";
 s("Label", () => {
   o("renders label text", () => {
     n(/* @__PURE__ */ t(l, { htmlFor: "username", children: "Username" })), e(r.getByText("Username")).toBeInTheDocument();