@expcat/tigercat-react 2.1.2 → 2.1.3

package/dist/{chunk-YH7FKFRM.mjs → chunk-WW6MFKTJ.mjs}

@@ -1,34 +1,52 @@
 import {
   Table
-} from "./chunk-2XZHYYZ2.mjs";
+} from "./chunk-GMHJWSQB.mjs";
 import {
   Select
-} from "./chunk-S2V3HGLZ.mjs";
+} from "./chunk-M7TSPEXC.mjs";
 import {
   Popover
-} from "./chunk-FNK2VWPP.mjs";
+} from "./chunk-N53N6H54.mjs";
 import {
   Input
-} from "./chunk-3LDDXHW2.mjs";
+} from "./chunk-XE34TOCS.mjs";
+import {
+  Icon
+} from "./chunk-WPRXOO6N.mjs";
 import {
   Checkbox
-} from "./chunk-EPWAROC2.mjs";
+} from "./chunk-HAG7TGPS.mjs";
 import {
   Button
-} from "./chunk-5TE7KLE5.mjs";
+} from "./chunk-WFLXJOFU.mjs";
+import {
+  useControlledState
+} from "./chunk-UJTAHHQT.mjs";
 import {
   useTigerConfig
-} from "./chunk-YSIXURBW.mjs";
+} from "./chunk-RUIFGSVN.mjs";
 
 // src/components/DataTableWithToolbar.tsx
 import { useEffect, useMemo, useRef, useState } from "react";
 import {
+  applyToolbarLocalView,
+  canSubmitToolbarSearch,
   classNames,
+  getDataTableToolbarBarClasses,
+  getDataTableToolbarWrapperClasses,
   getImmediateTigerLocale,
   getTableLabels,
   isLazyTigerLocale,
+  isToolbarSearchRemote,
   mergeTigerLocale,
-  resolveTigerLocale
+  resolveTigerLocale,
+  resolveToolbarFilterMap,
+  resolveToolbarPageChange,
+  resolveToolbarSelectedKeys,
+  seedToolbarFilterState,
+  splitCompositeHostAttrs,
+  toggleHiddenColumnKey,
+  toolbarHasSearch
 } from "@expcat/tigercat-core";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var DataTableWithToolbar = ({
@@ -38,31 +56,45 @@ var DataTableWithToolbar = ({
   hiddenColumnKeys,
   defaultHiddenColumnKeys,
   onHiddenColumnKeysChange,
-  pagination = false,
+  pagination,
   onPageChange,
   onPageSizeChange,
   className,
   tableClassName,
-  ...tableProps
+  rowSelection,
+  dataSource,
+  columns,
+  onSelectionChange,
+  bordered = false,
+  id,
+  style,
+  ...rest
 }) => {
   const config = useTigerConfig();
+  const { host: hostAttrs, rest: tableRest } = splitCompositeHostAttrs({
+    id,
+    style,
+    ...rest
+  });
   const previousPageSizeRef = useRef(
     pagination && typeof pagination === "object" ? pagination.pageSize ?? pagination.defaultPageSize ?? 10 : void 0
   );
-  const [internalSearch, setInternalSearch] = useState(toolbar?.defaultSearchValue ?? "");
-  const [internalHiddenKeys, setInternalHiddenKeys] = useState(
-    defaultHiddenColumnKeys ?? hiddenColumnKeys ?? []
-  );
+  const [searchValue, setSearchValue] = useControlledState({
+    value: toolbar?.searchValue,
+    defaultValue: toolbar?.defaultSearchValue ?? "",
+    onChange: (value) => toolbar?.onSearchChange?.(value)
+  });
+  const [resolvedHiddenKeys, setResolvedHiddenKeys] = useControlledState({
+    value: hiddenColumnKeys,
+    defaultValue: defaultHiddenColumnKeys ?? [],
+    onChange: onHiddenColumnKeysChange
+  });
   const [internalFilters, setInternalFilters] = useState(
-    () => {
-      const initial = {};
-      toolbar?.filters?.forEach((filter) => {
-        if (filter.value === void 0) {
-          initial[filter.key] = filter.defaultValue ?? null;
-        }
-      });
-      return initial;
-    }
+    () => seedToolbarFilterState({}, toolbar?.filters)
+  );
+  const [extraFilterKeys, setExtraFilterKeys] = useState([]);
+  const [internalSelectedKeys, setInternalSelectedKeys] = useState(
+    () => rowSelection?.defaultSelectedRowKeys ?? []
   );
   const immediateTableLocale = useMemo(
     () => locale ? getImmediateTigerLocale(locale) : void 0,
@@ -90,109 +122,93 @@ var DataTableWithToolbar = ({
     [config.locale, resolvedTableLocale]
   );
   const tableLabels = useMemo(() => getTableLabels(tableLocale, labels), [labels, tableLocale]);
-  useEffect(() => {
-    if (toolbar?.searchValue !== void 0) {
-      setInternalSearch(toolbar.searchValue ?? "");
-    }
-  }, [toolbar?.searchValue]);
-  useEffect(() => {
-    if (hiddenColumnKeys !== void 0) {
-      setInternalHiddenKeys(hiddenColumnKeys);
-    }
-  }, [hiddenColumnKeys]);
   useEffect(() => {
     if (pagination && typeof pagination === "object") {
       previousPageSizeRef.current = pagination.pageSize ?? pagination.defaultPageSize ?? 10;
     }
   }, [pagination]);
   useEffect(() => {
-    const filters = toolbar?.filters;
-    if (!filters) return;
-    setInternalFilters((prev) => {
-      const next = { ...prev };
-      filters.forEach((filter) => {
-        if (filter.value === void 0 && !(filter.key in next)) {
-          next[filter.key] = filter.defaultValue ?? null;
-        }
-      });
-      return next;
-    });
+    setInternalFilters((prev) => seedToolbarFilterState(prev, toolbar?.filters));
   }, [toolbar?.filters]);
-  const searchValue = toolbar?.searchValue !== void 0 ? toolbar.searchValue : internalSearch;
-  const resolvedFilters = useMemo(() => {
-    const next = { ...internalFilters };
-    toolbar?.filters?.forEach((filter) => {
-      next[filter.key] = filter.value !== void 0 ? filter.value : internalFilters[filter.key] ?? filter.defaultValue ?? null;
-    });
-    return next;
-  }, [toolbar?.filters, internalFilters]);
-  const hasSearch = Boolean(
-    toolbar && (toolbar.searchPlaceholder || toolbar.searchValue !== void 0 || toolbar.defaultSearchValue !== void 0 || toolbar.showSearchButton || toolbar.onSearchChange || toolbar.onSearch)
+  const resolvedFilters = useMemo(
+    () => resolveToolbarFilterMap(toolbar?.filters, internalFilters, extraFilterKeys),
+    [toolbar?.filters, internalFilters, extraFilterKeys]
   );
+  const hasSearch = toolbarHasSearch(toolbar);
   const hasFilters = Boolean(toolbar?.filters && toolbar.filters.length > 0);
   const hasFiltersExtra = Boolean(toolbar?.filtersExtra);
   const hasBulkActions = Boolean(toolbar?.bulkActions && toolbar.bulkActions.length > 0);
   const hasColumnSettings = Boolean(toolbar?.showColumnSettings);
-  const resolvedHiddenKeys = hiddenColumnKeys ?? internalHiddenKeys;
+  const viewRows = useMemo(() => {
+    const sourceRows = dataSource ?? [];
+    return isToolbarSearchRemote(toolbar) ? sourceRows : applyToolbarLocalView(sourceRows, columns, searchValue ?? "", resolvedFilters);
+  }, [columns, dataSource, resolvedFilters, searchValue, toolbar]);
+  const selectedKeys = resolveToolbarSelectedKeys(
+    toolbar?.selectedKeys,
+    rowSelection?.selectedRowKeys,
+    internalSelectedKeys
+  );
+  const selectedCount = toolbar?.selectedCount ?? selectedKeys.length;
+  const bulkLabel = toolbar?.bulkActionsLabel ?? tableLabels.selectedText;
   const handleHiddenColumnsChange = (nextHiddenKeys) => {
-    if (hiddenColumnKeys === void 0) {
-      setInternalHiddenKeys(nextHiddenKeys);
-    }
-    onHiddenColumnKeysChange?.(nextHiddenKeys);
+    setResolvedHiddenKeys(nextHiddenKeys);
   };
   const handleToggleColumnVisibility = (columnKey, visible) => {
-    const nextHiddenKeys = visible ? resolvedHiddenKeys.filter((key) => key !== columnKey) : [...resolvedHiddenKeys, columnKey];
-    handleHiddenColumnsChange(nextHiddenKeys);
+    handleHiddenColumnsChange(toggleHiddenColumnKey(resolvedHiddenKeys, columnKey, visible));
   };
-  const { bordered = false, ...remainingTableProps } = tableProps;
-  const selectedKeys = toolbar?.selectedKeys ?? tableProps.rowSelection?.selectedRowKeys ?? [];
-  const selectedCount = toolbar?.selectedCount ?? selectedKeys.length;
-  const bulkLabel = toolbar?.bulkActionsLabel ?? tableLabels.selectedText;
-  const wrapperClasses = useMemo(
-    () => classNames(
-      "tiger-data-table-with-toolbar flex flex-col",
-      bordered ? "border border-[var(--tiger-border,#e5e7eb)] rounded-[var(--tiger-radius-md,0.5rem)] overflow-hidden bg-[var(--tiger-surface,#ffffff)] shadow-sm" : "gap-3.5",
-      className
-    ),
-    [className, bordered]
-  );
   const handleSearchChange = (value) => {
-    if (toolbar?.searchValue === void 0) {
-      setInternalSearch(value);
-    }
-    toolbar?.onSearchChange?.(value);
+    setSearchValue(value);
   };
   const handleSearchSubmit = () => {
     toolbar?.onSearch?.(searchValue ?? "");
   };
   const setFilterValue = (key, value, filter) => {
-    const nextFilters = {
-      ...resolvedFilters,
-      [key]: value
-    };
+    const inDefs = toolbar?.filters?.some((item) => item.key === key);
+    if (!inDefs) {
+      setExtraFilterKeys((prev) => prev.includes(key) ? prev : [...prev, key]);
+    }
     if (!filter || filter.value === void 0) {
       setInternalFilters((prev) => ({
         ...prev,
         [key]: value
       }));
     }
-    toolbar?.onFiltersChange?.(nextFilters);
+    toolbar?.onFiltersChange?.(
+      resolveToolbarFilterMap(
+        toolbar?.filters,
+        { ...internalFilters, [key]: value },
+        inDefs ? extraFilterKeys : extraFilterKeys.includes(key) ? extraFilterKeys : [...extraFilterKeys, key]
+      )
+    );
   };
-  const handleFilterSelect = (filter, value) => {
-    setFilterValue(filter.key, value, filter);
+  const handleSelectionChange = (keys) => {
+    if (toolbar?.selectedKeys === void 0 && rowSelection?.selectedRowKeys === void 0) {
+      setInternalSelectedKeys(keys);
+    }
+    onSelectionChange?.(keys);
   };
   const handleBulkAction = (action) => {
-    const keys = selectedKeys ?? [];
-    action.onClick?.(keys);
-    toolbar?.onBulkAction?.(action, keys);
+    action.onClick?.(selectedKeys);
+    toolbar?.onBulkAction?.(action, selectedKeys);
   };
-  const handleTablePageChange = ({ current, pageSize }) => {
-    onPageChange?.(current, pageSize);
-    if (previousPageSizeRef.current !== void 0 && previousPageSizeRef.current !== pageSize) {
-      onPageSizeChange?.(current, pageSize);
-    }
-    previousPageSizeRef.current = pageSize;
+  const handleTablePageChange = (page) => {
+    const result = resolveToolbarPageChange(page, previousPageSizeRef.current);
+    previousPageSizeRef.current = page.pageSize;
+    if (result.kind === "size") onPageSizeChange?.(page);
+    else onPageChange?.(page);
   };
+  const toolbarContext = () => ({
+    searchValue: searchValue ?? "",
+    setSearch: handleSearchChange,
+    submitSearch: handleSearchSubmit,
+    filters: resolvedFilters,
+    setFilter: (key, value) => setFilterValue(key, value),
+    selectedKeys,
+    selectedCount,
+    dataSource: viewRows,
+    hiddenColumnKeys: resolvedHiddenKeys,
+    setHiddenColumnKeys: handleHiddenColumnsChange
+  });
   const renderColumnSettings = () => {
     const lockedKeys = new Set(toolbar?.columnSettings?.lockedColumnKeys ?? []);
     const panelTitle = toolbar?.columnSettings?.title ?? tableLabels.columnSettingsText;
@@ -202,7 +218,7 @@ var DataTableWithToolbar = ({
         trigger: "click",
         placement: "bottom-end",
         titleContent: panelTitle,
-        contentContent: /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2 min-w-[160px]", children: tableProps.columns.map((column) => {
+        contentContent: /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2 min-w-[160px]", children: columns.map((column) => {
           const locked = lockedKeys.has(column.key) || column.hideable === false;
           return /* @__PURE__ */ jsx(
             Checkbox,
@@ -223,35 +239,7 @@ var DataTableWithToolbar = ({
             variant: "outline",
             className: "shrink-0 px-2",
             "aria-label": tableLabels.columnSettingsAriaLabel,
-            children: /* @__PURE__ */ jsxs(
-              "svg",
-              {
-                className: "w-3.5 h-3.5",
-                fill: "none",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                viewBox: "0 0 24 24",
-                "aria-hidden": "true",
-                children: [
-                  /* @__PURE__ */ jsx(
-                    "path",
-                    {
-                      strokeLinecap: "round",
-                      strokeLinejoin: "round",
-                      d: "M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    "path",
-                    {
-                      strokeLinecap: "round",
-                      strokeLinejoin: "round",
-                      d: "M15 12a3 3 0 11-6 0 3 3 0 016 0z"
-                    }
-                  )
-                ]
-              }
-            )
+            children: /* @__PURE__ */ jsx(Icon, { name: "settings", className: "w-3.5 h-3.5" })
           }
         )
       }
@@ -259,35 +247,26 @@ var DataTableWithToolbar = ({
   };
   const renderToolbar = () => {
     if (toolbar?.render !== void 0) {
-      const toolbarContext = {
-        searchValue: searchValue ?? "",
-        setSearch: handleSearchChange,
-        submitSearch: handleSearchSubmit,
-        filters: resolvedFilters,
-        setFilter: (key, value) => setFilterValue(key, value),
-        selectedKeys,
-        selectedCount,
-        hiddenColumnKeys: resolvedHiddenKeys,
-        setHiddenColumnKeys: handleHiddenColumnsChange
-      };
-      return /* @__PURE__ */ jsx(Fragment, { children: typeof toolbar.render === "function" ? toolbar.render(toolbarContext) : toolbar.render });
+      return /* @__PURE__ */ jsx(Fragment, { children: typeof toolbar.render === "function" ? toolbar.render(toolbarContext()) : toolbar.render });
     }
     if (!hasSearch && !hasFilters && !hasFiltersExtra && !hasBulkActions && !hasColumnSettings) {
       return null;
     }
     const filtersExtraContext = {
       filters: resolvedFilters,
-      setFilter: (key, value) => setFilterValue(key, value)
+      setFilter: (key, value) => setFilterValue(key, value),
+      dataSource: viewRows,
+      selectedKeys,
+      hiddenColumnKeys: resolvedHiddenKeys
     };
     const filtersExtra = typeof toolbar?.filtersExtra === "function" ? toolbar.filtersExtra(filtersExtraContext) : toolbar?.filtersExtra;
     return /* @__PURE__ */ jsxs(
       "div",
       {
-        className: classNames(
-          "tiger-data-table-toolbar flex flex-wrap items-center gap-3",
-          bordered ? "bg-[var(--tiger-surface-muted,#f9fafb)] dark:bg-gray-800/10 px-4 py-3.5 border-b border-[var(--tiger-border,#e5e7eb)]" : "bg-[var(--tiger-surface-muted,#f9fafb)]/80 dark:bg-gray-800/30 px-4 py-3.5 border border-[var(--tiger-border,#e5e7eb)] rounded-[var(--tiger-radius-md,0.5rem)] shadow-sm",
-          toolbar?.className
-        ),
+        className: getDataTableToolbarBarClasses({
+          bordered,
+          className: toolbar?.className
+        }),
         style: toolbar?.style,
         role: "toolbar",
         "aria-label": tableLabels.toolbarAriaLabel,
@@ -308,30 +287,17 @@ var DataTableWithToolbar = ({
                       size: "sm",
                       value: searchValue,
                       placeholder: toolbar?.searchPlaceholder ?? tableLabels.searchPlaceholder,
+                      "aria-label": toolbar?.searchPlaceholder ?? tableLabels.searchPlaceholder,
                       prefix: /* @__PURE__ */ jsx(
-                        "svg",
+                        Icon,
                         {
-                          className: "w-3.5 h-3.5 text-[var(--tiger-text-secondary,#6b7280)] shrink-0",
-                          fill: "none",
-                          stroke: "currentColor",
-                          strokeWidth: "2",
-                          viewBox: "0 0 24 24",
-                          "aria-hidden": "true",
-                          children: /* @__PURE__ */ jsx(
-                            "path",
-                            {
-                              strokeLinecap: "round",
-                              strokeLinejoin: "round",
-                              d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
-                            }
-                          )
+                          name: "search",
+                          className: "w-3.5 h-3.5 text-[var(--tiger-text-secondary,#6b7280)]"
                         }
                       ),
                       onChange: (event) => handleSearchChange(String(event.currentTarget.value)),
                       onKeyDown: (event) => {
-                        if (event.key === "Enter") {
-                          handleSearchSubmit();
-                        }
+                        if (event.key === "Enter") handleSearchSubmit();
                       }
                     }
                   ),
@@ -342,7 +308,7 @@ var DataTableWithToolbar = ({
                       variant: "primary",
                       className: "whitespace-nowrap shrink-0 rounded-[var(--tiger-radius-md,0.5rem)] px-3",
                       onClick: handleSearchSubmit,
-                      disabled: !toolbar?.onSearch,
+                      disabled: !canSubmitToolbarSearch(toolbar),
                       children: toolbar?.searchButtonText ?? tableLabels.searchButtonText
                     }
                   ) : null
@@ -384,10 +350,9 @@ var DataTableWithToolbar = ({
                       })),
                       value: typeof currentValue === "string" || typeof currentValue === "number" ? currentValue : void 0,
                       placeholder: filter.placeholder ?? filter.label,
+                      "aria-label": filter.label,
                       clearable,
-                      onChange: (value) => {
-                        handleFilterSelect(filter, value ?? null);
-                      }
+                      onChange: (value) => setFilterValue(filter.key, value ?? null, filter)
                     }
                   )
                 },
@@ -397,16 +362,23 @@ var DataTableWithToolbar = ({
             filtersExtra
           ] }),
           hasBulkActions ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5 flex-wrap ml-auto shrink-0", children: [
-            selectedCount > 0 ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 px-2.5 py-1 rounded-full bg-[var(--tiger-primary,#2563eb)]/10 text-[var(--tiger-primary,#2563eb)] text-xs font-medium border border-[var(--tiger-primary,#2563eb)]/15 shrink-0 transition-all duration-300", children: [
-              /* @__PURE__ */ jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-[var(--tiger-primary,#2563eb)] animate-pulse" }),
-              /* @__PURE__ */ jsxs("span", { children: [
-                bulkLabel,
-                " ",
-                selectedCount,
-                " ",
-                tableLabels.selectedItemsText
-              ] })
-            ] }) : null,
+            selectedCount > 0 ? /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: "flex items-center gap-1.5 px-2.5 py-1 rounded-full bg-[var(--tiger-primary,#2563eb)]/10 text-[var(--tiger-primary,#2563eb)] text-xs font-medium border border-[var(--tiger-primary,#2563eb)]/15 shrink-0",
+                "aria-live": "polite",
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-[var(--tiger-primary,#2563eb)] animate-pulse motion-reduce:animate-none" }),
+                  /* @__PURE__ */ jsxs("span", { children: [
+                    bulkLabel,
+                    " ",
+                    selectedCount,
+                    " ",
+                    tableLabels.selectedItemsText
+                  ] })
+                ]
+              }
+            ) : null,
             toolbar?.bulkActions?.map((action) => /* @__PURE__ */ jsx(
               Button,
               {
@@ -424,22 +396,34 @@ var DataTableWithToolbar = ({
       }
     );
   };
-  return /* @__PURE__ */ jsxs("div", { className: wrapperClasses, "data-tiger-data-table-with-toolbar": true, children: [
-    renderToolbar(),
-    /* @__PURE__ */ jsx(
-      Table,
-      {
-        ...remainingTableProps,
-        locale,
-        labels,
-        bordered,
-        hiddenColumnKeys: resolvedHiddenKeys,
-        pagination,
-        className: classNames(tableClassName, bordered && "border-none rounded-none shadow-none"),
-        onPageChange: handleTablePageChange
-      }
-    )
-  ] });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: getDataTableToolbarWrapperClasses({ bordered, className }),
+      "data-tiger-data-table-with-toolbar": true,
+      ...hostAttrs,
+      children: [
+        renderToolbar(),
+        /* @__PURE__ */ jsx(
+          Table,
+          {
+            ...tableRest,
+            columns,
+            dataSource: viewRows,
+            locale: resolvedTableLocale,
+            labels,
+            bordered,
+            rowSelection: rowSelection ? { ...rowSelection, selectedRowKeys: selectedKeys } : void 0,
+            hiddenColumnKeys: resolvedHiddenKeys,
+            pagination,
+            className: classNames(tableClassName, bordered && "border-none rounded-none shadow-none"),
+            onSelectionChange: handleSelectionChange,
+            onPageChange: handleTablePageChange
+          }
+        )
+      ]
+    }
+  );
 };
 var DataTableWithToolbar_default = DataTableWithToolbar;
 

package/dist/chunk-WWZZRB7H.mjs

@@ -0,0 +1,121 @@
+// src/utils/overlay-trigger.tsx
+import { cloneElement, isValidElement } from "react";
+import {
+  classNames,
+  shouldMergeOverlayTriggerChild
+} from "@expcat/tigercat-core";
+import { jsxs } from "react/jsx-runtime";
+function composeRefs(...refs) {
+  return (node) => {
+    for (const ref of refs) {
+      if (ref == null) continue;
+      if (typeof ref === "function") {
+        ref(node);
+      } else {
+        ;
+        ref.current = node;
+      }
+    }
+  };
+}
+function composeEventHandlers(theirs, ours) {
+  if (!theirs) return ours;
+  if (!ours) return theirs;
+  return (event) => {
+    theirs(event);
+    if (event.defaultPrevented) return;
+    ours(event);
+  };
+}
+function getElementRef(element) {
+  const props = element.props;
+  return props.ref ?? element.ref;
+}
+function renderOverlayTrigger(options) {
+  const {
+    asChild,
+    child,
+    triggerRef,
+    className,
+    disabled,
+    extraChildren,
+    aria,
+    handlers,
+    preventDefaultOnClick
+  } = options;
+  const mergeable = isValidElement(child) && shouldMergeOverlayTriggerChild(asChild, child.type);
+  const onClick = (event) => {
+    if (disabled) {
+      event.preventDefault();
+      event.stopPropagation();
+      return;
+    }
+    if (preventDefaultOnClick) event.preventDefault();
+    handlers.onClick?.(event);
+  };
+  if (mergeable && isValidElement(child)) {
+    const childProps = child.props;
+    const childDisabled = Boolean(childProps.disabled) || disabled;
+    return cloneElement(child, {
+      ref: composeRefs(getElementRef(child), triggerRef),
+      className: classNames(childProps.className, className),
+      disabled: childDisabled || void 0,
+      ...aria,
+      onClick: composeEventHandlers(
+        childProps.onClick,
+        onClick
+      ),
+      onKeyDown: composeEventHandlers(
+        childProps.onKeyDown,
+        handlers.onKeyDown
+      ),
+      onMouseEnter: composeEventHandlers(
+        childProps.onMouseEnter,
+        handlers.onMouseEnter
+      ),
+      onMouseLeave: composeEventHandlers(
+        childProps.onMouseLeave,
+        handlers.onMouseLeave
+      ),
+      onFocus: composeEventHandlers(
+        childProps.onFocus,
+        handlers.onFocus
+      ),
+      onBlur: composeEventHandlers(
+        childProps.onBlur,
+        handlers.onBlur
+      ),
+      onContextMenu: composeEventHandlers(
+        childProps.onContextMenu,
+        handlers.onContextMenu
+      )
+    });
+  }
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      ref: triggerRef,
+      type: "button",
+      className,
+      disabled,
+      ...aria,
+      onClick,
+      onKeyDown: handlers.onKeyDown,
+      onMouseEnter: handlers.onMouseEnter,
+      onMouseLeave: handlers.onMouseLeave,
+      onFocus: handlers.onFocus,
+      onBlur: handlers.onBlur,
+      onContextMenu: handlers.onContextMenu,
+      children: [
+        child,
+        extraChildren
+      ]
+    }
+  );
+}
+
+export {
+  composeRefs,
+  composeEventHandlers,
+  renderOverlayTrigger
+};