trepur_components 2.3.26 → 2.3.28

package/lib/components/CarouselThumbnail/index.d.ts

@@ -3,7 +3,7 @@ import { HTMLAttributes } from 'react';
 
 export interface CarouselThumbnailContextProps {
     slideWrapperClassName?: string;
-    breakpoints?: Record<string, Omit<KeenSliderOptions<{}, {}, KeenSliderHooks>, 'breakpoints'>>;
+    breakpoints?: Record<string, Omit<KeenSliderOptions<object, object, KeenSliderHooks>, 'breakpoints'>>;
     defaultAnimation?: {
         duration?: number;
         easing?: (t: number) => number;
@@ -24,20 +24,20 @@ export interface CarouselThumbnailContextProps {
     rubberband?: boolean;
     slides?: any[];
     vertical?: boolean;
-    animationStarted?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
-    animationStopped?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
-    animationEnded?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
-    created?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
-    destroyed?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
-    detailsChanged?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
-    dragged?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
-    dragStarted?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
-    dragChecked?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
-    dragEnded?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
-    beforeOptionsChanged?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
-    optionsChanged?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
+    animationStarted?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
+    animationStopped?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
+    animationEnded?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
+    created?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
+    destroyed?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
+    detailsChanged?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
+    dragged?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
+    dragStarted?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
+    dragChecked?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
+    dragEnded?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
+    beforeOptionsChanged?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
+    optionsChanged?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
     slideChanged?: boolean;
-    updated?: (slider: KeenSliderInstance<{}, {}, KeenSliderHooks>) => void;
+    updated?: (slider: KeenSliderInstance<object, object, KeenSliderHooks>) => void;
     spacing?: number;
     number?: number;
     origin?: number | 'auto' | 'center';

package/lib/components/Collapsible/Collapsible.stories.d.ts

@@ -14,40 +14,6 @@ declare const meta: {
         Text: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLParagraphElement> & import('react').RefAttributes<HTMLParagraphElement>>;
     };
     parameters: {};
-    argTypes: {
-        id: {
-            description: string;
-            control: {
-                type: string;
-                default: boolean;
-            };
-            table: {
-                category: string;
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: string;
-                };
-            };
-        };
-        className: {
-            description: string;
-            control: {
-                type: string;
-                default: boolean;
-            };
-            table: {
-                category: string;
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: string;
-                };
-            };
-        };
-    };
     args: {
         children: import("react/jsx-runtime").JSX.Element[];
     };

package/lib/components/Collapsible/index.js

@@ -1,60 +1,63 @@
-import { jsx as a, jsxs as g } from "react/jsx-runtime";
-import { createContext as w, forwardRef as o, useState as H, useMemo as T, useContext as p } from "react";
-import { Icon as I } from "../Icon/index.js";
-import { Image as S } from "../Image/index.js";
-import { faChevronDown as j, faChevronUp as L } from "@fortawesome/fontawesome-free-solid";
-import k from "clsx";
-const n = w(null), c = o(({ id: e, className: l, children: t, loading: s, ...i }, v) => {
-  const [r, m] = H(!1), y = T(
+import { jsx as a, jsxs as w } from "react/jsx-runtime";
+import { createContext as H, forwardRef as s, useState as T, useMemo as I, useContext as p } from "react";
+import { Icon as S } from "../Icon/index.js";
+import { Image as j } from "../Image/index.js";
+import { faChevronDown as L, faChevronUp as k } from "@fortawesome/fontawesome-free-solid";
+import d from "clsx";
+const n = H(null), c = s(({ id: e, className: l, children: t, loading: o, ...i }, y) => {
+  const [r, m] = T(!1), g = I(
     () => ({
-      loading: s,
+      loading: o,
       expanded: r,
       setExpanded: m
     }),
-    [s, r, m]
+    [o, r, m]
   );
-  return /* @__PURE__ */ a(n.Provider, { value: y, children: /* @__PURE__ */ a(
+  return /* @__PURE__ */ a(n.Provider, { value: g, children: /* @__PURE__ */ a(
     "div",
     {
       id: e,
-      className: "w-full rounded-2xl bg-white hover:cursor-pointer",
-      ref: v,
+      className: d(
+        "w-full rounded-2xl bg-white hover:cursor-pointer",
+        l
+      ),
+      ref: y,
       ...i,
       children: t
     }
   ) });
-}), d = o(({ children: e, ...l }, t) => {
-  const { expanded: s, setExpanded: i } = p(n) || {};
-  return /* @__PURE__ */ g(
+}), x = s(({ children: e, ...l }, t) => {
+  const { expanded: o, setExpanded: i } = p(n) || {};
+  return /* @__PURE__ */ w(
     "div",
     {
       className: "flex h-24 pr-4 sm:pr-8",
-      onClick: () => i == null ? void 0 : i(!s),
+      onClick: () => i == null ? void 0 : i(!o),
       ref: t,
       ...l,
       children: [
         e,
-        /* @__PURE__ */ a("div", { className: "my-auto flex-none", children: /* @__PURE__ */ a(I, { icon: s ? j : L }) })
+        /* @__PURE__ */ a("div", { className: "my-auto flex-none", children: /* @__PURE__ */ a(S, { icon: o ? L : k }) })
       ]
     }
   );
-}), x = o(({ children: e, ...l }, t) => /* @__PURE__ */ a("div", { className: "mx-4 my-auto grid w-full", ref: t, ...l, children: e })), C = o(({ children: e, src: l, ...t }, s) => /* @__PURE__ */ a("div", { className: "aspect-square flex-none p-4", children: /* @__PURE__ */ a(S, { src: l, className: "h-full rounded-2xl", ...t }) })), b = o(({ ...e }, l) => /* @__PURE__ */ a(
+}), C = s(({ children: e, ...l }, t) => /* @__PURE__ */ a("div", { className: "mx-4 my-auto grid w-full", ref: t, ...l, children: e })), b = s(({ src: e, ...l }, t) => /* @__PURE__ */ a("div", { ref: t, className: "aspect-square flex-none p-4", children: /* @__PURE__ */ a(j, { src: e, className: "h-full rounded-2xl", ...l }) })), u = s(({ ...e }, l) => /* @__PURE__ */ a(
   "p",
   {
     className: "text-xxs text-light-grey truncate md:text-xs",
     ref: l,
     ...e
   }
-)), u = o(({ ...e }, l) => /* @__PURE__ */ a("p", { className: "md:text-md truncate text-sm", ref: l, ...e })), N = o(({ ...e }, l) => /* @__PURE__ */ a("p", { className: "truncate text-xs md:text-sm", ref: l, ...e })), f = o(({ children: e, ...l }, t) => {
-  const { expanded: s } = p(n) || {};
+)), N = s(({ ...e }, l) => /* @__PURE__ */ a("p", { className: "md:text-md truncate text-sm", ref: l, ...e })), f = s(({ ...e }, l) => /* @__PURE__ */ a("p", { className: "truncate text-xs md:text-sm", ref: l, ...e })), h = s(({ children: e, ...l }, t) => {
+  const { expanded: o } = p(n) || {};
   return /* @__PURE__ */ a(
     "div",
     {
-      className: k(
+      className: d(
         "w-auto overflow-scroll px-4 transition-max-height duration-300",
         {
-          "max-h-32": s,
-          "max-h-0": !s
+          "max-h-32": o,
+          "max-h-0": !o
         }
       ),
       ref: t,
@@ -62,25 +65,25 @@ const n = w(null), c = o(({ id: e, className: l, children: t, loading: s, ...i }
       children: e
     }
   );
-}), h = o(({ ...e }, l) => /* @__PURE__ */ a("p", { className: "text-xs md:text-sm", ref: l, ...e }));
+}), v = s(({ ...e }, l) => /* @__PURE__ */ a("p", { className: "text-xs md:text-sm", ref: l, ...e }));
 c.displayName = "Collapsible";
-d.displayName = "Collapsible.Header";
-f.displayName = "Collapsible.Content";
-C.displayName = "Collapsible.Image";
-b.displayName = "Collapsible.Label";
-u.displayName = "Collapsible.Title";
-N.displayName = "Collapsible.Subtitle";
-x.displayName = "Collapsible.HeaderContent";
-h.displayName = "Collapsible.Text";
+x.displayName = "Collapsible.Header";
+h.displayName = "Collapsible.Content";
+b.displayName = "Collapsible.Image";
+u.displayName = "Collapsible.Label";
+N.displayName = "Collapsible.Title";
+f.displayName = "Collapsible.Subtitle";
+C.displayName = "Collapsible.HeaderContent";
+v.displayName = "Collapsible.Text";
 const U = Object.assign(c, {
-  Header: d,
-  HeaderContent: x,
-  Image: C,
-  Label: b,
-  Title: u,
-  Subtitle: N,
-  Content: f,
-  Text: h
+  Header: x,
+  HeaderContent: C,
+  Image: b,
+  Label: u,
+  Title: N,
+  Subtitle: f,
+  Content: h,
+  Text: v
 });
 export {
   U as Collapsible

package/lib/components/DetailUpdater/DetailUpdater.stories.d.ts

@@ -3,15 +3,13 @@ import { DetailUpdater } from './';
 
 declare const meta: {
     title: string;
-    component: ({ id, className, title, description, expandText, collapseText, ctaText, onClick, onChange, children, onSubmit, onCancel, value, }: import('./').DetailUpdatesProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ id, className, title, description, expandText, collapseText, ctaText, children, onSubmit, onCancel, value }: import('./').DetailUpdatesProps) => import("react/jsx-runtime").JSX.Element;
     args: {
         title: string;
         description: string;
         expandText: string;
         collapseText: string;
         ctaText: string;
-        onClick: (fieldValues: any) => void;
-        onChange: (value: any) => void;
         children: import("react/jsx-runtime").JSX.Element;
     };
 };

package/lib/components/DetailUpdater/index.d.ts

@@ -1,5 +1,4 @@
-import { default as React } from 'react';
-
+/// <reference types="react" />
 export interface DetailUpdatesProps {
     id?: string;
     className?: string;
@@ -8,11 +7,9 @@ export interface DetailUpdatesProps {
     expandText: string;
     collapseText: string;
     ctaText: string;
-    onClick?: (fieldValues: any) => void;
-    onChange?: (fieldValues: any) => void;
     children: React.ReactNode;
     onSubmit?: () => void;
     onCancel?: () => void;
     value?: string;
 }
-export declare const DetailUpdater: ({ id, className, title, description, expandText, collapseText, ctaText, onClick, onChange, children, onSubmit, onCancel, value, }: DetailUpdatesProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DetailUpdater: ({ id, className, title, description, expandText, collapseText, ctaText, children, onSubmit, onCancel, value }: DetailUpdatesProps) => import("react/jsx-runtime").JSX.Element;

package/lib/components/DetailUpdater/index.js

@@ -1,27 +1,24 @@
-import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
 import { useState as x } from "react";
 import { Button as N } from "../Button/index.js";
 import { Card as g } from "../Card/index.js";
-import "../../node_modules/keen-slider/keen-slider.min.css.js";
-const D = ({
+const j = ({
   id: n,
   className: c,
   title: d,
-  description: o,
-  expandText: m,
+  description: m,
+  expandText: o,
   collapseText: p,
   ctaText: f,
-  onClick: k,
-  onChange: u,
   children: h,
-  onSubmit: s,
+  onSubmit: i,
   onCancel: l,
   value: t
 }) => {
   const [a, r] = x(!1);
-  return /* @__PURE__ */ i(g, { id: n, className: c, children: [
-    !a && /* @__PURE__ */ i("div", { className: "mx-4 py-6", children: [
-      /* @__PURE__ */ i("div", { className: "flex justify-between", children: [
+  return /* @__PURE__ */ s(g, { id: n, className: c, children: [
+    !a && /* @__PURE__ */ s("div", { className: "mx-4 py-6", children: [
+      /* @__PURE__ */ s("div", { className: "flex justify-between", children: [
         /* @__PURE__ */ e("p", { className: "font-semiBold text-ink", children: d }),
         /* @__PURE__ */ e(
           "p",
@@ -30,14 +27,14 @@ const D = ({
             onClick: () => {
               r(!0);
             },
-            children: m
+            children: o
           }
         )
       ] }),
       /* @__PURE__ */ e("p", { className: "text-ink", children: t !== void 0 ? t : "-" })
     ] }),
-    a && /* @__PURE__ */ i("div", { className: "mx-4 py-6", children: [
-      /* @__PURE__ */ i("div", { className: "flex justify-between", children: [
+    a && /* @__PURE__ */ s("div", { className: "mx-4 py-6", children: [
+      /* @__PURE__ */ s("div", { className: "flex justify-between", children: [
         /* @__PURE__ */ e("p", { className: "font-semiBold text-ink", children: d }),
         /* @__PURE__ */ e(
           "p",
@@ -50,14 +47,14 @@ const D = ({
           }
         )
       ] }),
-      /* @__PURE__ */ e("p", { className: "text-light-grey", children: o }),
+      /* @__PURE__ */ e("p", { className: "text-light-grey", children: m }),
       /* @__PURE__ */ e("div", { className: "grid w-full grid-cols-1 gap-0 py-4 md:grid-cols-2 md:gap-4 lg:w-2/3", children: h }),
       /* @__PURE__ */ e(N, { variant: "secondary", onClick: () => {
-        s == null || s(), r(!1);
+        i == null || i(), r(!1);
       }, children: f })
     ] })
   ] });
 };
 export {
-  D as DetailUpdater
+  j as DetailUpdater
 };

package/lib/components/Dialog/Dialog.stories.d.ts

@@ -2,7 +2,7 @@ import { default as React } from 'react';
 
 declare const meta: {
     title: string;
-    component: ({ id, className, title, paragraph, dismissText, onDismissClick, primaryCta, secondaryCta, imageUrl, }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
+    component: () => import("react/jsx-runtime").JSX.Element;
     args: {
         title: string;
         paragraph: string;

package/lib/components/Dialog/index.d.ts

@@ -1,6 +1,6 @@
 import { ButtonProps } from '../Button';
 
-export interface Props extends Partial<Pick<HTMLElement, 'className' | 'id'>> {
+export interface DialogProps extends Partial<Pick<HTMLElement, 'className' | 'id'>> {
     title: string;
     paragraph: string;
     dismissText: string;
@@ -9,4 +9,4 @@ export interface Props extends Partial<Pick<HTMLElement, 'className' | 'id'>> {
     secondaryCta?: ButtonProps;
     imageUrl?: string;
 }
-export declare const Dialog: ({ id, className, title, paragraph, dismissText, onDismissClick, primaryCta, secondaryCta, imageUrl, }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const Dialog: () => import("react/jsx-runtime").JSX.Element;

package/lib/components/Dialog/index.js

@@ -1,16 +1,6 @@
-import { jsx as a } from "react/jsx-runtime";
-import { Card as r } from "../Card/index.js";
-const n = ({
-  id: s,
-  className: i,
-  title: m,
-  paragraph: t,
-  dismissText: o,
-  onDismissClick: e,
-  primaryCta: p,
-  secondaryCta: l,
-  imageUrl: c
-}) => /* @__PURE__ */ a(r, { className: "max-w-[600px]" });
+import { jsx as r } from "react/jsx-runtime";
+import { Card as o } from "../Card/index.js";
+const t = () => /* @__PURE__ */ r(o, { className: "max-w-[600px]" });
 export {
-  n as Dialog
+  t as Dialog
 };

package/lib/components/Dropdown/index.js

@@ -1,66 +1,66 @@
-import { jsx as r, jsxs as u } from "react/jsx-runtime";
-import { createContext as f, forwardRef as a, useState as D, useRef as b, useMemo as x, useContext as l } from "react";
-import { Button as d } from "../Button/index.js";
+import { jsx as n, jsxs as w } from "react/jsx-runtime";
+import { createContext as f, forwardRef as r, useState as D, useRef as b, useMemo as x, useContext as a } from "react";
+import { Button as l } from "../Button/index.js";
 import { faChevronDown as y } from "@fortawesome/fontawesome-free-solid";
-import { useClickOutside as C } from "./utils.js";
-const i = f(null), c = a(({ children: e }) => {
-  const [n, t] = D(!1), s = b(null), o = x(
+import { useClickOutside as v } from "./utils.js";
+const s = f(null), d = r(({ children: t }) => {
+  const [o, e] = D(!1), i = b(null), u = x(
     () => ({
-      showDropdown: n,
-      setShowDropdown: t
+      showDropdown: o,
+      setShowDropdown: e
     }),
-    [n, t]
+    [o, e]
   );
-  return C(s, () => {
-    t(!1);
-  }), /* @__PURE__ */ r(i.Provider, { value: o, children: /* @__PURE__ */ r("div", { ref: s, className: "relative inline-block text-left", children: e }) });
-}), m = a(({ children: e }) => {
-  const { showDropdown: n, setShowDropdown: t } = l(i) || {};
-  return /* @__PURE__ */ u(d, { onClick: () => t == null ? void 0 : t(!n), children: [
-    e,
-    /* @__PURE__ */ r(d.Icon, { icon: y })
+  return v(i, () => {
+    e(!1);
+  }), /* @__PURE__ */ n(s.Provider, { value: u, children: /* @__PURE__ */ n("div", { ref: i, className: "relative inline-block text-left", children: t }) });
+}), c = r(({ children: t }) => {
+  const { showDropdown: o, setShowDropdown: e } = a(s) || {};
+  return /* @__PURE__ */ w(l, { onClick: () => e == null ? void 0 : e(!o), children: [
+    t,
+    /* @__PURE__ */ n(l.Icon, { icon: y })
   ] });
-}), p = a(
-  ({ children: e }) => {
-    const { showDropdown: n } = l(i) || {};
-    return n ? /* @__PURE__ */ r(
+}), m = r(
+  ({ children: t }) => {
+    const { showDropdown: o } = a(s) || {};
+    return o ? /* @__PURE__ */ n(
       "div",
       {
         className: "z-50 mt-2 w-48 rounded-lg border-2 bg-primary text-white",
         role: "menu",
         "aria-orientation": "vertical",
         "aria-labelledby": "menu-button",
-        children: /* @__PURE__ */ r("ul", { className: "py-1 text-sm", children: e })
+        children: /* @__PURE__ */ n("ul", { className: "py-1 text-sm", children: t })
       }
-    ) : /* @__PURE__ */ r("div", {});
+    ) : /* @__PURE__ */ n("div", {});
   }
-), w = a(
-  ({ children: e, onClick: n }) => {
-    const { showDropdown: t, setShowDropdown: s } = l(i) || {};
-    return /* @__PURE__ */ r(
+), p = r(
+  ({ children: t }) => {
+    const { setShowDropdown: o } = a(s) || {};
+    return /* @__PURE__ */ n(
       "li",
       {
         className: "px-4 py-2",
-        onClick: (o) => {
-          o == null || o.target, s == null || s(!1);
+        onClick: () => {
+          o == null || o(!1);
         },
-        onKeyDown: (o) => {
-          o.key === "Enter" && (o == null || o.target);
+        onKeyDown: (e) => {
+          e.key;
         },
-        children: e
+        children: t
       }
     );
   }
 );
-c.displayName = "Dropdown";
-m.displayName = "Dropdown.Label";
-p.displayName = "Dropdown.List";
-w.displayName = "Dropdown.Item";
-const g = Object.assign(c, {
-  Label: m,
-  List: p,
-  Item: w
+d.displayName = "Dropdown";
+c.displayName = "Dropdown.Label";
+m.displayName = "Dropdown.List";
+p.displayName = "Dropdown.Item";
+const I = Object.assign(d, {
+  Label: c,
+  List: m,
+  Item: p
 });
 export {
-  g as Dropdown
+  I as Dropdown
 };

package/lib/components/FileUploader/FilePreview.d.ts

@@ -4,5 +4,5 @@ interface FilePreviewProps {
     fileData?: any;
     onDismiss?: (e: any) => void;
 }
-export declare const FilePreview: ({ id, className, fileData, onDismiss, }: FilePreviewProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FilePreview: ({ id, className, fileData, onDismiss }: FilePreviewProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/components/FileUploader/FileUploader.stories.d.ts

@@ -8,40 +8,6 @@ declare const meta: {
         Text: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLParagraphElement> & import('react').RefAttributes<HTMLParagraphElement>>;
         FilePreview: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>>;
     };
-    argTypes: {
-        id: {
-            description: string;
-            control: {
-                type: string;
-                default: boolean;
-            };
-            table: {
-                category: string;
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: string;
-                };
-            };
-        };
-        className: {
-            description: string;
-            control: {
-                type: string;
-                default: boolean;
-            };
-            table: {
-                category: string;
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: string;
-                };
-            };
-        };
-    };
     args: {
         children: import("react/jsx-runtime").JSX.Element[];
         onDrop: (files: any) => void;

package/lib/components/FooterNav/index.js

@@ -1,29 +1,37 @@
-import { jsx as r } from "react/jsx-runtime";
-import { forwardRef as s } from "react";
-import n from "clsx";
-import { Icon as p } from "../Icon/index.js";
-const l = s(({ className: t, children: o, ...e }, a) => /* @__PURE__ */ r(
+import { jsx as a } from "react/jsx-runtime";
+import { forwardRef as n } from "react";
+import s from "clsx";
+import { Icon as N } from "../Icon/index.js";
+const l = n(({ className: o, children: e, ...t }, r) => /* @__PURE__ */ a(
   "div",
   {
-    className: n(
+    className: s(
       "border-lightest-grey fixed bottom-0 flex w-full justify-between border-t px-4",
-      t
+      o
     ),
-    ref: a,
-    ...e,
-    children: o
+    ref: r,
+    ...t,
+    children: e
   }
-)), m = s(({ className: t, children: o, href: e, onClick: a, ...N }) => /* @__PURE__ */ r(
+)), m = n(({ className: o, children: e, href: t, onClick: r, ...p }) => /* @__PURE__ */ a(
   "div",
   {
-    className: n(
+    className: s(
       "group w-full cursor-pointer py-2 text-center transition-all duration-500",
-      t
+      o
     ),
-    ...N,
-    children: /* @__PURE__ */ r("a", { href: e, onClick: a, children: o })
+    ...p,
+    children: /* @__PURE__ */ a("a", { href: t, onClick: r, children: e })
   }
-)), i = s(({ className: t, children: o, ...e }, a) => /* @__PURE__ */ r("p", { className: (n("font-regular pt-0.5 text-xs"), t), ...e, children: o })), c = s(({ className: t, icon: o, ...e }) => /* @__PURE__ */ r(p, { icon: o, ...e }));
+)), i = n(({ className: o, children: e, ...t }, r) => /* @__PURE__ */ a(
+  "p",
+  {
+    ref: r,
+    className: (s("font-regular pt-0.5 text-xs"), o),
+    ...t,
+    children: e
+  }
+)), c = n(({ icon: o, ...e }) => /* @__PURE__ */ a(N, { icon: o, ...e }));
 l.displayName = "FooterNav";
 m.displayName = "FooterNav.Item";
 c.displayName = "FooterNav.Icon";