@dododog/ui 0.10.1 → 0.12.0

package/dist/chunk-DUT3ABEI.mjs

@@ -0,0 +1,108 @@
+import { cn } from './chunk-IMKLN273.mjs';
+import * as React from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+function PinIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "17", height: "17", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("path", { d: "M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "10", r: "3" })
+  ] });
+}
+function CalendarIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("path", { d: "M8 2v4" }),
+    /* @__PURE__ */ jsx("path", { d: "M16 2v4" }),
+    /* @__PURE__ */ jsx("rect", { width: "18", height: "18", x: "3", y: "4", rx: "2" }),
+    /* @__PURE__ */ jsx("path", { d: "M3 10h18" })
+  ] });
+}
+function DogIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "17", height: "17", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("path", { d: "M10 5.172C10 3.782 8.423 2.679 6.5 3c-2.823.47-4.113 6.006-4 7 .08.703 1.725 1.722 3.656 1 1.261-.472 1.96-1.45 2.344-2.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M14.267 5.172c0-1.39 1.577-2.493 3.5-2.172 2.823.47 4.113 6.006 4 7-.08.703-1.725 1.722-3.656 1-1.261-.472-1.855-1.45-2.239-2.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 14v.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M16 14v.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M4.42 11.247A13.152 13.152 0 0 0 4 14.556C4 18.728 7.582 21 12 21s8-2.272 8-6.444c0-1.061-.162-2.2-.493-3.309" })
+  ] });
+}
+function ChevronDownIcon() {
+  return /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "m6 9 6 6 6-6" }) });
+}
+function SearchIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "11", cy: "11", r: "7" }),
+    /* @__PURE__ */ jsx("path", { d: "m21 21-4.3-4.3" })
+  ] });
+}
+var fieldClass = "flex items-center gap-2.5 rounded-[14px] border border-sand-dark/70 bg-sand-light px-3.5 py-3";
+var fieldLabelClass = "text-[10px] font-semibold uppercase tracking-[0.04em] text-text-secondary";
+var fieldValueClass = "text-sm font-medium text-primary";
+var SearchWidget = React.forwardRef(
+  ({
+    title = "Trouver un s\xE9jour",
+    destination = "O\xF9 partez-vous ?",
+    arrivalLabel = "Ajouter",
+    departureLabel = "Ajouter",
+    travelersLabel = "2 adultes \xB7 2 chiens",
+    actionLabel = "Rechercher",
+    href = "/search",
+    renderLink,
+    className,
+    ...props
+  }, ref) => {
+    const btnClass = "flex min-h-[44px] w-full items-center justify-center gap-2 rounded-full bg-secondary px-4 py-3 text-sm font-semibold text-white shadow-[0_8px_18px_-8px_rgba(242,124,84,0.7)] transition-colors hover:bg-secondary-dark focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2";
+    const btnChildren = /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(SearchIcon, {}),
+      actionLabel
+    ] });
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "rounded-[22px] border border-sand-dark bg-white p-[18px] shadow-[0_8px_22px_-14px_rgba(29,34,48,0.22)] md:p-5",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("h4", { className: "mb-3.5 font-heading text-base font-bold text-primary", children: title }),
+          /* @__PURE__ */ jsxs("div", { className: cn(fieldClass, "mb-2.5"), children: [
+            /* @__PURE__ */ jsx("span", { className: "text-secondary", children: /* @__PURE__ */ jsx(PinIcon, {}) }),
+            /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+              /* @__PURE__ */ jsx("div", { className: fieldLabelClass, children: "Destination" }),
+              /* @__PURE__ */ jsx("div", { className: fieldValueClass, children: destination })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "mb-2.5 flex gap-2.5", children: [
+            /* @__PURE__ */ jsx("div", { className: cn(fieldClass, "flex-1"), children: /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+              /* @__PURE__ */ jsx("div", { className: fieldLabelClass, children: "Arriv\xE9e" }),
+              /* @__PURE__ */ jsxs("div", { className: "mt-0.5 flex items-center gap-1.5 text-text-secondary", children: [
+                /* @__PURE__ */ jsx(CalendarIcon, {}),
+                /* @__PURE__ */ jsx("span", { className: "text-[13px] font-medium text-primary", children: arrivalLabel })
+              ] })
+            ] }) }),
+            /* @__PURE__ */ jsx("div", { className: cn(fieldClass, "flex-1"), children: /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+              /* @__PURE__ */ jsx("div", { className: fieldLabelClass, children: "D\xE9part" }),
+              /* @__PURE__ */ jsxs("div", { className: "mt-0.5 flex items-center gap-1.5 text-text-secondary", children: [
+                /* @__PURE__ */ jsx(CalendarIcon, {}),
+                /* @__PURE__ */ jsx("span", { className: "text-[13px] font-medium text-primary", children: departureLabel })
+              ] })
+            ] }) })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: cn(fieldClass, "mb-3.5"), children: [
+            /* @__PURE__ */ jsx("span", { className: "text-accent", children: /* @__PURE__ */ jsx(DogIcon, {}) }),
+            /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+              /* @__PURE__ */ jsx("div", { className: fieldLabelClass, children: "Voyageurs" }),
+              /* @__PURE__ */ jsx("div", { className: fieldValueClass, children: travelersLabel })
+            ] }),
+            /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: /* @__PURE__ */ jsx(ChevronDownIcon, {}) })
+          ] }),
+          renderLink ? renderLink({ href, className: btnClass, children: btnChildren }) : /* @__PURE__ */ jsx("a", { href, className: btnClass, children: btnChildren })
+        ]
+      }
+    );
+  }
+);
+SearchWidget.displayName = "SearchWidget";
+
+export { SearchWidget };

