@dododog/ui 0.1.0

package/dist/chunk-MPL35D5G.mjs

@@ -0,0 +1,44 @@
+import { cn } from './chunk-IMKLN273.mjs';
+import * as React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var Sidebar = React.forwardRef(
+  ({ items, header, footer, className, onNavigate }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      "aside",
+      {
+        ref,
+        className: cn(
+          "flex h-full w-60 flex-col border-r border-sand-dark bg-white",
+          className
+        ),
+        "aria-label": "Menu lat\xE9ral",
+        children: [
+          header && /* @__PURE__ */ jsx("div", { className: "flex h-16 items-center px-6", children: header }),
+          /* @__PURE__ */ jsx("nav", { "aria-label": "Navigation", className: "flex-1", children: /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-1 px-3 py-2", children: items.map((item) => {
+            const Tag = onNavigate ? "button" : "a";
+            return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+              Tag,
+              {
+                ...onNavigate ? { onClick: () => onNavigate(item.href), type: "button" } : { href: item.href },
+                "aria-current": item.isActive ? "page" : void 0,
+                className: cn(
+                  "flex min-h-[44px] w-full items-center gap-3 rounded-xl px-3 transition-colors duration-300 ease-in-out",
+                  item.isActive ? "border-l-[3px] border-secondary bg-sand text-primary font-medium" : "border-l-[3px] border-transparent text-text-secondary hover:bg-sand-light"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: "shrink-0", children: item.icon }),
+                  /* @__PURE__ */ jsx("span", { children: item.label })
+                ]
+              }
+            ) }, item.key);
+          }) }) }),
+          footer && /* @__PURE__ */ jsx("div", { className: "px-3 pb-4", children: footer })
+        ]
+      }
+    );
+  }
+);
+Sidebar.displayName = "Sidebar";
+
+export { Sidebar };

package/dist/chunk-MY6BYO5F.js

@@ -0,0 +1,41 @@
+'use strict';
+
+var chunkADIDI7AJ_js = require('./chunk-ADIDI7AJ.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function CardList({
+  items,
+  renderItem,
+  keyExtractor,
+  pageSize,
+  staggerDelay = 50,
+  loading = false,
+  loadingSkeleton,
+  hasMore = false,
+  loadingMore = false,
+  loadMoreRef,
+  loadMoreSkeleton,
+  gap = "gap-4",
+  className
+}) {
+  if (loading) {
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingSkeleton });
+  }
+  const effectivePageSize = pageSize ?? items.length;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkADIDI7AJ_js.cn("flex flex-col", gap, className), children: [
+    items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "animate-card-appear",
+        style: {
+          animationDelay: `${index % effectivePageSize * staggerDelay}ms`
+        },
+        children: renderItem(item, index)
+      },
+      keyExtractor(item)
+    )),
+    hasMore && items.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { ref: loadMoreRef, children: loadingMore && loadMoreSkeleton })
+  ] });
+}
+
+exports.CardList = CardList;

package/dist/chunk-N2Q4Z2FU.js

@@ -0,0 +1,97 @@
+'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 FilterPill = React__namespace.forwardRef(
+  ({ label, isActive = false, count, onClear, children, className }, ref) => {
+    const [isOpen, setIsOpen] = React__namespace.useState(false);
+    const containerRef = React__namespace.useRef(null);
+    React__namespace.useEffect(() => {
+      const handleClickOutside = (e) => {
+        if (containerRef.current && !containerRef.current.contains(e.target)) {
+          setIsOpen(false);
+        }
+      };
+      document.addEventListener("mousedown", handleClickOutside);
+      return () => document.removeEventListener("mousedown", handleClickOutside);
+    }, []);
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: chunkADIDI7AJ_js.cn("relative inline-block", className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: containerRef, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: () => setIsOpen(!isOpen),
+          className: chunkADIDI7AJ_js.cn(
+            "inline-flex items-center gap-1.5 px-3 py-2 text-sm font-medium rounded-full border transition-all",
+            isActive ? "bg-primary text-white border-primary" : "bg-white text-gray-700 border-gray-200 hover:border-gray-300"
+          ),
+          children: [
+            label,
+            count !== void 0 && count > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: chunkADIDI7AJ_js.cn(
+              "inline-flex items-center justify-center w-5 h-5 text-xs rounded-full",
+              isActive ? "bg-white/20 text-white" : "bg-gray-100 text-gray-600"
+            ), children: count }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "svg",
+              {
+                xmlns: "http://www.w3.org/2000/svg",
+                width: "14",
+                height: "14",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                className: chunkADIDI7AJ_js.cn("transition-transform", isOpen && "rotate-180"),
+                children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 9 6 6 6-6" })
+              }
+            )
+          ]
+        }
+      ),
+      isActive && onClear && /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: (e) => {
+            e.stopPropagation();
+            onClear();
+          },
+          className: "absolute -top-1 -right-1 w-4 h-4 bg-gray-500 text-white rounded-full flex items-center justify-center hover:bg-gray-700 transition-colors",
+          "aria-label": "Effacer le filtre",
+          children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 6 12 12" })
+          ] })
+        }
+      ),
+      isOpen && children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute z-50 mt-2 left-0 min-w-[200px] bg-white border border-gray-200 rounded-xl shadow-lg py-2", children })
+    ] }) });
+  }
+);
+FilterPill.displayName = "FilterPill";
+
+exports.FilterPill = FilterPill;

