@portnet/ui 6.0.1 → 6.0.3

package/dist/esm/v2/components/FieldHelp.js

@@ -1,15 +1,3 @@
-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 _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; }
 import * as React from "react";
 import Tooltip from "@mui/material/Tooltip";
 import IconButton from "@mui/material/IconButton";
@@ -52,8 +40,8 @@ import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
  *   Tooltip's automatic aria-describedby plumbing on the wrapped child.
  */
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-var HELP_THRESHOLD_CHARS = 80;
-var HELP_ICON_SX = Object.freeze({
+const HELP_THRESHOLD_CHARS = 80;
+const HELP_ICON_SX = Object.freeze({
   padding: "2px",
   color: "var(--fg-subtle)",
   marginInlineStart: "var(--s-1)",
@@ -62,7 +50,7 @@ var HELP_ICON_SX = Object.freeze({
     background: "var(--bg-hover)"
   }
 });
-var POPOVER_PAPER_SX = Object.freeze({
+const POPOVER_PAPER_SX = Object.freeze({
   // Cap at 360 on desktop, but never exceed the viewport on small
   // phones (320–392px): MUI Popover positions the anchor but does NOT
   // shrink the paper width to the viewport, so a bare maxWidth:360
@@ -75,13 +63,13 @@ var POPOVER_PAPER_SX = Object.freeze({
   border: "1px solid var(--border)",
   boxShadow: "var(--shadow-md)"
 });
-var POPOVER_TITLE_SX = Object.freeze({
+const POPOVER_TITLE_SX = Object.freeze({
   fontSize: "var(--text-sm)",
   fontWeight: "var(--fw-semibold)",
   color: "var(--fg)",
   marginBottom: "var(--s-1)"
 });
-var POPOVER_BODY_SX = Object.freeze({
+const POPOVER_BODY_SX = Object.freeze({
   fontSize: "var(--text-sm)",
   color: "var(--fg-muted)",
   // --lh-loose = 1.6 (typography.js). Was `var(--lh-relaxed, 1.6)` —
@@ -99,26 +87,20 @@ function resolveVariant(variant, content, title) {
   }
   return "tooltip";
 }
-function FieldHelp(_ref) {
-  var content = _ref.content,
-    title = _ref.title,
-    _ref$variant = _ref.variant,
-    variant = _ref$variant === void 0 ? "auto" : _ref$variant,
-    _ref$icon = _ref.icon,
-    icon = _ref$icon === void 0 ? "help" : _ref$icon,
-    _ref$placement = _ref.placement,
-    placement = _ref$placement === void 0 ? "top" : _ref$placement,
-    _ref$ariaLabel = _ref.ariaLabel,
-    ariaLabel = _ref$ariaLabel === void 0 ? "Aide" : _ref$ariaLabel;
-  var _React$useState = React.useState(null),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    anchorEl = _React$useState2[0],
-    setAnchorEl = _React$useState2[1];
+function FieldHelp({
+  content,
+  title,
+  variant = "auto",
+  icon = "help",
+  placement = "top",
+  ariaLabel = "Aide"
+}) {
+  const [anchorEl, setAnchorEl] = React.useState(null);
   // FH-1 — stable id so the dialog paper can be labelled by its visible
   // title (used only when a title is rendered; see slotProps below).
-  var titleId = React.useId();
-  var effectiveVariant = resolveVariant(variant, content, title);
-  var IconComponent = icon === "info" ? InfoOutlinedIcon : HelpOutlineIcon;
+  const titleId = React.useId();
+  const effectiveVariant = resolveVariant(variant, content, title);
+  const IconComponent = icon === "info" ? InfoOutlinedIcon : HelpOutlineIcon;
   if (effectiveVariant === "tooltip") {
     return /*#__PURE__*/_jsx(Tooltip, {
       title: content,
@@ -137,13 +119,9 @@ function FieldHelp(_ref) {
       })
     });
   }
-  var handleOpen = function handleOpen(e) {
-    return setAnchorEl(e.currentTarget);
-  };
-  var handleClose = function handleClose() {
-    return setAnchorEl(null);
-  };
-  var open = !!anchorEl;
+  const handleOpen = e => setAnchorEl(e.currentTarget);
+  const handleClose = () => setAnchorEl(null);
+  const open = !!anchorEl;
   return /*#__PURE__*/_jsxs(_Fragment, {
     children: [/*#__PURE__*/_jsx(IconButton, {
       size: "small",
@@ -175,17 +153,18 @@ function FieldHelp(_ref) {
         horizontal: "left"
       },
       slotProps: {
-        paper: _objectSpread({
+        paper: {
           sx: POPOVER_PAPER_SX,
           // FH-1 — the trigger promises a dialog; make the paper one and
           // name it. Prefer the visible title (aria-labelledby, avoids a
           // Label-in-Name mismatch); fall back to the ariaLabel prop.
-          role: "dialog"
-        }, title ? {
-          "aria-labelledby": titleId
-        } : {
-          "aria-label": ariaLabel
-        })
+          role: "dialog",
+          ...(title ? {
+            "aria-labelledby": titleId
+          } : {
+            "aria-label": ariaLabel
+          })
+        }
       },
       children: [title && /*#__PURE__*/_jsx(Box, {
         id: titleId,

package/dist/esm/v2/components/FieldHelp.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldHelp.js","names":["React","Tooltip","IconButton","Box","Popover","HelpOutlineIcon","InfoOutlinedIcon","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","HELP_THRESHOLD_CHARS","HELP_ICON_SX","Object","freeze","padding","color","marginInlineStart","background","POPOVER_PAPER_SX","maxWidth","borderRadius","border","boxShadow","POPOVER_TITLE_SX","fontSize","fontWeight","marginBottom","POPOVER_BODY_SX","lineHeight","resolveVariant","variant","content","title","length","FieldHelp","_ref","_ref$variant","_ref$icon","icon","_ref$placement","placement","_ref$ariaLabel","ariaLabel","_React$useState","useState","_React$useState2","_slicedToArray","anchorEl","setAnchorEl","titleId","useId","effectiveVariant","IconComponent","arrow","children","size","sx","tabIndex","handleOpen","e","currentTarget","handleClose","open","onClick","onClose","anchorOrigin","vertical","horizontal","transformOrigin","slotProps","paper","_objectSpread","role","id"],"sources":["../../../../src/lib/v2/components/FieldHelp.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport Tooltip from \"@mui/material/Tooltip\";\r\nimport type { TooltipProps } from \"@mui/material/Tooltip\";\r\nimport IconButton from \"@mui/material/IconButton\";\r\nimport Box from \"@mui/material/Box\";\r\nimport Popover from \"@mui/material/Popover\";\r\nimport HelpOutlineIcon from \"@mui/icons-material/HelpOutlineOutlined\";\r\nimport InfoOutlinedIcon from \"@mui/icons-material/InfoOutlined\";\r\n\r\n/**\r\n * FieldHelp - Portnet UI v2 (component)\r\n *\r\n * Charter §03 · Component \"FieldHelp · Contextual help\".\r\n *\r\n * A small icon-button affordance that hosts drop next to labels,\r\n * section titles, or anywhere a user might benefit from just-in-\r\n * time guidance without cluttering the primary visual hierarchy.\r\n *\r\n * Behaviour modes:\r\n *   - tooltip: MUI Tooltip (default for short string content).\r\n *   - popover: MUI Popover, click to open. Used when content is\r\n *     long (>80 chars) or when a distinct `title` is provided.\r\n *   - auto:    Picks tooltip vs popover via the heuristic above.\r\n *\r\n * Usage:\r\n *   <FieldHelp content=\"Référence unique de l'autorisation\" />\r\n *   <FieldHelp\r\n *     title=\"Détails\"\r\n *     content={<>Texte long avec <b>JSX</b>.</>}\r\n *     variant=\"popover\"\r\n *   />\r\n *\r\n * A11y (audit Batch 5, finding B5-1; Batch 19, FH-1):\r\n *   Popover variant trigger carries aria-haspopup=\"dialog\" +\r\n *   aria-expanded reflecting the open state — WAI-ARIA disclosure\r\n *   pattern. The Popover paper itself carries role=\"dialog\" and an\r\n *   accessible name (FH-1): aria-labelledby the visible title when\r\n *   one is rendered, else aria-label from the ariaLabel prop — so\r\n *   the region the trigger promises actually resolves as a named\r\n *   dialog to assistive tech. Tooltip variant relies on MUI\r\n *   Tooltip's automatic aria-describedby plumbing on the wrapped child.\r\n */\r\n\r\nexport type FieldHelpVariant = \"auto\" | \"tooltip\" | \"popover\";\r\nexport type FieldHelpIcon = \"help\" | \"info\";\r\n\r\nexport interface FieldHelpProps {\r\n  /** Help content (tooltip title or popover body). */\r\n  content: React.ReactNode;\r\n  /** Optional popover title. When present, forces the popover variant. */\r\n  title?: React.ReactNode | undefined;\r\n  /** @default \"auto\" */\r\n  variant?: FieldHelpVariant | undefined;\r\n  /** @default \"help\" */\r\n  icon?: FieldHelpIcon | undefined;\r\n  /** Tooltip placement. @default \"top\" */\r\n  placement?: TooltipProps[\"placement\"] | undefined;\r\n  /** @default \"Aide\" */\r\n  ariaLabel?: string | undefined;\r\n}\r\n\r\nconst HELP_THRESHOLD_CHARS = 80;\r\n\r\nconst HELP_ICON_SX = Object.freeze({\r\n  padding: \"2px\",\r\n  color: \"var(--fg-subtle)\",\r\n  marginInlineStart: \"var(--s-1)\",\r\n  \"&:hover, &:focus-visible\": {\r\n    color: \"var(--accent)\",\r\n    background: \"var(--bg-hover)\",\r\n  },\r\n});\r\n\r\nconst POPOVER_PAPER_SX = Object.freeze({\r\n  // Cap at 360 on desktop, but never exceed the viewport on small\r\n  // phones (320–392px): MUI Popover positions the anchor but does NOT\r\n  // shrink the paper width to the viewport, so a bare maxWidth:360\r\n  // overflows the screen edge and forces horizontal scroll (WCAG 1.4.10\r\n  // Reflow). The min() inset keeps the paper on screen with a single\r\n  // --s-4 gutter on either side.\r\n  maxWidth: \"min(360px, calc(100vw - var(--s-4) * 2))\",\r\n  padding: \"var(--s-4)\",\r\n  borderRadius: \"var(--r-md)\",\r\n  border: \"1px solid var(--border)\",\r\n  boxShadow: \"var(--shadow-md)\",\r\n});\r\n\r\nconst POPOVER_TITLE_SX = Object.freeze({\r\n  fontSize: \"var(--text-sm)\",\r\n  fontWeight: \"var(--fw-semibold)\",\r\n  color: \"var(--fg)\",\r\n  marginBottom: \"var(--s-1)\",\r\n});\r\n\r\nconst POPOVER_BODY_SX = Object.freeze({\r\n  fontSize: \"var(--text-sm)\",\r\n  color: \"var(--fg-muted)\",\r\n  // --lh-loose = 1.6 (typography.js). Was `var(--lh-relaxed, 1.6)` —\r\n  // a dangling reference to a token that doesn't exist in the v2\r\n  // lineHeight scale (only tight/snug/normal/loose are emitted). The\r\n  // fallback `1.6` happened to match --lh-loose by coincidence; this\r\n  // makes the dependency explicit and lets future retuning flow.\r\n  lineHeight: \"var(--lh-loose)\",\r\n});\r\n\r\nfunction resolveVariant(\r\n  variant: FieldHelpVariant,\r\n  content: React.ReactNode,\r\n  title: React.ReactNode,\r\n): \"tooltip\" | \"popover\" {\r\n  if (variant !== \"auto\") return variant;\r\n  if (title) return \"popover\";\r\n  if (typeof content === \"string\" && content.length > HELP_THRESHOLD_CHARS) {\r\n    return \"popover\";\r\n  }\r\n  return \"tooltip\";\r\n}\r\n\r\nfunction FieldHelp({\r\n  content,\r\n  title,\r\n  variant = \"auto\",\r\n  icon = \"help\",\r\n  placement = \"top\",\r\n  ariaLabel = \"Aide\",\r\n}: FieldHelpProps) {\r\n  const [anchorEl, setAnchorEl] = React.useState<HTMLElement | null>(null);\r\n  // FH-1 — stable id so the dialog paper can be labelled by its visible\r\n  // title (used only when a title is rendered; see slotProps below).\r\n  const titleId = React.useId();\r\n\r\n  const effectiveVariant = resolveVariant(variant, content, title);\r\n  const IconComponent = icon === \"info\" ? InfoOutlinedIcon : HelpOutlineIcon;\r\n\r\n  if (effectiveVariant === \"tooltip\") {\r\n    return (\r\n      <Tooltip title={content} arrow placement={placement}>\r\n        <IconButton\r\n          size=\"small\"\r\n          aria-label={ariaLabel}\r\n          sx={HELP_ICON_SX}\r\n          tabIndex={0}\r\n        >\r\n          <IconComponent sx={{ fontSize: 16 }} />\r\n        </IconButton>\r\n      </Tooltip>\r\n    );\r\n  }\r\n\r\n  const handleOpen = (e: React.MouseEvent<HTMLElement>) => setAnchorEl(e.currentTarget);\r\n  const handleClose = () => setAnchorEl(null);\r\n  const open = !!anchorEl;\r\n\r\n  return (\r\n    <>\r\n      <IconButton\r\n        size=\"small\"\r\n        aria-label={ariaLabel}\r\n        // R-Ar.6 / WAI-ARIA disclosure pattern — surfaces the\r\n        // overlay nature of the trigger to assistive tech. Without\r\n        // these attrs SR users hear a generic \"Aide button\" with\r\n        // no indication that activation opens content.\r\n        aria-haspopup=\"dialog\"\r\n        aria-expanded={open}\r\n        onClick={handleOpen}\r\n        sx={HELP_ICON_SX}\r\n      >\r\n        <IconComponent sx={{ fontSize: 16 }} />\r\n      </IconButton>\r\n      <Popover\r\n        open={open}\r\n        anchorEl={anchorEl}\r\n        onClose={handleClose}\r\n        anchorOrigin={{ vertical: \"bottom\", horizontal: \"left\" }}\r\n        transformOrigin={{ vertical: \"top\", horizontal: \"left\" }}\r\n        slotProps={{\r\n          paper: {\r\n            sx: POPOVER_PAPER_SX,\r\n            // FH-1 — the trigger promises a dialog; make the paper one and\r\n            // name it. Prefer the visible title (aria-labelledby, avoids a\r\n            // Label-in-Name mismatch); fall back to the ariaLabel prop.\r\n            role: \"dialog\",\r\n            ...(title\r\n              ? { \"aria-labelledby\": titleId }\r\n              : { \"aria-label\": ariaLabel }),\r\n          },\r\n        }}\r\n      >\r\n        {title && (\r\n          <Box id={titleId} sx={POPOVER_TITLE_SX}>\r\n            {title}\r\n          </Box>\r\n        )}\r\n        <Box sx={POPOVER_BODY_SX}>{content}</Box>\r\n      </Popover>\r\n    </>\r\n  );\r\n}\r\n\r\nexport default FieldHelp;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"FieldHelp.js","names":["React","Tooltip","IconButton","Box","Popover","HelpOutlineIcon","InfoOutlinedIcon","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","HELP_THRESHOLD_CHARS","HELP_ICON_SX","Object","freeze","padding","color","marginInlineStart","background","POPOVER_PAPER_SX","maxWidth","borderRadius","border","boxShadow","POPOVER_TITLE_SX","fontSize","fontWeight","marginBottom","POPOVER_BODY_SX","lineHeight","resolveVariant","variant","content","title","length","FieldHelp","icon","placement","ariaLabel","anchorEl","setAnchorEl","useState","titleId","useId","effectiveVariant","IconComponent","arrow","children","size","sx","tabIndex","handleOpen","e","currentTarget","handleClose","open","onClick","onClose","anchorOrigin","vertical","horizontal","transformOrigin","slotProps","paper","role","id"],"sources":["../../../../src/lib/v2/components/FieldHelp.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport Tooltip from \"@mui/material/Tooltip\";\r\nimport type { TooltipProps } from \"@mui/material/Tooltip\";\r\nimport IconButton from \"@mui/material/IconButton\";\r\nimport Box from \"@mui/material/Box\";\r\nimport Popover from \"@mui/material/Popover\";\r\nimport HelpOutlineIcon from \"@mui/icons-material/HelpOutlineOutlined\";\r\nimport InfoOutlinedIcon from \"@mui/icons-material/InfoOutlined\";\r\n\r\n/**\r\n * FieldHelp - Portnet UI v2 (component)\r\n *\r\n * Charter §03 · Component \"FieldHelp · Contextual help\".\r\n *\r\n * A small icon-button affordance that hosts drop next to labels,\r\n * section titles, or anywhere a user might benefit from just-in-\r\n * time guidance without cluttering the primary visual hierarchy.\r\n *\r\n * Behaviour modes:\r\n *   - tooltip: MUI Tooltip (default for short string content).\r\n *   - popover: MUI Popover, click to open. Used when content is\r\n *     long (>80 chars) or when a distinct `title` is provided.\r\n *   - auto:    Picks tooltip vs popover via the heuristic above.\r\n *\r\n * Usage:\r\n *   <FieldHelp content=\"Référence unique de l'autorisation\" />\r\n *   <FieldHelp\r\n *     title=\"Détails\"\r\n *     content={<>Texte long avec <b>JSX</b>.</>}\r\n *     variant=\"popover\"\r\n *   />\r\n *\r\n * A11y (audit Batch 5, finding B5-1; Batch 19, FH-1):\r\n *   Popover variant trigger carries aria-haspopup=\"dialog\" +\r\n *   aria-expanded reflecting the open state — WAI-ARIA disclosure\r\n *   pattern. The Popover paper itself carries role=\"dialog\" and an\r\n *   accessible name (FH-1): aria-labelledby the visible title when\r\n *   one is rendered, else aria-label from the ariaLabel prop — so\r\n *   the region the trigger promises actually resolves as a named\r\n *   dialog to assistive tech. Tooltip variant relies on MUI\r\n *   Tooltip's automatic aria-describedby plumbing on the wrapped child.\r\n */\r\n\r\nexport type FieldHelpVariant = \"auto\" | \"tooltip\" | \"popover\";\r\nexport type FieldHelpIcon = \"help\" | \"info\";\r\n\r\nexport interface FieldHelpProps {\r\n  /** Help content (tooltip title or popover body). */\r\n  content: React.ReactNode;\r\n  /** Optional popover title. When present, forces the popover variant. */\r\n  title?: React.ReactNode | undefined;\r\n  /** @default \"auto\" */\r\n  variant?: FieldHelpVariant | undefined;\r\n  /** @default \"help\" */\r\n  icon?: FieldHelpIcon | undefined;\r\n  /** Tooltip placement. @default \"top\" */\r\n  placement?: TooltipProps[\"placement\"] | undefined;\r\n  /** @default \"Aide\" */\r\n  ariaLabel?: string | undefined;\r\n}\r\n\r\nconst HELP_THRESHOLD_CHARS = 80;\r\n\r\nconst HELP_ICON_SX = Object.freeze({\r\n  padding: \"2px\",\r\n  color: \"var(--fg-subtle)\",\r\n  marginInlineStart: \"var(--s-1)\",\r\n  \"&:hover, &:focus-visible\": {\r\n    color: \"var(--accent)\",\r\n    background: \"var(--bg-hover)\",\r\n  },\r\n});\r\n\r\nconst POPOVER_PAPER_SX = Object.freeze({\r\n  // Cap at 360 on desktop, but never exceed the viewport on small\r\n  // phones (320–392px): MUI Popover positions the anchor but does NOT\r\n  // shrink the paper width to the viewport, so a bare maxWidth:360\r\n  // overflows the screen edge and forces horizontal scroll (WCAG 1.4.10\r\n  // Reflow). The min() inset keeps the paper on screen with a single\r\n  // --s-4 gutter on either side.\r\n  maxWidth: \"min(360px, calc(100vw - var(--s-4) * 2))\",\r\n  padding: \"var(--s-4)\",\r\n  borderRadius: \"var(--r-md)\",\r\n  border: \"1px solid var(--border)\",\r\n  boxShadow: \"var(--shadow-md)\",\r\n});\r\n\r\nconst POPOVER_TITLE_SX = Object.freeze({\r\n  fontSize: \"var(--text-sm)\",\r\n  fontWeight: \"var(--fw-semibold)\",\r\n  color: \"var(--fg)\",\r\n  marginBottom: \"var(--s-1)\",\r\n});\r\n\r\nconst POPOVER_BODY_SX = Object.freeze({\r\n  fontSize: \"var(--text-sm)\",\r\n  color: \"var(--fg-muted)\",\r\n  // --lh-loose = 1.6 (typography.js). Was `var(--lh-relaxed, 1.6)` —\r\n  // a dangling reference to a token that doesn't exist in the v2\r\n  // lineHeight scale (only tight/snug/normal/loose are emitted). The\r\n  // fallback `1.6` happened to match --lh-loose by coincidence; this\r\n  // makes the dependency explicit and lets future retuning flow.\r\n  lineHeight: \"var(--lh-loose)\",\r\n});\r\n\r\nfunction resolveVariant(\r\n  variant: FieldHelpVariant,\r\n  content: React.ReactNode,\r\n  title: React.ReactNode,\r\n): \"tooltip\" | \"popover\" {\r\n  if (variant !== \"auto\") return variant;\r\n  if (title) return \"popover\";\r\n  if (typeof content === \"string\" && content.length > HELP_THRESHOLD_CHARS) {\r\n    return \"popover\";\r\n  }\r\n  return \"tooltip\";\r\n}\r\n\r\nfunction FieldHelp({\r\n  content,\r\n  title,\r\n  variant = \"auto\",\r\n  icon = \"help\",\r\n  placement = \"top\",\r\n  ariaLabel = \"Aide\",\r\n}: FieldHelpProps) {\r\n  const [anchorEl, setAnchorEl] = React.useState<HTMLElement | null>(null);\r\n  // FH-1 — stable id so the dialog paper can be labelled by its visible\r\n  // title (used only when a title is rendered; see slotProps below).\r\n  const titleId = React.useId();\r\n\r\n  const effectiveVariant = resolveVariant(variant, content, title);\r\n  const IconComponent = icon === \"info\" ? InfoOutlinedIcon : HelpOutlineIcon;\r\n\r\n  if (effectiveVariant === \"tooltip\") {\r\n    return (\r\n      <Tooltip title={content} arrow placement={placement}>\r\n        <IconButton\r\n          size=\"small\"\r\n          aria-label={ariaLabel}\r\n          sx={HELP_ICON_SX}\r\n          tabIndex={0}\r\n        >\r\n          <IconComponent sx={{ fontSize: 16 }} />\r\n        </IconButton>\r\n      </Tooltip>\r\n    );\r\n  }\r\n\r\n  const handleOpen = (e: React.MouseEvent<HTMLElement>) => setAnchorEl(e.currentTarget);\r\n  const handleClose = () => setAnchorEl(null);\r\n  const open = !!anchorEl;\r\n\r\n  return (\r\n    <>\r\n      <IconButton\r\n        size=\"small\"\r\n        aria-label={ariaLabel}\r\n        // R-Ar.6 / WAI-ARIA disclosure pattern — surfaces the\r\n        // overlay nature of the trigger to assistive tech. Without\r\n        // these attrs SR users hear a generic \"Aide button\" with\r\n        // no indication that activation opens content.\r\n        aria-haspopup=\"dialog\"\r\n        aria-expanded={open}\r\n        onClick={handleOpen}\r\n        sx={HELP_ICON_SX}\r\n      >\r\n        <IconComponent sx={{ fontSize: 16 }} />\r\n      </IconButton>\r\n      <Popover\r\n        open={open}\r\n        anchorEl={anchorEl}\r\n        onClose={handleClose}\r\n        anchorOrigin={{ vertical: \"bottom\", horizontal: \"left\" }}\r\n        transformOrigin={{ vertical: \"top\", horizontal: \"left\" }}\r\n        slotProps={{\r\n          paper: {\r\n            sx: POPOVER_PAPER_SX,\r\n            // FH-1 — the trigger promises a dialog; make the paper one and\r\n            // name it. Prefer the visible title (aria-labelledby, avoids a\r\n            // Label-in-Name mismatch); fall back to the ariaLabel prop.\r\n            role: \"dialog\",\r\n            ...(title\r\n              ? { \"aria-labelledby\": titleId }\r\n              : { \"aria-label\": ariaLabel }),\r\n          },\r\n        }}\r\n      >\r\n        {title && (\r\n          <Box id={titleId} sx={POPOVER_TITLE_SX}>\r\n            {title}\r\n          </Box>\r\n        )}\r\n        <Box sx={POPOVER_BODY_SX}>{content}</Box>\r\n      </Popover>\r\n    </>\r\n  );\r\n}\r\n\r\nexport default FieldHelp;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/v2/components/FileCard.js

@@ -1,9 +1,3 @@
-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); }
 import * as React from "react";
 import Box from "@mui/material/Box";
 import InsertDriveFileIcon from "@mui/icons-material/InsertDriveFileOutlined";
@@ -62,19 +56,20 @@ import Surface from "./Surface";
  * reachable on hover once it is ellipsized.
  */
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-function FileCard(_ref) {
-  var name = _ref.name,
-    meta = _ref.meta,
-    icon = _ref.icon,
-    actions = _ref.actions,
-    sx = _ref.sx;
-  return /*#__PURE__*/_jsx(Surface, _objectSpread(_objectSpread({
+function FileCard({
+  name,
+  meta,
+  icon,
+  actions,
+  sx
+}) {
+  return /*#__PURE__*/_jsx(Surface, {
     tone: "subtle",
     radius: "md",
-    padding: "compact"
-  }, sx !== undefined ? {
-    sx: sx
-  } : {}), {}, {
+    padding: "compact",
+    ...(sx !== undefined ? {
+      sx
+    } : {}),
     children: /*#__PURE__*/_jsxs(Box, {
       sx: {
         display: "flex",
@@ -110,7 +105,7 @@ function FileCard(_ref) {
               fontSize: "var(--text-display)"
             }
           },
-          children: icon !== null && icon !== void 0 ? icon : /*#__PURE__*/_jsx(InsertDriveFileIcon, {})
+          children: icon ?? /*#__PURE__*/_jsx(InsertDriveFileIcon, {})
         }), /*#__PURE__*/_jsxs(Box, {
           sx: {
             minWidth: 0
@@ -156,7 +151,7 @@ function FileCard(_ref) {
         children: actions
       })]
     })
-  }));
+  });
 }
 export default FileCard;
 //# sourceMappingURL=FileCard.js.map

package/dist/esm/v2/components/FileCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileCard.js","names":["React","Box","InsertDriveFileIcon","Surface","jsx","_jsx","jsxs","_jsxs","FileCard","_ref","name","meta","icon","actions","sx","_objectSpread","tone","radius","padding","undefined","children","display","alignItems","justifyContent","gap","minWidth","flex","component","flexShrink","color","fontSize","title","fontWeight","whiteSpace","overflow","textOverflow","fontVariantNumeric"],"sources":["../../../../src/lib/v2/components/FileCard.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport Box from \"@mui/material/Box\";\r\nimport type { SxProps, Theme } from \"@mui/material/styles\";\r\nimport InsertDriveFileIcon from \"@mui/icons-material/InsertDriveFileOutlined\";\r\nimport Surface from \"./Surface\";\r\n\r\n/**\r\n * FileCard — Portnet UI v2\r\n *\r\n * A single attached document, as a row: leading icon, filename, optional meta\r\n * line, action cluster on the trailing edge.\r\n *\r\n * ─────────────────────────────────────────────────────────────────────────────\r\n * WHY THIS BELONGS IN THE LIBRARY (capability gap G-12)\r\n *\r\n * The library shipped `Dropzone` — the UPLOAD affordance — and nothing for the\r\n * state right after it: the file, once attached, being displayed. So every\r\n * screen that shows an attachment rebuilt the same row. In addpe-fe it exists\r\n * THREE times, in three files, written by hand each time:\r\n *\r\n *   - Attachment (uploaded state)      padding --s-3 --s-4\r\n *   - AutorisationPreviewDrawer (tab)  padding --s-4\r\n *   - AutorisationDetail (tab)         padding --s-4 --s-5\r\n *\r\n * Read that padding column: three values for ONE concept. Nobody decided that —\r\n * it is what happens when a recipe is retyped from memory three times, and it is\r\n * exactly what Charter R-2.1 forbids (« un même concept = un même composant +\r\n * un même libellé partout »). This component standardises on the compact\r\n * `Surface` padding; the divergence was accidental, not intentional.\r\n *\r\n * The ellipsis logic is the other reason to own this. A filename is\r\n * user-supplied, arbitrarily long, and must truncate without pushing the action\r\n * buttons off the card — which needs `minWidth: 0` on the right ancestors and\r\n * `flexShrink: 0` on the wrong ones. Two of the three local copies had it; the\r\n * third relied on its container being wide enough.\r\n * ─────────────────────────────────────────────────────────────────────────────\r\n *\r\n *   <FileCard\r\n *     name={doc.documentName || \"Document.pdf\"}\r\n *     meta=\"248,50 Ko\"\r\n *     actions={\r\n *       <Button variant=\"secondary\" size=\"sm\" icon={<CloudDownload />} onClick={dl}>\r\n *         Télécharger\r\n *       </Button>\r\n *     }\r\n *   />\r\n *\r\n * Presentational by design: no href, no fetching, no delete confirmation. Hosts\r\n * own those (a blob URL, an API call, a `ConfirmDialog`) and pass the resulting\r\n * buttons through `actions`.\r\n *\r\n * `name` is REQUIRED and typed `string`, deliberately. A filename fallback\r\n * (\"Document.pdf\") is French copy and a business decision about what an unnamed\r\n * attachment is called — that belongs to the host, not to the design system, and\r\n * defaulting it here would silently hide a missing backend field. The `string`\r\n * type also lets the component set `title={name}` so the full filename stays\r\n * reachable on hover once it is ellipsized.\r\n */\r\n\r\nexport interface FileCardProps {\r\n  /** Filename. Ellipsized when it overflows; mirrored into `title`. */\r\n  name: string;\r\n  /**\r\n   * Secondary line — size, date, content type. Rendered with tabular numerals\r\n   * so a column of file sizes aligns (R-T.3).\r\n   */\r\n  meta?: React.ReactNode | undefined;\r\n  /**\r\n   * Leading icon. Defaults to a generic document glyph; pass a specific one when\r\n   * the card's primary action is what identifies it (a download cloud, say).\r\n   * Rendered `aria-hidden` — the filename is the accessible name (R-Ar.2).\r\n   */\r\n  icon?: React.ReactNode | undefined;\r\n  /** Trailing action cluster. Pass `Button`s; the card does not invent any. */\r\n  actions?: React.ReactNode | undefined;\r\n  sx?: SxProps<Theme> | undefined;\r\n}\r\n\r\nfunction FileCard({ name, meta, icon, actions, sx }: FileCardProps) {\r\n  return (\r\n    <Surface\r\n      tone=\"subtle\"\r\n      radius=\"md\"\r\n      padding=\"compact\"\r\n      {...(sx !== undefined ? { sx } : {})}\r\n    >\r\n      <Box\r\n        sx={{\r\n          display: \"flex\",\r\n          alignItems: \"center\",\r\n          justifyContent: \"space-between\",\r\n          gap: \"var(--s-3)\",\r\n        }}\r\n      >\r\n        {/* Identity block. `minWidth: 0` is load-bearing: without it a flex item\r\n            refuses to shrink below its content width and the filename pushes the\r\n            action cluster out of the card instead of truncating. */}\r\n        <Box\r\n          sx={{\r\n            display: \"flex\",\r\n            alignItems: \"center\",\r\n            gap: \"var(--s-3)\",\r\n            minWidth: 0,\r\n            flex: 1,\r\n          }}\r\n        >\r\n          <Box\r\n            component=\"span\"\r\n            aria-hidden=\"true\"\r\n            /* Test hook. The icon wrapper carries no role and no accessible\r\n             * name — by design — so there is no semantic query that can reach\r\n             * it, and the repo's eslint config rightly forbids container\r\n             * queries and direct node access in tests. A stable testid is the\r\n             * sanctioned escape hatch, and the contract it guards (R-Ar.2: a\r\n             * decorative glyph must NOT be announced) is worth a hook. */\r\n            data-testid=\"filecard-icon\"\r\n            sx={{\r\n              display: \"inline-flex\",\r\n              flexShrink: 0,\r\n              color: \"var(--accent)\",\r\n              // --text-display is the 26px token; the glyph sits at the optical\r\n              // scale the three local copies had converged on.\r\n              \"& > *\": { fontSize: \"var(--text-display)\" },\r\n            }}\r\n          >\r\n            {icon ?? <InsertDriveFileIcon />}\r\n          </Box>\r\n\r\n          <Box sx={{ minWidth: 0 }}>\r\n            <Box\r\n              title={name}\r\n              sx={{\r\n                fontSize: \"var(--text-sm)\",\r\n                fontWeight: \"var(--fw-semibold)\",\r\n                color: \"var(--fg)\",\r\n                whiteSpace: \"nowrap\",\r\n                overflow: \"hidden\",\r\n                textOverflow: \"ellipsis\",\r\n              }}\r\n            >\r\n              {name}\r\n            </Box>\r\n            {meta != null && meta !== \"\" && (\r\n              <Box\r\n                /* Test hook — same rationale as filecard-icon. The contract is\r\n                 * that this line is ABSENT rather than empty: a blank second\r\n                 * line reads as missing data and changes the row height, which\r\n                 * breaks the alignment of a list of files. \"Absent, not empty\"\r\n                 * cannot be expressed by a text query. */\r\n                data-testid=\"filecard-meta\"\r\n                sx={{\r\n                  fontSize: \"var(--text-xs)\",\r\n                  color: \"var(--fg-subtle)\",\r\n                  // R-T.3 — tabular numerals on any numeric run.\r\n                  fontVariantNumeric: \"tabular-nums\",\r\n                }}\r\n              >\r\n                {meta}\r\n              </Box>\r\n            )}\r\n          </Box>\r\n        </Box>\r\n\r\n        {actions != null && (\r\n          /* `flexShrink: 0` — the buttons keep their intrinsic width; it is the\r\n             filename that yields. The inverse produced squashed labels. */\r\n          <Box\r\n            sx={{\r\n              display: \"flex\",\r\n              alignItems: \"center\",\r\n              gap: \"var(--s-2)\",\r\n              flexShrink: 0,\r\n            }}\r\n          >\r\n            {actions}\r\n          </Box>\r\n        )}\r\n      </Box>\r\n    </Surface>\r\n  );\r\n}\r\n\r\nexport default FileCard;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"FileCard.js","names":["React","Box","InsertDriveFileIcon","Surface","jsx","_jsx","jsxs","_jsxs","FileCard","name","meta","icon","actions","sx","tone","radius","padding","undefined","children","display","alignItems","justifyContent","gap","minWidth","flex","component","flexShrink","color","fontSize","title","fontWeight","whiteSpace","overflow","textOverflow","fontVariantNumeric"],"sources":["../../../../src/lib/v2/components/FileCard.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport Box from \"@mui/material/Box\";\r\nimport type { SxProps, Theme } from \"@mui/material/styles\";\r\nimport InsertDriveFileIcon from \"@mui/icons-material/InsertDriveFileOutlined\";\r\nimport Surface from \"./Surface\";\r\n\r\n/**\r\n * FileCard — Portnet UI v2\r\n *\r\n * A single attached document, as a row: leading icon, filename, optional meta\r\n * line, action cluster on the trailing edge.\r\n *\r\n * ─────────────────────────────────────────────────────────────────────────────\r\n * WHY THIS BELONGS IN THE LIBRARY (capability gap G-12)\r\n *\r\n * The library shipped `Dropzone` — the UPLOAD affordance — and nothing for the\r\n * state right after it: the file, once attached, being displayed. So every\r\n * screen that shows an attachment rebuilt the same row. In addpe-fe it exists\r\n * THREE times, in three files, written by hand each time:\r\n *\r\n *   - Attachment (uploaded state)      padding --s-3 --s-4\r\n *   - AutorisationPreviewDrawer (tab)  padding --s-4\r\n *   - AutorisationDetail (tab)         padding --s-4 --s-5\r\n *\r\n * Read that padding column: three values for ONE concept. Nobody decided that —\r\n * it is what happens when a recipe is retyped from memory three times, and it is\r\n * exactly what Charter R-2.1 forbids (« un même concept = un même composant +\r\n * un même libellé partout »). This component standardises on the compact\r\n * `Surface` padding; the divergence was accidental, not intentional.\r\n *\r\n * The ellipsis logic is the other reason to own this. A filename is\r\n * user-supplied, arbitrarily long, and must truncate without pushing the action\r\n * buttons off the card — which needs `minWidth: 0` on the right ancestors and\r\n * `flexShrink: 0` on the wrong ones. Two of the three local copies had it; the\r\n * third relied on its container being wide enough.\r\n * ─────────────────────────────────────────────────────────────────────────────\r\n *\r\n *   <FileCard\r\n *     name={doc.documentName || \"Document.pdf\"}\r\n *     meta=\"248,50 Ko\"\r\n *     actions={\r\n *       <Button variant=\"secondary\" size=\"sm\" icon={<CloudDownload />} onClick={dl}>\r\n *         Télécharger\r\n *       </Button>\r\n *     }\r\n *   />\r\n *\r\n * Presentational by design: no href, no fetching, no delete confirmation. Hosts\r\n * own those (a blob URL, an API call, a `ConfirmDialog`) and pass the resulting\r\n * buttons through `actions`.\r\n *\r\n * `name` is REQUIRED and typed `string`, deliberately. A filename fallback\r\n * (\"Document.pdf\") is French copy and a business decision about what an unnamed\r\n * attachment is called — that belongs to the host, not to the design system, and\r\n * defaulting it here would silently hide a missing backend field. The `string`\r\n * type also lets the component set `title={name}` so the full filename stays\r\n * reachable on hover once it is ellipsized.\r\n */\r\n\r\nexport interface FileCardProps {\r\n  /** Filename. Ellipsized when it overflows; mirrored into `title`. */\r\n  name: string;\r\n  /**\r\n   * Secondary line — size, date, content type. Rendered with tabular numerals\r\n   * so a column of file sizes aligns (R-T.3).\r\n   */\r\n  meta?: React.ReactNode | undefined;\r\n  /**\r\n   * Leading icon. Defaults to a generic document glyph; pass a specific one when\r\n   * the card's primary action is what identifies it (a download cloud, say).\r\n   * Rendered `aria-hidden` — the filename is the accessible name (R-Ar.2).\r\n   */\r\n  icon?: React.ReactNode | undefined;\r\n  /** Trailing action cluster. Pass `Button`s; the card does not invent any. */\r\n  actions?: React.ReactNode | undefined;\r\n  sx?: SxProps<Theme> | undefined;\r\n}\r\n\r\nfunction FileCard({ name, meta, icon, actions, sx }: FileCardProps) {\r\n  return (\r\n    <Surface\r\n      tone=\"subtle\"\r\n      radius=\"md\"\r\n      padding=\"compact\"\r\n      {...(sx !== undefined ? { sx } : {})}\r\n    >\r\n      <Box\r\n        sx={{\r\n          display: \"flex\",\r\n          alignItems: \"center\",\r\n          justifyContent: \"space-between\",\r\n          gap: \"var(--s-3)\",\r\n        }}\r\n      >\r\n        {/* Identity block. `minWidth: 0` is load-bearing: without it a flex item\r\n            refuses to shrink below its content width and the filename pushes the\r\n            action cluster out of the card instead of truncating. */}\r\n        <Box\r\n          sx={{\r\n            display: \"flex\",\r\n            alignItems: \"center\",\r\n            gap: \"var(--s-3)\",\r\n            minWidth: 0,\r\n            flex: 1,\r\n          }}\r\n        >\r\n          <Box\r\n            component=\"span\"\r\n            aria-hidden=\"true\"\r\n            /* Test hook. The icon wrapper carries no role and no accessible\r\n             * name — by design — so there is no semantic query that can reach\r\n             * it, and the repo's eslint config rightly forbids container\r\n             * queries and direct node access in tests. A stable testid is the\r\n             * sanctioned escape hatch, and the contract it guards (R-Ar.2: a\r\n             * decorative glyph must NOT be announced) is worth a hook. */\r\n            data-testid=\"filecard-icon\"\r\n            sx={{\r\n              display: \"inline-flex\",\r\n              flexShrink: 0,\r\n              color: \"var(--accent)\",\r\n              // --text-display is the 26px token; the glyph sits at the optical\r\n              // scale the three local copies had converged on.\r\n              \"& > *\": { fontSize: \"var(--text-display)\" },\r\n            }}\r\n          >\r\n            {icon ?? <InsertDriveFileIcon />}\r\n          </Box>\r\n\r\n          <Box sx={{ minWidth: 0 }}>\r\n            <Box\r\n              title={name}\r\n              sx={{\r\n                fontSize: \"var(--text-sm)\",\r\n                fontWeight: \"var(--fw-semibold)\",\r\n                color: \"var(--fg)\",\r\n                whiteSpace: \"nowrap\",\r\n                overflow: \"hidden\",\r\n                textOverflow: \"ellipsis\",\r\n              }}\r\n            >\r\n              {name}\r\n            </Box>\r\n            {meta != null && meta !== \"\" && (\r\n              <Box\r\n                /* Test hook — same rationale as filecard-icon. The contract is\r\n                 * that this line is ABSENT rather than empty: a blank second\r\n                 * line reads as missing data and changes the row height, which\r\n                 * breaks the alignment of a list of files. \"Absent, not empty\"\r\n                 * cannot be expressed by a text query. */\r\n                data-testid=\"filecard-meta\"\r\n                sx={{\r\n                  fontSize: \"var(--text-xs)\",\r\n                  color: \"var(--fg-subtle)\",\r\n                  // R-T.3 — tabular numerals on any numeric run.\r\n                  fontVariantNumeric: \"tabular-nums\",\r\n                }}\r\n              >\r\n                {meta}\r\n              </Box>\r\n            )}\r\n          </Box>\r\n        </Box>\r\n\r\n        {actions != null && (\r\n          /* `flexShrink: 0` — the buttons keep their intrinsic width; it is the\r\n             filename that yields. The inverse produced squashed labels. */\r\n          <Box\r\n            sx={{\r\n              display: \"flex\",\r\n              alignItems: \"center\",\r\n              gap: \"var(--s-2)\",\r\n              flexShrink: 0,\r\n            }}\r\n          >\r\n            {actions}\r\n          </Box>\r\n        )}\r\n      </Box>\r\n    </Surface>\r\n  );\r\n}\r\n\r\nexport default FileCard;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/v2/components/FilterTab.js

@@ -1,9 +1,3 @@
-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); }
 import * as React from "react";
 import Box from "@mui/material/Box";
 import { mergeLabels } from "../utils/mergeLabels";
@@ -28,12 +22,12 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Module-scoped to avoid Temporal Dead Zone when an invalid `variant` is
 // passed: a local-const initialiser referencing palette.neutral before
 // palette finished initialising would throw ReferenceError.
-var PALETTES = {
+const PALETTES = {
   neutral: {
     activeBg: "var(--accent-soft)",
     activeFg: "var(--accent)"
   },
-  "new": {
+  new: {
     activeBg: "var(--status-new-soft)",
     activeFg: "var(--status-new-fg)"
   },
@@ -54,26 +48,21 @@ var PALETTES = {
     activeFg: "var(--status-rejected-fg)"
   }
 };
-var DEFAULT_LABELS = Object.freeze({
-  countLabel: function countLabel(n) {
-    return "".concat(n, " \xE9l\xE9ments");
-  },
-  shortcutHint: function shortcutHint(s) {
-    return "Raccourci : ".concat(s);
-  }
+const DEFAULT_LABELS = Object.freeze({
+  countLabel: n => `${n} éléments`,
+  shortcutHint: s => `Raccourci : ${s}`
 });
-function FilterTab(_ref) {
-  var _ref$active = _ref.active,
-    active = _ref$active === void 0 ? false : _ref$active,
-    count = _ref.count,
-    _ref$variant = _ref.variant,
-    variant = _ref$variant === void 0 ? "neutral" : _ref$variant,
-    onClick = _ref.onClick,
-    shortcut = _ref.shortcut,
-    labels = _ref.labels,
-    children = _ref.children;
-  var palette = PALETTES[variant] || PALETTES.neutral;
-  var L = mergeLabels(DEFAULT_LABELS, labels);
+function FilterTab({
+  active = false,
+  count,
+  variant = "neutral",
+  onClick,
+  shortcut,
+  labels,
+  children
+}) {
+  const palette = PALETTES[variant] || PALETTES.neutral;
+  const L = mergeLabels(DEFAULT_LABELS, labels);
   return /*#__PURE__*/_jsxs(Box, {
     component: "button",
     type: "button",
@@ -88,7 +77,7 @@ function FilterTab(_ref) {
       // the spacing scale so any future rescale propagates.
       padding: "calc(var(--s-1) + 1px) var(--s-3)",
       borderRadius: "var(--r-full)",
-      border: "1px solid ".concat(active ? "var(--accent)" : "var(--border)"),
+      border: `1px solid ${active ? "var(--accent)" : "var(--border)"}`,
       background: active ? palette.activeBg : "var(--surface)",
       color: active ? palette.activeFg : "var(--fg-muted)",
       fontSize: "var(--text-xs)",
@@ -105,9 +94,11 @@ function FilterTab(_ref) {
         outline: "2px solid var(--accent)",
         outlineOffset: "var(--pui-outline-offset)"
       },
-      "&:hover": _objectSpread({}, !active ? {
-        background: "var(--bg-hover)"
-      } : {})
+      "&:hover": {
+        ...(!active ? {
+          background: "var(--bg-hover)"
+        } : {})
+      }
     },
     children: [/*#__PURE__*/_jsx("span", {
       children: children

package/dist/esm/v2/components/FilterTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterTab.js","names":["React","Box","mergeLabels","jsx","_jsx","jsxs","_jsxs","PALETTES","neutral","activeBg","activeFg","sent","pending","approved","rejected","DEFAULT_LABELS","Object","freeze","countLabel","n","concat","shortcutHint","s","FilterTab","_ref","_ref$active","active","count","_ref$variant","variant","onClick","shortcut","labels","children","palette","L","component","type","title","undefined","sx","display","alignItems","gap","padding","borderRadius","border","background","color","fontSize","fontWeight","cursor","fontFamily","transition","outline","outlineOffset","_objectSpread","minWidth","lineHeight","textAlign"],"sources":["../../../../src/lib/v2/components/FilterTab.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport Box from \"@mui/material/Box\";\r\nimport { mergeLabels } from \"../utils/mergeLabels\";\r\n\r\n/**\r\n * FilterTab - Portnet UI v2\r\n *\r\n * Charter §03 · Component \"FilterTabs\". Pills used to quickly filter a list\r\n * by status, with an active-state count and pop animation on update.\r\n *\r\n *   <FilterTab active={filter === \"all\"} count={42} onClick={() => setFilter(\"all\")}>\r\n *     Tous\r\n *   </FilterTab>\r\n *\r\n * Localisation (FR / EN / AR):\r\n *   <FilterTab labels={{\r\n *     countLabel:   (n) => `${n} items`,\r\n *     shortcutHint: (s) => `Shortcut: ${s}`,\r\n *   }} ... />\r\n */\r\n\r\nexport type FilterTabVariant =\r\n  | \"neutral\"\r\n  | \"new\"\r\n  | \"sent\"\r\n  | \"pending\"\r\n  | \"approved\"\r\n  | \"rejected\";\r\n\r\ninterface PaletteEntry {\r\n  activeBg: string;\r\n  activeFg: string;\r\n}\r\n\r\n// Module-scoped to avoid Temporal Dead Zone when an invalid `variant` is\r\n// passed: a local-const initialiser referencing palette.neutral before\r\n// palette finished initialising would throw ReferenceError.\r\nconst PALETTES: Record<FilterTabVariant, PaletteEntry> = {\r\n  neutral:  { activeBg: \"var(--accent-soft)\",          activeFg: \"var(--accent)\" },\r\n  new:      { activeBg: \"var(--status-new-soft)\",      activeFg: \"var(--status-new-fg)\" },\r\n  sent:     { activeBg: \"var(--status-sent-soft)\",     activeFg: \"var(--status-sent-fg)\" },\r\n  pending:  { activeBg: \"var(--status-pending-soft)\",  activeFg: \"var(--status-pending-fg)\" },\r\n  approved: { activeBg: \"var(--status-approved-soft)\", activeFg: \"var(--status-approved-fg)\" },\r\n  rejected: { activeBg: \"var(--status-rejected-soft)\", activeFg: \"var(--status-rejected-fg)\" },\r\n};\r\n\r\nconst DEFAULT_LABELS = Object.freeze({\r\n  countLabel:   (n: number): string => `${n} éléments`,\r\n  shortcutHint: (s: string): string => `Raccourci : ${s}`,\r\n});\r\n\r\nexport interface FilterTabLabels {\r\n  countLabel?: ((n: number) => string) | undefined;\r\n  shortcutHint?: ((s: string) => string) | undefined;\r\n}\r\n\r\nexport interface FilterTabProps {\r\n  active?: boolean | undefined;\r\n  count?: number | undefined;\r\n  /** neutral | new | sent | pending | approved | rejected */\r\n  variant?: FilterTabVariant | undefined;\r\n  onClick?: React.MouseEventHandler<HTMLButtonElement> | undefined;\r\n  shortcut?: string | undefined;\r\n  labels?: FilterTabLabels | undefined;\r\n  children?: React.ReactNode | undefined;\r\n}\r\n\r\nfunction FilterTab({\r\n  active = false,\r\n  count,\r\n  variant = \"neutral\",\r\n  onClick,\r\n  shortcut,\r\n  labels,\r\n  children,\r\n}: FilterTabProps) {\r\n  const palette = PALETTES[variant] || PALETTES.neutral;\r\n  const L = mergeLabels(DEFAULT_LABELS, labels);\r\n\r\n  return (\r\n    <Box\r\n      component=\"button\"\r\n      type=\"button\"\r\n      aria-pressed={active}\r\n      onClick={onClick}\r\n      title={shortcut ? L.shortcutHint(shortcut) : undefined}\r\n      sx={{\r\n        display: \"inline-flex\",\r\n        alignItems: \"center\",\r\n        gap: \"var(--s-2)\",\r\n        // Compact pill: 5/12 px in literal terms, expressed against\r\n        // the spacing scale so any future rescale propagates.\r\n        padding: \"calc(var(--s-1) + 1px) var(--s-3)\",\r\n        borderRadius: \"var(--r-full)\",\r\n        border: `1px solid ${active ? \"var(--accent)\" : \"var(--border)\"}`,\r\n        background: active ? palette.activeBg : \"var(--surface)\",\r\n        color: active ? palette.activeFg : \"var(--fg-muted)\",\r\n        fontSize: \"var(--text-xs)\",\r\n        // Was 650 (banned) / 500. var(--fw-semibold) is the canonical\r\n        // emphasised weight; var(--fw-medium) the resting one.\r\n        fontWeight: active ? \"var(--fw-semibold)\" : \"var(--fw-medium)\",\r\n        cursor: \"pointer\",\r\n        fontFamily: \"inherit\",\r\n        transition:\r\n          \"background var(--duration-fast, 120ms) ease, \" +\r\n          \"color var(--duration-fast, 120ms) ease, \" +\r\n          \"border-color var(--duration-fast, 120ms) ease\",\r\n        // R-F.1 - focus-visible required, charter §05. The previous\r\n        // implementation had NO focus style; keyboard users got no\r\n        // feedback when tabbing through filter chips.\r\n        \"&:focus-visible\": {\r\n          outline: \"2px solid var(--accent)\",\r\n          outlineOffset: \"var(--pui-outline-offset)\",\r\n        },\r\n        \"&:hover\": {\r\n          ...(!active ? { background: \"var(--bg-hover)\" } : {}),\r\n        },\r\n      }}\r\n    >\r\n      <span>{children}</span>\r\n      {count != null && (\r\n        <Box\r\n          component=\"span\"\r\n          aria-label={L.countLabel(count)}\r\n          sx={{\r\n            display: \"inline-block\",\r\n            minWidth: 16,\r\n            padding: \"0 var(--s-1)\",\r\n            fontSize: \"var(--text-xs)\",\r\n            fontWeight: \"var(--fw-bold)\",\r\n            // Active keeps the accent emphasis (unchanged). Inactive now\r\n            // takes the variant palette (soft bg + status fg) so status\r\n            // counts stay colour-coded instead of greying out; neutral\r\n            // resolves to accent-soft / accent.\r\n            background: active ? \"var(--accent)\" : palette.activeBg,\r\n            color: active ? \"var(--accent-fg)\" : palette.activeFg,\r\n            borderRadius: \"var(--r-full)\",\r\n            lineHeight: \"var(--lh-snug)\",\r\n            textAlign: \"center\",\r\n          }}\r\n        >\r\n          {count}\r\n        </Box>\r\n      )}\r\n    </Box>\r\n  );\r\n}\r\n\r\nexport default FilterTab;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"FilterTab.js","names":["React","Box","mergeLabels","jsx","_jsx","jsxs","_jsxs","PALETTES","neutral","activeBg","activeFg","new","sent","pending","approved","rejected","DEFAULT_LABELS","Object","freeze","countLabel","n","shortcutHint","s","FilterTab","active","count","variant","onClick","shortcut","labels","children","palette","L","component","type","title","undefined","sx","display","alignItems","gap","padding","borderRadius","border","background","color","fontSize","fontWeight","cursor","fontFamily","transition","outline","outlineOffset","minWidth","lineHeight","textAlign"],"sources":["../../../../src/lib/v2/components/FilterTab.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport Box from \"@mui/material/Box\";\r\nimport { mergeLabels } from \"../utils/mergeLabels\";\r\n\r\n/**\r\n * FilterTab - Portnet UI v2\r\n *\r\n * Charter §03 · Component \"FilterTabs\". Pills used to quickly filter a list\r\n * by status, with an active-state count and pop animation on update.\r\n *\r\n *   <FilterTab active={filter === \"all\"} count={42} onClick={() => setFilter(\"all\")}>\r\n *     Tous\r\n *   </FilterTab>\r\n *\r\n * Localisation (FR / EN / AR):\r\n *   <FilterTab labels={{\r\n *     countLabel:   (n) => `${n} items`,\r\n *     shortcutHint: (s) => `Shortcut: ${s}`,\r\n *   }} ... />\r\n */\r\n\r\nexport type FilterTabVariant =\r\n  | \"neutral\"\r\n  | \"new\"\r\n  | \"sent\"\r\n  | \"pending\"\r\n  | \"approved\"\r\n  | \"rejected\";\r\n\r\ninterface PaletteEntry {\r\n  activeBg: string;\r\n  activeFg: string;\r\n}\r\n\r\n// Module-scoped to avoid Temporal Dead Zone when an invalid `variant` is\r\n// passed: a local-const initialiser referencing palette.neutral before\r\n// palette finished initialising would throw ReferenceError.\r\nconst PALETTES: Record<FilterTabVariant, PaletteEntry> = {\r\n  neutral:  { activeBg: \"var(--accent-soft)\",          activeFg: \"var(--accent)\" },\r\n  new:      { activeBg: \"var(--status-new-soft)\",      activeFg: \"var(--status-new-fg)\" },\r\n  sent:     { activeBg: \"var(--status-sent-soft)\",     activeFg: \"var(--status-sent-fg)\" },\r\n  pending:  { activeBg: \"var(--status-pending-soft)\",  activeFg: \"var(--status-pending-fg)\" },\r\n  approved: { activeBg: \"var(--status-approved-soft)\", activeFg: \"var(--status-approved-fg)\" },\r\n  rejected: { activeBg: \"var(--status-rejected-soft)\", activeFg: \"var(--status-rejected-fg)\" },\r\n};\r\n\r\nconst DEFAULT_LABELS = Object.freeze({\r\n  countLabel:   (n: number): string => `${n} éléments`,\r\n  shortcutHint: (s: string): string => `Raccourci : ${s}`,\r\n});\r\n\r\nexport interface FilterTabLabels {\r\n  countLabel?: ((n: number) => string) | undefined;\r\n  shortcutHint?: ((s: string) => string) | undefined;\r\n}\r\n\r\nexport interface FilterTabProps {\r\n  active?: boolean | undefined;\r\n  count?: number | undefined;\r\n  /** neutral | new | sent | pending | approved | rejected */\r\n  variant?: FilterTabVariant | undefined;\r\n  onClick?: React.MouseEventHandler<HTMLButtonElement> | undefined;\r\n  shortcut?: string | undefined;\r\n  labels?: FilterTabLabels | undefined;\r\n  children?: React.ReactNode | undefined;\r\n}\r\n\r\nfunction FilterTab({\r\n  active = false,\r\n  count,\r\n  variant = \"neutral\",\r\n  onClick,\r\n  shortcut,\r\n  labels,\r\n  children,\r\n}: FilterTabProps) {\r\n  const palette = PALETTES[variant] || PALETTES.neutral;\r\n  const L = mergeLabels(DEFAULT_LABELS, labels);\r\n\r\n  return (\r\n    <Box\r\n      component=\"button\"\r\n      type=\"button\"\r\n      aria-pressed={active}\r\n      onClick={onClick}\r\n      title={shortcut ? L.shortcutHint(shortcut) : undefined}\r\n      sx={{\r\n        display: \"inline-flex\",\r\n        alignItems: \"center\",\r\n        gap: \"var(--s-2)\",\r\n        // Compact pill: 5/12 px in literal terms, expressed against\r\n        // the spacing scale so any future rescale propagates.\r\n        padding: \"calc(var(--s-1) + 1px) var(--s-3)\",\r\n        borderRadius: \"var(--r-full)\",\r\n        border: `1px solid ${active ? \"var(--accent)\" : \"var(--border)\"}`,\r\n        background: active ? palette.activeBg : \"var(--surface)\",\r\n        color: active ? palette.activeFg : \"var(--fg-muted)\",\r\n        fontSize: \"var(--text-xs)\",\r\n        // Was 650 (banned) / 500. var(--fw-semibold) is the canonical\r\n        // emphasised weight; var(--fw-medium) the resting one.\r\n        fontWeight: active ? \"var(--fw-semibold)\" : \"var(--fw-medium)\",\r\n        cursor: \"pointer\",\r\n        fontFamily: \"inherit\",\r\n        transition:\r\n          \"background var(--duration-fast, 120ms) ease, \" +\r\n          \"color var(--duration-fast, 120ms) ease, \" +\r\n          \"border-color var(--duration-fast, 120ms) ease\",\r\n        // R-F.1 - focus-visible required, charter §05. The previous\r\n        // implementation had NO focus style; keyboard users got no\r\n        // feedback when tabbing through filter chips.\r\n        \"&:focus-visible\": {\r\n          outline: \"2px solid var(--accent)\",\r\n          outlineOffset: \"var(--pui-outline-offset)\",\r\n        },\r\n        \"&:hover\": {\r\n          ...(!active ? { background: \"var(--bg-hover)\" } : {}),\r\n        },\r\n      }}\r\n    >\r\n      <span>{children}</span>\r\n      {count != null && (\r\n        <Box\r\n          component=\"span\"\r\n          aria-label={L.countLabel(count)}\r\n          sx={{\r\n            display: \"inline-block\",\r\n            minWidth: 16,\r\n            padding: \"0 var(--s-1)\",\r\n            fontSize: \"var(--text-xs)\",\r\n            fontWeight: \"var(--fw-bold)\",\r\n            // Active keeps the accent emphasis (unchanged). Inactive now\r\n            // takes the variant palette (soft bg + status fg) so status\r\n            // counts stay colour-coded instead of greying out; neutral\r\n            // resolves to accent-soft / accent.\r\n            background: active ? \"var(--accent)\" : palette.activeBg,\r\n            color: active ? \"var(--accent-fg)\" : palette.activeFg,\r\n            borderRadius: \"var(--r-full)\",\r\n            lineHeight: \"var(--lh-snug)\",\r\n            textAlign: \"center\",\r\n          }}\r\n        >\r\n          {count}\r\n        </Box>\r\n      )}\r\n    </Box>\r\n  );\r\n}\r\n\r\nexport default FilterTab;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/v2/components/ForbiddenPage.js

@@ -4,6 +4,7 @@ import LockOutlined from "@mui/icons-material/LockOutlined";
 import ActionBar from "../patterns/ActionBar";
 import Button from "./Button";
 import ErrorPageBody from "./_ErrorPageBody";
+import { mergeLabels } from "../utils/mergeLabels";
 
 /**
  * ForbiddenPage — Portnet UI v2 (component)
@@ -30,6 +31,14 @@ import ErrorPageBody from "./_ErrorPageBody";
  *     );
  *   }
  *
+ * Localisation (P-4):
+ *   Every visible string is overridable through `labels`, defaulting
+ *   to French. The shape is shared across the four error pages, so a
+ *   host can build one translation object and spread it into each:
+ *
+ *     const t = { breadcrumbRoot: "Error", home: "Back to home", … };
+ *     <ForbiddenPage labels={{ ...t, title: "Access denied", … }} … />
+ *
  * Charter rules satisfied:
  *   R-2.1   no local UI primitive (composes ActionBar + Button only).
  *   R-Tg.1  44 px tactile floor enforced by v2.Button.
@@ -37,14 +46,25 @@ import ErrorPageBody from "./_ErrorPageBody";
  *   R-T.2   contrast verified for var(--fg) on var(--bg).
  */
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-function ForbiddenPage(_ref) {
-  var onBack = _ref.onBack,
-    onHome = _ref.onHome;
+const DEFAULT_LABELS = Object.freeze({
+  breadcrumbRoot: "Erreur",
+  breadcrumbCurrent: "Accès refusé",
+  title: "Accès refusé",
+  heading: "Vous n'avez pas accès à cette page",
+  description: "Votre profil ne dispose pas des autorisations nécessaires pour consulter cette page. Contactez votre administrateur si vous pensez qu'il s'agit d'une erreur, puis revenez à l'accueil.",
+  home: "Retour à l'accueil"
+});
+function ForbiddenPage({
+  onBack,
+  onHome,
+  labels
+}) {
+  const L = mergeLabels(DEFAULT_LABELS, labels);
   return /*#__PURE__*/_jsxs(_Fragment, {
     children: [/*#__PURE__*/_jsx(ActionBar, {
       back: onBack,
-      breadcrumb: ["Erreur", "Accès refusé"],
-      title: "Acc\xE8s refus\xE9"
+      breadcrumb: [L.breadcrumbRoot, L.breadcrumbCurrent],
+      title: L.title
     }), /*#__PURE__*/_jsx(ErrorPageBody, {
       icon: /*#__PURE__*/_jsx(LockOutlined, {
         sx: {
@@ -53,8 +73,8 @@ function ForbiddenPage(_ref) {
         }
       }),
       code: "403",
-      title: "Vous n'avez pas acc\xE8s \xE0 cette page",
-      description: "Votre profil ne dispose pas des autorisations n\xE9cessaires pour consulter cette page. Contactez votre administrateur si vous pensez qu'il s'agit d'une erreur, puis revenez \xE0 l'accueil."
+      title: L.heading,
+      description: L.description
     }), /*#__PURE__*/_jsx(Box, {
       sx: {
         display: "flex",
@@ -65,7 +85,7 @@ function ForbiddenPage(_ref) {
         variant: "primary",
         icon: /*#__PURE__*/_jsx(ArrowBack, {}),
         onClick: onHome,
-        children: "Retour \xE0 l'accueil"
+        children: L.home
       })
     })]
   });

package/dist/esm/v2/components/ForbiddenPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ForbiddenPage.js","names":["Box","ArrowBack","LockOutlined","ActionBar","Button","ErrorPageBody","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ForbiddenPage","_ref","onBack","onHome","children","back","breadcrumb","title","icon","sx","fontSize","color","code","description","display","justifyContent","paddingBottom","variant","onClick"],"sources":["../../../../src/lib/v2/components/ForbiddenPage.tsx"],"sourcesContent":["import Box from \"@mui/material/Box\";\r\nimport ArrowBack from \"@mui/icons-material/ArrowBack\";\r\nimport LockOutlined from \"@mui/icons-material/LockOutlined\";\r\nimport ActionBar from \"../patterns/ActionBar\";\r\nimport Button from \"./Button\";\r\nimport ErrorPageBody from \"./_ErrorPageBody\";\r\n\r\n/**\r\n * ForbiddenPage — Portnet UI v2 (component)\r\n *\r\n * Charter §07 · 403 / Accès refusé.\r\n *\r\n * Router-agnostic by design: the page accepts `onBack` and `onHome`\r\n * callback props rather than calling a router hook itself. This\r\n * keeps the design system independent of any specific routing lib\r\n * (react-router, TanStack Router, Next.js, …).\r\n *\r\n * Usage:\r\n *\r\n *   import { ForbiddenPage } from \"@portnet/ui/lib/v2\";\r\n *   import { useNavigate } from \"react-router-dom\";\r\n *\r\n *   function ForbiddenRoute() {\r\n *     const navigate = useNavigate();\r\n *     return (\r\n *       <ForbiddenPage\r\n *         onBack={() => navigate(-1)}\r\n *         onHome={() => navigate(\"/\")}\r\n *       />\r\n *     );\r\n *   }\r\n *\r\n * Charter rules satisfied:\r\n *   R-2.1   no local UI primitive (composes ActionBar + Button only).\r\n *   R-Tg.1  44 px tactile floor enforced by v2.Button.\r\n *   R-A.1   ARIA landmarks via ActionBar's <header role=\"banner\">.\r\n *   R-T.2   contrast verified for var(--fg) on var(--bg).\r\n */\r\nexport interface ForbiddenPageProps {\r\n  /** Callback for the back button (top-bar arrow). */\r\n  onBack: () => void;\r\n  /** Callback for the primary \"Retour à l'accueil\" CTA. */\r\n  onHome: () => void;\r\n}\r\n\r\nfunction ForbiddenPage({ onBack, onHome }: ForbiddenPageProps) {\r\n  return (\r\n    <>\r\n      <ActionBar\r\n        back={onBack}\r\n        breadcrumb={[\"Erreur\", \"Accès refusé\"]}\r\n        title=\"Accès refusé\"\r\n      />\r\n      <ErrorPageBody\r\n        icon={<LockOutlined sx={{ fontSize: 64, color: \"var(--warning)\" }} />}\r\n        code=\"403\"\r\n        title=\"Vous n'avez pas accès à cette page\"\r\n        description=\"Votre profil ne dispose pas des autorisations nécessaires pour consulter cette page. Contactez votre administrateur si vous pensez qu'il s'agit d'une erreur, puis revenez à l'accueil.\"\r\n      />\r\n      <Box sx={{ display: \"flex\", justifyContent: \"center\", paddingBottom: \"var(--s-7)\" }}>\r\n        <Button variant=\"primary\" icon={<ArrowBack />} onClick={onHome}>\r\n          Retour à l'accueil\r\n        </Button>\r\n      </Box>\r\n    </>\r\n  );\r\n}\r\n\r\nexport default ForbiddenPage;\r\n"],"mappings":"AAAA,OAAOA,GAAG,MAAM,mBAAmB;AACnC,OAAOC,SAAS,MAAM,+BAA+B;AACrD,OAAOC,YAAY,MAAM,kCAAkC;AAC3D,OAAOC,SAAS,MAAM,uBAAuB;AAC7C,OAAOC,MAAM,MAAM,UAAU;AAC7B,OAAOC,aAAa,MAAM,kBAAkB;;AAE5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA9BA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA,EAAAC,IAAA,IAAAC,KAAA;AAsCA,SAASC,aAAaA,CAAAC,IAAA,EAAyC;EAAA,IAAtCC,MAAM,GAAAD,IAAA,CAANC,MAAM;IAAEC,MAAM,GAAAF,IAAA,CAANE,MAAM;EACrC,oBACEJ,KAAA,CAAAF,SAAA;IAAAO,QAAA,gBACET,IAAA,CAACJ,SAAS;MACRc,IAAI,EAAEH,MAAO;MACbI,UAAU,EAAE,CAAC,QAAQ,EAAE,cAAc,CAAE;MACvCC,KAAK,EAAC;IAAc,CACrB,CAAC,eACFZ,IAAA,CAACF,aAAa;MACZe,IAAI,eAAEb,IAAA,CAACL,YAAY;QAACmB,EAAE,EAAE;UAAEC,QAAQ,EAAE,EAAE;UAAEC,KAAK,EAAE;QAAiB;MAAE,CAAE,CAAE;MACtEC,IAAI,EAAC,KAAK;MACVL,KAAK,EAAC,0CAAoC;MAC1CM,WAAW,EAAC;IAAyL,CACtM,CAAC,eACFlB,IAAA,CAACP,GAAG;MAACqB,EAAE,EAAE;QAAEK,OAAO,EAAE,MAAM;QAAEC,cAAc,EAAE,QAAQ;QAAEC,aAAa,EAAE;MAAa,CAAE;MAAAZ,QAAA,eAClFT,IAAA,CAACH,MAAM;QAACyB,OAAO,EAAC,SAAS;QAACT,IAAI,eAAEb,IAAA,CAACN,SAAS,IAAE,CAAE;QAAC6B,OAAO,EAAEf,MAAO;QAAAC,QAAA,EAAC;MAEhE,CAAQ;IAAC,CACN,CAAC;EAAA,CACN,CAAC;AAEP;AAEA,eAAeJ,aAAa","ignoreList":[]}
+{"version":3,"file":"ForbiddenPage.js","names":["Box","ArrowBack","LockOutlined","ActionBar","Button","ErrorPageBody","mergeLabels","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","DEFAULT_LABELS","Object","freeze","breadcrumbRoot","breadcrumbCurrent","title","heading","description","home","ForbiddenPage","onBack","onHome","labels","L","children","back","breadcrumb","icon","sx","fontSize","color","code","display","justifyContent","paddingBottom","variant","onClick"],"sources":["../../../../src/lib/v2/components/ForbiddenPage.tsx"],"sourcesContent":["import Box from \"@mui/material/Box\";\r\nimport ArrowBack from \"@mui/icons-material/ArrowBack\";\r\nimport LockOutlined from \"@mui/icons-material/LockOutlined\";\r\nimport ActionBar from \"../patterns/ActionBar\";\r\nimport Button from \"./Button\";\r\nimport ErrorPageBody from \"./_ErrorPageBody\";\r\nimport { mergeLabels } from \"../utils/mergeLabels\";\r\n\r\n/**\r\n * ForbiddenPage — Portnet UI v2 (component)\r\n *\r\n * Charter §07 · 403 / Accès refusé.\r\n *\r\n * Router-agnostic by design: the page accepts `onBack` and `onHome`\r\n * callback props rather than calling a router hook itself. This\r\n * keeps the design system independent of any specific routing lib\r\n * (react-router, TanStack Router, Next.js, …).\r\n *\r\n * Usage:\r\n *\r\n *   import { ForbiddenPage } from \"@portnet/ui/lib/v2\";\r\n *   import { useNavigate } from \"react-router-dom\";\r\n *\r\n *   function ForbiddenRoute() {\r\n *     const navigate = useNavigate();\r\n *     return (\r\n *       <ForbiddenPage\r\n *         onBack={() => navigate(-1)}\r\n *         onHome={() => navigate(\"/\")}\r\n *       />\r\n *     );\r\n *   }\r\n *\r\n * Localisation (P-4):\r\n *   Every visible string is overridable through `labels`, defaulting\r\n *   to French. The shape is shared across the four error pages, so a\r\n *   host can build one translation object and spread it into each:\r\n *\r\n *     const t = { breadcrumbRoot: \"Error\", home: \"Back to home\", … };\r\n *     <ForbiddenPage labels={{ ...t, title: \"Access denied\", … }} … />\r\n *\r\n * Charter rules satisfied:\r\n *   R-2.1   no local UI primitive (composes ActionBar + Button only).\r\n *   R-Tg.1  44 px tactile floor enforced by v2.Button.\r\n *   R-A.1   ARIA landmarks via ActionBar's <header role=\"banner\">.\r\n *   R-T.2   contrast verified for var(--fg) on var(--bg).\r\n */\r\n\r\nexport interface ForbiddenPageLabels {\r\n  /** First breadcrumb crumb. */\r\n  breadcrumbRoot?: string | undefined;\r\n  /** Last breadcrumb crumb — aria-current=\"page\". */\r\n  breadcrumbCurrent?: string | undefined;\r\n  /** ActionBar heading (the page's <h1>). */\r\n  title?: string | undefined;\r\n  /** Descriptive sentence under the code ornament (the <h2>). */\r\n  heading?: string | undefined;\r\n  /** Body paragraph — the only text telling the user what to do. */\r\n  description?: string | undefined;\r\n  /** Primary CTA label. */\r\n  home?: string | undefined;\r\n}\r\n\r\nconst DEFAULT_LABELS = Object.freeze({\r\n  breadcrumbRoot:    \"Erreur\",\r\n  breadcrumbCurrent: \"Accès refusé\",\r\n  title:             \"Accès refusé\",\r\n  heading:           \"Vous n'avez pas accès à cette page\",\r\n  description:\r\n    \"Votre profil ne dispose pas des autorisations nécessaires pour consulter cette page. Contactez votre administrateur si vous pensez qu'il s'agit d'une erreur, puis revenez à l'accueil.\",\r\n  home:              \"Retour à l'accueil\",\r\n});\r\n\r\nexport interface ForbiddenPageProps {\r\n  /** Callback for the back button (top-bar arrow). */\r\n  onBack: () => void;\r\n  /** Callback for the primary \"Retour à l'accueil\" CTA. */\r\n  onHome: () => void;\r\n  /** Overrides for the page's French defaults (P-4). */\r\n  labels?: ForbiddenPageLabels | undefined;\r\n}\r\n\r\nfunction ForbiddenPage({ onBack, onHome, labels }: ForbiddenPageProps) {\r\n  const L = mergeLabels(DEFAULT_LABELS, labels);\r\n\r\n  return (\r\n    <>\r\n      <ActionBar\r\n        back={onBack}\r\n        breadcrumb={[L.breadcrumbRoot, L.breadcrumbCurrent]}\r\n        title={L.title}\r\n      />\r\n      <ErrorPageBody\r\n        icon={<LockOutlined sx={{ fontSize: 64, color: \"var(--warning)\" }} />}\r\n        code=\"403\"\r\n        title={L.heading}\r\n        description={L.description}\r\n      />\r\n      <Box sx={{ display: \"flex\", justifyContent: \"center\", paddingBottom: \"var(--s-7)\" }}>\r\n        <Button variant=\"primary\" icon={<ArrowBack />} onClick={onHome}>\r\n          {L.home}\r\n        </Button>\r\n      </Box>\r\n    </>\r\n  );\r\n}\r\n\r\nexport default ForbiddenPage;\r\n"],"mappings":"AAAA,OAAOA,GAAG,MAAM,mBAAmB;AACnC,OAAOC,SAAS,MAAM,+BAA+B;AACrD,OAAOC,YAAY,MAAM,kCAAkC;AAC3D,OAAOC,SAAS,MAAM,uBAAuB;AAC7C,OAAOC,MAAM,MAAM,UAAU;AAC7B,OAAOC,aAAa,MAAM,kBAAkB;AAC5C,SAASC,WAAW,QAAQ,sBAAsB;;AAElD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAtCA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA,EAAAC,IAAA,IAAAC,KAAA;AAuDA,MAAMC,cAAc,GAAGC,MAAM,CAACC,MAAM,CAAC;EACnCC,cAAc,EAAK,QAAQ;EAC3BC,iBAAiB,EAAE,cAAc;EACjCC,KAAK,EAAc,cAAc;EACjCC,OAAO,EAAY,oCAAoC;EACvDC,WAAW,EACT,yLAAyL;EAC3LC,IAAI,EAAe;AACrB,CAAC,CAAC;AAWF,SAASC,aAAaA,CAAC;EAAEC,MAAM;EAAEC,MAAM;EAAEC;AAA2B,CAAC,EAAE;EACrE,MAAMC,CAAC,GAAGpB,WAAW,CAACO,cAAc,EAAEY,MAAM,CAAC;EAE7C,oBACEb,KAAA,CAAAF,SAAA;IAAAiB,QAAA,gBACEnB,IAAA,CAACL,SAAS;MACRyB,IAAI,EAAEL,MAAO;MACbM,UAAU,EAAE,CAACH,CAAC,CAACV,cAAc,EAAEU,CAAC,CAACT,iBAAiB,CAAE;MACpDC,KAAK,EAAEQ,CAAC,CAACR;IAAM,CAChB,CAAC,eACFV,IAAA,CAACH,aAAa;MACZyB,IAAI,eAAEtB,IAAA,CAACN,YAAY;QAAC6B,EAAE,EAAE;UAAEC,QAAQ,EAAE,EAAE;UAAEC,KAAK,EAAE;QAAiB;MAAE,CAAE,CAAE;MACtEC,IAAI,EAAC,KAAK;MACVhB,KAAK,EAAEQ,CAAC,CAACP,OAAQ;MACjBC,WAAW,EAAEM,CAAC,CAACN;IAAY,CAC5B,CAAC,eACFZ,IAAA,CAACR,GAAG;MAAC+B,EAAE,EAAE;QAAEI,OAAO,EAAE,MAAM;QAAEC,cAAc,EAAE,QAAQ;QAAEC,aAAa,EAAE;MAAa,CAAE;MAAAV,QAAA,eAClFnB,IAAA,CAACJ,MAAM;QAACkC,OAAO,EAAC,SAAS;QAACR,IAAI,eAAEtB,IAAA,CAACP,SAAS,IAAE,CAAE;QAACsC,OAAO,EAAEf,MAAO;QAAAG,QAAA,EAC5DD,CAAC,CAACL;MAAI,CACD;IAAC,CACN,CAAC;EAAA,CACN,CAAC;AAEP;AAEA,eAAeC,aAAa","ignoreList":[]}