package/dist/chunk-G3LZ32WA.js

@@ -0,0 +1,129 @@
+'use strict';
+
+var chunkHB2XJOBZ_js = require('./chunk-HB2XJOBZ.js');
+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 MapPinIcon({ size = 15 }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z" }),
+    /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "10", r: "3" })
+  ] });
+}
+var boxClass = "flex-1 rounded-2xl border border-sand-dark/70 bg-sand-light px-3.5 py-2.5";
+var boxLabelClass = "text-[11px] font-semibold uppercase tracking-[0.04em] text-text-secondary";
+var primaryBtnClass = "flex min-h-[44px] flex-1 items-center justify-center gap-2 rounded-full bg-secondary px-4 py-3 text-sm font-semibold text-white shadow-[0_8px_18px_-8px_rgba(242,124,84,0.7)] transition-colors hover:bg-secondary-dark focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2";
+var ActiveStayCard = React__namespace.forwardRef(
+  ({
+    statusLabel = "S\xE9jour en cours",
+    petBadge,
+    hotelName,
+    location,
+    priceLabel,
+    priceNote,
+    checkinLabel,
+    checkoutLabel,
+    countdownLabel,
+    dogs = [],
+    imageUrl,
+    primaryActionLabel = "Voir la r\xE9servation",
+    primaryActionHref,
+    secondaryActions,
+    renderImage,
+    renderLink,
+    className,
+    ...props
+  }, ref) => {
+    const primaryBtn = primaryActionHref ? renderLink ? renderLink({
+      href: primaryActionHref,
+      className: primaryBtnClass,
+      children: primaryActionLabel
+    }) : /* @__PURE__ */ jsxRuntime.jsx("a", { href: primaryActionHref, className: primaryBtnClass, children: primaryActionLabel }) : /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: primaryBtnClass, children: primaryActionLabel });
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "section",
+      {
+        ref,
+        "aria-label": statusLabel,
+        className: chunkADIDI7AJ_js.cn(
+          "overflow-hidden rounded-[22px] border border-sand-dark bg-white shadow-[0_14px_30px_-16px_rgba(29,34,48,0.3)] md:rounded-3xl",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative h-[150px] md:h-[200px]", children: [
+            imageUrl ? renderImage ? renderImage({ src: imageUrl, alt: hotelName, className: "h-full w-full object-cover" }) : /* @__PURE__ */ jsxRuntime.jsx("img", { src: imageUrl, alt: hotelName, className: "h-full w-full object-cover" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full w-full bg-gradient-to-br from-accent-light to-accent-dark" }),
+            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "absolute left-3.5 top-3.5 inline-flex items-center gap-1.5 rounded-full bg-white px-3 py-1.5 text-[11.5px] font-bold text-accent-dark md:text-xs", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-1.5 w-1.5 animate-pulse rounded-full bg-accent" }),
+              statusLabel
+            ] }),
+            petBadge && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-3.5 top-3.5 rounded-full bg-white/90 px-3 py-1.5 text-[11.5px] font-bold text-accent-dark backdrop-blur-sm md:text-xs", children: petBadge })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-[18px] md:p-[22px]", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-4", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-heading text-xl font-bold leading-[1.15] text-primary md:text-2xl", children: hotelName }),
+                location && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "mt-1.5 inline-flex items-center gap-1.5 text-[13px] text-text-secondary md:text-sm", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(MapPinIcon, {}),
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: location })
+                ] })
+              ] }),
+              priceLabel && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "shrink-0 text-right", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-heading text-lg font-bold text-primary md:text-[22px]", children: priceLabel }),
+                priceNote && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[11px] text-text-secondary md:text-xs", children: priceNote })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3.5 flex items-center justify-between rounded-2xl border border-sand-dark/70 bg-sand-light px-3.5 py-2.5 md:hidden", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: boxLabelClass, children: "D\xE9part dans" }),
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-0.5 text-[14.5px] font-bold text-primary", children: countdownLabel ?? `${checkinLabel} \u2192 ${checkoutLabel}` })
+              ] }),
+              dogs.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(chunkHB2XJOBZ_js.DogAvatarStack, { dogs, size: 26, ringColor: "#faf7f2" })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-4 hidden gap-2.5 md:flex", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: boxClass, children: [
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: boxLabelClass, children: "Arriv\xE9e" }),
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-0.5 text-[14.5px] font-semibold text-primary", children: checkinLabel })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: boxClass, children: [
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: boxLabelClass, children: "D\xE9part" }),
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-0.5 text-[14.5px] font-semibold text-primary", children: checkoutLabel })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: boxClass, children: [
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: boxLabelClass, children: "Chiens" }),
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1", children: dogs.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(chunkHB2XJOBZ_js.DogAvatarStack, { dogs, size: 22, overlap: 0, className: "gap-1", ringColor: "transparent" }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] text-text-secondary", children: "\u2014" }) })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-4 flex gap-2.5", children: [
+              primaryBtn,
+              secondaryActions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden gap-2.5 md:flex", children: secondaryActions })
+            ] })
+          ] })
+        ]
+      }
+    );
+  }
+);
+ActiveStayCard.displayName = "ActiveStayCard";
+
+exports.ActiveStayCard = ActiveStayCard;