package/dist/chunk-N3JU7JS7.js

@@ -0,0 +1,86 @@
+'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 repeatToFill(arr, minCount) {
+  if (arr.length === 0) return arr;
+  const repeats = Math.ceil(minCount / arr.length);
+  const result = [];
+  for (let r = 0; r < repeats; r++) {
+    result.push(...arr);
+  }
+  return result;
+}
+var VerticalMarquee = React__namespace.forwardRef(
+  ({ images, className, overlay, minItemsPerColumn = 6 }, ref) => {
+    const leftCol = images.filter((_, i) => i % 2 === 0);
+    const rightCol = images.filter((_, i) => i % 2 === 1);
+    const leftSet = repeatToFill(leftCol, minItemsPerColumn);
+    const rightSet = repeatToFill(rightCol, minItemsPerColumn);
+    const renderColumn = (col) => col.map((img, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "relative aspect-[3/4] rounded-2xl overflow-hidden flex-shrink-0",
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          "img",
+          {
+            src: img.src,
+            alt: img.alt,
+            className: "absolute inset-0 w-full h-full object-cover",
+            loading: "lazy"
+          }
+        )
+      },
+      i
+    ));
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: chunkADIDI7AJ_js.cn("relative overflow-hidden", className),
+        style: {
+          maskImage: "linear-gradient(to bottom, transparent, black 8%, black 92%, transparent)",
+          WebkitMaskImage: "linear-gradient(to bottom, transparent, black 8%, black 92%, transparent)"
+        },
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4 h-full px-4 md:px-8 lg:px-12", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "animate-marquee-down flex flex-col gap-4 [&:hover]:![animation-play-state:paused]", children: [
+              renderColumn(leftSet),
+              renderColumn(leftSet)
+            ] }) }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "animate-marquee-up flex flex-col gap-4 [&:hover]:![animation-play-state:paused]", children: [
+              renderColumn(rightSet),
+              renderColumn(rightSet)
+            ] }) })
+          ] }),
+          overlay && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pointer-events-auto", children: overlay }) })
+        ]
+      }
+    );
+  }
+);
+VerticalMarquee.displayName = "VerticalMarquee";
+
+exports.VerticalMarquee = VerticalMarquee;

package/dist/chunk-NBDPT3XQ.js

