origam 2.16.0 → 2.17.0

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

@@ -1,9 +1,13 @@
-import { useToggleScope } from "../../composables/index.js";
-import { getCurrentInstance, toKebabCase } from "../../utils/index.js";
-import { computed, ref, toRaw, watch } from "vue";
+import { useToggleScope } from "./toggleScope.composable.js";
+import { UNSEEDED } from "../../consts/Commons/vmodel.const.js";
+import { toKebabCase } from "../../utils/Commons/commons.util.js";
+import { getCurrentInstance } from "../../utils/Commons/getCurrentInstance.util.js";
+import { computed, ref, toRaw, toValue, watch } from "vue";
 export function useVModel(props, prop, defaultValue, transformIn = (v) => v, transformOut = (v) => v) {
   const vm = getCurrentInstance("useVModel");
-  const internal = ref(props[prop] !== void 0 ? props[prop] : defaultValue);
+  const internal = ref(UNSEEDED);
+  const seed = () => props[prop] !== void 0 ? props[prop] : toValue(defaultValue);
+  const internalValue = () => internal.value === UNSEEDED ? seed() : internal.value;
   const kebabProp = toKebabCase(prop);
   const checkKebab = kebabProp !== prop;
   const has = (key) => Object.prototype.hasOwnProperty.call(vm.vnode.props ?? {}, key);
@@ -22,12 +26,12 @@ export function useVModel(props, prop, defaultValue, transformIn = (v) => v, tra
   const model = computed({
     get() {
       const externalValue = props[prop];
-      return transformIn(isControlled.value ? externalValue : internal.value);
+      return transformIn(isControlled.value ? externalValue : internalValue());
     },
-    set(internalValue) {
-      const newValue = transformOut(internalValue);
-      const value = toRaw(isControlled.value ? props[prop] : internal.value);
-      if (value === newValue || transformIn(value) === internalValue) {
+    set(internalValue_) {
+      const newValue = transformOut(internalValue_);
+      const value = toRaw(isControlled.value ? props[prop] : internalValue());
+      if (value === newValue || transformIn(value) === internalValue_) {
         return;
       }
       internal.value = newValue;
@@ -35,7 +39,7 @@ export function useVModel(props, prop, defaultValue, transformIn = (v) => v, tra
     }
   });
   Object.defineProperty(model, "externalValue", {
-    get: () => isControlled.value ? props[prop] : internal.value
+    get: () => isControlled.value ? props[prop] : internalValue()
   });
   return model;
 }

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

@@ -4,20 +4,23 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useValidation = useValidation;
-var _composables = require("../../composables/index.cjs");
-var _consts = require("../../consts/index.cjs");
-var _utils = require("../../utils/index.cjs");
+var _toggleScope = require("./toggleScope.composable.cjs");
+var _vModel = require("./vModel.composable.cjs");
+var _form = require("../../consts/Form/form.const.cjs");
+var _commons = require("../../utils/Commons/commons.util.cjs");
+var _getCurrentInstance = require("../../utils/Commons/getCurrentInstance.util.cjs");
+var _validation = require("../../utils/Commons/validation.util.cjs");
 var _vue = require("vue");
-function useValidation(props, name = (0, _utils.getCurrentInstanceName)(), id = (0, _utils.getUid)()) {
-  const model = (0, _composables.useVModel)(props, "modelValue");
+function useValidation(props, name = (0, _getCurrentInstance.getCurrentInstanceName)(), id = (0, _getCurrentInstance.getUid)()) {
+  const model = (0, _vModel.useVModel)(props, "modelValue");
   const validationModel = (0, _vue.computed)(() => {
     return props.validationValue === void 0 ? model.value : props.validationValue;
   });
-  const form = (0, _vue.inject)(_consts.ORIGAM_FORM_KEY, null);
+  const form = (0, _vue.inject)(_form.ORIGAM_FORM_KEY, null);
   const internalErrorMessages = (0, _vue.ref)([]);
   const isPristine = (0, _vue.shallowRef)(true);
   const isDirty = (0, _vue.computed)(() => {
-    return !!((0, _utils.wrapInArray)(model.value === "" ? null : model.value).length || (0, _utils.wrapInArray)(validationModel.value === "" ? null : validationModel.value).length);
+    return !!((0, _commons.wrapInArray)(model.value === "" ? null : model.value).length || (0, _commons.wrapInArray)(validationModel.value === "" ? null : validationModel.value).length);
   });
   const isDisabled = (0, _vue.computed)(() => {
     return !!(props.disabled ?? form?.isDisabled.value);
@@ -29,7 +32,7 @@ function useValidation(props, name = (0, _utils.getCurrentInstanceName)(), id =
     return props.maxErrors ?? 1;
   });
   const errorMessages = (0, _vue.computed)(() => {
-    return props.errorMessages?.length ? (0, _utils.wrapInArray)(props.errorMessages).concat(internalErrorMessages.value).slice(0, Math.max(0, +maxErrors.value)) : internalErrorMessages.value;
+    return props.errorMessages?.length ? (0, _commons.wrapInArray)(props.errorMessages).concat(internalErrorMessages.value).slice(0, Math.max(0, +maxErrors.value)) : internalErrorMessages.value;
   });
   const validateOn = (0, _vue.computed)(() => {
     let value = (props.validateOn ?? form?.validateOn.value) || "input";
@@ -60,7 +63,7 @@ function useValidation(props, name = (0, _utils.getCurrentInstanceName)(), id =
       [`${name}--readonly`]: isReadonly.value
     };
   });
-  const vm = (0, _utils.getCurrentInstance)("validation");
+  const vm = (0, _getCurrentInstance.getCurrentInstance)("validation");
   const uid = (0, _vue.computed)(() => props.name ?? (0, _vue.unref)(id));
   (0, _vue.onBeforeMount)(() => {
     form?.register({
@@ -80,7 +83,7 @@ function useValidation(props, name = (0, _utils.getCurrentInstanceName)(), id =
     }
     form?.update(uid.value, isValid.value, errorMessages.value);
   });
-  (0, _composables.useToggleScope)(() => validateOn.value.input, () => {
+  (0, _toggleScope.useToggleScope)(() => validateOn.value.input, () => {
     (0, _vue.watch)(validationModel, () => {
       if (validationModel.value != null) {
         validate();
@@ -92,13 +95,15 @@ function useValidation(props, name = (0, _utils.getCurrentInstanceName)(), id =
       }
     });
   });
-  (0, _composables.useToggleScope)(() => validateOn.value.blur, () => {
+  (0, _toggleScope.useToggleScope)(() => validateOn.value.blur, () => {
     (0, _vue.watch)(() => props.focused, val => {
       if (!val) validate();
     });
   });
-  (0, _vue.watch)([isValid, errorMessages], () => {
-    form?.update(uid.value, isValid.value, errorMessages.value);
+  (0, _vue.onMounted)(() => {
+    (0, _vue.watch)([isValid, errorMessages], () => {
+      form?.update(uid.value, isValid.value, errorMessages.value);
+    });
   });
   const reset = async () => {
     model.value = null;
@@ -114,24 +119,8 @@ function useValidation(props, name = (0, _utils.getCurrentInstanceName)(), id =
     }
   };
   const validate = async (silent = false) => {
-    const results = [];
     isValidating.value = true;
-    if (props.rules) {
-      for (const rule of props.rules) {
-        if (results.length >= +(props.maxErrors ?? 1)) {
-          break;
-        }
-        const handler = typeof rule === "function" ? rule : () => rule;
-        const result = await handler(validationModel.value);
-        if (result === true) continue;
-        if (result !== false && typeof result !== "string") {
-          console.warn(`${result} is not a valid value. Rule functions must return boolean true or a string.`);
-          continue;
-        }
-        results.push(result || "");
-      }
-    }
-    internalErrorMessages.value = results;
+    internalErrorMessages.value = await (0, _validation.collectRuleErrors)(props.rules, validationModel.value, +(props.maxErrors ?? 1));
     isValidating.value = false;
     isPristine.value = silent;
     return internalErrorMessages.value;

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

@@ -1,7 +1,27 @@
-import type { IValidationProps } from '../../interfaces';
+import type { IValidationProps } from '../../interfaces/Commons/validation.interface';
 import { MaybeRef } from 'vue';
 /*********************************************************
  * useValidation
+ *
+ * @description
+ * Moteur de validation d'un champ : execute `props.rules` contre
+ * `validationValue`/`modelValue`, s'enregistre aupres du `OrigamForm`
+ * ambiant (`ORIGAM_FORM_KEY`) via `register`/`unregister`/`update`, et
+ * expose `isValid`/`isDirty`/`isPristine`/`errorMessages`/`validationClasses`.
+ * `validateOn` (`'input'|'blur'|'submit'|'lazy'`, ou heritee du form
+ * parent) pilote QUAND `validate()` se redeclenche automatiquement — via
+ * `useToggleScope` pour n'ecouter que les axes concernes.
+ *
+ * @description
+ * `isValid` peut valoir `undefined` (ni valide ni invalide) : c'est l'etat
+ * "pas encore juge" d'un champ vierge (`isPristine`) sans erreur interne
+ * ni mode `lazy` — a distinguer explicitement de `true`/`false` cote
+ * consommateur. Le `watch([isValid, errorMessages], …)` qui notifie le
+ * form est deliberement differe a `onMounted` (voir la banniere
+ * "DEFERRED TO onMounted" plus bas dans le corps) pour la meme raison
+ * ADR-005 que `useSelectLink` : une lecture
+ * `immediate` en plein `setup()` figerait `isValid` AVANT que le
+ * resolveur de theme ait patché `props.error`.
  ********************************************************/
 export declare function useValidation(props: IValidationProps, name?: string, id?: MaybeRef<string | number>): {
     errorMessages: import("vue").ComputedRef<string[]>;

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

@@ -1,6 +1,9 @@
-import { useToggleScope, useVModel } from "../../composables/index.js";
-import { ORIGAM_FORM_KEY } from "../../consts/index.js";
-import { getCurrentInstance, getCurrentInstanceName, getUid, wrapInArray } from "../../utils/index.js";
+import { useToggleScope } from "./toggleScope.composable.js";
+import { useVModel } from "./vModel.composable.js";
+import { ORIGAM_FORM_KEY } from "../../consts/Form/form.const.js";
+import { wrapInArray } from "../../utils/Commons/commons.util.js";
+import { getCurrentInstance, getCurrentInstanceName, getUid } from "../../utils/Commons/getCurrentInstance.util.js";
+import { collectRuleErrors } from "../../utils/Commons/validation.util.js";
 import {
   computed,
   inject,
@@ -102,8 +105,10 @@ export function useValidation(props, name = getCurrentInstanceName(), id = getUi
       if (!val) validate();
     });
   });
-  watch([isValid, errorMessages], () => {
-    form?.update(uid.value, isValid.value, errorMessages.value);
+  onMounted(() => {
+    watch([isValid, errorMessages], () => {
+      form?.update(uid.value, isValid.value, errorMessages.value);
+    });
   });
   const reset = async () => {
     model.value = null;
@@ -119,24 +124,8 @@ export function useValidation(props, name = getCurrentInstanceName(), id = getUi
     }
   };
   const validate = async (silent = false) => {
-    const results = [];
     isValidating.value = true;
-    if (props.rules) {
-      for (const rule of props.rules) {
-        if (results.length >= +(props.maxErrors ?? 1)) {
-          break;
-        }
-        const handler = typeof rule === "function" ? rule : () => rule;
-        const result = await handler(validationModel.value);
-        if (result === true) continue;
-        if (result !== false && typeof result !== "string") {
-          console.warn(`${result} is not a valid value. Rule functions must return boolean true or a string.`);
-          continue;
-        }
-        results.push(result || "");
-      }
-    }
-    internalErrorMessages.value = results;
+    internalErrorMessages.value = await collectRuleErrors(props.rules, validationModel.value, +(props.maxErrors ?? 1));
     isValidating.value = false;
     isPristine.value = silent;
     return internalErrorMessages.value;

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

@@ -4,9 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useVariant = useVariant;
-var _utils = require("../../utils/index.cjs");
+var _getCurrentInstance = require("../../utils/Commons/getCurrentInstance.util.cjs");
 var _vue = require("vue");
-function useVariant(props, name = (0, _utils.getCurrentInstanceName)()) {
+function useVariant(props, name = (0, _getCurrentInstance.getCurrentInstanceName)()) {
   const variantClasses = (0, _vue.computed)(() => {
     const variant = (0, _vue.isRef)(props) ? props.value : props.variant;
     const classes = [];

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

@@ -1,8 +1,15 @@
-import type { IVariantProps } from '../../interfaces';
-import type { TVariant, TVariantInput } from '../../types';
+import type { IVariantProps } from '../../interfaces/Commons/variant.interface';
+import type { TVariant, TVariantInput } from '../../types/Commons/variant.type';
 import { Ref } from 'vue';
 /*********************************************************
  * useVariant
+ *
+ * @description
+ * Traduit `props.variant` (ou un `Ref` passe directement) en une seule
+ * classe `{name}--variant-{valeur}`. Accepte n'importe quelle chaine —
+ * contrairement a `useDensity`/`useSize`, il n'y a pas de liste blanche
+ * (`*_ARRAY`) a matcher : toute valeur non-nulle produit une classe, y
+ * compris une variante que le composant ne connait pas.
  ********************************************************/
 export declare function useVariant(props: IVariantProps | Ref<TVariant | TVariantInput | string | undefined>, name?: string): {
     variantClasses: import("vue").ComputedRef<string[]>;

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

@@ -1,4 +1,4 @@
-import { getCurrentInstanceName } from "../../utils/index.js";
+import { getCurrentInstanceName } from "../../utils/Commons/getCurrentInstance.util.js";
 import { computed, isRef } from "vue";
 export function useVariant(props, name = getCurrentInstanceName()) {
   const variantClasses = computed(() => {

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

@@ -4,14 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useVelocity = useVelocity;
-var _consts = require("../../consts/index.cjs");
-var _services = require("../../services/index.cjs");
-var _utils = require("../../utils/index.cjs");
+var _commons = require("../../consts/Commons/commons.const.cjs");
+var _circularBuffer = require("../../classes/Commons/circular-buffer.class.cjs");
+var _commons2 = require("../../utils/Commons/commons.util.cjs");
+var _velocity = require("../../utils/Commons/velocity.util.cjs");
 function useVelocity() {
   const touches = {};
   function addMovement(e) {
     Array.from(e.changedTouches).forEach(touch => {
-      const samples = touches[touch.identifier] ?? (touches[touch.identifier] = new _services.CircularBuffer(_consts.HISTORY));
+      const samples = touches[touch.identifier] ?? (touches[touch.identifier] = new _circularBuffer.CircularBuffer(_commons.HISTORY));
       samples.push([e.timeStamp, touch]);
     });
   }
@@ -29,7 +30,7 @@ function useVelocity() {
     const x = [];
     const y = [];
     for (const val of samples) {
-      if (newest[0] - val[0] > _consts.HORIZON) break;
+      if (newest[0] - val[0] > _commons.HORIZON) break;
       x.push({
         t: val[0],
         d: val[1].clientX
@@ -40,15 +41,15 @@ function useVelocity() {
       });
     }
     return {
-      x: (0, _utils.calculateImpulseVelocity)(x),
-      y: (0, _utils.calculateImpulseVelocity)(y),
+      x: (0, _velocity.calculateImpulseVelocity)(x),
+      y: (0, _velocity.calculateImpulseVelocity)(y),
       get direction() {
         const {
           x: x2,
           y: y2
         } = this;
         const [absX, absY] = [Math.abs(x2), Math.abs(y2)];
-        return absX > absY && x2 >= 0 ? "right" : absX > absY && x2 <= 0 ? "left" : absY > absX && y2 >= 0 ? "down" : absY > absX && y2 <= 0 ? "up" : (0, _utils.oops)();
+        return absX > absY && x2 >= 0 ? "right" : absX > absY && x2 <= 0 ? "left" : absY > absX && y2 >= 0 ? "down" : absY > absX && y2 <= 0 ? "up" : (0, _commons2.oops)();
       }
     };
   }

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

@@ -1,5 +1,20 @@
 /*********************************************************
  * useVelocity
+ *
+ * @description
+ * Suit un historique glissant (`CircularBuffer`, taille `HISTORY`) de
+ * positions par identifiant de touch (`addMovement`) et calcule une
+ * vitesse d'impulsion (`getVelocity`) a partir des seuls echantillons
+ * dans la fenetre `HORIZON` la plus recente — utilise par `useTouch` pour
+ * detecter un "fling" (swipe rapide) en fin de geste.
+ *
+ * @description
+ * ⛔ `getVelocity(id)` LEVE si aucun echantillon n'existe pour cet `id` —
+ * un appelant doit avoir appele `addMovement` au moins une fois pour ce
+ * touch avant, et ne jamais appeler `getVelocity` apres `endTouch` (qui
+ * supprime l'historique de l'id). `direction` est une propriete calculee
+ * a chaque lecture (pas mise en cache), derivee du plus grand des deux
+ * axes x/y.
  ********************************************************/
 export declare function useVelocity(): {
     addMovement: (e: TouchEvent) => void;

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

@@ -1,6 +1,7 @@
-import { HISTORY, HORIZON } from "../../consts/index.js";
-import { CircularBuffer } from "../../services/index.js";
-import { calculateImpulseVelocity, oops } from "../../utils/index.js";
+import { HISTORY, HORIZON } from "../../consts/Commons/commons.const.js";
+import { CircularBuffer } from "../../classes/Commons/circular-buffer.class.js";
+import { oops } from "../../utils/Commons/commons.util.js";
+import { calculateImpulseVelocity } from "../../utils/Commons/velocity.util.js";
 export function useVelocity() {
   const touches = {};
   function addMovement(e) {

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

@@ -4,34 +4,42 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useVirtual = useVirtual;
-var _composables = require("../../composables/index.cjs");
-var _consts = require("../../consts/index.cjs");
-var _utils = require("../../utils/index.cjs");
+var _display = require("./display.composable.cjs");
+var _goTo = require("./goTo.composable.cjs");
+var _resizeObserver = require("./resizeObserver.composable.cjs");
+var _commons = require("../../consts/Commons/commons.const.cjs");
+var _virtual = require("../../consts/Commons/virtual.const.cjs");
+var _commons2 = require("../../utils/Commons/commons.util.cjs");
+var _virtual2 = require("../../utils/Commons/virtual.util.cjs");
 var _vue = require("vue");
 function useVirtual(props, items) {
-  const display = (0, _composables.useDisplay)();
-  const goTo = (0, _composables.useGoTo)();
+  const display = (0, _display.useDisplay)();
+  const goTo = (0, _goTo.useGoTo)();
   const itemHeight = (0, _vue.shallowRef)(0);
   (0, _vue.watchEffect)(() => {
     itemHeight.value = parseFloat(props.itemHeight || 0);
   });
+  const estimateLast = () => Math.ceil(((0, _commons2.int)(props.height) || display.height.value) / (itemHeight.value || _virtual.VIRTUAL_FALLBACK_ITEM_HEIGHT_PX)) || 1;
   const first = (0, _vue.shallowRef)(0);
-  const last = (0, _vue.shallowRef)(Math.ceil(((0, _utils.int)(props.height) || display.height.value) / (itemHeight.value || 16)) || 1);
+  const last = (0, _vue.shallowRef)(estimateLast());
   const paddingTop = (0, _vue.shallowRef)(0);
   const paddingBottom = (0, _vue.shallowRef)(0);
+  (0, _vue.onMounted)(() => {
+    last.value = estimateLast();
+  });
   const containerRef = (0, _vue.ref)();
   const markerRef = (0, _vue.ref)();
   let markerOffset = 0;
   const {
     resizeRef,
     contentRect
-  } = (0, _composables.useResizeObserver)();
+  } = (0, _resizeObserver.useResizeObserver)();
   (0, _vue.watchEffect)(() => {
     resizeRef.value = containerRef.value;
   });
   const viewportHeight = (0, _vue.computed)(() => {
-    if (!_consts.IN_BROWSER) return (0, _utils.int)(props.height) || 0;
-    return containerRef.value === document.documentElement ? display.height.value : contentRect.value?.height || (0, _utils.int)(props.height) || 0;
+    if (!_commons.IN_BROWSER) return (0, _commons2.int)(props.height) || 0;
+    return containerRef.value === document.documentElement ? display.height.value : contentRect.value?.height || (0, _commons2.int)(props.height) || 0;
   });
   const hasInitialRender = (0, _vue.computed)(() => {
     return !!(containerRef.value && markerRef.value && viewportHeight.value && itemHeight.value);
@@ -47,7 +55,7 @@ function useVirtual(props, items) {
   const getSize = index => {
     return sizes[index] || itemHeight.value;
   };
-  const updateOffsets = (0, _utils.debounce)(() => {
+  const updateOffsets = (0, _commons2.debounce)(() => {
     const start = performance.now();
     offsets[0] = 0;
     const length = items.value.length;
@@ -64,7 +72,7 @@ function useVirtual(props, items) {
     calculateVisibleItems();
     if (!~targetScrollIndex) return;
     (0, _vue.nextTick)(() => {
-      if (_consts.IN_BROWSER) {
+      if (_commons.IN_BROWSER) {
         window.requestAnimationFrame(() => {
           scrollToIndex(targetScrollIndex);
           targetScrollIndex = -1;
@@ -85,11 +93,11 @@ function useVirtual(props, items) {
     }
   };
   const calculateOffset = index => {
-    index = (0, _utils.clamp)(index, 0, items.value.length - 1);
+    index = (0, _commons2.clamp)(index, 0, items.value.length - 1);
     return offsets[index] || 0;
   };
   const calculateIndex = scrollTop => {
-    return (0, _utils.binaryClosest)(offsets, scrollTop);
+    return (0, _virtual2.binaryClosest)(offsets, scrollTop);
   };
   let lastScrollTop = 0;
   let scrollVelocity = 0;
@@ -110,7 +118,7 @@ function useVirtual(props, items) {
     const scrollTop = containerRef.value.scrollTop;
     const scrollTime = performance.now();
     const scrollDeltaT = scrollTime - lastScrollTime;
-    if (scrollDeltaT > 500) {
+    if (scrollDeltaT > _virtual.VIRTUAL_SCROLL_SEQUENCE_MS) {
       scrollVelocity = Math.sign(scrollTop - lastScrollTop);
       markerOffset = markerRef.value.offsetTop;
     } else {
@@ -135,18 +143,18 @@ function useVirtual(props, items) {
     if (!containerRef.value || !viewportHeight.value) return;
     const scrollTop = lastScrollTop - markerOffset;
     const direction = Math.sign(scrollVelocity);
-    const startPx = Math.max(0, scrollTop - _consts.BUFFER_PX);
-    const start = (0, _utils.clamp)(calculateIndex(startPx), 0, items.value.length);
-    const endPx = scrollTop + viewportHeight.value + _consts.BUFFER_PX;
-    const end = (0, _utils.clamp)(calculateIndex(endPx) + 1, start + 1, items.value.length);
+    const startPx = Math.max(0, scrollTop - _virtual.BUFFER_PX);
+    const start = (0, _commons2.clamp)(calculateIndex(startPx), 0, items.value.length);
+    const endPx = scrollTop + viewportHeight.value + _virtual.BUFFER_PX;
+    const end = (0, _commons2.clamp)(calculateIndex(endPx) + 1, start + 1, items.value.length);
     if (
     // Only update the side we're scrolling towards,
     // the other side will be updated incidentally
-    (direction !== _consts.UP || start < first.value) && (direction !== _consts.DOWN || end > last.value)) {
+    (direction !== _virtual.UP || start < first.value) && (direction !== _virtual.DOWN || end > last.value)) {
       const topOverflow = calculateOffset(first.value) - calculateOffset(start);
       const bottomOverflow = calculateOffset(end) - calculateOffset(last.value);
       const bufferOverflow = Math.max(topOverflow, bottomOverflow);
-      if (bufferOverflow > _consts.BUFFER_PX) {
+      if (bufferOverflow > _virtual.BUFFER_PX) {
         first.value = start;
         last.value = end;
       } else {
@@ -163,8 +171,8 @@ function useVirtual(props, items) {
       targetScrollIndex = index;
       return;
     }
-    const duration = options.duration ?? props.scrollDuration ?? 300;
-    const easing = options.easing ?? props.scrollEasing ?? "easeInOutCubic";
+    const duration = options.duration ?? props.scrollDuration ?? _virtual.VIRTUAL_SCROLL_DURATION_MS;
+    const easing = options.easing ?? props.scrollEasing ?? _virtual.VIRTUAL_SCROLL_EASING;
     if (duration <= 0) {
       containerRef.value.scrollTop = offset;
       return;

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

@@ -1,7 +1,29 @@
-import type { IGoToOptions, IVirtualProps } from '../../interfaces';
+import type { IGoToOptions } from '../../interfaces/Commons/goTo.interface';
+import type { IVirtualProps } from '../../interfaces/Commons/virtual.interface';
 import { Ref } from 'vue';
 /*********************************************************
  * useVirtual
+ *
+ * @description
+ * Virtualisation de liste : ne rend que la tranche `[first, last[` de
+ * `items` réellement visible (`computedItems`), en maintenant des
+ * `offsets` par index (recalcules via `updateOffsets`, debattus) et un
+ * padding haut/bas qui simule la hauteur totale de la liste. La fenetre
+ * visible est recalculee sur scroll (`handleScroll`/`calcVisibleItems`,
+ * via `requestAnimationFrame`) et sur redimensionnement du conteneur
+ * (`useResizeObserver`). `scrollToIndex` delegue l'animation a `useGoTo`,
+ * ou differe le scroll si la liste n'a pas encore mesure sa mise en page
+ * (`targetScrollIndex`).
+ *
+ * @description
+ * Le PREMIER `estimateLast()` (au moment du `shallowRef()`, en plein
+ * `setup()`) peut lire un `props.height` PRE-THEME — voir la banniere
+ * "the anti-flash first-paint guess" et "last's FIRST guess is
+ * re-applied once mounted (#504)" juste en dessous : le meme piege
+ * ADR-005 que `useSelectLink`/`useValidation`, corrige ici en
+ * re-executant la meme estimation dans un `onMounted`. `itemHeight` n'est
+ * jamais fige : `handleItemResize` le retrecit au minimum observe parmi
+ * les items reellement mesures.
  ********************************************************/
 export declare function useVirtual<T>(props: IVirtualProps, items: Ref<readonly T[]>): {
     containerRef: Ref<HTMLElement | undefined, HTMLElement | undefined>;

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

@@ -1,7 +1,19 @@
-import { useDisplay, useGoTo, useResizeObserver } from "../../composables/index.js";
-import { BUFFER_PX, DOWN, IN_BROWSER, UP } from "../../consts/index.js";
-import { binaryClosest, clamp, debounce, int } from "../../utils/index.js";
-import { computed, nextTick, onScopeDispose, ref, shallowRef, watch, watchEffect } from "vue";
+import { useDisplay } from "./display.composable.js";
+import { useGoTo } from "./goTo.composable.js";
+import { useResizeObserver } from "./resizeObserver.composable.js";
+import { IN_BROWSER } from "../../consts/Commons/commons.const.js";
+import {
+  BUFFER_PX,
+  DOWN,
+  UP,
+  VIRTUAL_FALLBACK_ITEM_HEIGHT_PX,
+  VIRTUAL_SCROLL_DURATION_MS,
+  VIRTUAL_SCROLL_EASING,
+  VIRTUAL_SCROLL_SEQUENCE_MS
+} from "../../consts/Commons/virtual.const.js";
+import { clamp, debounce, int } from "../../utils/Commons/commons.util.js";
+import { binaryClosest } from "../../utils/Commons/virtual.util.js";
+import { computed, nextTick, onMounted, onScopeDispose, ref, shallowRef, watch, watchEffect } from "vue";
 export function useVirtual(props, items) {
   const display = useDisplay();
   const goTo = useGoTo();
@@ -9,10 +21,14 @@ export function useVirtual(props, items) {
   watchEffect(() => {
     itemHeight.value = parseFloat(props.itemHeight || 0);
   });
+  const estimateLast = () => Math.ceil((int(props.height) || display.height.value) / (itemHeight.value || VIRTUAL_FALLBACK_ITEM_HEIGHT_PX)) || 1;
   const first = shallowRef(0);
-  const last = shallowRef(Math.ceil((int(props.height) || display.height.value) / (itemHeight.value || 16)) || 1);
+  const last = shallowRef(estimateLast());
   const paddingTop = shallowRef(0);
   const paddingBottom = shallowRef(0);
+  onMounted(() => {
+    last.value = estimateLast();
+  });
   const containerRef = ref();
   const markerRef = ref();
   let markerOffset = 0;
@@ -97,7 +113,7 @@ export function useVirtual(props, items) {
     const scrollTop = containerRef.value.scrollTop;
     const scrollTime = performance.now();
     const scrollDeltaT = scrollTime - lastScrollTime;
-    if (scrollDeltaT > 500) {
+    if (scrollDeltaT > VIRTUAL_SCROLL_SEQUENCE_MS) {
       scrollVelocity = Math.sign(scrollTop - lastScrollTop);
       markerOffset = markerRef.value.offsetTop;
     } else {
@@ -151,8 +167,8 @@ export function useVirtual(props, items) {
       targetScrollIndex = index;
       return;
     }
-    const duration = options.duration ?? props.scrollDuration ?? 300;
-    const easing = options.easing ?? props.scrollEasing ?? "easeInOutCubic";
+    const duration = options.duration ?? props.scrollDuration ?? VIRTUAL_SCROLL_DURATION_MS;
+    const easing = options.easing ?? props.scrollEasing ?? VIRTUAL_SCROLL_EASING;
     if (duration <= 0) {
       containerRef.value.scrollTop = offset;
       return;

package/dist/src/composables/DataTable/cell.composable.d.ts

@@ -1,7 +1,26 @@
-import type { IInternalDataTableHeader } from "../../interfaces";
+import type { IInternalDataTableHeader } from '../../interfaces/DataTable/data-table-header.interface';
 /*********************************************************
  * useCell
  ********************************************************/
+/*********************************************************
+ * useCell
+ *
+ * @description
+ * Resout le `padding` d'une cellule de `<origam-data-table>` a partir de sa
+ * colonne. Retourne `{ getPadding }`.
+ *
+ * @description
+ * ⛔ Les deux colonnes de chrome — `data-table-select` et `data-table-expand`
+ * — recoivent un padding FIXE de `'0 8'` qui prime sur `column.padding`. Ce
+ * sont des colonnes de controle, pas de donnees : leur largeur doit rester
+ * constante quel que soit le reglage du consommateur, sinon la case a cocher
+ * et le chevron se decalent d'une ligne a l'autre.
+ *
+ * @description
+ * Pour toute autre colonne, `column.padding` est rendu tel quel, et
+ * `undefined` quand rien n'est defini — la cellule garde alors le padding de
+ * la feuille de style.
+ ********************************************************/
 export declare function useCell(): {
     getPadding: (column: IInternalDataTableHeader) => string | number | undefined;
 };

package/dist/src/composables/DataTable/expand.composable.cjs

@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 exports.provideExpanded = provideExpanded;
 exports.useExpanded = useExpanded;
 var _vue = require("vue");
-var _composables = require("../../composables/index.cjs");
-var _consts = require("../../consts/index.cjs");
+var _vModel = require("../Commons/vModel.composable.cjs");
+var _dataTable = require("../../consts/DataTable/data-table.const.cjs");
 function provideExpanded(props) {
   const expandOnClick = (0, _vue.toRef)(props, "expandOnClick");
-  const expanded = (0, _composables.useVModel)(props, "expanded", props.expanded, v => {
+  const expanded = (0, _vModel.useVModel)(props, "expanded", void 0, v => {
     return new Set(v);
   }, v => {
     return [...v.values()];
@@ -37,11 +37,11 @@ function provideExpanded(props) {
     isExpanded,
     toggleExpand
   };
-  (0, _vue.provide)(_consts.ORIGAM_DATA_TABLE_EXPAND_KEY, data);
+  (0, _vue.provide)(_dataTable.ORIGAM_DATA_TABLE_EXPAND_KEY, data);
   return data;
 }
 function useExpanded() {
-  const data = (0, _vue.inject)(_consts.ORIGAM_DATA_TABLE_EXPAND_KEY);
+  const data = (0, _vue.inject)(_dataTable.ORIGAM_DATA_TABLE_EXPAND_KEY);
   if (!data) throw new Error("Missing expand!");
   return data;
 }