@dododog/ui 0.1.0

package/dist/chunk-7LJS5LNR.js

@@ -0,0 +1,365 @@
+'use strict';
+
+var chunkADIDI7AJ_js = require('./chunk-ADIDI7AJ.js');
+var React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+function startOfDay(d) {
+  const r = new Date(d);
+  r.setHours(0, 0, 0, 0);
+  return r;
+}
+function addMonths(d, n) {
+  const r = new Date(d);
+  r.setMonth(r.getMonth() + n);
+  return r;
+}
+function isSameDay(a, b) {
+  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
+}
+function isBefore(a, b) {
+  return startOfDay(a).getTime() < startOfDay(b).getTime();
+}
+function isAfter(a, b) {
+  return startOfDay(a).getTime() > startOfDay(b).getTime();
+}
+function isSameMonth(a, b) {
+  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth();
+}
+var MONTH_NAMES = [
+  "janvier",
+  "f\xE9vrier",
+  "mars",
+  "avril",
+  "mai",
+  "juin",
+  "juillet",
+  "ao\xFBt",
+  "septembre",
+  "octobre",
+  "novembre",
+  "d\xE9cembre"
+];
+var SHORT_MONTHS = [
+  "janv.",
+  "f\xE9vr.",
+  "mars",
+  "avr.",
+  "mai",
+  "juin",
+  "juil.",
+  "ao\xFBt",
+  "sept.",
+  "oct.",
+  "nov.",
+  "d\xE9c."
+];
+var WEEK_DAYS = ["lu", "ma", "me", "je", "ve", "sa", "di"];
+function formatMonthYear(d) {
+  return `${MONTH_NAMES[d.getMonth()]} ${d.getFullYear()}`;
+}
+function formatShortDate(d) {
+  return `${d.getDate()} ${SHORT_MONTHS[d.getMonth()]}`;
+}
+function getCalendarDays(month) {
+  const first = new Date(month.getFullYear(), month.getMonth(), 1);
+  const dayOfWeek = (first.getDay() + 6) % 7;
+  const start = new Date(first);
+  start.setDate(start.getDate() - dayOfWeek);
+  const last = new Date(month.getFullYear(), month.getMonth() + 1, 0);
+  const dayOfWeekEnd = (last.getDay() + 6) % 7;
+  const end = new Date(last);
+  end.setDate(end.getDate() + (6 - dayOfWeekEnd));
+  const days = [];
+  const cursor = new Date(start);
+  while (cursor <= end) {
+    days.push(new Date(cursor));
+    cursor.setDate(cursor.getDate() + 1);
+  }
+  return days;
+}
+function DatePickerInput({
+  label,
+  value,
+  placeholder = "Quand ?",
+  isActive,
+  onClick,
+  onClear,
+  showClear = false
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: "relative flex-1 px-4 py-2 border-b md:border-b-0 md:border-r border-gray-200 transition-all text-left cursor-pointer",
+      onClick,
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-medium text-gray-500 mb-0.5", children: label }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "p",
+            {
+              className: chunkADIDI7AJ_js.cn(
+                "text-base font-medium text-primary whitespace-nowrap",
+                isActive && value && "underline decoration-secondary decoration-2 underline-offset-4"
+              ),
+              children: value ? formatShortDate(value) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-gray-400", children: placeholder })
+            }
+          )
+        ] }),
+        showClear && value && isActive && onClear && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            onClick: (e) => {
+              e.stopPropagation();
+              onClear();
+            },
+            className: "p-1 hover:bg-gray-100 rounded-full transition-colors",
+            children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "text-gray-400", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18" }),
+              /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 6 12 12" })
+            ] })
+          }
+        )
+      ] })
+    }
+  );
+}
+var DateRangePicker = React__namespace.forwardRef(
+  ({
+    checkIn,
+    checkOut,
+    onCheckInChange,
+    onCheckOutChange,
+    isOpen,
+    onClose,
+    position = "center",
+    minWidth = 800
+  }, forwardedRef) => {
+    const [calendarMonth, setCalendarMonth] = React__namespace.useState(() => checkIn || /* @__PURE__ */ new Date());
+    const [activeDateField, setActiveDateField] = React__namespace.useState("arrival");
+    const [isMobile, setIsMobile] = React__namespace.useState(false);
+    const internalRef = React__namespace.useRef(null);
+    const setRefs = React__namespace.useCallback(
+      (node) => {
+        internalRef.current = node;
+        if (typeof forwardedRef === "function") forwardedRef(node);
+        else if (forwardedRef) forwardedRef.current = node;
+      },
+      [forwardedRef]
+    );
+    React__namespace.useEffect(() => {
+      const mq = window.matchMedia("(max-width: 767px)");
+      setIsMobile(mq.matches);
+      const handler = (e) => setIsMobile(e.matches);
+      mq.addEventListener("change", handler);
+      return () => mq.removeEventListener("change", handler);
+    }, []);
+    React__namespace.useEffect(() => {
+      if (isOpen) {
+        setActiveDateField("arrival");
+        if (checkIn) setCalendarMonth(checkIn);
+      }
+    }, [isOpen]);
+    React__namespace.useEffect(() => {
+      if (isOpen && isMobile) {
+        const prev = document.body.style.overflow;
+        document.body.style.overflow = "hidden";
+        return () => {
+          document.body.style.overflow = prev;
+        };
+      }
+    }, [isOpen, isMobile]);
+    React__namespace.useEffect(() => {
+      if (isMobile || !isOpen) return;
+      const handleClickOutside = (event) => {
+        if (internalRef.current && !internalRef.current.contains(event.target)) {
+          onClose();
+        }
+      };
+      document.addEventListener("mousedown", handleClickOutside);
+      return () => document.removeEventListener("mousedown", handleClickOutside);
+    }, [isOpen, onClose, isMobile]);
+    const handleDateClick = (date) => {
+      if (activeDateField === "arrival") {
+        onCheckInChange(date);
+        if (checkOut && isBefore(checkOut, date)) onCheckOutChange(null);
+        setActiveDateField("departure");
+      } else {
+        if (checkIn && isBefore(date, checkIn)) {
+          onCheckInChange(date);
+          onCheckOutChange(null);
+          setActiveDateField("departure");
+        } else {
+          onCheckOutChange(date);
+          if (isMobile) onClose();
+        }
+      }
+    };
+    const clearDates = () => {
+      onCheckInChange(null);
+      onCheckOutChange(null);
+      setActiveDateField("arrival");
+    };
+    const isDateInRange = (date) => {
+      if (!checkIn || !checkOut) return false;
+      return isAfter(date, checkIn) && isBefore(date, checkOut);
+    };
+    const isDateDisabled = (date) => {
+      const today = startOfDay(/* @__PURE__ */ new Date());
+      return isBefore(date, today);
+    };
+    const renderMonth = (monthDate, compact = false) => {
+      const days = getCalendarDays(monthDate);
+      return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
+        !compact && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-center font-semibold text-2xl text-primary mb-6 capitalize", children: formatMonthYear(monthDate) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkADIDI7AJ_js.cn("grid grid-cols-7", compact ? "mb-2" : "mb-3"), children: WEEK_DAYS.map((day) => /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: chunkADIDI7AJ_js.cn(
+              "text-center font-medium text-gray-500 py-2",
+              compact ? "text-xs" : "text-base"
+            ),
+            children: day
+          },
+          day
+        )) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-7", children: days.map((day, index) => {
+          const isCurrentMonth = isSameMonth(day, monthDate);
+          const isSelected = checkIn && isSameDay(day, checkIn) || checkOut && isSameDay(day, checkOut);
+          const isStart = checkIn && isSameDay(day, checkIn);
+          const isEnd = checkOut && isSameDay(day, checkOut);
+          const inRange = isDateInRange(day) && isCurrentMonth;
+          const disabled = isDateDisabled(day) || !isCurrentMonth;
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => !disabled && handleDateClick(day),
+              disabled,
+              className: chunkADIDI7AJ_js.cn(
+                "relative font-medium transition-all",
+                compact ? "h-10 text-sm" : "h-12 text-base",
+                !isCurrentMonth && "text-gray-300",
+                disabled && isCurrentMonth && "text-gray-300 cursor-not-allowed",
+                inRange && "bg-orange-100",
+                isSelected && "bg-secondary text-white z-10",
+                isStart && checkOut && "rounded-l-lg",
+                isEnd && checkIn && "rounded-r-lg",
+                isSelected && (!checkOut || !checkIn) && "rounded-lg",
+                isSelected && checkIn && checkOut && isSameDay(checkIn, checkOut) && "rounded-lg",
+                !disabled && !isSelected && !inRange && isCurrentMonth && "text-primary hover:bg-gray-100 hover:rounded-lg"
+              ),
+              children: isCurrentMonth && day.getDate()
+            },
+            index
+          );
+        }) })
+      ] });
+    };
+    if (!isOpen) return null;
+    if (isMobile) {
+      return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "fixed inset-0 z-[60] bg-white flex flex-col", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-4 py-3 border-b border-gray-100", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-heading font-bold text-lg text-primary", children: "S\xE9lectionnez vos dates" }),
+          /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: onClose, className: "p-2 hover:bg-gray-100 rounded-full transition-colors", children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "text-gray-600", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 6 12 12" })
+          ] }) })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-3 px-4 py-3 border-b border-gray-100", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "button",
+            {
+              onClick: () => setActiveDateField("arrival"),
+              className: chunkADIDI7AJ_js.cn(
+                "flex-1 px-3 py-2 rounded-xl text-left transition-all",
+                activeDateField === "arrival" ? "ring-2 ring-secondary bg-secondary/5" : "bg-gray-100"
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-medium text-gray-500", children: "Arriv\xE9e" }),
+                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold text-primary", children: checkIn ? `${checkIn.getDate()} ${SHORT_MONTHS[checkIn.getMonth()]} ${checkIn.getFullYear()}` : "S\xE9lectionner" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "button",
+            {
+              onClick: () => setActiveDateField("departure"),
+              className: chunkADIDI7AJ_js.cn(
+                "flex-1 px-3 py-2 rounded-xl text-left transition-all",
+                activeDateField === "departure" ? "ring-2 ring-secondary bg-secondary/5" : "bg-gray-100"
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-medium text-gray-500", children: "D\xE9part" }),
+                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold text-primary", children: checkOut ? `${checkOut.getDate()} ${SHORT_MONTHS[checkOut.getMonth()]} ${checkOut.getFullYear()}` : "S\xE9lectionner" })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 overflow-y-auto px-4 py-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-4", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => setCalendarMonth(addMonths(calendarMonth, -1)), className: "p-2 hover:bg-gray-100 rounded-full transition-colors", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "text-gray-600", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m15 18-6-6 6-6" }) }) }),
+            /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold text-lg text-primary capitalize", children: formatMonthYear(calendarMonth) }),
+            /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => setCalendarMonth(addMonths(calendarMonth, 1)), className: "p-2 hover:bg-gray-100 rounded-full transition-colors", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "text-gray-600", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m9 18 6-6-6-6" }) }) })
+          ] }),
+          renderMonth(calendarMonth, true)
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-t border-gray-100 px-4 py-3 flex items-center justify-between bg-white", children: [
+          checkIn || checkOut ? /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: clearDates, className: "text-sm text-primary underline hover:text-secondary transition-colors", children: "Effacer" }) : /* @__PURE__ */ jsxRuntime.jsx("div", {}),
+          /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: onClose, className: "px-6 py-2.5 bg-secondary text-white rounded-xl font-semibold text-sm hover:bg-secondary-dark transition-colors", children: "Valider" })
+        ] })
+      ] });
+    }
+    const positionClasses = {
+      left: "left-0",
+      center: "left-1/2 -translate-x-1/2",
+      right: "right-0"
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref: setRefs,
+        className: chunkADIDI7AJ_js.cn(
+          "absolute top-full mt-2 bg-white rounded-3xl shadow-2xl border z-[60] p-8 pb-10",
+          positionClasses[position]
+        ),
+        style: { minWidth: `${minWidth}px` },
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-4", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => setCalendarMonth(addMonths(calendarMonth, -1)), className: "p-2 hover:bg-gray-100 rounded-full transition-colors", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "text-gray-600", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m15 18-6-6 6-6" }) }) }),
+            /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => setCalendarMonth(addMonths(calendarMonth, 1)), className: "p-2 hover:bg-gray-100 rounded-full transition-colors", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "text-gray-600", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m9 18 6-6-6-6" }) }) })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-12", children: [
+            renderMonth(calendarMonth),
+            renderMonth(addMonths(calendarMonth, 1))
+          ] }),
+          (checkIn || checkOut) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-right mt-4 pt-4 border-t border-gray-100", children: /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: clearDates, className: "text-sm text-primary underline hover:text-secondary transition-colors", children: "Effacer les dates" }) })
+        ]
+      }
+    );
+  }
+);
+DateRangePicker.displayName = "DateRangePicker";
+
+exports.DatePickerInput = DatePickerInput;
+exports.DateRangePicker = DateRangePicker;

