@inf-monkeys-tech/monkeys-design 0.4.55 → 0.4.56

package/dist/components/layout/index.mjs

@@ -1,14 +1,210 @@
-import { forwardRef, useRef, useState, useEffect, useId, useMemo, createContext, useContext, useLayoutEffect } from 'react';
+import { forwardRef, useState, useEffect, useContext, useMemo, isValidElement, Fragment, createContext, useRef } from 'react';
 import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import '@radix-ui/react-context-menu';
-import { createPortal } from 'react-dom';
+import { twMerge } from 'tailwind-merge';
+import { jsxs, jsx, Fragment as Fragment$1 } from 'react/jsx-runtime';
+import 'react-dom';
+import * as Tooltip from '@radix-ui/react-tooltip';
 
 // src/components/layout/index.tsx
 
-// src/components/base/utils.ts
+// src/locale/en-US.ts
+var enUS = {
+  locale: "en-US",
+  messages: {
+    pagination: {
+      navigation: "Pagination",
+      first: "First",
+      previous: "Previous",
+      next: "Next",
+      last: "Last",
+      page: ({ page, pageCount }) => `Page ${page} of ${pageCount}`,
+      currentPage: ({ page, pageCount }) => `Page ${page} of ${pageCount}, current page`,
+      emptyResults: "0 results",
+      range: ({ start, end, total }) => `${start}-${end} of ${total}`
+    },
+    dialog: {
+      close: "Close dialog"
+    },
+    dropdownMenu: {
+      actions: "Actions"
+    },
+    loading: {
+      spinner: "Loading"
+    },
+    layout: {
+      resizePanels: "Resize panels"
+    },
+    steps: {
+      label: "Progress",
+      current: "Current",
+      completed: "Completed",
+      error: "Error",
+      disabled: "Disabled"
+    },
+    numberInput: {
+      increment: "Increase value",
+      decrement: "Decrease value"
+    },
+    passwordInput: {
+      showPassword: "Show password",
+      hidePassword: "Hide password"
+    },
+    multiSelect: {
+      placeholder: "Select options",
+      empty: "No options",
+      removeOption: ({ value }) => `Remove ${value}`
+    },
+    table: {
+      dragColumn: ({ columnId }) => `Drag column ${columnId}`,
+      resizeColumn: ({ columnId }) => `Resize column ${columnId}`,
+      sortColumn: ({ columnId }) => columnId ? `Sort column ${columnId}` : "Sort column",
+      loadingRow: "Loading table row"
+    },
+    toolbar: {
+      theme: {
+        label: "Appearance",
+        toggle: "Toggle theme",
+        auto: "Auto",
+        light: "Light",
+        dark: "Dark"
+      },
+      language: {
+        label: "Language",
+        switch: "Switch language"
+      }
+    },
+    toast: {
+      errorTitle: "Error",
+      warningTitle: "Warning",
+      defaultErrorDescription: "Something went wrong.",
+      defaultWarningDescription: "Please check and try again."
+    },
+    dataExplorer: {
+      viewTree: {
+        actions: "More actions",
+        expand: "Expand",
+        collapse: "Collapse",
+        loading: "Loading...",
+        empty: "No views",
+        error: "Unable to load views"
+      }
+    },
+    workbench: {
+      interactiveTable: {
+        columnActions: "Column actions",
+        freezeColumn: "Freeze to left",
+        freezeEndColumn: "Freeze to right",
+        unfreezeColumn: "Unfreeze from left",
+        unfreezeEndColumn: "Unfreeze from right",
+        unfreezeAllColumns: "Unfreeze all columns",
+        resetColumnWidth: "Reset column width",
+        frozenColumnTitle: "Frozen column"
+      }
+    }
+  }
+};
+
+// src/locale/resolve-locale.ts
+function mergeMonkeysLocaleMessages(base, override) {
+  return base;
+}
+var defaultMonkeysLocale = {
+  locale: enUS.locale,
+  messages: mergeMonkeysLocaleMessages(
+    enUS.messages
+  )
+};
+
+// src/provider/context.ts
+var EMPTY_ENVIRONMENT = Object.freeze({});
+var EMPTY_PORTAL = Object.freeze({});
+var MONKEYS_PROVIDER_CONTEXTS_KEY = /* @__PURE__ */ Symbol.for(
+  "@inf-monkeys-tech/monkeys-design/provider-context@1"
+);
+function createMonkeysProviderContexts() {
+  return Object.freeze({
+    locale: createContext({
+      ...defaultMonkeysLocale,
+      provided: false
+    }),
+    theme: createContext({
+      provided: false
+    }),
+    direction: createContext({
+      provided: false
+    }),
+    environment: createContext({
+      provided: false,
+      environment: EMPTY_ENVIRONMENT,
+      portal: EMPTY_PORTAL
+    })
+  });
+}
+function getMonkeysProviderContexts() {
+  const host = globalThis;
+  const existing = host[MONKEYS_PROVIDER_CONTEXTS_KEY];
+  if (existing) return existing;
+  const contexts = createMonkeysProviderContexts();
+  Object.defineProperty(host, MONKEYS_PROVIDER_CONTEXTS_KEY, {
+    value: contexts,
+    enumerable: false,
+    configurable: false,
+    writable: false
+  });
+  return contexts;
+}
+var providerContexts = getMonkeysProviderContexts();
+var MonkeysLocaleContext = providerContexts.locale;
+var MonkeysThemeContext = providerContexts.theme;
+var MonkeysDirectionContext = providerContexts.direction;
+var MonkeysEnvironmentContext = providerContexts.environment;
+function mergeAppearance(inherited, explicit) {
+  if (explicit === void 0) return inherited;
+  if (inherited === void 0) return explicit;
+  return {
+    ...inherited,
+    ...explicit,
+    slots: inherited.slots || explicit.slots ? { ...inherited.slots, ...explicit.slots } : void 0,
+    styles: inherited.styles || explicit.styles ? { ...inherited.styles, ...explicit.styles } : void 0
+  };
+}
+function useMonkeysBaseAppearance(explicit) {
+  const inherited = useContext(MonkeysThemeContext).baseAppearance;
+  return useMemo(
+    () => mergeAppearance(inherited, explicit),
+    [explicit, inherited]
+  );
+}
+function useMonkeysEnvironment() {
+  return useContext(MonkeysEnvironmentContext).environment;
+}
+function useMonkeysPortalOptions() {
+  return useContext(MonkeysEnvironmentContext).portal;
+}
+function useMonkeysComponentAttributes() {
+  const locale = useContext(MonkeysLocaleContext);
+  const theme = useContext(MonkeysThemeContext);
+  const direction = useContext(MonkeysDirectionContext);
+  const providerActive = locale.provided || theme.provided || direction.provided;
+  return useMemo(
+    () => providerActive ? {
+      dir: direction.direction,
+      "data-monkeys-direction": direction.direction,
+      "data-monkeys-locale": locale.locale,
+      "data-monkeys-theme": theme.resolvedTheme?.id,
+      "data-monkeys-theme-mode": theme.resolvedTheme?.tokens.mode
+    } : {},
+    [
+      direction.direction,
+      locale.locale,
+      providerActive,
+      theme.resolvedTheme?.id,
+      theme.resolvedTheme?.tokens.mode
+    ]
+  );
+}
 function cn(...parts) {
-  return parts.filter(Boolean).join(" ");
+  return twMerge(parts.filter(Boolean).join(" "));
 }
 function hasRenderableNode(node) {
   return node !== void 0 && node !== null && typeof node !== "boolean";
@@ -45,9 +241,9 @@ var baseSlots = {
   ),
   buttonDefault: "border-border bg-background text-foreground hover:bg-accent/60",
   buttonPrimary: "border-primary/20 bg-primary/10 text-primary hover:bg-primary/15",
-  buttonSuccess: "border-emerald-500/30 bg-emerald-500/10 text-emerald-700 hover:bg-emerald-500/15",
+  buttonSuccess: "border-emerald-500/30 bg-emerald-500/10 text-emerald-700 dark:text-emerald-400 hover:bg-emerald-500/15",
   buttonWarning: "border-amber-500/30 bg-amber-500/10 text-amber-700 hover:bg-amber-500/15",
-  buttonDanger: "border-destructive/20 bg-destructive/10 text-destructive hover:bg-destructive/15",
+  buttonDanger: "border-destructive/20 bg-destructive/10 text-destructive-text hover:bg-destructive/15",
   buttonMuted: "border-border/60 bg-muted/45 text-muted-foreground hover:bg-muted/70 hover:text-foreground",
   buttonActive: "border-primary/35 bg-primary/10 text-primary",
   buttonDisabled: "!cursor-not-allowed opacity-60",
@@ -62,10 +258,101 @@ var baseSlots = {
   badgePrimary: "border-primary/30 bg-primary/10 text-primary",
   badgeSuccess: "border-emerald-500/30 bg-emerald-500/10 text-emerald-700",
   badgeWarning: "border-amber-500/30 bg-amber-500/10 text-amber-700",
-  badgeDanger: "border-destructive/30 bg-destructive/10 text-destructive",
+  badgeDanger: "border-destructive/30 bg-destructive/10 text-destructive-text",
   badgeMuted: "border-border/60 bg-muted text-muted-foreground",
   badgeIcon: "inline-flex h-3.5 w-3.5 shrink-0 items-center justify-center",
   badgeLabel: "min-w-0 truncate",
+  textRoot: "min-w-0 break-words leading-6",
+  textSizeXs: "text-xs",
+  textSizeSm: "text-sm",
+  textSizeMd: "text-base",
+  textSizeLg: "text-lg",
+  textSizeXl: "text-xl",
+  typographyToneDefault: "text-foreground",
+  typographyToneMuted: "text-muted-foreground",
+  typographyTonePrimary: "text-primary",
+  typographyToneSuccess: "text-emerald-700 dark:text-emerald-400",
+  typographyToneWarning: "text-amber-700 dark:text-amber-400",
+  typographyToneDanger: "text-destructive-text",
+  typographyToneInherit: "text-inherit",
+  headingRoot: "min-w-0 break-words font-semibold tracking-tight",
+  headingSizeXs: "text-sm leading-5",
+  headingSizeSm: "text-base leading-6",
+  headingSizeMd: "text-lg leading-7",
+  headingSizeLg: "text-xl leading-7",
+  headingSizeXl: "text-2xl leading-8",
+  headingSize2xl: "text-3xl leading-9",
+  linkRoot: "inline break-words underline decoration-current/40 underline-offset-4 hover:decoration-current focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30",
+  codeInline: "rounded border border-border/70 bg-muted/60 px-1.5 py-0.5 font-mono text-[0.875em] leading-[1.45] text-foreground",
+  codeBlock: "m-0 max-w-full overflow-x-auto rounded-md border border-border/70 bg-muted/60 p-4 text-foreground",
+  codeContent: "font-mono text-sm leading-6",
+  kbdRoot: "inline-flex min-h-5 items-center rounded border border-border bg-muted/70 px-1.5 font-mono text-[0.75em] font-medium leading-5 text-foreground shadow-[inset_0_-1px_0_hsl(var(--monkeys-color-border))]",
+  listRoot: "m-0 min-w-0 list-outside break-words ps-5 text-foreground",
+  listSpacingCompact: "[&>li+li]:mt-1",
+  listSpacingDefault: "[&>li+li]:mt-2",
+  listSpacingRelaxed: "[&>li+li]:mt-3",
+  listMarkerNone: "list-none ps-0",
+  listMarkerDisc: "list-disc",
+  listMarkerCircle: "list-[circle]",
+  listMarkerSquare: "list-[square]",
+  listMarkerDecimal: "list-decimal",
+  listMarkerLowerAlpha: "list-[lower-alpha]",
+  listMarkerUpperAlpha: "list-[upper-alpha]",
+  listItem: "min-w-0 ps-1 leading-6 marker:text-muted-foreground",
+  stackRoot: "flex min-w-0 flex-col",
+  inlineRoot: "flex min-w-0 flex-row",
+  gridRoot: "grid min-w-0",
+  containerRoot: "mx-auto w-full min-w-0",
+  aspectRatioRoot: "relative min-w-0 overflow-hidden [&>*]:h-full [&>*]:w-full",
+  spinnerRoot: "inline-flex shrink-0 items-center justify-center text-current align-middle",
+  spinnerIndicator: "h-5 w-5 rounded-full border-2 border-current border-r-transparent motion-safe:animate-spin motion-reduce:animate-none",
+  visuallyHiddenRoot: "sr-only",
+  visuallyHiddenFocusable: "focus:not-sr-only focus:fixed focus:left-4 focus:top-4 focus:z-[1000] focus:rounded-md focus:bg-background focus:px-4 focus:py-2 focus:text-foreground focus:shadow-lg focus:outline-none focus:ring-2 focus:ring-ring focus-within:not-sr-only focus-within:fixed focus-within:left-4 focus-within:top-4 focus-within:z-[1000] focus-within:rounded-md focus-within:bg-background focus-within:px-4 focus-within:py-2 focus-within:text-foreground focus-within:shadow-lg focus-within:ring-2 focus-within:ring-ring",
+  fieldsetRoot: "min-w-0 border-0 p-0 text-foreground",
+  fieldsetLegend: "min-w-0 text-sm font-semibold leading-6 text-foreground",
+  fieldsetDescription: "mt-1 text-sm leading-5 text-muted-foreground",
+  fieldsetError: "mt-1 text-sm leading-5 text-destructive-text",
+  fieldsetContent: "mt-3 grid min-w-0 gap-3",
+  stepsRoot: "m-0 min-w-0 list-none p-0 text-foreground",
+  stepsHorizontal: "flex w-full max-w-full items-start overflow-x-auto pb-2",
+  stepsVertical: "grid",
+  stepsItem: "relative min-w-0",
+  stepsItemHorizontal: "flex min-w-52 flex-1 items-start",
+  stepsItemVertical: "pb-6 last:pb-0",
+  stepsTrigger: "flex min-w-0 flex-1 items-start gap-3 rounded-md border-0 bg-transparent p-1 text-start text-inherit",
+  stepsTriggerInteractive: "cursor-pointer hover:bg-accent/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 motion-safe:transition motion-safe:duration-300 motion-safe:ease-out",
+  stepsTriggerDisabled: "!cursor-not-allowed opacity-60",
+  stepsIndicator: "relative z-[1] inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-full border text-xs font-semibold",
+  stepsIndicatorPending: "border-border bg-background text-muted-foreground",
+  stepsIndicatorCurrent: "border-primary/50 bg-primary/10 text-primary",
+  stepsIndicatorCompleted: "border-primary bg-primary text-primary-foreground",
+  stepsIndicatorError: "border-destructive bg-destructive text-destructive-foreground",
+  stepsContent: "grid min-w-0 gap-1 pt-0.5",
+  stepsLabel: "min-w-0 break-words text-sm font-medium leading-5",
+  stepsDescription: "min-w-0 break-words text-sm leading-5 text-muted-foreground",
+  stepsStatus: "sr-only",
+  stepsConnector: "shrink-0 bg-border",
+  stepsConnectorHorizontal: "mt-3.5 h-px w-8",
+  stepsConnectorVertical: "absolute bottom-0 top-8 start-3.5 w-px -translate-x-1/2",
+  stepsConnectorCompleted: "bg-primary/60",
+  stepsConnectorError: "bg-destructive/60",
+  scrollAreaViewport: "min-h-0 min-w-0",
+  numberInputControl: "tabular-nums",
+  numberInputStepControls: "me-1 flex shrink-0 self-stretch overflow-hidden border-s border-border",
+  numberInputStepButton: "flex min-h-6 w-7 cursor-pointer items-center justify-center border-0 bg-transparent px-1 text-xs leading-none text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:z-[1] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring disabled:!cursor-not-allowed disabled:opacity-40",
+  passwordInputControl: "pe-2",
+  passwordInputToggle: "me-1 inline-flex min-h-7 shrink-0 cursor-pointer items-center justify-center rounded px-2 text-xs font-medium text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:!cursor-not-allowed disabled:opacity-40",
+  inputGroupRoot: cn(
+    "relative flex min-w-0 items-stretch overflow-hidden rounded-md border border-border bg-background text-foreground focus-within:border-primary/50 focus-within:ring-2 focus-within:ring-ring/30",
+    motionBase
+  ),
+  inputGroupInvalid: "border-destructive/55 focus-within:border-destructive/70 focus-within:ring-destructive/25",
+  inputGroupDisabled: "!cursor-not-allowed bg-muted/35",
+  inputGroupContent: "flex min-w-0 flex-1 items-stretch [&>*]:min-w-0",
+  inputGroupStartElement: "inline-flex shrink-0 items-center justify-center ps-3 pe-1 text-foreground/75",
+  inputGroupEndElement: "inline-flex shrink-0 items-center justify-center ps-1 pe-3 text-foreground/75",
+  inputGroupStartAddon: "inline-flex max-w-[min(40%,16rem)] shrink-0 items-center overflow-hidden border-e border-border bg-muted/60 px-3 text-sm text-foreground/75 text-ellipsis whitespace-nowrap [&>*]:min-w-0",
+  inputGroupEndAddon: "inline-flex max-w-[min(40%,16rem)] shrink-0 items-center overflow-hidden border-s border-border bg-muted/60 px-3 text-sm text-foreground/75 text-ellipsis whitespace-nowrap [&>*]:min-w-0",
   panelRoot: cn(
     "group relative flex min-w-0 flex-col overflow-hidden rounded-lg border border-border/70 bg-background",
     motionInteractive
@@ -88,11 +375,11 @@ var baseSlots = {
   stateTitle: "text-sm font-semibold text-foreground",
   stateDescription: "mt-2 max-w-md text-sm leading-6 text-muted-foreground",
   stateActions: "mt-5 flex flex-wrap items-center justify-center gap-2",
-  loadingSpinner: "h-5 w-5 animate-spin",
+  loadingSpinner: "h-5 w-5 motion-safe:animate-spin motion-reduce:animate-none",
   fieldRoot: "grid min-w-0 gap-2",
   fieldLabelRow: "flex min-w-0 items-center justify-between gap-3",
   fieldLabel: "min-w-0 text-sm font-medium leading-none text-foreground",
-  fieldRequired: "text-destructive",
+  fieldRequired: "text-destructive-text",
   fieldDescription: "text-sm leading-5 text-muted-foreground",
   fieldMessage: "text-sm leading-5 text-muted-foreground",
   fieldControl: "min-w-0",
@@ -172,9 +459,9 @@ var baseSlots = {
   dialogTrigger: "",
   dialogTriggerDisabled: "!cursor-not-allowed opacity-60",
   dialogOverlay: "fixed inset-0 z-50 bg-background/70 backdrop-blur-sm motion-safe:animate-in motion-safe:fade-in motion-safe:duration-300 motion-safe:ease-out",
-  dialogContent: "fixed inset-0 z-50 flex min-h-0 items-center justify-center p-4",
+  dialogContent: "pointer-events-none fixed inset-0 z-50 flex min-h-0 items-center justify-center p-4",
   dialogPanel: cn(
-    "relative flex max-h-[min(85vh,720px)] w-full max-w-lg min-w-0 flex-col overflow-hidden rounded-lg border border-border/70 bg-background text-foreground shadow-xl",
+    "pointer-events-auto relative flex max-h-[min(85vh,720px)] w-full max-w-lg min-w-0 flex-col overflow-hidden rounded-lg border border-border/70 bg-background text-foreground shadow-xl",
     "motion-safe:animate-in motion-safe:fade-in motion-safe:zoom-in-95 motion-safe:duration-300 motion-safe:ease-out"
   ),
   dialogHeader: "grid min-w-0 gap-1 border-b border-border/60 px-5 py-4",
@@ -189,17 +476,17 @@ var baseSlots = {
   dropdownRoot: "relative inline-flex min-w-0",
   dropdownTrigger: "",
   dropdownTriggerDisabled: "!cursor-not-allowed opacity-60",
-  dropdownMenu: "absolute left-0 top-[calc(100%+0.375rem)] z-50 min-w-48 overflow-hidden rounded-md border border-border bg-background p-1 text-sm text-foreground shadow-lg motion-safe:animate-in motion-safe:fade-in motion-safe:duration-300 motion-safe:ease-out",
+  dropdownMenu: "z-50 min-w-48 overflow-hidden rounded-md border border-border bg-background p-1 text-sm text-foreground shadow-lg motion-safe:animate-in motion-safe:fade-in motion-safe:duration-300 motion-safe:ease-out",
   dropdownMenuTop: "bottom-[calc(100%+0.375rem)] top-auto",
   dropdownMenuEnd: "left-auto right-0",
   dropdownLabel: "px-2.5 py-1.5 text-xs font-semibold uppercase tracking-[0.12em] text-muted-foreground",
   dropdownSeparator: "my-1 h-px bg-border/70",
   dropdownItem: cn(
-    "flex min-w-0 cursor-pointer items-center gap-2 rounded-sm px-2.5 py-2 text-left text-sm text-foreground hover:bg-accent/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30",
+    "flex min-w-0 cursor-pointer items-center gap-2 rounded-sm px-2.5 py-2 text-left text-sm text-foreground hover:bg-accent/60 focus:bg-accent/60 data-[highlighted]:bg-accent/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30",
     motionInteractive
   ),
-  dropdownItemDanger: "text-destructive hover:bg-destructive/10",
-  dropdownItemDisabled: "!cursor-not-allowed opacity-50 hover:bg-transparent",
+  dropdownItemDanger: "text-destructive-text hover:bg-destructive/10 focus:bg-destructive/10 data-[highlighted]:bg-destructive/10",
+  dropdownItemDisabled: "!cursor-not-allowed opacity-50 hover:bg-transparent focus:bg-transparent data-[highlighted]:bg-transparent",
   dropdownItemIcon: "inline-flex h-4 w-4 shrink-0 items-center justify-center",
   dropdownItemContent: "grid min-w-0 flex-1 gap-0.5",
   dropdownItemLabel: "min-w-0 truncate",
@@ -207,7 +494,7 @@ var baseSlots = {
   dropdownItemShortcut: "ml-3 shrink-0 text-xs font-medium text-muted-foreground",
   tooltipRoot: "relative inline-flex min-w-0",
   tooltipTrigger: "inline-flex min-w-0",
-  tooltipContent: "pointer-events-none absolute z-50 max-w-xs rounded-md border border-border bg-popover px-2.5 py-1.5 text-xs leading-5 text-popover-foreground shadow-lg motion-safe:animate-in motion-safe:fade-in motion-safe:duration-300 motion-safe:ease-out",
+  tooltipContent: "pointer-events-none z-50 max-w-xs rounded-md border border-border bg-popover px-2.5 py-1.5 text-xs leading-5 text-popover-foreground shadow-lg motion-safe:animate-in motion-safe:fade-in motion-safe:duration-300 motion-safe:ease-out",
   noticeBase: cn(
     "flex min-w-0 gap-3 rounded-lg border px-4 py-3 text-sm",
     motionBase,
@@ -217,7 +504,7 @@ var baseSlots = {
   noticePrimary: "border-primary/25 bg-primary/10 text-primary",
   noticeSuccess: "border-emerald-500/30 bg-emerald-500/10 text-emerald-700",
   noticeWarning: "border-amber-500/30 bg-amber-500/10 text-amber-700",
-  noticeDanger: "border-destructive/30 bg-destructive/10 text-destructive",
+  noticeDanger: "border-destructive/30 bg-destructive/10 text-destructive-text",
   noticeMuted: "border-border/60 bg-muted/35 text-muted-foreground",
   noticeIcon: "mt-0.5 inline-flex h-4 w-4 shrink-0 items-center justify-center motion-safe:animate-in motion-safe:fade-in",
   noticeTitle: "font-semibold leading-5",
@@ -237,12 +524,12 @@ var baseSlots = {
     motionBase
   ),
   tabsTrigger: cn(
-    "inline-flex min-w-0 cursor-pointer items-center justify-center rounded-md px-3 py-1.5 text-sm font-medium text-muted-foreground hover:bg-background/70 hover:text-foreground focus-visible:outline-none",
+    "inline-flex min-w-0 cursor-pointer items-center justify-center rounded-md px-3 py-1.5 text-sm font-medium text-muted-foreground hover:bg-background/70 hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30 focus-visible:ring-offset-1 motion-reduce:transition-none",
     motionInteractive
   ),
   tabsTriggerActive: "bg-background text-foreground shadow-sm",
   tabsTriggerDisabled: "!cursor-not-allowed opacity-50 hover:bg-transparent",
-  tabsPanel: "min-w-0 rounded-lg border border-border/70 bg-background p-4 text-sm text-foreground motion-safe:animate-in motion-safe:fade-in motion-safe:duration-300 motion-safe:ease-out",
+  tabsPanel: "min-w-0 rounded-lg border border-border/70 bg-background p-4 text-sm text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30 motion-safe:animate-in motion-safe:fade-in motion-safe:duration-300 motion-safe:ease-out motion-reduce:transition-none",
   segmentedRoot: cn(
     "inline-flex min-w-0 items-center gap-1 rounded-lg border border-border/70 bg-muted/30 p-1",
     motionBase
@@ -262,7 +549,7 @@ var baseSlots = {
   skeletonRoot: "relative overflow-hidden rounded-md bg-muted/70",
   avatarRoot: "relative inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full border border-border bg-muted text-sm font-semibold text-muted-foreground motion-safe:transition motion-safe:duration-300 motion-safe:ease-out",
   avatarImage: "h-full w-full object-cover",
-  avatarFallback: "flex h-full w-full items-center justify-center bg-muted text-muted-foreground",
+  avatarFallback: "flex h-full w-full items-center justify-center bg-muted text-foreground",
   avatarStatus: "absolute bottom-0 right-0 h-2.5 w-2.5 rounded-full border-2 border-background bg-muted-foreground motion-safe:animate-pulse",
   avatarText: "min-w-0 truncate text-sm font-medium text-foreground",
   toolbarRoot: cn(
@@ -282,22 +569,24 @@ var baseSlots = {
   breadcrumbSeparator: "shrink-0 text-muted-foreground/70",
   paginationRoot: "flex min-w-0 flex-wrap items-center justify-between gap-3 text-sm",
   paginationInfo: "min-w-0 text-muted-foreground",
-  paginationControls: "flex shrink-0 items-center gap-1.5",
-  paginationButton: "inline-flex h-8 min-w-8 cursor-pointer items-center justify-center rounded-md border border-border bg-background px-2.5 text-sm font-medium text-foreground hover:bg-accent/60 disabled:!cursor-not-allowed disabled:opacity-50 motion-safe:transition motion-safe:duration-300 motion-safe:ease-out",
+  paginationControls: "flex min-w-0 flex-wrap items-center justify-end gap-1.5",
+  paginationButton: "inline-flex h-8 min-w-8 cursor-pointer items-center justify-center whitespace-nowrap rounded-md border border-border bg-background px-2.5 text-sm font-medium text-foreground hover:bg-accent/60 disabled:!cursor-not-allowed disabled:opacity-50 motion-safe:transition motion-safe:duration-300 motion-safe:ease-out",
   paginationButtonDisabled: "!cursor-not-allowed opacity-50",
-  paginationPage: "inline-flex h-8 min-w-8 items-center justify-center rounded-md bg-muted/50 px-2.5 text-sm font-medium text-foreground",
+  paginationPage: "inline-flex h-8 min-w-8 cursor-default items-center justify-center rounded-md bg-muted/50 px-2.5 text-sm font-medium text-foreground hover:bg-muted/50",
+  paginationEllipsis: "inline-flex h-8 min-w-6 items-center justify-center px-1 text-sm text-muted-foreground",
   descriptionListRoot: "grid min-w-0 gap-3 text-sm",
   descriptionListItem: "grid min-w-0 gap-1 rounded-md border border-border/60 bg-background px-3 py-2 motion-safe:transition motion-safe:duration-300 motion-safe:ease-out hover:shadow-sm",
   descriptionListTerm: "min-w-0 truncate text-xs font-medium uppercase tracking-[0.08em] text-muted-foreground",
   descriptionListValue: "min-w-0 text-sm leading-6 text-foreground",
   accordionRoot: "grid min-w-0 gap-2",
-  accordionItem: "overflow-hidden rounded-lg border border-border/70 bg-background motion-safe:transition motion-safe:duration-300 motion-safe:ease-out",
-  accordionTrigger: "flex w-full min-w-0 cursor-pointer items-center justify-between gap-3 px-4 py-3 text-left text-sm font-medium text-foreground hover:bg-muted/40 disabled:!cursor-not-allowed disabled:opacity-50 motion-safe:transition motion-safe:duration-300 motion-safe:ease-out",
+  accordionItem: "overflow-hidden rounded-lg border border-border/70 bg-background motion-safe:transition motion-safe:duration-300 motion-safe:ease-out motion-reduce:transition-none",
+  accordionTrigger: "flex w-full min-w-0 cursor-pointer items-center justify-between gap-3 px-4 py-3 text-start text-sm font-medium text-foreground hover:bg-muted/40 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring disabled:!cursor-not-allowed disabled:opacity-50 motion-safe:transition motion-safe:duration-300 motion-safe:ease-out motion-reduce:transition-none",
   accordionTriggerIcon: cn(
     "h-2 w-2 shrink-0 rotate-45 border-b border-r border-current text-muted-foreground",
-    motionTransform
+    motionTransform,
+    "motion-reduce:transition-none"
   ),
-  accordionPanel: "border-t border-border/60 px-4 py-3 text-sm leading-6 text-muted-foreground motion-safe:animate-in motion-safe:fade-in motion-safe:duration-300 motion-safe:ease-out",
+  accordionPanel: "border-t border-border/60 px-4 py-3 text-sm leading-6 text-muted-foreground motion-safe:animate-in motion-safe:fade-in motion-safe:duration-300 motion-safe:ease-out motion-reduce:animate-none",
   menuTrigger: "inline-flex min-w-0",
   menuContent: "z-50 min-w-44 overflow-hidden rounded-md border border-border bg-background p-1 text-sm text-foreground shadow-lg outline-none motion-safe:animate-in motion-safe:fade-in motion-safe:zoom-in-95 motion-safe:duration-300 motion-safe:ease-out",
   menuLabel: "px-2 py-1.5 text-xs font-medium text-muted-foreground",
@@ -310,7 +599,7 @@ var baseSlots = {
   menuItemPrimary: "text-primary focus:text-primary data-[highlighted]:text-primary",
   menuItemSuccess: "text-emerald-700 focus:text-emerald-700 data-[highlighted]:text-emerald-700",
   menuItemWarning: "text-amber-700 focus:text-amber-700 data-[highlighted]:text-amber-700",
-  menuItemDanger: "text-destructive focus:text-destructive data-[highlighted]:text-destructive",
+  menuItemDanger: "text-destructive-text focus:text-destructive-text data-[highlighted]:text-destructive-text",
   menuItemMuted: "text-muted-foreground focus:text-foreground data-[highlighted]:text-foreground",
   menuItemDisabled: "!cursor-not-allowed opacity-50 data-[disabled]:pointer-events-none",
   menuItemIcon: "inline-flex h-4 w-4 shrink-0 items-center justify-center",
@@ -341,13 +630,13 @@ var baseSlots = {
   tableBody: "[&_tr:last-child>*]:border-b-0",
   tableFooter: "bg-muted/30 font-medium [&_tr>*]:border-t [&_tr>*]:border-border/70",
   tableFooterBar: cn(
-    "flex min-w-0 flex-wrap items-center justify-between gap-3 rounded-lg border border-border/70 bg-muted/20 px-4 py-3 text-sm text-muted-foreground shadow-none",
+    "flex min-w-0 flex-wrap items-center justify-between gap-3 rounded-lg border border-border/70 bg-muted/20 px-4 py-3 text-sm text-foreground shadow-none",
     motionBase
   ),
   tableFooterBarAttached: "-mt-px rounded-t-none border-t border-border/70 shadow-none",
   tableFooterBarLeading: "flex min-w-0 items-center gap-2",
   tableFooterBarContent: "min-w-0 flex-1",
-  tableFooterBarActions: "ml-auto flex shrink-0 flex-wrap items-center gap-2",
+  tableFooterBarActions: "ms-auto flex shrink-0 flex-wrap items-center gap-2",
   tableSplitRoot: "grid w-full min-w-0 grid-cols-[minmax(0,1fr)] grid-rows-[auto_minmax(0,1fr)_auto] caption-bottom border-separate border-spacing-0 text-sm text-foreground",
   tableSplitHeader: "block w-full min-w-0 shrink-0 overflow-x-hidden overflow-y-hidden bg-transparent",
   tableSplitBody: cn(
@@ -357,7 +646,7 @@ var baseSlots = {
   tableSplitFooter: "block w-full min-w-0 shrink-0 overflow-x-hidden overflow-y-hidden",
   tableSplitRow: "grid w-max min-w-full [grid-template-columns:var(--base-table-column-template)]",
   tableSplitHead: "flex min-w-0 overflow-hidden",
-  tableSplitCell: "block min-w-0 overflow-hidden",
+  tableSplitCell: "block min-w-0 overflow-hidden [overflow-wrap:anywhere]",
   tableRow: cn(
     "[&>*]:border-b [&>*]:border-border/60 data-[state=selected]:bg-primary/5 data-[state=selected]:[&>*]:bg-primary/5",
     motionBase
@@ -386,8 +675,11 @@ var baseSlots = {
     "inline-flex h-5 w-4 shrink-0 cursor-grab items-center justify-center rounded-sm text-muted-foreground hover:bg-muted active:cursor-grabbing focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30 disabled:!cursor-not-allowed disabled:opacity-50",
     motionBase
   ),
-  tableHeadResizeHandle: "absolute right-0 top-1/2 h-7 w-2 -translate-y-1/2 cursor-col-resize rounded-sm after:absolute after:left-1/2 after:top-1/2 after:h-5 after:w-px after:-translate-x-1/2 after:-translate-y-1/2 after:bg-border hover:after:bg-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30 disabled:!cursor-not-allowed disabled:opacity-50",
-  tableCell: "px-3 py-2 align-middle text-sm text-foreground",
+  tableHeadResizeHandle: cn(
+    "absolute end-0 top-1/2 h-7 w-2 -translate-y-1/2 cursor-col-resize touch-none rounded-sm after:absolute after:start-1/2 after:top-1/2 after:h-5 after:w-px after:-translate-x-1/2 after:-translate-y-1/2 after:bg-border hover:after:bg-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30 disabled:!cursor-not-allowed disabled:opacity-50",
+    motionBase
+  ),
+  tableCell: "min-w-0 px-3 py-2 align-middle text-sm text-foreground [overflow-wrap:anywhere]",
   tableCellAlignCenter: "text-center",
   tableCellAlignRight: "text-right",
   tableEmptyRow: "[&>*]:border-b [&>*]:border-border/60",
@@ -1372,61 +1664,134 @@ function getInitials(name) {
   if (!words.length) return void 0;
   return words.slice(0, 2).map((word) => word[0]?.toUpperCase()).join("");
 }
-function BaseAvatar({
-  src,
-  alt,
-  name,
-  initials,
-  icon,
-  status,
-  size = "md",
-  appearance,
-  className,
-  classNames,
-  style,
-  children,
-  ...avatarProps
-}) {
-  const theme = resolveBaseAppearance(appearance);
-  const fallback = children ?? initials ?? getInitials(name) ?? icon;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ...avatarProps,
-      className: cn(
-        theme.slots.avatarRoot,
-        sizeClassNames[size],
-        classNames?.root,
-        className
-      ),
-      style: {
-        ...theme.styles.avatar,
-        ...style
-      },
-      title: name,
-      children: [
-        src ? /* @__PURE__ */ jsx(
-          "img",
-          {
-            src,
-            alt: alt ?? name ?? "",
-            className: cn(theme.slots.avatarImage, classNames?.image)
-          }
-        ) : /* @__PURE__ */ jsx("span", { className: cn(theme.slots.avatarFallback, classNames?.fallback), children: hasRenderableNode(fallback) ? fallback : "?" }),
-        isStatusPreset(status) ? /* @__PURE__ */ jsx(
-          "span",
-          {
-            "aria-hidden": "true",
-            className: cn(
-              theme.slots.avatarStatus,
-              statusClassNames[status],
-              classNames?.status
-            )
-          }
-        ) : hasRenderableNode(status) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.avatarStatus, classNames?.status), children: status }) : null
-      ]
+var BaseAvatar = forwardRef(
+  function BaseAvatar2({
+    src,
+    alt,
+    name,
+    initials,
+    icon,
+    status,
+    size = "md",
+    appearance,
+    className,
+    classNames,
+    style,
+    children,
+    title,
+    ...avatarProps
+  }, ref) {
+    if (size !== "sm" && size !== "md" && size !== "lg") {
+      throw new TypeError('BaseAvatar size must be "sm", "md", or "lg".');
     }
-  );
+    const resolvedAppearance = useMonkeysBaseAppearance(appearance);
+    const componentAttributes = useMonkeysComponentAttributes();
+    const theme = resolveBaseAppearance(resolvedAppearance);
+    const [failedSrc, setFailedSrc] = useState();
+    const imageFailed = Boolean(src && failedSrc === src);
+    const showImage = Boolean(src) && !imageFailed;
+    const generatedInitials = getInitials(name);
+    const fallbackKind = hasRenderableNode(children) ? "children" : hasRenderableNode(initials) ? "initials" : hasRenderableNode(generatedInitials) ? "name" : hasRenderableNode(icon) ? "icon" : "default";
+    const fallback = hasRenderableNode(children) ? children : hasRenderableNode(initials) ? initials : hasRenderableNode(generatedInitials) ? generatedInitials : hasRenderableNode(icon) ? icon : "?";
+    const statusKind = isStatusPreset(status) ? status : hasRenderableNode(status) ? "custom" : void 0;
+    useEffect(() => {
+      setFailedSrc(void 0);
+    }, [src]);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ...componentAttributes,
+        ...avatarProps,
+        ref,
+        title: title ?? name,
+        "data-monkeys-component": "avatar",
+        "data-slot": "root",
+        "data-state": showImage ? "image" : "fallback",
+        "data-size": size,
+        "data-status": statusKind,
+        "data-fallback": showImage ? void 0 : fallbackKind,
+        className: cn(
+          theme.slots.avatarRoot,
+          sizeClassNames[size],
+          classNames?.root,
+          className
+        ),
+        style: {
+          ...theme.styles.avatar,
+          ...style
+        },
+        children: [
+          showImage ? /* @__PURE__ */ jsx(
+            "img",
+            {
+              src,
+              alt: alt ?? name ?? "",
+              "data-slot": "image",
+              "data-size": size,
+              "data-status": statusKind,
+              className: cn(theme.slots.avatarImage, classNames?.image),
+              onError: () => setFailedSrc(src)
+            }
+          ) : /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-slot": "fallback",
+              "data-size": size,
+              "data-status": statusKind,
+              "data-fallback": fallbackKind,
+              className: cn(
+                theme.slots.avatarFallback,
+                classNames?.fallback,
+                classNames?.text
+              ),
+              children: fallback
+            }
+          ),
+          isStatusPreset(status) ? /* @__PURE__ */ jsx(
+            "span",
+            {
+              "aria-hidden": "true",
+              "data-slot": "status",
+              "data-size": size,
+              "data-status": status,
+              className: cn(
+                theme.slots.avatarStatus,
+                statusClassNames[status],
+                classNames?.status
+              )
+            }
+          ) : hasRenderableNode(status) ? /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-slot": "status",
+              "data-size": size,
+              "data-status": "custom",
+              className: cn(theme.slots.avatarStatus, classNames?.status),
+              children: status
+            }
+          ) : null
+        ]
+      }
+    );
+  }
+);
+var buttonSizeClassNames = {
+  sm: "h-8 px-2.5 text-xs",
+  md: "h-9 px-3 text-sm",
+  lg: "h-10 px-3.5 text-base"
+};
+var iconOnlySizeClassNames = {
+  sm: "h-8 w-8 px-0",
+  md: "h-9 w-9 px-0",
+  lg: "h-10 w-10 px-0"
+};
+var iconSizeClassNames = {
+  sm: "h-3.5 w-3.5",
+  md: "h-4 w-4",
+  lg: "h-5 w-5"
+};
+function nonEmptyText(value) {
+  return typeof value === "string" && value.trim() ? value : void 0;
 }
 function LoadingIcon() {
   return /* @__PURE__ */ jsxs(
@@ -1434,7 +1799,7 @@ function LoadingIcon() {
     {
       "aria-hidden": "true",
       viewBox: "0 0 24 24",
-      className: "h-4 w-4 animate-spin",
+      className: "h-full w-full motion-safe:animate-spin motion-reduce:animate-none",
       fill: "none",
       children: [
         /* @__PURE__ */ jsx(
@@ -1470,6 +1835,7 @@ var BaseButton = forwardRef(
     title,
     ariaLabel,
     tone,
+    size,
     active = false,
     iconOnly = false,
     disabled = false,
@@ -1483,11 +1849,42 @@ var BaseButton = forwardRef(
     "aria-label": nativeAriaLabel,
     ...buttonProps
   }, ref) {
-    const theme = resolveBaseAppearance(appearance);
+    for (const [name, value] of [
+      ["active", active],
+      ["iconOnly", iconOnly],
+      ["disabled", disabled],
+      ["loading", loading],
+      ["stopPropagation", stopPropagation]
+    ]) {
+      if (typeof value !== "boolean") {
+        throw new TypeError(`BaseButton ${name} must be a boolean.`);
+      }
+    }
+    if (size !== void 0 && size !== "sm" && size !== "md" && size !== "lg") {
+      throw new TypeError('BaseButton size must be "sm", "md", or "lg".');
+    }
+    if (tone !== void 0 && tone !== "default" && tone !== "primary" && tone !== "success" && tone !== "warning" && tone !== "danger" && tone !== "muted") {
+      throw new TypeError(
+        'BaseButton tone must be "default", "primary", "success", "warning", "danger", or "muted".'
+      );
+    }
+    const resolvedAppearance = useMonkeysBaseAppearance(appearance);
+    const componentAttributes = useMonkeysComponentAttributes();
+    const theme = resolveBaseAppearance(resolvedAppearance);
     const resolvedLabel = children ?? label;
-    const labelText = typeof resolvedLabel === "string" ? resolvedLabel : void 0;
-    const resolvedAriaLabel = ariaLabel ?? nativeAriaLabel ?? labelText ?? title ?? (iconOnly ? "Action" : void 0);
+    const hasLabel = hasRenderableNode(resolvedLabel) && (typeof resolvedLabel !== "string" || Boolean(resolvedLabel.trim()));
+    const explicitAriaLabel = nonEmptyText(ariaLabel) ?? nonEmptyText(nativeAriaLabel);
+    const labelText = typeof resolvedLabel === "string" ? nonEmptyText(resolvedLabel) : void 0;
+    const resolvedTitle = nonEmptyText(title);
+    if (iconOnly && !hasLabel && !explicitAriaLabel && !resolvedTitle) {
+      throw new TypeError(
+        "BaseButton iconOnly requires ariaLabel, aria-label, title, or a renderable label."
+      );
+    }
+    const resolvedAriaLabel = explicitAriaLabel ?? labelText ?? resolvedTitle;
     const resolvedDisabled = disabled || loading;
+    const resolvedTone = tone ?? "default";
+    const state = loading ? "loading" : disabled ? "disabled" : active ? "active" : "idle";
     const handleClick = (event) => {
       if (stopPropagation) {
         event.stopPropagation();
@@ -1498,6 +1895,7 @@ var BaseButton = forwardRef(
     return /* @__PURE__ */ jsxs(
       "button",
       {
+        ...componentAttributes,
         ...buttonProps,
         ref,
         type,
@@ -1506,9 +1904,20 @@ var BaseButton = forwardRef(
         "aria-pressed": active || void 0,
         "aria-busy": loading || void 0,
         disabled: resolvedDisabled,
+        "data-monkeys-component": "button",
+        "data-slot": "root",
+        "data-state": state,
+        "data-tone": resolvedTone,
+        "data-size": size,
+        "data-active": active || void 0,
+        "data-loading": loading || void 0,
+        "data-disabled": resolvedDisabled || void 0,
+        "data-icon-only": iconOnly || void 0,
         className: cn(
           theme.slots.buttonBase,
           iconOnly && theme.slots.buttonIconOnly,
+          size && buttonSizeClassNames[size],
+          iconOnly && size && iconOnlySizeClassNames[size],
           getBaseButtonToneClassName(theme, tone, active),
           resolvedDisabled && theme.slots.buttonDisabled,
           classNames?.root,
@@ -1522,1560 +1931,316 @@ var BaseButton = forwardRef(
         },
         onClick: handleClick,
         children: [
-          loading ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.buttonIcon, classNames?.icon), children: /* @__PURE__ */ jsx(LoadingIcon, {}) }) : icon ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.buttonIcon, classNames?.icon), children: icon }) : null,
-          iconOnly ? hasRenderableNode(resolvedLabel) ? /* @__PURE__ */ jsx("span", { className: "sr-only", children: resolvedLabel }) : null : hasRenderableNode(resolvedLabel) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.buttonLabel, classNames?.label), children: resolvedLabel }) : null,
-          !loading && endIcon ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.buttonIcon, classNames?.icon), children: endIcon }) : null
-        ]
-      }
-    );
-  }
-);
-function setRefs(element, ...refs) {
-  refs.forEach((ref) => {
-    if (!ref) return;
-    if (typeof ref === "function") {
-      ref(element);
-      return;
-    }
-    ref.current = element;
-  });
-}
-forwardRef(
-  function BaseCheckbox2({
-    label,
-    description,
-    indeterminate = false,
-    invalid = false,
-    disabled = false,
-    appearance,
-    className,
-    classNames,
-    style,
-    checked,
-    defaultChecked,
-    onChange,
-    "aria-invalid": nativeAriaInvalid,
-    ...checkboxProps
-  }, forwardedRef) {
-    const theme = resolveBaseAppearance(appearance);
-    const inputRef = useRef(null);
-    const [uncontrolledChecked, setUncontrolledChecked] = useState(
-      defaultChecked ?? false
-    );
-    const isControlled = checked !== void 0;
-    const resolvedChecked = Boolean(isControlled ? checked : uncontrolledChecked);
-    const active = indeterminate || resolvedChecked;
-    useEffect(() => {
-      if (inputRef.current) {
-        inputRef.current.indeterminate = indeterminate;
-      }
-    }, [indeterminate]);
-    const handleChange = (event) => {
-      if (disabled) return;
-      if (!isControlled) {
-        setUncontrolledChecked(event.currentTarget.checked);
-      }
-      onChange?.(event);
-    };
-    return /* @__PURE__ */ jsxs(
-      "label",
-      {
-        className: cn(
-          theme.slots.checkboxRoot,
-          disabled && theme.slots.checkboxDisabled,
-          classNames?.root,
-          className
-        ),
-        style: {
-          ...theme.styles.checkboxRoot,
-          ...style
-        },
-        children: [
-          /* @__PURE__ */ jsxs(
+          loading ? /* @__PURE__ */ jsx(
             "span",
             {
+              "data-slot": "icon",
+              "data-state": state,
+              "data-tone": resolvedTone,
+              "data-size": size,
               className: cn(
-                theme.slots.checkboxBox,
-                active && theme.slots.checkboxBoxChecked,
-                invalid && theme.slots.checkboxBoxInvalid,
-                classNames?.box
+                theme.slots.buttonIcon,
+                size && iconSizeClassNames[size],
+                classNames?.icon
               ),
-              style: {
-                ...theme.styles.checkboxBox
-              },
-              children: [
-                /* @__PURE__ */ jsx(
-                  "input",
-                  {
-                    ...checkboxProps,
-                    ref: (element) => setRefs(element, inputRef, forwardedRef),
-                    type: "checkbox",
-                    disabled,
-                    checked,
-                    defaultChecked,
-                    "aria-invalid": nativeAriaInvalid ?? (invalid || void 0),
-                    "aria-checked": indeterminate ? "mixed" : resolvedChecked,
-                    className: cn(theme.slots.checkboxInput, classNames?.input),
-                    onChange: handleChange
-                  }
-                ),
-                active ? /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    "aria-hidden": "true",
-                    className: cn(theme.slots.checkboxIndicator, classNames?.indicator),
-                    children: indeterminate ? "\u2013" : "\u2713"
-                  }
-                ) : null
-              ]
+              children: /* @__PURE__ */ jsx(LoadingIcon, {})
             }
-          ),
-          hasRenderableNode(label) || hasRenderableNode(description) ? /* @__PURE__ */ jsxs("span", { className: cn(theme.slots.checkboxContent, classNames?.content), children: [
-            hasRenderableNode(label) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.checkboxLabel, classNames?.label), children: label }) : null,
-            hasRenderableNode(description) ? /* @__PURE__ */ jsx(
-              "span",
-              {
-                className: cn(
-                  theme.slots.checkboxDescription,
-                  classNames?.description
-                ),
-                children: description
-              }
-            ) : null
-          ] }) : null
-        ]
-      }
-    );
-  }
-);
-forwardRef(
-  function BaseInput2({
-    icon,
-    trailing,
-    invalid = false,
-    disabled = false,
-    readOnly = false,
-    appearance,
-    className,
-    classNames,
-    style,
-    "aria-invalid": nativeAriaInvalid,
-    ...inputProps
-  }, ref) {
-    const theme = resolveBaseAppearance(appearance);
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: cn(
-          theme.slots.controlWrapper,
-          invalid && theme.slots.controlInvalid,
-          disabled && theme.slots.controlDisabled,
-          readOnly && theme.slots.controlReadOnly,
-          classNames?.root,
-          className
-        ),
-        style: {
-          ...theme.styles.control,
-          ...invalid ? theme.styles.controlInvalid : void 0,
-          ...disabled ? theme.styles.controlDisabled : void 0,
-          ...style
-        },
-        children: [
-          hasRenderableNode(icon) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.controlIcon, classNames?.icon), children: icon }) : null,
-          /* @__PURE__ */ jsx(
-            "input",
+          ) : icon ? /* @__PURE__ */ jsx(
+            "span",
             {
-              ...inputProps,
-              ref,
-              disabled,
-              readOnly,
-              "aria-invalid": nativeAriaInvalid ?? (invalid || void 0),
+              "data-slot": "icon",
+              "data-state": state,
+              "data-tone": resolvedTone,
+              "data-size": size,
               className: cn(
-                theme.slots.controlBase,
-                theme.slots.controlInput,
-                classNames?.control
-              )
+                theme.slots.buttonIcon,
+                size && iconSizeClassNames[size],
+                classNames?.icon
+              ),
+              children: icon
             }
-          ),
-          hasRenderableNode(trailing) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.controlTrailing, classNames?.trailing), children: trailing }) : null
+          ) : null,
+          iconOnly ? hasRenderableNode(resolvedLabel) ? /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-slot": "label",
+              "data-state": state,
+              "data-tone": resolvedTone,
+              "data-size": size,
+              className: "sr-only",
+              children: resolvedLabel
+            }
+          ) : null : hasRenderableNode(resolvedLabel) ? /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-slot": "label",
+              "data-state": state,
+              "data-tone": resolvedTone,
+              "data-size": size,
+              className: cn(theme.slots.buttonLabel, classNames?.label),
+              children: resolvedLabel
+            }
+          ) : null,
+          !loading && endIcon ? /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-slot": "end-icon",
+              "data-state": state,
+              "data-tone": resolvedTone,
+              "data-size": size,
+              className: cn(
+                theme.slots.buttonIcon,
+                size && iconSizeClassNames[size],
+                classNames?.icon,
+                classNames?.endIcon
+              ),
+              children: endIcon
+            }
+          ) : null
         ]
       }
     );
   }
 );
