trepur_components 2.3.9 → 2.3.11

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

@@ -0,0 +1,117 @@
+import { Form } from '.';
+import { StoryObj } from '@storybook/react';
+
+declare const meta: {
+    title: string;
+    component: ({ id, className, onSubmit, ref, components }: import('.').Props) => import("react/jsx-runtime").JSX.Element;
+    argTypes: {
+        title: {
+            type: {
+                name: string;
+                required: boolean;
+            };
+            description: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        onSubmit: {
+            type: {
+                name: string;
+                required: boolean;
+            };
+            description: string;
+            action: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        ref: {
+            type: {
+                name: string;
+                value: string;
+            };
+            description: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        components: {
+            description: string;
+            control: 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;
+                };
+            };
+        };
+    };
+    args: {
+        components: ({
+            htmlType: string;
+            label: string;
+            placeholder: string;
+            children: string;
+            className: string;
+        } | {
+            htmlType: string;
+            children: string;
+            label?: undefined;
+            placeholder?: undefined;
+            className?: undefined;
+        })[];
+    };
+};
+export default meta;
+type Story = StoryObj<typeof Form>;
+export declare const Default: Story;

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

@@ -0,0 +1,13 @@
+import { InputContextProps } from '../Input';
+import { ButtonProps } from '../Button';
+
+export interface Props {
+    id?: string;
+    className?: string;
+    onSubmit?: () => void;
+    ref?: string;
+    components?: Array<InputContextProps & ButtonProps & {
+        htmlType: string;
+    }>;
+}
+export declare const Form: ({ id, className, onSubmit, ref, components }: Props) => import("react/jsx-runtime").JSX.Element;

package/lib/components/Form/index.js

@@ -0,0 +1,17 @@
+import { jsx as l, Fragment as y } from "react/jsx-runtime";
+import { Button as u } from "../Button/index.js";
+import { Input as C } from "../Input/index.js";
+import { Card as k } from "../Card/index.js";
+const T = ({ id: f, className: h, onSubmit: d, ref: b, components: i }) => /* @__PURE__ */ l(k, { children: /* @__PURE__ */ l("form", { id: f, ref: b, className: h, onSubmit: d, children: i == null ? void 0 : i.map((r, a) => (r == null ? void 0 : r.htmlType) === "Input" ? /* @__PURE__ */ l(
+  C,
+  {
+    label: r == null ? void 0 : r.label,
+    placeholder: r == null ? void 0 : r.placeholder,
+    type: r == null ? void 0 : r.type,
+    name: r == null ? void 0 : r.name
+  },
+  `input_${a + 0}`
+) : r.htmlType === "Button" ? /* @__PURE__ */ l(u, { onClick: r == null ? void 0 : r.onClick, children: /* @__PURE__ */ l(u.Label, {}) }, `button_${a + 0}`) : /* @__PURE__ */ l(y, {})) }) });
+export {
+  T as Form
+};

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

@@ -0,0 +1,16 @@
+import { StoryObj } from '@storybook/react';
+import { Gallery } from './';
+
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>> & {
+        Item: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & import('../Image').ImageProps & import('react').RefAttributes<HTMLDivElement>>;
+    };
+    args: {
+        className: string;
+        children: import("react/jsx-runtime").JSX.Element[];
+    };
+};
+export default meta;
+type Story = StoryObj<typeof Gallery>;
+export declare const Default: Story;

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

@@ -0,0 +1,7 @@
+import { ImageProps } from '../Image';
+import { HTMLAttributes } from 'react';
+
+declare const Gallery: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>> & {
+    Item: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & ImageProps & import('react').RefAttributes<HTMLDivElement>>;
+};
+export { Gallery };

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

