@dreamtree-org/twreact-ui 1.1.65 → 1.1.67

package/dist/index.esm.js

@@ -70,17 +70,17 @@ function _iterableToArrayLimit(r, l) {
   }
 }
 
-function _arrayLikeToArray$1(r, a) {
+function _arrayLikeToArray$2(r, a) {
   (null == a || a > r.length) && (a = r.length);
   for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
   return n;
 }
 
-function _unsupportedIterableToArray$1(r, a) {
+function _unsupportedIterableToArray$2(r, a) {
   if (r) {
-    if ("string" == typeof r) return _arrayLikeToArray$1(r, a);
+    if ("string" == typeof r) return _arrayLikeToArray$2(r, a);
     var t = {}.toString.call(r).slice(8, -1);
-    return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray$1(r, a) : void 0;
+    return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray$2(r, a) : void 0;
   }
 }
 
@@ -89,7 +89,7 @@ function _nonIterableRest() {
 }
 
 function _slicedToArray(r, e) {
-  return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray$1(r, e) || _nonIterableRest();
+  return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray$2(r, e) || _nonIterableRest();
 }
 
 function _objectWithoutPropertiesLoose$1(r, e) {
@@ -3141,8 +3141,8 @@ function cn$1() {
 }
 
 var _excluded$A = ["id", "className", "type", "label", "placeholder", "error", "success", "disabled", "required", "clearable", "icon", "iconPosition", "onClear", "showCount", "maxLength", "readOnly", "onChange", "value", "defaultValue"];
-function ownKeys$E(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$E(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$E(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$E(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$F(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$F(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$F(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$F(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Input = /*#__PURE__*/forwardRef(function (props, forwardedRef) {
   var _ref$current$value2, _ref$current;
   var id = props.id,
@@ -3257,7 +3257,7 @@ var Input = /*#__PURE__*/forwardRef(function (props, forwardedRef) {
           className: "text-primary-400",
           children: icon
         })
-      }), jsx("input", _objectSpread$E({
+      }), jsx("input", _objectSpread$F({
         id: inputId,
         ref: ref,
         type: inputType,
@@ -3318,8 +3318,8 @@ var Input = /*#__PURE__*/forwardRef(function (props, forwardedRef) {
 });
 
 var _excluded$z = ["className", "variant", "size", "disabled", "loading", "children", "leftIcon", "rightIcon", "fullWidth"];
-function ownKeys$D(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$D(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$D(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$D(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$E(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$E(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$E(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$E(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var className = _ref.className,
     _ref$variant = _ref.variant,
@@ -3349,7 +3349,7 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
     // Full width
     'w-full': fullWidth
   }, className);
-  return jsxs("button", _objectSpread$D(_objectSpread$D({
+  return jsxs("button", _objectSpread$E(_objectSpread$E({
     ref: ref,
     className: baseClasses,
     disabled: disabled || loading
@@ -3368,7 +3368,7 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
 Button.displayName = 'Button';
 
 function _arrayWithoutHoles$1(r) {
-  if (Array.isArray(r)) return _arrayLikeToArray$1(r);
+  if (Array.isArray(r)) return _arrayLikeToArray$2(r);
 }
 
 function _iterableToArray$1(r) {
@@ -3380,12 +3380,12 @@ function _nonIterableSpread$1() {
 }
 
 function _toConsumableArray$1(r) {
-  return _arrayWithoutHoles$1(r) || _iterableToArray$1(r) || _unsupportedIterableToArray$1(r) || _nonIterableSpread$1();
+  return _arrayWithoutHoles$1(r) || _iterableToArray$1(r) || _unsupportedIterableToArray$2(r) || _nonIterableSpread$1();
 }
 
 var _excluded$y = ["options", "value", "onChange", "placeholder", "label", "error", "disabled", "required", "multiSelect", "searchable", "grouped", "onMenuItemRender", "className", "allowClear", "creatable", "onCreateOption", "onSearch", "loading", "selectAllOption", "closeOnSelect", "maxTagCount", "renderGroupLabel", "name"];
-function ownKeys$C(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$C(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$C(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$C(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$D(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$D(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$D(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$D(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /**
  * Enhanced Select component (debounce removed)
  * - Supports single and multi select
@@ -3406,7 +3406,7 @@ var flattenGroups = function flattenGroups() {
   return groups.reduce(function (acc, g) {
     var groupLabel = g.label;
     g.options.forEach(function (opt) {
-      return acc.push(_objectSpread$C(_objectSpread$C({}, opt), {}, {
+      return acc.push(_objectSpread$D(_objectSpread$D({}, opt), {}, {
         _group: groupLabel
       }));
     });
@@ -3502,7 +3502,7 @@ var Select = /*#__PURE__*/React__default.forwardRef(function (_ref, forwardedRef
   var flatOptions = useMemo(function () {
     if (grouped) return flattenGroups(options);
     return options.map(function (opt) {
-      return _objectSpread$C({}, opt);
+      return _objectSpread$D({}, opt);
     });
   }, [options, grouped]);
   var selectedValues = multiSelect ? Array.isArray(value) ? value : [] : value;
@@ -3527,7 +3527,7 @@ var Select = /*#__PURE__*/React__default.forwardRef(function (_ref, forwardedRef
     }
     if (grouped) {
       return options.map(function (g) {
-        return _objectSpread$C(_objectSpread$C({}, g), {}, {
+        return _objectSpread$D(_objectSpread$D({}, g), {}, {
           options: g.options.filter(function (o) {
             return o.label.toLowerCase().includes(searchTerm.toLowerCase());
           })
@@ -3797,7 +3797,7 @@ var Select = /*#__PURE__*/React__default.forwardRef(function (_ref, forwardedRef
               className: "text-xs border border-slate-200 p-0.5 rounded-md cursor-pointer hover:bg-gray-100",
               onClick: function onClick() {
                 return setCollapsedGroups(function (prev) {
-                  return _objectSpread$C(_objectSpread$C({}, prev), {}, _defineProperty$4({}, group.label, !prev[group.label]));
+                  return _objectSpread$D(_objectSpread$D({}, prev), {}, _defineProperty$4({}, group.label, !prev[group.label]));
                 });
               },
               children: jsx(ChevronDown, {
@@ -3891,7 +3891,7 @@ var Select = /*#__PURE__*/React__default.forwardRef(function (_ref, forwardedRef
     }), jsxs("div", {
       ref: selectRef,
       className: "relative",
-      children: [jsxs("button", _objectSpread$C(_objectSpread$C({
+      children: [jsxs("button", _objectSpread$D(_objectSpread$D({
         type: "button",
         "aria-haspopup": "listbox",
         "aria-expanded": isOpen,
@@ -3958,7 +3958,7 @@ var Select = /*#__PURE__*/React__default.forwardRef(function (_ref, forwardedRef
         // escapes any ancestor overflow:hidden|auto|scroll. Coordinates
         // are anchored to the trigger's viewport rect; width matches the
         // trigger; maxHeight is driven by available space.
-        style: _objectSpread$C({
+        style: _objectSpread$D({
           left: menuCoords ? "".concat(menuCoords.left, "px") : undefined,
           top: menuCoords ? "".concat(menuCoords.top, "px") : undefined,
           width: menuCoords ? "".concat(menuCoords.width, "px") : undefined
@@ -4045,6 +4045,11 @@ var DEFAULT_ACTIONS = [{
   })
 }];
 
+function ownKeys$C(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$C(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$C(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$C(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _createForOfIteratorHelper$1(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray$1(r)) || e) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: true } : { done: false, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = true, u = false; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = true, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray$1(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray$1(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray$1(r, a) : void 0; } }
+function _arrayLikeToArray$1(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 /**
  * Generate a unique key for a row based on id, _id, or index
  */
@@ -4054,6 +4059,116 @@ var getRowKey = function getRowKey(row, globalIndex) {
   if (row._id !== undefined && row._id !== null) return String(row._id);
   return String(globalIndex);
 };
+/**
+ * Resolve a value that may be supplied directly or as a per-row producer.
+ * Used for an action's `label`, `icon`, `hidden` and `disabled`.
+ */
+var callIfFn = function callIfFn(value, row, index) {
+  return typeof value === "function" ? value(row, index) : value;
+};
+/**
+ * Does THIS row get an expand toggle?
+ * `hasDetails` is either a boolean (every row) or a `(row, index)` predicate.
+ */
+var rowHasDetails = function rowHasDetails(hasDetails, row, index) {
+  return typeof hasDetails === "function" ? !!hasDetails(row, index) : !!hasDetails;
+};
+/**
+ * Best-effort accessible name for an action. `label` may be an arbitrary
+ * ReactNode, so fall back to `name` and finally to a generic string.
+ */
+var getActionLabelText = function getActionLabelText(action) {
+  return typeof (action === null || action === void 0 ? void 0 : action.label) === "string" && action.label.trim() || typeof (action === null || action === void 0 ? void 0 : action.name) === "string" && action.name.trim() || "Action";
+};
+/**
+ * Patch `defaults` with `overrides`, matched by `name`.
+ *
+ * Result order is the defaults' order, then any unmatched or unnamed overrides
+ * appended. Each match is a shallow spread, so `{ name: "edit", onClick }`
+ * keeps the default's `label` and `icon`, and `{ name: "delete", hidden: true }`
+ * removes a default without needing a dedicated API.
+ *
+ * @param {Array} overrides consumer-supplied actions
+ * @param {Array} defaults  the built-in action set
+ * @returns {Array}
+ */
+var mergeDefaultActions = function mergeDefaultActions(overrides, defaults) {
+  if (!Array.isArray(overrides)) return defaults;
+  if (!Array.isArray(defaults) || defaults.length === 0) return overrides;
+  var byName = new Map();
+  var _iterator = _createForOfIteratorHelper$1(overrides),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var action = _step.value;
+      if (action && action.name) byName.set(action.name, action);
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+  var merged = defaults.map(function (d) {
+    return d !== null && d !== void 0 && d.name && byName.has(d.name) ? _objectSpread$C(_objectSpread$C({}, d), byName.get(d.name)) : d;
+  });
+  var defaultNames = new Set(defaults.map(function (d) {
+    return d === null || d === void 0 ? void 0 : d.name;
+  }).filter(Boolean));
+  var appended = overrides.filter(function (a) {
+    return a && (!a.name || !defaultNames.has(a.name));
+  });
+  return [].concat(_toConsumableArray$1(merged), _toConsumableArray$1(appended));
+};
+var EMPTY_RESOLVED = Object.freeze({
+  inlineActions: Object.freeze([]),
+  menuActions: Object.freeze([])
+});
+/**
+ * Normalize the `actions` prop for a single row.
+ *
+ * Accepts either an array or a `(row, index) => array` producer. Entries whose
+ * `hidden` resolves truthy are dropped; `label`/`icon` are resolved against the
+ * row; `disabled` is coerced to a boolean; `inline` entries are split out so
+ * they can render as icon buttons in the cell rather than inside the menu.
+ *
+ * `render` is deliberately passed through untouched — it is already a
+ * `(row) => ReactNode` renderer with its own contract, not a value producer.
+ *
+ * @param {Array|Function} actions array, or (row, index) => array
+ * @param {object} row
+ * @param {number} index the GLOBAL row index (startIndex + rowIndexInPage)
+ * @returns {{ inlineActions: Array, menuActions: Array }}
+ */
+var resolveActions = function resolveActions(actions, row, index) {
+  var source = typeof actions === "function" ? actions(row, index) : actions;
+  if (!Array.isArray(source) || source.length === 0) return EMPTY_RESOLVED;
+  var inlineActions = [];
+  var menuActions = [];
+  var _iterator2 = _createForOfIteratorHelper$1(source),
+    _step2;
+  try {
+    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+      var action = _step2.value;
+      if (!action || _typeof$4(action) !== "object") continue;
+      if (callIfFn(action.hidden, row, index)) continue;
+      var resolved = _objectSpread$C(_objectSpread$C({}, action), {}, {
+        label: callIfFn(action.label, row, index),
+        icon: callIfFn(action.icon, row, index),
+        disabled: !!callIfFn(action.disabled, row, index),
+        inline: !!action.inline
+      });
+      (resolved.inline ? inlineActions : menuActions).push(resolved);
+    }
+  } catch (err) {
+    _iterator2.e(err);
+  } finally {
+    _iterator2.f();
+  }
+  return {
+    inlineActions: inlineActions,
+    menuActions: menuActions
+  };
+};
 
 /**
  * Custom hook to detect clicks outside of specified refs
@@ -4365,23 +4480,6 @@ function ActionMenu(_ref) {
   var maxMenuHeight = 320;
   var minMenuHeight = 80;
   var margin = 8;
-  useLayoutEffect(function () {
-    computePosition();
-    var handleResize = function handleResize() {
-      window.requestAnimationFrame(function () {
-        return computePosition();
-      });
-    };
-    var handleScroll = function handleScroll() {
-      onClose === null || onClose === void 0 || onClose();
-    };
-    window.addEventListener("resize", handleResize);
-    window.addEventListener("scroll", handleScroll, true);
-    return function () {
-      window.removeEventListener("resize", handleResize);
-      window.removeEventListener("scroll", handleScroll, true);
-    };
-  }, [anchorEl, actions, menuRef, onClose]);
   var computePosition = function computePosition() {
     if (!anchorEl || typeof window === "undefined") return;
     var rect = anchorEl.getBoundingClientRect();
@@ -4432,25 +4530,30 @@ function ActionMenu(_ref) {
       transformOrigin: transformOrigin,
       maxHeight: allowedMaxHeight,
       width: menuWidth,
-      opacity: 0.8
+      opacity: 1
     });
   };
-  // measure & position before paint
+  // Measure & position before paint. A single effect owns both listeners:
+  // resize repositions the menu, scroll closes it (repositioning a portaled
+  // menu against a scrolling ancestor is not worth the jank).
   useLayoutEffect(function () {
     computePosition();
-    var onScrollOrResize = function onScrollOrResize() {
+    var handleResize = function handleResize() {
       window.requestAnimationFrame(function () {
         return computePosition();
       });
     };
-    window.addEventListener("resize", onScrollOrResize);
-    window.addEventListener("scroll", onScrollOrResize, true);
+    var handleScroll = function handleScroll() {
+      onClose === null || onClose === void 0 || onClose();
+    };
+    window.addEventListener("resize", handleResize);
+    window.addEventListener("scroll", handleScroll, true);
     return function () {
-      window.removeEventListener("resize", onScrollOrResize);
-      window.removeEventListener("scroll", onScrollOrResize, true);
+      window.removeEventListener("resize", handleResize);
+      window.removeEventListener("scroll", handleScroll, true);
     };
     // recompute when anchor or actions change (content height may change)
-  }, [anchorEl, actions, menuRef]);
+  }, [anchorEl, actions, menuRef, onClose]);
   // Render into body
   return /*#__PURE__*/createPortal(jsx("div", {
     ref: menuRef,
@@ -4472,32 +4575,34 @@ function ActionMenu(_ref) {
       children: !Array.isArray(actions) || actions.length === 0 ? jsx("div", {
         className: "px-3 py-2 text-sm text-primary-500",
         children: "No actions"
-      }) : actions.map(function (action) {
+      }) : actions.map(function (action, idx) {
+        var _action$name;
+        var isDisabled = !!action.disabled;
         return jsx("div", {
           className: "px-1",
-          children: action.render ? jsx("button", {
-            className: cn$1("w-full text-left px-3 py-2 text-sm opacity-75 hover:opacity-100 flex items-center gap-2 rounded-md", menuBg, menuItemHover),
-            onClick: function onClick(e) {
-              e.stopPropagation();
-              onAction === null || onAction === void 0 || onAction(action, row);
-              onClose === null || onClose === void 0 || onClose();
-            },
-            children: action.render(row)
-          }) : jsxs("button", {
-            className: cn$1("w-full text-left px-3 py-2 text-sm opacity-75 hover:opacity-100 flex items-center gap-2 rounded-md", menuBg, menuItemHover),
+          children: jsx("button", {
+            type: "button",
+            disabled: isDisabled,
+            "aria-disabled": isDisabled || undefined,
+            className: cn$1("w-full text-left px-3 py-2 text-sm flex items-center gap-2 rounded-md", menuBg, isDisabled ? "opacity-50 cursor-not-allowed" : ["opacity-75 hover:opacity-100", menuItemHover]),
             onClick: function onClick(e) {
               e.stopPropagation();
+              // Belt-and-braces: `action.render` output may contain its
+              // own clickable content that bypasses the `disabled` attr.
+              if (isDisabled) return;
               onAction === null || onAction === void 0 || onAction(action, row);
               onClose === null || onClose === void 0 || onClose();
             },
-            children: [action.icon && jsx("span", {
-              className: "inline-flex",
-              children: action.icon
-            }), jsx("span", {
-              children: action.label
-            })]
+            children: action.render ? action.render(row) : jsxs(Fragment, {
+              children: [action.icon && jsx("span", {
+                className: "inline-flex",
+                children: action.icon
+              }), jsx("span", {
+                children: action.label
+              })]
+            })
           })
-        }, action.name);
+        }, (_action$name = action.name) !== null && _action$name !== void 0 ? _action$name : "action-".concat(idx));
       })
     })
   }), document.body);
@@ -4518,6 +4623,7 @@ function TableRow(_ref) {
     theme = _ref.theme,
     onRowClick = _ref.onRowClick,
     hasDetails = _ref.hasDetails,
+    hasDetailsColumn = _ref.hasDetailsColumn,
     showSerial = _ref.showSerial,
     selectable = _ref.selectable,
     visibleColumns = _ref.visibleColumns,
@@ -4541,6 +4647,15 @@ function TableRow(_ref) {
   var actionCellKey = "actions-".concat(key);
   var isSelected = selectedRows.has(key);
   var isExpanded = expandedRows.has(key);
+  // Only this row's actions are resolved. Memoized so that opening one row's
+  // menu (which re-renders every row) does not re-invoke a function-valued
+  // `actions` prop for all the other rows.
+  var _React$useMemo = React__default.useMemo(function () {
+      return resolveActions(actionsToUse, row, globalIndex);
+    }, [actionsToUse, row, globalIndex]),
+    inlineActions = _React$useMemo.inlineActions,
+    menuActions = _React$useMemo.menuActions;
+  var showDetailsToggle = rowHasDetails(hasDetails, row, globalIndex);
   var extraRowClass = typeof rowClass === "function" ? rowClass({
     row: row,
     rowIndex: globalIndex
@@ -4560,14 +4675,16 @@ function TableRow(_ref) {
       onClick: function onClick() {
         return onRowClick === null || onRowClick === void 0 ? void 0 : onRowClick(row, globalIndex);
       },
-      children: [hasDetails && jsx("td", {
+      children: [hasDetailsColumn && jsx("td", {
         className: "px-4 py-4 text-sm",
-        children: jsx("button", {
+        children: showDetailsToggle && jsx("button", {
+          type: "button",
           onClick: function onClick(e) {
             e.stopPropagation();
             toggleExpandRow(row, rowIndexInPage);
           },
           "aria-expanded": isExpanded,
+          "aria-label": isExpanded ? "Collapse row details" : "Expand row details",
           className: "p-1 rounded hover:bg-gray-100",
           children: isExpanded ? "▾" : "▸"
         })
@@ -4607,36 +4724,58 @@ function TableRow(_ref) {
           return e.stopPropagation();
         },
         children: jsxs("div", {
-          className: "relative inline-block",
-          children: [jsx("button", {
-            ref: function ref(el) {
-              if (el) {
-                actionButtonRefs.current[actionCellKey] = el;
-              }
-            },
-            onClick: function onClick(e) {
-              return toggleActions(e, actionCellKey, row);
-            },
-            "aria-expanded": activeActionRowKey === actionCellKey,
-            className: "p-1 rounded hover:bg-gray-100",
-            title: "Actions",
-            children: jsx(MoreVertical, {
-              className: "h-4 w-4"
-            })
-          }), activeActionRowKey === actionCellKey && jsx(ActionMenu, {
-            actions: actionsToUse,
-            row: row,
-            onAction: function onAction(action) {
-              return handleOnAction(action, row);
-            },
-            menuRef: actionMenuRef,
-            anchorEl: activeAnchorEl,
-            onClose: closeActionMenu,
-            theme: theme
+          className: "flex items-center justify-end gap-1",
+          children: [inlineActions.map(function (action, idx) {
+            var _action$icon, _action$name;
+            var actionLabel = getActionLabelText(action);
+            return jsx("button", {
+              type: "button",
+              title: actionLabel,
+              "aria-label": actionLabel,
+              disabled: action.disabled,
+              onClick: function onClick(e) {
+                e.stopPropagation();
+                if (action.disabled) return;
+                handleOnAction(action, row);
+              },
+              className: cn$1("p-1 rounded", action.disabled ? "opacity-50 cursor-not-allowed" : "hover:bg-gray-100"),
+              children: action.render ? action.render(row) : (_action$icon = action.icon) !== null && _action$icon !== void 0 ? _action$icon : jsx("span", {
+                className: "text-xs",
+                children: actionLabel
+              })
+            }, (_action$name = action.name) !== null && _action$name !== void 0 ? _action$name : "inline-".concat(idx));
+          }), menuActions.length > 0 && jsxs("div", {
+            className: "relative inline-block",
+            children: [jsx("button", {
+              ref: function ref(el) {
+                if (el) {
+                  actionButtonRefs.current[actionCellKey] = el;
+                }
+              },
+              onClick: function onClick(e) {
+                return toggleActions(e, actionCellKey, row);
+              },
+              "aria-expanded": activeActionRowKey === actionCellKey,
+              className: "p-1 rounded hover:bg-gray-100",
+              title: "Actions",
+              children: jsx(MoreVertical, {
+                className: "h-4 w-4"
+              })
+            }), activeActionRowKey === actionCellKey && jsx(ActionMenu, {
+              actions: menuActions,
+              row: row,
+              onAction: function onAction(action) {
+                return handleOnAction(action, row);
+              },
+              menuRef: actionMenuRef,
+              anchorEl: activeAnchorEl,
+              onClose: closeActionMenu,
+              theme: theme
+            })]
           })]
         })
       })]
-    }), hasDetails && isExpanded && DetailsComponent && jsx("tr", {
+    }), showDetailsToggle && isExpanded && DetailsComponent && jsx("tr", {
       children: jsx("td", {
         colSpan: visibleCount,
         className: cn$1(_defineProperty$4(_defineProperty$4({
@@ -4688,6 +4827,14 @@ function MobileCard(_ref) {
   var actionCellKey = "actions-".concat(key);
   var isSelected = selectedRows.has(key);
   var isExpanded = expandedRows.has(key);
+  var _React$useMemo = React__default.useMemo(function () {
+      return resolveActions(actionsToUse, row, globalIndex);
+    }, [actionsToUse, row, globalIndex]),
+    inlineActions = _React$useMemo.inlineActions,
+    menuActions = _React$useMemo.menuActions;
+  // Unlike the desktop row there is no column grid to keep aligned, so a
+  // non-qualifying row simply renders no toggle and no placeholder.
+  var showDetailsToggle = rowHasDetails(hasDetails, row, globalIndex);
   var extraRowClass = typeof rowClass === "function" ? rowClass({
     row: row,
     rowIndex: globalIndex
@@ -4710,12 +4857,14 @@ function MobileCard(_ref) {
       className: "flex items-center justify-between p-4 border-b bg-gray-50",
       children: [jsxs("div", {
         className: "flex items-center gap-3",
-        children: [hasDetails && jsx("button", {
+        children: [showDetailsToggle && jsx("button", {
+          type: "button",
           onClick: function onClick(e) {
             e.stopPropagation();
             toggleExpandRow(row, rowIndexInPage);
           },
           "aria-expanded": isExpanded,
+          "aria-label": isExpanded ? "Collapse row details" : "Expand row details",
           className: "p-1 rounded hover:bg-gray-200",
           children: isExpanded ? "▾" : "▸"
         }), selectable && jsx("input", {
@@ -4734,32 +4883,56 @@ function MobileCard(_ref) {
           children: ["#", globalIndex + 1]
         })]
       }), withAction && jsxs("div", {
-        className: "relative",
-        children: [jsx("button", {
-          ref: function ref(el) {
-            if (el) {
-              actionButtonRefs.current[actionCellKey] = el;
-            }
-          },
-          onClick: function onClick(e) {
-            return toggleActions(e, actionCellKey, row);
-          },
-          "aria-expanded": activeActionRowKey === actionCellKey,
-          className: "p-1.5 rounded hover:bg-gray-200",
-          title: "Actions",
-          children: jsx(MoreVertical, {
-            className: "h-4 w-4"
-          })
-        }), activeActionRowKey === actionCellKey && jsx(ActionMenu, {
-          actions: actionsToUse,
-          row: row,
-          onAction: function onAction(action) {
-            return handleOnAction(action, row);
-          },
-          menuRef: actionMenuRef,
-          anchorEl: activeAnchorEl,
-          onClose: closeActionMenu,
-          theme: theme
+        className: "flex items-center gap-1",
+        children: [inlineActions.map(function (action, idx) {
+          var _action$icon, _action$name;
+          var actionLabel = getActionLabelText(action);
+          return jsx("button", {
+            type: "button",
+            title: actionLabel,
+            "aria-label": actionLabel,
+            disabled: action.disabled,
+            onClick: function onClick(e) {
+              // The card root binds onRowClick and there is no stopping
+              // ancestor here, unlike the desktop actions <td>.
+              e.stopPropagation();
+              if (action.disabled) return;
+              handleOnAction(action, row);
+            },
+            className: cn$1("p-1.5 rounded", action.disabled ? "opacity-50 cursor-not-allowed" : "hover:bg-gray-200"),
+            children: action.render ? action.render(row) : (_action$icon = action.icon) !== null && _action$icon !== void 0 ? _action$icon : jsx("span", {
+              className: "text-xs",
+              children: actionLabel
+            })
+          }, (_action$name = action.name) !== null && _action$name !== void 0 ? _action$name : "inline-".concat(idx));
+        }), menuActions.length > 0 && jsxs("div", {
+          className: "relative",
+          children: [jsx("button", {
+            ref: function ref(el) {
+              if (el) {
+                actionButtonRefs.current[actionCellKey] = el;
+              }
+            },
+            onClick: function onClick(e) {
+              return toggleActions(e, actionCellKey, row);
+            },
+            "aria-expanded": activeActionRowKey === actionCellKey,
+            className: "p-1.5 rounded hover:bg-gray-200",
+            title: "Actions",
+            children: jsx(MoreVertical, {
+              className: "h-4 w-4"
+            })
+          }), activeActionRowKey === actionCellKey && jsx(ActionMenu, {
+            actions: menuActions,
+            row: row,
+            onAction: function onAction(action) {
+              return handleOnAction(action, row);
+            },
+            menuRef: actionMenuRef,
+            anchorEl: activeAnchorEl,
+            onClose: closeActionMenu,
+            theme: theme
+          })]
         })]
       })]
     }), jsx("div", {
@@ -4783,7 +4956,7 @@ function MobileCard(_ref) {
           })]
         }, column.key);
       })
-    }), hasDetails && isExpanded && DetailsComponent && jsx("div", {
+    }), showDetailsToggle && isExpanded && DetailsComponent && jsx("div", {
       className: "border-t bg-gray-50 p-4",
       children: jsx(DetailsComponent, {
         row: row,
@@ -4793,7 +4966,7 @@ function MobileCard(_ref) {
   }, key);
 }
 
-var _excluded$x = ["data", "columns", "sortable", "filterable", "selectable", "pagination", "pageSize", "onSort", "onFilter", "onFetch", "onFilterChange", "onSelectionChange", "onRowClick", "hasDetails", "DetailsComponent", "className", "withAction", "onAction", "actions", "showSerial", "cellClass", "rowClass", "globalSearch", "limitOptions", "showLimitSelector", "onLimitChange", "showReloadButton", "renderReloadButton", "onReload", "stripedRows", "theme", "responsiveBreakpoint", "serverSide", "totalRecords", "pageNumber", "onPageChange", "TheadComponent", "TfootComponent"];
+var _excluded$x = ["data", "columns", "sortable", "filterable", "selectable", "pagination", "pageSize", "onSort", "onFilter", "onFetch", "onFilterChange", "onSelectionChange", "onRowClick", "hasDetails", "DetailsComponent", "className", "withAction", "onAction", "actions", "replaceDefaultActions", "showSerial", "cellClass", "rowClass", "globalSearch", "limitOptions", "showLimitSelector", "onLimitChange", "showReloadButton", "renderReloadButton", "onReload", "stripedRows", "theme", "responsiveBreakpoint", "serverSide", "totalRecords", "pageNumber", "onPageChange", "TheadComponent", "TfootComponent"];
 function ownKeys$B(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$B(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$B(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$B(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var DEFAULT_DATA = [];
@@ -4835,6 +5008,8 @@ var Table = function Table(_ref) {
     withAction = _ref$withAction === void 0 ? true : _ref$withAction,
     onAction = _ref.onAction,
     actions = _ref.actions,
+    _ref$replaceDefaultAc = _ref.replaceDefaultActions,
+    replaceDefaultActions = _ref$replaceDefaultAc === void 0 ? false : _ref$replaceDefaultAc,
     _ref$showSerial = _ref.showSerial,
     showSerial = _ref$showSerial === void 0 ? true : _ref$showSerial,
     cellClass = _ref.cellClass,
@@ -4946,9 +5121,26 @@ var Table = function Table(_ref) {
   var actionMenuRef = useRef(null);
   var actionButtonRefs = useRef({});
   // Memoized values
+  //
+  // Supplied actions PATCH the built-in set by `name` (so `{ name: "edit",
+  // onClick }` keeps the default label + icon) unless `replaceDefaultActions`
+  // is set. Stays either an array or a `(row, index) => array` producer, and
+  // keeps a stable identity so the per-row memo in TableRow/MobileCard pays off.
   var actionsToUse = useMemo(function () {
-    return actions !== undefined ? actions : DEFAULT_ACTIONS;
-  }, [actions]);
+    if (actions === undefined) return DEFAULT_ACTIONS;
+    if (replaceDefaultActions) return actions;
+    if (typeof actions === "function") {
+      return function (row, index) {
+        return mergeDefaultActions(actions(row, index), DEFAULT_ACTIONS);
+      };
+    }
+    return mergeDefaultActions(actions, DEFAULT_ACTIONS);
+  }, [actions, replaceDefaultActions]);
+  // `hasDetails` may be a predicate. The expand COLUMN exists whenever the prop
+  // is truthy at all; whether a given row gets a toggle is decided per row.
+  var hasDetailsColumn = useMemo(function () {
+    return typeof hasDetails === "function" || !!hasDetails;
+  }, [hasDetails]);
   // Refs for stable initial values
   var initialPageNumber = useRef(pageNumber);
   var initialColumnsRef = useRef(initialColumns);
@@ -5052,8 +5244,8 @@ var Table = function Table(_ref) {
     paginatedData = _useMemo.paginatedData,
     totalPages = _useMemo.totalPages;
   var visibleCount = useMemo(function () {
-    return (showSerial ? 1 : 0) + visibleColumns.length + (selectable ? 1 : 0) + (hasDetails ? 1 : 0) + (withAction ? 1 : 0) + 1;
-  }, [showSerial, visibleColumns.length, selectable, hasDetails, withAction]);
+    return (showSerial ? 1 : 0) + visibleColumns.length + (selectable ? 1 : 0) + (hasDetailsColumn ? 1 : 0) + (withAction ? 1 : 0) + 1;
+  }, [showSerial, visibleColumns.length, selectable, hasDetailsColumn, withAction]);
   var rowKeyMap = useMemo(function () {
     return new Map(filteredData.map(function (r, i) {
       return [getRowKey(r, i), r];
@@ -5243,6 +5435,7 @@ var Table = function Table(_ref) {
     stripedColors: stripedColorsArray,
     onRowClick: onRowClick,
     hasDetails: hasDetails,
+    hasDetailsColumn: hasDetailsColumn,
     showSerial: showSerial,
     selectable: selectable,
     visibleColumns: Array.isArray(visibleColumns) ? visibleColumns : [],
@@ -5372,7 +5565,7 @@ var Table = function Table(_ref) {
         children: [jsxs("thead", {
           className: safeTheme.accentColor,
           children: [jsxs("tr", {
-            children: [hasDetails && jsx("th", {
+            children: [hasDetailsColumn && jsx("th", {
               className: "w-8 px-4 py-3"
             }), showSerial && jsx("th", {
               className: "w-8 px-4 py-3 text-left text-xs font-medium text-primary-500 uppercase tracking-wider",
@@ -5432,7 +5625,7 @@ var Table = function Table(_ref) {
               className: "w-12 px-4 py-3"
             })]
           }), filterable && jsxs("tr", {
-            children: [hasDetails && jsx("th", {
+            children: [hasDetailsColumn && jsx("th", {
               className: "pb-4"
             }), showSerial && jsx("th", {
               className: "pb-4"