@portnet/ui 6.0.0 → 6.0.2

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

@@ -0,0 +1,102 @@
+import * as React from "react";
+import Box from "@mui/material/Box";
+import Typography from "@mui/material/Typography";
+import Button from "./Button";
+
+/**
+ * EmptyState — Portnet UI v2
+ *
+ * Charter §04.3 · 3 variants required:
+ *   - initial   → primary CTA (e.g. "+ Nouveau titre")
+ *   - filtered  → "Réinitialiser filtres"
+ *   - error     → "Réessayer"
+ *
+ * Anti-pattern: generic clipart illustration. A single icon suffices (R-Em.2).
+ *
+ *   <EmptyState
+ *     icon={<DescriptionIcon />}
+ *     title="Aucun titre d'importation"
+ *     description="Créez votre premier titre pour commencer."
+ *     action={{ label: "Nouveau titre", onClick: createNew }}
+ *   />
+ */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function EmptyState(_ref) {
+  var _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? "initial" : _ref$variant,
+    icon = _ref.icon,
+    title = _ref.title,
+    description = _ref.description,
+    action = _ref.action;
+  var variantStyle = {
+    initial: {
+      iconColor: "var(--fg-subtle)"
+    },
+    filtered: {
+      iconColor: "var(--fg-subtle)"
+    },
+    error: {
+      iconColor: "var(--danger)"
+    }
+  }[variant] || {
+    iconColor: "var(--fg-subtle)"
+  };
+  var buttonVariant = variant === "error" ? "secondary" : "primary";
+  return /*#__PURE__*/_jsxs(Box, {
+    role: variant === "error" ? "alert" : undefined,
+    sx: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      textAlign: "center",
+      padding: "var(--s-9) var(--s-6)",
+      background: "var(--surface)",
+      border: "1px solid var(--border)",
+      borderRadius: "var(--r-lg)"
+    },
+    children: [icon && /*#__PURE__*/_jsx(Box, {
+      sx: {
+        // Icon halo size — visual element dimensions, not spacing.
+        // Intentionally literal (not promoted to a spacing token).
+        width: 48,
+        height: 48,
+        borderRadius: "var(--r-full)",
+        background: "var(--bg-subtle)",
+        display: "grid",
+        placeItems: "center",
+        color: variantStyle.iconColor,
+        marginBottom: "var(--s-3)",
+        "& svg": {
+          fontSize: 24
+        } // intrinsic icon size
+      },
+      children: icon
+    }), /*#__PURE__*/_jsx(Typography, {
+      component: "h3",
+      sx: {
+        fontSize: "var(--text-h4)",
+        fontWeight: "var(--fw-semibold)",
+        color: "var(--fg)",
+        marginBottom: "var(--s-1)",
+        lineHeight: "var(--lh-snug)"
+      },
+      children: title
+    }), description && /*#__PURE__*/_jsx(Typography, {
+      sx: {
+        fontSize: "var(--text-sm)",
+        color: "var(--fg-muted)",
+        // Readable measure (~50–60ch). Not a spacing-scale value.
+        maxWidth: 360,
+        marginBottom: "var(--s-3)"
+      },
+      children: description
+    }), action && /*#__PURE__*/_jsx(Button, {
+      variant: action.variant || buttonVariant,
+      icon: action.icon,
+      onClick: action.onClick,
+      children: action.label
+    })]
+  });
+}
+export default EmptyState;
+//# sourceMappingURL=EmptyState.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.js","names":["React","Box","Typography","Button","jsx","_jsx","jsxs","_jsxs","EmptyState","_ref","_ref$variant","variant","icon","title","description","action","variantStyle","initial","iconColor","filtered","error","buttonVariant","role","undefined","sx","display","flexDirection","alignItems","textAlign","padding","background","border","borderRadius","children","width","height","placeItems","color","marginBottom","fontSize","component","fontWeight","lineHeight","maxWidth","onClick","label"],"sources":["../../../../src/lib/v2/components/EmptyState.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport Box from \"@mui/material/Box\";\r\nimport Typography from \"@mui/material/Typography\";\r\nimport Button from \"./Button\";\r\nimport type { ButtonProps } from \"./Button\";\r\n\r\n/**\r\n * EmptyState — Portnet UI v2\r\n *\r\n * Charter §04.3 · 3 variants required:\r\n *   - initial   → primary CTA (e.g. \"+ Nouveau titre\")\r\n *   - filtered  → \"Réinitialiser filtres\"\r\n *   - error     → \"Réessayer\"\r\n *\r\n * Anti-pattern: generic clipart illustration. A single icon suffices (R-Em.2).\r\n *\r\n *   <EmptyState\r\n *     icon={<DescriptionIcon />}\r\n *     title=\"Aucun titre d'importation\"\r\n *     description=\"Créez votre premier titre pour commencer.\"\r\n *     action={{ label: \"Nouveau titre\", onClick: createNew }}\r\n *   />\r\n */\r\n\r\nexport type EmptyStateVariant = \"initial\" | \"filtered\" | \"error\";\r\n\r\nexport interface EmptyStateAction {\r\n  label: React.ReactNode;\r\n  onClick?: (() => void) | undefined;\r\n  icon?: React.ReactNode | undefined;\r\n  variant?: ButtonProps[\"variant\"] | undefined;\r\n}\r\n\r\nexport interface EmptyStateProps {\r\n  variant?: EmptyStateVariant | undefined;\r\n  icon?: React.ReactNode | undefined;\r\n  title: React.ReactNode;\r\n  description?: React.ReactNode | undefined;\r\n  action?: EmptyStateAction | undefined;\r\n}\r\n\r\nfunction EmptyState({\r\n  variant = \"initial\",\r\n  icon,\r\n  title,\r\n  description,\r\n  action,\r\n}: EmptyStateProps) {\r\n  const variantStyle = {\r\n    initial:  { iconColor: \"var(--fg-subtle)\" },\r\n    filtered: { iconColor: \"var(--fg-subtle)\" },\r\n    error:    { iconColor: \"var(--danger)\"    },\r\n  }[variant] || { iconColor: \"var(--fg-subtle)\" };\r\n\r\n  const buttonVariant = variant === \"error\" ? \"secondary\" : \"primary\";\r\n\r\n  return (\r\n    <Box\r\n      role={variant === \"error\" ? \"alert\" : undefined}\r\n      sx={{\r\n        display: \"flex\",\r\n        flexDirection: \"column\",\r\n        alignItems: \"center\",\r\n        textAlign: \"center\",\r\n        padding: \"var(--s-9) var(--s-6)\",\r\n        background: \"var(--surface)\",\r\n        border: \"1px solid var(--border)\",\r\n        borderRadius: \"var(--r-lg)\",\r\n      }}\r\n    >\r\n      {icon && (\r\n        <Box\r\n          sx={{\r\n            // Icon halo size — visual element dimensions, not spacing.\r\n            // Intentionally literal (not promoted to a spacing token).\r\n            width: 48,\r\n            height: 48,\r\n            borderRadius: \"var(--r-full)\",\r\n            background: \"var(--bg-subtle)\",\r\n            display: \"grid\",\r\n            placeItems: \"center\",\r\n            color: variantStyle.iconColor,\r\n            marginBottom: \"var(--s-3)\",\r\n            \"& svg\": { fontSize: 24 }, // intrinsic icon size\r\n          }}\r\n        >\r\n          {icon}\r\n        </Box>\r\n      )}\r\n      <Typography\r\n        component=\"h3\"\r\n        sx={{\r\n          fontSize: \"var(--text-h4)\",\r\n          fontWeight: \"var(--fw-semibold)\",\r\n          color: \"var(--fg)\",\r\n          marginBottom: \"var(--s-1)\",\r\n          lineHeight: \"var(--lh-snug)\",\r\n        }}\r\n      >\r\n        {title}\r\n      </Typography>\r\n      {description && (\r\n        <Typography\r\n          sx={{\r\n            fontSize: \"var(--text-sm)\",\r\n            color: \"var(--fg-muted)\",\r\n            // Readable measure (~50–60ch). Not a spacing-scale value.\r\n            maxWidth: 360,\r\n            marginBottom: \"var(--s-3)\",\r\n          }}\r\n        >\r\n          {description}\r\n        </Typography>\r\n      )}\r\n      {action && (\r\n        <Button variant={action.variant || buttonVariant} icon={action.icon} onClick={action.onClick}>\r\n          {action.label}\r\n        </Button>\r\n      )}\r\n    </Box>\r\n  );\r\n}\r\n\r\nexport default EmptyState;\r\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,127 @@
+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); }
+var _excluded = ["pressed", "onChange", "size", "disabled", "labels", "sx", "aria-label"];
+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 _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; }
+import * as React from "react";
+import IconButton from "@mui/material/IconButton";
+import StarRoundedIcon from "@mui/icons-material/StarRounded";
+import StarBorderRoundedIcon from "@mui/icons-material/StarBorderRounded";
+import { mergeLabels } from "../utils/mergeLabels";
+
+/**
+ * FavoriteToggle - Portnet UI v2
+ *
+ * Charter §03 · presentational ☆/★ follow ("suivi") toggle. A CONTROLLED
+ * `<button aria-pressed>` with a star glyph. The glyph is decorative
+ * (MUI SvgIcon is aria-hidden by default); state is conveyed by
+ * `aria-pressed` AND by glyph SHAPE (outline ☆ vs filled ★), so it never
+ * relies on colour alone (WCAG 1.4.1 Use of Color).
+ *
+ * Presentational and provider-FREE by design — it keeps the leaf-vs-
+ * personalization boundary clean and stays usable outside the foundation.
+ * Wire it to the favorites capability:
+ *
+ *   const { isFavorite, toggle } = useIsFavorite("ti:list", row.id);
+ *   <FavoriteToggle pressed={isFavorite} onChange={toggle} size="sm" />
+ *
+ * …or drive it from any state:
+ *
+ *   <FavoriteToggle pressed={on} onChange={(next) => setOn(next)} />
+ *
+ * Touch target: md (default) = 44px (WCAG 2.5.5 AAA); sm = 32px for dense
+ * DataGrid rows (meets 2.5.8 AA ≥ 24px, with headroom); lg = 48px; xs =
+ * 24px — the WCAG 2.5.8 AA floor exactly, with NO headroom left. Reserve
+ * xs for genuinely space-constrained columns where sm's 32px still
+ * doesn't fit (e.g. a compact favorites column under a table's
+ * table-layout:auto, where an explicit column width can't shrink the
+ * cell below the toggle's own intrinsic box) — don't reach for it over
+ * sm by default. The toggle renders itself unconditionally; the DataGrid
+ * follow column (makeFavoriteColumn) wraps it with the Gmail-style hover
+ * reveal for unfollowed rows.
+ *
+ * Localisation (FR / EN / AR):
+ *   <FavoriteToggle labels={{ addFavorite: "Follow",
+ *                             removeFavorite: "Unfollow" }} />
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+var DEFAULT_LABELS = Object.freeze({
+  addFavorite: "Suivre",
+  removeFavorite: "Ne plus suivre"
+});
+// Box = interactive hit area (px, like OverflowMenu's minWidth); glyph =
+// icon font-size inherited by the SvgIcon via fontSize="inherit".
+var SIZE_MAP = Object.freeze({
+  xs: Object.freeze({
+    box: 24,
+    glyph: 16
+  }),
+  sm: Object.freeze({
+    box: 32,
+    glyph: 20
+  }),
+  md: Object.freeze({
+    box: 44,
+    glyph: 24
+  }),
+  lg: Object.freeze({
+    box: 48,
+    glyph: 28
+  })
+});
+var FavoriteToggle = /*#__PURE__*/React.forwardRef(function FavoriteToggle(_ref, ref) {
+  var _ref$pressed = _ref.pressed,
+    pressed = _ref$pressed === void 0 ? false : _ref$pressed,
+    onChange = _ref.onChange,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? "md" : _ref$size,
+    disabled = _ref.disabled,
+    labels = _ref.labels,
+    sx = _ref.sx,
+    ariaLabel = _ref["aria-label"],
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var L = mergeLabels(DEFAULT_LABELS, labels);
+  var dims = SIZE_MAP[size] || SIZE_MAP.md;
+  // Toggle-button convention: the accessible name describes the ACTION
+  // activation performs; aria-pressed conveys the current state. Hosts can
+  // override with a richer per-row name via the `aria-label` prop.
+  var computedAria = ariaLabel || (pressed ? L.removeFavorite : L.addFavorite);
+  var handleClick = function handleClick(e) {
+    if (disabled) return;
+    if (typeof onChange === "function") onChange(!pressed, e);
+  };
+  var Star = pressed ? StarRoundedIcon : StarBorderRoundedIcon;
+  return /*#__PURE__*/_jsx(IconButton, _objectSpread(_objectSpread({
+    ref: ref,
+    onClick: handleClick,
+    disabled: disabled,
+    "aria-pressed": !!pressed,
+    "aria-label": computedAria,
+    sx: _objectSpread({
+      width: dims.box,
+      height: dims.box,
+      fontSize: dims.glyph,
+      color: pressed ? "var(--accent)" : "var(--fg-muted)",
+      "&:hover": {
+        color: pressed ? "var(--accent)" : "var(--fg)"
+      },
+      // Reuse the canonical focus halo token (same as Switch / R-AI.1).
+      "&.Mui-focusVisible": {
+        boxShadow: "var(--shadow-focus)"
+      },
+      "@media (prefers-reduced-motion: reduce)": {
+        transition: "none"
+      }
+    }, sx)
+  }, rest), {}, {
+    children: /*#__PURE__*/_jsx(Star, {
+      fontSize: "inherit"
+    })
+  }));
+});
+export default FavoriteToggle;
+//# sourceMappingURL=FavoriteToggle.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FavoriteToggle.js","names":["React","IconButton","StarRoundedIcon","StarBorderRoundedIcon","mergeLabels","jsx","_jsx","DEFAULT_LABELS","Object","freeze","addFavorite","removeFavorite","SIZE_MAP","xs","box","glyph","sm","md","lg","FavoriteToggle","forwardRef","_ref","ref","_ref$pressed","pressed","onChange","_ref$size","size","disabled","labels","sx","ariaLabel","rest","_objectWithoutProperties","_excluded","L","dims","computedAria","handleClick","e","Star","_objectSpread","onClick","width","height","fontSize","color","boxShadow","transition","children"],"sources":["../../../../src/lib/v2/components/FavoriteToggle.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport IconButton from \"@mui/material/IconButton\";\r\nimport type { IconButtonProps } from \"@mui/material/IconButton\";\r\nimport StarRoundedIcon from \"@mui/icons-material/StarRounded\";\r\nimport StarBorderRoundedIcon from \"@mui/icons-material/StarBorderRounded\";\r\nimport { mergeLabels } from \"../utils/mergeLabels\";\r\n\r\n/**\r\n * FavoriteToggle - Portnet UI v2\r\n *\r\n * Charter §03 · presentational ☆/★ follow (\"suivi\") toggle. A CONTROLLED\r\n * `<button aria-pressed>` with a star glyph. The glyph is decorative\r\n * (MUI SvgIcon is aria-hidden by default); state is conveyed by\r\n * `aria-pressed` AND by glyph SHAPE (outline ☆ vs filled ★), so it never\r\n * relies on colour alone (WCAG 1.4.1 Use of Color).\r\n *\r\n * Presentational and provider-FREE by design — it keeps the leaf-vs-\r\n * personalization boundary clean and stays usable outside the foundation.\r\n * Wire it to the favorites capability:\r\n *\r\n *   const { isFavorite, toggle } = useIsFavorite(\"ti:list\", row.id);\r\n *   <FavoriteToggle pressed={isFavorite} onChange={toggle} size=\"sm\" />\r\n *\r\n * …or drive it from any state:\r\n *\r\n *   <FavoriteToggle pressed={on} onChange={(next) => setOn(next)} />\r\n *\r\n * Touch target: md (default) = 44px (WCAG 2.5.5 AAA); sm = 32px for dense\r\n * DataGrid rows (meets 2.5.8 AA ≥ 24px, with headroom); lg = 48px; xs =\r\n * 24px — the WCAG 2.5.8 AA floor exactly, with NO headroom left. Reserve\r\n * xs for genuinely space-constrained columns where sm's 32px still\r\n * doesn't fit (e.g. a compact favorites column under a table's\r\n * table-layout:auto, where an explicit column width can't shrink the\r\n * cell below the toggle's own intrinsic box) — don't reach for it over\r\n * sm by default. The toggle renders itself unconditionally; the DataGrid\r\n * follow column (makeFavoriteColumn) wraps it with the Gmail-style hover\r\n * reveal for unfollowed rows.\r\n *\r\n * Localisation (FR / EN / AR):\r\n *   <FavoriteToggle labels={{ addFavorite: \"Follow\",\r\n *                             removeFavorite: \"Unfollow\" }} />\r\n */\r\n\r\nconst DEFAULT_LABELS = Object.freeze({\r\n  addFavorite: \"Suivre\",\r\n  removeFavorite: \"Ne plus suivre\",\r\n});\r\n\r\nexport type FavoriteToggleSize = \"xs\" | \"sm\" | \"md\" | \"lg\";\r\n\r\ninterface SizeDims {\r\n  box: number;\r\n  glyph: number;\r\n}\r\n\r\n// Box = interactive hit area (px, like OverflowMenu's minWidth); glyph =\r\n// icon font-size inherited by the SvgIcon via fontSize=\"inherit\".\r\nconst SIZE_MAP: Record<FavoriteToggleSize, SizeDims> = Object.freeze({\r\n  xs: Object.freeze({ box: 24, glyph: 16 }),\r\n  sm: Object.freeze({ box: 32, glyph: 20 }),\r\n  md: Object.freeze({ box: 44, glyph: 24 }),\r\n  lg: Object.freeze({ box: 48, glyph: 28 }),\r\n});\r\n\r\nexport interface FavoriteToggleLabels {\r\n  addFavorite?: string | undefined;\r\n  removeFavorite?: string | undefined;\r\n}\r\n\r\nexport interface FavoriteToggleProps\r\n  extends Omit<IconButtonProps, \"onChange\" | \"size\"> {\r\n  /** Current follow state. */\r\n  pressed?: boolean | undefined;\r\n  /** Activation handler: (nextPressed, event) => void. */\r\n  onChange?: ((nextPressed: boolean, event: React.MouseEvent<HTMLButtonElement>) => void) | undefined;\r\n  /** Touch-target size. */\r\n  size?: FavoriteToggleSize | undefined;\r\n  /** Localised action labels (FR default; EN/AR supported). */\r\n  labels?: FavoriteToggleLabels | undefined;\r\n  /** Explicit accessible name; overrides the labels-derived one. */\r\n  \"aria-label\"?: string | undefined;\r\n}\r\n\r\nconst FavoriteToggle = React.forwardRef<HTMLButtonElement, FavoriteToggleProps>(\r\n  function FavoriteToggle(\r\n    {\r\n      pressed = false,\r\n      onChange,\r\n      size = \"md\",\r\n      disabled,\r\n      labels,\r\n      sx,\r\n      \"aria-label\": ariaLabel,\r\n      ...rest\r\n    },\r\n    ref\r\n  ) {\r\n    const L = mergeLabels(DEFAULT_LABELS, labels);\r\n    const dims = SIZE_MAP[size] || SIZE_MAP.md;\r\n    // Toggle-button convention: the accessible name describes the ACTION\r\n    // activation performs; aria-pressed conveys the current state. Hosts can\r\n    // override with a richer per-row name via the `aria-label` prop.\r\n    const computedAria = ariaLabel || (pressed ? L.removeFavorite : L.addFavorite);\r\n\r\n    const handleClick = function handleClick(e: React.MouseEvent<HTMLButtonElement>) {\r\n      if (disabled) return;\r\n      if (typeof onChange === \"function\") onChange(!pressed, e);\r\n    };\r\n\r\n    const Star = pressed ? StarRoundedIcon : StarBorderRoundedIcon;\r\n\r\n    return (\r\n      <IconButton\r\n        ref={ref}\r\n        onClick={handleClick}\r\n        disabled={disabled}\r\n        aria-pressed={!!pressed}\r\n        aria-label={computedAria}\r\n        sx={{\r\n          width: dims.box,\r\n          height: dims.box,\r\n          fontSize: dims.glyph,\r\n          color: pressed ? \"var(--accent)\" : \"var(--fg-muted)\",\r\n          \"&:hover\": { color: pressed ? \"var(--accent)\" : \"var(--fg)\" },\r\n          // Reuse the canonical focus halo token (same as Switch / R-AI.1).\r\n          \"&.Mui-focusVisible\": { boxShadow: \"var(--shadow-focus)\" },\r\n          \"@media (prefers-reduced-motion: reduce)\": { transition: \"none\" },\r\n          ...sx,\r\n        }}\r\n        {...rest}\r\n      >\r\n        <Star fontSize=\"inherit\" />\r\n      </IconButton>\r\n    );\r\n  }\r\n);\r\n\r\nexport default FavoriteToggle;\r\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,259 @@
+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 FormControl from "@mui/material/FormControl";
+import FormLabel from "@mui/material/FormLabel";
+import FormHelperText from "@mui/material/FormHelperText";
+import Box from "@mui/material/Box";
+import FieldError from "./FieldError";
+
+/**
+ * Field — Portnet UI v2
+ *
+ * Charter §03 · Component "Input · Field".
+ * Universal wrapper providing label / required marker / hint / error / a11y bindings
+ * for any form control (Input, Select, Textarea, Autocomplete, Combobox, …).
+ *
+ * Strict rules enforced:
+ *   R-I.1 — Label is associated to the control via `htmlFor` / `id`.
+ *   R-I.2 — Required adds the asterisk + `aria-required`.
+ *   R-I.3 — Error: `aria-invalid` + `aria-describedby` linking the message.
+ *           Field MERGES with the child's existing `aria-describedby` so a
+ *           consumer-supplied external help id is never lost. The message
+ *           itself is rendered by the shared `FieldError` primitive, which
+ *           carries the R-4.1 MUST icon (gap G-18) — previously this component
+ *           rendered a bare red `FormHelperText` with no icon, so the canonical
+ *           field wrapper did not satisfy a MUST and every module inherited the
+ *           gap on every form.
+ *   R-I.4 — Validation in `blur`, not `change` (caller's responsibility).
+ *   R-I.6 — Hint visible above error; never both at once.
+ *
+ *   <Field label="Référence" required hint="Format AAAA-IM-NNNNN" error={errors.ref}>
+ *     <Input value={value} onChange={onChange} />
+ *   </Field>
+ *
+ * Grouping controls (RadioGroup / CheckboxGroup) — pass `group`:
+ *   A native `<label htmlFor>` cannot name an ARIA group (only labelable
+ *   elements can be `for`-targeted), so in `group` mode the label is rendered
+ *   as a <span> with an id and the child group is associated via
+ *   `aria-labelledby` instead. The child must forward `aria-labelledby`
+ *   (and `aria-describedby`) onto its `role="group"`/`"radiogroup"` element.
+ *
+ *   <Field label="Genre" group error={errors.genre}>
+ *     <RadioGroup … />
+ *   </Field>
+ *
+ * ── LARGEUR SEMANTIQUE (gap G-H) ──────────────────────────────
+ *
+ * `width` rattache le champ a l'un des cinq gabarits imposes par la section
+ * « Form Field Width & Layout Standards » des Platform Mandatory UX Patterns.
+ * Le standard y interdit explicitement les « arbitrary input field widths » et
+ * les « jagged alignment fields within forms », et impose de mapper chaque
+ * champ a un gabarit d'apres sa contrainte de CARACTERES :
+ *
+ *   xs  1 a 5 caracteres    code postal, CVV, age
+ *   s   6 a 15              telephone, montant, date, identifiant court
+ *   m   16 a 60             nom, courriel, ville, liste simple
+ *   l   61 a 256            adresse, recherche complexe, longue liste
+ *   xl  257 et plus         zone de texte, description, editeur
+ *
+ * POURQUOI SUR `Field` ET NON SUR CHAQUE CONTROLE. Le gabarit est une
+ * contrainte de MISE EN PAGE, pas une propriete de l'input : c'est la boite du
+ * champ - libelle, controle, indication, erreur - qui doit etre bornee, sinon
+ * le message d'erreur s'etale sur toute la cellule pendant que l'input est
+ * borne. `Field` est le seul endroit qui voit cette boite entiere.
+ *
+ * POURQUOI UN PLAFOND ET NON UNE LARGEUR FIXE. Le standard exige aussi que les
+ * champs soient empiles « 100% grid width » sur mobile, et que des champs
+ * heterogenes s'alignent sur des fractions de colonnes. Un `maxWidth`
+ * n'est donc pose qu'a partir de `sm` : la grille continue de decider des
+ * COLONNES, le gabarit borne le champ DANS sa cellule. Les deux regles
+ * coexistent au lieu de se contredire.
+ *
+ * >>> LES CINQ VALEURS SONT UNE DECISION DE DESIGN, PAS UNE LECTURE. Le
+ * >>> standard donne des FOURCHETTES (« ~80px to 120px max »). J'ai retenu le
+ * >>> HAUT de chaque fourchette, ces largeurs etant des plafonds : prendre le
+ * >>> bas tronquerait des valeurs qui tiennent dans la contrainte de
+ * >>> caracteres annoncee. A confirmer par l'equipe design ; les cinq nombres
+ * >>> sont exposes en variables CSS pour etre revus sans toucher au code. <<<
+ */
+
+/**
+ * Gabarits de largeur semantique (G-H). Voir la note en tete de fichier.
+ *
+ * Les valeurs passent par des variables CSS pour que l'equipe design puisse
+ * les revoir sans modification de code. Les replis sont le HAUT de chaque
+ * fourchette du standard, ces largeurs etant des plafonds.
+ */
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Exporte pour etre TESTABLE : le plafond ne s'applique qu'a partir de `sm`,
+ * donc via une requete media qu'`emotion` injecte dans la feuille de style et
+ * que jsdom ne resout pas. Un test de rendu ne peut donc pas lire la largeur
+ * effective ; il peut en revanche epingler les cinq valeurs, ce qui est le
+ * point sensible (elles sont une decision de design, voir la note ci-dessus).
+ */
+export var FIELD_MAX_WIDTH = {
+  xs: "var(--field-w-xs, 120px)",
+  s: "var(--field-w-s, 200px)",
+  m: "var(--field-w-m, 400px)",
+  l: "var(--field-w-l, 600px)",
+  xl: "100%"
+};
+function Field(_ref) {
+  var label = _ref.label,
+    _ref$required = _ref.required,
+    required = _ref$required === void 0 ? false : _ref$required,
+    hint = _ref.hint,
+    error = _ref.error,
+    htmlFor = _ref.htmlFor,
+    _ref$fullWidth = _ref.fullWidth,
+    fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth,
+    disabled = _ref.disabled,
+    _ref$group = _ref.group,
+    group = _ref$group === void 0 ? false : _ref$group,
+    width = _ref.width,
+    children = _ref.children,
+    helpAdornment = _ref.helpAdornment,
+    sx = _ref.sx,
+    className = _ref.className;
+  // R-I.1 — useId provides SSR-safe, per-instance, stable IDs.
+  // Replaces the previous module-scoped counter (`let __uid = 0`) which broke
+  // hydration and Concurrent Mode.
+  var reactId = React.useId();
+  var auto = "pui-".concat(reactId.replace(/:/g, ""));
+  var inputId = htmlFor || auto;
+  var hintId = "".concat(inputId, "-h");
+  var errorId = "".concat(inputId, "-e");
+  var labelId = "".concat(inputId, "-l");
+  var hasError = !!error;
+  var child = React.Children.only(children);
+  // The wrapped control is polymorphic (Input/Select/NumberInput/Combobox/…);
+  // type only the props Field reads/merges, replacing React's `props: any`.
+  var childProps = child.props;
+
+  // R-I.3 — MERGE the child's existing aria-describedby with our hint/error
+  // ids. cloneElement replaces props, so without an explicit merge any
+  // consumer-supplied describedby was silently discarded.
+  var describedBy = [childProps["aria-describedby"], hint && !hasError ? hintId : null, hasError ? errorId : null].filter(Boolean).join(" ") || undefined;
+
+  // CC-6 — in group mode the label names the group via aria-labelledby.
+  // Merge with any consumer-supplied labelledby so it is never lost.
+  var labelledBy = group ? [childProps["aria-labelledby"], label ? labelId : null].filter(Boolean).join(" ") || undefined : undefined;
+  var enhanced = /*#__PURE__*/React.cloneElement(child, _objectSpread(_objectSpread({
+    id: childProps.id || inputId,
+    "aria-invalid": hasError ? "true" : undefined,
+    "aria-required": required ? "true" : undefined,
+    "aria-describedby": describedBy
+  }, group ? {
+    "aria-labelledby": labelledBy
+  } : {}), {}, {
+    // `error` / `disabled` are broadcast by FormControl via context for MUI
+    // inputs, but several v2 inputs (NumberInput, Combobox renderInput) are
+    // not pure MUI children and read the props directly — keep them explicit.
+    error: hasError,
+    disabled: disabled || childProps.disabled,
+    // Respect the child's explicit fullWidth when defined (e.g. a narrow
+    // inline filter input). Only fall back to Field's value when the child
+    // hasn't expressed an opinion.
+    fullWidth: childProps.fullWidth !== undefined ? childProps.fullWidth : fullWidth
+  }));
+
+  // R-I.6 — RTL-safe margin reset. `marginLeft: 0` only zeroes the LTR
+  // inline-start; in [dir="rtl"] the helper picks up MUI's default on
+  // the (now physical-right but logical-start) side and is mis-aligned.
+  // `marginInlineStart` resets the correct edge in both directions.
+  var helperResetSx = {
+    marginInlineStart: 0,
+    fontSize: "var(--text-xs)"
+  };
+  var LABEL_SX = {
+    display: "flex",
+    alignItems: "center",
+    gap: "var(--s-1)",
+    fontSize: "var(--text-xs, 12px)",
+    fontWeight: "var(--fw-semibold, 600)",
+    color: "var(--fg-muted)",
+    marginBottom: "var(--s-2)",
+    "&.Mui-focused": {
+      color: "var(--fg-muted)"
+    },
+    "&.Mui-error": {
+      color: "var(--fg-muted)"
+    }
+  };
+
+  // Shared label content (text + required marker + optional help adornment).
+  var labelContent = /*#__PURE__*/_jsxs(_Fragment, {
+    children: [label, required && /*#__PURE__*/_jsx(Box, {
+      component: "span",
+      "aria-hidden": "true",
+      sx: {
+        color: "var(--danger)",
+        fontWeight: "var(--fw-bold, 700)"
+      },
+      children: "*"
+    }), helpAdornment]
+  });
+  return /*#__PURE__*/_jsxs(FormControl, {
+    error: hasError,
+    required: required,
+    disabled: disabled,
+    fullWidth: fullWidth,
+    className: className,
+    sx: _objectSpread(_objectSpread({}, width ? {
+      maxWidth: {
+        xs: "100%",
+        sm: FIELD_MAX_WIDTH[width]
+      }
+    } : {}), sx),
+    children: [label && (group ?
+    /*#__PURE__*/
+    // Group mode: render as a <span> carrying an id (no <label for>),
+    // referenced by the group's aria-labelledby.
+    _jsx(FormLabel, {
+      component: "span",
+      id: labelId,
+      required: false,
+      sx: LABEL_SX,
+      children: labelContent
+    }) : /*#__PURE__*/_jsx(FormLabel, {
+      htmlFor: inputId,
+      required: false /* we render the * ourselves */,
+      sx: LABEL_SX,
+      children: labelContent
+    })), enhanced, hint && !hasError && /*#__PURE__*/_jsx(FormHelperText, {
+      id: hintId,
+      sx: _objectSpread(_objectSpread({}, helperResetSx), {}, {
+        color: "var(--fg-subtle)"
+      }),
+      children: hint
+    }), hasError &&
+    /*#__PURE__*/
+    /*
+     * Rendered by the shared `FieldError` (gap G-18) rather than an inline
+     * `FormHelperText`: R-4.1 MUST requires the icon, and a host with a
+     * LIST-level error (a Formik array, an upload slot) has no single
+     * control to wrap in a `Field` and needs the exact same renderer
+     * standalone. One component, both paths, no drift.
+     *
+     * `marginTop: var(--s-1)` (4px) replaces `FormHelperText`'s hard-coded
+     * 3px default — same optical result, on the spacing scale (R-S.1).
+     * Dropping FormHelperText also removed a `color: … !important` that
+     * only existed to beat MUI's own `Mui-error` colour.
+     */
+    _jsx(FieldError, {
+      id: errorId,
+      sx: {
+        marginTop: "var(--s-1)"
+      },
+      children: error
+    })]
+  });
+}
+export default Field;
+//# sourceMappingURL=Field.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Field.js","names":["React","FormControl","FormLabel","FormHelperText","Box","FieldError","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","FIELD_MAX_WIDTH","xs","s","m","l","xl","Field","_ref","label","_ref$required","required","hint","error","htmlFor","_ref$fullWidth","fullWidth","disabled","_ref$group","group","width","children","helpAdornment","sx","className","reactId","useId","auto","concat","replace","inputId","hintId","errorId","labelId","hasError","child","Children","only","childProps","props","describedBy","filter","Boolean","join","undefined","labelledBy","enhanced","cloneElement","_objectSpread","id","helperResetSx","marginInlineStart","fontSize","LABEL_SX","display","alignItems","gap","fontWeight","color","marginBottom","labelContent","component","maxWidth","sm","marginTop"],"sources":["../../../../src/lib/v2/components/Field.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport FormControl from \"@mui/material/FormControl\";\r\nimport FormLabel from \"@mui/material/FormLabel\";\r\nimport FormHelperText from \"@mui/material/FormHelperText\";\r\nimport Box from \"@mui/material/Box\";\r\nimport type { SxProps, Theme } from \"@mui/material/styles\";\r\nimport FieldError from \"./FieldError\";\r\n\r\n/**\r\n * Field — Portnet UI v2\r\n *\r\n * Charter §03 · Component \"Input · Field\".\r\n * Universal wrapper providing label / required marker / hint / error / a11y bindings\r\n * for any form control (Input, Select, Textarea, Autocomplete, Combobox, …).\r\n *\r\n * Strict rules enforced:\r\n *   R-I.1 — Label is associated to the control via `htmlFor` / `id`.\r\n *   R-I.2 — Required adds the asterisk + `aria-required`.\r\n *   R-I.3 — Error: `aria-invalid` + `aria-describedby` linking the message.\r\n *           Field MERGES with the child's existing `aria-describedby` so a\r\n *           consumer-supplied external help id is never lost. The message\r\n *           itself is rendered by the shared `FieldError` primitive, which\r\n *           carries the R-4.1 MUST icon (gap G-18) — previously this component\r\n *           rendered a bare red `FormHelperText` with no icon, so the canonical\r\n *           field wrapper did not satisfy a MUST and every module inherited the\r\n *           gap on every form.\r\n *   R-I.4 — Validation in `blur`, not `change` (caller's responsibility).\r\n *   R-I.6 — Hint visible above error; never both at once.\r\n *\r\n *   <Field label=\"Référence\" required hint=\"Format AAAA-IM-NNNNN\" error={errors.ref}>\r\n *     <Input value={value} onChange={onChange} />\r\n *   </Field>\r\n *\r\n * Grouping controls (RadioGroup / CheckboxGroup) — pass `group`:\r\n *   A native `<label htmlFor>` cannot name an ARIA group (only labelable\r\n *   elements can be `for`-targeted), so in `group` mode the label is rendered\r\n *   as a <span> with an id and the child group is associated via\r\n *   `aria-labelledby` instead. The child must forward `aria-labelledby`\r\n *   (and `aria-describedby`) onto its `role=\"group\"`/`\"radiogroup\"` element.\r\n *\r\n *   <Field label=\"Genre\" group error={errors.genre}>\r\n *     <RadioGroup … />\r\n *   </Field>\r\n *\r\n * ── LARGEUR SEMANTIQUE (gap G-H) ──────────────────────────────\r\n *\r\n * `width` rattache le champ a l'un des cinq gabarits imposes par la section\r\n * « Form Field Width & Layout Standards » des Platform Mandatory UX Patterns.\r\n * Le standard y interdit explicitement les « arbitrary input field widths » et\r\n * les « jagged alignment fields within forms », et impose de mapper chaque\r\n * champ a un gabarit d'apres sa contrainte de CARACTERES :\r\n *\r\n *   xs  1 a 5 caracteres    code postal, CVV, age\r\n *   s   6 a 15              telephone, montant, date, identifiant court\r\n *   m   16 a 60             nom, courriel, ville, liste simple\r\n *   l   61 a 256            adresse, recherche complexe, longue liste\r\n *   xl  257 et plus         zone de texte, description, editeur\r\n *\r\n * POURQUOI SUR `Field` ET NON SUR CHAQUE CONTROLE. Le gabarit est une\r\n * contrainte de MISE EN PAGE, pas une propriete de l'input : c'est la boite du\r\n * champ - libelle, controle, indication, erreur - qui doit etre bornee, sinon\r\n * le message d'erreur s'etale sur toute la cellule pendant que l'input est\r\n * borne. `Field` est le seul endroit qui voit cette boite entiere.\r\n *\r\n * POURQUOI UN PLAFOND ET NON UNE LARGEUR FIXE. Le standard exige aussi que les\r\n * champs soient empiles « 100% grid width » sur mobile, et que des champs\r\n * heterogenes s'alignent sur des fractions de colonnes. Un `maxWidth`\r\n * n'est donc pose qu'a partir de `sm` : la grille continue de decider des\r\n * COLONNES, le gabarit borne le champ DANS sa cellule. Les deux regles\r\n * coexistent au lieu de se contredire.\r\n *\r\n * >>> LES CINQ VALEURS SONT UNE DECISION DE DESIGN, PAS UNE LECTURE. Le\r\n * >>> standard donne des FOURCHETTES (« ~80px to 120px max »). J'ai retenu le\r\n * >>> HAUT de chaque fourchette, ces largeurs etant des plafonds : prendre le\r\n * >>> bas tronquerait des valeurs qui tiennent dans la contrainte de\r\n * >>> caracteres annoncee. A confirmer par l'equipe design ; les cinq nombres\r\n * >>> sont exposes en variables CSS pour etre revus sans toucher au code. <<<\r\n */\r\n\r\n/**\r\n * Gabarits de largeur semantique (G-H). Voir la note en tete de fichier.\r\n *\r\n * Les valeurs passent par des variables CSS pour que l'equipe design puisse\r\n * les revoir sans modification de code. Les replis sont le HAUT de chaque\r\n * fourchette du standard, ces largeurs etant des plafonds.\r\n */\r\nexport type FieldWidth = \"xs\" | \"s\" | \"m\" | \"l\" | \"xl\";\r\n\r\n/**\r\n * Exporte pour etre TESTABLE : le plafond ne s'applique qu'a partir de `sm`,\r\n * donc via une requete media qu'`emotion` injecte dans la feuille de style et\r\n * que jsdom ne resout pas. Un test de rendu ne peut donc pas lire la largeur\r\n * effective ; il peut en revanche epingler les cinq valeurs, ce qui est le\r\n * point sensible (elles sont une decision de design, voir la note ci-dessus).\r\n */\r\nexport const FIELD_MAX_WIDTH: Record<FieldWidth, string> = {\r\n  xs: \"var(--field-w-xs, 120px)\",\r\n  s: \"var(--field-w-s, 200px)\",\r\n  m: \"var(--field-w-m, 400px)\",\r\n  l: \"var(--field-w-l, 600px)\",\r\n  xl: \"100%\",\r\n};\r\n\r\nexport interface FieldProps {\r\n  label?: React.ReactNode | undefined;\r\n  required?: boolean | undefined;\r\n  hint?: React.ReactNode | undefined;\r\n  error?: React.ReactNode | undefined;\r\n  htmlFor?: string | undefined;\r\n  fullWidth?: boolean | undefined;\r\n  disabled?: boolean | undefined;\r\n  /**\r\n   * The wrapped child is an ARIA group (RadioGroup / CheckboxGroup) rather than\r\n   * a single labelable control. Associates the label via `aria-labelledby`\r\n   * instead of `htmlFor` / `id`.\r\n   */\r\n  group?: boolean | undefined;\r\n  /**\r\n   * Gabarit de largeur semantique (G-H) : `xs` | `s` | `m` | `l` | `xl`,\r\n   * choisi d'apres la contrainte de CARACTERES du champ. Voir la note en tete\r\n   * de fichier. Omis = aucun plafond, la cellule de grille decide seule -\r\n   * c'est le comportement d'avant G-H, donc rien ne change pour les appelants\r\n   * existants.\r\n   */\r\n  width?: FieldWidth | undefined;\r\n  /** Optional <FieldHelp> element rendered next to the label. */\r\n  helpAdornment?: React.ReactNode | undefined;\r\n  /** The single form-control element to wrap. */\r\n  children: React.ReactElement;\r\n  sx?: SxProps<Theme> | undefined;\r\n  className?: string | undefined;\r\n}\r\n\r\nfunction Field({\r\n  label,\r\n  required = false,\r\n  hint,\r\n  error,\r\n  htmlFor,\r\n  fullWidth = true,\r\n  disabled,\r\n  group = false,\r\n  width,\r\n  children,\r\n  helpAdornment, // optional <FieldHelp> element\r\n  sx,\r\n  className,\r\n}: FieldProps) {\r\n  // R-I.1 — useId provides SSR-safe, per-instance, stable IDs.\r\n  // Replaces the previous module-scoped counter (`let __uid = 0`) which broke\r\n  // hydration and Concurrent Mode.\r\n  const reactId = React.useId();\r\n  const auto = `pui-${reactId.replace(/:/g, \"\")}`;\r\n  const inputId = htmlFor || auto;\r\n  const hintId  = `${inputId}-h`;\r\n  const errorId = `${inputId}-e`;\r\n  const labelId = `${inputId}-l`;\r\n  const hasError = !!error;\r\n\r\n  const child = React.Children.only(children);\r\n  // The wrapped control is polymorphic (Input/Select/NumberInput/Combobox/…);\r\n  // type only the props Field reads/merges, replacing React's `props: any`.\r\n  const childProps = child.props as {\r\n    id?: string;\r\n    disabled?: boolean;\r\n    fullWidth?: boolean;\r\n    \"aria-describedby\"?: string;\r\n    \"aria-labelledby\"?: string;\r\n  };\r\n\r\n  // R-I.3 — MERGE the child's existing aria-describedby with our hint/error\r\n  // ids. cloneElement replaces props, so without an explicit merge any\r\n  // consumer-supplied describedby was silently discarded.\r\n  const describedBy = [\r\n    childProps[\"aria-describedby\"],\r\n    hint && !hasError ? hintId : null,\r\n    hasError ? errorId : null,\r\n  ].filter(Boolean).join(\" \") || undefined;\r\n\r\n  // CC-6 — in group mode the label names the group via aria-labelledby.\r\n  // Merge with any consumer-supplied labelledby so it is never lost.\r\n  const labelledBy = group\r\n    ? [childProps[\"aria-labelledby\"], label ? labelId : null]\r\n        .filter(Boolean)\r\n        .join(\" \") || undefined\r\n    : undefined;\r\n\r\n  const enhanced = React.cloneElement(child as React.ReactElement<Record<string, unknown>>, {\r\n    id: childProps.id || inputId,\r\n    \"aria-invalid\":   hasError ? \"true\" : undefined,\r\n    \"aria-required\":  required ? \"true\" : undefined,\r\n    \"aria-describedby\": describedBy,\r\n    // Only in group mode — a single labelable control is named by the\r\n    // htmlFor/id pair below, not by aria-labelledby.\r\n    ...(group ? { \"aria-labelledby\": labelledBy } : {}),\r\n    // `error` / `disabled` are broadcast by FormControl via context for MUI\r\n    // inputs, but several v2 inputs (NumberInput, Combobox renderInput) are\r\n    // not pure MUI children and read the props directly — keep them explicit.\r\n    error: hasError,\r\n    disabled: disabled || childProps.disabled,\r\n    // Respect the child's explicit fullWidth when defined (e.g. a narrow\r\n    // inline filter input). Only fall back to Field's value when the child\r\n    // hasn't expressed an opinion.\r\n    fullWidth: childProps.fullWidth !== undefined ? childProps.fullWidth : fullWidth,\r\n  });\r\n\r\n  // R-I.6 — RTL-safe margin reset. `marginLeft: 0` only zeroes the LTR\r\n  // inline-start; in [dir=\"rtl\"] the helper picks up MUI's default on\r\n  // the (now physical-right but logical-start) side and is mis-aligned.\r\n  // `marginInlineStart` resets the correct edge in both directions.\r\n  const helperResetSx = { marginInlineStart: 0, fontSize: \"var(--text-xs)\" };\r\n\r\n  const LABEL_SX = {\r\n    display: \"flex\",\r\n    alignItems: \"center\",\r\n    gap: \"var(--s-1)\",\r\n    fontSize: \"var(--text-xs, 12px)\",\r\n    fontWeight: \"var(--fw-semibold, 600)\",\r\n    color: \"var(--fg-muted)\",\r\n    marginBottom: \"var(--s-2)\",\r\n    \"&.Mui-focused\": { color: \"var(--fg-muted)\" },\r\n    \"&.Mui-error\":   { color: \"var(--fg-muted)\" },\r\n  } as const;\r\n\r\n  // Shared label content (text + required marker + optional help adornment).\r\n  const labelContent = (\r\n    <>\r\n      {label}\r\n      {required && (\r\n        <Box\r\n          component=\"span\"\r\n          aria-hidden=\"true\"\r\n          sx={{ color: \"var(--danger)\", fontWeight: \"var(--fw-bold, 700)\" }}\r\n        >\r\n          *\r\n        </Box>\r\n      )}\r\n      {helpAdornment}\r\n    </>\r\n  );\r\n\r\n  return (\r\n    <FormControl\r\n      error={hasError}\r\n      required={required}\r\n      disabled={disabled}\r\n      fullWidth={fullWidth}\r\n      className={className}\r\n      sx={{\r\n        /* G-H — plafond a partir de `sm` seulement : sur mobile le standard\r\n         * impose 100% de la largeur de grille. */\r\n        ...(width\r\n          ? { maxWidth: { xs: \"100%\", sm: FIELD_MAX_WIDTH[width] } }\r\n          : {}),\r\n        ...sx,\r\n      }}\r\n    >\r\n      {label &&\r\n        (group ? (\r\n          // Group mode: render as a <span> carrying an id (no <label for>),\r\n          // referenced by the group's aria-labelledby.\r\n          <FormLabel component=\"span\" id={labelId} required={false} sx={LABEL_SX}>\r\n            {labelContent}\r\n          </FormLabel>\r\n        ) : (\r\n          <FormLabel htmlFor={inputId} required={false /* we render the * ourselves */} sx={LABEL_SX}>\r\n            {labelContent}\r\n          </FormLabel>\r\n        ))}\r\n\r\n      {enhanced}\r\n\r\n      {hint && !hasError && (\r\n        <FormHelperText\r\n          id={hintId}\r\n          sx={{ ...helperResetSx, color: \"var(--fg-subtle)\" }}\r\n        >\r\n          {hint}\r\n        </FormHelperText>\r\n      )}\r\n\r\n      {hasError && (\r\n        /*\r\n         * Rendered by the shared `FieldError` (gap G-18) rather than an inline\r\n         * `FormHelperText`: R-4.1 MUST requires the icon, and a host with a\r\n         * LIST-level error (a Formik array, an upload slot) has no single\r\n         * control to wrap in a `Field` and needs the exact same renderer\r\n         * standalone. One component, both paths, no drift.\r\n         *\r\n         * `marginTop: var(--s-1)` (4px) replaces `FormHelperText`'s hard-coded\r\n         * 3px default — same optical result, on the spacing scale (R-S.1).\r\n         * Dropping FormHelperText also removed a `color: … !important` that\r\n         * only existed to beat MUI's own `Mui-error` colour.\r\n         */\r\n        <FieldError id={errorId} sx={{ marginTop: \"var(--s-1)\" }}>\r\n          {error}\r\n        </FieldError>\r\n      )}\r\n    </FormControl>\r\n  );\r\n}\r\n\r\nexport default Field;\r\n"],"mappings":"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","ignoreList":[]}