trepur_components 2.3.26 → 2.3.27

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

@@ -1,14 +1,12 @@
-import { Colours } from '../../utils/controls';
 import { default as React } from 'react';
 
 export interface Props {
     id?: string;
     className?: string;
-    backgroundColour?: Colours;
     menuItems: Array<{
         name: string;
         href: string;
     }>;
     onClick?: React.MouseEventHandler;
 }
-export declare const MenuButton: ({ id, className, backgroundColour, menuItems, onClick, }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuButton: ({ id, className, menuItems, onClick }: Props) => import("react/jsx-runtime").JSX.Element;

package/lib/components/MenuButton/index.js

@@ -1,27 +1,21 @@
 import { jsx as t, Fragment as h, jsxs as o } from "react/jsx-runtime";
 import { useState as u } from "react";
 import { Dropdown as l } from "../Dropdown/index.js";
-import { Image as c } from "../Image/index.js";
-import p from "classnames";
-const H = ({
-  id: s,
-  className: d,
-  backgroundColour: w = "white",
-  menuItems: a,
-  onClick: e
-}) => {
-  const [r, i] = u(!1), m = p(
+import { Image as p } from "../Image/index.js";
+import c from "classnames";
+const g = ({ id: s, className: d, menuItems: m, onClick: e }) => {
+  const [r, a] = u(!1), i = c(
     d,
     "h-[45px] w-[80px] overflow-hidden rounded-full border-2 border-lightest-grey my-auto flex cursor-pointer justify-between pl-2 text-center hover:shadow-md"
   );
-  return a ? /* @__PURE__ */ o("div", { children: [
+  return m ? /* @__PURE__ */ o("div", { children: [
     /* @__PURE__ */ o(
       "div",
       {
         id: s,
-        className: m,
+        className: i,
         onClick: () => {
-          i(!r);
+          a(!r);
         },
         children: [
           /* @__PURE__ */ t("div", { className: "mx-auto my-auto", onClick: (n) => e == null ? void 0 : e(n), children: /* @__PURE__ */ o(
@@ -39,7 +33,7 @@ const H = ({
             }
           ) }),
           /* @__PURE__ */ t(
-            c,
+            p,
             {
               src: "https://picsum.photos/300/300",
               className: "mx-auto my-auto h-8 w-8 rounded-full object-contain"
@@ -52,5 +46,5 @@ const H = ({
   ] }) : /* @__PURE__ */ t(h, {});
 };
 export {
-  H as MenuButton
+  g as MenuButton
 };

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

@@ -2,7 +2,7 @@ import { default as React } from 'react';
 
 declare const meta: {
     title: string;
-    component: ({ id, className, children, visible, onOverlayClick, mobileGutter, animationStyle, }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
+    component: ({ id, className, children, visible, onOverlayClick, mobileGutter, animationStyle }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
     parameters: {
         docs: {
             description: {

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

@@ -7,4 +7,4 @@ export interface Props extends Partial<Pick<HTMLElement, 'className' | 'id'>> {
     mobileGutter?: boolean;
     animationStyle?: 'fade' | 'slideBottom';
 }
-export declare const Modal: ({ id, className, children, visible, onOverlayClick, mobileGutter, animationStyle, }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const Modal: ({ id, className, children, visible, onOverlayClick, mobileGutter, animationStyle }: Props) => import("react/jsx-runtime").JSX.Element;

package/lib/components/NavItem/index.js

@@ -1,28 +1,35 @@
 import { jsx as a } from "react/jsx-runtime";
 import { forwardRef as o } from "react";
-import c from "clsx";
-const s = o(({ loading: r = !1, active: e, children: t, className: n, href: m, ...f }, i) => r ? /* @__PURE__ */ a("div", { className: "m-auto", children: /* @__PURE__ */ a("div", { className: "h-7 w-20 animate-pulse rounded-md bg-gray-300" }) }) : /* @__PURE__ */ a(
+import n from "clsx";
+const l = o(({ loading: t = !1, active: e, children: r, className: m, href: f, ...i }, c) => t ? /* @__PURE__ */ a("div", { className: "m-auto", children: /* @__PURE__ */ a("div", { className: "h-7 w-20 animate-pulse rounded-md bg-gray-300" }) }) : /* @__PURE__ */ a(
   "a",
   {
-    href: m,
-    ref: i,
-    className: c(
+    href: f,
+    ref: c,
+    className: n(
       "m-auto inline-block py-0 text-nav-text after:block after:scale-x-0 after:border-b-2 after:border-nav-text after:transition-all after:duration-300 after:ease-in-out hover:cursor-pointer hover:after:scale-x-100",
       {
         "font-bold": e,
         "font-light": !e
       },
-      n
+      m
     ),
-    ...f,
-    children: t
+    ...i,
+    children: r
   }
-)), l = o(({ className: r, ...e }, t) => /* @__PURE__ */ a("p", { className: "flex-none text-nowrap text-lg", ref: t, ...e }));
-s.displayName = "NavItem";
-l.displayName = "NavItem.Label";
-const b = Object.assign(s, {
-  Label: l
+)), s = o(({ className: t, ...e }, r) => /* @__PURE__ */ a(
+  "p",
+  {
+    className: n("flex-none text-nowrap text-lg", t),
+    ref: r,
+    ...e
+  }
+));
+l.displayName = "NavItem";
+s.displayName = "NavItem.Label";
+const x = Object.assign(l, {
+  Label: s
 });
 export {
-  b as NavItem
+  x as NavItem
 };

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

@@ -3,7 +3,7 @@ import { StoryObj } from '@storybook/react';
 
 declare const meta: {
     title: string;
-    component: ({ id, className, onChange, placeholder, text, leftIconProps, rightIconProps, }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
+    component: ({ id, className, onChange, placeholder, text, leftIconProps, rightIconProps }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
     parameters: {};
     argTypes: {
         leftIconProps: {
@@ -69,16 +69,6 @@ declare const meta: {
     };
     args: {
         placeholder: string;
-        leftIconProps: {
-            type: string;
-            className: string;
-            bgColour: string;
-        };
-        rightIconProps: {
-            type: string;
-            className: string;
-            bgColour: string;
-        };
     };
 };
 export default meta;

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

@@ -9,4 +9,4 @@ export interface Props {
     leftIconProps?: IconProps;
     rightIconProps?: IconProps;
 }
-export declare const Search: ({ id, className, onChange, placeholder, text, leftIconProps, rightIconProps, }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const Search: ({ id, className, onChange, placeholder, text, leftIconProps, rightIconProps }: Props) => import("react/jsx-runtime").JSX.Element;

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

@@ -3,7 +3,7 @@ import { Select } from './';
 
 declare const meta: {
     title: string;
-    component: ({ id, className, options, value, label, onClick, required, fullWidth, }: import('./').SelectProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ id, className, options, value, label, onClick, required, fullWidth }: import('./').SelectProps) => import("react/jsx-runtime").JSX.Element;
     parameters: {};
     argTypes: {
         label: {

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

@@ -8,4 +8,4 @@ export interface SelectProps {
     fullWidth?: boolean;
     required?: boolean;
 }
-export declare const Select: ({ id, className, options, value, label, onClick, required, fullWidth, }: SelectProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Select: ({ id, className, options, value, label, onClick, required, fullWidth }: SelectProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -3,7 +3,7 @@ import { StoryObj } from '@storybook/react';
 
 declare const meta: {
     title: string;
-    component: ({ id, className, title, subTitle, description, bgColour, size, iconProps, }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
+    component: ({ title, subTitle, description, size, iconProps }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
     argTypes: {
         id: {
             description: string;
@@ -42,12 +42,8 @@ declare const meta: {
         title: string;
         subTitle: string;
         description: string;
-        bgColour: string;
-        size: string;
-        iconProps: {
-            icon: import('@fortawesome/fontawesome-free-solid').IconDefinition;
-            onClick: import('@storybook/addon-actions').HandlerFunction;
-        };
+        bgColour: "white";
+        size: "large";
     };
 };
 export default meta;

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

@@ -12,4 +12,4 @@ export interface Props {
     size?: 'small' | 'medium' | 'large';
     iconProps?: IconProps;
 }
-export declare const Showcase: ({ id, className, title, subTitle, description, bgColour, size, iconProps, }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const Showcase: ({ title, subTitle, description, size, iconProps }: Props) => import("react/jsx-runtime").JSX.Element;

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

@@ -3,7 +3,7 @@ import { StoryObj } from '@storybook/react';
 
 declare const meta: {
     title: string;
-    component: ({ id, className, children, bgColour, showNav, leftExpand, }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
+    component: ({ id, className, children, showNav, leftExpand }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
     parameters: {
         backgrounds: {
             default: string;
@@ -14,18 +14,10 @@ declare const meta: {
         };
     };
     argTypes: {
-        navLinks: {
-            description: string;
-            table: {
-                type: {
-                    summary: string;
-                };
-            };
-        };
         bgColour: {
             type: {
-                name: string;
-                required: boolean;
+                name: "string";
+                required: false;
             };
             options: string[];
             description: string;
@@ -72,7 +64,7 @@ declare const meta: {
     };
     args: {
         children: import("react/jsx-runtime").JSX.Element;
-        showNav: boolean;
+        showNav: true;
     };
 };
 export default meta;

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

@@ -3,10 +3,10 @@ import { Colours } from '../../utils/controls';
 export interface Props {
     id: string;
     className: string;
-    children: any;
+    children: React.ReactNode;
     getNavStatus: (asSideBar: boolean, open: boolean) => void;
     bgColour?: Colours;
     showNav?: boolean;
     leftExpand?: boolean;
 }
-export declare const SideNav: ({ id, className, children, bgColour, showNav, leftExpand, }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const SideNav: ({ id, className, children, showNav, leftExpand }: Props) => import("react/jsx-runtime").JSX.Element;

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

@@ -3,7 +3,7 @@ import { StoryObj } from '@storybook/react';
 
 declare const meta: {
     title: string;
-    component: ({ id, className, onClick, type, href, openInNewTab, }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
+    component: ({ id, className, onClick, type, href, openInNewTab }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
     parameters: {
         docs: {
             description: {
@@ -14,8 +14,8 @@ declare const meta: {
     argTypes: {
         onClick: {
             type: {
-                name: string;
-                required: boolean;
+                name: "function";
+                required: false;
             };
             description: string;
             action: string;
@@ -30,8 +30,8 @@ declare const meta: {
         };
         type: {
             type: {
-                name: string;
-                required: boolean;
+                name: "string";
+                required: false;
             };
             options: string[];
             description: string;
@@ -50,8 +50,8 @@ declare const meta: {
         };
         href: {
             type: {
-                name: string;
-                required: boolean;
+                name: "string";
+                required: false;
             };
             description: string;
             table: {
@@ -65,27 +65,12 @@ declare const meta: {
         };
         openInNewTab: {
             type: {
-                name: string;
-                required: boolean;
+                name: "boolean";
+                required: false;
             };
             description: string;
             defaultValue: string;
         };
-        children: {
-            type: {
-                name: string;
-                value: string;
-            };
-            description: string;
-            table: {
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: string;
-                };
-            };
-        };
         id: {
             description: string;
             control: {
@@ -120,7 +105,7 @@ declare const meta: {
         };
     };
     args: {
-        type: string;
+        type: "facebook";
         href: string;
         onClick: import('@storybook/addon-actions').HandlerFunction;
     };

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

@@ -9,4 +9,4 @@ export interface Props {
     href?: string;
     openInNewTab?: boolean;
 }
-export declare const SocialButton: ({ id, className, onClick, type, href, openInNewTab, }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const SocialButton: ({ id, className, onClick, type, href, openInNewTab }: Props) => import("react/jsx-runtime").JSX.Element;

package/lib/components/SplitCard/index.js

@@ -1,85 +1,85 @@
 import { jsx as n } from "react/jsx-runtime";
-import { createContext as u, forwardRef as d, useMemo as N, useContext as c } from "react";
+import { createContext as u, forwardRef as o, useMemo as N, useContext as c } from "react";
 import h from "../../utils/matchMedia.js";
 import { Screens as y } from "../../utils/screens.js";
-import p from "clsx";
-const a = u(null), x = d(({ id: l, className: e, children: r, swapDesktop: t, swapMobile: i, ...s }, o) => {
+import d from "clsx";
+const a = u(null), x = o(({ className: r, children: l, swapDesktop: t, swapMobile: e, ...i }, s) => {
   const f = `(min-width: ${y.md})`, m = h(f), S = N(
     () => ({
       swapDesktop: t,
-      swapMobile: i,
+      swapMobile: e,
       isMd: m
     }),
-    [t, i, m]
+    [t, e, m]
   );
   return /* @__PURE__ */ n(a.Provider, { value: S, children: /* @__PURE__ */ n(
     "div",
     {
-      ref: o,
-      ...s,
-      className: p("grid grid-cols-1 md:grid-cols-2", e),
-      children: r
+      ref: s,
+      ...i,
+      className: d("grid grid-cols-1 md:grid-cols-2", r),
+      children: l
     }
   ) });
-}), g = d(({ className: l, children: e, ...r }, t) => {
-  const { swapDesktop: i, swapMobile: s, isMd: o } = c(a) || {};
+}), g = o(({ className: r, children: l, ...t }, e) => {
+  const { swapDesktop: i, swapMobile: s, isMd: p } = c(a) || {};
   return /* @__PURE__ */ n(
     "div",
     {
-      ref: t,
-      ...r,
-      className: p(
+      ref: e,
+      ...t,
+      className: d(
         "mx-auto flex items-center px-4 py-2 text-center md:p-8 lg:py-12",
         {
           "md:order-last lg:pl-12 lg:pr-20": i,
           "lg:pl-20 lg:pr-12": !i,
-          "order-last": !o && s
+          "order-last": !p && s
         },
-        l
+        r
       ),
-      children: e
+      children: l
     }
   );
-}), C = d(({ className: l, children: e, ...r }, t) => {
-  const { swapDesktop: i, swapMobile: s, isMd: o } = c(a) || {};
+}), C = o(({ className: r, children: l, ...t }, e) => {
+  const { swapDesktop: i, swapMobile: s, isMd: p } = c(a) || {};
   return /* @__PURE__ */ n(
     "div",
     {
-      ref: t,
-      ...r,
-      className: p(
+      ref: e,
+      ...t,
+      className: d(
         "flex h-full items-center px-4 py-2 text-center md:p-8 lg:py-12",
         {
           "md:order-first lg:pl-20 lg:pr-12": i,
           "lg:pl-12 lg:pr-20": !i,
-          "order-first": !o && s
+          "order-first": !p && s
         },
-        l
+        r
       ),
-      children: e
+      children: l
     }
   );
-}), M = d(({ className: l, children: e, ...r }, t) => /* @__PURE__ */ n(
+}), M = o(({ className: r, children: l, ...t }, e) => /* @__PURE__ */ n(
   "p",
   {
-    ref: t,
-    className: p(
+    ref: e,
+    className: d(
       "items-center text-6xl font-semibold tracking-wider md:text-4xl lg:text-6xl",
-      l
+      r
     ),
-    ...r,
-    children: e
+    ...t,
+    children: l
   }
-)), v = d(({ className: l, children: e, ...r }, t) => /* @__PURE__ */ n("p", { ref: t, className: p("text-lg", l), ...r, children: e }));
+)), v = o(({ className: r, children: l, ...t }, e) => /* @__PURE__ */ n("p", { ref: e, className: d("text-lg", r), ...t, children: l }));
 x.displayName = "SplitCard";
 g.displayName = "SplitCard.LeftContent";
 C.displayName = "SplitCard.RightContent";
-const k = Object.assign(x, {
+const j = Object.assign(x, {
   LeftContent: g,
   RightContent: C,
   Title: M,
   Text: v
 });
 export {
-  k as SplitCard
+  j as SplitCard
 };

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

@@ -1,8 +1,5 @@
-import { SizeProp } from '@fortawesome/fontawesome-svg-core';
-
 export interface StarProps {
     stars?: 1 | 2 | 3 | 4 | 5;
-    size?: SizeProp;
 }
 declare const Stars: any;
 export { Stars };

package/lib/components/Stars/index.js

@@ -3,20 +3,20 @@ import { forwardRef as c } from "react";
 import { Icon as i } from "../Icon/index.js";
 import { faStar as n } from "@fortawesome/fontawesome-free-solid";
 import f from "clsx";
-const o = c(({ className: s, stars: a = 0, size: p }, e) => {
-  const m = () => [...Array(5)].map((d, r) => /* @__PURE__ */ t(
+const o = c(({ className: a, stars: s = 0 }, e) => {
+  const m = () => [...Array(5)].map((p, r) => /* @__PURE__ */ t(
     i,
     {
-      className: r < a ? "text-star" : "",
+      className: r < s ? "text-star" : "",
       icon: n,
       size: "2x"
     },
     `checked_star_${r}`
   ));
-  return /* @__PURE__ */ t("div", { ref: e, className: f("flex", s), children: m() });
+  return /* @__PURE__ */ t("div", { ref: e, className: f("flex", a), children: m() });
 });
 o.displayName = "Stars";
-const _ = Object.assign(o);
+const N = Object.assign(o);
 export {
-  _ as Stars
+  N as Stars
 };

package/lib/components/Testimonial/index.js

@@ -1,22 +1,38 @@
-import { jsx as i } from "react/jsx-runtime";
+import { jsx as s } from "react/jsx-runtime";
 import { forwardRef as m } from "react";
-import { Card as u } from "../Card/index.js";
-import { Image as x } from "../Image/index.js";
+import { Card as x } from "../Card/index.js";
+import { Image as N } from "../Image/index.js";
 import o from "clsx";
-const n = m(({ className: s, children: e, ...t }, a) => /* @__PURE__ */ i(u, { ref: a, className: o("grid gap-4", s), ...t, children: e })), l = m(({ className: s, src: e, ...t }, a) => /* @__PURE__ */ i("div", { ref: a, className: "mx-auto w-40 ", children: /* @__PURE__ */ i(x, { className: "rounded-full", src: e, ...t }) })), r = m(({ className: s, children: e, ...t }, a) => /* @__PURE__ */ i("h3", { ref: a, className: "text-center text-lg font-medium", ...t, children: e })), c = m(({ className: s, children: e, ...t }, a) => /* @__PURE__ */ i("div", { ref: a, className: o("text-center", s), ...t, children: e })), T = m(({ className: s, children: e, ...t }, a) => /* @__PURE__ */ i(
+const n = m(({ className: t, children: e, ...i }, a) => /* @__PURE__ */ s(x, { ref: a, className: o("grid gap-4", t), ...i, children: e })), l = m(({ className: t, src: e, ...i }, a) => /* @__PURE__ */ s("div", { ref: a, className: o("mx-auto w-40", t), children: /* @__PURE__ */ s(N, { className: "rounded-full", src: e, ...i }) })), r = m(({ className: t, children: e, ...i }, a) => /* @__PURE__ */ s(
+  "h3",
+  {
+    ref: a,
+    className: o("text-center text-lg font-medium", t),
+    ...i,
+    children: e
+  }
+)), c = m(({ className: t, children: e, ...i }, a) => /* @__PURE__ */ s("div", { ref: a, className: o("text-center", t), ...i, children: e })), T = m(({ className: t, children: e, ...i }, a) => /* @__PURE__ */ s(
+  "p",
+  {
+    ref: a,
+    className: o("text-md font-regular text-sm", t),
+    ...i,
+    children: e
+  }
+)), d = m(({ className: t, children: e, ...i }, a) => /* @__PURE__ */ s("p", { ref: a, className: o("font-regular text-sm", t), ...i, children: e })), p = m(({ className: t, children: e, ...i }, a) => /* @__PURE__ */ s(
   "p",
   {
     ref: a,
-    className: o("text-md font-regular text-sm", s),
-    ...t,
+    className: o("text-md text-center font-light", t),
+    ...i,
     children: e
   }
-)), N = m(({ className: s, children: e, ...t }, a) => /* @__PURE__ */ i("p", { ref: a, className: "font-regular text-sm", ...t, children: e })), d = m(({ className: s, children: e, ...t }, a) => /* @__PURE__ */ i("p", { className: o("text-md text-center font-light"), ...t, children: e })), p = m(({ className: s, children: e, ...t }, a) => /* @__PURE__ */ i(
+)), u = m(({ className: t, children: e, ...i }, a) => /* @__PURE__ */ s(
   "p",
   {
     ref: a,
-    className: o("text-center text-sm font-medium", s),
-    ...t,
+    className: o("text-center text-sm font-medium", t),
+    ...i,
     children: e
   }
 ));
@@ -25,17 +41,17 @@ l.displayName = "Testimonial.Image";
 r.displayName = "Testimonial.Title";
 c.displayName = "Testimonial.Section";
 T.displayName = "Testimonial.Position";
-N.displayName = "Testimonial.Date";
-d.displayName = "Testimonial.Text";
-p.displayName = "Testimonial.AuthorDetails";
+d.displayName = "Testimonial.Date";
+p.displayName = "Testimonial.Text";
+u.displayName = "Testimonial.AuthorDetails";
 const I = Object.assign(n, {
   Image: l,
   Title: r,
   Section: c,
   Position: T,
-  Date: N,
-  Text: d,
-  AuthorDetails: p
+  Date: d,
+  Text: p,
+  AuthorDetails: u
 });
 export {
   I as Testimonial