-function normalizeValues(values) {
-  const nextValues = [];
-  const seen = /* @__PURE__ */ new Set();
-  values?.forEach((value) => {
-    if (seen.has(value)) return;
-    seen.add(value);
-    nextValues.push(value);
-  });
-  return nextValues;
+function resolveContainerValue(value, source) {
+  const candidate = typeof value === "function" ? value() : value;
+  if (candidate === null) return null;
+  if (!candidate || typeof candidate !== "object" || candidate.nodeType !== 1) {
+    throw new TypeError(`${source} must resolve to an Element or null.`);
+  }
+  return candidate;
 }
-function getNextEnabledIndex(options, currentIndex, direction) {
-  if (!options.length) return -1;
-  const startIndex = currentIndex >= 0 ? currentIndex : 0;
-  for (let offset = 1; offset <= options.length; offset += 1) {
-    const nextIndex = (startIndex + offset * direction + options.length) % options.length;
-    if (!options[nextIndex]?.disabled) {
-      return nextIndex;
-    }
+function resolveBasePortalContainer({
+  explicitProvided,
+  explicitContainer,
+  providerProvided,
+  providerContainer,
+  getDocument
+}) {
+  if (explicitProvided) {
+    return resolveContainerValue(
+      explicitContainer,
+      "BasePortal container"
+    );
+  }
+  if (providerProvided) {
+    return resolveContainerValue(
+      providerContainer,
+      "MonkeysProvider portal.container"
+    );
+  }
+  if (!getDocument) return null;
+  const ownerDocument = getDocument();
+  if (ownerDocument === null) return null;
+  if (!ownerDocument || typeof ownerDocument !== "object" || !("body" in ownerDocument)) {
+    throw new TypeError(
+      "MonkeysProvider environment.getDocument must resolve to a Document or null."
+    );
   }
-  return -1;
+  return resolveContainerValue(
+    ownerDocument.body,
+    "MonkeysProvider environment.getDocument().body"
+  );
 }
-function getFirstEnabledIndex(options) {
-  return options.findIndex((option) => !option.disabled);
+function resolveBaseOverlayPortalState({
+  mounted,
+  explicitDisabled,
+  explicitContainer,
+  providerDisabled,
+  providerContainer,
+  getDocument
+}) {
+  const disabled = explicitDisabled ?? providerDisabled ?? false;
+  if (!mounted || disabled) {
+    return {
+      mounted,
+      disabled,
+      shouldPortal: false,
+      container: null,
+      radixPortalProps: void 0
+    };
+  }
+  const container = resolveBasePortalContainer({
+    explicitProvided: explicitContainer !== void 0,
+    explicitContainer,
+    providerProvided: providerContainer !== void 0,
+    providerContainer,
+    getDocument
+  });
+  if (!container) {
+    return {
+      mounted: true,
+      disabled: false,
+      shouldPortal: false,
+      container: null,
+      radixPortalProps: void 0
+    };
+  }
+  return {
+    mounted: true,
+    disabled: false,
+    shouldPortal: true,
+    container,
+    radixPortalProps: Object.freeze({ container })
+  };
 }
-function getSafeTagCount(maxTagCount, total) {
-  if (maxTagCount === void 0) return total;
-  if (!Number.isFinite(maxTagCount)) return total;
-  return Math.max(0, Math.min(total, Math.floor(maxTagCount)));
+function getDefaultDocument() {
+  return globalThis.document ?? null;
 }
-function getDefaultRemoveLabel(option) {
-  return `Remove ${option.value}`;
+function useBaseOverlayPortal(options = {}) {
+  const environment = useMonkeysEnvironment();
+  const portalOptions = useMonkeysPortalOptions();
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+  return resolveBaseOverlayPortalState({
+    mounted,
+    explicitDisabled: options.disabled,
+    explicitContainer: options.container,
+    providerDisabled: portalOptions.disabled,
+    providerContainer: portalOptions.container,
+    getDocument: environment.getDocument ?? getDefaultDocument
+  });
 }
-forwardRef(
-  function BaseMultiSelect2({
-    options,
-    value,
-    defaultValue,
-    name,
-    placeholder = "Select options",
-    icon,
-    invalid = false,
+function validateBoolean(value, name) {
+  if (typeof value !== "boolean") {
+    throw new TypeError(`BaseTooltip ${name} must be a boolean.`);
+  }
+}
+function validatePlacement(value) {
+  if (value !== "top" && value !== "bottom" && value !== "left" && value !== "right") {
+    throw new TypeError(
+      'BaseTooltip placement must be "top", "bottom", "left", or "right".'
+    );
+  }
+}
+function normalizeTrigger(children, disabled) {
+  if (isValidElement(children) && children.type !== Fragment) {
+    return children;
+  }
+  return /* @__PURE__ */ jsx("span", { tabIndex: !disabled && hasRenderableNode(children) ? 0 : void 0, children });
+}
+var BaseTooltip = forwardRef(
+  function BaseTooltip2({
+    content,
+    children,
+    open,
+    defaultOpen = false,
+    placement = "top",
     disabled = false,
-    required = false,
-    openForPreview = false,
-    maxTagCount,
-    removeLabel = getDefaultRemoveLabel,
-    emptyLabel = "No options",
+    portal = false,
     appearance,
     className,
     classNames,
     style,
-    id,
-    "aria-invalid": nativeAriaInvalid,
-    "aria-label": nativeAriaLabel,
-    "aria-labelledby": nativeAriaLabelledBy,
-    onValueChange,
-    ...rootProps
+    onOpenChange,
+    ...tooltipProps
   }, ref) {
-    const theme = resolveBaseAppearance(appearance);
-    const generatedId = useId();
-    const multiSelectId = id ?? generatedId;
-    const controlId = `${multiSelectId}-control`;
-    const listboxId = `${multiSelectId}-listbox`;
-    const rootRef = useRef(null);
-    const optionList = options ?? [];
-    const forceOpen = openForPreview;
-    const [uncontrolledOpen, setUncontrolledOpen] = useState(false);
-    const open = forceOpen || uncontrolledOpen;
-    const [uncontrolledValue, setUncontrolledValue] = useState(
-      () => normalizeValues(defaultValue)
-    );
-    const [activeIndex, setActiveIndex] = useState(
-      () => getFirstEnabledIndex(optionList)
-    );
-    const isControlled = value !== void 0;
-    const selectedValues = useMemo(
-      () => normalizeValues(isControlled ? value : uncontrolledValue),
-      [isControlled, uncontrolledValue, value]
-    );
-    const selectedValueSet = useMemo(
-      () => new Set(selectedValues),
-      [selectedValues]
-    );
-    const optionByValue = useMemo(() => {
-      const map = /* @__PURE__ */ new Map();
-      optionList.forEach((option) => {
-        if (!map.has(option.value)) {
-          map.set(option.value, option);
-        }
-      });
-      return map;
-    }, [optionList]);
-    const selectedOptions = useMemo(
-      () => selectedValues.map((selectedValue) => optionByValue.get(selectedValue)).filter(
-        (option) => option !== void 0
-      ),
-      [optionByValue, selectedValues]
-    );
-    const firstEnabledIndex = useMemo(
-      () => getFirstEnabledIndex(optionList),
-      [optionList]
-    );
-    const resolvedActiveIndex = activeIndex >= 0 && !optionList[activeIndex]?.disabled ? activeIndex : firstEnabledIndex;
-    const visibleTagCount = getSafeTagCount(
-      maxTagCount,
-      selectedOptions.length
-    );
-    const visibleOptions = selectedOptions.slice(0, visibleTagCount);
-    const overflowCount = selectedOptions.length - visibleOptions.length;
-    const isPlaceholder = selectedOptions.length === 0;
-    const setRootRef = (node) => {
-      rootRef.current = node;
-      if (typeof ref === "function") {
-        ref(node);
-      } else if (ref) {
-        ref.current = node;
-      }
-    };
-    const setOpen = (nextOpen) => {
-      if (disabled || forceOpen) return;
-      setUncontrolledOpen(nextOpen);
-      if (nextOpen) {
-        setActiveIndex(resolvedActiveIndex);
-      }
-    };
-    useEffect(() => {
-      if (!open || forceOpen) return void 0;
-      const handlePointerDown = (event) => {
-        if (!rootRef.current?.contains(event.target)) {
-          setUncontrolledOpen(false);
-        }
-      };
-      document.addEventListener("pointerdown", handlePointerDown);
-      return () => {
-        document.removeEventListener("pointerdown", handlePointerDown);
-      };
-    }, [forceOpen, open]);
-    useEffect(() => {
-      if (resolvedActiveIndex >= 0 && resolvedActiveIndex !== activeIndex) {
-        setActiveIndex(resolvedActiveIndex);
-      }
-    }, [activeIndex, resolvedActiveIndex]);
-    const commitValues = (nextValues) => {
-      const normalizedValues = normalizeValues(nextValues);
+    if (open !== void 0) validateBoolean(open, "open");
+    validateBoolean(defaultOpen, "defaultOpen");
+    validateBoolean(disabled, "disabled");
+    validateBoolean(portal, "portal");
+    validatePlacement(placement);
+    const resolvedAppearance = useMonkeysBaseAppearance(appearance);
+    const componentAttributes = useMonkeysComponentAttributes();
+    const theme = resolveBaseAppearance(resolvedAppearance);
+    const overlayPortal = useBaseOverlayPortal({ disabled: !portal });
+    const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);
+    const isControlled = open !== void 0;
+    const canShow = !disabled && hasRenderableNode(content);
+    const requestedOpen = isControlled ? open : uncontrolledOpen;
+    const isOpen = canShow && requestedOpen;
+    const portalState = portal && overlayPortal.shouldPortal ? "portaled" : "inline";
+    const handleOpenChange = (nextOpen) => {
+      if (nextOpen && !canShow) return;
       if (!isControlled) {
-        setUncontrolledValue(normalizedValues);
+        setUncontrolledOpen(nextOpen);
       }
-      onValueChange?.(normalizedValues);
-    };
-    const toggleOption = (option) => {
-      if (!option || option.disabled || disabled) return;
-      const nextValues = selectedValueSet.has(option.value) ? selectedValues.filter((selectedValue) => selectedValue !== option.value) : [...selectedValues, option.value];
-      commitValues(nextValues);
-    };
-    const removeOption = (option) => {
-      if (disabled) return;
-      commitValues(
-        selectedValues.filter((selectedValue) => selectedValue !== option.value)
-      );
+      onOpenChange?.(nextOpen);
     };
-    const focusOption = (direction) => {
-      const nextIndex = getNextEnabledIndex(
-        optionList,
-        resolvedActiveIndex,
-        direction
-      );
-      if (nextIndex >= 0) {
-        setActiveIndex(nextIndex);
+    const trigger = normalizeTrigger(children, disabled);
+    const tooltipContent = canShow ? /* @__PURE__ */ jsx(
+      Tooltip.Content,
+      {
+        ...componentAttributes,
+        side: placement,
+        sideOffset: 8,
+        collisionPadding: 8,
+        "data-monkeys-component": "tooltip",
+        "data-slot": "content",
+        "data-placement": placement,
+        "data-portal": portalState,
+        "data-disabled": disabled || void 0,
+        className: cn(theme.slots.tooltipContent, classNames?.content),
+        style: theme.styles.tooltip,
+        children: content
       }
-    };
-    const handleKeyDown = (event) => {
-      if (disabled) return;
-      if (event.key === "ArrowDown" || event.key === "ArrowUp") {
-        event.preventDefault();
-        if (!open) {
-          setOpen(true);
-          setActiveIndex(firstEnabledIndex);
-          return;
-        }
-        focusOption(event.key === "ArrowDown" ? 1 : -1);
-        return;
-      }
-      if (event.key === "Home") {
-        event.preventDefault();
-        setOpen(true);
-        setActiveIndex(firstEnabledIndex);
-        return;
-      }
-      if (event.key === "End") {
-        event.preventDefault();
-        setOpen(true);
-        for (let index = optionList.length - 1; index >= 0; index -= 1) {
-          if (!optionList[index]?.disabled) {
-            setActiveIndex(index);
-            break;
-          }
-        }
-        return;
-      }
-      if (event.key === "Enter" || event.key === " ") {
-        event.preventDefault();
-        if (!open) {
-          setOpen(true);
-          return;
-        }
-        toggleOption(optionList[resolvedActiveIndex]);
-        return;
-      }
-      if (event.key === "Escape") {
-        setOpen(false);
-      }
-    };
-    return /* @__PURE__ */ jsxs(
-      "div",
+    ) : null;
+    return /* @__PURE__ */ jsx(
+      "span",
       {
-        ...rootProps,
-        id,
-        ref: setRootRef,
-        className: cn(
-          theme.slots.controlWrapper,
-          "overflow-visible",
-          open && "z-50",
-          invalid && theme.slots.controlInvalid,
-          disabled && theme.slots.controlDisabled,
-          classNames?.root,
-          className
-        ),
-        style: {
-          ...theme.styles.control,
-          ...invalid ? theme.styles.controlInvalid : void 0,
-          ...disabled ? theme.styles.controlDisabled : void 0,
-          ...style
-        },
-        children: [
-          hasRenderableNode(icon) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.controlIcon, classNames?.icon), children: icon }) : null,
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              id: controlId,
-              role: "combobox",
-              tabIndex: disabled ? -1 : 0,
-              "aria-haspopup": "listbox",
-              "aria-expanded": open,
-              "aria-controls": listboxId,
-              "aria-disabled": disabled || void 0,
-              "aria-required": required || void 0,
-              "aria-invalid": nativeAriaInvalid ?? (invalid || void 0),
-              "aria-label": nativeAriaLabel,
-              "aria-labelledby": nativeAriaLabelledBy,
-              className: cn(
-                theme.slots.controlBase,
-                "flex min-h-9 cursor-pointer flex-wrap items-center gap-1.5 py-1.5 pr-9 text-left",
-                disabled && "!cursor-not-allowed",
-                classNames?.control
-              ),
-              onClick: () => setOpen(!open),
-              onKeyDown: handleKeyDown,
-              children: /* @__PURE__ */ jsxs(
-                "span",
-                {
-                  className: cn(
-                    "flex min-w-0 flex-1 flex-wrap items-center gap-1.5",
-                    classNames?.tagList
-                  ),
-                  children: [
-                    visibleOptions.map((option) => /* @__PURE__ */ jsxs(
-                      "span",
-                      {
-                        className: cn(
-                          "inline-flex max-w-full items-center gap-1 rounded-full border border-border/70 bg-muted/65 px-2 py-0.5 text-xs font-medium text-foreground",
-                          classNames?.tag
-                        ),
-                        children: [
-                          /* @__PURE__ */ jsx(
-                            "span",
-                            {
-                              className: cn(
-                                "max-w-40 truncate",
-                                classNames?.tagLabel
-                              ),
-                              children: option.label
-                            }
-                          ),
-                          /* @__PURE__ */ jsx(
-                            "button",
-                            {
-                              type: "button",
-                              "aria-label": removeLabel(option),
-                              disabled,
-                              className: cn(
-                                "inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-full text-muted-foreground hover:bg-background/80 hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30 disabled:!cursor-not-allowed",
-                                classNames?.tagRemove
-                              ),
-                              onClick: (event) => {
-                                event.preventDefault();
-                                event.stopPropagation();
-                                removeOption(option);
-                              },
-                              onMouseDown: (event) => {
-                                event.preventDefault();
-                                event.stopPropagation();
-                              },
-                              onKeyDown: (event) => event.stopPropagation(),
-                              children: /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "x" })
-                            }
-                          )
-                        ]
-                      },
-                      option.value
-                    )),
-                    overflowCount > 0 ? /* @__PURE__ */ jsxs(
-                      "span",
-                      {
-                        className: cn(
-                          "inline-flex max-w-full items-center rounded-full border border-border/70 bg-muted/45 px-2 py-0.5 text-xs font-medium text-muted-foreground",
-                          classNames?.tag
-                        ),
-                        children: [
-                          "+",
-                          overflowCount
-                        ]
-                      }
-                    ) : null,
-                    isPlaceholder ? /* @__PURE__ */ jsx(
-                      "span",
-                      {
-                        className: cn(
-                          "min-w-0 truncate",
-                          theme.slots.selectPlaceholder,
-                          classNames?.placeholder
-                        ),
-                        children: placeholder
-                      }
-                    ) : null
-                  ]
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "span",
-            {
-              className: cn(
-                theme.slots.selectChevron,
-                open && "rotate-[225deg]",
-                classNames?.chevron
-              )
-            }
-          ),
-          name ? selectedValues.map((selectedValue) => /* @__PURE__ */ jsx(
-            "input",
-            {
-              type: "hidden",
-              name,
-              value: selectedValue,
-              className: classNames?.hiddenInput
-            },
-            selectedValue
-          )) : null,
-          open ? /* @__PURE__ */ jsx(
-            "div",
-            {
-              id: listboxId,
-              role: "listbox",
-              "aria-multiselectable": "true",
-              "aria-labelledby": controlId,
-              className: cn(theme.slots.selectMenu, classNames?.menu),
-              style: theme.styles.selectMenu,
-              children: optionList.length > 0 ? optionList.map((option, index) => {
-                const selected = selectedValueSet.has(option.value);
-                const active = index === resolvedActiveIndex;
-                return /* @__PURE__ */ jsxs(
-                  "button",
-                  {
-                    type: "button",
-                    role: "option",
-                    "aria-selected": selected,
-                    disabled: option.disabled,
-                    className: cn(
-                      theme.slots.selectOption,
-                      "gap-2",
-                      active && theme.slots.selectOptionActive,
-                      selected && theme.slots.selectOptionSelected,
-                      option.disabled && theme.slots.selectOptionDisabled,
-                      classNames?.option
-                    ),
-                    style: {
-                      ...theme.styles.selectOption,
-                      ...active ? theme.styles.selectOptionActive : void 0,
-                      ...selected ? theme.styles.selectOptionSelected : void 0
-                    },
-                    onMouseEnter: () => {
-                      if (!option.disabled) {
-                        setActiveIndex(index);
-                      }
-                    },
-                    onMouseDown: (event) => event.preventDefault(),
-                    onClick: () => toggleOption(option),
-                    children: [
-                      /* @__PURE__ */ jsx(
-                        "span",
-                        {
-                          "aria-hidden": "true",
-                          className: cn(
-                            "inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-sm border border-border/70 text-[10px]",
-                            selected && "border-primary/40 bg-primary text-primary-foreground",
-                            classNames?.optionIndicator
-                          ),
-                          children: selected ? "\u2713" : null
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        "span",
+        ...componentAttributes,
+        ...tooltipProps,
+        ref,
+        "data-monkeys-component": "tooltip",
+        "data-slot": "root",
+        "data-state": isOpen ? "open" : "closed",
+        "data-placement": placement,
+        "data-portal": portalState,
+        "data-disabled": disabled || void 0,
+        className: cn(theme.slots.tooltipRoot, classNames?.root, className),
+        style,
+        children: /* @__PURE__ */ jsx(
+          Tooltip.Provider,
+          {
+            delayDuration: 0,
+            skipDelayDuration: 0,
+            disableHoverableContent: true,
+            children: /* @__PURE__ */ jsxs(
+              Tooltip.Root,
+              {
+                open: isOpen,
+                onOpenChange: handleOpenChange,
+                delayDuration: 0,
+                disableHoverableContent: true,
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      ...componentAttributes,
+                      "data-monkeys-component": "tooltip",
+                      "data-slot": "trigger-wrapper",
+                      "data-state": isOpen ? "open" : "closed",
+                      "data-placement": placement,
+                      "data-portal": portalState,
+                      "data-disabled": disabled || void 0,
+                      className: cn(theme.slots.tooltipTrigger, classNames?.trigger),
+                      children: /* @__PURE__ */ jsx(
+                        Tooltip.Trigger,
                         {
-                          className: cn(
-                            "min-w-0 flex-1 truncate",
-                            classNames?.optionLabel
-                          ),
-                          children: option.label
+                          asChild: true,
+                          ...componentAttributes,
+                          "data-monkeys-component": "tooltip",
+                          "data-slot": "trigger",
+                          "data-placement": placement,
+                          "data-portal": portalState,
+                          "data-disabled": disabled || void 0,
+                          children: trigger
                         }
                       )
-                    ]
-                  },
-                  option.value
-                );
-              }) : /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: cn(
-                    "px-2.5 py-2 text-sm text-muted-foreground",
-                    classNames?.empty
+                    }
                   ),
-                  children: emptyLabel
-                }
-              )
-            }
-          ) : null
-        ]
-      }
-    );
-  }
-);
-function findOption(options, value) {
-  if (value === void 0) return void 0;
-  return options.find((option) => option.value === value);
-}
-function getInitialValue(options, defaultValue) {
-  if (typeof defaultValue === "string") {
-    return defaultValue;
-  }
-  return "";
-}
-function getNextEnabledIndex2(options, currentIndex, direction) {
-  if (!options.length) return -1;
-  for (let offset = 1; offset <= options.length; offset += 1) {
-    const nextIndex = (currentIndex + offset * direction + options.length) % options.length;
-    if (!options[nextIndex]?.disabled) {
-      return nextIndex;
-    }
-  }
-  return -1;
-}
-forwardRef(
-  function BaseSelect2({
-    options,
-    placeholder,
-    icon,
-    invalid = false,
-    disabled = false,
-    openForPreview = false,
-    appearance,
-    className,
-    classNames,
-    style,
-    children,
-    value,
-    defaultValue,
-    onChange,
-    name,
-    id,
-    required,
-    "aria-invalid": nativeAriaInvalid,
-    "aria-label": nativeAriaLabel,
-    "aria-labelledby": nativeAriaLabelledBy,
-    ...selectProps
-  }, ref) {
-    const theme = resolveBaseAppearance(appearance);
-    const generatedId = useId();
-    const selectId = id ?? generatedId;
-    const listboxId = `${selectId}-listbox`;
-    const rootRef = useRef(null);
-    const selectRef = useRef(null);
-    const optionList = options ?? [];
-    const isCustomSelect = optionList.length > 0;
-    const forceOpen = openForPreview;
-    const [uncontrolledOpen, setUncontrolledOpen] = useState(false);
-    const open = forceOpen || uncontrolledOpen;
-    const [uncontrolledValue, setUncontrolledValue] = useState(
-      () => getInitialValue(optionList, defaultValue)
-    );
-    const isControlled = value !== void 0;
-    const selectedValue = String(isControlled ? value : uncontrolledValue);
-    const selectedOption = findOption(optionList, selectedValue);
-    const activeIndex = useMemo(() => {
-      const selectedIndex = optionList.findIndex(
-        (option) => option.value === selectedValue && !option.disabled
-      );
-      if (selectedIndex >= 0) return selectedIndex;
-      return optionList.findIndex((option) => !option.disabled);
-    }, [optionList, selectedValue]);
-    const visibleLabel = selectedOption?.label ?? placeholder;
-    const isPlaceholder = !selectedOption;
-    const setSelectRef = (node) => {
-      selectRef.current = node;
-      if (typeof ref === "function") {
-        ref(node);
-      } else if (ref) {
-        ref.current = node;
-      }
-    };
-    useEffect(() => {
-      if (!open || forceOpen) return void 0;
-      const handlePointerDown = (event) => {
-        if (!rootRef.current?.contains(event.target)) {
-          setUncontrolledOpen(false);
-        }
-      };
-      document.addEventListener("pointerdown", handlePointerDown);
-      return () => {
-        document.removeEventListener("pointerdown", handlePointerDown);
-      };
-    }, [forceOpen, open]);
-    const notifyChange = (nextValue) => {
-      const selectElement = selectRef.current;
-      if (!selectElement) return;
-      const valueSetter = Object.getOwnPropertyDescriptor(
-        HTMLSelectElement.prototype,
-        "value"
-      )?.set;
-      valueSetter?.call(selectElement, nextValue);
-      selectElement.dispatchEvent(new Event("change", { bubbles: true }));
-    };
-    const commitValue = (nextValue, optionDisabled) => {
-      if (optionDisabled || disabled) return;
-      if (!isControlled) {
-        setUncontrolledValue(nextValue);
-      }
-      notifyChange(nextValue);
-      if (!forceOpen) {
-        setUncontrolledOpen(false);
-      }
-    };
-    const focusOption = (direction) => {
-      const currentIndex = activeIndex >= 0 ? activeIndex : 0;
-      const nextIndex = getNextEnabledIndex2(optionList, currentIndex, direction);
-      if (nextIndex >= 0) {
-        commitValue(optionList[nextIndex].value, optionList[nextIndex].disabled);
-      }
-    };
-    const handleKeyDown = (event) => {
-      if (disabled) return;
-      if (event.key === "ArrowDown" || event.key === "ArrowUp") {
-        event.preventDefault();
-        if (!open) {
-          setUncontrolledOpen(true);
-          return;
-        }
-        focusOption(event.key === "ArrowDown" ? 1 : -1);
-        return;
-      }
-      if (event.key === "Enter" || event.key === " ") {
-        event.preventDefault();
-        if (!forceOpen) {
-          setUncontrolledOpen((current) => !current);
-        }
-        return;
-      }
-      if (event.key === "Escape") {
-        setUncontrolledOpen(false);
-      }
-    };
-    if (!isCustomSelect) {
-      return /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: cn(
-            theme.slots.controlWrapper,
-            invalid && theme.slots.controlInvalid,
-            disabled && theme.slots.controlDisabled,
-            classNames?.root,
-            className
-          ),
-          style: {
-            ...theme.styles.control,
-            ...invalid ? theme.styles.controlInvalid : void 0,
-            ...disabled ? theme.styles.controlDisabled : void 0,
-            ...style
-          },
-          children: [
-            hasRenderableNode(icon) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.controlIcon, classNames?.icon), children: icon }) : null,
-            /* @__PURE__ */ jsxs(
-              "select",
-              {
-                ...selectProps,
-                id,
-                ref,
-                name,
-                value,
-                defaultValue,
-                required,
-                disabled,
-                "aria-invalid": nativeAriaInvalid ?? (invalid || void 0),
-                "aria-label": nativeAriaLabel,
-                "aria-labelledby": nativeAriaLabelledBy,
-                onChange,
-                className: cn(
-                  theme.slots.controlBase,
-                  theme.slots.controlSelect,
-                  classNames?.control
-                ),
-                children: [
-                  hasRenderableNode(placeholder) ? /* @__PURE__ */ jsx("option", { value: "", disabled: true, children: placeholder }) : null,
-                  children
+                  portal && overlayPortal.shouldPortal ? /* @__PURE__ */ jsx(Tooltip.Portal, { ...overlayPortal.radixPortalProps, children: tooltipContent }) : tooltipContent
                 ]
               }
-            ),
-            /* @__PURE__ */ jsx("span", { className: theme.slots.selectChevron })
-          ]
-        }
-      );
-    }
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ref: rootRef,
-        className: cn(
-          theme.slots.controlWrapper,
-          "overflow-visible",
-          open && "z-50",
-          invalid && theme.slots.controlInvalid,
-          disabled && theme.slots.controlDisabled,
-          classNames?.root,
-          className
-        ),
-        style: {
-          ...theme.styles.control,
-          ...invalid ? theme.styles.controlInvalid : void 0,
-          ...disabled ? theme.styles.controlDisabled : void 0,
-          ...style
-        },
-        children: [
-          hasRenderableNode(icon) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.controlIcon, classNames?.icon), children: icon }) : null,
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              id: `${selectId}-button`,
-              disabled,
-              "aria-haspopup": "listbox",
-              "aria-expanded": open,
-              "aria-controls": listboxId,
-              "aria-invalid": nativeAriaInvalid ?? (invalid || void 0),
-              "aria-label": nativeAriaLabel,
-              "aria-labelledby": nativeAriaLabelledBy,
-              className: cn(
-                theme.slots.controlBase,
-                theme.slots.controlSelect,
-                "flex items-center text-left",
-                classNames?.control
-              ),
-              onClick: () => {
-                if (!forceOpen) {
-                  setUncontrolledOpen((current) => !current);
-                }
-              },
-              onKeyDown: handleKeyDown,
-              children: /* @__PURE__ */ jsx(
-                "span",
-                {
-                  className: cn(
-                    "min-w-0 flex-1 truncate",
-                    isPlaceholder && theme.slots.selectPlaceholder,
-                    isPlaceholder && classNames?.placeholder
-                  ),
-                  children: visibleLabel
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "span",
-            {
-              className: cn(
-                theme.slots.selectChevron,
-                open && "rotate-[225deg]"
-              )
-            }
-          ),
-          /* @__PURE__ */ jsxs(
-            "select",
-            {
-              ...selectProps,
-              ref: setSelectRef,
-              id,
-              name,
-              value: selectedValue,
-              required,
-              disabled,
-              "aria-hidden": "true",
-              tabIndex: -1,
-              className: theme.slots.selectNative,
-              onChange,
-              children: [
-                hasRenderableNode(placeholder) ? /* @__PURE__ */ jsx("option", { value: "", disabled: true, children: placeholder }) : null,
-                optionList.map((option) => /* @__PURE__ */ jsx(
-                  "option",
-                  {
-                    value: option.value,
-                    disabled: option.disabled,
-                    children: typeof option.label === "string" ? option.label : option.value
-                  },
-                  option.value
-                ))
-              ]
-            }
-          ),
-          open ? /* @__PURE__ */ jsx(
-            "div",
-            {
-              id: listboxId,
-              role: "listbox",
-              "aria-labelledby": `${selectId}-button`,
-              className: cn(theme.slots.selectMenu, classNames?.menu),
-              style: theme.styles.selectMenu,
-              children: optionList.map((option, index) => {
-                const selected = option.value === selectedValue;
-                const active = index === activeIndex;
-                return /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    type: "button",
-                    role: "option",
-                    "aria-selected": selected,
-                    disabled: option.disabled,
-                    className: cn(
-                      theme.slots.selectOption,
-                      active && theme.slots.selectOptionActive,
-                      selected && theme.slots.selectOptionSelected,
-                      option.disabled && theme.slots.selectOptionDisabled,
-                      classNames?.option
-                    ),
-                    style: {
-                      ...theme.styles.selectOption,
-                      ...active ? theme.styles.selectOptionActive : void 0,
-                      ...selected ? theme.styles.selectOptionSelected : void 0
-                    },
-                    onMouseDown: (event) => event.preventDefault(),
-                    onClick: () => commitValue(option.value, option.disabled),
-                    children: /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: option.label })
-                  },
-                  option.value
-                );
-              })
-            }
-          ) : null
-        ]
-      }
-    );
-  }
-);
-forwardRef(
-  function BaseSwitch2({
-    label,
-    description,
-    disabled = false,
-    appearance,
-    className,
-    classNames,
-    style,
-    checked,
-    defaultChecked,
-    onChange,
-    ...switchProps
-  }, ref) {
-    const theme = resolveBaseAppearance(appearance);
-    const [uncontrolledChecked, setUncontrolledChecked] = useState(
-      defaultChecked ?? false
-    );
-    const isControlled = checked !== void 0;
-    const resolvedChecked = isControlled ? checked : uncontrolledChecked;
-    const handleChange = (event) => {
-      if (!isControlled) {
-        setUncontrolledChecked(event.currentTarget.checked);
-      }
-      onChange?.(event);
-    };
-    return /* @__PURE__ */ jsxs(
-      "label",
-      {
-        className: cn(
-          theme.slots.switchRoot,
-          disabled && theme.slots.switchDisabled,
-          classNames?.root,
-          className
-        ),
-        style: {
-          ...theme.styles.switchRoot,
-          ...style
-        },
-        children: [
-          /* @__PURE__ */ jsxs(
-            "span",
-            {
-              className: cn(
-                theme.slots.switchTrack,
-                resolvedChecked && theme.slots.switchChecked,
-                classNames?.track
-              ),
-              style: theme.styles.switchTrack,
-              children: [
-                /* @__PURE__ */ jsx(
-                  "input",
-                  {
-                    ...switchProps,
-                    ref,
-                    type: "checkbox",
-                    disabled,
-                    checked,
-                    defaultChecked,
-                    onChange: handleChange,
-                    className: cn(theme.slots.switchInput, classNames?.input)
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    className: cn(
-                      theme.slots.switchThumb,
-                      resolvedChecked && "translate-x-5",
-                      classNames?.thumb
-                    ),
-                    style: theme.styles.switchThumb
-                  }
-                )
-              ]
-            }
-          ),
-          hasRenderableNode(label) || hasRenderableNode(description) ? /* @__PURE__ */ jsxs("span", { className: cn(theme.slots.switchContent, classNames?.content), children: [
-            hasRenderableNode(label) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.switchLabel, classNames?.label), children: label }) : null,
-            hasRenderableNode(description) ? /* @__PURE__ */ jsx(
-              "span",
-              {
-                className: cn(
-                  theme.slots.switchDescription,
-                  classNames?.description
-                ),
-                children: description
-              }
-            ) : null
-          ] }) : null
-        ]
-      }
-    );
-  }
-);
-var DATA_TRANSFER_COLUMN_TYPE = "application/x-monkeys-base-table-column";
-var BaseTableContext = createContext(null);
-function useBaseTableContext(appearance) {
-  const context = useContext(BaseTableContext);
-  if (context) {
-    return {
-      ...context,
-      theme: appearance ? resolveBaseAppearance(appearance) : context.theme,
-      appearance: appearance ?? context.appearance
-    };
-  }
-  const theme = resolveBaseAppearance(appearance);
-  return {
-    appearance,
-    theme,
-    layout: "native",
-    setDraggingColumnId: () => {
-    }
-  };
-}
-function toCssSize(value) {
-  if (value === void 0) return void 0;
-  return typeof value === "number" ? `${value}px` : value;
-}
-function clampWidth(value, minWidth, maxWidth) {
-  const min = minWidth ?? 48;
-  const max = maxWidth ?? Number.POSITIVE_INFINITY;
-  return Math.min(Math.max(value, min), max);
-}
-function getNextColumnOrder(order, columnId, targetColumnId) {
-  if (!order || columnId === targetColumnId) return void 0;
-  const fromIndex = order.indexOf(columnId);
-  const toIndex = order.indexOf(targetColumnId);
-  if (fromIndex < 0 || toIndex < 0) return void 0;
-  const next = [...order];
-  const [moved] = next.splice(fromIndex, 1);
-  next.splice(toIndex, 0, moved);
-  return next;
-}
-function sortAriaValue(direction) {
-  switch (direction) {
-    case "asc":
-      return "ascending";
-    case "desc":
-      return "descending";
-    default:
-      return void 0;
-  }
-}
-function getSplitHeadJustifyContent(align) {
-  switch (align) {
-    case "center":
-      return "center";
-    case "right":
-      return "flex-end";
-    default:
-      return "flex-start";
-  }
-}
-function getSplitHeadAlignItems(verticalAlign) {
-  switch (verticalAlign) {
-    case "top":
-      return "flex-start";
-    case "bottom":
-      return "flex-end";
-    default:
-      return "center";
-  }
-}
-function SortIndicator({
-  direction,
-  className
-}) {
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      "aria-hidden": "true",
-      className: cn(
-        className,
-        direction === "desc" && "rotate-180",
-        (!direction || direction === "none") && "opacity-45"
-      ),
-      children: "\u25B2"
-    }
-  );
-}
-function DragHandleIcon() {
-  return /* @__PURE__ */ jsxs("span", { "aria-hidden": "true", className: "grid gap-0.5", children: [
-    /* @__PURE__ */ jsx("span", { className: "h-0.5 w-0.5 rounded-full bg-current" }),
-    /* @__PURE__ */ jsx("span", { className: "h-0.5 w-0.5 rounded-full bg-current" }),
-    /* @__PURE__ */ jsx("span", { className: "h-0.5 w-0.5 rounded-full bg-current" })
-  ] });
-}
-forwardRef(function BaseTableHead2({
-  columnId,
-  align,
-  verticalAlign,
-  icon,
-  label,
-  description,
-  meta,
-  actions,
-  trailing,
-  sortable,
-  sortDirection = "none",
-  sortLabel,
-  onSort,
-  draggable,
-  dragLabel,
-  resizable,
-  resizeLabel,
-  width,
-  minWidth,
-  maxWidth,
-  appearance,
-  className,
-  classNames,
-  style,
-  children,
-  onDragOver,
-  onDrop,
-  ...headProps
-}, forwardedRef) {
-  const tableContext = useBaseTableContext(appearance);
-  const { theme } = tableContext;
-  const isSplitScroll = tableContext.layout === "split-scroll";
-  const resolvedAlign = align ?? (isSplitScroll ? "center" : "left");
-  const resolvedVerticalAlign = verticalAlign ?? "middle";
-  const headRef = useRef(null);
-  const setHeadRef = (node) => {
-    headRef.current = node;
-    if (typeof forwardedRef === "function") {
-      forwardedRef(node);
-    } else if (forwardedRef) {
-      forwardedRef.current = node;
-    }
-  };
-  const controlledWidth = columnId && tableContext.columnSizes?.[columnId] !== void 0 ? tableContext.columnSizes[columnId] : width;
-  const canDrag = Boolean(
-    columnId && draggable !== false && (draggable || tableContext.columnDragEnabled) && tableContext.columnOrder && tableContext.onColumnOrderChange
-  );
-  const canResize = Boolean(
-    columnId && resizable !== false && (resizable || tableContext.columnResizeEnabled) && tableContext.onColumnSizeChange
-  );
-  const interactiveSort = Boolean(sortable || onSort);
-  const ariaSort = sortAriaValue(sortDirection);
-  const content = hasRenderableNode(label) ? label : children;
-  const usesRichHeader = canDrag || hasRenderableNode(icon) || hasRenderableNode(label) || hasRenderableNode(description) || hasRenderableNode(meta) || hasRenderableNode(actions) || hasRenderableNode(trailing) || interactiveSort;
-  const renderedContent = usesRichHeader ? /* @__PURE__ */ jsxs("div", { className: cn(theme.slots.tableHeadContent, classNames?.content), children: [
-    /* @__PURE__ */ jsxs("div", { className: cn(theme.slots.tableHeadMain, classNames?.main), children: [
-      canDrag ? /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          draggable: true,
-          title: dragLabel,
-          "aria-label": dragLabel ?? `Drag column ${columnId}`,
-          className: cn(theme.slots.tableHeadDragHandle, classNames?.dragHandle),
-          onClick: (event) => event.stopPropagation(),
-          onDragStart: (event) => {
-            event.stopPropagation();
-            tableContext.setDraggingColumnId(columnId);
-            event.dataTransfer.effectAllowed = "move";
-            event.dataTransfer.setData(DATA_TRANSFER_COLUMN_TYPE, columnId);
-          },
-          onDragEnd: (event) => {
-            event.stopPropagation();
-            tableContext.setDraggingColumnId(void 0);
-          },
-          children: /* @__PURE__ */ jsx(DragHandleIcon, {})
-        }
-      ) : null,
-      icon ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.tableHeadIcon, classNames?.icon), children: icon }) : null,
-      interactiveSort ? /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          disabled: !onSort,
-          title: sortLabel,
-          className: cn(theme.slots.tableHeadSortButton, classNames?.sortButton),
-          onClick: (event) => {
-            event.stopPropagation();
-            onSort?.(columnId);
-          },
-          children: [
-            /* @__PURE__ */ jsxs("span", { className: cn(theme.slots.tableHeadText, classNames?.text), children: [
-              hasRenderableNode(content) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.tableHeadLabel, classNames?.label), children: content }) : null,
-              hasRenderableNode(description) ? /* @__PURE__ */ jsx(
-                "span",
-                {
-                  className: cn(
-                    theme.slots.tableHeadDescription,
-                    classNames?.description
-                  ),
-                  children: description
-                }
-              ) : null
-            ] }),
-            /* @__PURE__ */ jsx(
-              SortIndicator,
-              {
-                direction: sortDirection,
-                className: cn(theme.slots.tableHeadSortIcon, classNames?.sortIcon)
-              }
             )
-          ]
-        }
-      ) : /* @__PURE__ */ jsxs("span", { className: cn(theme.slots.tableHeadText, classNames?.text), children: [
-        hasRenderableNode(content) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.tableHeadLabel, classNames?.label), children: content }) : null,
-        hasRenderableNode(description) ? /* @__PURE__ */ jsx(
-          "span",
-          {
-            className: cn(
-              theme.slots.tableHeadDescription,
-              classNames?.description
-            ),
-            children: description
           }
-        ) : null
-      ] })
-    ] }),
-    hasRenderableNode(meta) || hasRenderableNode(actions) || hasRenderableNode(trailing) ? /* @__PURE__ */ jsxs("div", { className: cn(theme.slots.tableHeadActions, classNames?.actions), children: [
-      hasRenderableNode(meta) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.tableHeadMeta, classNames?.meta), children: meta }) : null,
-      actions,
-      trailing
-    ] }) : null
-  ] }) : children;
-  const handleDragOver = (event) => {
-    onDragOver?.(event);
-    if (!canDrag || !tableContext.draggingColumnId || tableContext.draggingColumnId === columnId) {
-      return;
-    }
-    event.preventDefault();
-    event.dataTransfer.dropEffect = "move";
-  };
-  const handleDrop = (event) => {
-    onDrop?.(event);
-    if (!canDrag || !columnId) return;
-    const sourceColumnId = tableContext.draggingColumnId || event.dataTransfer.getData(DATA_TRANSFER_COLUMN_TYPE);
-    if (!sourceColumnId || sourceColumnId === columnId) return;
-    const nextOrder = getNextColumnOrder(
-      tableContext.columnOrder,
-      sourceColumnId,
-      columnId
-    );
-    if (nextOrder) {
-      event.preventDefault();
-      tableContext.onColumnOrderChange?.(nextOrder, {
-        columnId: sourceColumnId,
-        targetColumnId: columnId
-      });
-    }
-    tableContext.setDraggingColumnId(void 0);
-  };
-  const handleResizePointerDown = (event) => {
-    if (!canResize || !columnId || !tableContext.onColumnSizeChange) return;
-    event.preventDefault();
-    event.stopPropagation();
-    const startX = event.clientX;
-    const currentWidth = typeof controlledWidth === "number" ? controlledWidth : headRef.current?.offsetWidth ?? minWidth ?? 96;
-    const previousWidth = clampWidth(currentWidth, minWidth, maxWidth);
-    const pointerId = event.pointerId;
-    const target = event.currentTarget;
-    target.setPointerCapture?.(pointerId);
-    const handlePointerMove = (moveEvent) => {
-      const nextWidth = clampWidth(
-        previousWidth + moveEvent.clientX - startX,
-        minWidth,
-        maxWidth
-      );
-      tableContext.onColumnSizeChange?.(columnId, nextWidth, {
-        columnId,
-        previousWidth,
-        minWidth,
-        maxWidth
-      });
-    };
-    const cleanup = () => {
-      target.releasePointerCapture?.(pointerId);
-      window.removeEventListener("pointermove", handlePointerMove);
-      window.removeEventListener("pointerup", cleanup);
-      window.removeEventListener("pointercancel", cleanup);
-    };
-    window.addEventListener("pointermove", handlePointerMove);
-    window.addEventListener("pointerup", cleanup);
-    window.addEventListener("pointercancel", cleanup);
-  };
-  return /* @__PURE__ */ jsxs(
-    "th",
-    {
-      ...headProps,
-      ref: setHeadRef,
-      scope: headProps.scope ?? "col",
-      "aria-sort": ariaSort,
-      className: cn(
-        theme.slots.tableHead,
-        isSplitScroll && theme.slots.tableSplitHead,
-        resolvedAlign === "center" && theme.slots.tableCellAlignCenter,
-        resolvedAlign === "right" && theme.slots.tableCellAlignRight,
-        classNames?.root,
-        className
-      ),
-      style: {
-        ...theme.styles.tableHead,
-        ...isSplitScroll ? theme.styles.tableSplitHead : void 0,
-        width: isSplitScroll ? void 0 : toCssSize(controlledWidth),
-        minWidth: isSplitScroll ? void 0 : toCssSize(minWidth),
-        maxWidth: isSplitScroll ? void 0 : toCssSize(maxWidth),
-        ...isSplitScroll ? {
-          alignItems: getSplitHeadAlignItems(resolvedVerticalAlign),
-          justifyContent: getSplitHeadJustifyContent(resolvedAlign),
-          textAlign: resolvedAlign
-        } : verticalAlign ? { verticalAlign } : void 0,
-        ...style
-      },
-      onDragOver: handleDragOver,
-      onDrop: handleDrop,
-      children: [
-        renderedContent,
-        canResize ? /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            title: resizeLabel,
-            "aria-label": resizeLabel ?? `Resize column ${columnId}`,
-            className: cn(theme.slots.tableHeadResizeHandle, classNames?.resizeHandle),
-            onClick: (event) => event.stopPropagation(),
-            onPointerDown: handleResizePointerDown
-          }
-        ) : null
-      ]
-    }
-  );
-});
-forwardRef(
-  function BaseTextarea2({
-    invalid = false,
-    disabled = false,
-    readOnly = false,
-    appearance,
-    className,
-    classNames,
-    style,
-    "aria-invalid": nativeAriaInvalid,
-    ...textareaProps
-  }, ref) {
-    const theme = resolveBaseAppearance(appearance);
-    return /* @__PURE__ */ jsx(
-      "textarea",
-      {
-        ...textareaProps,
-        ref,
-        disabled,
-        readOnly,
-        "aria-invalid": nativeAriaInvalid ?? (invalid || void 0),
-        className: cn(
-          theme.slots.controlWrapper,
-          theme.slots.controlBase,
-          theme.slots.controlTextarea,
-          invalid && theme.slots.controlInvalid,
-          disabled && theme.slots.controlDisabled,
-          readOnly && theme.slots.controlReadOnly,
-          classNames?.control,
-          className
-        ),
-        style: {
-          ...theme.styles.control,
-          ...invalid ? theme.styles.controlInvalid : void 0,
-          ...disabled ? theme.styles.controlDisabled : void 0,
-          ...style
-        }
+        )
       }
     );
   }
 );