package/dist/chunk-7W3TFPIF.js

@@ -0,0 +1,111 @@
+'use strict';
+
+var chunkADIDI7AJ_js = require('./chunk-ADIDI7AJ.js');
+var React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var FilterAccordion = React__namespace.forwardRef(
+  ({ items, defaultOpenKeys = [], className }, ref) => {
+    const [openKeys, setOpenKeys] = React__namespace.useState(
+      () => new Set(defaultOpenKeys)
+    );
+    const toggle = (key) => {
+      setOpenKeys((prev) => {
+        const next = new Set(prev);
+        if (next.has(key)) {
+          next.delete(key);
+        } else {
+          next.add(key);
+        }
+        return next;
+      });
+    };
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: chunkADIDI7AJ_js.cn("space-y-3", className), children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+      FilterAccordionItem,
+      {
+        title: item.title,
+        isOpen: openKeys.has(item.key),
+        onToggle: () => toggle(item.key),
+        children: item.content
+      },
+      item.key
+    )) });
+  }
+);
+FilterAccordion.displayName = "FilterAccordion";
+function FilterAccordionItem({
+  title,
+  isOpen,
+  onToggle,
+  children
+}) {
+  const contentRef = React__namespace.useRef(null);
+  const [height, setHeight] = React__namespace.useState(0);
+  React__namespace.useEffect(() => {
+    if (contentRef.current) {
+      setHeight(isOpen ? contentRef.current.scrollHeight : 0);
+    }
+  }, [isOpen]);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white rounded-xl border border-sand-dark overflow-hidden", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        onClick: onToggle,
+        "aria-expanded": isOpen,
+        className: "w-full flex items-center justify-between p-4 hover:bg-sand-light transition-colors",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-primary", children: title }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "svg",
+            {
+              xmlns: "http://www.w3.org/2000/svg",
+              width: "20",
+              height: "20",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              className: chunkADIDI7AJ_js.cn(
+                "transition-transform duration-200",
+                isOpen && "rotate-180"
+              ),
+              children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 9 6 6 6-6" })
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        style: { height },
+        className: "overflow-hidden transition-all duration-300 ease-out",
+        children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref: contentRef, className: "px-4 pb-4", children })
+      }
+    )
+  ] });
+}
+
+exports.FilterAccordion = FilterAccordion;

