@dododog/ui 0.1.0

package/dist/chunk-KVVXKSMQ.mjs

@@ -0,0 +1,118 @@
+// src/tokens/colors.ts
+var colors = {
+  primary: {
+    DEFAULT: "#3b4559",
+    light: "#4a5568",
+    dark: "#2d3748"
+  },
+  secondary: {
+    DEFAULT: "#f27c54",
+    light: "#f5a083",
+    dark: "#e05a2d"
+  },
+  accent: {
+    DEFAULT: "#00bfb3",
+    light: "#33ccc2",
+    dark: "#009990"
+  },
+  sand: {
+    DEFAULT: "#f5f0e8",
+    light: "#faf7f2",
+    dark: "#e8e0d4"
+  },
+  text: {
+    primary: "#3b4559",
+    secondary: "#6b7280",
+    muted: "#9ca3af"
+  },
+  white: "#ffffff",
+  black: "#000000"
+};
+
+// src/tokens/typography.ts
+var fontFamily = {
+  heading: ["var(--font-fraunces)", "serif"],
+  body: ["var(--font-inter)", "sans-serif"]
+};
+var fontSize = {
+  h1: ["64px", { lineHeight: "66px", fontWeight: "700" }],
+  h2: ["40px", { lineHeight: "42px", fontWeight: "700" }],
+  h3: ["24px", { lineHeight: "26px", fontWeight: "700" }],
+  body: ["16px", { lineHeight: "24px", fontWeight: "400" }]
+};
+var typography = {
+  fontFamily,
+  fontSize
+};
+
+// src/tokens/shadows.ts
+var boxShadow = {
+  card: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
+  "card-hover": "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
+  sm: "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
+  DEFAULT: "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1)",
+  md: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1)",
+  lg: "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)",
+  xl: "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1)",
+  none: "0 0 #0000"
+};
+
+// src/tokens/animations.ts
+var keyframes = {
+  fadeIn: {
+    "0%": { opacity: "0" },
+    "100%": { opacity: "1" }
+  },
+  slideUp: {
+    "0%": { opacity: "0", transform: "translateY(20px)" },
+    "100%": { opacity: "1", transform: "translateY(0)" }
+  },
+  shimmer: {
+    "0%": { backgroundPosition: "200% 0" },
+    "100%": { backgroundPosition: "-200% 0" }
+  },
+  cardAppear: {
+    "0%": { opacity: "0", transform: "translateY(10px)" },
+    "100%": { opacity: "1", transform: "translateY(0)" }
+  },
+  slideFromLeft: {
+    "0%": { opacity: "0", transform: "translateX(-40px)" },
+    "100%": { opacity: "1", transform: "translateX(0)" }
+  },
+  slideFromRight: {
+    "0%": { opacity: "0", transform: "translateX(40px)" },
+    "100%": { opacity: "1", transform: "translateX(0)" }
+  },
+  megamenuIn: {
+    "0%": { opacity: "0", transform: "translateY(-4px)" },
+    "100%": { opacity: "1", transform: "translateY(0)" }
+  },
+  shake: {
+    "0%, 100%": { transform: "translateX(0)" },
+    "20%, 60%": { transform: "translateX(-6px)" },
+    "40%, 80%": { transform: "translateX(6px)" }
+  },
+  "marquee-down": {
+    "0%": { transform: "translateY(0)" },
+    "100%": { transform: "translateY(-50%)" }
+  },
+  "marquee-up": {
+    "0%": { transform: "translateY(-50%)" },
+    "100%": { transform: "translateY(0)" }
+  }
+};
+var animation = {
+  "fade-in": "fadeIn 0.5s ease-out",
+  "slide-up": "slideUp 0.5s ease-out",
+  "pulse-slow": "pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite",
+  shimmer: "shimmer 1.5s infinite linear",
+  "card-appear": "cardAppear 0.3s ease-out forwards",
+  "slide-from-left": "slideFromLeft 0.25s ease-out",
+  "slide-from-right": "slideFromRight 0.25s ease-out",
+  "megamenu-in": "megamenuIn 0.2s ease-out",
+  shake: "shake 0.4s ease-in-out",
+  "marquee-down": "marquee-down 30s linear infinite",
+  "marquee-up": "marquee-up 30s linear infinite"
+};
+
+export { animation, boxShadow, colors, fontFamily, fontSize, keyframes, typography };