@@ -0,0 +1,121 @@
+'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 Modal = React__namespace.forwardRef(
+  ({ isOpen, onClose, children, title, className }, ref) => {
+    const contentRef = React__namespace.useRef(null);
+    React__namespace.useEffect(() => {
+      if (!isOpen) return;
+      const handleKeyDown = (e) => {
+        if (e.key === "Escape") onClose();
+      };
+      document.addEventListener("keydown", handleKeyDown);
+      return () => document.removeEventListener("keydown", handleKeyDown);
+    }, [isOpen, onClose]);
+    React__namespace.useEffect(() => {
+      if (!isOpen) return;
+      const prev = document.body.style.overflow;
+      document.body.style.overflow = "hidden";
+      return () => {
+        document.body.style.overflow = prev;
+      };
+    }, [isOpen]);
+    React__namespace.useEffect(() => {
+      if (!isOpen || !contentRef.current) return;
+      const focusable = contentRef.current.querySelectorAll(
+        'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
+      );
+      if (focusable.length > 0) focusable[0].focus();
+    }, [isOpen]);
+    if (!isOpen) return null;
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: "fixed inset-0 z-50 flex items-center justify-center p-4",
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-label": title,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: "absolute inset-0 bg-black/50",
+              onClick: onClose,
+              "aria-hidden": "true"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              ref: contentRef,
+              className: chunkADIDI7AJ_js.cn(
+                "relative bg-white rounded-2xl shadow-xl max-w-md w-full max-h-[90vh] overflow-auto",
+                className
+              ),
+              children: [
+                title && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-6 pt-6 pb-2", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-heading font-semibold text-primary", children: title }),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: onClose,
+                      className: "text-text-muted hover:text-primary transition-colors",
+                      "aria-label": "Fermer",
+                      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",
+                          children: [
+                            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18" }),
+                            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 6 12 12" })
+                          ]
+                        }
+                      )
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkADIDI7AJ_js.cn(title ? "px-6 pb-6" : "p-6"), children })
+              ]
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Modal.displayName = "Modal";
+
+exports.Modal = Modal;

package/dist/chunk-NCSFXSOZ.mjs

@@ -0,0 +1,69 @@
+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 spinnerVariants = cva("animate-spin text-current", {
+  variants: {
+    size: {
+      sm: "w-4 h-4",
+      md: "w-6 h-6",
+      lg: "w-8 h-8",
+      xl: "w-12 h-12"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var Spinner = React.forwardRef(
+  ({ size, label, className, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        role: "status",
+        className: cn("inline-flex items-center gap-2", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs(
+            "svg",
+            {
+              className: cn(spinnerVariants({ size })),
+              xmlns: "http://www.w3.org/2000/svg",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              "aria-hidden": "true",
+              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 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+                  }
+                )
+              ]
+            }
+          ),
+          label && /* @__PURE__ */ jsx("span", { className: "text-sm text-text-secondary", children: label }),
+          /* @__PURE__ */ jsx("span", { className: "sr-only", children: label || "Loading..." })
+        ]
+      }
+    );
+  }
+);
+Spinner.displayName = "Spinner";
+
+export { Spinner, spinnerVariants };

package/dist/chunk-NCU5PY34.js

@@ -0,0 +1,90 @@
+'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 Skeleton = React__namespace.forwardRef(
+  ({ className, shimmer = true, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: chunkADIDI7AJ_js.cn(
+        "rounded-md bg-[#E8E3DB]",
+        shimmer && "animate-shimmer bg-gradient-to-r from-[#E8E3DB] via-[#F5F0E8] to-[#E8E3DB] bg-[length:200%_100%]",
+        "motion-reduce:animate-none",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Skeleton.displayName = "Skeleton";
+var SkeletonText = React__namespace.forwardRef(
+  ({ lines = 3, className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: chunkADIDI7AJ_js.cn("space-y-2", className), ...props, children: Array.from({ length: lines }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(
+    Skeleton,
+    {
+      className: chunkADIDI7AJ_js.cn("h-4", i === lines - 1 ? "w-3/4" : "w-full")
+    },
+    i
+  )) })
+);
+SkeletonText.displayName = "SkeletonText";
+var circleSizes = {
+  sm: "w-8 h-8",
+  md: "w-12 h-12",
+  lg: "w-16 h-16",
+  xl: "w-24 h-24"
+};
+var SkeletonCircle = React__namespace.forwardRef(
+  ({ size = "md", className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    Skeleton,
+    {
+      ref,
+      className: chunkADIDI7AJ_js.cn("rounded-full", circleSizes[size], className),
+      ...props
+    }
+  )
+);
+SkeletonCircle.displayName = "SkeletonCircle";
+var aspectRatios = {
+  video: "aspect-video",
+  square: "aspect-square",
+  wide: "aspect-[16/10]"
+};
+var SkeletonImage = React__namespace.forwardRef(
+  ({ aspectRatio = "video", className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    Skeleton,
+    {
+      ref,
+      className: chunkADIDI7AJ_js.cn("w-full", aspectRatios[aspectRatio], className),
+      ...props
+    }
+  )
+);
+SkeletonImage.displayName = "SkeletonImage";
+
+exports.Skeleton = Skeleton;
+exports.SkeletonCircle = SkeletonCircle;
+exports.SkeletonImage = SkeletonImage;
+exports.SkeletonText = SkeletonText;