@dododog/ui 0.15.0 → 0.17.0

package/dist/{chunk-L7OYR6U3.js → chunk-2NMA3AXV.js}

@@ -46,26 +46,55 @@ var textareaVariants = classVarianceAuthority.cva(
   }
 );
 var Textarea = React__namespace.forwardRef(
-  ({ className, size, variant, label, error, required, rows = 4, ...props }, ref) => {
+  ({
+    className,
+    size,
+    variant,
+    label,
+    error,
+    required,
+    rows = 4,
+    id,
+    "aria-describedby": ariaDescribedBy,
+    "aria-invalid": ariaInvalid,
+    "aria-required": ariaRequired,
+    ...props
+  }, ref) => {
+    const generatedId = React__namespace.useId();
+    const textareaId = id ?? generatedId;
+    const errorId = `${textareaId}-error`;
     const resolvedVariant = error ? "error" : variant ?? "default";
+    const describedBy = [ariaDescribedBy, error ? errorId : null].filter(Boolean).join(" ") || void 0;
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full", children: [
-      label && /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "block text-sm font-medium text-primary mb-1.5", children: [
-        label,
-        required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-secondary", children: " *" })
-      ] }),
+      label && /* @__PURE__ */ jsxRuntime.jsxs(
+        "label",
+        {
+          htmlFor: textareaId,
+          className: "block text-sm font-medium text-primary mb-1.5",
+          children: [
+            label,
+            required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-secondary", "aria-hidden": "true", children: " *" })
+          ]
+        }
+      ),
       /* @__PURE__ */ jsxRuntime.jsx(
         "textarea",
         {
+          ...props,
           ref,
+          id: textareaId,
           rows,
+          required,
+          "aria-required": ariaRequired ?? (required ? true : void 0),
+          "aria-invalid": ariaInvalid ?? (error ? true : void 0),
+          "aria-describedby": describedBy,
           className: chunkADIDI7AJ_js.cn(
             textareaVariants({ size, variant: resolvedVariant }),
             className
-          ),
-          ...props
+          )
         }
       ),
-      error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-red-500", children: error })
+      error && /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, role: "alert", className: "mt-1 text-sm text-red-600", children: error })
     ] });
   }
 );

package/dist/{chunk-ZZ4EWC53.mjs → chunk-52M2KUC4.mjs}

@@ -24,26 +24,55 @@ var textareaVariants = cva(
   }
 );
 var Textarea = React.forwardRef(
-  ({ className, size, variant, label, error, required, rows = 4, ...props }, ref) => {
+  ({
+    className,
+    size,
+    variant,
+    label,
+    error,
+    required,
+    rows = 4,
+    id,
+    "aria-describedby": ariaDescribedBy,
+    "aria-invalid": ariaInvalid,
+    "aria-required": ariaRequired,
+    ...props
+  }, ref) => {
+    const generatedId = React.useId();
+    const textareaId = id ?? generatedId;
+    const errorId = `${textareaId}-error`;
     const resolvedVariant = error ? "error" : variant ?? "default";
+    const describedBy = [ariaDescribedBy, error ? errorId : null].filter(Boolean).join(" ") || void 0;
     return /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
-      label && /* @__PURE__ */ jsxs("label", { className: "block text-sm font-medium text-primary mb-1.5", children: [
-        label,
-        required && /* @__PURE__ */ jsx("span", { className: "text-secondary", children: " *" })
-      ] }),
+      label && /* @__PURE__ */ jsxs(
+        "label",
+        {
+          htmlFor: textareaId,
+          className: "block text-sm font-medium text-primary mb-1.5",
+          children: [
+            label,
+            required && /* @__PURE__ */ jsx("span", { className: "text-secondary", "aria-hidden": "true", children: " *" })
+          ]
+        }
+      ),
       /* @__PURE__ */ jsx(
         "textarea",
         {
+          ...props,
           ref,
+          id: textareaId,
           rows,
+          required,
+          "aria-required": ariaRequired ?? (required ? true : void 0),
+          "aria-invalid": ariaInvalid ?? (error ? true : void 0),
+          "aria-describedby": describedBy,
           className: cn(
             textareaVariants({ size, variant: resolvedVariant }),
             className
-          ),
-          ...props
+          )
         }
       ),
-      error && /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-red-500", children: error })
+      error && /* @__PURE__ */ jsx("p", { id: errorId, role: "alert", className: "mt-1 text-sm text-red-600", children: error })
     ] });
   }
 );