package/dist/chunk-KZSGVMUG.js

@@ -0,0 +1,169 @@
+'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 defaultRenderLink = ({
+  href,
+  className,
+  onClick,
+  children
+}) => /* @__PURE__ */ jsxRuntime.jsx("a", { href, className, onClick, children });
+var MobileMenu = React__namespace.forwardRef(
+  ({
+    items,
+    isOpen,
+    onClose,
+    header,
+    footer,
+    extraLinks,
+    renderLink = defaultRenderLink,
+    className
+  }, ref) => {
+    const [expandedSection, setExpandedSection] = React__namespace.useState(
+      null
+    );
+    React__namespace.useEffect(() => {
+      if (isOpen) {
+        const prev = document.body.style.overflow;
+        document.body.style.overflow = "hidden";
+        return () => {
+          document.body.style.overflow = prev;
+        };
+      }
+    }, [isOpen]);
+    React__namespace.useEffect(() => {
+      if (!isOpen) setExpandedSection(null);
+    }, [isOpen]);
+    if (!isOpen) return null;
+    const toggleSection = (label) => {
+      setExpandedSection(expandedSection === label ? null : label);
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: chunkADIDI7AJ_js.cn("fixed inset-0 z-50 bg-white flex flex-col", className),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-4 h-16 border-b border-gray-100 shrink-0", children: [
+            header || /* @__PURE__ */ jsxRuntime.jsx("div", {}),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                onClick: onClose,
+                className: "p-2 hover:bg-gray-100 rounded-full transition-colors",
+                "aria-label": "Fermer le menu",
+                children: /* @__PURE__ */ jsxRuntime.jsxs(
+                  "svg",
+                  {
+                    xmlns: "http://www.w3.org/2000/svg",
+                    width: "24",
+                    height: "24",
+                    viewBox: "0 0 24 24",
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "2",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round",
+                    className: "text-primary",
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18" }),
+                      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 6 12 12" })
+                    ]
+                  }
+                )
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-y-auto px-4 py-4", children: /* @__PURE__ */ jsxRuntime.jsxs("nav", { className: "flex flex-col gap-1", children: [
+            items.map((item) => /* @__PURE__ */ jsxRuntime.jsx("div", { children: item.type === "link" ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: renderLink({
+              href: item.href || "#",
+              className: "flex items-center justify-between px-4 py-3.5 text-base font-medium text-primary hover:bg-gray-50 rounded-lg transition-colors",
+              onClick: onClose,
+              children: item.label
+            }) }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                "button",
+                {
+                  onClick: () => toggleSection(item.label),
+                  className: "flex items-center justify-between w-full px-4 py-3.5 text-base font-medium text-primary hover:bg-gray-50 rounded-lg transition-colors",
+                  children: [
+                    item.label,
+                    /* @__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(
+                          "text-gray-400 transition-transform duration-200",
+                          expandedSection === item.label && "rotate-180"
+                        ),
+                        children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 9 6 6 6-6" })
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: chunkADIDI7AJ_js.cn(
+                    "overflow-hidden transition-all duration-200",
+                    expandedSection === item.label ? "max-h-[600px] opacity-100" : "max-h-0 opacity-0"
+                  ),
+                  children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pl-4 pb-2", children: item.children?.map((child) => /* @__PURE__ */ jsxRuntime.jsx(React__namespace.Fragment, { children: renderLink({
+                    href: child.href,
+                    className: "block px-4 py-2.5 text-sm text-gray-600 hover:text-primary hover:bg-gray-50 rounded-lg transition-colors",
+                    onClick: onClose,
+                    children: child.label
+                  }) }, child.label)) })
+                }
+              )
+            ] }) }, item.label)),
+            extraLinks && extraLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx("hr", { className: "my-3 border-gray-100" }),
+              extraLinks.map((link) => /* @__PURE__ */ jsxRuntime.jsx(React__namespace.Fragment, { children: renderLink({
+                href: link.href,
+                className: "flex items-center gap-3 px-4 py-3.5 text-base font-medium text-primary hover:bg-gray-50 rounded-lg transition-colors",
+                onClick: onClose,
+                children: link.label
+              }) }, link.label))
+            ] })
+          ] }) }),
+          footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0 px-4 py-4 border-t border-gray-100 bg-white", children: footer })
+        ]
+      }
+    );
+  }
+);
+MobileMenu.displayName = "MobileMenu";
+
+exports.MobileMenu = MobileMenu;