package/dist/chunk-HB2XJOBZ.js

@@ -0,0 +1,141 @@
+'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 DogGlyph({ size }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      viewBox: "0 0 24 24",
+      width: size,
+      height: size,
+      fill: "none",
+      stroke: "#fff",
+      strokeWidth: 2.1,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      style: { width: "58%", height: "58%" },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10 5.172C10 3.782 8.423 2.679 6.5 3c-2.823.47-4.113 6.006-4 7 .08.703 1.725 1.722 3.656 1 1.261-.472 1.96-1.45 2.344-2.5" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M14.267 5.172c0-1.39 1.577-2.493 3.5-2.172 2.823.47 4.113 6.006 4 7-.08.703-1.725 1.722-3.656 1-1.261-.472-1.855-1.45-2.239-2.5" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8 14v.5" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M16 14v.5" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M11.25 16.25h1.5L12 17l-.75-.75Z" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4.42 11.247A13.152 13.152 0 0 0 4 14.556C4 18.728 7.582 21 12 21s8-2.272 8-6.444c0-1.061-.162-2.2-.493-3.309" })
+      ]
+    }
+  );
+}
+var DOG_AVATAR_COLORS = [
+  "#f27c54",
+  "#00bfb3",
+  "#e0a458",
+  "#c96f4a",
+  "#7ba05b"
+];
+function dogAvatarColor(name) {
+  let hash = 0;
+  for (let i = 0; i < name.length; i++) {
+    hash = name.charCodeAt(i) + ((hash << 5) - hash);
+  }
+  return DOG_AVATAR_COLORS[Math.abs(hash) % DOG_AVATAR_COLORS.length];
+}
+var DogAvatar = React__namespace.forwardRef(
+  ({ name, color, size = 46, ringColor, className, style, ...props }, ref) => {
+    const bg = color ?? dogAvatarColor(name);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        role: "img",
+        "aria-label": name,
+        className: chunkADIDI7AJ_js.cn("grid place-items-center rounded-full", className),
+        style: {
+          width: size,
+          height: size,
+          background: bg,
+          border: ringColor ? `2px solid ${ringColor}` : void 0,
+          ...style
+        },
+        ...props,
+        children: /* @__PURE__ */ jsxRuntime.jsx(DogGlyph, { size })
+      }
+    );
+  }
+);
+DogAvatar.displayName = "DogAvatar";
+var DogAvatarStack = React__namespace.forwardRef(
+  ({
+    dogs,
+    size = 26,
+    max = 4,
+    overlap = 8,
+    ringColor = "#fff",
+    className,
+    ...props
+  }, ref) => {
+    const shown = dogs.slice(0, max);
+    const extra = dogs.length - shown.length;
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: chunkADIDI7AJ_js.cn("flex items-center", className), ...props, children: [
+      shown.map((dog, i) => /* @__PURE__ */ jsxRuntime.jsx(
+        DogAvatar,
+        {
+          name: dog.name,
+          color: dog.color ?? DOG_AVATAR_COLORS[i % DOG_AVATAR_COLORS.length],
+          size,
+          ringColor,
+          style: i > 0 ? { marginLeft: -overlap } : void 0
+        },
+        `${dog.name}-${i}`
+      )),
+      extra > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: "grid place-items-center rounded-full font-bold text-text-secondary",
+          style: {
+            width: size,
+            height: size,
+            marginLeft: -overlap,
+            background: "#f5f0e8",
+            border: `2px solid ${ringColor}`,
+            fontSize: Math.round(size * 0.4)
+          },
+          "aria-label": `${extra} de plus`,
+          children: [
+            "+",
+            extra
+          ]
+        }
+      )
+    ] });
+  }
+);
+DogAvatarStack.displayName = "DogAvatarStack";
+
+exports.DOG_AVATAR_COLORS = DOG_AVATAR_COLORS;
+exports.DogAvatar = DogAvatar;
+exports.DogAvatarStack = DogAvatarStack;
+exports.dogAvatarColor = dogAvatarColor;

