@sikka/hawa 0.10.20-next → 0.10.22-next

package/dist/index.css

@@ -557,6 +557,19 @@ video {
   --tw-backdrop-saturate:  ;
   --tw-backdrop-sepia:  ;
 }
+.hawa-container {
+  width: 100%;
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: 2rem;
+  padding-left: 2rem;
+}
+@media (min-width: 1400px) {
+
+  .hawa-container {
+    max-width: 1400px;
+  }
+}
 .link::after {
     content: url("data:image/svg+xml,%3Csvg stroke='%234c37eb' fill='none' stroke-width='2' viewBox='0 0 24 24' aria-hidden='true' height='1em' width='1em' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14'%3E%3C/path%3E%3C/svg%3E");
     display: inline-block;
@@ -876,6 +889,10 @@ input[type="number"]::-webkit-inner-spin-button,
   margin-left: 1rem;
   margin-right: 1rem;
 }
+.hawa-mx-auto {
+  margin-left: auto;
+  margin-right: auto;
+}
 .hawa-my-0 {
   margin-top: 0px;
   margin-bottom: 0px;
@@ -1586,6 +1603,11 @@ input[type="number"]::-webkit-inner-spin-button,
   margin-top: calc(0.375rem * calc(1 - var(--tw-space-y-reverse)));
   margin-bottom: calc(0.375rem * var(--tw-space-y-reverse));
 }
+.hawa-space-y-2 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
+}
 .hawa-space-y-4 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-y-reverse: 0;
   margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));

package/dist/index.d.mts

