@sikka/hawa 0.26.38-next → 0.27.0-next

package/dist/index.js

@@ -856,8 +856,11 @@ var DropdownMenu = ({
         className: cn(
           className,
           widthStyles[width],
-          "hawa-flex hawa-flex-col hawa-gap-1"
+          "hawa-flex hawa-flex-col hawa-gap-1 hawa-overflow-y-auto"
         ),
+        style: {
+          maxHeight: "var(--radix-dropdown-menu-content-available-height)"
+        },
         align,
         alignOffset
       },
@@ -1134,7 +1137,7 @@ var Accordion = React9.forwardRef(
         {
           disabled: item.disabled || false,
           className: cn(
-            "hawa-transition-all",
+            "hawa-transition-all hawa-text-start",
             design === "separated" ? "hawa-rounded data-[state=open]:hawa-rounded-b-none" : {
               "hawa-rounded-t": index === 0,
               "data-[state=closed]:hawa-rounded-b": index === items.length - 1
@@ -7120,13 +7123,30 @@ function useClipboard({ timeout = 2e3 } = {}) {
 // elements/codeBlock/CodeBlock.tsx
 (typeof global !== "undefined" ? global : window).Prism = import_prism_react_renderer.Prism;
 require("prismjs/components/prism-bash");
+var CopyIcon = () => /* @__PURE__ */ import_react30.default.createElement(
+  "svg",
+  {
+    "aria-label": "Copy",
+    stroke: "currentColor",
+    fill: "none",
+    strokeWidth: "2",
+    viewBox: "0 0 24 24",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    height: "1em",
+    width: "1em"
+  },
+  /* @__PURE__ */ import_react30.default.createElement("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
+  /* @__PURE__ */ import_react30.default.createElement("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
+);
 var CodeBlock = ({
   tabs,
   code,
   fileName,
-  className,
+  classNames,
   language = "javascript",
   // default to JavaScript if no language is provided
+  wrapText = false,
   width = "full",
   ...props
 }) => {
@@ -7144,16 +7164,50 @@ var CodeBlock = ({
     {
       className: cn(
         widthStyles[width],
-        "hawa-w-full hawa-flex-col hawa-items-center hawa-rounded hawa-bg-background hawa-text-left hawa-my-2 hawa-text-white sm:hawa-text-base",
-        className
+        "hawa-w-full hawa-flex-col hawa-relative hawa-items-center hawa-rounded hawa-bg-background hawa-text-left hawa-my-2 hawa-text-white sm:hawa-text-base",
+        classNames == null ? void 0 : classNames.root
       )
     },
+    /* @__PURE__ */ import_react30.default.createElement(
+      "div",
+      {
+        className: cn(
+          "hawa-flex hawa-absolute  hawa-w-fit hawa-flex-row hawa-items-center hawa-gap-2 hawa-z-50  hawa-right-3.5",
+          {
+            "hawa-top-3.5": !tabs && !fileName,
+            "hawa-top-[50px]": tabs && !fileName,
+            "hawa-top-11": !tabs && fileName,
+            "hawa-top-[80px]": tabs && fileName
+          }
+        )
+      },
+      /* @__PURE__ */ import_react30.default.createElement(
+        Tooltip,
+        {
+          open: clipboard.copied,
+          side: "left",
+          content: /* @__PURE__ */ import_react30.default.createElement("div", null, "Copied!"),
+          triggerProps: { asChild: true }
+        },
+        /* @__PURE__ */ import_react30.default.createElement(
+          Button,
+          {
+            size: "smallIcon",
+            onClick: () => clipboard.copy(tabs ? tabs[selectedTab].code : code),
+            variant: "outline",
+            className: "hawa-text-gray-200 hawa-opacity-50 "
+          },
+          /* @__PURE__ */ import_react30.default.createElement(CopyIcon, null)
+        )
+      )
+    ),
     fileName && /* @__PURE__ */ import_react30.default.createElement(
       "div",
       {
         className: cn(
           "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-p-2 hawa-py-0.5 hawa-pb-0 hawa-font-mono hawa-text-foreground",
-          fileName && tabs ? "hawa-bg-primary/10" : "hawa-bg-primary/15"
+          fileName && tabs ? "hawa-bg-primary/10" : "hawa-bg-primary/15",
+          classNames == null ? void 0 : classNames.fileName
         )
       },
       /* @__PURE__ */ import_react30.default.createElement(
@@ -7170,9 +7224,9 @@ var CodeBlock = ({
       "div",
       {
         className: cn(
-          // hawa-bg-gray-300 dark:hawa-bg-red-600
           "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t  hawa-p-1 hawa-bg-primary/15 hawa-pb-0 hawa-font-mono hawa-text-foreground",
-          tabs && fileName && "hawa-rounded-t-none"
+          tabs && fileName && "hawa-rounded-t-none",
+          classNames == null ? void 0 : classNames.tabs
         )
       },
       tabs.map((tab, i) => /* @__PURE__ */ import_react30.default.createElement(
@@ -7180,7 +7234,8 @@ var CodeBlock = ({
         {
           key: i,
           className: cn(
-            selectedTab === i ? " hawa-border-b-2 hawa-border-primary" : "hawa-bg-transparent"
+            selectedTab === i ? " hawa-border-b-2 hawa-border-primary" : "hawa-bg-transparent",
+            classNames == null ? void 0 : classNames.tab
           )
         },
         /* @__PURE__ */ import_react30.default.createElement(
@@ -7199,8 +7254,10 @@ var CodeBlock = ({
       "div",
       {
         className: cn(
-          "hawa-flex hawa-w-full hawa-flex-row hawa-items-start hawa-justify-between hawa-border hawa-bg-gray-800 hawa-p-0 hawa-text-left hawa-text-sm sm:hawa-text-base ",
-          tabs || fileName ? "hawa-rounded-b hawa-rounded-t-none" : "hawa-rounded"
+          "hawa-flex hawa-w-full hawa-relative hawa-flex-row hawa-items-start hawa-justify-between hawa-border hawa-bg-gray-800 hawa-p-0 hawa-text-left hawa-text-sm sm:hawa-text-base",
+          tabs || fileName ? "hawa-rounded-b hawa-rounded-t-none" : "hawa-rounded",
+          classNames == null ? void 0 : classNames.codeBlockContainer,
+          "hawa-overflow-y-auto"
         )
       },
       /* @__PURE__ */ import_react30.default.createElement(
@@ -7210,44 +7267,18 @@ var CodeBlock = ({
           code: tabs ? tabs[selectedTab].code : code || "",
           language
         },
-        ({ className: className2, style, tokens, getLineProps, getTokenProps }) => /* @__PURE__ */ import_react30.default.createElement("pre", { className: "hawa-min-h-[37.75px] hawa-w-full hawa-overflow-auto hawa-p-4 hawa-font-mono hawa-text-foreground" }, tokens.map((line, i) => /* @__PURE__ */ import_react30.default.createElement("div", { key: i, ...getLineProps({ line }) }, props.lineNumbers && /* @__PURE__ */ import_react30.default.createElement("span", { className: "hawa-mr-4" }, i + 1), line.map((token, key) => /* @__PURE__ */ import_react30.default.createElement("span", { key, ...getTokenProps({ token }) })))))
-      ),
-      /* @__PURE__ */ import_react30.default.createElement("div", { className: "hawa-flex hawa-w-fit hawa-flex-row hawa-items-center hawa-gap-2 hawa-p-2" }, /* @__PURE__ */ import_react30.default.createElement(
-        Tooltip,
-        {
-          open: clipboard.copied,
-          side: "left",
-          content: /* @__PURE__ */ import_react30.default.createElement("div", null, "Copied!"),
-          triggerProps: {
-            asChild: true
-          }
-        },
-        /* @__PURE__ */ import_react30.default.createElement(
-          Button,
+        ({ tokens, getLineProps, getTokenProps }) => /* @__PURE__ */ import_react30.default.createElement(
+          "pre",
           {
-            size: "icon",
-            onClick: () => clipboard.copy(tabs ? tabs[selectedTab].code : code),
-            variant: "outline",
-            className: "hawa-text-gray-200 hawa-opacity-50 "
+            className: cn(
+              "hawa-min-h-[37.75px] !hawa-pe-12 hawa-w-full hawa-p-4 hawa-font-mono hawa-text-foreground",
+              classNames == null ? void 0 : classNames.code,
+              wrapText && "hawa-text-wrap"
+            )
           },
-          /* @__PURE__ */ import_react30.default.createElement(
-            "svg",
-            {
-              "aria-label": "Copy",
-              stroke: "currentColor",
-              fill: "none",
-              strokeWidth: "2",
-              viewBox: "0 0 24 24",
-              strokeLinecap: "round",
-              strokeLinejoin: "round",
-              height: "1em",
-              width: "1em"
-            },
-            /* @__PURE__ */ import_react30.default.createElement("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
-            /* @__PURE__ */ import_react30.default.createElement("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
-          )
+          tokens.map((line, i) => /* @__PURE__ */ import_react30.default.createElement("div", { key: i, ...getLineProps({ line }) }, props.lineNumbers && /* @__PURE__ */ import_react30.default.createElement("span", { className: "hawa-mr-4" }, i + 1), line.map((token, key) => /* @__PURE__ */ import_react30.default.createElement("span", { key, ...getTokenProps({ token }) }))))
         )
-      ))
+      )
     )
   );
 };
@@ -9624,15 +9655,18 @@ var RegisterForm = ({
             control,
             name: "username",
             render: ({ field }) => {
-              var _a2, _b2, _c2;
+              var _a2, _b2, _c2, _d2;
               return /* @__PURE__ */ import_react47.default.createElement(
                 Input,
                 {
                   width: "full",
                   autoComplete: "username",
                   label: (_a2 = texts == null ? void 0 : texts.username) == null ? void 0 : _a2.label,
-                  helperText: (_b2 = formState.errors.username) == null ? void 0 : _b2.message,
-                  placeholder: (_c2 = texts == null ? void 0 : texts.username) == null ? void 0 : _c2.placeholder,
+                  labelProps: {
+                    ...(_b2 = props.usernameOptions) == null ? void 0 : _b2.label
+                  },
+                  helperText: (_c2 = formState.errors.username) == null ? void 0 : _c2.message,
+                  placeholder: (_d2 = texts == null ? void 0 : texts.username) == null ? void 0 : _d2.placeholder,
                   ...field
                 }
               );
@@ -10756,25 +10790,56 @@ var ContactForm = ({
   texts,
   formId,
   formAutoComplete,
-  onSubmit
+  onSubmit,
+  customFields
 }) => {
   var _a, _b, _c;
+  const customFieldsSchema = z8.object({
+    ...customFields == null ? void 0 : customFields.reduce(
+      (acc, curr) => {
+        switch (curr.type) {
+          case "text":
+            acc[curr.name] = z8.string().optional().default("");
+            break;
+          case "number":
+            acc[curr.name] = z8.string().optional().default("");
+            break;
+          case "select":
+            acc[curr.name] = z8.string().optional().default("");
+            break;
+          default:
+            break;
+        }
+        return acc;
+      },
+      {}
+    )
+  });
   const contactFormSchema = z8.object({
     name: z8.string({ required_error: texts == null ? void 0 : texts.name.required }).min(1, texts == null ? void 0 : texts.name.required).default(""),
     email: z8.string({ required_error: (_a = texts == null ? void 0 : texts.email) == null ? void 0 : _a.required }).min(1, { message: (_b = texts == null ? void 0 : texts.email) == null ? void 0 : _b.required }).email({ message: (_c = texts == null ? void 0 : texts.email) == null ? void 0 : _c.invalid }).default(""),
     message: z8.string({ required_error: texts == null ? void 0 : texts.message.required }).min(10, texts == null ? void 0 : texts.message.invalid).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
   } = (0, import_react_hook_form9.useForm)({
-    resolver: (0, import_zod8.zodResolver)(contactFormSchema),
+    resolver: (0, import_zod8.zodResolver)(MainSchema),
     defaultValues: {
       name: "",
       email: "",
-      message: ""
+      message: "",
+      ...customFieldsDefaultValues
     }
   });
   const handleFormSubmit = (data) => {
@@ -10785,15 +10850,10 @@ var ContactForm = ({
       console.log("Form is submitted but onSubmit prop is missing");
     }
   };
-  let sizeStyle = {
-    sm: "hawa-max-w-sm",
-    default: "hawa-w-full"
-  };
   return /* @__PURE__ */ import_react64.default.createElement(
     Card,
     {
       className: cn(
-        // sizeStyle[size],
         "hawa-w-full",
         cardless && "hawa-border-none hawa-bg-transparent hawa-shadow-none hawa-drop-shadow-none"
       ),
@@ -10860,6 +10920,45 @@ var ContactForm = ({
           }
         )
       ),
+      customFields && customFields.map((customField) => {
+        console.log("custom", customField);
+        return /* @__PURE__ */ import_react64.default.createElement(
+          import_react_hook_form9.Controller,
+          {
+            control,
+            name: customField.name,
+            render: ({ field }) => {
+              const { type, label, placeholder } = customField;
+              switch (type) {
+                case "text":
+                case "number":
+                  return /* @__PURE__ */ import_react64.default.createElement(
+                    Input,
+                    {
+                      id: customField.name,
+                      type,
+                      label,
+                      placeholder,
+                      ...field
+                    }
+                  );
+                case "select":
+                  return /* @__PURE__ */ import_react64.default.createElement(
+                    Select,
+                    {
+                      label,
+                      options: customField.options,
+                      value: field.value,
+                      onChange: (option) => field.onChange(option.value)
+                    }
+                  );
+                default:
+                  return /* @__PURE__ */ import_react64.default.createElement("div", null, "Unknown type");
+              }
+            }
+          }
+        );
+      }),
       /* @__PURE__ */ import_react64.default.createElement(
         import_react_hook_form9.Controller,
         {
@@ -10876,6 +10975,7 @@ var ContactForm = ({
                   placeholder: texts == null ? void 0 : texts.message.placeholder,
                   ...field
                 },
+                classNames: { textarea: "hawa-min-h-20" },
                 helperText: (_a2 = errors.message) == null ? void 0 : _a2.message
               }
             );