package/dist/chunk-IKQYFSBW.mjs

@@ -0,0 +1,33 @@
+import { cn } from './chunk-IMKLN273.mjs';
+import * as React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function HeartIcon() {
+  return /* @__PURE__ */ jsx("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", stroke: "#f5a083", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.29 1.51 4.04 3 5.5l7 7Z" }) });
+}
+var ImpactCard = React.forwardRef(
+  ({ badgeLabel = "Voyage engag\xE9", amountLabel, description, className, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "rounded-[22px] bg-primary p-5 text-white shadow-[0_10px_26px_-14px_rgba(29,34,48,0.5)]",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-1.5 rounded-full bg-white/[0.12] px-2.5 py-1 text-[11px] font-semibold text-[#ffd9c6]", children: [
+            /* @__PURE__ */ jsx(HeartIcon, {}),
+            badgeLabel
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "mt-3 font-heading text-[26px] font-bold", children: amountLabel }),
+          description && /* @__PURE__ */ jsx("p", { className: "mt-1 text-[12.5px] leading-[1.45] text-white/70", children: description })
+        ]
+      }
+    );
+  }
+);
+ImpactCard.displayName = "ImpactCard";
+
+export { ImpactCard };

package/dist/chunk-JSRYMZCT.js

@@ -0,0 +1,99 @@
+'use strict';
+
+var chunkHB2XJOBZ_js = require('./chunk-HB2XJOBZ.js');
+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 MapPinIcon({ size = 14 }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z" }),
+    /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "10", r: "3" })
+  ] });
+}
+function ChevronRightIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 18l6-6-6-6" }) });
+}
+var DEFAULT_GRADIENT = "linear-gradient(135deg,#f5a083,#f27c54)";
+var StayListRow = React__namespace.forwardRef(
+  ({
+    hotelName,
+    location,
+    priceLabel,
+    nightsLabel,
+    thumbnailUrl,
+    thumbnailGradient = DEFAULT_GRADIENT,
+    badge,
+    badgeTone = "free",
+    dogs = [],
+    href,
+    className,
+    renderImage,
+    renderLink
+  }, ref) => {
+    const rowClass = chunkADIDI7AJ_js.cn(
+      "group flex items-center gap-3 px-4 py-3.5 transition-colors hover:bg-sand-light md:gap-4 md:px-[18px] md:py-[15px]",
+      href && "cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-inset focus-visible:ring-offset-0",
+      className
+    );
+    const body = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: "relative h-[54px] w-[54px] shrink-0 overflow-hidden rounded-[13px] md:h-16 md:w-16 md:rounded-[14px]",
+          style: thumbnailUrl ? void 0 : { background: thumbnailGradient },
+          children: [
+            thumbnailUrl && (renderImage ? renderImage({ src: thumbnailUrl, alt: hotelName, className: "h-full w-full object-cover" }) : /* @__PURE__ */ jsxRuntime.jsx("img", { src: thumbnailUrl, alt: hotelName, className: "h-full w-full object-cover" })),
+            badge && /* @__PURE__ */ jsxRuntime.jsx(
+              "span",
+              {
+                className: chunkADIDI7AJ_js.cn(
+                  "absolute bottom-1 left-1 rounded-full bg-white/90 px-1.5 py-0.5 text-[9px] font-bold",
+                  badgeTone === "free" ? "text-accent-dark" : "text-secondary-dark"
+                ),
+                children: badge
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-sm font-bold text-primary md:text-[15px]", children: hotelName }),
+        location && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-0.5 inline-flex items-center gap-1.5 text-[12.5px] text-text-secondary md:text-[13px]", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(MapPinIcon, {}),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: location })
+        ] })
+      ] }),
+      dogs.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden md:block", children: /* @__PURE__ */ jsxRuntime.jsx(chunkHB2XJOBZ_js.DogAvatarStack, { dogs, size: 26 }) }),
+      priceLabel && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "shrink-0 text-right md:w-[78px]", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-heading text-[15px] font-bold text-primary md:text-base", children: priceLabel }),
+        nightsLabel && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[11px] text-text-secondary", children: nightsLabel })
+      ] }),
+      href && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "hidden text-sand-dark transition-colors group-hover:text-text-secondary md:block", children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon, {}) })
+    ] });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, children: href ? renderLink ? renderLink({ href, className: rowClass, "aria-label": hotelName, children: body }) : /* @__PURE__ */ jsxRuntime.jsx("a", { href, className: rowClass, "aria-label": hotelName, children: body }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: rowClass, children: body }) });
+  }
+);
+StayListRow.displayName = "StayListRow";
+
+exports.StayListRow = StayListRow;

