trepur_components 2.3.8 → 2.3.10

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

@@ -3,187 +3,15 @@ import { StoryObj } from '@storybook/react';
 
 declare const meta: {
     title: string;
-    component: ({ id, className, onClick, variant, type, href, target, label, rounded, disabled, isLoading, openInNewTab, children, }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
-    parameters: {
-        docs: {
-            description: {
-                component: string;
-            };
-        };
-    };
-    argTypes: {
-        onClick: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-            action: string;
-            table: {
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: string;
-                };
-            };
-        };
-        hoverText: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-            table: {
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: string;
-                };
-            };
-        };
-        variant: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            options: string[];
-            description: string;
-            table: {
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: string;
-                };
-            };
-            defaultValue: string;
-            control: {
-                type: string;
-            };
-        };
-        type: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            options: string[];
-            description: string;
-            table: {
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: string;
-                };
-            };
-            defaultValue: string;
-            control: {
-                type: string;
-            };
-        };
-        href: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-            table: {
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: string;
-                };
-            };
-        };
-        rounded: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-            defaultValue: string;
-        };
-        disabled: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-        };
-        isLoading: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            table: {
-                defaultValue: {
-                    summary: string;
-                };
-            };
-            description: string;
-        };
-        openInNewTab: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-            defaultValue: string;
-        };
-        children: {
-            type: {
-                name: string;
-                value: string;
-            };
-            description: string;
-            table: {
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: string;
-                };
-            };
-        };
-        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;
-                };
-            };
-        };
+    component: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLButtonElement> & import('.').ButtonProps & import('react').RefAttributes<HTMLButtonElement>> & {
+        Icon: import('react').ForwardRefExoticComponent<{
+            icon: any;
+        } & import('react').RefAttributes<SVGSVGElement>>;
+        Label: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLParagraphElement> & import('react').RefAttributes<HTMLParagraphElement>>;
     };
     args: {
-        children: string;
-        rounded: boolean;
+        variant: "primary";
+        children: import("react/jsx-runtime").JSX.Element[];
         onClick: import('@storybook/addon-actions').HandlerFunction;
     };
 };

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

@@ -1,19 +1,13 @@
-import { default as React } from 'react';
+import { HTMLAttributes } from 'react';
 