@@ -905,7 +905,9 @@ type CopyRightsTypes = {
 declare const Copyrights: FC<CopyRightsTypes>;
 
 type NavbarType = {
-    test?: any;
+    logo?: any;
+    buttons?: any;
+    menuItems?: any;
 };
 declare const Navbar: React__default.FC<NavbarType>;
 
@@ -957,7 +959,7 @@ type LoginFormTypes = {
     /** If true, the reset password option is hidden.   */
     withoutResetPassword?: boolean;
     /** If true, the register option is hidden.   */
-    withoutRegister?: boolean;
+    allowRegister?: boolean;
     /** If true, a loading spinner is displayed within the main form submit button.   */
     isLoading?: boolean;
     /** If true, a loading spinner is displayed within the Google login button.   */
@@ -986,6 +988,7 @@ type LoginFormTypes = {
     onTwitterLogin?: () => void;
     /** Additional buttons to add under the login button */
     additionalButtons?: any;
+    passwordLength?: number;
 };
 declare const LoginForm: FC<LoginFormTypes>;
 

package/dist/index.d.ts

@@ -905,7 +905,9 @@ type CopyRightsTypes = {
 declare const Copyrights: FC<CopyRightsTypes>;
 
 type NavbarType = {
-    test?: any;
+    logo?: any;
+    buttons?: any;
+    menuItems?: any;
 };
 declare const Navbar: React__default.FC<NavbarType>;
 
@@ -957,7 +959,7 @@ type LoginFormTypes = {
     /** If true, the reset password option is hidden.   */
     withoutResetPassword?: boolean;
     /** If true, the register option is hidden.   */
-    withoutRegister?: boolean;
+    allowRegister?: boolean;
     /** If true, a loading spinner is displayed within the main form submit button.   */
     isLoading?: boolean;
     /** If true, a loading spinner is displayed within the Google login button.   */
@@ -986,6 +988,7 @@ type LoginFormTypes = {
     onTwitterLogin?: () => void;
     /** Additional buttons to add under the login button */
     additionalButtons?: any;
+    passwordLength?: number;
 };
 declare const LoginForm: FC<LoginFormTypes>;
 

package/dist/index.js

@@ -6853,33 +6853,62 @@ var Copyrights = function(props) {
 };
 // components/layout/Navbar.tsx
 var import_react37 = __toESM(require("react"));
-var Navbar = function(_param) {
-    var test = _param.test, props = _object_without_properties(_param, [
-        "test"
-    ]);
-    return /* @__PURE__ */ import_react37.default.createElement("div", {
-        className: "hawa-flex hawa-flex-row hawa-justify-between hawa-items-center hawa-bg-card hawa-p-4 hawa-rounded hawa-border"
-    }, /* @__PURE__ */ import_react37.default.createElement("div", null, /* @__PURE__ */ import_react37.default.createElement(Logos.sikka, {
-        className: "hawa-h-8 hawa-w-8"
-    })), /* @__PURE__ */ import_react37.default.createElement("div", null, /* @__PURE__ */ import_react37.default.createElement(NavigationMenu, {
-        direction: "ltr",
-        rootClassNames: "hawa-w-fit",
-        viewportClassNames: "hawa-max-w-md",
-        items: [
-            {
-                trigger: "item 2",
-                action: function() {
-                    return console.log("clicked on item");
-                }
-            },
-            {
-                trigger: "item 3",
-                content: /* @__PURE__ */ import_react37.default.createElement("div", {
-                    className: "hawa-p-4"
-                }, "something here")
-            }
-        ]
-    })), /* @__PURE__ */ import_react37.default.createElement("div", null, /* @__PURE__ */ import_react37.default.createElement(Button, null, "Login")));
+// components/elements/Collapsible.tsx
+var CollapsiblePrimitive = __toESM(require("@radix-ui/react-collapsible"));
+var Collapsible = CollapsiblePrimitive.Root;
+var CollapsibleTrigger2 = CollapsiblePrimitive.CollapsibleTrigger;
+var CollapsibleContent2 = CollapsiblePrimitive.CollapsibleContent;
+// components/layout/Navbar.tsx
+var Navbar = function(props) {
+    var _ref = _sliced_to_array((0, import_react37.useState)(false), 2), isOpen = _ref[0], setIsOpen = _ref[1];
+    return /* @__PURE__ */ import_react37.default.createElement("nav", {
+        className: "hawa-bg-gray-800 hawa-p-4 hawa-transition-all"
+    }, /* @__PURE__ */ import_react37.default.createElement(Collapsible, null, /* @__PURE__ */ import_react37.default.createElement("div", {
+        className: "hawa-container hawa-mx-auto hawa-flex hawa-justify-between hawa-items-center"
+    }, /* @__PURE__ */ import_react37.default.createElement("div", {
+        className: "hawa-flex hawa-items-center"
+    }, /* @__PURE__ */ import_react37.default.createElement("a", {
+        href: "/",
+        className: "hawa-text-white hawa-text-xl hawa-font-bold"
+    }, "YourLogo")), /* @__PURE__ */ import_react37.default.createElement("div", {
+        className: "hawa-hidden hawa-md:hawa-flex hawa-space-x-4"
+    }, /* @__PURE__ */ import_react37.default.createElement("a", {
+        href: "/about",
+        className: "hawa-text-white"
+    }, "About"), /* @__PURE__ */ import_react37.default.createElement("a", {
+        href: "/services",
+        className: "hawa-text-white"
+    }, "Services"), /* @__PURE__ */ import_react37.default.createElement("a", {
+        href: "/contact",
+        className: "hawa-text-white"
+    }, "Contact")), /* @__PURE__ */ import_react37.default.createElement("div", {
+        className: "hawa-md:hawa-hidden"
+    }, /* @__PURE__ */ import_react37.default.createElement(CollapsibleTrigger2, {
+        className: "hawa-text-white hawa-p-2",
+        "aria-label": "Toggle menu"
+    }, /* @__PURE__ */ import_react37.default.createElement("svg", {
+        className: "hawa-w-6 hawa-h-6",
+        fill: "none",
+        stroke: "currentColor",
+        viewBox: "0 0 24 24",
+        xmlns: "http://www.w3.org/2000/svg"
+    }, /* @__PURE__ */ import_react37.default.createElement("path", {
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: "2",
+        d: "M4 6h16M4 12h16m-7 6h7"
+    }))))), /* @__PURE__ */ import_react37.default.createElement(CollapsibleContent2, {
+        className: "hwa-transition-all hawa-fade-in-0   data-[state=open]:hawa-zoom-in-95 data-[state=open]:hawa-animate-in hawa-flex hawa-flex-col hawa-space-y-2 hawa-mt-4"
+    }, /* @__PURE__ */ import_react37.default.createElement("a", {
+        href: "/about",
+        className: "hawa-text-white hawa-px-2"
+    }, "About"), /* @__PURE__ */ import_react37.default.createElement("a", {
+        href: "/services",
+        className: "hawa-text-white hawa-px-2"
+    }, "Services"), /* @__PURE__ */ import_react37.default.createElement("a", {
+        href: "/contact",
+        className: "hawa-text-white hawa-px-2"
+    }, "Contact"))));
 };
 // components/blocks/auth/LoginForm.tsx
 var import_react38 = __toESM(require("react"));
@@ -6888,9 +6917,10 @@ var import_zod = require("@hookform/resolvers/zod");
 var import_libphonenumber_js = require("libphonenumber-js");
 var z = __toESM(require("zod"));
 var LoginForm = function(_param) {
-    var loginType = _param.loginType, texts = _param.texts, props = _object_without_properties(_param, [
+    var loginType = _param.loginType, texts = _param.texts, _param_passwordLength = _param.passwordLength, passwordLength = _param_passwordLength === void 0 ? 8 : _param_passwordLength, props = _object_without_properties(_param, [
         "loginType",
-        "texts"
+        "texts",
+        "passwordLength"
     ]);
     var formSchema;
     if (loginType === "email") {
@@ -6906,7 +6936,7 @@ var LoginForm = function(_param) {
                 required_error: texts === null || texts === void 0 ? void 0 : texts.passwordRequired
             }).min(1, {
                 message: texts === null || texts === void 0 ? void 0 : texts.passwordRequired
-            }).min(8, {
+            }).min(passwordLength, {
                 message: texts === null || texts === void 0 ? void 0 : texts.passwordTooShort
             })
         });
@@ -6926,7 +6956,7 @@ var LoginForm = function(_param) {
                 required_error: texts === null || texts === void 0 ? void 0 : texts.passwordRequired
             }).min(1, {
                 message: texts === null || texts === void 0 ? void 0 : texts.passwordRequired
-            }).min(8, {
+            }).min(passwordLength, {
                 message: texts === null || texts === void 0 ? void 0 : texts.passwordTooShort
             })
         });
@@ -7089,7 +7119,7 @@ var LoginForm = function(_param) {
         className: "hawa-mt-0 hawa-w-full",
         type: "submit",
         isLoading: props.isLoading
-    }, (texts === null || texts === void 0 ? void 0 : texts.loginText) || "Login"), props.additionalButtons, !props.withoutRegister && /* @__PURE__ */ import_react38.default.createElement("div", {
+    }, (texts === null || texts === void 0 ? void 0 : texts.loginText) || "Login"), props.additionalButtons, props.allowRegister && /* @__PURE__ */ import_react38.default.createElement("div", {
         className: "hawa-p-3 hawa-text-center hawa-text-sm hawa-font-normal hawa-select-none dark:hawa-text-gray-300"
     }, (texts === null || texts === void 0 ? void 0 : texts.newUserText) || "New user?", " ", /* @__PURE__ */ import_react38.default.createElement("span", {
         onClick: props.onRouteToRegister,

package/dist/index.mjs

@@ -6733,26 +6733,43 @@ var Copyrights = (props) => {
 };
 
 // components/layout/Navbar.tsx
-import React57 from "react";
-var Navbar = ({ test, ...props }) => {
-  return /* @__PURE__ */ React57.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between hawa-items-center hawa-bg-card hawa-p-4 hawa-rounded hawa-border" }, /* @__PURE__ */ React57.createElement("div", null, /* @__PURE__ */ React57.createElement(Logos.sikka, { className: "hawa-h-8 hawa-w-8" })), /* @__PURE__ */ React57.createElement("div", null, /* @__PURE__ */ React57.createElement(
-    NavigationMenu,
-    {
-      direction: "ltr",
-      rootClassNames: "hawa-w-fit",
-      viewportClassNames: "hawa-max-w-md",
-      items: [
-        {
-          trigger: "item 2",
-          action: () => console.log("clicked on item")
-        },
+import React57, { useState as useState21 } from "react";
+
+// components/elements/Collapsible.tsx
+import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
+var Collapsible = CollapsiblePrimitive.Root;
+var CollapsibleTrigger2 = CollapsiblePrimitive.CollapsibleTrigger;
+var CollapsibleContent2 = CollapsiblePrimitive.CollapsibleContent;
+
+// components/layout/Navbar.tsx
+var Navbar = (props) => {
+  const [isOpen, setIsOpen] = useState21(false);
+  return /* @__PURE__ */ React57.createElement("nav", { className: "hawa-bg-gray-800 hawa-p-4 hawa-transition-all" }, /* @__PURE__ */ React57.createElement(Collapsible, null, /* @__PURE__ */ React57.createElement("div", { className: "hawa-container hawa-mx-auto hawa-flex hawa-justify-between hawa-items-center" }, /* @__PURE__ */ React57.createElement("div", { className: "hawa-flex hawa-items-center" }, /* @__PURE__ */ React57.createElement("a", { href: "/", className: "hawa-text-white hawa-text-xl hawa-font-bold" }, "YourLogo")), /* @__PURE__ */ React57.createElement("div", { className: "hawa-hidden hawa-md:hawa-flex hawa-space-x-4" }, /* @__PURE__ */ React57.createElement("a", { href: "/about", className: "hawa-text-white" }, "About"), /* @__PURE__ */ React57.createElement("a", { href: "/services", className: "hawa-text-white" }, "Services"), /* @__PURE__ */ React57.createElement("a", { href: "/contact", className: "hawa-text-white" }, "Contact")), /* @__PURE__ */ React57.createElement("div", { className: "hawa-md:hawa-hidden" }, /* @__PURE__ */ React57.createElement(
+    CollapsibleTrigger2,
+    {
+      className: "hawa-text-white hawa-p-2",
+      "aria-label": "Toggle menu"
+    },
+    /* @__PURE__ */ React57.createElement(
+      "svg",
+      {
+        className: "hawa-w-6 hawa-h-6",
+        fill: "none",
+        stroke: "currentColor",
+        viewBox: "0 0 24 24",
+        xmlns: "http://www.w3.org/2000/svg"
+      },
+      /* @__PURE__ */ React57.createElement(
+        "path",
         {
-          trigger: "item 3",
-          content: /* @__PURE__ */ React57.createElement("div", { className: "hawa-p-4" }, "something here")
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "2",
+          d: "M4 6h16M4 12h16m-7 6h7"
         }
-      ]
-    }
-  )), /* @__PURE__ */ React57.createElement("div", null, /* @__PURE__ */ React57.createElement(Button, null, "Login")));
+      )
+    )
+  ))), /* @__PURE__ */ React57.createElement(CollapsibleContent2, { className: "hwa-transition-all hawa-fade-in-0   data-[state=open]:hawa-zoom-in-95 data-[state=open]:hawa-animate-in hawa-flex hawa-flex-col hawa-space-y-2 hawa-mt-4" }, /* @__PURE__ */ React57.createElement("a", { href: "/about", className: "hawa-text-white hawa-px-2" }, "About"), /* @__PURE__ */ React57.createElement("a", { href: "/services", className: "hawa-text-white hawa-px-2" }, "Services"), /* @__PURE__ */ React57.createElement("a", { href: "/contact", className: "hawa-text-white hawa-px-2" }, "Contact"))));
 };
 
 // components/blocks/auth/LoginForm.tsx
@@ -6764,13 +6781,14 @@ import * as z from "zod";
 var LoginForm = ({
   loginType,
   texts,
+  passwordLength = 8,
   ...props
 }) => {
   let formSchema;
   if (loginType === "email") {
     formSchema = z.object({
       email: z.string({ required_error: texts?.emailRequired }).min(1, { message: texts?.emailRequired }).email({ message: texts?.emailInvalid }),
-      password: z.string({ required_error: texts?.passwordRequired }).min(1, { message: texts?.passwordRequired }).min(8, { message: texts?.passwordTooShort })
+      password: z.string({ required_error: texts?.passwordRequired }).min(1, { message: texts?.passwordRequired }).min(passwordLength, { message: texts?.passwordTooShort })
     });
   } else if (loginType === "username") {
     formSchema = z.object({
@@ -6781,7 +6799,7 @@ var LoginForm = ({
         },
         { message: texts?.usernameInvalid }
       ),
-      password: z.string({ required_error: texts?.passwordRequired }).min(1, { message: texts?.passwordRequired }).min(8, { message: texts?.passwordTooShort })
+      password: z.string({ required_error: texts?.passwordRequired }).min(1, { message: texts?.passwordRequired }).min(passwordLength, { message: texts?.passwordTooShort })
     });
   } else if (loginType === "phone") {
     formSchema = z.object({
@@ -6965,7 +6983,7 @@ var LoginForm = ({
       texts?.loginText || "Login"
     ),
     props.additionalButtons,
-    !props.withoutRegister && /* @__PURE__ */ React58.createElement("div", { className: "hawa-p-3 hawa-text-center hawa-text-sm hawa-font-normal hawa-select-none dark:hawa-text-gray-300" }, texts?.newUserText || "New user?", " ", /* @__PURE__ */ React58.createElement(
+    props.allowRegister && /* @__PURE__ */ React58.createElement("div", { className: "hawa-p-3 hawa-text-center hawa-text-sm hawa-font-normal hawa-select-none dark:hawa-text-gray-300" }, texts?.newUserText || "New user?", " ", /* @__PURE__ */ React58.createElement(
       "span",
       {
         onClick: props.onRouteToRegister,
@@ -7486,7 +7504,7 @@ var CheckEmail = ({ texts, handleResend }) => {
 };
 
 // components/blocks/auth/NewPassword.tsx
-import React62, { useState as useState22 } from "react";
+import React62, { useState as useState23 } from "react";
 import { Controller as Controller4, useForm as useForm3 } from "react-hook-form";
 import { zodResolver as zodResolver3 } from "@hookform/resolvers/zod";
 import * as z3 from "zod";
@@ -7503,7 +7521,7 @@ var NewPasswordForm = ({ texts, ...props }) => {
   const { handleSubmit, control, formState } = useForm3({
     resolver: zodResolver3(formSchema)
   });
-  const [matchError, setMatchError] = useState22(false);
+  const [matchError, setMatchError] = useState23(false);
   return /* @__PURE__ */ React62.createElement(Card, { dir: props.direction }, matchError && /* @__PURE__ */ React62.createElement(Alert, { text: texts?.passwordMatchError, severity: "error" }), props.passwordChanged ? /* @__PURE__ */ React62.createElement(CardContent, { headless: true }, /* @__PURE__ */ React62.createElement("div", { className: "hawa-text-center" }, texts?.passwordChanged)) : /* @__PURE__ */ React62.createElement(
     "form",
     {
@@ -7676,17 +7694,17 @@ var CodeConfirmation = (props) => {
 };
 
 // components/blocks/feedback/UserReferralSource.tsx
-import React65, { useEffect as useEffect15, useRef as useRef8, useState as useState24 } from "react";
+import React65, { useEffect as useEffect15, useRef as useRef8, useState as useState25 } from "react";
 import clsx12 from "clsx";
 var UserReferralSource = ({
   position = "bottom-right",
   options = [],
   ...props
 }) => {
-  const [closed, setClosed] = useState24(false);
-  const [answered, setAnswered] = useState24(false);
-  const [clickedOption, setClickedOption] = useState24(null);
-  const [closingTimer, setClosingTimer] = useState24(5);
+  const [closed, setClosed] = useState25(false);
+  const [answered, setAnswered] = useState25(false);
+  const [clickedOption, setClickedOption] = useState25(null);
+  const [closingTimer, setClosingTimer] = useState25(5);
   const popUpRef = useRef8(null);
   const boxPosition = {
     "bottom-right": "hawa-right-4",
@@ -7762,16 +7780,16 @@ var UserReferralSource = ({
 };
 
 // components/blocks/feedback/FeedbackRating.tsx
-import React66, { useEffect as useEffect16, useRef as useRef9, useState as useState25 } from "react";
+import React66, { useEffect as useEffect16, useRef as useRef9, useState as useState26 } from "react";
 import clsx13 from "clsx";
 var FeedbackRating = ({
   position = "bottom-right",
   ...props
 }) => {
-  const [closed, setClosed] = useState25(false);
-  const [answered, setAnswered] = useState25(false);
-  const [clickedOption, setClickedOption] = useState25(null);
-  const [closingTimer, setClosingTimer] = useState25(5);
+  const [closed, setClosed] = useState26(false);
+  const [answered, setAnswered] = useState26(false);
+  const [clickedOption, setClickedOption] = useState26(null);
+  const [closingTimer, setClosingTimer] = useState26(5);
   const popUpRef = useRef9(null);
   const boxPosition = {
     "bottom-right": "hawa-right-4",
@@ -7876,12 +7894,12 @@ var FeedbackRating = ({
 };
 
 // components/blocks/feedback/FeedbackEmoji.tsx
-import React67, { useState as useState26 } from "react";
+import React67, { useState as useState27 } from "react";
 var FeedbackEmoji = (props) => {
-  const [selectedEmoji, setSelectedEmoji] = useState26(null);
-  const [loadingSubmit, setLoadingSubmit] = useState26(false);
-  const [feedbackText, setFeedbackText] = useState26("");
-  const [helperText, setHelperText] = useState26(false);
+  const [selectedEmoji, setSelectedEmoji] = useState27(null);
+  const [loadingSubmit, setLoadingSubmit] = useState27(false);
+  const [feedbackText, setFeedbackText] = useState27("");
+  const [helperText, setHelperText] = useState27(false);
   let emojis = [
     { icon: /* @__PURE__ */ React67.createElement(VeryGoodEmoji, null), value: "very-good" },
     { icon: /* @__PURE__ */ React67.createElement(GoodEmoji, null), value: "good" },
@@ -8342,7 +8360,7 @@ var PricingPlans = (props) => {
 };
 
 // components/blocks/pricing/ComparingPlans.tsx
-import React77, { useState as useState27 } from "react";
+import React77, { useState as useState28 } from "react";
 var CheckMark = () => /* @__PURE__ */ React77.createElement(
   "svg",
   {
@@ -8378,8 +8396,8 @@ var UncheckMark = () => /* @__PURE__ */ React77.createElement(
   )
 );
 var ComparingPlans = (props) => {
-  const [currentCurrency, setCurrentCurrency] = useState27("sar");
-  const [currentCycle, setCurrentCycle] = useState27("month");
+  const [currentCurrency, setCurrentCurrency] = useState28("sar");
+  const [currentCycle, setCurrentCycle] = useState28("month");
   return /* @__PURE__ */ React77.createElement("div", { id: "detailed-pricing", className: "hawa-w-full hawa-overflow-x-auto" }, /* @__PURE__ */ React77.createElement("div", { className: "hawa-mb-2 hawa-flex hawa-w-full hawa-justify-between" }, /* @__PURE__ */ React77.createElement(
     Radio,
     {
@@ -8437,10 +8455,10 @@ var ComparingPlans = (props) => {
 };
 
 // components/blocks/pricing/HorizontalPricing.tsx
-import React78, { useState as useState28 } from "react";
+import React78, { useState as useState29 } from "react";
 import clsx14 from "clsx";
 var HorizontalPricing = (props) => {
-  const [selectedCard, setSelectedCard] = useState28("");
+  const [selectedCard, setSelectedCard] = useState29("");
   let data = [
     { title: "basic", price: "$49", cycle: "/mo" },
     { title: "business", price: "$99", cycle: "/mo" },
@@ -8551,18 +8569,18 @@ var Usage = (props) => {
 };
 
 // components/hooks/useDiscloser.ts
-import { useState as useState29 } from "react";
+import { useState as useState30 } from "react";
 
 // components/hooks/useHover.ts
-import { useEffect as useEffect17, useRef as useRef10, useState as useState30 } from "react";
+import { useEffect as useEffect17, useRef as useRef10, useState as useState31 } from "react";
 
 // components/hooks/useCarousel.ts
-import { useState as useState31, useRef as useRef11 } from "react";
+import { useState as useState32, useRef as useRef11 } from "react";
 
 // components/hooks/useWindowSize.ts
-import { useEffect as useEffect18, useState as useState32 } from "react";
+import { useEffect as useEffect18, useState as useState33 } from "react";
 var useWindowSize = () => {
-  const [windowSize, setWindowSize] = useState32({
+  const [windowSize, setWindowSize] = useState33({
     width: void 0,
     height: void 0
   });
@@ -8581,7 +8599,7 @@ var useWindowSize = () => {
 };
 
 // components/hooks/useFocusWithin.ts
-import { useRef as useRef12, useState as useState33, useEffect as useEffect19 } from "react";
+import { useRef as useRef12, useState as useState34, useEffect as useEffect19 } from "react";
 function containsRelatedTarget(event) {
   if (event.currentTarget instanceof HTMLElement && event.relatedTarget instanceof HTMLElement) {
     return event.currentTarget.contains(event.relatedTarget);
@@ -8593,7 +8611,7 @@ function useFocusWithin({
   onFocus
 } = {}) {
   const ref = useRef12(null);
-  const [focused, _setFocused] = useState33(false);
+  const [focused, _setFocused] = useState34(false);
   const focusedRef = useRef12(false);
   const setFocused = (value) => {
     _setFocused(value);
@@ -8626,7 +8644,7 @@ function useFocusWithin({
 }
 
 // components/hooks/useMediaQuery.ts
-import { useState as useState34, useEffect as useEffect20, useRef as useRef13 } from "react";
+import { useState as useState35, useEffect as useEffect20, useRef as useRef13 } from "react";
 function attachMediaListener(query, callback) {
   try {
     query.addEventListener("change", callback);
@@ -8648,7 +8666,7 @@ function getInitialValue(query, initialValue) {
 function useMediaQuery(query, initialValue, { getInitialValueInEffect } = {
   getInitialValueInEffect: true
 }) {
-  const [matches, setMatches] = useState34(
+  const [matches, setMatches] = useState35(
     getInitialValueInEffect ? initialValue : getInitialValue(query, initialValue)
   );
   const queryRef = useRef13();
@@ -8667,15 +8685,15 @@ function useMediaQuery(query, initialValue, { getInitialValueInEffect } = {
 }
 
 // components/hooks/useScrollPosition.ts
-import { useState as useState35, useEffect as useEffect21 } from "react";
+import { useState as useState36, useEffect as useEffect21 } from "react";
 
 // components/hooks/useTable.ts
-import { useState as useState36, useEffect as useEffect22 } from "react";
+import { useState as useState37, useEffect as useEffect22 } from "react";
 
 // components/hooks/useTabs.ts
-import { useEffect as useEffect23, useState as useState37 } from "react";
+import { useEffect as useEffect23, useState as useState38 } from "react";
 function useTabs(initialTab = "") {
-  const [activeTab, setActiveTab] = useState37(initialTab);
+  const [activeTab, setActiveTab] = useState38(initialTab);
   useEffect23(() => {
     const handleHashChange = () => {
       const hash = window.location.hash.substring(1);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sikka/hawa",
-  "version": "0.10.20-next",
+  "version": "0.10.22-next",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "exports": {
@@ -28,6 +28,7 @@
     "@hookform/resolvers": "^3.3.1",
     "@radix-ui/react-accordion": "^1.1.2",
     "@radix-ui/react-checkbox": "^1.0.4",
+    "@radix-ui/react-collapsible": "^1.0.3",
     "@radix-ui/react-dialog": "^1.0.5",
     "@radix-ui/react-dropdown-menu": "^2.0.6",
     "@radix-ui/react-label": "^2.0.2",