package/dist/{chunk-BKM5VCUS.mjs → chunk-CPBDDGRX.mjs}

@@ -8,8 +8,11 @@ function startOfDay(d) {
   return r;
 }
 function addMonths(d, n) {
+  const year = d.getFullYear();
+  const month = d.getMonth() + n;
+  const lastDayOfTargetMonth = new Date(year, month + 1, 0).getDate();
   const r = new Date(d);
-  r.setMonth(r.getMonth() + n);
+  r.setFullYear(year, month, Math.min(d.getDate(), lastDayOfTargetMonth));
   return r;
 }
 function addDays(d, n) {

package/dist/{chunk-FLKEMER2.js → chunk-DJTFRMRY.js}

@@ -30,8 +30,11 @@ function startOfDay(d) {
   return r;
 }
 function addMonths(d, n) {
+  const year = d.getFullYear();
+  const month = d.getMonth() + n;
+  const lastDayOfTargetMonth = new Date(year, month + 1, 0).getDate();
   const r = new Date(d);
-  r.setMonth(r.getMonth() + n);
+  r.setFullYear(year, month, Math.min(d.getDate(), lastDayOfTargetMonth));
   return r;
 }
 function addDays(d, n) {

package/dist/chunk-DUCRCDLI.mjs

@@ -0,0 +1,78 @@
+import { cn } from './chunk-IMKLN273.mjs';
+import * as React from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var SegmentedControl = React.forwardRef(
+  ({
+    options,
+    value,
+    onChange,
+    className,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy
+  }, ref) => {
+    const optionRefs = React.useRef([]);
+    const selectedIndex = options.findIndex((option) => option.value === value);
+    const rovingIndex = selectedIndex === -1 ? 0 : selectedIndex;
+    const handleKeyDown = (event, index) => {
+      const lastIndex = options.length - 1;
+      let nextIndex;
+      switch (event.key) {
+        case "ArrowRight":
+        case "ArrowDown":
+          nextIndex = index === lastIndex ? 0 : index + 1;
+          break;
+        case "ArrowLeft":
+        case "ArrowUp":
+          nextIndex = index === 0 ? lastIndex : index - 1;
+          break;
+        case "Home":
+          nextIndex = 0;
+          break;
+        case "End":
+          nextIndex = lastIndex;
+          break;
+        default:
+          return;
+      }
+      event.preventDefault();
+      const nextOption = options[nextIndex];
+      if (!nextOption) return;
+      onChange(nextOption.value);
+      optionRefs.current[nextIndex]?.focus();
+    };
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn("flex gap-1 bg-gray-100 rounded-full p-1", className),
+        role: "radiogroup",
+        "aria-label": ariaLabelledBy ? void 0 : ariaLabel,
+        "aria-labelledby": ariaLabelledBy,
+        children: options.map((option, index) => /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            role: "radio",
+            "aria-checked": value === option.value,
+            tabIndex: index === rovingIndex ? 0 : -1,
+            ref: (node) => {
+              optionRefs.current[index] = node;
+            },
+            onKeyDown: (event) => handleKeyDown(event, index),
+            onClick: () => onChange(option.value),
+            className: cn(
+              "px-3 py-1.5 text-sm rounded-full transition-all",
+              value === option.value ? "bg-white text-gray-900 shadow-sm font-medium" : "text-gray-600 hover:text-gray-900"
+            ),
+            children: option.label
+          },
+          option.value
+        ))
+      }
+    );
+  }
+);
+SegmentedControl.displayName = "SegmentedControl";
+
+export { SegmentedControl };

package/dist/{chunk-HH4X2JYO.js → chunk-EKOGDJUT.js}

@@ -37,6 +37,7 @@ var FOCUSABLE_SELECTOR = [
   "[contenteditable]:not([contenteditable='false'])",
   '[tabindex]:not([tabindex="-1"])'
 ].join(", ");
