@sikka/hawa 0.26.39-next → 0.27.0-next

package/dist/elements/index.js

@@ -790,8 +790,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
       },
@@ -1068,7 +1071,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
@@ -6964,13 +6967,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
 }) => {
@@ -6988,16 +7008,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(
@@ -7014,9 +7068,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(
@@ -7024,7 +7078,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(
@@ -7043,8 +7098,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(
@@ -7054,44 +7111,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 }) }))))
         )
-      ))
+      )
     )
   );
 };

package/dist/elements/index.mjs

@@ -27,7 +27,7 @@ import {
   TabsTrigger,
   Textarea,
   UncheckMark
-} from "../chunk-VCCUBQFI.mjs";
+} from "../chunk-U7BFMH2T.mjs";
 import {
   Sheet,
   SheetClose,
@@ -39,7 +39,7 @@ import {
   SheetPortal,
   SheetTitle,
   SheetTrigger
-} from "../chunk-AXTPTA3S.mjs";
+} from "../chunk-BOVZAUWD.mjs";
 import {
   Button,
   Card,
@@ -73,7 +73,7 @@ import {
   buttonVariants,
   calculateLuminance,
   cn
-} from "../chunk-D3KUSRHL.mjs";
+} from "../chunk-3MC4JLSW.mjs";
 import {
   __require
 } from "../chunk-ZFXKCRJC.mjs";
@@ -164,7 +164,7 @@ var Accordion = React3.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
@@ -2640,20 +2640,33 @@ var ScrollIndicator = ({
 
 // elements/codeBlock/CodeBlock.tsx
 import React27, { useState as useState11 } from "react";
-import {
-  Highlight,
-  themes,
-  Prism
-} from "prism-react-renderer";
+import { Highlight, themes, Prism } from "prism-react-renderer";
 (typeof global !== "undefined" ? global : window).Prism = Prism;
 __require("prismjs/components/prism-bash");
+var CopyIcon = () => /* @__PURE__ */ React27.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__ */ React27.createElement("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
+  /* @__PURE__ */ React27.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
 }) => {
@@ -2671,16 +2684,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__ */ React27.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__ */ React27.createElement(
+        Tooltip,
+        {
+          open: clipboard.copied,
+          side: "left",
+          content: /* @__PURE__ */ React27.createElement("div", null, "Copied!"),
+          triggerProps: { asChild: true }
+        },
+        /* @__PURE__ */ React27.createElement(
+          Button,
+          {
+            size: "smallIcon",
+            onClick: () => clipboard.copy(tabs ? tabs[selectedTab].code : code),
+            variant: "outline",
+            className: "hawa-text-gray-200 hawa-opacity-50 "
+          },
+          /* @__PURE__ */ React27.createElement(CopyIcon, null)
+        )
+      )
+    ),
     fileName && /* @__PURE__ */ React27.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__ */ React27.createElement(
@@ -2697,9 +2744,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__ */ React27.createElement(
@@ -2707,7 +2754,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__ */ React27.createElement(
@@ -2726,8 +2774,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__ */ React27.createElement(
@@ -2737,50 +2787,24 @@ var CodeBlock = ({
           code: tabs ? tabs[selectedTab].code : code || "",
           language
         },
-        ({ className: className2, style, tokens, getLineProps, getTokenProps }) => /* @__PURE__ */ React27.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__ */ React27.createElement("div", { key: i, ...getLineProps({ line }) }, props.lineNumbers && /* @__PURE__ */ React27.createElement("span", { className: "hawa-mr-4" }, i + 1), line.map((token, key) => /* @__PURE__ */ React27.createElement("span", { key, ...getTokenProps({ token }) })))))
-      ),
-      /* @__PURE__ */ React27.createElement("div", { className: "hawa-flex hawa-w-fit hawa-flex-row hawa-items-center hawa-gap-2 hawa-p-2" }, /* @__PURE__ */ React27.createElement(
-        Tooltip,
-        {
-          open: clipboard.copied,
-          side: "left",
-          content: /* @__PURE__ */ React27.createElement("div", null, "Copied!"),
-          triggerProps: {
-            asChild: true
-          }
-        },
-        /* @__PURE__ */ React27.createElement(
-          Button,
+        ({ tokens, getLineProps, getTokenProps }) => /* @__PURE__ */ React27.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__ */ React27.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__ */ React27.createElement("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
-            /* @__PURE__ */ React27.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__ */ React27.createElement("div", { key: i, ...getLineProps({ line }) }, props.lineNumbers && /* @__PURE__ */ React27.createElement("span", { className: "hawa-mr-4" }, i + 1), line.map((token, key) => /* @__PURE__ */ React27.createElement("span", { key, ...getTokenProps({ token }) }))))
         )
-      ))
+      )
     )
   );
 };
 
 // elements/carousel/Carousel.tsx