package/dist/chunk-L7OYR6U3.js

@@ -0,0 +1,75 @@
+'use strict';
+
+var chunkADIDI7AJ_js = require('./chunk-ADIDI7AJ.js');
+var React = require('react');
+var classVarianceAuthority = require('class-variance-authority');
+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 textareaVariants = classVarianceAuthority.cva(
+  "w-full border bg-white transition-all placeholder:text-text-muted text-primary resize-vertical",
+  {
+    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 Textarea = React__namespace.forwardRef(
+  ({ className, size, variant, label, error, required, rows = 4, ...props }, ref) => {
+    const resolvedVariant = error ? "error" : variant ?? "default";
+    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: " *" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "textarea",
+        {
+          ref,
+          rows,
+          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 })
+    ] });
+  }
+);
+Textarea.displayName = "Textarea";
+
+exports.Textarea = Textarea;
+exports.textareaVariants = textareaVariants;

package/dist/chunk-LFIZX2S6.mjs

@@ -0,0 +1,85 @@
+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 bannerVariants = cva(
+  "flex items-start gap-3 p-4 rounded-xl border",
+  {
+    variants: {
+      variant: {
+        info: "bg-blue-50 border-blue-200 text-blue-800",
+        success: "bg-green-50 border-green-200 text-green-800",
+        warning: "bg-amber-50 border-amber-200 text-amber-800",
+        error: "bg-red-50 border-red-200 text-red-800"
+      }
+    },
+    defaultVariants: {
+      variant: "info"
+    }
+  }
+);
+var iconMap = {
+  info: /* @__PURE__ */ 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-blue-500 flex-shrink-0 mt-0.5", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 16v-4" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 8h.01" })
+  ] }),
+  success: /* @__PURE__ */ 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-green-500 flex-shrink-0 mt-0.5", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("path", { d: "M22 11.08V12a10 10 0 1 1-5.93-9.14" }),
+    /* @__PURE__ */ jsx("path", { d: "m9 11 3 3L22 4" })
+  ] }),
+  warning: /* @__PURE__ */ 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-amber-500 flex-shrink-0 mt-0.5", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 9v4" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 17h.01" })
+  ] }),
+  error: /* @__PURE__ */ 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-red-500 flex-shrink-0 mt-0.5", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx("path", { d: "m15 9-6 6" }),
+    /* @__PURE__ */ jsx("path", { d: "m9 9 6 6" })
+  ] })
+};
+var Banner = React.forwardRef(
+  ({ variant = "info", title, icon, onDismiss, action, className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        role: "alert",
+        className: cn(bannerVariants({ variant }), className),
+        ...props,
+        children: [
+          icon || iconMap[variant || "info"],
+          /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+            title && /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold mb-0.5", children: title }),
+            children && /* @__PURE__ */ jsx("div", { className: "text-sm opacity-80", children }),
+            action && /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: action.onClick,
+                className: "text-sm font-semibold underline underline-offset-2 mt-1.5 hover:opacity-70 transition-opacity",
+                children: action.label
+              }
+            )
+          ] }),
+          onDismiss && /* @__PURE__ */ jsx(
+            "button",
+            {
+              onClick: onDismiss,
+              className: "flex-shrink-0 p-1 rounded-lg hover:bg-black/5 transition-colors",
+              "aria-label": "Dismiss",
+              children: /* @__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", "aria-hidden": "true", children: [
+                /* @__PURE__ */ jsx("path", { d: "M18 6 6 18" }),
+                /* @__PURE__ */ jsx("path", { d: "m6 6 12 12" })
+              ] })
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Banner.displayName = "Banner";
+
+export { Banner, bannerVariants };

package/dist/chunk-MCF3EQTV.js

