@vesture/react 0.1.0

package/dist/index.js

@@ -0,0 +1,1349 @@
+// src/components/Button/Button.tsx
+import { forwardRef } from "react";
+
+// src/components/Button/Button.css.ts
+var button = "Button_button__w1yuq20";
+var variant = { primary: "Button_variant_primary__w1yuq21", secondary: "Button_variant_secondary__w1yuq22", ghost: "Button_variant_ghost__w1yuq23" };
+
+// src/components/Button/Button.tsx
+import { jsx } from "react/jsx-runtime";
+var Button = forwardRef(
+  function Button2({ variant: variantProp = "primary", className, ...rest }, ref) {
+    const classes = [button, variant[variantProp], className].filter(Boolean).join(" ");
+    return /* @__PURE__ */ jsx("button", { ref, className: classes, ...rest });
+  }
+);
+
+// src/components/Label/Label.tsx
+import { forwardRef as forwardRef2 } from "react";
+
+// src/components/Label/Label.css.ts
+var label = "Label_label__7kn8v10";
+var requiredMark = "Label_requiredMark__7kn8v11";
+
+// src/components/Label/Label.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var Label = forwardRef2(function Label2({ required, disabled, className, children, ...rest }, ref) {
+  const classes = [label, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs("label", { ref, className: classes, "data-disabled": disabled || void 0, ...rest, children: [
+    children,
+    required ? /* @__PURE__ */ jsx2("span", { className: requiredMark, "aria-hidden": "true", children: "*" }) : null
+  ] });
+});
+
+// src/components/Input/Input.tsx
+import { forwardRef as forwardRef3 } from "react";
+
+// src/components/Input/Input.css.ts
+var input = "Input_input__baytuv0";
+
+// src/components/Input/Input.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Input = forwardRef3(function Input2({ invalid, className, ...rest }, ref) {
+  const classes = [input, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx3("input", { ref, className: classes, "aria-invalid": invalid || void 0, ...rest });
+});
+
+// src/components/Textarea/Textarea.tsx
+import { forwardRef as forwardRef4 } from "react";
+
+// src/components/Textarea/Textarea.css.ts
+var textarea = "Textarea_textarea__1ucrsbx0";
+
+// src/components/Textarea/Textarea.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Textarea = forwardRef4(function Textarea2({ invalid, className, ...rest }, ref) {
+  const classes = [textarea, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx4("textarea", { ref, className: classes, "aria-invalid": invalid || void 0, ...rest });
+});
+
+// src/components/Select/Select.tsx
+import { forwardRef as forwardRef5 } from "react";
+
+// src/components/Select/Select.css.ts
+var chevron = "Select_chevron__1ciea9l2";
+var select = "Select_select__1ciea9l1";
+var wrapper = "Select_wrapper__1ciea9l0";
+
+// src/components/Select/Select.tsx
+import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+var Select = forwardRef5(function Select2({ invalid, className, children, ...rest }, ref) {
+  const classes = [select, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs2("span", { className: wrapper, children: [
+    /* @__PURE__ */ jsx5("select", { ref, className: classes, "aria-invalid": invalid || void 0, ...rest, children }),
+    /* @__PURE__ */ jsx5("span", { className: chevron, "aria-hidden": "true" })
+  ] });
+});
+
+// src/components/Checkbox/Checkbox.tsx
+import { forwardRef as forwardRef6 } from "react";
+
+// src/components/Checkbox/Checkbox.css.ts
+var box = "Checkbox_box__7029a22";
+var hiddenInput = "Checkbox_hiddenInput__7029a21";
+var wrapper2 = "Checkbox_wrapper__7029a20";
+
+// src/components/Checkbox/Checkbox.tsx
+import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
+var Checkbox = forwardRef6(function Checkbox2({ label: label3, className, ...rest }, ref) {
+  return /* @__PURE__ */ jsxs3("label", { className: [wrapper2, className].filter(Boolean).join(" "), children: [
+    /* @__PURE__ */ jsx6("input", { ref, type: "checkbox", className: hiddenInput, ...rest }),
+    /* @__PURE__ */ jsx6("span", { className: box, "aria-hidden": "true" }),
+    label3
+  ] });
+});
+
+// src/components/Radio/Radio.tsx
+import { forwardRef as forwardRef7 } from "react";
+
+// src/components/Radio/Radio.css.ts
+var circle = "Radio_circle__gzk3vv2";
+var hiddenInput2 = "Radio_hiddenInput__gzk3vv1";
+var wrapper3 = "Radio_wrapper__gzk3vv0";
+
+// src/components/Radio/Radio.tsx
+import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
+var Radio = forwardRef7(function Radio2({ label: label3, className, ...rest }, ref) {
+  return /* @__PURE__ */ jsxs4("label", { className: [wrapper3, className].filter(Boolean).join(" "), children: [
+    /* @__PURE__ */ jsx7("input", { ref, type: "radio", className: hiddenInput2, ...rest }),
+    /* @__PURE__ */ jsx7("span", { className: circle, "aria-hidden": "true" }),
+    label3
+  ] });
+});
+
+// src/components/Switch/Switch.tsx
+import { forwardRef as forwardRef8 } from "react";
+
+// src/components/Switch/Switch.css.ts
+var hiddenInput3 = "Switch_hiddenInput__1yxysfy1";
+var track = "Switch_track__1yxysfy2";
+var wrapper4 = "Switch_wrapper__1yxysfy0";
+
+// src/components/Switch/Switch.tsx
+import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
+var Switch = forwardRef8(function Switch2({ label: label3, className, ...rest }, ref) {
+  return /* @__PURE__ */ jsxs5("label", { className: [wrapper4, className].filter(Boolean).join(" "), children: [
+    /* @__PURE__ */ jsx8("input", { ref, type: "checkbox", role: "switch", className: hiddenInput3, ...rest }),
+    /* @__PURE__ */ jsx8("span", { className: track, "aria-hidden": "true" }),
+    label3
+  ] });
+});
+
+// src/components/Card/Card.tsx
+import { forwardRef as forwardRef9 } from "react";
+
+// src/components/Card/Card.css.ts
+var card = "Card_card__mv7u2g0";
+var elevation = { flat: "Card_elevation_flat__mv7u2g1", raised: "Card_elevation_raised__mv7u2g2", overlay: "Card_elevation_overlay__mv7u2g3" };
+
+// src/components/Card/Card.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+var Card = forwardRef9(function Card2({ elevation: elevationProp = "flat", className, ...rest }, ref) {
+  const classes = [card, elevation[elevationProp], className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx9("div", { ref, className: classes, ...rest });
+});
+
+// src/components/Stack/Stack.tsx
+import { forwardRef as forwardRef10 } from "react";
+
+// src/components/Stack/Stack.css.ts
+var align = { start: "Stack_align_start__yit1113", center: "Stack_align_center__yit1114", end: "Stack_align_end__yit1115", stretch: "Stack_align_stretch__yit1116" };
+var direction = { row: "Stack_direction_row__yit1111", column: "Stack_direction_column__yit1112" };
+var gap = { xs: "Stack_gap_xs__yit111b", sm: "Stack_gap_sm__yit111c", md: "Stack_gap_md__yit111d", lg: "Stack_gap_lg__yit111e", xl: "Stack_gap_xl__yit111f", "2xl": "Stack_gap_2xl__yit111g" };
+var justify = { start: "Stack_justify_start__yit1117", center: "Stack_justify_center__yit1118", end: "Stack_justify_end__yit1119", between: "Stack_justify_between__yit111a" };
+var stack = "Stack_stack__yit1110";
+var wrapStyle = "Stack_wrapStyle__yit111h";
+
+// src/components/Stack/Stack.tsx
+import { jsx as jsx10 } from "react/jsx-runtime";
+var Stack = forwardRef10(function Stack2({
+  direction: directionProp = "column",
+  align: alignProp = "stretch",
+  justify: justifyProp = "start",
+  gap: gapProp = "md",
+  wrap = false,
+  className,
+  ...rest
+}, ref) {
+  const classes = [
+    stack,
+    direction[directionProp],
+    align[alignProp],
+    justify[justifyProp],
+    gap[gapProp],
+    wrap ? wrapStyle : null,
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx10("div", { ref, className: classes, ...rest });
+});
+
+// src/components/Divider/Divider.tsx
+import { forwardRef as forwardRef11 } from "react";
+
+// src/components/Divider/Divider.css.ts
+var base = "Divider_base__1qjfac50";
+var orientation = { horizontal: "Divider_orientation_horizontal__1qjfac51", vertical: "Divider_orientation_vertical__1qjfac52" };
+
+// src/components/Divider/Divider.tsx
+import { jsx as jsx11 } from "react/jsx-runtime";
+var Divider = forwardRef11(function Divider2({ orientation: orientationProp = "horizontal", className, ...rest }, ref) {
+  const classes = [base, orientation[orientationProp], className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx11(
+    "hr",
+    {
+      ref,
+      className: classes,
+      "aria-orientation": orientationProp,
+      ...rest
+    }
+  );
+});
+
+// src/components/Tooltip/Tooltip.tsx
+import { cloneElement, isValidElement, useRef, useState } from "react";
+import {
+  FloatingArrow,
+  FloatingPortal,
+  arrow,
+  autoUpdate,
+  flip,
+  offset,
+  shift,
+  useDismiss,
+  useFloating,
+  useFocus,
+  useHover,
+  useInteractions,
+  useMergeRefs,
+  useRole
+} from "@floating-ui/react";
+import { vars } from "@vesture/tokens";
+
+// src/components/Tooltip/Tooltip.css.ts
+var tooltip = "Tooltip_tooltip__foawl10";
+
+// src/components/Tooltip/Tooltip.tsx
+import { Fragment, jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
+function Tooltip({ content, placement = "top", children }) {
+  const [open, setOpen] = useState(false);
+  const arrowRef = useRef(null);
+  const { refs, floatingStyles, context } = useFloating({
+    open,
+    onOpenChange: setOpen,
+    placement,
+    whileElementsMounted: autoUpdate,
+    middleware: [offset(8), flip(), shift({ padding: 8 }), arrow({ element: arrowRef })]
+  });
+  const { getReferenceProps, getFloatingProps } = useInteractions([
+    useHover(context, { move: false }),
+    useFocus(context),
+    useRole(context, { role: "tooltip" }),
+    useDismiss(context)
+  ]);
+  const childRef = useMergeRefs([
+    refs.setReference,
+    children.ref ?? null
+  ]);
+  if (!isValidElement(children)) {
+    return children;
+  }
+  return /* @__PURE__ */ jsxs6(Fragment, { children: [
+    cloneElement(children, getReferenceProps({ ref: childRef, ...children.props })),
+    open ? /* @__PURE__ */ jsx12(FloatingPortal, { children: /* @__PURE__ */ jsxs6(
+      "div",
+      {
+        ref: refs.setFloating,
+        className: tooltip,
+        style: floatingStyles,
+        ...getFloatingProps(),
+        children: [
+          content,
+          /* @__PURE__ */ jsx12(FloatingArrow, { ref: arrowRef, context, fill: vars.color.text })
+        ]
+      }
+    ) }) : null
+  ] });
+}
+
+// src/components/Popover/Popover.tsx
+import { cloneElement as cloneElement2, isValidElement as isValidElement2, useState as useState2 } from "react";
+import {
+  FloatingFocusManager,
+  FloatingPortal as FloatingPortal2,
+  autoUpdate as autoUpdate2,
+  flip as flip2,
+  offset as offset2,
+  shift as shift2,
+  useClick,
+  useDismiss as useDismiss2,
+  useFloating as useFloating2,
+  useInteractions as useInteractions2,
+  useMergeRefs as useMergeRefs2,
+  useRole as useRole2
+} from "@floating-ui/react";
+
+// src/components/Popover/Popover.css.ts
+var popover = "Popover_popover__ke5el70";
+
+// src/components/Popover/Popover.tsx
+import { Fragment as Fragment2, jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
+function Popover({
+  content,
+  placement = "bottom-start",
+  open: controlledOpen,
+  onOpenChange,
+  children
+}) {
+  const [uncontrolledOpen, setUncontrolledOpen] = useState2(false);
+  const open = controlledOpen ?? uncontrolledOpen;
+  const setOpen = onOpenChange ?? setUncontrolledOpen;
+  const { refs, floatingStyles, context } = useFloating2({
+    open,
+    onOpenChange: setOpen,
+    placement,
+    whileElementsMounted: autoUpdate2,
+    middleware: [offset2(8), flip2(), shift2({ padding: 8 })]
+  });
+  const { getReferenceProps, getFloatingProps } = useInteractions2([
+    useClick(context),
+    useDismiss2(context),
+    useRole2(context, { role: "dialog" })
+  ]);
+  const childRef = useMergeRefs2([
+    refs.setReference,
+    children.ref ?? null
+  ]);
+  if (!isValidElement2(children)) {
+    return children;
+  }
+  return /* @__PURE__ */ jsxs7(Fragment2, { children: [
+    cloneElement2(children, getReferenceProps({ ref: childRef, ...children.props })),
+    open ? /* @__PURE__ */ jsx13(FloatingPortal2, { children: /* @__PURE__ */ jsx13(FloatingFocusManager, { context, modal: false, children: /* @__PURE__ */ jsx13("div", { ref: refs.setFloating, className: popover, style: floatingStyles, ...getFloatingProps(), children: content }) }) }) : null
+  ] });
+}
+
+// src/components/Modal/Modal.tsx
+import { useId } from "react";
+import {
+  FloatingFocusManager as FloatingFocusManager2,
+  FloatingOverlay,
+  FloatingPortal as FloatingPortal3,
+  useDismiss as useDismiss3,
+  useFloating as useFloating3,
+  useInteractions as useInteractions3,
+  useRole as useRole3
+} from "@floating-ui/react";
+
+// src/components/Modal/Modal.css.ts
+var closeButton = "Modal_closeButton__1eq75ae3";
+var heading = "Modal_heading__1eq75ae2";
+var modal = "Modal_modal__1eq75ae1";
+var overlay = "Modal_overlay__1eq75ae0";
+
+// src/components/Modal/Modal.tsx
+import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
+function Modal({ open, onOpenChange, title: title3, children }) {
+  const { refs, context } = useFloating3({ open, onOpenChange });
+  const { getFloatingProps } = useInteractions3([useDismiss3(context), useRole3(context)]);
+  const titleId = useId();
+  if (!open) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx14(FloatingPortal3, { children: /* @__PURE__ */ jsx14(FloatingOverlay, { className: overlay, lockScroll: true, children: /* @__PURE__ */ jsx14(FloatingFocusManager2, { context, children: /* @__PURE__ */ jsxs8(
+    "div",
+    {
+      ref: refs.setFloating,
+      className: modal,
+      "aria-labelledby": title3 ? titleId : void 0,
+      ...getFloatingProps(),
+      children: [
+        /* @__PURE__ */ jsx14(
+          "button",
+          {
+            type: "button",
+            className: closeButton,
+            "aria-label": "Close",
+            onClick: () => onOpenChange(false),
+            children: "\u2715"
+          }
+        ),
+        title3 ? /* @__PURE__ */ jsx14("h2", { id: titleId, className: heading, children: title3 }) : null,
+        children
+      ]
+    }
+  ) }) }) });
+}
+
+// src/components/Toast/ToastProvider.tsx
+import { createContext, useCallback, useMemo, useState as useState3 } from "react";
+import { createPortal } from "react-dom";
+
+// src/components/Toast/Toast.css.ts
+var accent = { "default": "Toast_accent_default__xnm1xa2", success: "Toast_accent_success__xnm1xa3", warning: "Toast_accent_warning__xnm1xa4", danger: "Toast_accent_danger__xnm1xa5" };
+var body = "Toast_body__xnm1xa8";
+var closeButton2 = "Toast_closeButton__xnm1xa9";
+var description = "Toast_description__xnm1xa7";
+var title = "Toast_title__xnm1xa6";
+var toast = "Toast_toast__xnm1xa1";
+var viewport = "Toast_viewport__xnm1xa0";
+
+// src/components/Toast/ToastProvider.tsx
+import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
+var ToastContext = createContext(null);
+var DEFAULT_DURATION = 5e3;
+function ToastProvider({ children }) {
+  const [toasts, setToasts] = useState3([]);
+  const dismiss = useCallback((id) => {
+    setToasts((current2) => current2.filter((item4) => item4.id !== id));
+  }, []);
+  const pushToast = useCallback(
+    (options) => {
+      const id = Date.now() + Math.random();
+      setToasts((current2) => [...current2, { id, ...options }]);
+      const duration = options.duration ?? DEFAULT_DURATION;
+      if (duration > 0) {
+        setTimeout(() => dismiss(id), duration);
+      }
+      return id;
+    },
+    [dismiss]
+  );
+  const value = useMemo(() => ({ toast: pushToast, dismiss }), [pushToast, dismiss]);
+  return /* @__PURE__ */ jsxs9(ToastContext.Provider, { value, children: [
+    children,
+    createPortal(
+      /* @__PURE__ */ jsx15("div", { className: viewport, role: "region", "aria-label": "Notifications", children: toasts.map((item4) => /* @__PURE__ */ jsxs9("div", { className: `${toast} ${accent[item4.variant ?? "default"]}`, role: "status", children: [
+        /* @__PURE__ */ jsxs9("div", { className: body, children: [
+          /* @__PURE__ */ jsx15("p", { className: title, children: item4.title }),
+          item4.description ? /* @__PURE__ */ jsx15("p", { className: description, children: item4.description }) : null
+        ] }),
+        /* @__PURE__ */ jsx15(
+          "button",
+          {
+            type: "button",
+            className: closeButton2,
+            "aria-label": "Dismiss",
+            onClick: () => dismiss(item4.id),
+            children: "\u2715"
+          }
+        )
+      ] }, item4.id)) }),
+      document.body
+    )
+  ] });
+}
+
+// src/components/Toast/useToast.ts
+import { useContext } from "react";
+function useToast() {
+  const context = useContext(ToastContext);
+  if (!context) {
+    throw new Error("useToast must be used within a ToastProvider");
+  }
+  return context;
+}
+
+// src/components/DropdownMenu/DropdownMenu.tsx
+import { cloneElement as cloneElement3, isValidElement as isValidElement3, useRef as useRef2, useState as useState4 } from "react";
+import {
+  FloatingFocusManager as FloatingFocusManager3,
+  FloatingPortal as FloatingPortal4,
+  autoUpdate as autoUpdate3,
+  flip as flip3,
+  offset as offset3,
+  shift as shift3,
+  useClick as useClick2,
+  useDismiss as useDismiss4,
+  useFloating as useFloating4,
+  useInteractions as useInteractions4,
+  useListNavigation,
+  useMergeRefs as useMergeRefs3,
+  useRole as useRole4
+} from "@floating-ui/react";
+
+// src/components/DropdownMenu/DropdownMenu.css.ts
+var item = "DropdownMenu_item__1lgad5x1";
+var menu = "DropdownMenu_menu__1lgad5x0";
+
+// src/components/DropdownMenu/MenuContext.ts
+import { createContext as createContext2, useContext as useContext2 } from "react";
+var MenuContext = createContext2(null);
+function useMenuContext() {
+  const context = useContext2(MenuContext);
+  if (!context) {
+    throw new Error("DropdownMenu.Item must be used within a DropdownMenu");
+  }
+  return context;
+}
+
+// src/components/DropdownMenu/DropdownMenu.tsx
+import { Fragment as Fragment3, jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
+function DropdownMenu({
+  trigger: trigger3,
+  placement = "bottom-start",
+  children
+}) {
+  const [open, setOpen] = useState4(false);
+  const [activeIndex, setActiveIndex] = useState4(null);
+  const elementsRef = useRef2([]);
+  const { refs, floatingStyles, context } = useFloating4({
+    open,
+    onOpenChange: setOpen,
+    placement,
+    whileElementsMounted: autoUpdate3,
+    middleware: [offset3(4), flip3(), shift3({ padding: 8 })]
+  });
+  const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions4([
+    useClick2(context),
+    useDismiss4(context),
+    useRole4(context, { role: "menu" }),
+    useListNavigation(context, {
+      listRef: elementsRef,
+      activeIndex,
+      onNavigate: setActiveIndex,
+      loop: true
+    })
+  ]);
+  const closeMenu = () => setOpen(false);
+  const triggerRef = useMergeRefs3([
+    refs.setReference,
+    trigger3.ref ?? null
+  ]);
+  return /* @__PURE__ */ jsxs10(Fragment3, { children: [
+    cloneElement3(trigger3, getReferenceProps({ ref: triggerRef, ...trigger3.props })),
+    open ? /* @__PURE__ */ jsx16(FloatingPortal4, { children: /* @__PURE__ */ jsx16(FloatingFocusManager3, { context, modal: false, children: /* @__PURE__ */ jsx16("div", { ref: refs.setFloating, className: menu, style: floatingStyles, ...getFloatingProps(), children: /* @__PURE__ */ jsx16(MenuContext.Provider, { value: { activeIndex, getItemProps, closeMenu }, children: (children ? Array.isArray(children) ? children : [children] : []).map(
+      (child, index) => isValidElement3(child) ? cloneElement3(
+        child,
+        { key: index, index, elementsRef }
+      ) : child
+    ) }) }) }) }) : null
+  ] });
+}
+
+// src/components/DropdownMenu/DropdownMenuItem.tsx
+import { useMergeRefs as useMergeRefs4 } from "@floating-ui/react";
+import { jsx as jsx17 } from "react/jsx-runtime";
+function DropdownMenuItem({
+  onSelect,
+  disabled,
+  className,
+  index,
+  elementsRef,
+  ...rest
+}) {
+  const { activeIndex, getItemProps, closeMenu } = useMenuContext();
+  const isActive = activeIndex === index;
+  const itemRef = useMergeRefs4([
+    (node) => {
+      if (elementsRef && typeof index === "number") {
+        elementsRef.current[index] = node;
+      }
+    }
+  ]);
+  return /* @__PURE__ */ jsx17(
+    "button",
+    {
+      ref: itemRef,
+      type: "button",
+      role: "menuitem",
+      disabled,
+      "data-active": isActive || void 0,
+      className: [item, className].filter(Boolean).join(" "),
+      tabIndex: isActive ? 0 : -1,
+      ...getItemProps({
+        onClick: () => {
+          onSelect?.();
+          closeMenu();
+        },
+        ...rest
+      })
+    }
+  );
+}
+
+// src/components/DropdownMenu/index.ts
+var DropdownMenu2 = Object.assign(DropdownMenu, { Item: DropdownMenuItem });
+
+// src/components/Breadcrumbs/Breadcrumbs.tsx
+import { Children, Fragment as Fragment4, cloneElement as cloneElement4, isValidElement as isValidElement4 } from "react";
+
+// src/components/Breadcrumbs/Breadcrumbs.css.ts
+var current = "Breadcrumbs_current__rl5imx3";
+var item2 = "Breadcrumbs_item__rl5imx1";
+var link = "Breadcrumbs_link__rl5imx2";
+var list = "Breadcrumbs_list__rl5imx0";
+var separator = "Breadcrumbs_separator__rl5imx4";
+
+// src/components/Breadcrumbs/Breadcrumbs.tsx
+import { jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
+function Breadcrumbs({
+  separator: separatorNode = "/",
+  children,
+  ...rest
+}) {
+  const items = Children.toArray(children).filter(isValidElement4);
+  return /* @__PURE__ */ jsx18("nav", { "aria-label": "Breadcrumb", ...rest, children: /* @__PURE__ */ jsx18("ol", { className: list, children: items.map((child, index) => /* @__PURE__ */ jsxs11(Fragment4, { children: [
+    cloneElement4(child, {
+      isLast: index === items.length - 1
+    }),
+    index < items.length - 1 ? /* @__PURE__ */ jsx18("li", { className: separator, "aria-hidden": "true", children: separatorNode }) : null
+  ] }, index)) }) });
+}
+
+// src/components/Breadcrumbs/BreadcrumbsItem.tsx
+import { jsx as jsx19 } from "react/jsx-runtime";
+function BreadcrumbsItem({
+  href,
+  children,
+  isLast,
+  className,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsx19("li", { className: item2, children: isLast || !href ? /* @__PURE__ */ jsx19("span", { className: [current, className].filter(Boolean).join(" "), "aria-current": isLast ? "page" : void 0, children }) : /* @__PURE__ */ jsx19("a", { href, className: [link, className].filter(Boolean).join(" "), ...rest, children }) });
+}
+
+// src/components/Breadcrumbs/index.ts
+var Breadcrumbs2 = Object.assign(Breadcrumbs, { Item: BreadcrumbsItem });
+
+// src/components/Pagination/getPageRange.ts
+function range(start, end) {
+  const output = [];
+  for (let i = start; i <= end; i++) {
+    output.push(i);
+  }
+  return output;
+}
+function getPageRange(page, totalPages, siblingCount = 1) {
+  const totalPageNumbers = siblingCount * 2 + 5;
+  if (totalPageNumbers >= totalPages) {
+    return range(1, totalPages);
+  }
+  const leftSiblingIndex = Math.max(page - siblingCount, 1);
+  const rightSiblingIndex = Math.min(page + siblingCount, totalPages);
+  const shouldShowLeftEllipsis = leftSiblingIndex > 2;
+  const shouldShowRightEllipsis = rightSiblingIndex < totalPages - 1;
+  if (!shouldShowLeftEllipsis && shouldShowRightEllipsis) {
+    const leftItemCount = 3 + siblingCount * 2;
+    return [...range(1, leftItemCount), "ellipsis", totalPages];
+  }
+  if (shouldShowLeftEllipsis && !shouldShowRightEllipsis) {
+    const rightItemCount = 3 + siblingCount * 2;
+    return [1, "ellipsis", ...range(totalPages - rightItemCount + 1, totalPages)];
+  }
+  return [1, "ellipsis", ...range(leftSiblingIndex, rightSiblingIndex), "ellipsis", totalPages];
+}
+
+// src/components/Pagination/Pagination.css.ts
+var ellipsis = "Pagination_ellipsis__gcyf9m2";
+var list2 = "Pagination_list__gcyf9m0";
+var pageButton = "Pagination_pageButton__gcyf9m1";
+
+// src/components/Pagination/Pagination.tsx
+import { jsx as jsx20, jsxs as jsxs12 } from "react/jsx-runtime";
+function Pagination({
+  page,
+  totalPages,
+  onPageChange,
+  siblingCount = 1
+}) {
+  const items = getPageRange(page, totalPages, siblingCount);
+  return /* @__PURE__ */ jsx20("nav", { "aria-label": "Pagination", children: /* @__PURE__ */ jsxs12("ul", { className: list2, children: [
+    /* @__PURE__ */ jsx20("li", { children: /* @__PURE__ */ jsx20(
+      "button",
+      {
+        type: "button",
+        className: pageButton,
+        onClick: () => onPageChange(page - 1),
+        disabled: page <= 1,
+        "aria-label": "Previous page",
+        children: "\u2039"
+      }
+    ) }),
+    items.map(
+      (item4, index) => item4 === "ellipsis" ? /* @__PURE__ */ jsx20("li", { className: ellipsis, "aria-hidden": "true", children: "\u2026" }, `ellipsis-${index}`) : /* @__PURE__ */ jsx20("li", { children: /* @__PURE__ */ jsx20(
+        "button",
+        {
+          type: "button",
+          className: pageButton,
+          onClick: () => onPageChange(item4),
+          "aria-current": item4 === page ? "page" : void 0,
+          "aria-label": `Page ${item4}`,
+          children: item4
+        }
+      ) }, item4)
+    ),
+    /* @__PURE__ */ jsx20("li", { children: /* @__PURE__ */ jsx20(
+      "button",
+      {
+        type: "button",
+        className: pageButton,
+        onClick: () => onPageChange(page + 1),
+        disabled: page >= totalPages,
+        "aria-label": "Next page",
+        children: "\u203A"
+      }
+    ) })
+  ] }) });
+}
+
+// src/components/Accordion/Accordion.tsx
+import { useState as useState5 } from "react";
+
+// src/components/Accordion/Accordion.css.ts
+var contentBody = "Accordion_contentBody__1pfgqc46";
+var contentInner = "Accordion_contentInner__1pfgqc45";
+var contentWrapper = "Accordion_contentWrapper__1pfgqc44";
+var icon = "Accordion_icon__1pfgqc43";
+var item3 = "Accordion_item__1pfgqc41";
+var root = "Accordion_root__1pfgqc40";
+var trigger = "Accordion_trigger__1pfgqc42";
+
+// src/components/Accordion/AccordionContext.ts
+import { createContext as createContext3, useContext as useContext3 } from "react";
+var AccordionContext = createContext3(null);
+function useAccordionContext() {
+  const context = useContext3(AccordionContext);
+  if (!context) {
+    throw new Error("Accordion.Item must be used within an Accordion");
+  }
+  return context;
+}
+var AccordionItemContext = createContext3(null);
+function useAccordionItemContext() {
+  const context = useContext3(AccordionItemContext);
+  if (context === null) {
+    throw new Error("Accordion.Trigger and Accordion.Content must be used within an Accordion.Item");
+  }
+  return context;
+}
+
+// src/components/Accordion/Accordion.tsx
+import { jsx as jsx21 } from "react/jsx-runtime";
+function Accordion(props) {
+  const { type, children, value, defaultValue, onValueChange, className, ...rest } = props;
+  const isControlled = value !== void 0;
+  const [internalValues, setInternalValues] = useState5(() => {
+    if (type === "single") {
+      return props.defaultValue ? [props.defaultValue] : [];
+    }
+    return props.defaultValue ?? [];
+  });
+  const currentValues = isControlled ? type === "single" ? props.value ? [props.value] : [] : props.value ?? [] : internalValues;
+  const toggle = (itemValue) => {
+    const next = type === "single" ? currentValues.includes(itemValue) ? [] : [itemValue] : currentValues.includes(itemValue) ? currentValues.filter((v) => v !== itemValue) : [...currentValues, itemValue];
+    if (!isControlled) {
+      setInternalValues(next);
+    }
+    if (type === "single") {
+      props.onValueChange?.(next[0] ?? null);
+    } else {
+      props.onValueChange?.(next);
+    }
+  };
+  const isOpen = (itemValue) => currentValues.includes(itemValue);
+  return /* @__PURE__ */ jsx21("div", { className: [root, className].filter(Boolean).join(" "), ...rest, children: /* @__PURE__ */ jsx21(AccordionContext.Provider, { value: { isOpen, toggle }, children }) });
+}
+
+// src/components/Accordion/AccordionContent.tsx
+import { jsx as jsx22 } from "react/jsx-runtime";
+function AccordionContent({ children, className, ...rest }) {
+  const { isOpen } = useAccordionContext();
+  const value = useAccordionItemContext();
+  const open = isOpen(value);
+  return /* @__PURE__ */ jsx22(
+    "div",
+    {
+      id: `accordion-panel-${value}`,
+      role: "region",
+      "aria-labelledby": `accordion-trigger-${value}`,
+      className: [contentWrapper, className].filter(Boolean).join(" "),
+      "data-open": open,
+      ...rest,
+      children: /* @__PURE__ */ jsx22("div", { className: contentInner, children: /* @__PURE__ */ jsx22("div", { className: contentBody, children }) })
+    }
+  );
+}
+
+// src/components/Accordion/AccordionItem.tsx
+import { jsx as jsx23 } from "react/jsx-runtime";
+function AccordionItem({ value, children }) {
+  return /* @__PURE__ */ jsx23("div", { className: item3, children: /* @__PURE__ */ jsx23(AccordionItemContext.Provider, { value, children }) });
+}
+
+// src/components/Accordion/AccordionTrigger.tsx
+import { jsx as jsx24, jsxs as jsxs13 } from "react/jsx-runtime";
+function AccordionTrigger({ children, className, ...rest }) {
+  const { isOpen, toggle } = useAccordionContext();
+  const value = useAccordionItemContext();
+  const open = isOpen(value);
+  return /* @__PURE__ */ jsx24("h3", { style: { margin: 0 }, children: /* @__PURE__ */ jsxs13(
+    "button",
+    {
+      type: "button",
+      id: `accordion-trigger-${value}`,
+      className: [trigger, className].filter(Boolean).join(" "),
+      "aria-expanded": open,
+      "aria-controls": `accordion-panel-${value}`,
+      "data-open": open,
+      onClick: () => toggle(value),
+      ...rest,
+      children: [
+        children,
+        /* @__PURE__ */ jsx24("span", { className: icon, "aria-hidden": "true", children: "\u25BE" })
+      ]
+    }
+  ) });
+}
+
+// src/components/Accordion/index.ts
+var Accordion2 = Object.assign(Accordion, {
+  Item: AccordionItem,
+  Trigger: AccordionTrigger,
+  Content: AccordionContent
+});
+
+// src/components/Tabs/Tabs.tsx
+import { useState as useState6 } from "react";
+
+// src/components/Tabs/TabsContext.ts
+import { createContext as createContext4, useContext as useContext4 } from "react";
+var TabsContext = createContext4(null);
+function useTabsContext() {
+  const context = useContext4(TabsContext);
+  if (!context) {
+    throw new Error("Tabs.List, Tabs.Trigger, and Tabs.Panel must be used within a Tabs component");
+  }
+  return context;
+}
+
+// src/components/Tabs/Tabs.tsx
+import { jsx as jsx25 } from "react/jsx-runtime";
+function Tabs({
+  defaultValue,
+  value: controlledValue,
+  onValueChange,
+  children,
+  ...rest
+}) {
+  const [internalValue, setInternalValue] = useState6(defaultValue ?? "");
+  const isControlled = controlledValue !== void 0;
+  const value = isControlled ? controlledValue : internalValue;
+  const setValue = (next) => {
+    if (!isControlled) {
+      setInternalValue(next);
+    }
+    onValueChange?.(next);
+  };
+  return /* @__PURE__ */ jsx25("div", { ...rest, children: /* @__PURE__ */ jsx25(TabsContext.Provider, { value: { value, setValue }, children }) });
+}
+
+// src/components/Tabs/Tabs.css.ts
+var list3 = "Tabs_list__1kvbucq0";
+var panel = "Tabs_panel__1kvbucq2";
+var trigger2 = "Tabs_trigger__1kvbucq1";
+
+// src/components/Tabs/TabsList.tsx
+import { jsx as jsx26 } from "react/jsx-runtime";
+function TabsList({ children, className, onKeyDown, ...rest }) {
+  const handleKeyDown = (event) => {
+    onKeyDown?.(event);
+    if (event.defaultPrevented) {
+      return;
+    }
+    const tabs = Array.from(event.currentTarget.querySelectorAll('[role="tab"]'));
+    if (tabs.length === 0) {
+      return;
+    }
+    const currentIndex = tabs.indexOf(document.activeElement);
+    let nextIndex = null;
+    if (event.key === "ArrowRight" || event.key === "ArrowDown") {
+      nextIndex = currentIndex < 0 ? 0 : (currentIndex + 1) % tabs.length;
+    } else if (event.key === "ArrowLeft" || event.key === "ArrowUp") {
+      nextIndex = currentIndex < 0 ? tabs.length - 1 : (currentIndex - 1 + tabs.length) % tabs.length;
+    } else if (event.key === "Home") {
+      nextIndex = 0;
+    } else if (event.key === "End") {
+      nextIndex = tabs.length - 1;
+    }
+    if (nextIndex !== null) {
+      event.preventDefault();
+      tabs[nextIndex]?.focus();
+      tabs[nextIndex]?.click();
+    }
+  };
+  return /* @__PURE__ */ jsx26("div", { role: "tablist", className: [list3, className].filter(Boolean).join(" "), onKeyDown: handleKeyDown, ...rest, children });
+}
+
+// src/components/Tabs/TabsPanel.tsx
+import { jsx as jsx27 } from "react/jsx-runtime";
+function TabsPanel({ value, children, className, ...rest }) {
+  const { value: selected } = useTabsContext();
+  if (selected !== value) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx27(
+    "div",
+    {
+      role: "tabpanel",
+      id: `panel-${value}`,
+      "aria-labelledby": `tab-${value}`,
+      tabIndex: 0,
+      className: [panel, className].filter(Boolean).join(" "),
+      ...rest,
+      children
+    }
+  );
+}
+
+// src/components/Tabs/TabsTrigger.tsx
+import { jsx as jsx28 } from "react/jsx-runtime";
+function TabsTrigger({ value, children, className, onClick, ...rest }) {
+  const { value: selected, setValue } = useTabsContext();
+  const isSelected = selected === value;
+  return /* @__PURE__ */ jsx28(
+    "button",
+    {
+      type: "button",
+      role: "tab",
+      id: `tab-${value}`,
+      "aria-selected": isSelected,
+      "aria-controls": `panel-${value}`,
+      tabIndex: isSelected ? 0 : -1,
+      className: [trigger2, className].filter(Boolean).join(" "),
+      onClick: (event) => {
+        setValue(value);
+        onClick?.(event);
+      },
+      ...rest,
+      children
+    }
+  );
+}
+
+// src/components/Tabs/index.ts
+var Tabs2 = Object.assign(Tabs, {
+  List: TabsList,
+  Trigger: TabsTrigger,
+  Panel: TabsPanel
+});
+
+// src/components/Badge/Badge.tsx
+import { forwardRef as forwardRef12 } from "react";
+
+// src/components/Badge/Badge.css.ts
+var badge = "Badge_badge__1mp11oz0";
+var variant2 = { "default": "Badge_variant_default__1mp11oz1", primary: "Badge_variant_primary__1mp11oz2", success: "Badge_variant_success__1mp11oz3", warning: "Badge_variant_warning__1mp11oz4", danger: "Badge_variant_danger__1mp11oz5" };
+
+// src/components/Badge/Badge.tsx
+import { jsx as jsx29 } from "react/jsx-runtime";
+var Badge = forwardRef12(function Badge2({ variant: variantProp = "default", className, ...rest }, ref) {
+  const classes = [badge, variant2[variantProp], className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx29("span", { ref, className: classes, ...rest });
+});
+
+// src/components/Avatar/Avatar.tsx
+import { forwardRef as forwardRef13, useState as useState7 } from "react";
+
+// src/components/Avatar/Avatar.css.ts
+var avatar = "Avatar_avatar__g25zgb1";
+var image = "Avatar_image__g25zgb5";
+var size = { sm: "Avatar_size_sm__g25zgb2", md: "Avatar_size_md__g25zgb3", lg: "Avatar_size_lg__g25zgb4" };
+var statusColor = { online: "Avatar_statusColor_online__g25zgb7", away: "Avatar_statusColor_away__g25zgb8", busy: "Avatar_statusColor_busy__g25zgb9", offline: "Avatar_statusColor_offline__g25zgba" };
+var statusDot = "Avatar_statusDot__g25zgb6";
+var wrapper5 = "Avatar_wrapper__g25zgb0";
+
+// src/components/Avatar/Avatar.tsx
+import { jsx as jsx30, jsxs as jsxs14 } from "react/jsx-runtime";
+function getInitials(name) {
+  const parts = name.trim().split(/\s+/);
+  const first = parts[0]?.[0] ?? "";
+  const last = parts.length > 1 ? parts[parts.length - 1]?.[0] ?? "" : "";
+  return (first + last).toUpperCase();
+}
+var Avatar = forwardRef13(function Avatar2({ src, name, size: sizeProp = "md", status, className, ...rest }, ref) {
+  const [imageFailed, setImageFailed] = useState7(false);
+  const showImage = src && !imageFailed;
+  return /* @__PURE__ */ jsxs14("div", { ref, className: [wrapper5, className].filter(Boolean).join(" "), ...rest, children: [
+    /* @__PURE__ */ jsx30("div", { className: [avatar, size[sizeProp]].join(" "), children: showImage ? /* @__PURE__ */ jsx30(
+      "img",
+      {
+        src,
+        alt: name ?? "",
+        className: image,
+        onError: () => setImageFailed(true)
+      }
+    ) : name ? /* @__PURE__ */ jsx30("span", { "aria-hidden": "true", children: getInitials(name) }) : null }),
+    status ? /* @__PURE__ */ jsx30(
+      "span",
+      {
+        className: [statusDot, statusColor[status]].join(" "),
+        role: "status",
+        "aria-label": status
+      }
+    ) : null
+  ] });
+});
+
+// src/components/Progress/Progress.css.ts
+var fill = "Progress_fill__160p4ke1";
+var indeterminateFill = "Progress_indeterminateFill__160p4ke3";
+var label2 = "Progress_label__160p4ke4";
+var track2 = "Progress_track__160p4ke0";
+
+// src/components/Progress/Progress.tsx
+import { jsx as jsx31, jsxs as jsxs15 } from "react/jsx-runtime";
+function Progress({ value, max = 100, label: labelText, className, ...rest }) {
+  const isIndeterminate = value === void 0;
+  const percentage = isIndeterminate ? void 0 : Math.min(100, Math.max(0, value / max * 100));
+  return /* @__PURE__ */ jsxs15("div", { className, ...rest, children: [
+    labelText || !isIndeterminate ? /* @__PURE__ */ jsxs15("div", { className: label2, children: [
+      /* @__PURE__ */ jsx31("span", { children: labelText }),
+      !isIndeterminate ? /* @__PURE__ */ jsxs15("span", { children: [
+        Math.round(percentage),
+        "%"
+      ] }) : null
+    ] }) : null,
+    /* @__PURE__ */ jsx31(
+      "div",
+      {
+        className: track2,
+        role: "progressbar",
+        "aria-valuemin": 0,
+        "aria-valuemax": max,
+        "aria-valuenow": isIndeterminate ? void 0 : value,
+        "aria-label": labelText,
+        children: isIndeterminate ? /* @__PURE__ */ jsx31("div", { className: indeterminateFill }) : /* @__PURE__ */ jsx31("div", { className: fill, style: { width: `${percentage}%` } })
+      }
+    )
+  ] });
+}
+
+// src/components/Spinner/Spinner.css.ts
+var size2 = { sm: "Spinner_size_sm__1hs5uji2", md: "Spinner_size_md__1hs5uji3", lg: "Spinner_size_lg__1hs5uji4" };
+var spinner = "Spinner_spinner__1hs5uji1";
+var srOnly = "Spinner_srOnly__1hs5uji5";
+
+// src/components/Spinner/Spinner.tsx
+import { jsx as jsx32 } from "react/jsx-runtime";
+function Spinner({
+  size: sizeProp = "md",
+  label: label3 = "Loading",
+  className,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsx32(
+    "div",
+    {
+      role: "status",
+      "aria-label": label3,
+      className: [spinner, size2[sizeProp], className].filter(Boolean).join(" "),
+      ...rest,
+      children: /* @__PURE__ */ jsx32("span", { className: srOnly, children: label3 })
+    }
+  );
+}
+
+// src/components/Alert/Alert.css.ts
+var accent2 = { info: "Alert_accent_info__1t3yeql1", success: "Alert_accent_success__1t3yeql2", warning: "Alert_accent_warning__1t3yeql3", danger: "Alert_accent_danger__1t3yeql4" };
+var alert = "Alert_alert__1t3yeql0";
+var body2 = "Alert_body__1t3yeql5";
+var closeButton3 = "Alert_closeButton__1t3yeql8";
+var description2 = "Alert_description__1t3yeql7";
+var title2 = "Alert_title__1t3yeql6";
+
+// src/components/Alert/Alert.tsx
+import { jsx as jsx33, jsxs as jsxs16 } from "react/jsx-runtime";
+function Alert({
+  variant: variant3 = "info",
+  title: titleText,
+  onDismiss,
+  children,
+  className,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsxs16(
+    "div",
+    {
+      role: "alert",
+      className: [alert, accent2[variant3], className].filter(Boolean).join(" "),
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsxs16("div", { className: body2, children: [
+          titleText ? /* @__PURE__ */ jsx33("p", { className: title2, children: titleText }) : null,
+          children ? /* @__PURE__ */ jsx33("p", { className: description2, children }) : null
+        ] }),
+        onDismiss ? /* @__PURE__ */ jsx33("button", { type: "button", className: closeButton3, "aria-label": "Dismiss", onClick: onDismiss, children: "\u2715" }) : null
+      ]
+    }
+  );
+}
+
+// src/components/DataGrid/DataGrid.tsx
+import { useCallback as useCallback2, useMemo as useMemo2, useRef as useRef3, useState as useState8 } from "react";
+
+// src/components/DataGrid/DataGrid.css.ts
+var body3 = "DataGrid_body__7xivx76";
+var cell = "DataGrid_cell__7xivx78";
+var checkboxCell = "DataGrid_checkboxCell__7xivx79";
+var container = "DataGrid_container__7xivx70";
+var emptyState = "DataGrid_emptyState__7xivx7a";
+var headerButton = "DataGrid_headerButton__7xivx73";
+var headerCell = "DataGrid_headerCell__7xivx72";
+var headerRow = "DataGrid_headerRow__7xivx71";
+var resizeHandle = "DataGrid_resizeHandle__7xivx75";
+var row = "DataGrid_row__7xivx77";
+var sortIcon = "DataGrid_sortIcon__7xivx74";
+
+// src/components/DataGrid/DataGrid.tsx
+import { jsx as jsx34, jsxs as jsxs17 } from "react/jsx-runtime";
+var DEFAULT_COLUMN_WIDTH = 160;
+var CHECKBOX_COLUMN_WIDTH = 44;
+function compareValues(a, b) {
+  if (typeof a === "number" && typeof b === "number") {
+    return a - b;
+  }
+  return String(a).localeCompare(String(b));
+}
+function getCellValue(column, row2) {
+  if (column.accessor) {
+    return column.accessor(row2);
+  }
+  return row2[column.key];
+}
+function DataGrid({
+  columns,
+  data,
+  getRowId,
+  rowHeight = 40,
+  height = 400,
+  overscan = 5,
+  selectable = false,
+  selectedIds: controlledSelectedIds,
+  onSelectionChange,
+  sort: controlledSort,
+  onSortChange,
+  emptyMessage = "No data"
+}) {
+  const [uncontrolledSort, setUncontrolledSort] = useState8(null);
+  const [uncontrolledSelectedIds, setUncontrolledSelectedIds] = useState8(() => /* @__PURE__ */ new Set());
+  const [columnWidths, setColumnWidths] = useState8(
+    () => Object.fromEntries(columns.map((c) => [c.key, c.width ?? DEFAULT_COLUMN_WIDTH]))
+  );
+  const [scrollTop, setScrollTop] = useState8(0);
+  const sort = controlledSort !== void 0 ? controlledSort : uncontrolledSort;
+  const selectedIds = controlledSelectedIds ?? uncontrolledSelectedIds;
+  const setSort = (next) => {
+    if (controlledSort === void 0) {
+      setUncontrolledSort(next);
+    }
+    onSortChange?.(next);
+  };
+  const setSelectedIds = (next) => {
+    if (controlledSelectedIds === void 0) {
+      setUncontrolledSelectedIds(next);
+    }
+    onSelectionChange?.(next);
+  };
+  const handleSortClick = (column) => {
+    if (!column.sortable) return;
+    if (!sort || sort.key !== column.key) {
+      setSort({ key: column.key, direction: "asc" });
+    } else if (sort.direction === "asc") {
+      setSort({ key: column.key, direction: "desc" });
+    } else {
+      setSort(null);
+    }
+  };
+  const sortedData = useMemo2(() => {
+    if (!sort || !sort.direction) {
+      return data;
+    }
+    const column = columns.find((c) => c.key === sort.key);
+    if (!column) {
+      return data;
+    }
+    const sorted = [...data].sort((a, b) => compareValues(getCellValue(column, a), getCellValue(column, b)));
+    return sort.direction === "desc" ? sorted.reverse() : sorted;
+  }, [data, sort, columns]);
+  const allSelected = sortedData.length > 0 && sortedData.every((r) => selectedIds.has(getRowId(r)));
+  const someSelected = !allSelected && sortedData.some((r) => selectedIds.has(getRowId(r)));
+  const toggleAll = () => {
+    if (allSelected) {
+      setSelectedIds(/* @__PURE__ */ new Set());
+    } else {
+      setSelectedIds(new Set(sortedData.map(getRowId)));
+    }
+  };
+  const toggleRow = (id) => {
+    const next = new Set(selectedIds);
+    if (next.has(id)) {
+      next.delete(id);
+    } else {
+      next.add(id);
+    }
+    setSelectedIds(next);
+  };
+  const resizeState = useRef3(null);
+  const handleResizeStart = useCallback2(
+    (event, column) => {
+      if (column.resizable === false) return;
+      event.preventDefault();
+      event.stopPropagation();
+      resizeState.current = {
+        key: column.key,
+        startX: event.clientX,
+        startWidth: columnWidths[column.key] ?? DEFAULT_COLUMN_WIDTH
+      };
+      const target = event.currentTarget;
+      target.setPointerCapture(event.pointerId);
+    },
+    [columnWidths]
+  );
+  const handleResizeMove = useCallback2((event) => {
+    const state = resizeState.current;
+    if (!state) return;
+    const delta = event.clientX - state.startX;
+    const minWidth = columns.find((c) => c.key === state.key)?.minWidth ?? 60;
+    const nextWidth = Math.max(minWidth, state.startWidth + delta);
+    setColumnWidths((prev) => ({ ...prev, [state.key]: nextWidth }));
+  }, [columns]);
+  const handleResizeEnd = useCallback2((event) => {
+    resizeState.current = null;
+    event.currentTarget.releasePointerCapture(event.pointerId);
+  }, []);
+  const totalHeight = sortedData.length * rowHeight;
+  const visibleCount = Math.ceil(height / rowHeight) + overscan * 2;
+  const startIndex = Math.max(0, Math.floor(scrollTop / rowHeight) - overscan);
+  const endIndex = Math.min(sortedData.length, startIndex + visibleCount);
+  const visibleRows = sortedData.slice(startIndex, endIndex);
+  const totalWidth = (selectable ? CHECKBOX_COLUMN_WIDTH : 0) + columns.reduce((sum, c) => sum + (columnWidths[c.key] ?? DEFAULT_COLUMN_WIDTH), 0);
+  return /* @__PURE__ */ jsxs17(
+    "div",
+    {
+      className: container,
+      style: { height },
+      onScroll: (e) => setScrollTop(e.currentTarget.scrollTop),
+      role: "table",
+      children: [
+        /* @__PURE__ */ jsxs17("div", { className: headerRow, style: { width: totalWidth, minWidth: "100%" }, role: "row", children: [
+          selectable ? /* @__PURE__ */ jsx34("div", { className: checkboxCell, role: "columnheader", children: /* @__PURE__ */ jsx34(
+            "input",
+            {
+              type: "checkbox",
+              checked: allSelected,
+              ref: (el) => {
+                if (el) el.indeterminate = someSelected;
+              },
+              onChange: toggleAll,
+              "aria-label": "Select all rows"
+            }
+          ) }) : null,
+          columns.map((column) => {
+            const width = columnWidths[column.key] ?? DEFAULT_COLUMN_WIDTH;
+            const isSorted = sort?.key === column.key;
+            const direction2 = isSorted ? sort.direction : null;
+            return /* @__PURE__ */ jsxs17(
+              "div",
+              {
+                className: headerCell,
+                style: { width },
+                role: "columnheader",
+                "aria-sort": direction2 === "asc" ? "ascending" : direction2 === "desc" ? "descending" : "none",
+                children: [
+                  column.sortable ? /* @__PURE__ */ jsxs17("button", { type: "button", className: headerButton, onClick: () => handleSortClick(column), children: [
+                    column.header,
+                    /* @__PURE__ */ jsx34("span", { className: sortIcon, "aria-hidden": "true", children: direction2 === "asc" ? "\u25B2" : direction2 === "desc" ? "\u25BC" : "" })
+                  ] }) : column.header,
+                  column.resizable !== false ? /* @__PURE__ */ jsx34(
+                    "div",
+                    {
+                      className: resizeHandle,
+                      onPointerDown: (e) => handleResizeStart(e, column),
+                      onPointerMove: handleResizeMove,
+                      onPointerUp: handleResizeEnd,
+                      role: "separator",
+                      "aria-orientation": "vertical",
+                      "aria-label": `Resize ${String(column.header)} column`
+                    }
+                  ) : null
+                ]
+              },
+              column.key
+            );
+          })
+        ] }),
+        sortedData.length === 0 ? /* @__PURE__ */ jsx34("div", { className: emptyState, children: emptyMessage }) : /* @__PURE__ */ jsx34("div", { className: body3, style: { height: totalHeight, width: totalWidth, minWidth: "100%" }, children: visibleRows.map((rowData, i) => {
+          const index = startIndex + i;
+          const id = getRowId(rowData);
+          const isSelected = selectedIds.has(id);
+          const style = { top: index * rowHeight, height: rowHeight, width: totalWidth };
+          return /* @__PURE__ */ jsxs17("div", { className: row, style, role: "row", "data-selected": isSelected || void 0, children: [
+            selectable ? /* @__PURE__ */ jsx34("div", { className: checkboxCell, role: "cell", children: /* @__PURE__ */ jsx34(
+              "input",
+              {
+                type: "checkbox",
+                checked: isSelected,
+                onChange: () => toggleRow(id),
+                "aria-label": `Select row ${index + 1}`
+              }
+            ) }) : null,
+            columns.map((column) => /* @__PURE__ */ jsx34(
+              "div",
+              {
+                className: cell,
+                style: { width: columnWidths[column.key] ?? DEFAULT_COLUMN_WIDTH },
+                role: "cell",
+                children: column.render ? column.render(rowData) : String(getCellValue(column, rowData) ?? "")
+              },
+              column.key
+            ))
+          ] }, id);
+        }) })
+      ]
+    }
+  );
+}
+
+// src/index.ts
+import { vars as vars2, defaultThemeClass, defaultThemeVars } from "@vesture/tokens";
+export {
+  Accordion2 as Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger,
+  Alert,
+  Avatar,
+  Badge,
+  Breadcrumbs2 as Breadcrumbs,
+  BreadcrumbsItem,
+  Button,
+  Card,
+  Checkbox,
+  DataGrid,
+  Divider,
+  DropdownMenu2 as DropdownMenu,
+  DropdownMenuItem,
+  Input,
+  Label,
+  Modal,
+  Pagination,
+  Popover,
+  Progress,
+  Radio,
+  Select,
+  Spinner,
+  Stack,
+  Switch,
+  Tabs2 as Tabs,
+  TabsList,
+  TabsPanel,
+  TabsTrigger,
+  Textarea,
+  ToastProvider,
+  Tooltip,
+  defaultThemeClass,
+  defaultThemeVars,
+  useToast,
+  vars2 as vars
+};
+//# sourceMappingURL=index.js.map