origam 2.17.1 → 2.18.0

package/dist/src/consts/Commons/elevation.const.cjs

@@ -3,9 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.UTILITY_SHADOW_RUNGS = exports.SHADOW_UTILITY_CLASS_PREFIX = exports.SHADOW_TOKEN_PREFIX = exports.ORIGAM_SHADOW_RUNGS = exports.MATERIAL_ELEVATION_TOP_RUNG = exports.MATERIAL_ELEVATION_LADDER = exports.ELEVATION_LEGACY_BG_COLOR = exports.ELEVATION_BG_COLOR_DEPRECATION_WARNING = exports.ELEVATED_CLASS_SUFFIX = exports.CUSTOM_BOX_SHADOW_REGEX = void 0;
+exports.UTILITY_SHADOW_RUNGS = exports.SHADOW_UTILITY_CLASS_PREFIX = exports.SHADOW_TOKEN_PREFIX = exports.SHADOW_RUNG_FALLBACK = exports.ORIGAM_SHADOW_RUNGS = exports.MATERIAL_ELEVATION_TOP_RUNG = exports.MATERIAL_ELEVATION_LADDER = exports.ELEVATION_LEGACY_BG_COLOR = exports.ELEVATION_BG_COLOR_DEPRECATION_WARNING = exports.ELEVATED_CLASS_SUFFIX = exports.CUSTOM_BOX_SHADOW_REGEX = void 0;
 const ORIGAM_SHADOW_RUNGS = exports.ORIGAM_SHADOW_RUNGS = /* @__PURE__ */new Set(["none", "xs", "sm", "md", "lg", "xl", "2xl", "3xl"]);
 const UTILITY_SHADOW_RUNGS = exports.UTILITY_SHADOW_RUNGS = /* @__PURE__ */new Set(["none", "xs", "sm", "md", "lg", "xl"]);
