@portnet/ui 6.0.2 → 6.0.3

package/dist/v2/patterns/ActionBar.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.default = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
@@ -18,30 +18,9 @@ var _OverflowMenu = _interopRequireDefault(require("../components/OverflowMenu")
 var _tokens = require("../tokens");
 var _mergeLabels = require("../utils/mergeLabels");
 var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["_slot", "label", "icon", "iconRight", "onClick", "disabled", "loading", "variant"],
-  _excluded2 = ["_slot"];
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, 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 normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } /**
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+/**
  * ActionBar - Portnet UI v2 (pattern)
  *
  * Charter §07 — render order (left → right):
@@ -93,14 +72,23 @@ function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input ==
  * the accessibility tree, not just from the layout. On `xs` it is now bounded to
  * two lines with a line-clamp instead; `sm` and above are unchanged. See the
  * inline note at the render site for the full rationale.
- */ /** Variant union, derived from Button (single source of truth). */ /** Structured breadcrumb entry (as opposed to a plain renderable node). */ /** A breadcrumb entry is either a plain node or a structured item. */ /** Action descriptor for primary / secondary / overflow slots. */
-var DEFAULT_LABELS = Object.freeze({
+ */
+
+/** Variant union, derived from Button (single source of truth). */
+
+/** Structured breadcrumb entry (as opposed to a plain renderable node). */
+
+/** A breadcrumb entry is either a plain node or a structured item. */
+
+/** Action descriptor for primary / secondary / overflow slots. */
+
+const DEFAULT_LABELS = Object.freeze({
   back: "Retour",
   breadcrumb: "Fil d'Ariane",
   home: "Accueil",
   expandCrumbs: "Afficher le chemin complet"
 });
-var CRUMB_LINK_BASE_SX = Object.freeze({
+const CRUMB_LINK_BASE_SX = Object.freeze({
   display: "inline-flex",
   alignItems: "center",
   gap: "var(--s-1)",
@@ -117,25 +105,26 @@ var CRUMB_LINK_BASE_SX = Object.freeze({
     outlineOffset: "var(--pui-outline-offset-inset, 0)"
   }
 });
-var CRUMB_ELLIPSIS_SX = Object.freeze(_objectSpread(_objectSpread({}, CRUMB_LINK_BASE_SX), {}, {
+const CRUMB_ELLIPSIS_SX = Object.freeze({
+  ...CRUMB_LINK_BASE_SX,
   background: "none",
   border: "none",
   font: "inherit",
   fontSize: "var(--text-xs)",
   lineHeight: 1
-}));
+});
 function isStructuredCrumb(entry) {
-  return entry != null && _typeof(entry) === "object" && ! /*#__PURE__*/React.isValidElement(entry);
+  return entry != null && typeof entry === "object" && ! /*#__PURE__*/React.isValidElement(entry);
 }
 function getCrumbColor(isLast, useAccent) {
   if (useAccent) return "var(--accent)";
   return isLast ? "var(--fg)" : "var(--fg-subtle)";
 }
 function renderCrumbContent(entry, isLast, useAccent) {
-  var baseColor = getCrumbColor(isLast, useAccent);
-  var baseFontWeight = isLast ? "var(--fw-semibold)" : "var(--fw-regular)";
+  const baseColor = getCrumbColor(isLast, useAccent);
+  const baseFontWeight = isLast ? "var(--fw-semibold)" : "var(--fw-regular)";
   if (!isStructuredCrumb(entry)) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box["default"], {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
       component: "span",
       "aria-current": isLast ? "page" : undefined,
       sx: {
@@ -145,14 +134,16 @@ function renderCrumbContent(entry, isLast, useAccent) {
       children: entry
     });
   }
-  var label = entry.label,
-    icon = entry.icon,
-    onClick = entry.onClick,
-    href = entry.href,
-    ariaLabel = entry.ariaLabel;
-  var computedAria = ariaLabel || (typeof label === "string" ? label : undefined);
+  const {
+    label,
+    icon,
+    onClick,
+    href,
+    ariaLabel
+  } = entry;
+  const computedAria = ariaLabel || (typeof label === "string" ? label : undefined);
   if (isLast) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
       component: "span",
       "aria-current": "page",
       sx: {
@@ -166,34 +157,36 @@ function renderCrumbContent(entry, isLast, useAccent) {
     });
   }
   if (href) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
       component: "a",
       href: href,
       onClick: onClick,
       "aria-label": computedAria,
-      sx: _objectSpread(_objectSpread({}, CRUMB_LINK_BASE_SX), {}, {
+      sx: {
+        ...CRUMB_LINK_BASE_SX,
         color: baseColor
-      }),
+      },
       children: [icon, label]
     });
   }
   if (onClick) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
       component: "button",
       type: "button",
       onClick: onClick,
       "aria-label": computedAria,
-      sx: _objectSpread(_objectSpread({}, CRUMB_LINK_BASE_SX), {}, {
+      sx: {
+        ...CRUMB_LINK_BASE_SX,
         color: baseColor,
         background: "none",
         border: "none",
         font: "inherit",
         fontSize: "var(--text-xs)"
-      }),
+      },
       children: [icon, label]
     });
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
     component: "span",
     sx: {
       color: baseColor,
@@ -205,135 +198,113 @@ function renderCrumbContent(entry, isLast, useAccent) {
     children: [icon, label]
   });
 }