-import React28, { useEffect as useEffect10, useState as useState12 } from "react";
+import React28, { useEffect as useEffect9, useState as useState12 } from "react";
 import useEmblaCarousel from "embla-carousel-react";
 var Carousel = ({
   items,
@@ -2797,7 +2821,7 @@ var Carousel = ({
     loop: autoplay ? true : (options == null ? void 0 : options.loop) || false
   });
   const [selectedIndex, setSelectedIndex] = useState12(0);
-  useEffect10(() => {
+  useEffect9(() => {
     function selectHandler() {
       const index = emblaApi == null ? void 0 : emblaApi.selectedScrollSnap();
       setSelectedIndex(index || 0);
@@ -2807,7 +2831,7 @@ var Carousel = ({
       emblaApi == null ? void 0 : emblaApi.off("select", selectHandler);
     };
   }, [emblaApi]);
-  useEffect10(() => {
+  useEffect9(() => {
     let autoplayTimer;
     if (autoplay && emblaApi) {
       autoplayTimer = setInterval(() => {

package/dist/index.css

@@ -1028,6 +1028,12 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-right-2\.5 {
   right: 0.625rem;
 }
+.hawa-right-3 {
+  right: 0.75rem;
+}
+.hawa-right-3\.5 {
+  right: 0.875rem;
+}
 .hawa-right-4 {
   right: 1rem;
 }
@@ -1046,6 +1052,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-top-1\/2 {
   top: 50%;
 }
+.hawa-top-11 {
+  top: 2.75rem;
+}
 .hawa-top-14 {
   top: 3.5rem;
 }
@@ -1055,6 +1064,12 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-top-2\.5 {
   top: 0.625rem;
 }
+.hawa-top-3 {
+  top: 0.75rem;
+}
+.hawa-top-3\.5 {
+  top: 0.875rem;
+}
 .hawa-top-4 {
   top: 1rem;
 }
@@ -1070,6 +1085,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-top-\[50\%\] {
   top: 50%;
 }
+.hawa-top-\[50px\] {
+  top: 50px;
+}
 .hawa-top-\[60\%\] {
   top: 60%;
 }
@@ -1082,6 +1100,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-top-\[72px\] {
   top: 72px;
 }
+.hawa-top-\[80px\] {
+  top: 80px;
+}
 .hawa-top-full {
   top: 100%;
 }
@@ -1439,6 +1460,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-max-h-screen {
   max-height: 100vh;
 }
+.hawa-min-h-20 {
+  min-height: 5rem;
+}
 .hawa-min-h-\[25px\] {
   min-height: 25px;
 }
@@ -1936,6 +1960,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-whitespace-nowrap {
   white-space: nowrap;
 }
+.hawa-text-wrap {
+  text-wrap: wrap;
+}
 .hawa-rounded {
   border-radius: var(--radius);
 }
@@ -2106,9 +2133,6 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-bg-background {
   background-color: hsl(var(--background));
 }
-.hawa-bg-background\/70 {
-  background-color: hsl(var(--background) / 0.7);
-}
 .hawa-bg-background\/80 {
   background-color: hsl(var(--background) / 0.8);
 }
@@ -2156,10 +2180,6 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-bg-opacity: 1;
   background-color: rgb(229 231 235 / var(--tw-bg-opacity));
 }
-.hawa-bg-gray-300 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(209 213 219 / var(--tw-bg-opacity));
-}
 .hawa-bg-gray-400 {
   --tw-bg-opacity: 1;
   background-color: rgb(156 163 175 / var(--tw-bg-opacity));
@@ -2492,6 +2512,9 @@ input[type="number"]::-webkit-inner-spin-button,
   padding-top: 1.5rem;
   padding-bottom: 1.5rem;
 }
+.\!hawa-pe-12 {
+  padding-inline-end: 3rem !important;
+}
 .hawa-pb-0 {
   padding-bottom: 0px;
 }
@@ -3824,10 +3847,6 @@ body {
   --tw-bg-opacity: 1;
   background-color: rgb(248 113 113 / var(--tw-bg-opacity));
 }
-:is(.hawa-dark .dark\:hawa-bg-red-600) {
-  --tw-bg-opacity: 1;
-  background-color: rgb(220 38 38 / var(--tw-bg-opacity));
-}
 :is(.hawa-dark .dark\:hawa-bg-white) {
   --tw-bg-opacity: 1;
   background-color: rgb(255 255 255 / var(--tw-bg-opacity));

package/dist/index.d.mts

@@ -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>;