+const SHADOW_RUNG_FALLBACK = exports.SHADOW_RUNG_FALLBACK = {
+  "2xl": "var(--origam-shadow---xl)",
+  "3xl": "var(--origam-shadow---xl)"
+};
 const MATERIAL_ELEVATION_LADDER = exports.MATERIAL_ELEVATION_LADDER = [{
   maxLevel: 0,
   rung: "none"

package/dist/src/consts/Commons/elevation.const.d.ts

@@ -18,10 +18,60 @@ export declare const ORIGAM_SHADOW_RUNGS: ReadonlySet<string>;
  * @description
  * Subset of shadow rungs for which a global utility class exists in
  * `src/assets/css/tokens/origam-utilities.css` (Phase 1 manifest).
- * `2xl` and `3xl` are not yet emitted as utilities — they fall back
- * to the inline-style path.
+ * `2xl` and `3xl` are not emitted as utilities — they take the
+ * inline-style path instead.
+ *
+ * @description
+ * ⚠️ This comment used to say they « fall back » to that path. The word
+ * was reassuring for nothing: the inline path emitted a BARE
+ * `var(--origam-shadow---2xl)`, and no sheet declares that token, so the
+ * repli led to an unresolvable reference rather than to a value (#813).
+ * The declaration then lost at computed-value time — and since it had
+ * ALREADY won the cascade, it did not cede to the component's own rule,
+ * it ERASED it. See {@link SHADOW_RUNG_FALLBACK}.
  ********************************************************/
 export declare const UTILITY_SHADOW_RUNGS: ReadonlySet<string>;
+/*********************************************************
+ * SHADOW_RUNG_FALLBACK
+ *
+ * @description
+ * Second argument of the `var()` emitted by `useElevation`, for the rungs
+ * `ORIGAM_SHADOW_RUNGS` accepts but NO sheet declares. Keyed by rung; a
+ * rung absent from this map is emitted as a bare `var()` because its token
+ * genuinely exists.
+ *
+ * @description
+ * ⛔ #813 — `2xl` and `3xl` are accepted by the prop and declared nowhere.
+ * Measured in Chromium: a component rule `rgba(0,0,0,.9) 0 1px 2px`
+ * computed `none` once `elevation="2xl"` was passed. The unresolvable
+ * reference does not merely fail to paint, it DESTROYS the shadow the
+ * component already had.
+ *
+ * @description
+ * The fallback targets `xl`, the top declared rung. Consequence, and it is
+ * deliberate: **`2xl` and `3xl` render exactly like `xl`** — they stop
+ * erasing, they do not become two extra rungs. Declaring real `2xl` / `3xl`
+ * tokens is a DESIGN decision, not a bug fix: the ladder has no derivable
+ * progression (`md` is a different family — a 1px ring plus a soft shadow)
+ * and `xl` is already the top of the Material 0..24 scale this DS maps
+ * (`MATERIAL_ELEVATION_TOP_RUNG`). There is no rung above to borrow from.
+ * The day those tokens are declared, this fallback goes inert on its own —
+ * nothing here has to be undone.
+ *
+ * @description
+ * ⚠️ The fallback MUST be a real shadow. `var(--origam-shadow---2xl, none)`
+ * was measured too: the declaration becomes valid but computes `none`,
+ * i.e. visually identical to the defect. A `none` fallback fixes nothing.
+ *
+ * @description
+ * Mirrors the intent of `UTILITY_RADIUS_FALLBACK` (`spacing.const.ts`),
+ * which is why `useRounded` never had this defect. It deliberately does NOT
+ * mirror its SHAPE: that map gives every rung a hard literal (`md: '8px'`),
+ * which for a 3-layer box-shadow would mean copying the token values into
+ * TypeScript — duplication plus guaranteed drift the first time a designer
+ * retunes `xl`. A var-to-var fallback carries no value at all.
+ ********************************************************/
+export declare const SHADOW_RUNG_FALLBACK: Readonly<Record<string, string>>;
 /*********************************************************
  * MATERIAL_ELEVATION_LADDER
  *

package/dist/src/consts/Commons/elevation.const.js

@@ -16,6 +16,10 @@ export const UTILITY_SHADOW_RUNGS = /* @__PURE__ */ new Set([
   "lg",
   "xl"
 ]);
+export const SHADOW_RUNG_FALLBACK = {
+  "2xl": "var(--origam-shadow---xl)",
+  "3xl": "var(--origam-shadow---xl)"
+};
 export const MATERIAL_ELEVATION_LADDER = [
   { maxLevel: 0, rung: "none" },
   { maxLevel: 1, rung: "xs" },

package/dist/src/consts/Commons/ripple.const.cjs

@@ -36,6 +36,16 @@ const RIPPLE_OPTIONS = exports.RIPPLE_OPTIONS = {
   x: 0,
   y: 0
 };
+function scheduleRippleTimer(el, cb, delay) {
+  const store = el._ripple;
+  if (!store) return;
+  const id = setTimeout(() => {
+    store.timers?.delete(id);
+    cb();
+  }, delay);
+  store.timers ??= /* @__PURE__ */new Set();
+  store.timers.add(id);
+}
 const RIPPLES = exports.RIPPLES = {
   show(e, el, value = {}) {
     if (!el?._ripple?.enabled) {
@@ -70,7 +80,7 @@ const RIPPLES = exports.RIPPLES = {
     animation.classList.add("origam-ripple__animation--visible");
     (0, _ripple.rippleTransform)(animation, `translate(${x}, ${y}) scale3d(${scale},${scale},${scale})`);
     animation.dataset.activated = String(performance.now());
-    setTimeout(() => {
+    scheduleRippleTimer(el, () => {
       animation.classList.remove("origam-ripple__animation--enter");
       animation.classList.add("origam-ripple__animation--in");
       (0, _ripple.rippleTransform)(animation, `translate(${centerX}, ${centerY}) scale3d(1,1,1)`);
@@ -84,10 +94,10 @@ const RIPPLES = exports.RIPPLES = {
     if (animation.dataset?.isHiding) return;else animation.dataset.isHiding = "true";
     const diff = performance.now() - Number(animation.dataset.activated);
     const delay = Math.max(250 - diff, 0);
-    setTimeout(() => {
+    scheduleRippleTimer(el, () => {
       animation.classList.remove("origam-ripple__animation--in");
       animation.classList.add("origam-ripple__animation--out");
-      setTimeout(() => {
+      scheduleRippleTimer(el, () => {
         const ripples2 = el.getElementsByClassName("origam-ripple__animation");
         if (ripples2.length === 1 && el.dataset.previousPosition) {
           el.style.position = el.dataset.previousPosition;

package/dist/src/consts/Commons/ripple.const.js

@@ -30,6 +30,16 @@ export const RIPPLE_OPTIONS = {
   x: 0,
   y: 0
 };
+function scheduleRippleTimer(el, cb, delay) {
+  const store = el._ripple;
+  if (!store) return;
+  const id = setTimeout(() => {
+    store.timers?.delete(id);
+    cb();
+  }, delay);
+  store.timers ??= /* @__PURE__ */ new Set();
+  store.timers.add(id);
+}
 export const RIPPLES = {
   show(e, el, value = {}) {
     if (!el?._ripple?.enabled) {
@@ -57,7 +67,7 @@ export const RIPPLES = {
     animation.classList.add("origam-ripple__animation--visible");
     rippleTransform(animation, `translate(${x}, ${y}) scale3d(${scale},${scale},${scale})`);
     animation.dataset.activated = String(performance.now());
-    setTimeout(() => {
+    scheduleRippleTimer(el, () => {
       animation.classList.remove("origam-ripple__animation--enter");
       animation.classList.add("origam-ripple__animation--in");
       rippleTransform(animation, `translate(${centerX}, ${centerY}) scale3d(1,1,1)`);
@@ -72,10 +82,10 @@ export const RIPPLES = {
     else animation.dataset.isHiding = "true";
     const diff = performance.now() - Number(animation.dataset.activated);
     const delay = Math.max(250 - diff, 0);
-    setTimeout(() => {
+    scheduleRippleTimer(el, () => {
       animation.classList.remove("origam-ripple__animation--in");
       animation.classList.add("origam-ripple__animation--out");
-      setTimeout(() => {
+      scheduleRippleTimer(el, () => {
         const ripples2 = el.getElementsByClassName("origam-ripple__animation");
         if (ripples2.length === 1 && el.dataset.previousPosition) {
           el.style.position = el.dataset.previousPosition;

package/dist/src/consts/RatingField/rating-field.const.cjs

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RATING_FIELD_ROOT_SELECTOR = exports.RATING_FIELD_MUTATING_KEYS = exports.RATING_FIELD_ENABLED_RADIO_SELECTOR = void 0;
+var _hotkey = require("../../enums/Commons/hotkey.enum.cjs");
+const RATING_FIELD_MUTATING_KEYS = exports.RATING_FIELD_MUTATING_KEYS = [_hotkey.KEYBOARD_VALUES.UP, _hotkey.KEYBOARD_VALUES.DOWN, _hotkey.KEYBOARD_VALUES.LEFT, _hotkey.KEYBOARD_VALUES.RIGHT, _hotkey.KEYBOARD_VALUES.HOME, _hotkey.KEYBOARD_VALUES.END, _hotkey.KEYBOARD_VALUES.EMPTY];
+const RATING_FIELD_ENABLED_RADIO_SELECTOR = exports.RATING_FIELD_ENABLED_RADIO_SELECTOR = 'input[type="radio"]:not(:disabled)';
+const RATING_FIELD_ROOT_SELECTOR = exports.RATING_FIELD_ROOT_SELECTOR = ".origam-rating-field";

package/dist/src/consts/RatingField/rating-field.const.d.ts

@@ -0,0 +1,36 @@
+/*********************************************************
+ * RATING_FIELD_MUTATING_KEYS
+ *
+ * @description
+ * Keys whose NATIVE default action changes the selection of a radio group.
+ * Measured in Chromium on a bare `<input type="radio">` group, no JS at all:
+ * `ArrowRight` / `ArrowDown` move focus AND check the next radio (wrapping),
+ * `ArrowLeft` / `ArrowUp` do the same backwards, `Space` checks the focused
+ * radio when it is not already checked, and `Home` / `End` / `Enter` are
+ * no-ops.
+ *
+ * @description
+ * All of the above are cancelable from a `keydown` listener — verified: with
+ * `preventDefault()` on every `Arrow*`, focus and `:checked` both stayed put.
+ * That is what lets `readonly` keep the group REACHABLE (focus visible,
+ * announced) while staying inert, instead of dropping it out of the tab order.
+ *
+ * @description
+ * ⚠️ `Space` is `' '` in `KeyboardEvent.key`, NOT `'Space'` — that spelling is
+ * `KeyboardEvent.code`. `KEYBOARD_VALUES.SPACE` carries the `code` form and
+ * would never match here; `KEYBOARD_VALUES.EMPTY` is the `key` one.
+ ********************************************************/
+export declare const RATING_FIELD_MUTATING_KEYS: string[];
+/*********************************************************
+ * RATING_FIELD_ENABLED_RADIO_SELECTOR / RATING_FIELD_ROOT_SELECTOR
+ *
+ * @description
+ * The radios a keyboard user can actually reach inside the group. `:disabled`
+ * radios are excluded by the browser from both the tab order and the arrow
+ * cycle, so `Home` / `End` must skip them too.
+ *
+ * @description
+ * The root BEM block, used to walk up from a focused radio to its group.
+ ********************************************************/
+export declare const RATING_FIELD_ENABLED_RADIO_SELECTOR = "input[type=\"radio\"]:not(:disabled)";
+export declare const RATING_FIELD_ROOT_SELECTOR = ".origam-rating-field";

package/dist/src/consts/RatingField/rating-field.const.js

@@ -0,0 +1,12 @@
+import { KEYBOARD_VALUES } from "../../enums/Commons/hotkey.enum.js";
+export const RATING_FIELD_MUTATING_KEYS = [
+  KEYBOARD_VALUES.UP,
+  KEYBOARD_VALUES.DOWN,
+  KEYBOARD_VALUES.LEFT,
+  KEYBOARD_VALUES.RIGHT,
+  KEYBOARD_VALUES.HOME,
+  KEYBOARD_VALUES.END,
+  KEYBOARD_VALUES.EMPTY
+];
+export const RATING_FIELD_ENABLED_RADIO_SELECTOR = 'input[type="radio"]:not(:disabled)';
+export const RATING_FIELD_ROOT_SELECTOR = ".origam-rating-field";

package/dist/src/consts/index.cjs

@@ -630,6 +630,17 @@ Object.keys(_slideGroup).forEach(function (key) {
     }
   });
 });
+var _ratingField = require("./RatingField/rating-field.const.cjs");
+Object.keys(_ratingField).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ratingField[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _ratingField[key];
+    }
+  });
+});
 var _textField = require("./TextField/text-field.const.cjs");
 Object.keys(_textField).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/dist/src/consts/index.d.ts

@@ -55,6 +55,7 @@ export * from './Form/form.const';
 export * from './Input/input.const';
 export * from './Chip/chip-group.const';
 export * from './Slide/slide-group.const';
+export * from './RatingField/rating-field.const';
 export * from './TextField/text-field.const';
 export * from './TextareaField/textarea-field.const';
 export * from './EmptyState/empty-state.const';

package/dist/src/consts/index.js

@@ -55,6 +55,7 @@ export * from "./Form/form.const.js";
 export * from "./Input/input.const.js";
 export * from "./Chip/chip-group.const.js";
 export * from "./Slide/slide-group.const.js";
+export * from "./RatingField/rating-field.const.js";
 export * from "./TextField/text-field.const.js";
 export * from "./TextareaField/textarea-field.const.js";
 export * from "./EmptyState/empty-state.const.js";

package/dist/src/directives/ClickOutside/clickOutside.directive.cjs

@@ -58,6 +58,8 @@ const ClickOutside = exports.ClickOutside = {
   },
   unmounted(el, binding) {
     if (!el._clickOutside) return;
+    for (const id of el._clickOutside.timers ?? []) clearTimeout(id);
+    el._clickOutside.timers?.clear();
     (0, _clickOutside.handleShadow)(el, app => {
       if (!app || !el._clickOutside?.[binding.instance.$.uid]) return;
       const {

package/dist/src/directives/ClickOutside/clickOutside.directive.js

@@ -52,6 +52,8 @@ export const ClickOutside = {
   },
   unmounted(el, binding) {
     if (!el._clickOutside) return;
+    for (const id of el._clickOutside.timers ?? []) clearTimeout(id);
+    el._clickOutside.timers?.clear();
     handleShadow(el, (app) => {
       if (!app || !el._clickOutside?.[binding.instance.$.uid]) return;
       const { onClick, onMousedown } = el._clickOutside[binding.instance.$.uid];

package/dist/src/directives/Ripple/ripple.directive.cjs

@@ -10,6 +10,8 @@ const Ripple = exports.Ripple = {
     (0, _ripple.updateRipple)(el, binding, false);
   },
   unmounted: el => {
+    for (const id of el._ripple?.timers ?? []) clearTimeout(id);
+    el._ripple?.timers?.clear();
     delete el._ripple;
     (0, _ripple.rippleRemoveListeners)(el);
   },

package/dist/src/directives/Ripple/ripple.directive.js

@@ -4,6 +4,8 @@ export const Ripple = {
     updateRipple(el, binding, false);
   },
   unmounted: (el) => {
+    for (const id of el._ripple?.timers ?? []) clearTimeout(id);
+    el._ripple?.timers?.clear();
     delete el._ripple;
     rippleRemoveListeners(el);
   },

package/dist/src/enums/Commons/color.enum.cjs

@@ -8,6 +8,5 @@ var BG_FG_ROLE = exports.BG_FG_ROLE = /* @__PURE__ */(BG_FG_ROLE2 => {
   BG_FG_ROLE2["DEFAULT"] = "default";
   BG_FG_ROLE2["HOVER"] = "hover";
   BG_FG_ROLE2["ACTIVE"] = "active";
-  BG_FG_ROLE2["DISABLED"] = "disabled";
   return BG_FG_ROLE2;
 })(BG_FG_ROLE || {});

package/dist/src/enums/Commons/color.enum.d.ts

@@ -1,17 +1,26 @@
 /**
  * Interaction role for state-aware color resolution.
  *
- * Used by `useColorEffect` (and its helpers) to pick the right token
- * rung / math-derivation for a given visual state:
+ * Used by `useColorEffect` / `useStateEffect` (and their helpers) to pick
+ * the right token rung / math-derivation for a given visual state:
  *
  *   • `default`  → resting bgColor (no transformation)
  *   • `hover`    → cascading `var(bgHover, color-mix(bg, black 20%))`
  *   • `active`   → cascading `var(bgActive, color-mix(bg, black 30%))`
- *   • `disabled` → resting `bgDisabled` token (per-intent)
+ *
+ * ⛔ There is deliberately NO `disabled` member — #823. Disabled is an
+ * OPACITY VEIL in this DS, never a token swap: both composables compute
+ * `bgRole` from `isHover` / `isActive` alone and read `isDisabled` only to
+ * keep the dependency wired. A `disabled` rung would resolve
+ * `--origam-color__feedback--{intent}---bgDisabled` / `---fgDisabled`,
+ * which NO sheet declares for the four `feedback` intents (`action.*` has
+ * them, `feedback.*` does not — see `docs/integrations/theming-authoring.md`).
+ * A `var()` that fails at computed-value time does not fall back: the
+ * declaration has already won the cascade, becomes `unset`, and ERASES the
+ * surface instead of yielding it (the #813 / #568 mechanism).
  */
 export declare enum BG_FG_ROLE {
     DEFAULT = "default",
     HOVER = "hover",
-    ACTIVE = "active",
-    DISABLED = "disabled"
+    ACTIVE = "active"
 }

package/dist/src/enums/Commons/color.enum.js

@@ -2,6 +2,5 @@ export var BG_FG_ROLE = /* @__PURE__ */ ((BG_FG_ROLE2) => {
   BG_FG_ROLE2["DEFAULT"] = "default";
   BG_FG_ROLE2["HOVER"] = "hover";
   BG_FG_ROLE2["ACTIVE"] = "active";
-  BG_FG_ROLE2["DISABLED"] = "disabled";
   return BG_FG_ROLE2;
 })(BG_FG_ROLE || {});

package/dist/src/enums/Sheet/sheet.enum.d.ts

@@ -2,7 +2,7 @@
  * Well-known bottom-sheet snap-point ids understood by `<OrigamSheet>`
  * (`swipeable + side="bottom"`) out of the box.
  *
- * `TSheetSnapId` widens this set with `(string & {})` so brand
+ * `TSheetSnapId` widens this set with `TAnyString` so brand
  * integrations can add their own rungs without forking — the enum only
  * names the ones the component ships defaults for.
  */

package/dist/src/interfaces/Chart/chart-cartesian.interface.d.ts

@@ -98,8 +98,12 @@ export interface IChartCartesianProps extends IChartBaseProps {
      * zoomResetLabel
      *
      * @description
-     * Accessible name for the "Reset zoom" control (aria-label) shown
-     * when `zoomable` is active and the plot is currently zoomed.
+     * Name of the "Reset zoom" control shown when `zoomable` is active
+     * and the plot is currently zoomed. Drives BOTH the `aria-label`
+     * and the VISIBLE text of the button — until #764 the visible text
+     * was a hardcoded English literal, so a French consumer read
+     * "Reset zoom" on a control whose accessible name already said
+     * "Réinitialiser le zoom".
      * Carries a locale key, not final text — it is resolved through the
      * DS `t()` mechanism. Defaults to `'origam.chart.zoom.reset_aria_label'`
      * (#477).

package/dist/src/interfaces/Commons/activator.interface.d.ts

@@ -1,8 +1,9 @@
 import type { ComponentPublicInstance } from 'vue';
 import type { IDelayProps } from './delay.interface';
+import type { TAnyString } from '../../types/Commons/commons.type';
 export interface IActivatorProps extends IDelayProps {
-    target?: 'parent' | 'cursor' | (string & {}) | Element | ComponentPublicInstance | [x: number, y: number] | undefined;
-    activator?: 'parent' | 'cursor' | (string & {}) | Element | ComponentPublicInstance;
+    target?: 'parent' | 'cursor' | TAnyString | Element | ComponentPublicInstance | [x: number, y: number] | undefined;
+    activator?: 'parent' | 'cursor' | TAnyString | Element | ComponentPublicInstance;
     activatorProps?: any;
     openOnClick?: boolean;
     openOnContextMenu?: boolean;

package/dist/src/interfaces/Commons/adjacent.interface.d.ts

@@ -1,10 +1,37 @@
 import type { TIcon } from '../../types/Icon/icon.type';
+/*********************************************************
+ * IAdjacentProps
+ *
+ * @description
+ * Media and accessible name of a component's OUTER prepend/append zone.
+ *
+ * @description
+ * ⛔ issue #747 — `prependAriaLabel` / `appendAriaLabel` are what allow the
+ * zone to become a real `role="button"` tab stop when `click:prepend` /
+ * `click:append` is wired. Without one, `useAccessibleCommand` emits NO role
+ * and NO tabindex rather than an anonymous ARIA button (WCAG 2.1 4.1.2), and
+ * warns in development. Each accepts an i18n key or a literal string — the
+ * same contract as the existing `closeLabel` on Alert / Chip / Dialog.
+ ********************************************************/
 export interface IAdjacentProps {
     appendAvatar?: string;
     appendIcon?: TIcon;
     prependAvatar?: string;
     prependIcon?: TIcon;
+    prependAriaLabel?: string;
+    appendAriaLabel?: string;
 }
+/*********************************************************
+ * IAdjacentInnerProps
+ *
+ * @description
+ * Same surface for the INNER zone — the one rendered inside the field
+ * chrome rather than outside it.
+ *
+ * @description
+ * ⛔ issue #747 — `prependInnerAriaLabel` / `appendInnerAriaLabel` carry the
+ * accessible name, under exactly the contract described on `IAdjacentProps`.
+ ********************************************************/
 export interface IAdjacentInnerProps {
     appendInnerAvatar?: string;
     appendInnerIcon?: TIcon;
@@ -12,6 +39,8 @@ export interface IAdjacentInnerProps {
     prependInnerIcon?: TIcon;
     clearIcon?: TIcon;
     clearable?: boolean;
+    prependInnerAriaLabel?: string;
+    appendInnerAriaLabel?: string;
 }
 /** Click events emitted when the user clicks the prepend/append slots. */
 export interface IAdjacentEmits {

package/dist/src/interfaces/Commons/group.interface.d.ts

@@ -1,4 +1,15 @@
 import type { ComponentInternalInstance, ComputedRef, Ref } from 'vue';
+/*********************************************************
+ * prev / next (IGroupProvide)
+ *
+ * @description
+ * ⛔ #786 — renvoient l'id RETENU, ou `undefined` si rien n'a bouge
+ * (groupe vide, ou seul candidat desactive). Un appelant ne peut PAS
+ * relire `selected` juste apres l'appel : quand le modele est controle
+ * (le consommateur a pose un `v-model`), le getter de `useVModel` rend
+ * `props[prop]` — donc encore l'ANCIEN id. Voir le bloc `step` dans
+ * `group.composable.ts` pour la mesure.
+ ********************************************************/
 /*********************************************************
  * domId (IGroupItem / IGroupProvide.items[number])
  *
@@ -21,8 +32,8 @@ export interface IGroupProvide {
     select: (id: number, value: boolean) => void;
     selected: Ref<Readonly<Array<number>>>;
     isSelected: (id: number) => boolean;
-    prev: () => void;
-    next: () => void;
+    prev: () => number | undefined;
+    next: () => number | undefined;
     selectedClass: Ref<string | undefined>;
     items: ComputedRef<Array<{
         id: number;

package/dist/src/interfaces/Commons/ripple.interface.d.ts

@@ -31,6 +31,22 @@ export interface IRippleHtmlElementRipple {
     isTouch?: boolean;
     showTimer?: number;
     showTimerCommit?: null | (() => void);
+    /*********************************************************
+     * Timers d'animation en vol (#753)
+     *
+     * @description
+     * Les trois `setTimeout` de `RIPPLES.show` / `RIPPLES.hide`
+     * orchestrent les phases de l'animation (`--enter` → `--in` →
+     * `--out`) et retirent le noeud a la fin. Rien ne les annulait au
+     * `unmounted` de la directive, alors que la cadence la plus longue
+     * (250 ms d'attente + 300 ms de sortie) depasse largement la duree de
+     * vie d'un bouton qui disparait sur son propre clic.
+     *
+     * @description
+     * La portee est l'ELEMENT (directive), pas un scope Vue : les handles
+     * vivent donc ici, avec le reste de l'etat du ripple.
+     ********************************************************/
+    timers?: Set<ReturnType<typeof setTimeout>>;
 }
 export interface IRippleElement extends Element {
     dataset?: IRippleElementDataset;

package/dist/src/interfaces/Commons/scroll.interface.d.ts

@@ -1,15 +1,16 @@
 import type { TScrollBehavior } from '../../types/Toolbar/toolbar.type';
 import type { TScrollStrategy, TScrollStrategyFn } from '../../types/Commons/scroll.type';
+import type { TAnyString } from '../../types/Commons/commons.type';
 import type { Ref } from 'vue';
 export interface IScrollProps {
     /**
      * Space-separated list of scroll behaviours, e.g. `"hide inverted"` or
      * `"elevate active"`. `inverted` is a MODIFIER that flips the trigger of
      * `hide` / `collapse` / `elevate` and does nothing on its own. The
-     * `(string & {})` member keeps single-token autocomplete while allowing
+     * `TAnyString` member keeps single-token autocomplete while allowing
      * multi-token combinations.
      */
-    scrollBehavior?: TScrollBehavior | (string & {});
+    scrollBehavior?: TScrollBehavior | TAnyString;
     scrollTarget?: string;
     scrollThreshold?: string | number;
 }

package/dist/src/interfaces/DataTable/data-table-header.interface.d.ts

@@ -2,7 +2,7 @@ import { ALIGN } from '../../enums/Commons/align.enum';
 import type { IDataTableItem } from './items.interface';
 import type { TDataTableCompareFunction, TDataTableHeaderCell } from '../../types/DataTable/data-table.type';
 import type { TFilterFunction } from '../../types/Commons/filters.type';
-import type { TSelectItemKey } from '../../types/Commons/commons.type';
+import type { TAnyString, TSelectItemKey } from '../../types/Commons/commons.type';
 /*********************************************************
  * IDataTableHeaderProps / IDataTableHeader / IInternalDataTableHeader
  *
@@ -18,7 +18,7 @@ export interface IDataTableHeaderProps {
     items?: Array<IDataTableItem>;
 }
 export interface IDataTableHeader<T = any> {
-    key?: 'data-table-group' | 'data-table-select' | 'data-table-expand' | (string & {});
+    key?: 'data-table-group' | 'data-table-select' | 'data-table-expand' | TAnyString;
     value?: TSelectItemKey<T>;
     title?: string;
     fixed?: boolean;

package/dist/src/interfaces/DatePicker/date-picker-month.interface.d.ts

@@ -2,9 +2,10 @@ import type { ICalendarProps, IDay } from './date-picker-calendar.interface';
 import type { IColorProps } from '../Commons/color.interface';
 import type { ICommonsComponentProps } from '../Commons/commons.interface';
 import type { TTransitionProps } from '../../types/Transition/transition.type';
+import type { TAnyString } from '../../types/Commons/commons.type';
 export interface IDatePickerMonthProps extends ICommonsComponentProps, IColorProps, ICalendarProps {
     hideWeekdays?: boolean;
-    multiple?: boolean | number | (string & {});
+    multiple?: boolean | number | TAnyString;
     range?: boolean;
     showWeek?: boolean;
     transition?: TTransitionProps;

package/dist/src/interfaces/Menu/menu.interface.d.ts

@@ -7,7 +7,34 @@ export interface IMenuProvide {
     unregister(): void;
     closeParents(): void;
 }
-export interface IMenuProps extends IOverlayProps, IListProps, IListItemProps {
+/*********************************************************
+ * IMenuProps
+ *
+ * @description
+ * ⛔ OUTER adjacent surface stripped (#756). `IListItemProps` carries
+ * `IAdjacentProps` (`prependIcon` / `appendIcon` / `prependAvatar` /
+ * `appendAvatar` / `prependAriaLabel` / `appendAriaLabel`) because a LIST ROW
+ * renders that zone. `<OrigamMenu>` does not: it renders rows from `items`,
+ * and each row gets its media from the ITEM object (`{ title, prependIcon }`),
+ * never from the menu's own props — `menuItemProps()` spreads the item, and
+ * `overlayProps` is filtered down to what `<origam-overlay>` declares.
+ *
+ * @description
+ * Measured, jsdom, sentinel values passed as props and grepped out of
+ * `document.body.innerHTML`: `<origam-list-item>` renders
+ * `.origam-list-item__prepend` / `__append` and carries the name;
+ * `<origam-menu model-value items=…>` renders NO such node at all. The four
+ * media props were already recorded as inert in
+ * `guards/baseline/unconsumed-props.json`; the two name props would have
+ * joined them, so the whole surface goes instead.
+ *
+ * @description
+ * ⚠️ The REST of `IListItemProps` is still inherited and still largely inert
+ * here (33 further entries in that same baseline: `href`, `to`, `tag`,
+ * `ripple`, `subtitle`, `lines`, `slim`…). Narrowing those is a separate,
+ * wider decision and is deliberately NOT done in this fix.
+ ********************************************************/
+export interface IMenuProps extends IOverlayProps, IListProps, Omit<IListItemProps, 'prependIcon' | 'appendIcon' | 'prependAvatar' | 'appendAvatar' | 'prependAriaLabel' | 'appendAriaLabel'> {
     id?: string;
 }
 /** Emits fired by `<OrigamMenu>` — v-model on the open state, the

package/dist/src/interfaces/OtpInputField/otp-input-field.interface.d.ts

@@ -22,8 +22,28 @@ import type { TOtpInputFieldType } from '../../types/OtpInputField/otp-input-fie
  * Only `fontSize` does (the visible `.origam-otp-input-field__field` cell).
  * `Omit` strips the inherited surface back down before re-adding exactly
  * what this component supports.
+ *
+ * @description
+ * ⛔ OUTER adjacent surface stripped for the SAME structural reason (#756).
+ * `IAdjacentProps` (`prependIcon` / `appendIcon` / `prependAvatar` /
+ * `appendAvatar` / `prependAriaLabel` / `appendAriaLabel`) is inherited from
+ * `IInputProps`, and the element that renders that zone — the
+ * `.origam-input__prepend` / `.origam-input__append` span in
+ * `OrigamInput.vue` — is never mounted here, exactly as the paragraph above
+ * says. Measured, jsdom, sentinel values passed as props and grepped out of
+ * `document.body.innerHTML`: `<origam-input>` and `<origam-text-field>` both
+ * render the zone and carry the name; `<origam-otp-input-field>` renders NO
+ * `origam-input__prepend` / `__append` node at all. The four media props were
+ * already recorded as inert in `guards/baseline/unconsumed-props.json`; the
+ * two name props would have joined them, so the whole surface goes instead.
+ *
+ * @description
+ * The INNER zone is untouched and is the one this component really has:
+ * `prependInnerAriaLabel` / `appendInnerAriaLabel` come through `IFieldProps`
+ * → `IAdjacentInnerProps`, reach `<origam-field>` via `fieldProps()`, and were
+ * measured PRESENT in the same sweep.
  ********************************************************/
-export interface IOtpInputFieldProps extends Omit<IFieldProps, 'fontFamily' | 'fontWeight' | 'lineHeight' | 'letterSpacing'>, Omit<IInputProps, 'fontFamily' | 'fontWeight' | 'lineHeight' | 'letterSpacing'>, IVariantProps, Pick<ITypographyProps, 'fontSize'> {
+export interface IOtpInputFieldProps extends Omit<IFieldProps, 'fontFamily' | 'fontWeight' | 'lineHeight' | 'letterSpacing'>, Omit<IInputProps, 'fontFamily' | 'fontWeight' | 'lineHeight' | 'letterSpacing' | 'prependIcon' | 'appendIcon' | 'prependAvatar' | 'appendAvatar' | 'prependAriaLabel' | 'appendAriaLabel'>, IVariantProps, Pick<ITypographyProps, 'fontSize'> {
     autofocus?: boolean;
     divider?: string;
     focusAll?: boolean;