@@ -0,0 +1,135 @@
+'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 Accordion = React__namespace.forwardRef(
+  ({ items, defaultOpenIndex = null, defaultOpenIndexes, allowMultiple = false, className }, ref) => {
+    const [openIndexes, setOpenIndexes] = React__namespace.useState(() => {
+      if (defaultOpenIndexes && defaultOpenIndexes.length > 0) {
+        return new Set(defaultOpenIndexes);
+      }
+      const initial = /* @__PURE__ */ new Set();
+      if (defaultOpenIndex !== null && defaultOpenIndex >= 0) {
+        initial.add(defaultOpenIndex);
+      }
+      return initial;
+    });
+    const toggle = (index) => {
+      setOpenIndexes((prev) => {
+        const next = new Set(allowMultiple ? prev : []);
+        if (prev.has(index)) {
+          next.delete(index);
+        } else {
+          next.add(index);
+        }
+        return next;
+      });
+    };
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: chunkADIDI7AJ_js.cn(
+          "rounded-2xl border border-gray-200 divide-y divide-gray-200",
+          className
+        ),
+        children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          AccordionItem,
+          {
+            title: item.title,
+            isOpen: openIndexes.has(index),
+            onToggle: () => toggle(index),
+            children: item.content
+          },
+          item.key
+        ))
+      }
+    );
+  }
+);
+Accordion.displayName = "Accordion";
+function AccordionItem({ 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: chunkADIDI7AJ_js.cn(
+        "transition-colors duration-300",
+        isOpen && "bg-gray-50/50"
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            onClick: onToggle,
+            "aria-expanded": isOpen,
+            className: "w-full flex items-center justify-between py-5 px-5 text-left group",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "span",
+                {
+                  className: chunkADIDI7AJ_js.cn(
+                    "text-base font-medium pr-4 transition-colors duration-300",
+                    isOpen ? "text-secondary" : "text-primary group-hover:text-secondary"
+                  ),
+                  children: title
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: chunkADIDI7AJ_js.cn(
+                    "w-7 h-7 rounded-full flex items-center justify-center shrink-0 transition-all duration-300",
+                    isOpen ? "bg-secondary text-white" : "bg-gray-100 text-gray-600 group-hover:bg-secondary/10 group-hover:text-secondary"
+                  ),
+                  children: isOpen ? /* @__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", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 12h14" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("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", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 12h14" }),
+                    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 5v14" })
+                  ] })
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            style: { height },
+            className: "overflow-hidden transition-all duration-500 ease-out",
+            children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref: contentRef, className: "pb-5 px-5 pr-12", children })
+          }
+        )
+      ]
+    }
+  );
+}
+
+exports.Accordion = Accordion;

package/dist/chunk-MKOKWME3.js

@@ -0,0 +1,76 @@
+'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 ImageGallery = React__namespace.forwardRef(
+  ({ images, className, maxVisible = 5, onImageClick }, ref) => {
+    if (images.length === 0) return null;
+    const visible = images.slice(0, maxVisible);
+    const remaining = images.length - maxVisible;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: chunkADIDI7AJ_js.cn(
+          "grid gap-2 rounded-xl overflow-hidden",
+          visible.length === 1 && "grid-cols-1",
+          visible.length === 2 && "grid-cols-2",
+          visible.length >= 3 && "grid-cols-4 grid-rows-2",
+          className
+        ),
+        children: visible.map((img, i) => /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            onClick: () => onImageClick?.(i),
+            className: chunkADIDI7AJ_js.cn(
+              "relative overflow-hidden group",
+              visible.length >= 3 && i === 0 && "col-span-2 row-span-2",
+              i === 0 ? "aspect-[4/3]" : "aspect-[3/2]"
+            ),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "img",
+                {
+                  src: img.src,
+                  alt: img.alt,
+                  className: "absolute inset-0 w-full h-full object-cover transition-transform duration-300 group-hover:scale-105",
+                  loading: i === 0 ? "eager" : "lazy"
+                }
+              ),
+              i === maxVisible - 1 && remaining > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-black/40 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-white text-xl font-bold", children: [
+                "+",
+                remaining
+              ] }) })
+            ]
+          },
+          i
+        ))
+      }
+    );
+  }
+);
+ImageGallery.displayName = "ImageGallery";
+
+exports.ImageGallery = ImageGallery;