+var DEFAULT_Z_INDEX_CLASS = "z-50";
 function getFocusableElements(panel) {
   return Array.from(panel.querySelectorAll(FOCUSABLE_SELECTOR)).filter(
     (element) => !element.closest("[hidden], [aria-hidden='true'], details:not([open])")
@@ -54,6 +55,11 @@ var Modal = React__namespace.forwardRef(
     children,
     title,
     className,
+    variant = "centered",
+    overlayClassName,
+    zIndexClassName = DEFAULT_Z_INDEX_CLASS,
+    initialFocusRef,
+    returnFocusTo,
     "aria-label": ariaLabel,
     "aria-labelledby": ariaLabelledBy,
     "aria-describedby": ariaDescribedBy
@@ -62,10 +68,20 @@ var Modal = React__namespace.forwardRef(
     const generatedTitleId = React__namespace.useId();
     const titleId = title ? `${generatedTitleId}-title` : void 0;
     const labelledBy = ariaLabelledBy ?? titleId;
+    const isFullBleed = variant === "fullBleed";
+    const initialFocusRefLatest = React__namespace.useRef(initialFocusRef);
+    initialFocusRefLatest.current = initialFocusRef;
+    const returnFocusToLatest = React__namespace.useRef(returnFocusTo);
+    returnFocusToLatest.current = returnFocusTo;
     React__namespace.useEffect(() => {
       if (!isOpen) return;
       const trigger = document.activeElement instanceof HTMLElement ? document.activeElement : null;
       return () => {
+        const designated = returnFocusToLatest.current?.current ?? null;
+        if (designated && designated.isConnected) {
+          designated.focus();
+          return;
+        }
         if (trigger && trigger.isConnected) trigger.focus();
       };
     }, [isOpen]);
@@ -73,6 +89,11 @@ var Modal = React__namespace.forwardRef(
       if (!isOpen) return;
       const panel = panelRef.current;
       if (!panel) return;
+      const preferred = initialFocusRefLatest.current?.current ?? null;
+      if (preferred) {
+        preferred.focus();
+        return;
+      }
       const focusable = getFocusableElements(panel);
       (focusable[0] ?? panel).focus();
     }, [isOpen]);
@@ -124,14 +145,21 @@ var Modal = React__namespace.forwardRef(
       "div",
       {
         ref,
-        className: "fixed inset-0 z-50 flex items-center justify-center p-4",
+        className: chunkADIDI7AJ_js.cn(
+          "fixed inset-0",
+          zIndexClassName,
+          // La mise en page centree (et sa marge de 16 px) n'existe que dans la
+          // variante `centered` : une surface bord a bord n'en veut pas.
+          !isFullBleed && "flex items-center justify-center p-4",
+          overlayClassName
+        ),
         role: "dialog",
         "aria-modal": "true",
         "aria-labelledby": labelledBy,
         "aria-label": labelledBy ? void 0 : ariaLabel,
         "aria-describedby": ariaDescribedBy,
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
+          !isFullBleed && /* @__PURE__ */ jsxRuntime.jsx(
             "div",
             {
               className: "absolute inset-0 bg-black/50",
@@ -145,7 +173,7 @@ var Modal = React__namespace.forwardRef(
               ref: panelRef,
               tabIndex: -1,
               className: chunkADIDI7AJ_js.cn(
-                "relative bg-white rounded-2xl shadow-xl max-w-md w-full max-h-[90vh] overflow-auto outline-none",
+                isFullBleed ? "relative h-full w-full outline-none" : "relative bg-white rounded-2xl shadow-xl max-w-md w-full max-h-[90vh] overflow-auto outline-none",
                 className
               ),
               children: [
@@ -186,7 +214,7 @@ var Modal = React__namespace.forwardRef(
                     }
                   )
                 ] }),
-                /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkADIDI7AJ_js.cn(title ? "px-6 pb-6" : "p-6"), children })
+                isFullBleed ? children : /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkADIDI7AJ_js.cn(title ? "px-6 pb-6" : "p-6"), children })
               ]
             }
           )

package/dist/{chunk-NHB2TI2B.js → chunk-FHAWYXPX.js}

@@ -200,7 +200,7 @@ var Autocomplete = React__namespace.forwardRef(
           }
         )
       ] }),
-      error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-red-500", children: error })
+      error && /* @__PURE__ */ jsxRuntime.jsx("p", { role: "alert", className: "mt-1 text-sm text-red-600", children: error })
     ] });
   }
 );

package/dist/{chunk-5UNG2O64.js → chunk-FR46MMNP.js}

@@ -100,7 +100,13 @@ var Input = React__namespace.forwardRef(
         ),
         rightIcon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute right-3 top-1/2 -translate-y-1/2 text-text-muted", children: rightIcon })
       ] }),