package/dist/chunk-LO2XNMZO.mjs

@@ -0,0 +1,134 @@
+import { cn } from './chunk-IMKLN273.mjs';
+import * as React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function MapPinIcon({ className }) {
+  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("path", { d: "M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "10", r: "3" })
+  ] });
+}
+function CalendarIcon({ className }) {
+  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("path", { d: "M8 2v4M16 2v4M3 10h18" }),
+    /* @__PURE__ */ jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" })
+  ] });
+}
+function DogIcon({ className }) {
+  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("path", { d: "M10 5.172C10 3.782 8.423 2.679 6.5 3c-2.823.47-4.113 6.006-4 7 .08.703 1.725 1.722 3.656 1 1.261-.472 1.96-1.45 2.344-2.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M14.267 5.172c0-1.39 1.577-2.493 3.5-2.172 2.823.47 4.113 6.006 4 7-.08.703-1.725 1.722-3.656 1-1.261-.472-1.855-1.45-2.239-2.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 14v.5M16 14v.5M11.25 16.25h1.5L12 17l-.75-.75Z" }),
+    /* @__PURE__ */ jsx("path", { d: "M4.42 11.247A13.152 13.152 0 0 0 4 14.556C4 18.728 7.582 21 12 21s8-2.272 8-6.444c0-1.061-.162-2.2-.493-3.309m-9.243-6.082A8.801 8.801 0 0 1 12 5c.78 0 1.5.108 2.161.306" })
+  ] });
+}
+var STATUS_STYLES = {
+  confirmed: "bg-accent/15 text-accent",
+  pending: "bg-amber-100 text-amber-700",
+  processing: "bg-sky-100 text-sky-700"
+};
+var TripHeroCard = React.forwardRef(
+  ({ trip, actions, renderImage, className, ...props }, ref) => {
+    const {
+      hotelName,
+      hotelImage,
+      city,
+      address,
+      checkinLabel,
+      checkoutLabel,
+      nights,
+      countdownLabel,
+      isSoon,
+      statusLabel,
+      statusTone = "confirmed",
+      priceLabel,
+      dogName
+    } = trip;
+    const media = /* @__PURE__ */ jsxs("div", { className: "relative aspect-[16/10] w-full overflow-hidden bg-gradient-to-br from-sand-dark to-sand md:aspect-auto md:h-full md:min-h-[15rem]", children: [
+      hotelImage ? renderImage ? renderImage({
+        src: hotelImage,
+        alt: hotelName,
+        className: "h-full w-full object-cover"
+      }) : /* @__PURE__ */ jsx("img", { src: hotelImage, alt: hotelName, className: "h-full w-full object-cover" }) : /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center justify-center text-text-muted", children: /* @__PURE__ */ jsx(CalendarIcon, { className: "h-10 w-10" }) }),
+      /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 h-24 bg-gradient-to-t from-black/55 to-transparent" }),
+      /* @__PURE__ */ jsxs(
+        "span",
+        {
+          className: cn(
+            "absolute bottom-3 left-3 inline-flex items-center gap-1.5 rounded-full px-3 py-1.5 text-sm font-semibold shadow-sm backdrop-blur-sm",
+            isSoon ? "bg-secondary text-white" : "bg-white/90 text-primary"
+          ),
+          children: [
+            /* @__PURE__ */ jsx(CalendarIcon, { className: "h-3.5 w-3.5" }),
+            countdownLabel
+          ]
+        }
+      )
+    ] });
+    return /* @__PURE__ */ jsx(
+      "section",
+      {
+        ref,
+        "aria-label": "Prochain s\xE9jour",
+        className: cn(
+          "overflow-hidden rounded-2xl border border-sand-dark bg-white shadow-card",
+          className
+        ),
+        ...props,
+        children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col md:flex-row", children: [
+          /* @__PURE__ */ jsx("div", { className: "md:w-2/5 md:shrink-0", children: media }),
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col gap-4 p-5", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+                /* @__PURE__ */ jsx("p", { className: "text-xs font-semibold uppercase tracking-wide text-secondary", children: "Prochain s\xE9jour" }),
+                statusLabel && /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: cn(
+                      "inline-flex items-center rounded-full px-2 py-0.5 text-xs font-semibold",
+                      STATUS_STYLES[statusTone]
+                    ),
+                    children: statusLabel
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx("h2", { className: "mt-1 font-heading text-2xl font-bold text-primary", children: hotelName }),
+              (city || address) && /* @__PURE__ */ jsxs("p", { className: "mt-1 inline-flex items-center gap-1.5 text-sm text-text-secondary", children: [
+                /* @__PURE__ */ jsx(MapPinIcon, { className: "h-4 w-4 shrink-0 text-text-muted" }),
+                /* @__PURE__ */ jsx("span", { className: "truncate", children: [city, address].filter(Boolean).join(" \xB7 ") })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-x-4 gap-y-2 text-sm", children: [
+              /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5 text-primary", children: [
+                /* @__PURE__ */ jsx(CalendarIcon, { className: "h-4 w-4 text-text-muted" }),
+                /* @__PURE__ */ jsxs("span", { className: "font-medium", children: [
+                  checkinLabel,
+                  " \u2192 ",
+                  checkoutLabel
+                ] }),
+                /* @__PURE__ */ jsxs("span", { className: "text-text-muted", children: [
+                  "\xB7 ",
+                  nights,
+                  " nuit",
+                  nights > 1 ? "s" : ""
+                ] })
+              ] }),
+              dogName && /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5 text-text-secondary", children: [
+                /* @__PURE__ */ jsx(DogIcon, { className: "h-4 w-4 text-secondary" }),
+                dogName
+              ] })
+            ] }),
+            priceLabel && /* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-1.5", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-sm text-text-muted", children: "Total" }),
+              /* @__PURE__ */ jsx("span", { className: "font-heading text-xl font-bold text-primary tabular-nums", children: priceLabel })
+            ] }),
+            actions && /* @__PURE__ */ jsx("div", { className: "mt-auto flex flex-wrap gap-2 pt-1", children: actions })
+          ] })
+        ] })
+      }
+    );
+  }
+);
+TripHeroCard.displayName = "TripHeroCard";
+
+export { TripHeroCard };