-export interface Props {
-    id?: string;
-    className?: string;
-    onClick?: React.MouseEventHandler;
-    hoverText?: string;
-    variant?: 'primary' | 'secondary' | 'tertiary';
-    type?: 'social' | 'icon' | 'default';
-    href?: string;
-    label?: string;
-    target?: string;
-    rounded?: boolean;
+export interface ButtonProps {
+    variant?: 'primary' | 'secondary' | 'ghost';
     disabled?: boolean;
-    isLoading?: boolean;
-    openInNewTab?: boolean;
-    children?: any;
 }
-export declare const Button: ({ id, className, onClick, variant, type, href, target, label, rounded, disabled, isLoading, openInNewTab, children, }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const Button: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLButtonElement> & ButtonProps & import('react').RefAttributes<HTMLButtonElement>> & {
+    Icon: import('react').ForwardRefExoticComponent<{
+        icon: any;
+    } & import('react').RefAttributes<SVGSVGElement>>;
+    Label: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & import('react').RefAttributes<HTMLParagraphElement>>;
+};
+export { Button };

package/lib/components/Button/index.js

@@ -1,66 +1,30 @@
-import { jsxs as v, jsx as s } from "react/jsx-runtime";
-import { Icon as N } from "../Icon/index.js";
-import { faSpinner as B } from "@fortawesome/fontawesome-free-solid";
-import t from "classnames";
-const k = ({
-  id: p,
-  className: u,
-  onClick: n,
-  variant: o = "primary",
-  type: a = "default",
-  href: c,
-  target: i,
-  label: d,
-  rounded: l = !0,
-  disabled: r = !1,
-  isLoading: e = !1,
-  openInNewTab: I = !1,
-  children: f
-}) => {
-  const b = t(
-    {
-      "px-1 py-1": a === "social",
-      "px-3": a === "icon",
-      "px-8": a === "default"
-    },
-    "py-3"
-  ), x = t(
-    {
-      invisible: !e
-    },
-    "absolute left-2/4 top-1/4 -ml-2"
-  ), g = t(
-    {
-      "border-secondary bg-primary text-secondary outline-primary": o === "primary",
-      "hover:border-primary hover:bg-secondary hover:text-primary focus:border-primary focus:bg-secondary focus:text-primary": !r && o === "primary",
-      "border-primary bg-secondary text-primary outline-secondary": o === "secondary",
-      "hover:border-tertiary hover:bg-secondary hover:text-tertiary focus:border-tertiary focus:bg-secondary focus:text-tertiary": !r && o === "secondary",
-      "opacity-50": r,
-      "rounded-lg": l,
-      "rounded-none": !l
-    },
-    "transform border-2 text-sm duration-500 inline-block text-center focus:outline",
-    u,
-    b
-  ), h = /* @__PURE__ */ s(N, { icon: B });
-  let y = "button", m = {};
-  return (c || i) && (y = "a", m = { href: c, target: i }), /* @__PURE__ */ v(
-    y,
-    {
-      ...m,
-      id: p,
-      className: g,
-      "aria-busy": e,
-      "aria-label": d,
-      ...n != null && { onClick: n },
-      ...r && { disabled: r },
-      children: [
-        /* @__PURE__ */ s("div", { className: t({ invisible: e }), children: f }),
-        e && /* @__PURE__ */ s("div", { className: x, children: h })
-      ]
-    }
-  );
-};
+import { jsx as r } from "react/jsx-runtime";
+import { forwardRef as n } from "react";
+import { Icon as m } from "../Icon/index.js";
+import b from "clsx";
+const a = n(({ className: t, children: o, variant: e = "primary", disabled: d, ...u }) => /* @__PURE__ */ r(
+  "button",
+  {
+    className: b(
+      "flex items-center gap-2 rounded-lg border px-4 py-2 text-center text-sm duration-200",
+      {
+        "border-button-primary-border bg-button-primary-bg text-button-primary-text hover:bg-button-primary-hover active:bg-button-primary-active": e === "primary",
+        "border-button-secondary-border bg-button-secondary-bg text-button-secondary-text hover:bg-button-secondary-hover active:bg-button-secondary-active": e === "secondary",
+        "border-button-ghost-border bg-button-ghost-bg text-button-ghost-text hover:bg-button-ghost-hover active:bg-button-ghost-active": e === "ghost"
+      },
+      t
+    ),
+    ...u,
+    children: o
+  }
+)), s = n(({ className: t, ...o }, e) => /* @__PURE__ */ r("p", { className: b("text-md", t), ref: e, ...o })), c = n(({ icon: t }, o) => /* @__PURE__ */ r(m, { size: "md", ref: o, icon: t }));
+a.displayName = "Button";
+c.displayName = "Button.Icon";
+s.displayName = "Button.Label";
+const x = Object.assign(a, {
+  Icon: c,
+  Label: s
+});
 export {
-  k as Button
+  x as Button
 };

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

@@ -1,136 +1,11 @@
-import { CalendarComponent } from '.';
 import { StoryObj } from '@storybook/react';
+import { CalendarComponent } from './';
 
 declare const meta: {
     title: string;
-    component: ({ id, className, onChange, useRange, minDetail, minDate, maxDate, showNavigation, disabledDates, showDoubleView, }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
-    argTypes: {
-        useRange: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-            table: {
-                defaultValue: {
-                    summary: string;
-                };
-            };
-            defaultValue: string;
-        };
-        showDoubleView: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-            table: {
-                defaultValue: {
-                    summary: string;
-                };
-            };
-            defaultValue: string;
-        };
-        showNavigation: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-            table: {
-                defaultValue: {
-                    summary: string;
-                };
-            };
-            defaultValue: string;
-        };
-        minDetail: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-            table: {
-                defaultValue: {
-                    summary: string;
-                };
-            };
-            defaultValue: string;
-        };
-        minDate: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-            table: {
-                defaultValue: {
-                    summary: Date;
-                };
-            };
-            defaultValue: Date;
-        };
-        maxDate: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-            table: {
-                defaultValue: {
-                    summary: Date;
-                };
-            };
-            defaultValue: Date;
-        };
-        disabledDates: {
-            type: {
-                name: string;
-                required: boolean;
-            };
-            description: string;
-            table: {
-                defaultValue: {
-                    summary: never[];
-                };
-            };
-            defaultValue: never[];
-        };
-        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: {};
+    component: any;
 };
 export default meta;
 type Story = StoryObj<typeof CalendarComponent>;
 export declare const Default: Story;
+export declare const ShowDoubleView: Story;

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

@@ -1,8 +1,6 @@
 
 export type Detail = 'month' | 'year' | 'decade' | 'century';
