@sikka/hawa 0.26.39-next → 0.27.0-next

package/dist/index.d.ts

@@ -11,6 +11,7 @@ import { VariantProps } from 'class-variance-authority';
 import { RowData, ColumnDef } from '@tanstack/react-table';
 export { ColumnDef } from '@tanstack/react-table';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
+import { Command as Command$1 } from 'cmdk';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import * as SwitchPrimitives from '@radix-ui/react-switch';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
@@ -673,47 +674,33 @@ declare const Input: React__default.ForwardRefExoticComponent<React__default.Inp
     popupContent?: React__default.ReactNode;
 } & React__default.RefAttributes<HTMLInputElement>>;
 
-declare const Command: React$1.ForwardRefExoticComponent<Omit<{
-    children?: React$1.ReactNode;
-} & React$1.HTMLAttributes<HTMLDivElement> & {
-    label?: string | undefined;
-    shouldFilter?: boolean | undefined;
-    filter?: ((value: string, search: string) => number) | undefined;
-    value?: string | undefined;
-    onValueChange?: ((value: string) => void) | undefined;
-    loop?: boolean | undefined;
-} & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+type CommandProps = React$1.ComponentPropsWithoutRef<typeof Command$1>;
 interface CommandDialogProps extends DialogProps {
 }
+interface CommandInputProps extends React$1.ComponentPropsWithoutRef<typeof Command$1.Input> {
+}
+interface CommandListProps extends React$1.ComponentPropsWithoutRef<typeof Command$1.List> {
+}
+interface CommandEmptyProps extends React$1.ComponentPropsWithoutRef<typeof Command$1.Empty> {
+}
+interface CommandGroupProps extends React$1.ComponentPropsWithoutRef<typeof Command$1.Group> {
+}
+interface CommandSeparatorProps extends React$1.ComponentPropsWithoutRef<typeof Command$1.Separator> {
+}
+interface CommandItemProps extends React$1.ComponentPropsWithoutRef<typeof Command$1.Item> {
+}
+interface CommandShortcutProps extends React$1.HTMLAttributes<HTMLSpanElement> {
+}
+declare const Command: React$1.ForwardRefExoticComponent<CommandProps & React$1.RefAttributes<React$1.ElementRef<typeof Command$1>>>;
 declare const CommandDialog: ({ children, ...props }: CommandDialogProps) => React$1.JSX.Element;
-declare const CommandInput: React$1.ForwardRefExoticComponent<Omit<Omit<React$1.InputHTMLAttributes<HTMLInputElement>, "onChange" | "type" | "value"> & {
-    value?: string | undefined;
-    onValueChange?: ((search: string) => void) | undefined;
-} & React$1.RefAttributes<HTMLInputElement>, "ref"> & React$1.RefAttributes<HTMLInputElement>>;
-declare const CommandList: React$1.ForwardRefExoticComponent<Omit<{
-    children?: React$1.ReactNode;
-} & React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare const CommandEmpty: React$1.ForwardRefExoticComponent<Omit<{
-    children?: React$1.ReactNode;
-} & React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare const CommandGroup: React$1.ForwardRefExoticComponent<Omit<{
-    children?: React$1.ReactNode;
-} & Omit<React$1.HTMLAttributes<HTMLDivElement>, "heading" | "value"> & {
-    heading?: React$1.ReactNode;
-    value?: string | undefined;
-} & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare const CommandSeparator: React$1.ForwardRefExoticComponent<Omit<React$1.HTMLAttributes<HTMLDivElement> & {
-    alwaysRender?: boolean | undefined;
-} & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare const CommandItem: React$1.ForwardRefExoticComponent<Omit<{
-    children?: React$1.ReactNode;
-} & Omit<React$1.HTMLAttributes<HTMLDivElement>, "onSelect" | "disabled" | "value"> & {
-    disabled?: boolean | undefined;
-    onSelect?: ((value: string) => void) | undefined;
-    value?: string | undefined;
-} & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+declare const CommandInput: React$1.ForwardRefExoticComponent<CommandInputProps & React$1.RefAttributes<HTMLInputElement>>;
+declare const CommandList: React$1.ForwardRefExoticComponent<CommandListProps & React$1.RefAttributes<HTMLDivElement>>;
+declare const CommandEmpty: React$1.ForwardRefExoticComponent<CommandEmptyProps & React$1.RefAttributes<HTMLDivElement>>;
+declare const CommandGroup: React$1.ForwardRefExoticComponent<CommandGroupProps & React$1.RefAttributes<HTMLDivElement>>;
+declare const CommandSeparator: React$1.ForwardRefExoticComponent<CommandSeparatorProps & React$1.RefAttributes<HTMLDivElement>>;
+declare const CommandItem: React$1.ForwardRefExoticComponent<CommandItemProps & React$1.RefAttributes<HTMLDivElement>>;
 declare const CommandShortcut: {
-    ({ className, ...props }: React$1.HTMLAttributes<HTMLSpanElement>): React$1.JSX.Element;
+    ({ className, ...props }: React$1.HTMLAttributes<HTMLSpanElement> & CommandShortcutProps): React$1.JSX.Element;
     displayName: string;
 };
 
@@ -962,9 +949,19 @@ type CodeBlockTypes = {
     fileName?: string;
     /** Code content to be displayed within the code block.*/
     code?: string;
+    /** line numbers for code block   */
     lineNumbers?: boolean;
-    forcedDarkMode?: boolean;
-    className?: string;
+    /** Wrap text in code block */
+    wrapText?: boolean;
+    /** Custom class names for the code block */
+    classNames?: {
+        root?: string;
+        tabs?: string;
+        tab?: string;
+        code?: string;
+        fileName?: string;
+        codeBlockContainer?: string;
+    };
 };
 declare const CodeBlock: FC<CodeBlockTypes>;
 
@@ -1508,6 +1505,10 @@ type RegisterFormTypes = {
     additionalButtons?: any;
     /** To add more custom input fields   */
     additionalInputs?: any;
+    /** To customize the username input field   */
+    usernameOptions: {
+        label?: LabelProps;
+    };
 };
 declare const RegisterForm: FC<RegisterFormTypes>;
 

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
                 }
               );
@@ -10941,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
               }
             );