@dimaan/ui 0.0.10 → 0.0.11

package/dist/index.js

@@ -1,12 +1,13 @@
 import { DirectionProvider } from '@radix-ui/react-direction';
-import { createContext, forwardRef, Children, isValidElement, cloneElement, useRef, useImperativeHandle, useLayoutEffect, useId, useCallback, useState, useEffect, useContext, useMemo } from 'react';
+import { createContext, forwardRef, Children, isValidElement, cloneElement, useRef, useImperativeHandle, useLayoutEffect, useId, createElement, useCallback, useState, useEffect, useContext, useMemo } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { Loader2, Check, Minus, ChevronDown, ChevronUp, ChevronLeft, Menu, ChevronsUpDown, ChevronRight } from 'lucide-react';
+import { Loader2, Check, Minus, ChevronDown, ChevronUp, ArrowLeft, ChevronLeft, Menu, ChevronsUpDown, Search, RefreshCw, ChevronRight } from 'lucide-react';
+import * as RadixDropdown from '@radix-ui/react-dropdown-menu';
 import { useFormContext, Controller } from 'react-hook-form';
-import * as RadixRadioGroup from '@radix-ui/react-radio-group';
 import * as RadixSelect from '@radix-ui/react-select';
+import * as RadixRadioGroup from '@radix-ui/react-radio-group';
 import * as RadixSwitch from '@radix-ui/react-switch';
 
 // src/components/app-shell/AppShell.tsx
@@ -700,6 +701,47 @@ function Avatar({ src, alt = "", fallback, size = "md", className, ...props }) {
     }
   );
 }
+
+// src/components/badge/badgeVariants.ts
+var badgeVariantClass = {
+  default: "bg-muted text-foreground border-transparent",
+  primary: "bg-primary text-primary-foreground border-transparent",
+  success: "bg-success text-success-foreground border-transparent",
+  warning: "bg-warning text-warning-foreground border-transparent",
+  destructive: "bg-destructive text-destructive-foreground border-transparent",
+  outline: "border-border bg-transparent text-foreground"
+};
+var badgeSizeClass = {
+  sm: "h-5 gap-1 px-2 text-[11px]",
+  md: "h-6 gap-1.5 px-2.5 text-xs"
+};
+var badgeDotSizeClass = {
+  sm: "size-1.5",
+  md: "size-2"
+};
+var badgeBaseClass = "inline-flex shrink-0 items-center rounded-full border font-medium leading-none whitespace-nowrap select-none transition-colors";
+var Badge = forwardRef(function Badge2({ variant = "default", size = "md", dot = false, className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      ref,
+      "data-slot": "badge",
+      "data-variant": variant,
+      className: cn(badgeBaseClass, badgeVariantClass[variant], badgeSizeClass[size], className),
+      ...props,
+      children: [
+        dot ? /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: cn("inline-block rounded-full bg-current opacity-80", badgeDotSizeClass[size])
+          }
+        ) : null,
+        children
+      ]
+    }
+  );
+});
 var sizeClass2 = {
   sm: "h-3.5 w-3.5",
   md: "h-4 w-4"
@@ -768,6 +810,166 @@ var Checkbox = forwardRef(function Checkbox2({
     )
   ] });
 });