-export interface Props {
-    id?: string;
-    className?: string;
+export interface CalendarProps {
     onChange?: () => void;
     useRange?: boolean;
     minDetail?: Detail;
@@ -12,4 +10,5 @@ export interface Props {
     disabledDates?: string[];
     showDoubleView?: boolean;
 }
-export declare const CalendarComponent: ({ id, className, onChange, useRange, minDetail, minDate, maxDate, showNavigation, disabledDates, showDoubleView, }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const CalendarComponent: any;
+export { CalendarComponent };

package/lib/components/Calendar/index.js

@@ -1,46 +1,49 @@
-import { jsx as l } from "react/jsx-runtime";
-import { useState as h } from "react";
-import v from "react-calendar";
+import { jsx as g } from "react/jsx-runtime";
+import { forwardRef as w, useState as y } from "react";
+import b from "react-calendar";
 import "./style.css.js";
-const x = ({
-  id: i,
-  className: m,
-  onChange: s,
-  useRange: D = !1,
-  minDetail: u = "month",
-  minDate: c = /* @__PURE__ */ new Date(),
-  maxDate: d = new Date((/* @__PURE__ */ new Date()).setFullYear((/* @__PURE__ */ new Date()).getFullYear() + 1)),
-  showNavigation: f = !0,
-  disabledDates: w = [],
-  showDoubleView: p = !0
-}) => {
-  const [n, r] = h(/* @__PURE__ */ new Date()), g = (e, t) => {
-    const a = new Intl.DateTimeFormat("en-gb", {
-      year: "numeric",
-      month: "2-digit",
-      day: "2-digit"
-    }).format(e == null ? void 0 : e.date);
-    return t.includes(a);
-  };
-  return /* @__PURE__ */ l("div", { id: i, className: m, children: /* @__PURE__ */ l(
-    v,
-    {
-      onActiveStartDateChange: ({ value: e, activeStartDate: t, action: a }) => {
-        const o = t !== null ? t : n;
-        a === "next" && r(new Date(o)), a === "prev" && r(new Date(o));
-      },
-      activeStartDate: n,
-      onChange: s,
-      selectRange: D,
-      minDetail: u,
-      minDate: c,
-      maxDate: d,
-      showNavigation: f,
-      showDoubleView: p,
-      tileDisabled: (e) => g(e, w)
-    }
-  ) });
-};
+const i = w(
+  ({
+    onChange: m,
+    useRange: l,
+    minDetail: s,
+    minDate: c,
+    maxDate: f,
+    showNavigation: d,
+    disabledDates: u,
+    showDoubleView: p
+  }, D) => {
+    const [n, r] = y(/* @__PURE__ */ new Date()), C = (e, t) => {
+      const a = new Intl.DateTimeFormat("en-gb", {
+        year: "numeric",
+        month: "2-digit",
+        day: "2-digit"
+      }).format(e == null ? void 0 : e.date);
+      return t ? t.includes(a) : !1;
+    };
+    return /* @__PURE__ */ g(
+      b,
+      {
+        ref: D,
+        onActiveStartDateChange: ({ value: e, activeStartDate: t, action: a }) => {
+          const o = t !== null ? t : n;
+          a === "next" && r(new Date(o)), a === "prev" && r(new Date(o));
+        },
+        activeStartDate: n,
+        onChange: m,
+        selectRange: l,
+        minDetail: s,
+        minDate: c,
+        maxDate: f,
+        showNavigation: d,
+        showDoubleView: p,
+        tileDisabled: (e) => C(e, u)
+      }
+    );
+  }
+);
+i.displayName = "Calendar";
+const F = Object.assign(i);
 export {
-  x as CalendarComponent
+  F as CalendarComponent
 };

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

@@ -3,105 +3,8 @@ import { StoryObj } from '@storybook/react';
 
 declare const meta: {
     title: string;
-    component: ({ id, className, imageProps, videoProps, title, subTitle, description, href, target, buttonProps, }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
-    argTypes: {
-        imageProps: {
-            description: string;
-            table: {};
-        };
-        videoProps: {
-            description: string;
-            table: {};
-        };
-        title: {
-            description: string;
-            table: {};
-        };
-        subTitle: {
-            description: string;
-            table: {};
-        };
-        description: {
-            description: string;
-            table: {};
-        };
-        href: {
-            description: string;
-            table: {};
-        };
-        target: {
-            type: {
-                name: "string";
-                required: false;
-            };
-            options: string[];
-            description: string;
-            table: {
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: string;
-                };
-            };
-            defaultValue: string;
-            control: {
-                type: string;
-            };
-        };
-        buttonProps: {
-            description: string;
-            table: {};
-        };
-        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: {
-        imageProps: {
-            src: string;
-        };
-        title: string;
-        subTitle: string;
-        description: string;
-        href: string;
-        buttonProps: {
-            children: string;
-            disabled: false;
-            hoverText: string;
-            href: string;
-            rounded: true;
-        };
-    };
+    component: any;
+    args: {};
 };
 export default meta;
 type Story = StoryObj<typeof Card>;