@@ -0,0 +1,13 @@
+import { StoryObj } from '@storybook/react';
+import { Greeting } from './';
+
+declare const meta: {
+    title: string;
+    component: any;
+    args: {
+        morningMessage: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof Greeting>;
+export declare const Default: Story;

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

@@ -0,0 +1,7 @@
+export interface GreetingProps {
+    morningMessage?: string;
+    afternoonMessage?: string;
+    eveningMessage?: string;
+}
+declare const Greeting: any;
+export { Greeting };

package/lib/components/Greeting/index.js

@@ -0,0 +1,20 @@
+import { jsx as a } from "react/jsx-runtime";
+import { forwardRef as g } from "react";
+import { DateTime as n } from "luxon";
+const r = g(
+  ({
+    morningMessage: s = "Good morning",
+    afternoonMessage: m = "Good afternoon",
+    eveningMessage: d = "Good evening",
+    ...c
+  }, f) => {
+    const e = n.now(), t = n.now().set({ hour: 12, minute: 0, second: 0 }), i = n.now().set({ hour: 17, minute: 0, second: 0 });
+    let o = "";
+    return e < t ? o = s : e >= t && e < i ? o = m : e >= i && (o = d), /* @__PURE__ */ a("p", { ...c, ref: f, children: o });
+  }
+);
+r.displayName = "Greeting";
+const u = Object.assign(r);
+export {
+  u as Greeting
+};

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

@@ -0,0 +1,10 @@
+import { HamburgerIcon } from '.';
+import { StoryObj } from '@storybook/react';
+
+declare const meta: {
+    title: string;
+    component: any;
+};
+export default meta;
+type Story = StoryObj<typeof HamburgerIcon>;
+export declare const Default: Story;

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

@@ -0,0 +1,2 @@
+declare const HamburgerIcon: any;
+export { HamburgerIcon };

package/lib/components/HamburgerIcon/index.js

@@ -0,0 +1,78 @@
+import { jsx as r, jsxs as c } from "react/jsx-runtime";
+import { forwardRef as g, useState as d } from "react";
+import { Button as f } from "../Button/index.js";
+import o from "clsx";
+const n = g(({ className: i, onClick: a, variant: e = "ghost" }, l) => {
+  const [t, m] = d(!1), p = (s) => {
+    m(!t), a == null || a(s);
+  };
+  return /* @__PURE__ */ r(
+    f,
+    {
+      className: o("stroke-white", i),
+      ref: l,
+      onClick: (s) => {
+        p(s);
+      },
+      variant: e,
+      children: /* @__PURE__ */ c(
+        "svg",
+        {
+          className: o(
+            "transition-backgroundColor mx-auto transform overflow-visible duration-500",
+            {
+              "fill-button-primary-text": e === "primary",
+              "fill-button-secondary-text": e === "secondary",
+              "fill-button-ghost-text stroke-button-ghost-text": e === "ghost"
+            }
+          ),
+          width: "24",
+          height: "24",
+          viewBox: "0 0 24 15",
+          xmlns: "http://www.w3.org/2000/svg",
+          children: [
+            /* @__PURE__ */ r(
+              "path",
+              {
+                className: o(
+                  "origin-top-left transition-transform duration-200 ease-linear",
+                  {
+                    "origin-top-left -translate-y-0.5 translate-x-1 rotate-45": t
+                  }
+                ),
+                d: "M0 1.5C0 0.947715 0.447715 0.5 1 0.5H21C21.5523 0.5 22 0.947715 22 1.5C22 2.05228 21.5523 2.5 21 2.5H1C0.447716 2.5 0 2.05228 0 1.5Z"
+              }
+            ),
+            /* @__PURE__ */ r(
+              "path",
+              {
+                className: o("transition-opacity duration-200 ease-linear", {
+                  "opacity-0": t,
+                  "opacity-100": !t
+                }),
+                d: "M0 7.5C0 6.94772 0.447715 6.5 1 6.5H21C21.5523 6.5 22 6.94772 22 7.5C22 8.05228 21.5523 8.5 21 8.5H1C0.447716 8.5 0 8.05228 0 7.5Z"
+              }
+            ),
+            /* @__PURE__ */ r(
+              "path",
+              {
+                className: o(
+                  "origin-bottom-left transition-transform duration-200 ease-linear",
+                  {
+                    "origin-bottom-left translate-x-1 translate-y-px -rotate-45": t
+                  }
+                ),
+                d: "M0 13.5C0 12.9477 0.447715 12.5 1 12.5H21C21.5523 12.5 22 12.9477 22 13.5C22 14.0523 21.5523 14.5 21 14.5H1C0.447716 14.5 0 14.0523 0 13.5Z"
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+});
+n.displayName = "HamburgerIcon";
+const C = Object.assign(n);
+export {
+  C as HamburgerIcon
+};

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

@@ -0,0 +1,16 @@
+import { StoryObj } from '@storybook/react';
+import { Icon } from './';
+
+declare const meta: {
+    title: string;
+    component: any;
+    args: {
+        icon: import('@fortawesome/fontawesome-free-solid').IconDefinition;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof Icon>;
+export declare const Default: Story;
+export declare const Colour: Story;
+export declare const Size: Story;
+export declare const Annimation: Story;

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

@@ -0,0 +1,10 @@
+import { IconProp, SizeProp } from '@fortawesome/fontawesome-svg-core';
+import { IconDefinition } from '@fortawesome/fontawesome-free-solid';
+
+export interface IconProps {
+    className?: string;
+    icon: IconProp | IconDefinition;
+    size: SizeProp;
+}
+declare const Icon: any;
+export { Icon };

package/lib/components/Icon/index.js

@@ -0,0 +1,23 @@
+import { jsx as m } from "react/jsx-runtime";
+import { forwardRef as i } from "react";
+import { FontAwesomeIcon as a } from "@fortawesome/react-fontawesome";
+const o = i(
+  (n, r) => {
+    const { className: s, size: t, icon: e, ...c } = n;
+    return /* @__PURE__ */ m(
+      a,
+      {
+        className: s,
+        ref: r,
+        icon: e,
+        size: t,
+        ...c
+      }
+    );
+  }
+);
+o.displayName = "Icon";
+const d = Object.assign(o);
+export {
+  d as Icon
+};

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

@@ -0,0 +1,13 @@
+import { Image } from '.';
+import { StoryObj } from '@storybook/react';
+
+declare const meta: {
+    title: string;
+    component: any;
+    args: {
+        src: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof Image>;
+export declare const Default: Story;

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

@@ -0,0 +1,5 @@
+export interface ImageProps {
+    src: string;
+}
+declare const Image: any;
+export { Image };

package/lib/components/Image/index.js

@@ -0,0 +1,17 @@
+import { jsx as s } from "react/jsx-runtime";
+import { forwardRef as t } from "react";
+import f from "clsx";
+const m = t(({ className: o, src: a, ...e }, r) => /* @__PURE__ */ s(
+  "img",
+  {
+    className: f("h-full w-full", o),
+    ref: r,
+    src: a,
+    ...e
+  }
+));
+m.displayName = "Image";
+const c = Object.assign(m);
+export {
+  c as Image
+};

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

@@ -0,0 +1,19 @@
+import { ImageCard } from '.';
+import { StoryObj } from '@storybook/react';
+
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>> & {
+        Image: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<import('../Image').ImageProps> & import('../Image').ImageProps & import('react').RefAttributes<HTMLImageElement>>;
+        Content: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>>;
+        Title: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLParagraphElement> & import('react').RefAttributes<HTMLParagraphElement>>;
+        Subtitle: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLParagraphElement> & import('react').RefAttributes<HTMLParagraphElement>>;
+        Text: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLParagraphElement> & import('react').RefAttributes<HTMLParagraphElement>>;
+    };
+    args: {
+        children: import("react/jsx-runtime").JSX.Element[];
+    };
+};
+export default meta;
+type Story = StoryObj<typeof ImageCard>;
+export declare const Default: Story;

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

@@ -0,0 +1,11 @@
+import { ImageProps } from '../Image';
+import { HTMLAttributes } from 'react';
+
+declare const ImageCard: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>> & {
+    Image: import('react').ForwardRefExoticComponent<HTMLAttributes<ImageProps> & ImageProps & import('react').RefAttributes<HTMLImageElement>>;
+    Content: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>>;
+    Title: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & import('react').RefAttributes<HTMLParagraphElement>>;
+    Subtitle: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & import('react').RefAttributes<HTMLParagraphElement>>;
+    Text: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & import('react').RefAttributes<HTMLParagraphElement>>;
+};
+export { ImageCard };

package/lib/components/ImageCard/index.js

@@ -0,0 +1,32 @@
+import { jsx as t } from "react/jsx-runtime";
+import { forwardRef as m } from "react";
+import { Image as p } from "../Image/index.js";
+import C from "clsx";
+const d = m(({ className: a, children: e, ...r }, n) => /* @__PURE__ */ t(
+  "div",
+  {
+    className: C(
+      "grid max-w-96 overflow-hidden rounded-xl bg-white drop-shadow",
+      a
+    ),
+    ref: n,
+    ...r,
+    children: e
+  }
+)), s = m(({ src: a, ...e }) => /* @__PURE__ */ t("div", { className: "h-64", children: /* @__PURE__ */ t(p, { src: a, ...e }) })), o = m(({ children: a, ...e }, r) => /* @__PURE__ */ t("div", { className: "px-2 pb-4 pt-2", ref: r, ...e, children: a })), i = m(({ ...a }, e) => /* @__PURE__ */ t("p", { className: "text-lg", ref: e, ...a })), l = m(({ ...a }, e) => /* @__PURE__ */ t("p", { className: "text-sm", ref: e, ...a })), g = m(({ ...a }, e) => /* @__PURE__ */ t("p", { className: "text-md pt-2", ref: e, ...a }));
+d.displayName = "ImageCard";
+s.displayName = "ImageCard.Image";
+i.displayName = "ImageCard.Title";
+l.displayName = "ImageCard.Subtitle";
+o.displayName = "ImageCard.Content";
+g.displayName = "ImageCard.Text";
+const f = Object.assign(d, {
+  Image: s,
+  Content: o,
+  Title: i,
+  Subtitle: l,
+  Text: g
+});
+export {
+  f as ImageCard
+};

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

@@ -0,0 +1,22 @@
+import { Input } from '.';
+import { StoryObj } from '@storybook/react';
+
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & import('.').InputContextProps & import('react').RefAttributes<HTMLDivElement>> & {
+        Item: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>>;
+        Label: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & {
+            required?: boolean | undefined;
+        } & import('react').RefAttributes<HTMLDivElement>>;
+        Box: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>>;
+        Validation: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>>;
+    };
+    args: {
+        placeholder: string;
+        errors: string[];
+        children: import("react/jsx-runtime").JSX.Element[];
+    };
+};
+export default meta;
+type Story = StoryObj<typeof Input>;
+export declare const Default: Story;

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

@@ -0,0 +1,33 @@
+import { HTMLAttributes } from 'react';
+
+export interface InputContextProps {
+    autoComplete?: string;
+    disabled?: boolean;
+    formId?: string;
+    height?: string;
+    maxLength?: number;
+    minLength?: number;
+    pattern?: string;
+    required?: boolean;
+    readOnly?: boolean;
+    label?: string;
+    type?: string;
+    name?: string;
+    placeholder?: string;
+    withValidation?: boolean;
+    onChange?: (e: any) => void;
+    onBlur?: () => void;
+    onFocus?: () => void;
+    onClick?: () => void;
+    errors?: string[];
+    value?: string;
+}
+declare const Input: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & InputContextProps & import('react').RefAttributes<HTMLDivElement>> & {
+    Item: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>>;
+    Label: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
+        required?: boolean | undefined;
+    } & import('react').RefAttributes<HTMLDivElement>>;
+    Box: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>>;
+    Validation: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>>;
+};
+export { Input };

package/lib/components/Input/index.js

@@ -0,0 +1,83 @@
+import { jsx as o, jsxs as f } from "react/jsx-runtime";
+import { createContext as I, forwardRef as a, useMemo as b, useRef as h, useContext as i } from "react";
+import N from "clsx";
+const u = I(null), d = a(({ children: r, errors: t, placeholder: e, ...n }, l) => {
+  const s = b(
+    () => ({
+      errors: t,
+      placeholder: e,
+      ...n
+    }),
+    [t, n]
+  );
+  return /* @__PURE__ */ o(u.Provider, { value: s, children: /* @__PURE__ */ o("div", { ref: l, children: r }) });
+}), c = a(
+  ({ children: r, ...t }, e) => {
+    const n = h(null);
+    return /* @__PURE__ */ o(
+      "div",
+      {
+        className: "mt-4 w-full cursor-pointer bg-white",
+        onClick: () => {
+          var l;
+          return (l = n.current) == null ? void 0 : l.focus();
+        },
+        ref: e,
+        ...t,
+        children: r
+      }
+    );
+  }
+), m = a(({ children: r, required: t = !1 }, e) => /* @__PURE__ */ f(
+  "div",
+  {
+    ref: e,
+    className: "font-regular absolute -mt-3 ml-3 flex items-center rounded-2xl bg-white px-1 text-sm",
+    children: [
+      /* @__PURE__ */ o("p", { children: r }),
+      t && /* @__PURE__ */ o("p", { className: "font-semiBold text-lg text-error-default", children: " *" })
+    ]
+  }
+)), p = a(
+  ({ ...r }) => {
+    const { errors: t, placeholder: e } = i(u) || {};
+    return /* @__PURE__ */ o(
+      "input",
+      {
+        placeholder: e,
+        className: N(
+          "text-ink text-md w-full cursor-pointer rounded-md border border-black bg-white py-2 pl-4",
+          {
+            "border-error border-2": t != null
+          }
+        ),
+        ...r
+      }
+    );
+  }
+), x = a(({ children: r, ...t }, e) => {
+  const { errors: n } = i(u) || {};
+  return /* @__PURE__ */ o(
+    "div",
+    {
+      ref: e,
+      className: "font-regular gap-y-2 text-sm text-error-default",
+      ...t,
+      children: n == null ? void 0 : n.map((l, s) => /* @__PURE__ */ o("p", { children: l }, `error-msg-${s + 1}`))
+    }
+  );
+});
+d.displayName = "Input";
+c.displayName = "Input.Item";
+m.displayName = "Input.Label";
+p.displayName = "Input.Box";
+x.displayName = "Input.Validation";
+const w = Object.assign(d, {
+  Item: c,
+  Label: m,
+  Box: p,
+  Validation: x
+});
+export {
+  w as Input
+};