@sikka/hawa
Version:
Modern UI Kit made with Tailwind
665 lines (633 loc) • 28.9 kB
JavaScript
"use client";
import {
Input
} from "../../chunk-BTIMHZXM.mjs";
import {
Chip,
ScrollArea
} from "../../chunk-FIBEENJA.mjs";
import {
Textarea
} from "../../chunk-O356IC37.mjs";
import {
Select
} from "../../chunk-2NFENSLV.mjs";
import {
Button,
Card,
CardContent,
CardDescription,
CardFooter,
CardHeader,
CardTitle,
cn
} from "../../chunk-5MN7WB7B.mjs";
// blocks/misc/LegalTexts.tsx
import React10 from "react";
// elements/tabs/Tabs.tsx
import * as React9 from "react";
// hooks/useIsomorphicEffect.ts
import { useEffect, useLayoutEffect } from "react";
// hooks/useDiscloser.ts
import { useState } from "react";
// hooks/useHover.ts
import { useEffect as useEffect2, useRef, useState as useState2 } from "react";
// hooks/useToast.ts
import * as React3 from "react";
// hooks/useCarousel.ts
import { useState as useState4, useRef as useRef2 } from "react";
// hooks/useDialogCarousel.ts
import { useEffect as useEffect4, useState as useState5 } from "react";
import AutoHeight from "embla-carousel-auto-height";
import useEmblaCarousel from "embla-carousel-react";
// hooks/useDialogSteps.ts
import { useState as useState6, useEffect as useEffect5, useRef as useRef3 } from "react";
// hooks/useClipboard.ts
import { useState as useState7 } from "react";
// hooks/useBreakpoint.ts
import { useState as useState8, useEffect as useEffect6 } from "react";
// hooks/useWindowSize.ts
import { useEffect as useEffect7, useState as useState9 } from "react";
// hooks/useFocusWithin.ts
import { useRef as useRef4, useState as useState10, useEffect as useEffect8 } from "react";
// hooks/useMediaQuery.ts
import { useState as useState11, useEffect as useEffect9, useRef as useRef5 } from "react";
// hooks/useScrollPosition.ts
import { useState as useState12, useEffect as useEffect10 } from "react";
// hooks/useTable.ts
import { useState as useState13, useEffect as useEffect11 } from "react";
// hooks/useTabs.ts
import { useEffect as useEffect12, useState as useState14 } from "react";
// hooks/useMeasureDirty.ts
import { useEffect as useEffect13, useRef as useRef7, useState as useState15 } from "react";
// hooks/useClickOutside.ts
import { useEffect as useEffect14, useRef as useRef8 } from "react";
// hooks/useShortcuts.ts
import { useEffect as useEffect15 } from "react";
// hooks/useWindowEvent.ts
import { useEffect as useEffect16 } from "react";
function useWindowEvent(type, listener, options) {
useEffect16(() => {
window.addEventListener(type, listener, options);
return () => window.removeEventListener(type, listener, options);
}, [type, listener]);
}
// hooks/useViewportSize.ts
import { useCallback, useEffect as useEffect17, useState as useState16 } from "react";
var eventListerOptions = {
passive: true
};
function useViewportSize() {
const [windowSize, setWindowSize] = useState16({
width: 0,
height: 0
});
const setSize = useCallback(() => {
setWindowSize({
width: window.innerWidth || 0,
height: window.innerHeight || 0
});
}, []);
useWindowEvent("resize", setSize, eventListerOptions);
useWindowEvent("orientationchange", setSize, eventListerOptions);
useEffect17(setSize, []);
return windowSize;
}
// elements/tabs/Tabs.tsx
import * as Popover from "@radix-ui/react-popover";
import * as TabsPrimitive from "@radix-ui/react-tabs";
import { tv } from "tailwind-variants";
var tabsListVariant = tv({
base: "",
variants: {
variant: {
default: "hawa-flex hawa-w-fit hawa-items-center hawa-justify-start hawa-gap-1 hawa-rounded hawa-border hawa-bg-muted hawa-p-1 hawa-text-muted-foreground dark:hawa-border-primary/10",
underlined: "hawa-flex hawa-w-fit hawa-items-center hawa-justify-start hawa-gap-1 hawa-rounded hawa-p-1 hawa-text-muted-foreground dark:hawa-border-primary/10",
underlined_tabs: "hawa-flex hawa-w-fit hawa-items-center hawa-justify-start hawa-gap-1 hawa-text-muted-foreground"
},
orientation: { horizontal: "", vertical: "" }
},
compoundVariants: [
{
variant: "underlined_tabs",
orientation: "vertical",
class: "hawa-border-e-2 hawa-border-e-primary"
},
{
variant: "underlined_tabs",
orientation: "horizontal",
class: "hawa-border-b-2 hawa-border-b-primary"
}
],
defaultVariants: { variant: "default", orientation: "horizontal" }
});
var tabsTriggerVariant = tv({
base: "",
variants: {
variant: {
default: "hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-gap-2 hawa-whitespace-nowrap hawa-rounded hawa-border hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50 data-[state=active]:hawa-bg-primary data-[state=active]:hawa-text-primary-foreground data-[state=active]:hawa-shadow-sm dark:hawa-border-primary/10",
underlined: "hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-gap-2 hawa-whitespace-nowrap hawa-rounded hawa-rounded-none hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50",
underlined_tabs: "hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-gap-2 hawa-whitespace-nowrap hawa-rounded hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50 hawa-bg-primary/10 data-[state=active]:hawa-bg-primary data-[state=active]:hawa-text-primary-foreground dark:hawa-border-primary/10"
},
orientation: { horizontal: "", vertical: "" }
},
compoundVariants: [
{
variant: "underlined",
orientation: "horizontal",
class: "data-[state=active]:hawa-border-b-primary hawa-border-b hawa-border-b-2"
},
{
variant: "underlined",
orientation: "vertical",
class: "data-[state=active]:hawa-border-e-primary hawa-border-e hawa-border-e-2"
},
{
variant: "underlined_tabs",
orientation: "horizontal",
class: "hawa-rounded-b-none"
},
{
variant: "underlined_tabs",
orientation: "vertical",
class: "hawa-rounded-e-none"
}
],
defaultVariants: { variant: "default", orientation: "horizontal" }
});
var TabsContext = React9.createContext({ orientation: "horizontal", variant: "default", scrollable: false });
var Tabs = React9.forwardRef(
({ className, orientation, scrollable, variant = "default", ...props }, ref) => /* @__PURE__ */ React9.createElement(
TabsPrimitive.Root,
{
ref,
className: cn(
"hawa-flex hawa-gap-2",
orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
className
),
...props
},
/* @__PURE__ */ React9.createElement(TabsContext.Provider, { value: { orientation, variant, scrollable } }, props.children)
)
);
var TabsList = React9.forwardRef(({ className, classNames, ...props }, ref) => {
const { orientation, variant, scrollable } = React9.useContext(TabsContext);
const { width } = useViewportSize();
if (scrollable && width < 768 && orientation === "horizontal") {
return /* @__PURE__ */ React9.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React9.createElement(
TabsPrimitive.List,
{
ref,
className: cn(
tabsListVariant({ variant, orientation }),
"hawa-flex-row hawa-flex-nowrap",
className
),
...props
}
));
} else {
return /* @__PURE__ */ React9.createElement(
TabsPrimitive.List,
{
ref,
className: cn(
tabsListVariant({ variant, orientation }),
orientation === "vertical" ? "hawa-flex-col" : "hawa-flex-row",
"hawa-flex-wrap",
className
),
...props
}
);
}
});
var TabsTrigger = React9.forwardRef(
({ className, chipProps, withPopover = false, onPopoverClick, ...props }, ref) => {
const { orientation, variant } = React9.useContext(TabsContext);
if (withPopover) {
return /* @__PURE__ */ React9.createElement(Popover.Root, { open: props.showPopover }, /* @__PURE__ */ React9.createElement(Popover.Anchor, { asChild: true }, /* @__PURE__ */ React9.createElement(
TabsPrimitive.Trigger,
{
className: cn(
tabsTriggerVariant({ variant, orientation }),
"hawa-relative",
className
),
...props
},
props.children,
chipProps && /* @__PURE__ */ React9.createElement(Chip, { ...chipProps })
)), /* @__PURE__ */ React9.createElement(
Popover.Content,
{
onClick: onPopoverClick,
asChild: true,
className: cn(
"dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
"hawa-arrow-default-top hawa-mt-2"
)
},
/* @__PURE__ */ React9.createElement("div", { className: "hawa-p-2" }, " ", props.popoverContent)
));
} else {
return /* @__PURE__ */ React9.createElement(
TabsPrimitive.Trigger,
{
className: cn(
tabsTriggerVariant({ variant, orientation }),
"hawa-relative",
className
),
...props
},
props.children,
chipProps && /* @__PURE__ */ React9.createElement(Chip, { ...chipProps })
);
}
}
);
var TabsContent = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React9.createElement(
TabsPrimitive.Content,
{
ref,
className: cn(
"hawa-ring-offset-hawa-background hawa-w-full focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2",
className
),
...props
}
));
Tabs.displayName = TabsPrimitive.Root.displayName;
TabsList.displayName = TabsPrimitive.List.displayName;
TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
TabsContent.displayName = TabsPrimitive.Content.displayName;
// blocks/misc/LegalTexts.tsx
var LegalTexts = ({ tabs, ...props }) => {
return /* @__PURE__ */ React10.createElement(
Tabs,
{
value: props.activeTab,
onValueChange: props.handleTabChange,
defaultValue: props.defaultTab || tabs[0].value,
dir: props.direction
},
/* @__PURE__ */ React10.createElement(TabsList, { className: "hawa-w-full" }, tabs.map((tab, index) => /* @__PURE__ */ React10.createElement(TabsTrigger, { key: index, value: tab.value }, tab.title))),
tabs.map((tab, index) => /* @__PURE__ */ React10.createElement(TabsContent, { key: index, value: tab.value }, /* @__PURE__ */ React10.createElement(
ScrollArea,
{
className: cn(
"hawa-rounded hawa-border hawa-bg-muted hawa-p-4",
props.scrollAreaClassName
)
},
tab.content
)))
);
};
// blocks/misc/EmptyState.tsx
import React11 from "react";
var EmptyState = ({ texts, onActionClick }) => {
return /* @__PURE__ */ React11.createElement(Card, null, /* @__PURE__ */ React11.createElement(CardContent, { headless: true }, /* @__PURE__ */ React11.createElement("div", { className: "hawa-flex hawa-flex-col hawa-items-center hawa-justify-center hawa-text-center" }, /* @__PURE__ */ React11.createElement("div", { className: "hawa-flex hawa-h-10 hawa-w-10 hawa-flex-col hawa-items-center hawa-justify-center hawa-rounded-3xl hawa-bg-primary hawa-text-6xl hawa-font-bold hawa-text-primary-foreground" }, /* @__PURE__ */ React11.createElement(
"svg",
{
stroke: "currentColor",
fill: "currentColor",
strokeWidth: "0",
viewBox: "0 0 512 512",
height: "0.35em",
width: "0.35em"
},
/* @__PURE__ */ React11.createElement("path", { d: "M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z" })
)), /* @__PURE__ */ React11.createElement("div", { className: "hawa-m-2 hawa-text-xl hawa-font-bold" }, (texts == null ? void 0 : texts.youreCaughtUp) || "You're all caught up"))), /* @__PURE__ */ React11.createElement(CardFooter, null, /* @__PURE__ */ React11.createElement(Button, { className: "hawa-w-full", onClick: () => onActionClick() }, (texts == null ? void 0 : texts.actionText) || "Go Home")));
};
// blocks/misc/Testimonial.tsx
import React12 from "react";
var Testimonial = () => {
return /* @__PURE__ */ React12.createElement(Card, null, /* @__PURE__ */ React12.createElement(CardContent, { headless: true }, /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement("p", { className: "mb-4 max-w-sm" }, "The team at Sikka Software is simply amazing. The tech is easy to follow, easy to work with, and infinitely flexible. The solution opportunities created by Tines are endless.")), /* @__PURE__ */ React12.createElement("div", { className: "flex flex-row gap-4" }, /* @__PURE__ */ React12.createElement("svg", { width: "48", height: "48", viewBox: "0 0 48 48", fill: "none" }, /* @__PURE__ */ React12.createElement("rect", { width: "48", height: "48", rx: "24", fill: "#45BE8B" }), /* @__PURE__ */ React12.createElement(
"path",
{
d: "M14.1412 22.4427L17.5803 16.5199C17.7671 16.1981 18.1112 16 18.4834 16H20.8581C21.653 16 22.1565 16.8528 21.7725 17.5488L19.3042 22.0225C19.2202 22.1747 19.1762 22.3458 19.1762 22.5196C19.1762 23.0879 19.6369 23.5486 20.2052 23.5486H21.5827C22.1594 23.5486 22.627 24.0162 22.627 24.5929V31.347C22.627 31.9237 22.1594 32.3913 21.5827 32.3913H15.0443C14.4676 32.3913 14 31.9237 14 31.347V22.9671C14 22.7829 14.0487 22.602 14.1412 22.4427Z",
fill: "#FFFFFF"
}
), /* @__PURE__ */ React12.createElement(
"path",
{
d: "M25.356 22.4427L28.7951 16.5199C28.982 16.1981 29.326 16 29.6982 16H32.0729C32.8679 16 33.3713 16.8528 32.9873 17.5488L30.5191 22.0225C30.4351 22.1747 30.391 22.3458 30.391 22.5196C30.391 23.0879 30.8518 23.5486 31.4201 23.5486H32.7975C33.3743 23.5486 33.8418 24.0162 33.8418 24.5929V31.347C33.8418 31.9237 33.3743 32.3913 32.7975 32.3913H26.2592C25.6824 32.3913 25.2148 31.9237 25.2148 31.347V22.9671C25.2148 22.7829 25.2636 22.602 25.356 22.4427Z",
fill: "#FFFFFF"
}
)), /* @__PURE__ */ React12.createElement("span", { className: "border border-l" }), " ", /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement("strong", null, "Brent Lassi"), /* @__PURE__ */ React12.createElement("div", null, " Chief Information Security Officer")))));
};
// blocks/misc/LeadGenerator.tsx
import React13 from "react";
import { useForm, Controller } from "react-hook-form";
var LeadGenerator = ({ texts, submitHandler }) => {
var _a;
const { handleSubmit, control, formState } = useForm();
const onSubmit = (data) => {
if (submitHandler) {
submitHandler(data.email);
} else {
console.log("handleNewsletterSub props was not provided");
}
};
return /* @__PURE__ */ React13.createElement(Card, null, /* @__PURE__ */ React13.createElement(CardHeader, null, /* @__PURE__ */ React13.createElement(CardTitle, null, texts == null ? void 0 : texts.title), /* @__PURE__ */ React13.createElement(CardDescription, null, texts == null ? void 0 : texts.subtitle)), /* @__PURE__ */ React13.createElement(CardContent, null, /* @__PURE__ */ React13.createElement(
"form",
{
noValidate: true,
className: "hawa-flex hawa-flex-row hawa-gap-2",
onSubmit: handleSubmit(onSubmit)
},
/* @__PURE__ */ React13.createElement(
Controller,
{
name: "email",
control,
rules: {
required: true,
pattern: {
value: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i,
message: (texts == null ? void 0 : texts.invalidEmail) || "Invalid email address"
}
},
defaultValue: "",
render: ({ field }) => /* @__PURE__ */ React13.createElement(Input, { ...field, type: "email", placeholder: "example@sikka.io" })
}
),
/* @__PURE__ */ React13.createElement(Button, { type: "submit", disabled: !formState.isValid }, (_a = texts == null ? void 0 : texts.submit) != null ? _a : "Submit")
)));
};
// blocks/misc/Announcement.tsx
import React14 from "react";
var Announcement = ({
onActionClick,
...props
}) => {
return /* @__PURE__ */ React14.createElement(Card, null, /* @__PURE__ */ React14.createElement(
CardContent,
{
headless: true,
className: "hawa-flex hawa-flex-row hawa-items-center hawa-justify-between"
},
/* @__PURE__ */ React14.createElement("div", { className: "hawa-flex hawa-flex-col hawa-items-start hawa-justify-center" }, /* @__PURE__ */ React14.createElement("span", { className: "hawa-text-lg hawa-font-bold" }, props.title), /* @__PURE__ */ React14.createElement("span", { className: "hawa-text-sm" }, props.subtitle)),
/* @__PURE__ */ React14.createElement(
Button,
{
onClick: () => onActionClick(),
className: "hawa-whitespace-nowrap"
},
props.actionText
)
));
};
// blocks/misc/NotFound.tsx
import React15 from "react";
var NotFound = ({ texts }) => {
return /* @__PURE__ */ React15.createElement(Card, null, /* @__PURE__ */ React15.createElement(CardContent, { headless: true }, /* @__PURE__ */ React15.createElement("div", { className: "hawa-flex hawa-flex-col hawa-items-center dark:hawa-text-white" }, /* @__PURE__ */ React15.createElement("div", { className: "hawa-text-center hawa-text-6xl hawa-font-bold" }, "404"), /* @__PURE__ */ React15.createElement("div", { className: "hawa-m-2 hawa-text-center hawa-text-xl hawa-font-bold" }, (texts == null ? void 0 : texts.pageNotFound) || "Page Not Found"), /* @__PURE__ */ React15.createElement("div", { className: "hawa-mb-4 hawa-text-center" }, (texts == null ? void 0 : texts.ifLost) || /* @__PURE__ */ React15.createElement(React15.Fragment, null, "If you're lost please contact us ", /* @__PURE__ */ React15.createElement("span", { className: "clickable-link" }, "help@sikka.io"))), /* @__PURE__ */ React15.createElement(Button, { className: "hawa-w-full" }, (texts == null ? void 0 : texts.home) || "Home"))));
};
// blocks/misc/NoPermission.tsx
import React16 from "react";
var NoPermission = ({ texts }) => {
return /* @__PURE__ */ React16.createElement(Card, null, /* @__PURE__ */ React16.createElement(CardContent, { headless: true }, /* @__PURE__ */ React16.createElement("div", { className: "hawa-flex hawa-flex-col hawa-items-center hawa-justify-center hawa-text-center" }, /* @__PURE__ */ React16.createElement("div", { className: "hawa-flex hawa-h-10 hawa-w-10 hawa-flex-col hawa-items-center hawa-justify-center hawa-rounded-3xl hawa-bg-primary hawa-text-6xl hawa-font-bold hawa-text-primary-foreground" }, /* @__PURE__ */ React16.createElement(
"svg",
{
stroke: "currentColor",
fill: "currentColor",
strokeWidth: "0",
viewBox: "0 0 448 512",
height: "0.35em",
width: "0.35em"
},
/* @__PURE__ */ React16.createElement("path", { d: "M400 224h-24v-72C376 68.2 307.8 0 224 0S72 68.2 72 152v72H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48zm-104 0H152v-72c0-39.7 32.3-72 72-72s72 32.3 72 72v72z" })
)), /* @__PURE__ */ React16.createElement("div", { className: "hawa-m-2 hawa-text-xl hawa-font-bold" }, (texts == null ? void 0 : texts.title) || "You don't have permission"), /* @__PURE__ */ React16.createElement("div", null, (texts == null ? void 0 : texts.subtitle) || "If you think this is a problem please contact your administrator or our customer support"))));
};
// blocks/misc/ContactForm.tsx
import React17 from "react";
import { useForm as useForm2, Controller as Controller2 } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import * as z from "zod";
var ContactForm = ({
cardless,
size = "default",
texts,
formId,
formAutoComplete = "off",
onSubmit,
customFields,
classNames,
...props
}) => {
var _a, _b, _c, _d, _e;
const customFieldsSchema = z.object({
...customFields == null ? void 0 : customFields.reduce(
(acc, curr) => {
switch (curr.type) {
case "text":
acc[curr.name] = z.string().optional().default("");
break;
case "number":
acc[curr.name] = z.string().optional().default("");
break;
case "select":
acc[curr.name] = z.string().optional().default("");
break;
default:
break;
}
return acc;
},
{}
)
});
const contactFormSchema = z.object({
name: z.string({ required_error: (texts == null ? void 0 : texts.name.required) || "Name is required" }).min(1, (texts == null ? void 0 : texts.name.required) || "Name is required").default(""),
email: z.string({ required_error: ((_a = texts == null ? void 0 : texts.email) == null ? void 0 : _a.required) || "Email is required" }).min(1, { message: ((_b = texts == null ? void 0 : texts.email) == null ? void 0 : _b.required) || "Email is required" }).email({ message: ((_c = texts == null ? void 0 : texts.email) == null ? void 0 : _c.invalid) || "Invalid email" }).default(""),
message: z.string({
required_error: (texts == null ? void 0 : texts.message.required) || "Message is required"
}).min(10, (texts == null ? void 0 : texts.message.invalid) || "Message is too short").default("")
});
const customFieldsDefaultValues = customFields == null ? void 0 : customFields.reduce(
(acc, curr) => {
acc[curr.name] = "";
return acc;
},
{}
);
const MainSchema = contactFormSchema.merge(customFieldsSchema);
const {
control,
handleSubmit,
formState: { errors },
reset
} = useForm2({
resolver: zodResolver(MainSchema),
defaultValues: {
name: "",
email: "",
message: "",
...customFieldsDefaultValues
}
});
const handleFormSubmit = (data) => {
if (onSubmit) {
onSubmit(data);
reset();
} else {
console.log("Form is submitted but onSubmit prop is missing");
}
};
return /* @__PURE__ */ React17.createElement(
Card,
{
className: cn(
"hawa-w-full",
cardless && "hawa-border-none hawa-bg-transparent hawa-shadow-none hawa-drop-shadow-none"
),
style: cardless ? { boxShadow: "none" } : void 0
},
/* @__PURE__ */ React17.createElement(CardContent, { headless: true, className: cardless ? "!hawa-p-0" : "" }, props.showSuccess ? /* @__PURE__ */ React17.createElement(CardHeader, null, /* @__PURE__ */ React17.createElement(CardTitle, null, ((_d = texts == null ? void 0 : texts.success) == null ? void 0 : _d.title) || "Message Sent! \u{1F389}"), /* @__PURE__ */ React17.createElement(CardDescription, null, ((_e = texts == null ? void 0 : texts.success) == null ? void 0 : _e.description) || "Thank you for your submission, we will get back to you as soon as possible.")) : /* @__PURE__ */ React17.createElement(
"form",
{
noValidate: true,
onSubmit: handleSubmit(handleFormSubmit),
className: "hawa-space-y-2",
id: formId,
autoComplete: formAutoComplete
},
/* @__PURE__ */ React17.createElement(
"div",
{
className: cn(
"hawa-flex hawa-items-start hawa-justify-start hawa-gap-2",
{
"hawa-flex-row": size === "default",
"hawa-flex-col": size === "sm"
}
)
},
/* @__PURE__ */ React17.createElement(
Controller2,
{
control,
name: "name",
render: ({ field }) => {
var _a2;
return /* @__PURE__ */ React17.createElement(
Input,
{
label: (texts == null ? void 0 : texts.name.label) || "Name",
id: texts == null ? void 0 : texts.name.label,
...field,
placeholder: texts == null ? void 0 : texts.name.placeholder,
helperText: (_a2 = errors.name) == null ? void 0 : _a2.message
}
);
}
}
),
/* @__PURE__ */ React17.createElement(
Controller2,
{
control,
name: "email",
render: ({ field }) => {
var _a2;
return /* @__PURE__ */ React17.createElement(
Input,
{
label: (texts == null ? void 0 : texts.email.label) || "Email",
id: texts == null ? void 0 : texts.email.label,
...field,
placeholder: texts == null ? void 0 : texts.email.placeholder,
helperText: (_a2 = errors.email) == null ? void 0 : _a2.message
}
);
}
}
)
),
customFields && customFields.map((customField) => {
console.log("custom", customField);
return /* @__PURE__ */ React17.createElement(
Controller2,
{
control,
name: customField.name,
render: ({ field }) => {
const { type, label, placeholder } = customField;
switch (type) {
case "text":
case "number":
return /* @__PURE__ */ React17.createElement(
Input,
{
id: customField.name,
type,
label,
placeholder,
...field
}
);
case "select":
return /* @__PURE__ */ React17.createElement(
Select,
{
label,
options: customField.options || [],
value: field.value,
onChange: (option) => field.onChange(option.value)
}
);
default:
return /* @__PURE__ */ React17.createElement("div", null, "Unknown type");
}
}
}
);
}),
/* @__PURE__ */ React17.createElement(
Controller2,
{
control,
name: "message",
render: ({ field }) => {
var _a2;
return /* @__PURE__ */ React17.createElement(
Textarea,
{
label: (texts == null ? void 0 : texts.message.label) || "Message",
id: texts == null ? void 0 : texts.message.label,
textareaProps: {
placeholder: texts == null ? void 0 : texts.message.placeholder,
className: "hawa-min-h-20",
...field
},
classNames: { textarea: "hawa-min-h-40 hawa-h-full" },
helperText: (_a2 = errors.message) == null ? void 0 : _a2.message
}
);
}
}
),
/* @__PURE__ */ React17.createElement(
Button,
{
type: "submit",
className: cn("hawa-w-full", classNames == null ? void 0 : classNames.submitButton)
},
(texts == null ? void 0 : texts.submit) || "Submit"
)
))
);
};
export {
Announcement,
ContactForm,
EmptyState,
LeadGenerator,
LegalTexts,
NoPermission,
NotFound,
Testimonial
};