origam 2.18.18 → 2.18.19

package/dist/src/components/SliderField/OrigamSliderField.vue

@@ -981,14 +981,67 @@ defineExpose({
 			position: absolute;
 			pointer-events: none;
 			bottom: calc(100% + 6px);
+			/*
+			 * ⛔ #595 — FAUX POSITIF de `token-var-channels`, a laisser en
+			 * baseline. `--origam-slider-field---hover-x` est ECRIT PAR
+			 * INSTANCE, en style inline, par le `pointermove` de ce meme
+			 * composant (`container.style.setProperty(...)`, ~l.680) et RETIRE
+			 * au `pointerleave` (`removeProperty`, ~l.703). Une custom property
+			 * est substituee SUR L ELEMENT QUI LA DECLARE : la declarer a
+			 * `:root` ferait que, apres `removeProperty`, l infobulle ne
+			 * retomberait plus sur le repli `0%` mais sur la valeur de la
+			 * feuille — l infobulle resterait collee a sa derniere position au
+			 * lieu de revenir au depart. La garde compare des noms, pas des
+			 * chaines de repli : elle ne peut pas voir la difference.
+			 */
 			inset-inline-start: var(--origam-slider-field---hover-x, 0%);
 			transform: translateX(-50%);
 			padding: 3px 6px;
-			background: var(--origam-slider-field__hover-tooltip---background-color, var(--origam-color__surface--inverse---bg, rgba(0, 0, 0, 0.85)));
-			color: var(--origam-slider-field__hover-tooltip---color, var(--origam-color__on--inverse---fg, #ffffff));
+			/*
+			 * #595 — EFFONDREMENT. Ces deux lignes lisaient
+			 * `var(RUNG1, var(--origam-color__{surface--inverse---bg,
+			 * on--inverse---fg}, T))`. Les deux RUNG1 viennent d etre declares
+			 * dans les feuilles — AVEC leur `var()` interne recopie verbatim,
+			 * donc le canal `--inverse` reste atteignable PAR LA FEUILLE. Le
+			 * garder aussi ici etait du poids mort : RUNG1 etant declare,
+			 * l echelon 2 du site de lecture est inatteignable par
+			 * construction. Retire : zero pixel deplace, deux canaux morts en
+			 * moins.
+			 *
+			 * ⛔ Et les deux noms de l echelon 2 etaient FAUX. Forme d ETAT
+			 * (`--inverse---`) d une famille qui n existe pas : zero
+			 * declaration dans tout `assets/`. L infobulle retombait donc
+			 * eternellement sur son repli sombre en dur, qui n inversait
+			 * JAMAIS. Les vrais noms existaient a cote depuis toujours, et ils
+			 * inversent — mesure en Chromium le 2026-09-29, data-theme pilote :
+			 *
+			 *     --origam-color__surface---inverse   light #171717  dark #ffffff
+			 *     --origam-color__text---inverse      light #ffffff  dark #0a0a0a
+			 *
+			 * La DECLARATION de chaque RUNG1, dans les quatre feuilles, pointe
+			 * maintenant sur eux. C est la que vit la correction : RUNG1 etant
+			 * declare, le repli ecrit ici ne serait jamais atteint — corriger
+			 * ce fichier seul n aurait rien change.
+			 *
+			 * ⚠️ Ceci CHANGE le rendu, volontairement : l infobulle inverse
+			 * enfin (surface claire + texte sombre en mode sombre). Avant, les
+			 * deux tokens rendaient la MEME valeur dans les deux modes.
+			 */
+			background: var(--origam-slider-field__hover-tooltip---background-color, rgba(0, 0, 0, 0.85));
+			color: var(--origam-slider-field__hover-tooltip---color, #ffffff);
 			font-size: 11px;
 			font-weight: 600;
-			font-family: var(--origam-font---family, system-ui, sans-serif);
+			/*
+			 * #595 — REFERENCE CORRIGEE : lisait `var(--origam-font---family, …)`,
+			 * un nom que AUCUNE feuille ne declare (zero occurrence en partie
+			 * gauche dans `assets/`). Ce composant retombait donc toujours sur
+			 * `system-ui` et ignorait la police du DS. Le barreau reel est
+			 * `--origam-font__family---sans` (primitive.css) = `Inter, 'Helvetica
+			 * Neue', Arial, sans-serif`. ⚠️ Change le rendu, volontairement. Le
+			 * repli `system-ui, sans-serif` reste en ceinture de securite si la
+			 * feuille de primitives n est pas chargee.
+			 */
+			font-family: var(--origam-font__family---sans, system-ui, sans-serif);
 			border-radius: 3px;
 			white-space: nowrap;
 			z-index: 4;
@@ -1099,6 +1152,22 @@ defineExpose({
 				height: 100%;
 				display: flex;
 				justify-content: center;
+				/*
+				 * ⛔ #595, trouvaille hors perimetre : le repli `2` est SANS
+				 * UNITE. `width: 2` est invalide et `calc(2 + 2px)` aussi — le
+				 * navigateur jette la declaration entiere. Tant que
+				 * `OrigamSliderFieldTrack` n ecrit pas
+				 * `--origam-slider-field-track---size` en inline (il ne le fait
+				 * que si la prop `size` est fournie), TOUTES les regles de
+				 * largeur du mode vertical sont mortes. Meme famille que la
+				 * gouttiere d `OrigamRow` (#568) et que le garde
+				 * `unitless-zero-in-calc`.
+				 *
+				 * Non corrige ici : declarer le token ou unifier le repli a
+				 * `2px` REPARERAIT le rendu, donc le changerait — hors du
+				 * contrat « zero pixel deplace » de ce lot. Signale sans
+				 * ticket (consigne du lot).
+				 */
 				width: calc(var(--origam-slider-field-track---size, 2) + 2px);
 
 				.origam-slider-field-track__background {
@@ -1334,6 +1403,72 @@ defineExpose({
 		}
 	}
 
+	/*
+	 * ⛔ #595 — SEIZE tokens `--origam-slider-field*` que les feuilles
+	 * declarent et que ce SCSS ne lit pas. Ils restent en baseline
+	 * `token-var-channels-dormant.json` ; raison par famille :
+	 *
+	 *   · `__thumb---border-color` (surface---default) — DEUXIEME grammaire
+	 *     pour la meme propriete. La grammaire VIVANTE est
+	 *     `--origam-slider-field-thumb__surface---border-color`, lue trois
+	 *     lignes plus bas, et `packages/marketing/src/themes/ecom.theme.ts`
+	 *     la surcharge deja (`#e11d48`). Renommer la lecture casserait ce
+	 *     theme ; c est donc le nom `-thumb__surface-` qui vient d etre
+	 *     declare, et celui-ci qui reste dormant ;
+	 *   · `__thumb---border-width` (border__width---2 = 2px) — le pouce livre
+	 *     `border: 1px solid` ; `__thumb---box-shadow` (shadow---sm) — il
+	 *     livre `box-shadow: none`. Cabler l un ou l autre change le rendu ;
+	 *   · `__thumb---focus-ring-color`, `---focus-ring-width`,
+	 *     `---scale-hover`, `---scale-active` — l anneau et l agrandissement
+	 *     sont dessines par `&__surface:before` (`transform: scale(2)`,
+	 *     `opacity: .12/.04`), pas par un anneau dimensionne : aucune
+	 *     declaration a remplacer ;
+	 *   · `---opacity-disabled` (opacity---32 = 0.32) — le rendu desactive est
+	 *     `opacity: 0.38` ;
+	 *   · `---padding-block` (space---2) — aucune declaration `padding-block`
+	 *     sur la racine ;
+	 *   · `---transition-duration` (motion---fast), `---transition-timing-
+	 *     function` (easing---standard) — les transitions sont des raccourcis
+	 *     multi-proprietes ecrits en dur (0.15s/0.2s/0.3s/120ms) ;
+	 *   · les trois `__label---{color,font-size,padding}` — le libelle est
+	 *     rendu par `OrigamLabel`, qui lit `--origam-label---*` ;
+	 *   · `__tick---size` (4px) — la taille du tick est ECRITE EN INLINE par
+	 *     `OrigamSliderFieldTrack` (`convertToUnit(props.tickSize)`) sous le
+	 *     nom `--origam-slider-field-track__tick---size` : c est une valeur
+	 *     d instance, pas un canal de theme ;
+	 *   · `__track---height` (4px) — `.origam-slider-field__track` existe dans
+	 *     le template mais aucune regle ne lui donne de hauteur ; la hauteur
+	 *     vivante est celle de `.origam-slider-field-track` (sous-composant).
+	 *
+	 * ⛔ `--origam-slider-field---track-size` : FAUX POSITIF de la garde, a
+	 * laisser en baseline et surtout a NE PAS declarer.
+	 *
+	 * Il est ECRIT PAR INSTANCE, inconditionnellement, par `sliderFieldStyles`
+	 * (~l.1018) : `convertToUnit(trackProps.size ?? 4)`. Ce style inline est
+	 * pose sur la RACINE des deux variantes (`<origam-input>` et `<section>`),
+	 * donc tout le sous-arbre en herite et les HUIT sites de lecture prennent
+	 * cette valeur. Mesure en Chromium le 2026-09-29, trois variants de la
+	 * story, bloc `--horizontal` present :
+	 *
+	 *     style inline sur la racine  --origam-slider-field---track-size: 4px
+	 *     token relu sur la racine    4px
+	 *     token relu sur la piste     4px
+	 *     hauteur rendue de la piste  4px   <- la regle au repli 14px
+	 *
+	 * ⚠️ Deux consequences, contre-intuitives toutes les deux :
+	 *
+	 *   1. Les replis `14px` des six lignes du bloc `--horizontal` sont du CODE
+	 *      MORT : ils ne sont jamais atteints, la piste horizontale mesure 4px.
+	 *      Il n y a donc PAS « deux camps » a arbitrer — la lecture precedente
+	 *      de ce commentaire, qui annoncait un arbitrage entre 4px et 14px,
+	 *      etait fausse : elle comparait des textes de repli sans verifier
+	 *      lequel s applique.
+	 *   2. Le declarer a `:root` serait INERTE : l ecriture inline sur la
+	 *      racine bat une declaration de feuille pour tout le sous-arbre. Un
+	 *      theme qui le reglerait ne verrait RIEN changer — on annoncerait un
+	 *      canal qui ne fonctionne pas. C est exactement le motif que la
+	 *      campagne interdit de cabler.
+	 */
 	.origam-slider-field-thumb {
 		$this: &;
 

package/dist/src/components/SliderField/OrigamSliderFieldTrack.vue

@@ -271,7 +271,18 @@ defineExpose({
 			position: absolute;
 			opacity: 0;
 			transition: 0.2s opacity cubic-bezier(0.4, 0, 0.2, 1);
-			border-radius: 2px;
+			// #595 — remplacement litteral : la valeur livree (`2px`) est
+			// desormais lue depuis son token, dont la feuille a ete realignee
+			// sur elle (elle annoncait `radius---full`, soit 9999px). Zero
+			// pixel deplace, un canal de theme de plus.
+			//
+			// ⛔ `--origam-slider-field-track__tick---size` juste en dessous
+			// reste NON declare a dessein : OrigamSliderFieldTrack l ecrit en
+			// style INLINE par instance (`convertToUnit(props.tickSize)`,
+			// ligne ~152). Le declarer a `:root` remplacerait le repli par une
+			// valeur de feuille des que la prop est absente — un changement de
+			// rendu, pas un canal.
+			border-radius: var(--origam-slider-field__tick---border-radius, 2px);
 			width: var(--origam-slider-field-track__tick---size, 2);
 			height: var(--origam-slider-field-track__tick---size, 2);
 			transform: translate(calc(var(--origam-slider-field-track__tick---size, 2) / -2), calc(var(--origam-slider-field-track__tick---size, 2) / -2));

package/dist/src/components/Snackbar/OrigamSnackbar.vue

@@ -92,7 +92,7 @@ import OrigamOverlay from "../Overlay/OrigamOverlay.vue";
 import OrigamSnack from "../Transition/OrigamSnack.vue";
 import OrigamSnackbarItem from "./OrigamSnackbarItem.vue";
 import { useBothColor } from "../../composables/Commons/bothColor.composable";
-import { useLayout } from "../../composables/Commons/layout.composable";
+import { useLayoutMain } from "../../composables/Commons/layout.composable";
 import { usePosition } from "../../composables/Commons/position.composable";
 import { useProps } from "../../composables/Commons/props.composable";
 import { useScopeId } from "../../composables/Commons/scopeId.composable";
@@ -216,7 +216,7 @@ const mainStyles = ref();
 const hasLayout = inject(ORIGAM_LAYOUT_KEY, void 0);
 const timerKey = shallowRef(0);
 useToggleScope(() => !!hasLayout, () => {
-  const layout = useLayout();
+  const layout = useLayoutMain();
   watchEffect(() => {
     mainStyles.value = layout.mainStyles.value;
   });

package/dist/src/components/Switch/OrigamSwitch.vue

@@ -571,6 +571,38 @@ defineExpose({
       background-color: currentColor;
     }
 
+    /*
+     * ⛔ #595 — DOUZE tokens `--origam-switch__*` que les feuilles declarent
+     * et que ce SCSS ne lit PAS. Mesure du 2026-09-27 : dans les douze cas la
+     * feuille decrit une intention de design que le SCSS n a jamais
+     * implementee, et la cabler DEPLACERAIT le rendu. Ils restent donc en
+     * baseline `token-var-channels-dormant.json`, ici est la raison :
+     *
+     *   · `__thumb---background-color-checked` (surface---default) — le pouce
+     *     coche est peint `currentColor` par les regles `:has()` ci-dessus, pas
+     *     par un token : la valeur declaree est une AUTRE couleur ;
+     *   · `__thumb---background-color-disabled` (surface---overlay),
+     *     `__thumb---box-shadow` (shadow---sm) — aucune declaration
+     *     correspondante n existe sur le pouce (ni fond desactive, ni ombre) :
+     *     les ajouter serait ajouter une propriete ABSENTE du rendu, ce que la
+     *     regle de securite de #550 interdit apres un revert ;
+     *   · `__thumb---transition-duration` (motion---medium) — la transition du
+     *     pouce est un raccourci multi-proprietes ecrit en dur a 0.15s/0.2s ;
+     *   · `__thumb---translate-distance` (20px) — le deplacement est pose en
+     *     `translateX(±10px)` sur `.origam-selection-control__input`, soit la
+     *     MOITIE du token. Cabler par le nom exigerait un `calc()` derive ;
+     *   · `__track---background-color-checked` (action--primary---bg) — le rail
+     *     coche est peint par `bgColor` / la classe utilitaire, pas par une
+     *     regle `--dirty` ;
+     *   · `__input---opacity` (0) — aucune classe `.origam-switch__input` :
+     *     l input natif appartient a `OrigamSelectionControl` ;
+     *   · les cinq `__label---*` (color, color-disabled, color-error,
+     *     font-size, padding-inline) — le libelle est rendu par `OrigamLabel`,
+     *     qui lit `--origam-label---*`. La seule regle que Switch pose sur lui
+     *     est `padding-inline-start: 10px`, quand le token vaut `space---2`
+     *     (8px) : cabler decalerait chaque libelle de 2px, et le nom
+     *     `padding-inline` mentirait sur une regle qui ne touche que `-start`.
+     */
     &__thumb {
       align-items: center;
       background-color: var(--origam-switch__thumb---background-color, rgb(255, 255, 255));

package/dist/src/components/TextField/OrigamTextField.vue

@@ -487,7 +487,9 @@ const enrichedRules = computed(() => {
   }
   return base;
 });
-const [rootAttrs, inputAttrs] = filterInputAttrs(attrs);
+const filteredAttrs = computed(() => filterInputAttrs(attrs));
+const rootAttrs = computed(() => filteredAttrs.value[0]);
+const inputAttrs = computed(() => filteredAttrs.value[1]);
 const inputProps = computed(() => {
   return origamInputRef.value?.filterProps(props, ["modelValue", "class", "style", "focused", ...BORDER_PROP_KEYS]);
 });

package/dist/src/components/Video/OrigamVideo.vue

@@ -956,7 +956,17 @@ defineExpose({
 	.origam-video__skip-ripple-label {
 		font-size: 13px;
 		font-weight: 600;
-		font-family: var(--origam-font---family, system-ui, sans-serif);
+		/*
+		 * #595 — REFERENCE CORRIGEE : lisait `var(--origam-font---family, …)`,
+		 * un nom que AUCUNE feuille ne declare (zero occurrence en partie
+		 * gauche dans `assets/`). Ce composant retombait donc toujours sur
+		 * `system-ui` et ignorait la police du DS. Le barreau reel est
+		 * `--origam-font__family---sans` (primitive.css) = `Inter, 'Helvetica
+		 * Neue', Arial, sans-serif`. ⚠️ Change le rendu, volontairement. Le
+		 * repli `system-ui, sans-serif` reste en ceinture de securite si la
+		 * feuille de primitives n est pas chargee.
+		 */
+		font-family: var(--origam-font__family---sans, system-ui, sans-serif);
 		letter-spacing: 0.02em;
 		white-space: nowrap;
 		user-select: none;

package/dist/src/composables/Commons/layout.composable.cjs

@@ -3,10 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useLayout = useLayout;
+exports.useLayoutMain = useLayoutMain;
 var _vue = require("vue");
 var _layout = require("../../consts/Commons/layout.const.cjs");
-function useLayout() {
+function useLayoutMain() {
   const layout = (0, _vue.inject)(_layout.ORIGAM_LAYOUT_KEY);
   if (!layout) {
     throw new Error("[Origam] Could not find injected layout");

package/dist/src/composables/Commons/layout.composable.d.ts

@@ -1,5 +1,19 @@
 /*********************************************************
- * useLayout
+ * useLayoutMain
+ *
+ * @description
+ * ⛔ RENOMME depuis `useLayout`, qui ECRASAIT le composable natif de Nuxt.
+ * Nuxt expose `useLayout` en auto-import (`#app/composables/layout`) ; le nôtre
+ * portant le même nom, c'est LE NOTRE QUI GAGNAIT et celui du framework qui
+ * était ignoré. Relevé sur le serveur de dev de l'utilisateur :
+ *   WARN [NUXT_B6002] useLayout is already auto-imported by Nuxt as a built-in,
+ *        and overriding it will likely cause issues.
+ *   WARN Duplicated imports "useLayout", the one from "#app/composables/layout"
+ *        has been ignored
+ * Ce n'était pas cosmétique : notre version LEVE une exception sans provider
+ * Origam, donc tout code Nuxt attendant `useLayout` plantait au lieu de recevoir
+ * le composable du framework. Le nom `useLayoutMain` dit ce qu'il fait — il
+ * expose la zone MAIN — et s'aligne sur `useLayoutItem`.
  *
  * @description
  * Reads the nearest `ORIGAM_LAYOUT_KEY` injection provided by
@@ -11,7 +25,7 @@
  * level (no direct function dependency) — the three only share the
  * `ORIGAM_LAYOUT_KEY` provide/inject contract.
  ********************************************************/
-export declare function useLayout(): {
+export declare function useLayoutMain(): {
     getLayoutItem: (id: string) => import("../../interfaces").ILayerItem | undefined;
     mainRect: import("vue").Ref<import("../../interfaces").ILayer, import("../../interfaces").ILayer>;
     mainStyles: import("vue").Ref<import("vue").CSSProperties, import("vue").CSSProperties>;

package/dist/src/composables/Commons/layout.composable.js

@@ -1,6 +1,6 @@
 import { inject } from "vue";
 import { ORIGAM_LAYOUT_KEY } from "../../consts/Commons/layout.const.js";
-export function useLayout() {
+export function useLayoutMain() {
   const layout = inject(ORIGAM_LAYOUT_KEY);
   if (!layout) {
     throw new Error("[Origam] Could not find injected layout");

package/dist/src/composables/Commons/theme-props-resolver.composable.cjs

@@ -4,9 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.installThemePropsResolver = installThemePropsResolver;
+exports.resolveVariantPresetRegistry = resolveVariantPresetRegistry;
 exports.themedPropKeysUnion = themedPropKeysUnion;
 var _vue = require("vue");
 var _defaults = require("../../consts/Commons/defaults.const.cjs");
+var _variantPreset = require("../../consts/Commons/variant-preset.const.cjs");
 var _commons = require("../../utils/Commons/commons.util.cjs");
 var _color = require("../../utils/Commons/color.util.cjs");
 var _getCurrentInstance = require("../../utils/Commons/getCurrentInstance.util.cjs");
@@ -28,6 +30,15 @@ function themedPropKeysUnion(themes) {
   }
   return union;
 }
+function resolveVariantPresetRegistry(shipped, themeVariants) {
+  let out = {
+    ...shipped
+  };
+  for (const variants of themeVariants) {
+    out = (0, _commons.mergeDeep)(out, variants);
+  }
+  return out;
+}
 function passedPropValue(vnodeProps, key) {
   if (!vnodeProps) return void 0;
   for (const rawKey in vnodeProps) {
@@ -35,19 +46,40 @@ function passedPropValue(vnodeProps, key) {
   }
   return void 0;
 }
-function collectTargetKeys(themedKeysUnion, defaults, name) {
+function addSetKeys(source, target) {
+  if (!source) return;
+  for (const key of source) target.add(key);
+}
+function addObjectKeys(source, target) {
+  if (!source) return;
+  for (const key in source) target.add(key);
+}
+function addPresetKeys(presetTable, target) {
+  if (!presetTable) return;
+  for (const variantValue in presetTable) {
+    for (const key in presetTable[variantValue]) target.add(key);
+  }
+}
+function collectTargetKeys(themedKeysUnion, defaults, name, presetTable) {
   const ownKeys = themedKeysUnion.get(name);
   const globalKeys = themedKeysUnion.get("global");
   const providerOwnKeys = defaults.value?.[name];
   const providerGlobalKeys = defaults.value?.global;
-  if (!ownKeys?.size && !globalKeys?.size && !providerOwnKeys && !providerGlobalKeys) return null;
+  if (!ownKeys?.size && !globalKeys?.size && !providerOwnKeys && !providerGlobalKeys && !presetTable) return null;
   const targetKeys = ownKeys ? new Set(ownKeys) : /* @__PURE__ */new Set();
-  if (globalKeys) for (const key of globalKeys) targetKeys.add(key);
-  if (providerOwnKeys) for (const key in providerOwnKeys) targetKeys.add(key);
-  if (providerGlobalKeys) for (const key in providerGlobalKeys) targetKeys.add(key);
+  addSetKeys(globalKeys, targetKeys);
+  addObjectKeys(providerOwnKeys, targetKeys);
+  addObjectKeys(providerGlobalKeys, targetKeys);
+  addPresetKeys(presetTable, targetKeys);
   return targetKeys;
 }
-function patchThemedPropSlot(instance, defaults, name, key) {
+function readVariantPreset(presetTable, rawProps, key) {
+  if (!presetTable || key === _variantPreset.VARIANT_PROP_KEY) return void 0;
+  const activeVariant = rawProps[_variantPreset.VARIANT_PROP_KEY];
+  if (typeof activeVariant !== "string") return void 0;
+  return presetTable[activeVariant]?.[key];
+}
+function patchThemedPropSlot(instance, defaults, name, key, presetTable) {
   const rawProps = instance.props;
   const fallbackValue = (0, _vue.shallowRef)(rawProps[key]);
   let wasPassed = passedPropValue(instance.vnode.props, key) !== void 0;
@@ -65,6 +97,8 @@ function patchThemedPropSlot(instance, defaults, name, key) {
       if (globalDefaults && globalDefaults[key] !== void 0) {
         return globalDefaults[key];
       }
+      const fromPreset = readVariantPreset(presetTable, rawProps, key);
+      if (fromPreset !== void 0) return fromPreset;
       return fallback;
     },
     set(value) {
@@ -73,14 +107,15 @@ function patchThemedPropSlot(instance, defaults, name, key) {
     }
   });
 }
-function installThemePropsResolver(app, themedKeysUnion) {
+function installThemePropsResolver(app, themedKeysUnion, variantPresets = {}) {
   app.mixin({
     beforeCreate() {
       const instance = (0, _vue.getCurrentInstance)();
       if (!instance) return;
       const name = (0, _getCurrentInstance.getCurrentInstanceName)("theme-props-resolver");
       const defaults = (0, _vue.inject)(_defaults.ORIGAM_DEFAULTS_KEY, (0, _vue.ref)({}));
-      const targetKeys = collectTargetKeys(themedKeysUnion, defaults, name);
+      const presetTable = variantPresets[name];
+      const targetKeys = collectTargetKeys(themedKeysUnion, defaults, name, presetTable);
       if (!targetKeys) return;
       const rawProps = instance.props;
       for (const key of targetKeys) {
@@ -88,7 +123,7 @@ function installThemePropsResolver(app, themedKeysUnion) {
           (0, _color.warnUnsupportedProp)(name, key, `theme names this prop but <${name}> does not declare it`);
           continue;
         }
-        patchThemedPropSlot(instance, defaults, name, key);
+        patchThemedPropSlot(instance, defaults, name, key, presetTable);
       }
     }
   });

package/dist/src/composables/Commons/theme-props-resolver.composable.d.ts

@@ -1,5 +1,6 @@
 import { type App } from 'vue';
 import type { IDefault } from '../../interfaces/DefaultsProvider/defaults-provider.interface';
+import type { TVariantPresetRegistry } from '../../types/Commons/variant-preset.type';
 /*********************************************************
  * themedPropKeysUnion
  *
@@ -21,6 +22,37 @@ import type { IDefault } from '../../interfaces/DefaultsProvider/defaults-provid
  * `createOrigam()` install time.
  ********************************************************/
 export declare function themedPropKeysUnion(themes: IDefault[]): Map<string, Set<string>>;
+/*********************************************************
+ * resolveVariantPresetRegistry
+ *
+ * @description
+ * ADR-005 D4 — collapse les tables de presets que le DS livre avec celles
+ * que les themes enregistres redefinissent, en un seul registre.
+ *
+ * @description
+ * Un theme retune ce que `outlined` VEUT DIRE en changeant des valeurs de
+ * PROPS, et ne descend aux `vars` / `cssVars` que pour ce que les props
+ * n'expriment pas. C'est ce qui reconcilie les variants avec la regle
+ * PROPS-D'ABORD : le seul API du DS qui la violait structurellement.
+ *
+ * @description
+ * `variants` est un FRERE de `components`, pas une cle imbriquee dedans.
+ * `components` est type `IDefault` (composant -> map de props) ; y nicher
+ * un niveau de variant rendrait `{ 'origam-btn': { outlined: … } }`
+ * ambigu avec un prop qui s'appellerait litteralement `outlined`.
+ *
+ * @description
+ * Fusion par `mergeDeep`, celui-la meme que `provideDefaults` utilise —
+ * le theme gagne, prop par prop. Consequence a connaitre : un preset
+ * d'ETAT (`active: { … }`, autorise par Q3) est donc FUSIONNE et non
+ * remplace, comme l'est deja un bloc `components` de theme. Une marque qui
+ * veut effacer une cle d'etat la repose explicitement.
+ *
+ * @description
+ * Pure — aucun acces Vue/DOM — donc appelee une fois, synchronement, a
+ * l'installation par `createOrigam()`, comme `themedPropKeysUnion`.
+ ********************************************************/
+export declare function resolveVariantPresetRegistry(shipped: TVariantPresetRegistry, themeVariants: Array<TVariantPresetRegistry>): TVariantPresetRegistry;
 /*********************************************************
  * installThemePropsResolver
  *
@@ -46,4 +78,4 @@ export declare function themedPropKeysUnion(themes: IDefault[]): Map<string, Set
  * carries the cost argument: an instance that neither a theme nor an ancestor
  * provider names returns after a Map lookup and one property lookup.
  ********************************************************/
-export declare function installThemePropsResolver(app: App, themedKeysUnion: Map<string, Set<string>>): void;
+export declare function installThemePropsResolver(app: App, themedKeysUnion: Map<string, Set<string>>, variantPresets?: TVariantPresetRegistry): void;

package/dist/src/composables/Commons/theme-props-resolver.composable.js

@@ -1,6 +1,7 @@
 import { getCurrentInstance, inject, ref, shallowRef } from "vue";
 import { ORIGAM_DEFAULTS_KEY } from "../../consts/Commons/defaults.const.js";
-import { camelize } from "../../utils/Commons/commons.util.js";
+import { VARIANT_PROP_KEY } from "../../consts/Commons/variant-preset.const.js";
+import { camelize, mergeDeep } from "../../utils/Commons/commons.util.js";
 import { warnUnsupportedProp } from "../../utils/Commons/color.util.js";
 import { getCurrentInstanceName } from "../../utils/Commons/getCurrentInstance.util.js";
 export function themedPropKeysUnion(themes) {
@@ -21,6 +22,13 @@ export function themedPropKeysUnion(themes) {
   }
   return union;
 }
+export function resolveVariantPresetRegistry(shipped, themeVariants) {
+  let out = { ...shipped };
+  for (const variants of themeVariants) {
+    out = mergeDeep(out, variants);
+  }
+  return out;
+}
 function passedPropValue(vnodeProps, key) {
   if (!vnodeProps) return void 0;
   for (const rawKey in vnodeProps) {
@@ -28,19 +36,40 @@ function passedPropValue(vnodeProps, key) {
   }
   return void 0;
 }
-function collectTargetKeys(themedKeysUnion, defaults, name) {
+function addSetKeys(source, target) {
+  if (!source) return;
+  for (const key of source) target.add(key);
+}
+function addObjectKeys(source, target) {
+  if (!source) return;
+  for (const key in source) target.add(key);
+}
+function addPresetKeys(presetTable, target) {
+  if (!presetTable) return;
+  for (const variantValue in presetTable) {
+    for (const key in presetTable[variantValue]) target.add(key);
+  }
+}
+function collectTargetKeys(themedKeysUnion, defaults, name, presetTable) {
   const ownKeys = themedKeysUnion.get(name);
   const globalKeys = themedKeysUnion.get("global");
   const providerOwnKeys = defaults.value?.[name];
   const providerGlobalKeys = defaults.value?.global;
-  if (!ownKeys?.size && !globalKeys?.size && !providerOwnKeys && !providerGlobalKeys) return null;
+  if (!ownKeys?.size && !globalKeys?.size && !providerOwnKeys && !providerGlobalKeys && !presetTable) return null;
   const targetKeys = ownKeys ? new Set(ownKeys) : /* @__PURE__ */ new Set();
-  if (globalKeys) for (const key of globalKeys) targetKeys.add(key);
-  if (providerOwnKeys) for (const key in providerOwnKeys) targetKeys.add(key);
-  if (providerGlobalKeys) for (const key in providerGlobalKeys) targetKeys.add(key);
+  addSetKeys(globalKeys, targetKeys);
+  addObjectKeys(providerOwnKeys, targetKeys);
+  addObjectKeys(providerGlobalKeys, targetKeys);
+  addPresetKeys(presetTable, targetKeys);
   return targetKeys;
 }
-function patchThemedPropSlot(instance, defaults, name, key) {
+function readVariantPreset(presetTable, rawProps, key) {
+  if (!presetTable || key === VARIANT_PROP_KEY) return void 0;
+  const activeVariant = rawProps[VARIANT_PROP_KEY];
+  if (typeof activeVariant !== "string") return void 0;
+  return presetTable[activeVariant]?.[key];
+}
+function patchThemedPropSlot(instance, defaults, name, key, presetTable) {
   const rawProps = instance.props;
   const fallbackValue = shallowRef(rawProps[key]);
   let wasPassed = passedPropValue(instance.vnode.props, key) !== void 0;
@@ -58,6 +87,8 @@ function patchThemedPropSlot(instance, defaults, name, key) {
       if (globalDefaults && globalDefaults[key] !== void 0) {
         return globalDefaults[key];
       }
+      const fromPreset = readVariantPreset(presetTable, rawProps, key);
+      if (fromPreset !== void 0) return fromPreset;
       return fallback;
     },
     set(value) {
@@ -66,14 +97,15 @@ function patchThemedPropSlot(instance, defaults, name, key) {
     }
   });
 }
-export function installThemePropsResolver(app, themedKeysUnion) {
+export function installThemePropsResolver(app, themedKeysUnion, variantPresets = {}) {
   app.mixin({
     beforeCreate() {
       const instance = getCurrentInstance();
       if (!instance) return;
       const name = getCurrentInstanceName("theme-props-resolver");
       const defaults = inject(ORIGAM_DEFAULTS_KEY, ref({}));
-      const targetKeys = collectTargetKeys(themedKeysUnion, defaults, name);
+      const presetTable = variantPresets[name];
+      const targetKeys = collectTargetKeys(themedKeysUnion, defaults, name, presetTable);
       if (!targetKeys) return;
       const rawProps = instance.props;
       for (const key of targetKeys) {
@@ -81,7 +113,7 @@ export function installThemePropsResolver(app, themedKeysUnion) {
           warnUnsupportedProp(name, key, `theme names this prop but <${name}> does not declare it`);
           continue;
         }
-        patchThemedPropSlot(instance, defaults, name, key);
+        patchThemedPropSlot(instance, defaults, name, key, presetTable);
       }
     }
   });

package/dist/src/consts/Commons/variant-preset.const.cjs

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.VARIANT_PROP_KEY = exports.VARIANT_PRESETS = void 0;
+const VARIANT_PROP_KEY = exports.VARIANT_PROP_KEY = "variant";
+const VARIANT_PRESETS = exports.VARIANT_PRESETS = {};