-      error && /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, className: "mt-1 text-sm text-red-500", children: error })
+      error && // Pas de `role="alert"` ici, contrairement aux autres champs de la
+      // bibliotheque : les trois seuls consommateurs de cette prop
+      // (BookingForm, PaymentForm, EscalationForm) sont des formulaires du
+      // tunnel, et BookingForm annonce deja ses fautes par un resume en
+      // region live (TTR-651). Un second canal produirait des annonces
+      // concurrentes sur le chemin de paiement.
+      /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, className: "mt-1 text-sm text-red-600", children: error })
     ] });
   }
 );

package/dist/{chunk-EEIPCJQ2.mjs → chunk-KWQKC5TG.mjs}

@@ -63,7 +63,7 @@ var Checkbox = React.forwardRef(
           ]
         }
       ),
-      error && /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-red-500", children: error })
+      error && /* @__PURE__ */ jsx("p", { role: "alert", className: "mt-1 text-sm text-red-600", children: error })
     ] });
   }
 );

package/dist/{chunk-IJIUUBFT.js → chunk-OUN5BU4Z.js}

@@ -85,7 +85,7 @@ var Checkbox = React__namespace.forwardRef(
           ]
         }
       ),
-      error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-red-500", children: error })
+      error && /* @__PURE__ */ jsxRuntime.jsx("p", { role: "alert", className: "mt-1 text-sm text-red-600", children: error })
     ] });
   }
 );

package/dist/{chunk-QWDKSY6Y.js → chunk-OZ4RJDDZ.js}