-function ActionBar(_ref) {
-  var home = _ref.home,
-    back = _ref.back,
-    breadcrumb = _ref.breadcrumb,
-    title = _ref.title,
-    subtitle = _ref.subtitle,
-    icon = _ref.icon,
-    primary = _ref.primary,
-    _ref$secondary = _ref.secondary,
-    secondary = _ref$secondary === void 0 ? [] : _ref$secondary,
-    _ref$overflow = _ref.overflow,
-    overflow = _ref$overflow === void 0 ? [] : _ref$overflow,
-    _ref$maxVisible = _ref.maxVisible,
-    maxVisible = _ref$maxVisible === void 0 ? 2 : _ref$maxVisible,
-    meta = _ref.meta,
-    _ref$sticky = _ref.sticky,
-    sticky = _ref$sticky === void 0 ? true : _ref$sticky,
-    _ref$surface = _ref.surface,
-    surface = _ref$surface === void 0 ? false : _ref$surface,
-    _ref$collapseAfter = _ref.collapseAfter,
-    collapseAfter = _ref$collapseAfter === void 0 ? 3 : _ref$collapseAfter,
-    labels = _ref.labels;
-  var L = (0, _mergeLabels.mergeLabels)(DEFAULT_LABELS, labels);
+function ActionBar({
+  home,
+  back,
+  breadcrumb,
+  title,
+  subtitle,
+  icon,
+  primary,
+  secondary = [],
+  overflow = [],
+  maxVisible = 2,
+  meta,
+  sticky = true,
+  /*
+   * DEFAULT FLIPPED TO false. A page header sits on the page background, never
+   * on a white card — see the note in the module docstring. Opt back in with
+   * surface={true} for a header that heads a panel rather than a page.
+   */
+  surface = false,
+  collapseAfter = 3,
+  labels
+}) {
+  const L = (0, _mergeLabels.mergeLabels)(DEFAULT_LABELS, labels);
 
   // R-RS.5 — collapse the middle of a long breadcrumb on mobile (< sm
   // token, 481px). Reads the live theme so a host breakpoint override is
   // honoured. `crumbsExpanded` lets the user reveal the full trail in place.
-  var theme = (0, _styles.useTheme)();
-  var isMobile = (0, _useMediaQuery["default"])(theme.breakpoints.down("sm"));
-  var _React$useState = React.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    crumbsExpanded = _React$useState2[0],
-    setCrumbsExpanded = _React$useState2[1];
-  var effectiveBreadcrumb = React.useMemo(function () {
-    var base = breadcrumb || [];
+  const theme = (0, _styles.useTheme)();
+  const isMobile = (0, _useMediaQuery.default)(theme.breakpoints.down("sm"));
+  const [crumbsExpanded, setCrumbsExpanded] = React.useState(false);
+  const effectiveBreadcrumb = React.useMemo(() => {
+    const base = breadcrumb || [];
     if (!home) return base;
-    var homeItem = _objectSpread({
-      icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Home["default"], {
+    const homeItem = {
+      icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Home.default, {
         fontSize: "small"
       }),
-      ariaLabel: L.home
-    }, typeof home === "function" ? {
-      onClick: home
-    } : {
-      href: home
-    });
-    return [homeItem].concat(_toConsumableArray(base));
-  }, [home, breadcrumb, L.home]); // eslint-disable-line react-hooks/exhaustive-deps
+      ariaLabel: L.home,
+      ...(typeof home === "function" ? {
+        onClick: home
+      } : {
+        href: home
+      })
+    };
+    return [homeItem, ...base];
+  }, [home, breadcrumb, L.home]);
 
   // Decide whether to collapse: only on mobile, only when the trail is
   // longer than collapseAfter, and only while not user-expanded.
-  var shouldCollapse = isMobile && !crumbsExpanded && effectiveBreadcrumb.length > Math.max(2, collapseAfter);
-  var orderedAll = React.useMemo(function () {
-    var list = [];
-    if (primary) list.push(_objectSpread(_objectSpread({}, primary), {}, {
+  const shouldCollapse = isMobile && !crumbsExpanded && effectiveBreadcrumb.length > Math.max(2, collapseAfter);
+  const orderedAll = React.useMemo(() => {
+    const list = [];
+    if (primary) list.push({
+      ...primary,
       _slot: "primary"
-    }));
-    var _iterator = _createForOfIteratorHelper(secondary || []),
-      _step;
-    try {
-      for (_iterator.s(); !(_step = _iterator.n()).done;) {
-        var s = _step.value;
-        list.push(_objectSpread(_objectSpread({}, s), {}, {
-          _slot: "secondary"
-        }));
-      }
-    } catch (err) {
-      _iterator.e(err);
-    } finally {
-      _iterator.f();
-    }
-    var _iterator2 = _createForOfIteratorHelper(overflow || []),
-      _step2;
-    try {
-      for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-        var o = _step2.value;
-        list.push(_objectSpread(_objectSpread({}, o), {}, {
-          _slot: "overflow"
-        }));
-      }
-    } catch (err) {
-      _iterator2.e(err);
-    } finally {
-      _iterator2.f();
-    }
+    });
+    for (const s of secondary || []) list.push({
+      ...s,
+      _slot: "secondary"
+    });
+    for (const o of overflow || []) list.push({
+      ...o,
+      _slot: "overflow"
+    });
     return list;
   }, [primary, secondary, overflow]);
-  var visibleActions = orderedAll.slice(0, maxVisible);
-  var hiddenActions = orderedAll.slice(maxVisible);
-  var visiblePrimary = visibleActions.filter(function (a) {
-    return a._slot === "primary";
-  });
-  var visibleOthers = visibleActions.filter(function (a) {
-    return a._slot !== "primary";
-  });
-  var hasNavRow = !!(back || effectiveBreadcrumb.length > 0);
-  var useAccent = !surface;
-  var accentOrFgMuted = useAccent ? "var(--accent)" : "var(--fg-muted)";
-  var accentOrFg = useAccent ? "var(--accent)" : "var(--fg)";
+  const visibleActions = orderedAll.slice(0, maxVisible);
+  const hiddenActions = orderedAll.slice(maxVisible);
+  const visiblePrimary = visibleActions.filter(a => a._slot === "primary");
+  const visibleOthers = visibleActions.filter(a => a._slot !== "primary");
+  const hasNavRow = !!(back || effectiveBreadcrumb.length > 0);
+  const useAccent = !surface;
+  const accentOrFgMuted = useAccent ? "var(--accent)" : "var(--fg-muted)";
+  const accentOrFg = useAccent ? "var(--accent)" : "var(--fg)";
   function resolveVariant(action) {
     if (action._slot === "primary") return "primary";
     if (action._slot === "overflow") return action.variant || "ghost";
     return action.variant || "secondary";
   }
   function renderButton(action, i) {
-    var _slot = action._slot,
-      label = action.label,
-      actionIcon = action.icon,
-      iconRight = action.iconRight,
-      onClick = action.onClick,
-      disabled = action.disabled,
-      loading = action.loading,
-      _variant = action.variant,
-      rest = _objectWithoutProperties(action, _excluded);
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button["default"], _objectSpread(_objectSpread(_objectSpread({
+    const {
+      _slot,
+      label,
+      icon: actionIcon,
+      iconRight,
+      onClick,
+      disabled,
+      loading,
+      variant: _variant,
+      ...rest
+    } = action;
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
       variant: resolveVariant(action),
       size: "sm",
       icon: actionIcon,
       iconRight: iconRight,
       onClick: onClick,
-      disabled: disabled
-    }, rest), loading !== undefined ? {
-      loading: loading
-    } : {}), {}, {
+      disabled: disabled,
+      ...rest,
+      ...(loading !== undefined ? {
+        loading
+      } : {}),
       children: label
-    }), i);
+    }, i);
   }