-function getTooltipPlacementClassName(placement) {
-  switch (placement) {
-    case "bottom":
-      return "left-1/2 top-[calc(100%+0.5rem)] -translate-x-1/2";
-    case "left":
-      return "right-[calc(100%+0.5rem)] top-1/2 -translate-y-1/2";
-    case "right":
-      return "left-[calc(100%+0.5rem)] top-1/2 -translate-y-1/2";
-    case "top":
-    default:
-      return "bottom-[calc(100%+0.5rem)] left-1/2 -translate-x-1/2";
-  }
-}
-function getPortalTooltipStyle(placement, rect, themeStyle) {
-  if (!rect) return themeStyle;
-  const offset = 8;
-  const baseStyle = {
-    ...themeStyle,
-    position: "fixed"
-  };
-  switch (placement) {
-    case "bottom":
-      return {
-        ...baseStyle,
-        left: rect.left + rect.width / 2,
-        top: rect.bottom + offset,
-        transform: "translateX(-50%)"
-      };
-    case "left":
-      return {
-        ...baseStyle,
-        right: window.innerWidth - rect.left + offset,
-        top: rect.top + rect.height / 2,
-        transform: "translateY(-50%)"
-      };
-    case "right":
-      return {
-        ...baseStyle,
-        left: rect.right + offset,
-        top: rect.top + rect.height / 2,
-        transform: "translateY(-50%)"
-      };
-    case "top":
-    default:
-      return {
-        ...baseStyle,
-        bottom: window.innerHeight - rect.top + offset,
-        left: rect.left + rect.width / 2,
-        transform: "translateX(-50%)"
-      };
-  }
-}
-function BaseTooltip({
-  content,
-  children,
-  open,
-  defaultOpen = false,
-  placement = "top",
-  disabled = false,
-  portal = false,
-  appearance,
-  className,
-  classNames,
-  style,
-  onOpenChange,
-  ...tooltipProps
-}) {
-  const theme = resolveBaseAppearance(appearance);
-  const rootRef = useRef(null);
-  const [triggerRect, setTriggerRect] = useState(null);
-  const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);
-  const isControlled = open !== void 0;
-  const isOpen = isControlled ? open : uncontrolledOpen;
-  const canShow = !disabled && hasRenderableNode(content);
-  const shouldPortal = portal && typeof document !== "undefined";
-  const tooltipStyle = useMemo(
-    () => shouldPortal ? getPortalTooltipStyle(placement, triggerRect, theme.styles.tooltip) : theme.styles.tooltip,
-    [placement, shouldPortal, theme.styles.tooltip, triggerRect]
-  );
-  const setOpen = (nextOpen) => {
-    if (!canShow && nextOpen) return;
-    if (shouldPortal) {
-      setTriggerRect(nextOpen ? rootRef.current?.getBoundingClientRect() ?? null : null);
-    }
-    if (!isControlled) {
-      setUncontrolledOpen(nextOpen);
-    }
-    onOpenChange?.(nextOpen);
-  };
-  useLayoutEffect(() => {
-    if (!shouldPortal || !canShow || !isOpen) return;
-    const updateTriggerRect = () => {
-      setTriggerRect(rootRef.current?.getBoundingClientRect() ?? null);
-    };
-    updateTriggerRect();
-    window.addEventListener("resize", updateTriggerRect);
-    window.addEventListener("scroll", updateTriggerRect, true);
-    return () => {
-      window.removeEventListener("resize", updateTriggerRect);
-      window.removeEventListener("scroll", updateTriggerRect, true);
-    };
-  }, [canShow, isOpen, shouldPortal]);
-  const tooltipContent = canShow && isOpen && (!shouldPortal || triggerRect) ? /* @__PURE__ */ jsx(
-    "span",
-    {
-      role: "tooltip",
-      className: cn(
-        theme.slots.tooltipContent,
-        shouldPortal ? void 0 : getTooltipPlacementClassName(placement),
-        classNames?.content
-      ),
-      style: tooltipStyle,
-      children: content
-    }
-  ) : null;
-  return /* @__PURE__ */ jsxs(
-    "span",
-    {
-      ...tooltipProps,
-      ref: rootRef,
-      className: cn(theme.slots.tooltipRoot, classNames?.root, className),
-      style,
-      onMouseEnter: () => setOpen(true),
-      onMouseLeave: () => setOpen(false),
-      onFocus: () => setOpen(true),
-      onBlur: () => setOpen(false),
-      children: [
-        /* @__PURE__ */ jsx("span", { className: cn(theme.slots.tooltipTrigger, classNames?.trigger), children }),
-        shouldPortal && tooltipContent ? createPortal(tooltipContent, document.body) : tooltipContent
-      ]
-    }
-  );
-}
 var defaultAppearance = {
   preset: "admin",
   density: "compact",
@@ -3409,7 +2574,7 @@ function AppHeader({
             ]
           }
         ),
-        tabs && tabs.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        tabs && tabs.length > 0 && /* @__PURE__ */ jsxs(Fragment$1, { children: [
           /* @__PURE__ */ jsx("div", { className: "h-1/2 w-px bg-[hsl(var(--border))]" }),
           /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center", children: /* @__PURE__ */ jsx("div", { className: "inline-flex h-9 items-center gap-1 rounded-md bg-transparent p-1", children: tabs.map((tab) => /* @__PURE__ */ jsx(
             "button",
@@ -4319,7 +3484,7 @@ function NavigationLayout({
     {
       activeItemId,
       activeRootId: activeRootId ?? findNavigationRootId(navItems, activeItemId),
-      actions: allowModeSwitch ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      actions: allowModeSwitch ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
         headbarActions,
         /* @__PURE__ */ jsx(
           BaseButton,