package/dist/chunk-ADIDI7AJ.js

@@ -0,0 +1,11 @@
+'use strict';
+
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+
+// src/utils/cn.ts
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+
+exports.cn = cn;

package/dist/chunk-B47HQHX3.mjs

@@ -0,0 +1,187 @@
+import { cn } from './chunk-IMKLN273.mjs';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var autocompleteInputVariants = cva(
+  "w-full border bg-white transition-all placeholder:text-text-muted text-primary",
+  {
+    variants: {
+      size: {
+        sm: "px-3 py-2 text-sm rounded-xl",
+        md: "px-4 py-3 text-sm rounded-xl",
+        lg: "px-4 py-3 text-base rounded-xl"
+      },
+      variant: {
+        default: "border-gray-200 focus:border-secondary focus:outline-none focus:ring-1 focus:ring-secondary",
+        error: "border-red-300 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-red-500"
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      variant: "default"
+    }
+  }
+);
+var Autocomplete = React.forwardRef(
+  ({
+    value,
+    onChange,
+    onSelect,
+    suggestions,
+    loading = false,
+    placeholder,
+    label,
+    error,
+    size,
+    variant,
+    renderSuggestion,
+    className
+  }, ref) => {
+    const [isOpen, setIsOpen] = React.useState(false);
+    const [highlightedIndex, setHighlightedIndex] = React.useState(-1);
+    const containerRef = React.useRef(null);
+    const listRef = React.useRef(null);
+    const inputRef = React.useRef(null);
+    const resolvedVariant = error ? "error" : variant ?? "default";
+    const showDropdown = isOpen && (suggestions.length > 0 || loading);
+    React.useEffect(() => {
+      const handleClickOutside = (e) => {
+        if (containerRef.current && !containerRef.current.contains(e.target)) {
+          setIsOpen(false);
+        }
+      };
+      document.addEventListener("mousedown", handleClickOutside);
+      return () => document.removeEventListener("mousedown", handleClickOutside);
+    }, []);
+    React.useEffect(() => {
+      setHighlightedIndex(-1);
+    }, [suggestions]);
+    React.useEffect(() => {
+      if (highlightedIndex >= 0 && listRef.current) {
+        const items = listRef.current.children;
+        if (items[highlightedIndex]) {
+          items[highlightedIndex].scrollIntoView({
+            block: "nearest"
+          });
+        }
+      }
+    }, [highlightedIndex]);
+    const handleSelect = (suggestion) => {
+      onChange(suggestion.label);
+      onSelect?.(suggestion);
+      setIsOpen(false);
+    };
+    const handleKeyDown = (e) => {
+      switch (e.key) {
+        case "ArrowDown":
+          e.preventDefault();
+          setHighlightedIndex(
+            (prev) => prev < suggestions.length - 1 ? prev + 1 : prev
+          );
+          break;
+        case "ArrowUp":
+          e.preventDefault();
+          setHighlightedIndex((prev) => prev > 0 ? prev - 1 : prev);
+          break;
+        case "Enter":
+          e.preventDefault();
+          if (highlightedIndex >= 0 && suggestions[highlightedIndex]) {
+            handleSelect(suggestions[highlightedIndex]);
+          }
+          break;
+        case "Escape":
+          e.preventDefault();
+          setIsOpen(false);
+          break;
+      }
+    };
+    return /* @__PURE__ */ jsxs("div", { ref, className: "w-full", children: [
+      label && /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-primary mb-1.5", children: label }),
+      /* @__PURE__ */ jsxs("div", { ref: containerRef, className: "relative", children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            ref: inputRef,
+            type: "text",
+            role: "combobox",
+            "aria-expanded": showDropdown,
+            "aria-autocomplete": "list",
+            value,
+            placeholder,
+            onChange: (e) => {
+              onChange(e.target.value);
+              setIsOpen(true);
+            },
+            onFocus: () => setIsOpen(true),
+            onKeyDown: handleKeyDown,
+            className: cn(
+              autocompleteInputVariants({ size, variant: resolvedVariant }),
+              className
+            )
+          }
+        ),
+        loading && /* @__PURE__ */ jsx("div", { className: "absolute right-3 top-1/2 -translate-y-1/2", children: /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            className: "animate-spin h-4 w-4 text-text-muted",
+            xmlns: "http://www.w3.org/2000/svg",
+            fill: "none",
+            viewBox: "0 0 24 24",
+            children: [
+              /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  className: "opacity-25",
+                  cx: "12",
+                  cy: "12",
+                  r: "10",
+                  stroke: "currentColor",
+                  strokeWidth: "4"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "path",
+                {
+                  className: "opacity-75",
+                  fill: "currentColor",
+                  d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"
+                }
+              )
+            ]
+          }
+        ) }),
+        showDropdown && /* @__PURE__ */ jsxs(
+          "ul",
+          {
+            ref: listRef,
+            role: "listbox",
+            className: "absolute z-50 mt-1 w-full bg-white border border-gray-200 rounded-xl shadow-lg max-h-60 overflow-auto py-1",
+            children: [
+              suggestions.map((suggestion, index) => /* @__PURE__ */ jsx(
+                "li",
+                {
+                  role: "option",
+                  "aria-selected": highlightedIndex === index,
+                  onClick: () => handleSelect(suggestion),
+                  onMouseEnter: () => setHighlightedIndex(index),
+                  className: cn(
+                    "px-4 py-2.5 text-sm cursor-pointer transition-colors",
+                    highlightedIndex === index ? "bg-sand-light text-primary" : "text-primary"
+                  ),
+                  children: renderSuggestion ? renderSuggestion(suggestion) : suggestion.label
+                },
+                suggestion.value
+              )),
+              loading && suggestions.length === 0 && /* @__PURE__ */ jsx("li", { className: "px-4 py-2.5 text-sm text-text-muted", children: "Chargement..." })
+            ]
+          }
+        )
+      ] }),
+      error && /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-red-500", children: error })
+    ] });
+  }
+);
+Autocomplete.displayName = "Autocomplete";
+
+export { Autocomplete, autocompleteInputVariants };