@axos-web-dev/shared-components 0.0.4 → 0.0.6

package/dist/Button/index.d.ts

@@ -1,12 +1,18 @@
-import { ReactNode } from "react";
+import { AnchorHTMLAttributes, ButtonHTMLAttributes, ReactNode } from "react";
 import { ButtonVariants } from "./Button.css";
-export interface ButtonProps {
-    as?: "button" | "a";
+export type ButtonBase = {
     children?: ReactNode;
     targetUrl?: string;
     id?: string;
     action?: () => void;
-}
+};
+export type ButtonAsButton = ButtonBase & Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof ButtonBase> & {
+    as?: "button";
+};
+export type ButtonAsLink = ButtonBase & Omit<AnchorHTMLAttributes<HTMLAnchorElement>, keyof ButtonBase> & {
+    as?: "a";
+};
+export type ButtonProps = ButtonAsButton | ButtonAsLink;
 export declare const Button: ({ as, children, color, size, disabled, rounded, targetUrl, id, action, }: ButtonProps & ButtonVariants) => import("react").DetailedReactHTMLElement<{
     className: string;
     href: string | undefined;

package/dist/FaqAccordion/index.js

@@ -15,15 +15,25 @@ const useAccordion = create()((set) => ({
 const AccordionItem = (props) => {
   const selectItem = useAccordion((state) => state.toggle);
   const isOpen = useAccordion((state) => state.itemOpened);
-  const toggle = (ev) => {
-    ev.preventDefault();
+  const toggle = (event) => {
+    event.preventDefault();
     if (isOpen !== props.id) {
       selectItem(props.id);
     } else {
       selectItem("");
     }
   };
-  return /* @__PURE__ */ jsx("details", { onClick: toggle, open: isOpen === props.id, children: props.children });
+  return /* @__PURE__ */ jsx(
+    "details",
+    {
+      onClick: (e) => {
+        toggle(e);
+        return;
+      },
+      open: isOpen === props.id,
+      children: props.children
+    }
+  );
 };
 const AccordionItemSummary = (props) => {
   const isOpen = useAccordion((state) => state.itemOpened);

package/dist/Forms/Forms.css.d.ts

@@ -0,0 +1,90 @@
+export declare const formContainer: import("@vanilla-extract/recipes").RuntimeFn<{
+    variant: {
+        primary: {
+            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        secondary: {
+            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        tertiary: {
+            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        quaternary: {
+            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;
+export declare const iconForm: string;
+export declare const headerForm: import("@vanilla-extract/recipes").RuntimeFn<{
+    variant: {
+        primary: {
+            readonly selectors: {
+                [x: string]: {
+                    WebkitBackgroundClip: string;
+                    backgroundImage: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    WebkitTextFillColor: string;
+                    color?: undefined;
+                } | {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    WebkitBackgroundClip?: undefined;
+                    backgroundImage?: undefined;
+                    WebkitTextFillColor?: undefined;
+                };
+            };
+        };
+        secondary: {
+            selectors: {
+                [x: string]: {
+                    WebkitBackgroundClip: "text";
+                    backgroundImage: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    WebkitTextFillColor: "transparent";
+                    color?: undefined;
+                } | {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    WebkitBackgroundClip?: undefined;
+                    backgroundImage?: undefined;
+                    WebkitTextFillColor?: undefined;
+                };
+            };
+        };
+        tertiary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        quaternary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;
+export declare const formWrapper: import("@vanilla-extract/recipes").RuntimeFn<{
+    variant: {
+        primary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        secondary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        tertiary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        quaternary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;
+export declare const actions: string;
+export declare const disclosureForm: import("@vanilla-extract/recipes").RuntimeFn<{
+    variant: {
+        primary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        secondary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        tertiary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        quaternary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;

package/dist/Forms/Forms.css.js

@@ -0,0 +1,19 @@
+/* empty css                                          */
+/* empty css                                */
+/* empty css                                   */
+/* empty css                         */
+import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
+var formContainer = createRuntimeFn({ defaultClassName: "tfms6a0", variantClassNames: { variant: { primary: "tfms6a1", secondary: "tfms6a2", tertiary: "tfms6a3", quaternary: "tfms6a4" } }, defaultVariants: {}, compoundVariants: [] });
+var iconForm = "tfms6a5";
+var headerForm = createRuntimeFn({ defaultClassName: "tfms6a6", variantClassNames: { variant: { primary: "tfms6a7", secondary: "tfms6a8", tertiary: "tfms6a9", quaternary: "tfms6aa" } }, defaultVariants: {}, compoundVariants: [] });
+var formWrapper = createRuntimeFn({ defaultClassName: "tfms6ab", variantClassNames: { variant: { primary: "tfms6ac", secondary: "tfms6ad", tertiary: "tfms6ae", quaternary: "tfms6af" } }, defaultVariants: {}, compoundVariants: [] });
+var actions = "tfms6ag";
+var disclosureForm = createRuntimeFn({ defaultClassName: "tfms6ah", variantClassNames: { variant: { primary: "tfms6ai", secondary: "tfms6aj", tertiary: "tfms6ak", quaternary: "tfms6al" } }, defaultVariants: {}, compoundVariants: [] });
+export {
+  actions,
+  disclosureForm,
+  formContainer,
+  formWrapper,
+  headerForm,
+  iconForm
+};

package/dist/Forms/RenderForm.d.ts

@@ -0,0 +1,7 @@
+import { PropsWithChildren } from "react";
+import { FormProps } from ".";
+export interface renderFormProps extends FormProps, PropsWithChildren {
+    formName?: string;
+}
+export declare const renderSwitch: (form: string | undefined, props: FormProps) => import("react/jsx-runtime").JSX.Element;
+export declare const RenderWebForm: (props: renderFormProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Forms/RenderForm.js

@@ -0,0 +1,19 @@
+import { jsx, Fragment } from "react/jsx-runtime";
+import "./Forms.css.js";
+import "./SalesforceFieldsForm.js";
+import { ScheduleCall } from "./ScheduleCall.js";
+const renderSwitch = (form = "Contact Form", props) => {
+  switch (form) {
+    case "Contact Form":
+      return /* @__PURE__ */ jsx(ScheduleCall, { ...props });
+    default:
+      return /* @__PURE__ */ jsx(ScheduleCall, { ...props });
+  }
+};
+const RenderWebForm = (props) => {
+  return /* @__PURE__ */ jsx(Fragment, { children: renderSwitch(props.formName, props) });
+};
+export {
+  RenderWebForm,
+  renderSwitch
+};

package/dist/Forms/SalesforceFieldsForm.d.ts

@@ -0,0 +1,71 @@
+/// <reference types="react" />
+import * as z from "zod";
+export interface SalesforceFields {
+    brand: string;
+    branch: string;
+    subBranch: string;
+    leadSourceDetail: string;
+}
+export interface SalesforceInputs {
+    Brand_SFDC2__c: string;
+    Branch_SFDC2__c: string;
+    Sub_Branch_SFDC2__c: string;
+    Lead_Source_Detail_SFDC2__c: string;
+    lead_source: string;
+    Web_Source__c: string;
+    Marketing_Source__c: string;
+    First_UTMCampaign__c: string;
+    First_UTMContent__c: string;
+    First_UTMMedium__c: string;
+    First_UTMSource__c: string;
+    First_UTMTerm__c: string;
+}
+export declare const SalesforceSchema: z.ZodObject<{
+    Brand_SFDC2__c: z.ZodOptional<z.ZodString>;
+    Branch_SFDC2__c: z.ZodOptional<z.ZodString>;
+    Sub_Branch_SFDC2__c: z.ZodOptional<z.ZodString>;
+    Lead_Source_Detail_SFDC2__c: z.ZodOptional<z.ZodString>;
+    lead_source: z.ZodOptional<z.ZodString>;
+    Web_Source__c: z.ZodOptional<z.ZodString>;
+    Marketing_Source__c: z.ZodOptional<z.ZodString>;
+    First_UTMCampaign__c: z.ZodOptional<z.ZodString>;
+    First_UTMContent__c: z.ZodOptional<z.ZodString>;
+    First_UTMMedium__c: z.ZodOptional<z.ZodString>;
+    First_UTMSource__c: z.ZodOptional<z.ZodString>;
+    First_UTMTerm__c: z.ZodOptional<z.ZodString>;
+}, "strip", z.ZodTypeAny, {
+    Brand_SFDC2__c?: string | undefined;
+    Branch_SFDC2__c?: string | undefined;
+    Sub_Branch_SFDC2__c?: string | undefined;
+    Lead_Source_Detail_SFDC2__c?: string | undefined;
+    lead_source?: string | undefined;
+    Web_Source__c?: string | undefined;
+    Marketing_Source__c?: string | undefined;
+    First_UTMCampaign__c?: string | undefined;
+    First_UTMContent__c?: string | undefined;
+    First_UTMMedium__c?: string | undefined;
+    First_UTMSource__c?: string | undefined;
+    First_UTMTerm__c?: string | undefined;
+}, {
+    Brand_SFDC2__c?: string | undefined;
+    Branch_SFDC2__c?: string | undefined;
+    Sub_Branch_SFDC2__c?: string | undefined;
+    Lead_Source_Detail_SFDC2__c?: string | undefined;
+    lead_source?: string | undefined;
+    Web_Source__c?: string | undefined;
+    Marketing_Source__c?: string | undefined;
+    First_UTMCampaign__c?: string | undefined;
+    First_UTMContent__c?: string | undefined;
+    First_UTMMedium__c?: string | undefined;
+    First_UTMSource__c?: string | undefined;
+    First_UTMTerm__c?: string | undefined;
+}>;
+export interface QueryParams {
+    [str: string]: string;
+}
+export type Props = {
+    salesforceFields?: Partial<SalesforceFields>;
+    queryParams?: Partial<QueryParams>;
+    location?: Record<string, unknown>;
+};
+export declare const SalesforceFieldsForm: import("react").NamedExoticComponent<Props>;

package/dist/Forms/SalesforceFieldsForm.js

@@ -0,0 +1,137 @@
+"use client";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { memo } from "react";
+import { useFormContext } from "react-hook-form";
+import * as z from "zod";
+const SalesforceSchema = z.object({
+  Brand_SFDC2__c: z.string().optional(),
+  // David should provide this values more later
+  Branch_SFDC2__c: z.string().optional(),
+  // Branch
+  Sub_Branch_SFDC2__c: z.string().optional(),
+  // this configurable
+  Lead_Source_Detail_SFDC2__c: z.string().optional(),
+  //this
+  lead_source: z.string().optional(),
+  // web RMI
+  Web_Source__c: z.string().optional(),
+  // Page url
+  Marketing_Source__c: z.string().optional(),
+  // Page url + Query params
+  First_UTMCampaign__c: z.string().optional(),
+  First_UTMContent__c: z.string().optional(),
+  First_UTMMedium__c: z.string().optional(),
+  First_UTMSource__c: z.string().optional(),
+  First_UTMTerm__c: z.string().optional()
+});
+const SalesforceFieldsForm = memo(function SaleforceFieldForm({
+  salesforceFields,
+  queryParams,
+  location
+}) {
+  const { register } = useFormContext();
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "hidden",
+        ...register("Brand_SFDC2__c", {
+          value: salesforceFields == null ? void 0 : salesforceFields.brand
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "hidden",
+        ...register("Branch_SFDC2__c", {
+          value: salesforceFields == null ? void 0 : salesforceFields.branch
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "hidden",
+        ...register("Sub_Branch_SFDC2__c", {
+          value: salesforceFields == null ? void 0 : salesforceFields.subBranch
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "hidden",
+        ...register("Lead_Source_Detail_SFDC2__c", {
+          value: salesforceFields == null ? void 0 : salesforceFields.leadSourceDetail
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx("input", { type: "hidden", ...register("lead_source", { value: "Web RMI" }) }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "hidden",
+        ...register("Web_Source__c", { value: location == null ? void 0 : location.pathname })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "hidden",
+        ...register("Marketing_Source__c", {
+          value: `${(queryParams == null ? void 0 : queryParams.utm_campaign) ? queryParams.utm_campaign : "no campaign_no source"}`
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "hidden",
+        ...register("First_UTMCampaign__c", {
+          value: queryParams == null ? void 0 : queryParams.utm_campaign
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "hidden",
+        ...register("First_UTMContent__c", {
+          value: queryParams == null ? void 0 : queryParams.utm_content
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "hidden",
+        ...register("First_UTMMedium__c", {
+          value: queryParams == null ? void 0 : queryParams.utm_medium
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "hidden",
+        ...register("First_UTMSource__c", {
+          value: queryParams == null ? void 0 : queryParams.utm_source
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "hidden",
+        ...register("First_UTMTerm__c", {
+          value: queryParams == null ? void 0 : queryParams.utm_term
+        })
+      }
+    )
+  ] });
+});
+export {
+  SalesforceFieldsForm,
+  SalesforceSchema
+};

package/dist/Forms/ScheduleCall.d.ts

@@ -0,0 +1,15 @@
+import { ChevronProps } from '../Chevron/Chevron.interface';
+import { QuaternaryTypes } from '../utils/variant.types';
+import { PropsWithChildren, ReactNode } from "react";
+export interface FormProps extends PropsWithChildren {
+    onSubmit?: (values: {
+        [index: string]: string;
+    }) => void;
+    icon?: boolean;
+    headline?: ReactNode;
+    disclosure?: ReactNode;
+    variant?: QuaternaryTypes;
+    validateEmail: (email: string) => Promise<boolean>;
+    callToAction: Omit<ChevronProps, "targetUrl">;
+}
+export declare const ScheduleCall: ({ icon, children, onSubmit, disclosure, variant: fullVariant, headline, callToAction, validateEmail, }: FormProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Forms/ScheduleCall.js

@@ -0,0 +1,141 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { Button } from "../Button/index.js";
+import { Input } from "../Input/index.js";
+import SvgAxosX from "../icons/AxosX/index.js";
+import "../icons/CheckIcon/CheckIcon.css.js";
+/* empty css                                */
+/* empty css                                   */
+/* empty css                                                    */
+import { associatedEmail } from "../utils/EverestValidity.js";
+import { getVariant } from "../utils/getVariant.js";
+import clsx from "clsx";
+import { useForm, FormProvider } from "react-hook-form";
+import * as z from "zod";
+import { formContainer, iconForm, headerForm, formWrapper, disclosureForm, actions } from "./Forms.css.js";
+import { SalesforceSchema } from "./SalesforceFieldsForm.js";
+const ScheduleCall = ({
+  icon = false,
+  children,
+  onSubmit = (values) => {
+    console.log(values);
+  },
+  disclosure,
+  variant: fullVariant = "primary",
+  headline,
+  callToAction,
+  validateEmail
+}) => {
+  var _a, _b, _c, _d;
+  const schema = z.object({
+    firstName: z.string().trim().min(1, { message: "First Name is required." }),
+    lastName: z.string().trim().min(1, { message: "Last Name is required." }),
+    email: z.string().email({ message: "Email is required." }).refine(async (val) => await validateEmail(val)),
+    phone: z.string().regex(/[0-9]/).min(1, { message: "Phone is required." })
+  });
+  const methods = useForm({
+    resolver: zodResolver(schema.merge(SalesforceSchema), {
+      async: true
+    }),
+    mode: "onBlur",
+    defaultValues: {
+      email: ""
+    }
+  });
+  const {
+    handleSubmit,
+    register,
+    formState: { errors, isValid }
+  } = methods;
+  const submitForm = async (data) => {
+    await onSubmit(data);
+  };
+  const variant = getVariant(fullVariant);
+  return /* @__PURE__ */ jsx("section", { className: clsx(formContainer({ variant })), children: /* @__PURE__ */ jsx("section", { className: clsx("containment"), children: /* @__PURE__ */ jsxs(FormProvider, { ...methods, children: [
+    icon && /* @__PURE__ */ jsx("div", { className: clsx("text_center", iconForm), children: /* @__PURE__ */ jsx(SvgAxosX, {}) }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: clsx("header_2 text_center", headerForm({ variant })),
+        children: headline
+      }
+    ),
+    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit(submitForm), children: [
+      /* @__PURE__ */ jsxs("div", { className: clsx(formWrapper({ variant })), children: [
+        /* @__PURE__ */ jsx("div", { className: "", children: /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: "firstName",
+            ...register("firstName", { required: true }),
+            label: "First Name",
+            sizes: "medium",
+            placeholder: "First Name",
+            required: true,
+            error: !!errors.firstName,
+            helperText: (_a = errors.firstName) == null ? void 0 : _a.message
+          }
+        ) }),
+        /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: "lastName",
+            ...register("lastName", { required: true }),
+            label: "Last Name",
+            sizes: "medium",
+            placeholder: "Last Name",
+            required: true,
+            error: !!errors.lastName,
+            helperText: (_b = errors.lastName) == null ? void 0 : _b.message
+          }
+        ) }),
+        /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: "email",
+            ...register("email", {
+              required: true,
+              validate: {
+                isValid: associatedEmail
+              }
+            }),
+            label: "Email",
+            sizes: "medium",
+            placeholder: "Email",
+            required: true,
+            error: !!errors.email,
+            helperText: (_c = errors.email) == null ? void 0 : _c.message
+          }
+        ) }),
+        /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: "phone",
+            ...register("phone", { required: true }),
+            label: "Phone",
+            sizes: "medium",
+            placeholder: "Phone",
+            required: true,
+            error: !!errors.phone,
+            helperText: (_d = errors.phone) == null ? void 0 : _d.message
+          }
+        ) })
+      ] }),
+      children,
+      /* @__PURE__ */ jsx("div", { className: disclosureForm({ variant }), children: disclosure }),
+      /* @__PURE__ */ jsx("div", { className: actions, children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          color: getVariant(callToAction == null ? void 0 : callToAction.variant),
+          as: "button",
+          type: "submit",
+          disabled: !isValid,
+          children: callToAction == null ? void 0 : callToAction.displayText
+        }
+      ) })
+    ] })
+  ] }) }) });
+};
+export {
+  ScheduleCall
+};

package/dist/Forms/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./Forms.css";
+export * from "./RenderForm";
+export * from "./SalesforceFieldsForm";
+export * from "./ScheduleCall";

package/dist/Forms/index.js

@@ -0,0 +1,17 @@
+import { actions, disclosureForm, formContainer, formWrapper, headerForm, iconForm } from "./Forms.css.js";
+import { RenderWebForm, renderSwitch } from "./RenderForm.js";
+import { SalesforceFieldsForm, SalesforceSchema } from "./SalesforceFieldsForm.js";
+import { ScheduleCall } from "./ScheduleCall.js";
+export {
+  RenderWebForm,
+  SalesforceFieldsForm,
+  SalesforceSchema,
+  ScheduleCall,
+  actions,
+  disclosureForm,
+  formContainer,
+  formWrapper,
+  headerForm,
+  iconForm,
+  renderSwitch
+};

package/dist/HeroBanner/index.js

@@ -63,8 +63,10 @@ const HeroBanner = ({
                 "data-nimg": 1,
                 className: "img_fluid",
                 style: { color: "transparent" },
-                src: image.src,
-                alt: image.alt
+                src: `${image.src}?fm=png&w=500&h=400&fit=fill&r=20`,
+                alt: image.alt,
+                width: 500,
+                height: 400
               }
             ) })
           ]

package/dist/IconBillboard/IconBillboard.css.d.ts

@@ -29,11 +29,11 @@ export declare const headerIconBillboard: string;
 export declare const title: import("@vanilla-extract/recipes").RuntimeFn<{
     variant: {
         primary: {
-            readonly selectors: {
+            selectors: {
                 [x: string]: {
-                    WebkitBackgroundClip: string;
+                    WebkitBackgroundClip: "text";
                     backgroundImage: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-                    WebkitTextFillColor: string;
+                    WebkitTextFillColor: "transparent";
                     color?: undefined;
                 } | {
                     color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;

package/dist/IconBillboard/IconBillboard.css.js

@@ -1,3 +1,4 @@
+/* empty css                                          */
 /* empty css                                */
 /* empty css                                   */
 /* empty css                                 */

package/dist/Input/index.d.ts

@@ -8,4 +8,4 @@ export interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
     skeleton?: boolean | undefined;
     helperText?: ReactNode;
 }
-export declare const Input: (props: InputProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/Input/index.js

@@ -1,7 +1,8 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import clsx from "clsx";
+import { forwardRef } from "react";
 import { wrapper, labelClassName, container, iconContainer, icon, input, helperText } from "./Input.css.js";
-const Input = (props) => {
+const Input = forwardRef((props, ref) => {
   const {
     disabled,
     label,
@@ -22,6 +23,7 @@ const Input = (props) => {
         "input",
         {
           ...rest,
+          ref,
           className: clsx(props.className, input({ size: sizes }))
         }
       ),
@@ -29,7 +31,7 @@ const Input = (props) => {
     ] }),
     /* @__PURE__ */ jsx("span", { className: helperText({ disabled, error }), children: helper })
   ] });
-};
+});
 export {
   Input
 };

package/dist/MainHTML/index.d.ts

@@ -0,0 +1,5 @@
+import { PropsWithChildren } from "react";
+export interface BodyProps extends PropsWithChildren {
+    theme: string;
+}
+export declare const MainHTML: ({ theme, children }: BodyProps) => import("react/jsx-runtime").JSX.Element;

package/dist/MainHTML/index.js

@@ -0,0 +1,9 @@
+import { jsx } from "react/jsx-runtime";
+import { axosTheme } from "../themes/axos.css.js";
+import { premierTheme } from "../themes/premier.css.js";
+const MainHTML = ({ theme = "Axos", children }) => {
+  return /* @__PURE__ */ jsx("main", { className: theme === "Premier" ? premierTheme : axosTheme, children });
+};
+export {
+  MainHTML
+};