-  var lastCrumbIndex = effectiveBreadcrumb.length - 1;
-  var chevron = /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChevronRight["default"], {
+  const lastCrumbIndex = effectiveBreadcrumb.length - 1;
+  const chevron = /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChevronRight.default, {
     "aria-hidden": "true",
     sx: {
       fontSize: "var(--text-xs)",
@@ -346,9 +317,9 @@ function ActionBar(_ref) {
    * Each branch returns an array of <li> rows so the <ol> stays valid. */
   function renderCrumbItems() {
     if (!shouldCollapse) {
-      return effectiveBreadcrumb.map(function (b, i) {
-        var isLast = i === lastCrumbIndex;
-        return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+      return effectiveBreadcrumb.map((b, i) => {
+        const isLast = i === lastCrumbIndex;
+        return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
           component: "li",
           sx: {
             display: "inline-flex",
@@ -361,9 +332,9 @@ function ActionBar(_ref) {
     }
 
     // Collapsed: first crumb, an expand toggle, then the last crumb.
-    var first = effectiveBreadcrumb[0];
-    var last = effectiveBreadcrumb[lastCrumbIndex];
-    return [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+    const first = effectiveBreadcrumb[0];
+    const last = effectiveBreadcrumb[lastCrumbIndex];
+    return [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
       component: "li",
       sx: {
         display: "inline-flex",
@@ -371,27 +342,26 @@ function ActionBar(_ref) {
         gap: 0.5
       },
       children: [renderCrumbContent(first, false, useAccent), chevron]
-    }, "first"), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+    }, "first"), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
       component: "li",
       sx: {
         display: "inline-flex",
         alignItems: "center",
         gap: 0.5
       },
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box["default"], {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
         component: "button",
         type: "button",
-        onClick: function onClick() {
-          return setCrumbsExpanded(true);
-        },
+        onClick: () => setCrumbsExpanded(true),
         "aria-label": L.expandCrumbs,
         "aria-expanded": "false",
-        sx: _objectSpread(_objectSpread({}, CRUMB_ELLIPSIS_SX), {}, {
+        sx: {
+          ...CRUMB_ELLIPSIS_SX,
           color: useAccent ? "var(--accent)" : "var(--fg-subtle)"
-        }),
+        },
         children: "\u2026"
       }), chevron]
-    }, "ellipsis"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box["default"], {
+    }, "ellipsis"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
       component: "li",
       sx: {
         display: "inline-flex",
@@ -401,7 +371,7 @@ function ActionBar(_ref) {
       children: renderCrumbContent(last, true, useAccent)
     }, "last")];
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
     sx: {
       background: surface ? "var(--surface)" : "var(--bg)",
       borderBottom: surface ? "1px solid var(--border)" : "none",
@@ -414,14 +384,14 @@ function ActionBar(_ref) {
       top: 0,
       zIndex: _tokens.zIndex.sticky
     },
-    children: [hasNavRow && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+    children: [hasNavRow && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
       sx: {
         display: "flex",
         alignItems: "center",
         gap: 1,
         marginBottom: 1
       },
-      children: [back && /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton["default"], {
+      children: [back && /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
         size: "small",
         onClick: back,
         "aria-label": L.back,
@@ -431,16 +401,16 @@ function ActionBar(_ref) {
             transform: "scaleX(var(--pui-rtl-flip, 1))"
           }
         },
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArrowBack["default"], {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArrowBack.default, {
           fontSize: "small"
         })
-      }), effectiveBreadcrumb.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box["default"], {
+      }), effectiveBreadcrumb.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
         component: "nav",
         "aria-label": L.breadcrumb,
         sx: {
           minWidth: 0
         },
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box["default"], {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
           component: "ol",
           sx: {
             listStyle: "none",
@@ -460,7 +430,7 @@ function ActionBar(_ref) {
           children: renderCrumbItems()
         })
       })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
       sx: {
         display: "flex",
         alignItems: {
@@ -477,7 +447,7 @@ function ActionBar(_ref) {
           sm: 2
         }
       },
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
         sx: {
           minWidth: 0,
           flex: 1,
@@ -489,7 +459,7 @@ function ActionBar(_ref) {
             color: "inherit"
           }
         },
-        children: [icon, /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography["default"], {
+        children: [icon, /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
           component: "h1",
           sx: {
             fontSize: {
@@ -514,7 +484,7 @@ function ActionBar(_ref) {
           },
           children: title
         }), meta]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
         sx: {
           display: "flex",
           alignItems: "center",
@@ -529,19 +499,14 @@ function ActionBar(_ref) {
           },
           flexShrink: 0
         },
-        children: [visibleOthers.map(function (action, i) {
-          return renderButton(action, i);
-        }), visiblePrimary.map(function (action, i) {
-          return renderButton(action, "p".concat(i));
-        }), hiddenActions.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_OverflowMenu["default"], {
-          actions: hiddenActions.map(function (_ref2) {
-            var _s = _ref2._slot,
-              a = _objectWithoutProperties(_ref2, _excluded2);
-            return a;
-          })
+        children: [visibleOthers.map((action, i) => renderButton(action, i)), visiblePrimary.map((action, i) => renderButton(action, `p${i}`)), hiddenActions.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_OverflowMenu.default, {
+          actions: hiddenActions.map(({
+            _slot: _s,
+            ...a
+          }) => a)
         })]
       })]
-    }), subtitle && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography["default"], {
+    }), subtitle && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
       sx: {
         /* ── S-01 — THE SUBTITLE IS RENDERED AT EVERY BREAKPOINT ──────────
          *
@@ -598,5 +563,5 @@ function ActionBar(_ref) {
     })]
   });
 }
-var _default = exports["default"] = ActionBar;
+var _default = exports.default = ActionBar;
 //# sourceMappingURL=ActionBar.js.map