@@ -25,19 +25,63 @@ function _interopNamespace(e) {
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
 var SegmentedControl = React__namespace.forwardRef(
-  ({ options, value, onChange, className }, ref) => {
+  ({
+    options,
+    value,
+    onChange,
+    className,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy
+  }, ref) => {
+    const optionRefs = React__namespace.useRef([]);
+    const selectedIndex = options.findIndex((option) => option.value === value);
+    const rovingIndex = selectedIndex === -1 ? 0 : selectedIndex;
+    const handleKeyDown = (event, index) => {
+      const lastIndex = options.length - 1;
+      let nextIndex;
+      switch (event.key) {
+        case "ArrowRight":
+        case "ArrowDown":
+          nextIndex = index === lastIndex ? 0 : index + 1;
+          break;
+        case "ArrowLeft":
+        case "ArrowUp":
+          nextIndex = index === 0 ? lastIndex : index - 1;
+          break;
+        case "Home":
+          nextIndex = 0;
+          break;
+        case "End":
+          nextIndex = lastIndex;
+          break;
+        default:
+          return;
+      }
+      event.preventDefault();
+      const nextOption = options[nextIndex];
+      if (!nextOption) return;
+      onChange(nextOption.value);
+      optionRefs.current[nextIndex]?.focus();
+    };
     return /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
         ref,
         className: chunkADIDI7AJ_js.cn("flex gap-1 bg-gray-100 rounded-full p-1", className),
         role: "radiogroup",
-        children: options.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
+        "aria-label": ariaLabelledBy ? void 0 : ariaLabel,
+        "aria-labelledby": ariaLabelledBy,
+        children: options.map((option, index) => /* @__PURE__ */ jsxRuntime.jsx(
           "button",
           {
             type: "button",
             role: "radio",
             "aria-checked": value === option.value,
+            tabIndex: index === rovingIndex ? 0 : -1,
+            ref: (node) => {
+              optionRefs.current[index] = node;
+            },
+            onKeyDown: (event) => handleKeyDown(event, index),
             onClick: () => onChange(option.value),
             className: chunkADIDI7AJ_js.cn(
               "px-3 py-1.5 text-sm rounded-full transition-all",

package/dist/{chunk-762LQMWP.js → chunk-RAXPJ7VC.js}

@@ -25,17 +25,57 @@ function _interopNamespace(e) {
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
 var Tabs = React__namespace.forwardRef(
-  ({ tabs, defaultTab, value, onChange, className }, ref) => {
+  ({
+    tabs,
+    defaultTab,
+    value,
+    onChange,
+    className,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy
+  }, ref) => {
     const [internalValue, setInternalValue] = React__namespace.useState(
       defaultTab || tabs[0]?.key || ""
     );
     const activeKey = value ?? internalValue;
-    const handleChange = (key) => {
-      if (onChange) {
-        onChange(key);
-      } else {
-        setInternalValue(key);
+    const idPrefix = React__namespace.useId();
+    const tabId = (key) => `${idPrefix}-tab-${key}`;
+    const panelId = (key) => `${idPrefix}-panel-${key}`;
+    const tabRefs = React__namespace.useRef([]);
+    const handleChange = React__namespace.useCallback(
+      (key) => {
+        if (onChange) {
+          onChange(key);
+        } else {
+          setInternalValue(key);
+        }
+      },
+      [onChange]
+    );
+    const handleKeyDown = (event, index) => {
+      const lastIndex = tabs.length - 1;
+      let nextIndex;
+      switch (event.key) {
+        case "ArrowRight":
+          nextIndex = index === lastIndex ? 0 : index + 1;
+          break;
+        case "ArrowLeft":
+          nextIndex = index === 0 ? lastIndex : index - 1;
+          break;
+        case "Home":
+          nextIndex = 0;
+          break;
+        case "End":
+          nextIndex = lastIndex;
+          break;
+        default:
+          return;
       }
+      event.preventDefault();
+      const nextTab = tabs[nextIndex];
+      if (!nextTab) return;
+      handleChange(nextTab.key);
+      tabRefs.current[nextIndex]?.focus();
     };
     const activeTab = tabs.find((t) => t.key === activeKey);
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: chunkADIDI7AJ_js.cn("w-full", className), children: [
@@ -43,13 +83,22 @@ var Tabs = React__namespace.forwardRef(
         "div",
         {
           role: "tablist",
+          "aria-label": ariaLabelledBy ? void 0 : ariaLabel,
+          "aria-labelledby": ariaLabelledBy,
           className: "flex border-b border-gray-200 gap-1 overflow-x-auto",
-          children: tabs.map((tab) => /* @__PURE__ */ jsxRuntime.jsxs(
+          children: tabs.map((tab, index) => /* @__PURE__ */ jsxRuntime.jsxs(
             "button",
             {
+              id: tabId(tab.key),
               role: "tab",
               type: "button",
               "aria-selected": tab.key === activeKey,
+              "aria-controls": panelId(tab.key),
+              tabIndex: tab.key === activeKey ? 0 : -1,
+              ref: (node) => {
+                tabRefs.current[index] = node;
+              },
+              onKeyDown: (event) => handleKeyDown(event, index),
               onClick: () => handleChange(tab.key),
               className: chunkADIDI7AJ_js.cn(
                 "flex items-center gap-2 px-4 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-colors -mb-px",
@@ -64,7 +113,16 @@ var Tabs = React__namespace.forwardRef(
           ))
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { role: "tabpanel", className: "py-4", children: activeTab?.content })
+      activeTab && /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          role: "tabpanel",
+          id: panelId(activeTab.key),
+          "aria-labelledby": tabId(activeTab.key),
+          className: "py-4",
+          children: activeTab.content
+        }
+      )
     ] });
   }
 );

package/dist/{chunk-F2BUMJYW.mjs → chunk-RBVTV3LA.mjs}

@@ -55,7 +55,7 @@ var RadioGroup = React.forwardRef(
           })
         }
       ),
-      error && /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-red-500", children: error })
+      error && /* @__PURE__ */ jsx("p", { role: "alert", className: "mt-1 text-sm text-red-600", children: error })
     ] });
   }
 );

package/dist/{chunk-B47HQHX3.mjs → chunk-RGZHSI2G.mjs}

@@ -178,7 +178,7 @@ var Autocomplete = React.forwardRef(
           }
         )
       ] }),
-      error && /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-red-500", children: error })
+      error && /* @__PURE__ */ jsx("p", { role: "alert", className: "mt-1 text-sm text-red-600", children: error })
     ] });
   }
 );

package/dist/{chunk-GXKON34B.js → chunk-RTI25IBR.js}

@@ -77,7 +77,7 @@ var RadioGroup = React__namespace.forwardRef(
           })
         }
       ),
-      error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-red-500", children: error })
+      error && /* @__PURE__ */ jsxRuntime.jsx("p", { role: "alert", className: "mt-1 text-sm text-red-600", children: error })
     ] });
   }
 );

package/dist/{chunk-LJSMPON7.js → chunk-USJDHMKS.js}

@@ -239,7 +239,7 @@ var Select = React__namespace.forwardRef(
           }
         )
       ] }),
-      error && /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, className: "mt-1 text-sm text-red-500", children: error })
+      error && /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, role: "alert", className: "mt-1 text-sm text-red-600", children: error })
     ] });
   }
 );