+
+// src/components/dropdown-menu/dropdownMenuVariants.ts
+var dropdownMenuContentClass = "z-50 min-w-32 overflow-hidden rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95";
+var dropdownMenuItemBaseClass = "relative flex w-full cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:size-4 [&_svg]:shrink-0";
+var dropdownMenuItemVariantClass = {
+  default: "text-foreground data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground",
+  destructive: "text-destructive data-[highlighted]:bg-destructive data-[highlighted]:text-destructive-foreground"
+};
+var dropdownMenuItemInsetClass = "ps-8";
+var dropdownMenuSeparatorClass = "-mx-1 my-1 h-px bg-border";
+var dropdownMenuLabelClass = "px-2 py-1.5 text-xs font-semibold text-muted-foreground select-none";
+var dropdownMenuShortcutClass = "ms-auto text-xs tracking-widest text-muted-foreground";
+var DropdownMenu = RadixDropdown.Root;
+var DropdownMenuTrigger = RadixDropdown.Trigger;
+var DropdownMenuGroup = RadixDropdown.Group;
+var DropdownMenuPortal = RadixDropdown.Portal;
+var DropdownMenuContent = forwardRef(function DropdownMenuContent2({ className, sideOffset = 4, ...props }, ref) {
+  return /* @__PURE__ */ jsx(RadixDropdown.Portal, { children: /* @__PURE__ */ jsx(
+    RadixDropdown.Content,
+    {
+      ref,
+      sideOffset,
+      "data-slot": "dropdown-menu-content",
+      className: cn(dropdownMenuContentClass, className),
+      ...props
+    }
+  ) });
+});
+var DropdownMenuItem = forwardRef(function DropdownMenuItem2({ className, variant = "default", inset = false, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    RadixDropdown.Item,
+    {
+      ref,
+      "data-slot": "dropdown-menu-item",
+      "data-variant": variant,
+      className: cn(
+        dropdownMenuItemBaseClass,
+        dropdownMenuItemVariantClass[variant],
+        inset && dropdownMenuItemInsetClass,
+        className
+      ),
+      ...props
+    }
+  );
+});
+var DropdownMenuSeparator = forwardRef(function DropdownMenuSeparator2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    RadixDropdown.Separator,
+    {
+      ref,
+      "data-slot": "dropdown-menu-separator",
+      className: cn(dropdownMenuSeparatorClass, className),
+      ...props
+    }
+  );
+});
+var DropdownMenuLabel = forwardRef(function DropdownMenuLabel2({ className, inset = false, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    RadixDropdown.Label,
+    {
+      ref,
+      "data-slot": "dropdown-menu-label",
+      className: cn(dropdownMenuLabelClass, inset && dropdownMenuItemInsetClass, className),
+      ...props
+    }
+  );
+});
+var DropdownMenuShortcut = forwardRef(
+  function DropdownMenuShortcut2({ className, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      "span",
+      {
+        ref,
+        "data-slot": "dropdown-menu-shortcut",
+        className: cn(dropdownMenuShortcutClass, className),
+        ...props
+      }
+    );
+  }
+);
+
+// src/components/empty-state/emptyStateVariants.ts
+var emptyStateContainerSizeClass = {
+  sm: "py-8 gap-2",
+  md: "py-14 gap-3",
+  lg: "py-20 gap-4"
+};
+var emptyStateIconWrapperSizeClass = {
+  sm: "size-10 [&_svg]:size-5",
+  md: "size-14 [&_svg]:size-7",
+  lg: "size-16 [&_svg]:size-8"
+};
+var emptyStateTitleSizeClass = {
+  sm: "text-sm",
+  md: "text-base",
+  lg: "text-lg"
+};
+var emptyStateDescriptionSizeClass = {
+  sm: "text-xs",
+  md: "text-sm",
+  lg: "text-sm"
+};
+var emptyStateActionsSpacingClass = {
+  sm: "mt-2",
+  md: "mt-4",
+  lg: "mt-6"
+};
+var emptyStateBaseClass = "flex flex-col items-center justify-center text-center px-4";
+var emptyStateIconWrapperBaseClass = "inline-flex items-center justify-center rounded-full bg-muted text-muted-foreground";
+var EmptyState = forwardRef(function EmptyState2({ icon, title, description, action, size = "md", className, ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      role: "status",
+      "aria-live": "polite",
+      "data-slot": "empty-state",
+      className: cn(emptyStateBaseClass, emptyStateContainerSizeClass[size], className),
+      ...props,
+      children: [
+        icon ? /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            "data-slot": "empty-state-icon",
+            className: cn(emptyStateIconWrapperBaseClass, emptyStateIconWrapperSizeClass[size]),
+            children: icon
+          }
+        ) : null,
+        /* @__PURE__ */ jsx(
+          "p",
+          {
+            "data-slot": "empty-state-title",
+            className: cn("font-semibold text-foreground", emptyStateTitleSizeClass[size]),
+            children: title
+          }
+        ),
+        description ? /* @__PURE__ */ jsx(
+          "p",
+          {
+            "data-slot": "empty-state-description",
+            className: cn("max-w-sm text-muted-foreground", emptyStateDescriptionSizeClass[size]),
+            children: description
+          }
+        ) : null,
+        action ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            "data-slot": "empty-state-actions",
+            className: cn(
+              "flex flex-wrap items-center justify-center gap-2",
+              emptyStateActionsSpacingClass[size]
+            ),
+            children: action
+          }
+        ) : null
+      ]
+    }
+  );
+});
 function Field(props) {
   const formContext = useFormContext();
   if (props.name !== void 0) {
@@ -1012,130 +1214,71 @@ function LanguageSwitcher({
   );
 }
 
-// src/components/radio-group/radioGroupVariants.ts
-var radioItemSizeClass = {
-  sm: "size-4",
-  md: "size-5",
-  lg: "size-6"
-};
-var radioIndicatorSizeClass = {
-  sm: "size-1.5",
-  md: "size-2",
-  lg: "size-2.5"
-};
-var radioLabelSizeClass = {
-  sm: "text-xs",
-  md: "text-sm",
-  lg: "text-base"
-};
-var radioItemBaseClass = "aspect-square shrink-0 rounded-full border border-input bg-background text-primary outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring/40 focus-visible:ring-offset-2 focus-visible:ring-offset-background hover:border-ring disabled:cursor-not-allowed disabled:opacity-50 aria-[invalid=true]:border-destructive aria-[invalid=true]:focus-visible:ring-destructive/40 data-[state=checked]:border-primary";
-var radioIndicatorBaseClass = "flex h-full w-full items-center justify-center";
-var radioIndicatorDotClass = "rounded-full bg-primary";
-var radioOptionRowClass = "flex cursor-pointer items-start gap-2 has-[button:disabled]:cursor-not-allowed";
-var radioGroupBaseClass = "flex gap-3";
-var radioGroupOrientationClass = {
-  vertical: "flex-col",
-  horizontal: "flex-row flex-wrap"
-};
-var RadioGroup = forwardRef(function RadioGroup2({
-  radioSize = "md",
-  orientation = "vertical",
-  value,
-  defaultValue,
-  onValueChange,
-  onChange,
-  onBlur,
-  name,
-  disabled,
-  required,
-  id,
-  options,
+// src/components/page-header/pageHeaderVariants.ts
+var pageHeaderBaseClass = "flex w-full flex-col gap-3";
+var pageHeaderBorderedClass = "border-b border-border pb-4";
+var pageHeaderTitleRowClass = "flex flex-wrap items-start justify-between gap-3 sm:gap-4";
+var pageHeaderTitleBlockClass = "min-w-0 flex-1 space-y-1";
+var pageHeaderTitleClass = "text-2xl font-semibold tracking-tight text-foreground";
+var pageHeaderDescriptionClass = "text-sm text-muted-foreground";
+var pageHeaderActionsClass = "flex shrink-0 flex-wrap items-center gap-2";
+var pageHeaderBackClass = "inline-flex items-center gap-1.5 self-start text-sm text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40 focus-visible:ring-offset-2 focus-visible:ring-offset-background rounded-md";
+var pageHeaderBackIconClass = "size-4 shrink-0 rtl:rotate-180";
+var pageHeaderBreadcrumbsClass = "text-xs text-muted-foreground";
+var PageHeader = forwardRef(function PageHeader2({
+  title,
+  description,
+  breadcrumbs,
+  back,
+  actions,
+  as = "h1",
+  bordered = false,
   className,
-  "aria-label": ariaLabel,
-  "aria-labelledby": ariaLabelledBy,
-  "aria-describedby": ariaDescribedBy,
-  "aria-invalid": ariaInvalid,
-  children
+  ...props
 }, ref) {
-  const generatedId = useId();
-  const groupId = id ?? generatedId;
-  const handleValueChange = useCallback(
-    (next) => {
-      onValueChange?.(next);
-      if (onChange) {
-        const synthetic = {
-          target: { value: next, name },
-          currentTarget: { value: next, name },
-          type: "change"
-        };
-        onChange(synthetic);
-      }
-    },
-    [onValueChange, onChange, name]
-  );
-  return /* @__PURE__ */ jsx(
-    RadixRadioGroup.Root,
+  return /* @__PURE__ */ jsxs(
+    "header",
     {
       ref,
-      id: groupId,
-      value,
-      defaultValue,
-      onValueChange: handleValueChange,
-      onBlur,
-      disabled,
-      required,
-      name,
-      orientation,
-      "aria-label": ariaLabel,
-      "aria-labelledby": ariaLabelledBy,
-      "aria-describedby": ariaDescribedBy,
-      "aria-invalid": ariaInvalid,
-      "data-slot": "radio-group",
-      className: cn(radioGroupBaseClass, radioGroupOrientationClass[orientation], className),
-      children: children ?? options?.map((opt) => /* @__PURE__ */ jsx(
-        RadioGroupOptionRow,
-        {
-          option: opt,
-          radioSize,
-          groupId
-        },
-        opt.value
-      ))
+      "data-slot": "page-header",
+      className: cn(pageHeaderBaseClass, bordered && pageHeaderBorderedClass, className),
+      ...props,
+      children: [
+        breadcrumbs ? /* @__PURE__ */ jsx("div", { "data-slot": "page-header-breadcrumbs", className: pageHeaderBreadcrumbsClass, children: breadcrumbs }) : null,
+        back ? /* @__PURE__ */ jsx(PageHeaderBack, { ...back }) : null,
+        /* @__PURE__ */ jsxs("div", { "data-slot": "page-header-row", className: pageHeaderTitleRowClass, children: [
+          /* @__PURE__ */ jsxs("div", { className: pageHeaderTitleBlockClass, children: [
+            createElement(
+              as,
+              { "data-slot": "page-header-title", className: pageHeaderTitleClass },
+              title
+            ),
+            description ? /* @__PURE__ */ jsx("p", { "data-slot": "page-header-description", className: pageHeaderDescriptionClass, children: description }) : null
+          ] }),
+          actions ? /* @__PURE__ */ jsx("div", { "data-slot": "page-header-actions", className: pageHeaderActionsClass, children: actions }) : null
+        ] })
+      ]
     }
   );
 });
-function RadioGroupOptionRow({ option, radioSize, groupId }) {
-  const itemId = `${groupId}-${option.value}`;
-  return /* @__PURE__ */ jsxs("label", { htmlFor: itemId, className: radioOptionRowClass, children: [
-    /* @__PURE__ */ jsx(
-      RadixRadioGroup.Item,
-      {
-        id: itemId,
-        value: option.value,
-        disabled: option.disabled,
-        "data-slot": "radio-item",
-        className: cn(radioItemBaseClass, radioItemSizeClass[radioSize], "mt-0.5"),
-        children: /* @__PURE__ */ jsx(RadixRadioGroup.Indicator, { className: radioIndicatorBaseClass, children: /* @__PURE__ */ jsx("span", { className: cn(radioIndicatorDotClass, radioIndicatorSizeClass[radioSize]) }) })
-      }
-    ),
-    /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1 leading-tight", children: [
-      /* @__PURE__ */ jsx("span", { className: cn("block font-medium text-foreground", radioLabelSizeClass[radioSize]), children: option.label }),
-      option.description ? /* @__PURE__ */ jsx("span", { className: "mt-0.5 block text-xs text-muted-foreground", children: option.description }) : null
-    ] })
+function PageHeaderBack({ label = "Back", href, onClick, render }) {
+  const inner = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(ArrowLeft, { className: pageHeaderBackIconClass, "aria-hidden": "true" }),
+    /* @__PURE__ */ jsx("span", { children: label })
   ] });
+  if (render) {
+    return render({
+      href,
+      onClick,
+      className: pageHeaderBackClass,
+      children: inner
+    });
+  }
+  if (href) {
+    return /* @__PURE__ */ jsx("a", { href, onClick, className: pageHeaderBackClass, children: inner });
+  }
+  return /* @__PURE__ */ jsx("button", { type: "button", onClick, className: pageHeaderBackClass, children: inner });
 }
-var RadioGroupItem = forwardRef(function RadioGroupItem2({ className, radioSize = "md", ...props }, ref) {
-  return /* @__PURE__ */ jsx(
-    RadixRadioGroup.Item,
-    {
-      ref,
-      "data-slot": "radio-item",
-      className: cn(radioItemBaseClass, radioItemSizeClass[radioSize], className),
-      ...props,
-      children: /* @__PURE__ */ jsx(RadixRadioGroup.Indicator, { className: radioIndicatorBaseClass, children: /* @__PURE__ */ jsx("span", { className: cn(radioIndicatorDotClass, radioIndicatorSizeClass[radioSize]) }) })
-    }
-  );
-});
 
 // src/components/select/selectVariants.ts
 var selectVariantClass = {
@@ -1262,81 +1405,6 @@ var SelectItem = forwardRef(function SelectItem2({ className, children, ...props
     /* @__PURE__ */ jsx(RadixSelect.ItemText, { children })
   ] });
 });
-
-// src/components/switch/switchVariants.ts
-var switchTrackClass = {
-  sm: "h-4 w-7",
-  md: "h-5 w-9",
-  lg: "h-6 w-11"
-};
-var switchThumbClass = {
-  sm: "size-3 data-[state=checked]:translate-x-3 data-[state=checked]:rtl:-translate-x-3",
-  md: "size-4 data-[state=checked]:translate-x-4 data-[state=checked]:rtl:-translate-x-4",
-  lg: "size-5 data-[state=checked]:translate-x-5 data-[state=checked]:rtl:-translate-x-5"
-};
-var switchTrackBaseClass = "relative inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent bg-input transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40 focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary aria-[invalid=true]:ring-2 aria-[invalid=true]:ring-destructive/40";
-var switchThumbBaseClass = "pointer-events-none block rounded-full bg-background shadow-sm ring-0 transition-transform";
-var Switch = forwardRef(function Switch2({
-  switchSize = "md",
-  checked,
-  defaultChecked,
-  onCheckedChange,
-  value,
-  onChange,
-  onBlur,
-  name,
-  disabled,
-  required,
-  id,
-  className,
-  "aria-label": ariaLabel,
-  "aria-describedby": ariaDescribedBy,
-  "aria-invalid": ariaInvalid
-}, ref) {
-  const generatedId = useId();
-  const switchId = id ?? generatedId;
-  const resolvedChecked = checked ?? (value === void 0 ? void 0 : Boolean(value));
-  const handleCheckedChange = useCallback(
-    (next) => {
-      onCheckedChange?.(next);
-      if (onChange) {
-        const synthetic = {
-          target: { checked: next, value: next, name },
-          currentTarget: { checked: next, value: next, name },
-          type: "change"
-        };
-        onChange(synthetic);
-      }
-    },
-    [onCheckedChange, onChange, name]
-  );
-  return /* @__PURE__ */ jsx(
-    RadixSwitch.Root,
-    {
-      ref,
-      id: switchId,
-      checked: resolvedChecked,
-      defaultChecked,
-      onCheckedChange: handleCheckedChange,
-      onBlur,
-      disabled,
-      required,
-      name,
-      "aria-label": ariaLabel,
-      "aria-invalid": ariaInvalid,
-      "aria-describedby": ariaDescribedBy,
-      "data-slot": "switch-track",
-      className: cn(switchTrackBaseClass, switchTrackClass[switchSize], className),
-      children: /* @__PURE__ */ jsx(
-        RadixSwitch.Thumb,
-        {
-          "data-slot": "switch-thumb",
-          className: cn(switchThumbBaseClass, switchThumbClass[switchSize])
-        }
-      )
-    }
-  );
-});
 function Pagination({
   pageIndex,
   pageSize,
@@ -1824,6 +1892,333 @@ function SortIndicator({ active, direction }) {
   if (!active) return /* @__PURE__ */ jsx(ChevronsUpDown, { "aria-hidden": "true", className });
   return direction === "asc" ? /* @__PURE__ */ jsx(ChevronUp, { "aria-hidden": "true", className }) : /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": "true", className });
 }
+var DEFAULT_LABELS = {
+  searchPlaceholder: "Search\u2026",
+  searchAriaLabel: "Search",
+  reset: "Reset filters",
+  emptyTitle: "No results",
+  emptyDescription: "Try clearing the search or adjusting the filters."
+};
+var FILTER_WIDTH_CLASS = {
+  narrow: "w-32",
+  default: "w-44",
+  wide: "w-56"
+};
+function ListPage({
+  title,
+  description,
+  bordered = true,
+  actions,
+  data,
+  columns,
+  getRowId,
+  searchKeys,
+  filters,
+  enableRowSelection,
+  bulkActions,
+  emptyState,
+  labels: labelsProp,
+  className
+}) {
+  const labels = { ...DEFAULT_LABELS, ...labelsProp };
+  const initialFilterValues = useMemo(() => {
+    const init = {};
+    for (const f of filters ?? []) {
+      init[f.key] = f.defaultValue ?? f.options[0]?.value ?? "";
+    }
+    return init;
+  }, [filters]);
+  const [search, setSearch] = useState("");
+  const [filterValues, setFilterValues] = useState(initialFilterValues);
+  const setFilter = (key, value) => {
+    setFilterValues((prev) => ({ ...prev, [key]: value }));
+  };
+  const reset = () => {
+    setSearch("");
+    setFilterValues(initialFilterValues);
+  };
+  const hasActiveFilters = useMemo(() => {
+    if (search.trim() !== "") return true;
+    for (const f of filters ?? []) {
+      const current = filterValues[f.key];
+      const def = f.defaultValue ?? f.options[0]?.value ?? "";
+      if (current !== def) return true;
+    }
+    return false;
+  }, [search, filters, filterValues]);
+  const filtered = useMemo(() => {
+    return data.filter((row) => {
+      if (search.trim() && searchKeys && searchKeys.length > 0) {
+        const q = search.trim().toLowerCase();
+        const matches = searchKeys.some((key) => {
+          const val = row[key];
+          return val != null && String(val).toLowerCase().includes(q);
+        });
+        if (!matches) return false;
+      }
+      for (const f of filters ?? []) {
+        const value = filterValues[f.key];
+        const def = f.defaultValue ?? f.options[0]?.value ?? "";
+        if (value !== void 0 && value !== def) {
+          if (f.accessor(row) !== value) return false;
+        }
+      }
+      return true;
+    });
+  }, [data, search, searchKeys, filters, filterValues]);
+  const showFilterBar = Boolean(searchKeys?.length) || Boolean(filters?.length);
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "list-page", className: cn("space-y-6", className), children: [
+    /* @__PURE__ */ jsx(PageHeader, { title, description, bordered, actions }),
+    showFilterBar ? /* @__PURE__ */ jsxs("div", { "data-slot": "list-page-filter-bar", className: "flex flex-wrap items-center gap-3", children: [
+      searchKeys?.length ? /* @__PURE__ */ jsx(
+        Input,
+        {
+          type: "search",
+          placeholder: labels.searchPlaceholder,
+          "aria-label": labels.searchAriaLabel || labels.searchPlaceholder,
+          value: search,
+          onChange: (e) => setSearch(e.target.value),
+          leadingIcon: /* @__PURE__ */ jsx(Search, {}),
+          wrapperClassName: "sm:max-w-xs"
+        }
+      ) : null,
+      filters?.map((f) => /* @__PURE__ */ jsx(
+        Select,
+        {
+          "aria-label": f.ariaLabel,
+          value: filterValues[f.key],
+          onValueChange: (v) => setFilter(f.key, v),
+          options: f.options,
+          className: FILTER_WIDTH_CLASS[f.width ?? "default"]
+        },
+        f.key
+      )),
+      hasActiveFilters ? /* @__PURE__ */ jsxs(Button, { variant: "ghost", onClick: reset, children: [
+        /* @__PURE__ */ jsx(RefreshCw, {}),
+        labels.reset
+      ] }) : null
+    ] }) : null,
+    filtered.length > 0 ? /* @__PURE__ */ jsx(
+      Table,
+      {
+        "aria-label": typeof title === "string" ? title : void 0,
+        data: filtered,
+        columns,
+        getRowId,
+        enableRowSelection,
+        bulkActions
+      }
+    ) : /* @__PURE__ */ jsx("div", { "data-slot": "list-page-empty", className: "rounded-md border border-border", children: /* @__PURE__ */ jsx(
+      EmptyState,
+      {
+        icon: emptyState?.icon,
+        title: emptyState?.title ?? labels.emptyTitle,
+        description: emptyState?.description ?? labels.emptyDescription,
+        action: emptyState?.action !== void 0 ? emptyState.action : hasActiveFilters ? /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: reset, children: labels.reset }) : null
+      }
+    ) })
+  ] });
+}
+
+// src/components/radio-group/radioGroupVariants.ts
+var radioItemSizeClass = {
+  sm: "size-4",
+  md: "size-5",
+  lg: "size-6"
+};
+var radioIndicatorSizeClass = {
+  sm: "size-1.5",
+  md: "size-2",
+  lg: "size-2.5"
+};
+var radioLabelSizeClass = {
+  sm: "text-xs",
+  md: "text-sm",
+  lg: "text-base"
+};
+var radioItemBaseClass = "aspect-square shrink-0 rounded-full border border-input bg-background text-primary outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring/40 focus-visible:ring-offset-2 focus-visible:ring-offset-background hover:border-ring disabled:cursor-not-allowed disabled:opacity-50 aria-[invalid=true]:border-destructive aria-[invalid=true]:focus-visible:ring-destructive/40 data-[state=checked]:border-primary";
+var radioIndicatorBaseClass = "flex h-full w-full items-center justify-center";
+var radioIndicatorDotClass = "rounded-full bg-primary";
+var radioOptionRowClass = "flex cursor-pointer items-start gap-2 has-[button:disabled]:cursor-not-allowed";
+var radioGroupBaseClass = "flex gap-3";
+var radioGroupOrientationClass = {
+  vertical: "flex-col",
+  horizontal: "flex-row flex-wrap"
+};
+var RadioGroup = forwardRef(function RadioGroup2({
+  radioSize = "md",
+  orientation = "vertical",
+  value,
+  defaultValue,
+  onValueChange,
+  onChange,
+  onBlur,
+  name,
+  disabled,
+  required,
+  id,
+  options,
+  className,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  "aria-invalid": ariaInvalid,
+  children
+}, ref) {
+  const generatedId = useId();
+  const groupId = id ?? generatedId;
+  const handleValueChange = useCallback(
+    (next) => {
+      onValueChange?.(next);
+      if (onChange) {
+        const synthetic = {
+          target: { value: next, name },
+          currentTarget: { value: next, name },
+          type: "change"
+        };
+        onChange(synthetic);
+      }
+    },
+    [onValueChange, onChange, name]
+  );
+  return /* @__PURE__ */ jsx(
+    RadixRadioGroup.Root,
+    {
+      ref,
+      id: groupId,
+      value,
+      defaultValue,
+      onValueChange: handleValueChange,
+      onBlur,
+      disabled,
+      required,
+      name,
+      orientation,
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-describedby": ariaDescribedBy,
+      "aria-invalid": ariaInvalid,
+      "data-slot": "radio-group",
+      className: cn(radioGroupBaseClass, radioGroupOrientationClass[orientation], className),
+      children: children ?? options?.map((opt) => /* @__PURE__ */ jsx(
+        RadioGroupOptionRow,
+        {
+          option: opt,
+          radioSize,
+          groupId
+        },
+        opt.value
+      ))
+    }
+  );
+});
+function RadioGroupOptionRow({ option, radioSize, groupId }) {
+  const itemId = `${groupId}-${option.value}`;
+  return /* @__PURE__ */ jsxs("label", { htmlFor: itemId, className: radioOptionRowClass, children: [
+    /* @__PURE__ */ jsx(
+      RadixRadioGroup.Item,
+      {
+        id: itemId,
+        value: option.value,
+        disabled: option.disabled,
+        "data-slot": "radio-item",
+        className: cn(radioItemBaseClass, radioItemSizeClass[radioSize], "mt-0.5"),
+        children: /* @__PURE__ */ jsx(RadixRadioGroup.Indicator, { className: radioIndicatorBaseClass, children: /* @__PURE__ */ jsx("span", { className: cn(radioIndicatorDotClass, radioIndicatorSizeClass[radioSize]) }) })
+      }
+    ),
+    /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1 leading-tight", children: [
+      /* @__PURE__ */ jsx("span", { className: cn("block font-medium text-foreground", radioLabelSizeClass[radioSize]), children: option.label }),
+      option.description ? /* @__PURE__ */ jsx("span", { className: "mt-0.5 block text-xs text-muted-foreground", children: option.description }) : null
+    ] })
+  ] });
+}
+var RadioGroupItem = forwardRef(function RadioGroupItem2({ className, radioSize = "md", ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    RadixRadioGroup.Item,
+    {
+      ref,
+      "data-slot": "radio-item",
+      className: cn(radioItemBaseClass, radioItemSizeClass[radioSize], className),
+      ...props,
+      children: /* @__PURE__ */ jsx(RadixRadioGroup.Indicator, { className: radioIndicatorBaseClass, children: /* @__PURE__ */ jsx("span", { className: cn(radioIndicatorDotClass, radioIndicatorSizeClass[radioSize]) }) })
+    }
+  );
+});
+
+// src/components/switch/switchVariants.ts
+var switchTrackClass = {
+  sm: "h-4 w-7",
+  md: "h-5 w-9",
+  lg: "h-6 w-11"
+};
+var switchThumbClass = {
+  sm: "size-3 data-[state=checked]:translate-x-3 data-[state=checked]:rtl:-translate-x-3",
+  md: "size-4 data-[state=checked]:translate-x-4 data-[state=checked]:rtl:-translate-x-4",
+  lg: "size-5 data-[state=checked]:translate-x-5 data-[state=checked]:rtl:-translate-x-5"
+};
+var switchTrackBaseClass = "relative inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent bg-input transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40 focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary aria-[invalid=true]:ring-2 aria-[invalid=true]:ring-destructive/40";
+var switchThumbBaseClass = "pointer-events-none block rounded-full bg-background shadow-sm ring-0 transition-transform";
+var Switch = forwardRef(function Switch2({
+  switchSize = "md",
+  checked,
+  defaultChecked,
+  onCheckedChange,
+  value,
+  onChange,
+  onBlur,
+  name,
+  disabled,
+  required,
+  id,
+  className,
+  "aria-label": ariaLabel,
+  "aria-describedby": ariaDescribedBy,
+  "aria-invalid": ariaInvalid
+}, ref) {
+  const generatedId = useId();
+  const switchId = id ?? generatedId;
+  const resolvedChecked = checked ?? (value === void 0 ? void 0 : Boolean(value));
+  const handleCheckedChange = useCallback(
+    (next) => {
+      onCheckedChange?.(next);
+      if (onChange) {
+        const synthetic = {
+          target: { checked: next, value: next, name },
+          currentTarget: { checked: next, value: next, name },
+          type: "change"
+        };
+        onChange(synthetic);
+      }
+    },
+    [onCheckedChange, onChange, name]
+  );
+  return /* @__PURE__ */ jsx(
+    RadixSwitch.Root,
+    {
+      ref,
+      id: switchId,
+      checked: resolvedChecked,
+      defaultChecked,
+      onCheckedChange: handleCheckedChange,
+      onBlur,
+      disabled,
+      required,
+      name,
+      "aria-label": ariaLabel,
+      "aria-invalid": ariaInvalid,
+      "aria-describedby": ariaDescribedBy,
+      "data-slot": "switch-track",
+      className: cn(switchTrackBaseClass, switchTrackClass[switchSize], className),
+      children: /* @__PURE__ */ jsx(
+        RadixSwitch.Thumb,
+        {
+          "data-slot": "switch-thumb",
+          className: cn(switchThumbBaseClass, switchThumbClass[switchSize])
+        }
+      )
+    }
+  );
+});
 
 // src/components/textarea/textareaVariants.ts
 var textareaVariantClass = {
@@ -1891,6 +2286,6 @@ var Textarea = forwardRef(function Textarea2({
   );
 });
 
-export { AppShell, Avatar, Button, Checkbox, DashboardContent, DashboardHeader, DashboardLayout, DashboardMain, Field, HeaderActions, HeaderCollapseTrigger, HeaderMobileTrigger, HeaderSearch, HeaderTitle, Input, LanguageSwitcher, RadioGroup, RadioGroupItem, Select, Sidebar, SidebarFooter, SidebarGroup, SidebarHeader, SidebarNav, SidebarNavGroup, SidebarNavItem, Switch, Table, Textarea, buttonBaseClass, buttonSizeClass, buttonVariantClass, cn, inputBaseClass, inputSizeClass, inputVariantClass, radioGroupBaseClass, radioGroupOrientationClass, radioIndicatorBaseClass, radioIndicatorDotClass, radioIndicatorSizeClass, radioItemBaseClass, radioItemSizeClass, radioLabelSizeClass, radioOptionRowClass, selectBaseClass, selectSizeClass, selectVariantClass, switchThumbBaseClass, switchThumbClass, switchTrackBaseClass, switchTrackClass, alignClass as tableAlignClass, tableBaseClass, selectedRowClass as tableSelectedRowClass, tableSizeClass, sortIconClass as tableSortIconClass, textareaBaseClass, textareaResizeClass, textareaSizeClass, textareaVariantClass, useDashboardLayout, useDirection };
+export { AppShell, Avatar, Badge, Button, Checkbox, DashboardContent, DashboardHeader, DashboardLayout, DashboardMain, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuTrigger, EmptyState, Field, HeaderActions, HeaderCollapseTrigger, HeaderMobileTrigger, HeaderSearch, HeaderTitle, Input, LanguageSwitcher, ListPage, PageHeader, RadioGroup, RadioGroupItem, Select, Sidebar, SidebarFooter, SidebarGroup, SidebarHeader, SidebarNav, SidebarNavGroup, SidebarNavItem, Switch, Table, Textarea, badgeBaseClass, badgeDotSizeClass, badgeSizeClass, badgeVariantClass, buttonBaseClass, buttonSizeClass, buttonVariantClass, cn, dropdownMenuContentClass, dropdownMenuItemBaseClass, dropdownMenuItemInsetClass, dropdownMenuItemVariantClass, dropdownMenuLabelClass, dropdownMenuSeparatorClass, dropdownMenuShortcutClass, emptyStateActionsSpacingClass, emptyStateBaseClass, emptyStateContainerSizeClass, emptyStateDescriptionSizeClass, emptyStateIconWrapperBaseClass, emptyStateIconWrapperSizeClass, emptyStateTitleSizeClass, inputBaseClass, inputSizeClass, inputVariantClass, pageHeaderActionsClass, pageHeaderBackClass, pageHeaderBackIconClass, pageHeaderBaseClass, pageHeaderBorderedClass, pageHeaderBreadcrumbsClass, pageHeaderDescriptionClass, pageHeaderTitleBlockClass, pageHeaderTitleClass, pageHeaderTitleRowClass, radioGroupBaseClass, radioGroupOrientationClass, radioIndicatorBaseClass, radioIndicatorDotClass, radioIndicatorSizeClass, radioItemBaseClass, radioItemSizeClass, radioLabelSizeClass, radioOptionRowClass, selectBaseClass, selectSizeClass, selectVariantClass, switchThumbBaseClass, switchThumbClass, switchTrackBaseClass, switchTrackClass, alignClass as tableAlignClass, tableBaseClass, selectedRowClass as tableSelectedRowClass, tableSizeClass, sortIconClass as tableSortIconClass, textareaBaseClass, textareaResizeClass, textareaSizeClass, textareaVariantClass, useDashboardLayout, useDirection };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map