@sikka/hawa 0.26.21 → 0.26.23

package/dist/blocks/feedback/index.mjs

@@ -1,25 +1,26 @@
 import {
   Textarea
-} from "../../chunk-APZM24KK.mjs";
+} from "../../chunk-5YXZXYLH.mjs";
 import {
   Select
-} from "../../chunk-4IOG44R3.mjs";
+} from "../../chunk-OY66MBXP.mjs";
+import "../../chunk-WUHNPHD5.mjs";
 import {
   Radio
-} from "../../chunk-OAXF3RCQ.mjs";
+} from "../../chunk-NMS5LCSQ.mjs";
 import {
   BadEmoji,
   GoodEmoji,
   VeryBadEmoji,
   VeryGoodEmoji
-} from "../../chunk-U3TZWNDZ.mjs";
+} from "../../chunk-GVJYACGA.mjs";
 import {
   Button,
   Card,
   CardContent,
   Label,
   cn
-} from "../../chunk-AREFDTXK.mjs";
+} from "../../chunk-D36MPDGE.mjs";
 
 // blocks/feedback/UserReferralSource.tsx
 import React, { useRef, useState } from "react";

package/dist/blocks/index.js

@@ -4547,6 +4547,7 @@ var Textarea = React27.forwardRef(
     forceHideHelperText,
     textareaProps,
     countPosition = "bottom",
+    isLoading,
     ...props
   }, ref) => {
     return /* @__PURE__ */ React27.createElement(
@@ -4558,12 +4559,20 @@ var Textarea = React27.forwardRef(
           className
         )
       },
-      props.label && /* @__PURE__ */ React27.createElement(Label, { ...labelProps }, props.label),
-      /* @__PURE__ */ React27.createElement(
+      /* @__PURE__ */ React27.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between" }, props.label && /* @__PURE__ */ React27.createElement(Label, { ...labelProps }, props.label), showCount && countPosition === "top" && /* @__PURE__ */ React27.createElement(
+        "div",
+        {
+          className: "hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none"
+        },
+        (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0,
+        "/",
+        textareaProps == null ? void 0 : textareaProps.maxLength
+      )),
+      isLoading ? /* @__PURE__ */ React27.createElement(Skeleton, { style: { height: 40 } }) : /* @__PURE__ */ React27.createElement(
         "textarea",
         {
           className: cn(
-            "hawa-flex hawa-min-h-[40px] hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50",
+            "hawa-flex hawa-min-h-[40px] hawa-h-[40px]  hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50",
             classNames == null ? void 0 : classNames.textarea
           ),
           ref,
@@ -4579,20 +4588,7 @@ var Textarea = React27.forwardRef(
           )
         },
         props.helperText
-      ), showCount && /* @__PURE__ */ React27.createElement(
-        "div",
-        {
-          className: cn(
-            "hawa-text-start hawa-text-xs hawa-transition-all",
-            {
-              "hawa-absolute hawa-bottom-[80px] hawa-end-0 hawa-translate-y-1/2": countPosition === "top"
-            }
-          )
-        },
-        (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0,
-        "/",
-        textareaProps == null ? void 0 : textareaProps.maxLength
-      ))
+      ), showCount && countPosition === "bottom" && /* @__PURE__ */ React27.createElement("div", { className: "hawa-text-start hawa-text-xs hawa-transition-all" }, (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0, "/", textareaProps == null ? void 0 : textareaProps.maxLength))
     );
   }
 );
@@ -5253,19 +5249,21 @@ var Chip = import_react27.default.forwardRef(
 
 // elements/tabs/Tabs.tsx
 var TabsContext = React35.createContext({ orientation: "vertical" });
-var Tabs = React35.forwardRef(({ className, orientation, ...props }, ref) => /* @__PURE__ */ React35.createElement(
-  TabsPrimitive.Root,
-  {
-    ref,
-    className: cn(
-      "hawa-flex hawa-gap-2",
-      orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
-      className
-    ),
-    ...props
-  },
-  /* @__PURE__ */ React35.createElement(TabsContext.Provider, { value: { orientation } }, props.children)
-));
+var Tabs = React35.forwardRef(
+  ({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ React35.createElement(
+    TabsPrimitive.Root,
+    {
+      ref,
+      className: cn(
+        "hawa-flex hawa-gap-2",
+        orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
+        className
+      ),
+      ...props
+    },
+    /* @__PURE__ */ React35.createElement(TabsContext.Provider, { value: { orientation } }, props.children)
+  )
+);
 Tabs.displayName = TabsPrimitive.Root.displayName;
 var TabsList = React35.forwardRef(({ className, ...props }, ref) => {
   const { orientation } = React35.useContext(TabsContext);

package/dist/blocks/index.mjs

@@ -25,7 +25,7 @@ import {
   UncheckMark,
   VeryBadEmoji,
   VeryGoodEmoji
-} from "../chunk-WPSUV4AD.mjs";
+} from "../chunk-F3DQJHTG.mjs";
 import {
   Button,
   Card,
@@ -41,7 +41,8 @@ import {
   Skeleton,
   Tooltip,
   cn
-} from "../chunk-Z5SL5QTQ.mjs";
+} from "../chunk-MQUAGP7K.mjs";
+import "../chunk-ZFXKCRJC.mjs";
 
 // blocks/auth/LoginForm.tsx
 import React2, { useState } from "react";

package/dist/blocks/misc/index.js

@@ -180,19 +180,21 @@ var Chip = import_react.default.forwardRef(
 
 // elements/tabs/Tabs.tsx
 var TabsContext = React3.createContext({ orientation: "vertical" });
-var Tabs = React3.forwardRef(({ className, orientation, ...props }, ref) => /* @__PURE__ */ React3.createElement(
-  TabsPrimitive.Root,
-  {
-    ref,
-    className: cn(
-      "hawa-flex hawa-gap-2",
-      orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
-      className
-    ),
-    ...props
-  },
-  /* @__PURE__ */ React3.createElement(TabsContext.Provider, { value: { orientation } }, props.children)
-));
+var Tabs = React3.forwardRef(
+  ({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ React3.createElement(
+    TabsPrimitive.Root,
+    {
+      ref,
+      className: cn(
+        "hawa-flex hawa-gap-2",
+        orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
+        className
+      ),
+      ...props
+    },
+    /* @__PURE__ */ React3.createElement(TabsContext.Provider, { value: { orientation } }, props.children)
+  )
+);
 Tabs.displayName = TabsPrimitive.Root.displayName;
 var TabsList = React3.forwardRef(({ className, ...props }, ref) => {
   const { orientation } = React3.useContext(TabsContext);
@@ -987,6 +989,7 @@ var Textarea = React18.forwardRef(
     forceHideHelperText,
     textareaProps,
     countPosition = "bottom",
+    isLoading,
     ...props
   }, ref) => {
     return /* @__PURE__ */ React18.createElement(
@@ -998,12 +1001,20 @@ var Textarea = React18.forwardRef(
           className
         )
       },
-      props.label && /* @__PURE__ */ React18.createElement(Label, { ...labelProps }, props.label),
-      /* @__PURE__ */ React18.createElement(
+      /* @__PURE__ */ React18.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between" }, props.label && /* @__PURE__ */ React18.createElement(Label, { ...labelProps }, props.label), showCount && countPosition === "top" && /* @__PURE__ */ React18.createElement(
+        "div",
+        {
+          className: "hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none"
+        },
+        (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0,
+        "/",
+        textareaProps == null ? void 0 : textareaProps.maxLength
+      )),
+      isLoading ? /* @__PURE__ */ React18.createElement(Skeleton, { style: { height: 40 } }) : /* @__PURE__ */ React18.createElement(
         "textarea",
         {
           className: cn(
-            "hawa-flex hawa-min-h-[40px] hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50",
+            "hawa-flex hawa-min-h-[40px] hawa-h-[40px]  hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50",
             classNames == null ? void 0 : classNames.textarea
           ),
           ref,
@@ -1019,20 +1030,7 @@ var Textarea = React18.forwardRef(
           )
         },
         props.helperText
-      ), showCount && /* @__PURE__ */ React18.createElement(
-        "div",
-        {
-          className: cn(
-            "hawa-text-start hawa-text-xs hawa-transition-all",
-            {
-              "hawa-absolute hawa-bottom-[80px] hawa-end-0 hawa-translate-y-1/2": countPosition === "top"
-            }
-          )
-        },
-        (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0,
-        "/",
-        textareaProps == null ? void 0 : textareaProps.maxLength
-      ))
+      ), showCount && countPosition === "bottom" && /* @__PURE__ */ React18.createElement("div", { className: "hawa-text-start hawa-text-xs hawa-transition-all" }, (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0, "/", textareaProps == null ? void 0 : textareaProps.maxLength))
     );
   }
 );

package/dist/blocks/misc/index.mjs

@@ -1,13 +1,14 @@
 import {
   Input
-} from "../../chunk-FDKCMEMD.mjs";
+} from "../../chunk-R4HAAT6R.mjs";
 import {
   Chip,
   ScrollArea
-} from "../../chunk-POIP5U4M.mjs";
+} from "../../chunk-4EGKGSGY.mjs";
 import {
   Textarea
-} from "../../chunk-APZM24KK.mjs";
+} from "../../chunk-5YXZXYLH.mjs";
+import "../../chunk-WUHNPHD5.mjs";
 import {
   Button,
   Card,
@@ -17,7 +18,7 @@ import {
   CardHeader,
   CardTitle,
   cn
-} from "../../chunk-AREFDTXK.mjs";
+} from "../../chunk-D36MPDGE.mjs";
 
 // blocks/misc/LegalTexts.tsx
 import React2 from "react";
@@ -26,19 +27,21 @@ import React2 from "react";
 import * as React from "react";
 import * as TabsPrimitive from "@radix-ui/react-tabs";
 var TabsContext = React.createContext({ orientation: "vertical" });
-var Tabs = React.forwardRef(({ className, orientation, ...props }, ref) => /* @__PURE__ */ React.createElement(
-  TabsPrimitive.Root,
-  {
-    ref,
-    className: cn(
-      "hawa-flex hawa-gap-2",
-      orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
-      className
-    ),
-    ...props
-  },
-  /* @__PURE__ */ React.createElement(TabsContext.Provider, { value: { orientation } }, props.children)
-));
+var Tabs = React.forwardRef(
+  ({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ React.createElement(
+    TabsPrimitive.Root,
+    {
+      ref,
+      className: cn(
+        "hawa-flex hawa-gap-2",
+        orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
+        className
+      ),
+      ...props
+    },
+    /* @__PURE__ */ React.createElement(TabsContext.Provider, { value: { orientation } }, props.children)
+  )
+);
 Tabs.displayName = TabsPrimitive.Root.displayName;
 var TabsList = React.forwardRef(({ className, ...props }, ref) => {
   const { orientation } = React.useContext(TabsContext);

package/dist/blocks/pricing/index.mjs

@@ -1,22 +1,22 @@
 import {
   Chip,
   ScrollArea
-} from "../../chunk-POIP5U4M.mjs";
+} from "../../chunk-4EGKGSGY.mjs";
 import "../../chunk-ZS3FB3PO.mjs";
 import {
   Radio
-} from "../../chunk-OAXF3RCQ.mjs";
+} from "../../chunk-NMS5LCSQ.mjs";
 import {
   CheckMark,
   UncheckMark
-} from "../../chunk-U3TZWNDZ.mjs";
+} from "../../chunk-GVJYACGA.mjs";
 import {
   Button,
   Card,
   Skeleton,
   Tooltip,
   cn
-} from "../../chunk-AREFDTXK.mjs";
+} from "../../chunk-D36MPDGE.mjs";
 
 // blocks/pricing/PricingPlans.tsx
 import React8 from "react";

package/dist/carousel/index.d.mts

@@ -1,4 +1,5 @@
 import React__default from 'react';
+import { D as DirectionType } from '../commonTypes-2k6FnHw5.mjs';
 import { EmblaOptionsType } from 'embla-carousel';
 
 type CarouselProps = {
@@ -7,6 +8,7 @@ type CarouselProps = {
     autoplay?: boolean;
     autoplayInterval?: number;
     options?: EmblaOptionsType;
+    direction?: DirectionType;
 };
 declare const Carousel: React__default.FC<CarouselProps>;
 

package/dist/carousel/index.d.ts

@@ -1,4 +1,5 @@
 import React__default from 'react';
+import { D as DirectionType } from '../commonTypes-2k6FnHw5.js';
 import { EmblaOptionsType } from 'embla-carousel';
 
 type CarouselProps = {
@@ -7,6 +8,7 @@ type CarouselProps = {
     autoplay?: boolean;
     autoplayInterval?: number;
     options?: EmblaOptionsType;
+    direction?: DirectionType;
 };
 declare const Carousel: React__default.FC<CarouselProps>;
 

package/dist/carousel/index.js

@@ -36,7 +36,6 @@ module.exports = __toCommonJS(carousel_exports);
 
 // elements/carousel/Carousel.tsx
 var import_react = __toESM(require("react"));
-var import_embla_carousel_react = __toESM(require("embla-carousel-react"));
 
 // util/index.ts
 var import_clsx = require("clsx");
@@ -46,16 +45,19 @@ function cn(...inputs) {
 }
 
 // elements/carousel/Carousel.tsx
+var import_embla_carousel_react = __toESM(require("embla-carousel-react"));
 var Carousel = ({
   items,
   showArrows,
   options,
   autoplay,
+  direction = "ltr",
   autoplayInterval = 3e3,
   ...props
 }) => {
   const [emblaRef, emblaApi] = (0, import_embla_carousel_react.default)({
     ...options,
+    direction,
     loop: autoplay ? true : (options == null ? void 0 : options.loop) || false
   });
   const [selectedIndex, setSelectedIndex] = (0, import_react.useState)(0);
@@ -94,6 +96,7 @@ var Carousel = ({
   ))))), /* @__PURE__ */ import_react.default.createElement(
     Dots,
     {
+      direction,
       itemsLength: length,
       selectedIndex,
       onDotClick: (index) => emblaApi == null ? void 0 : emblaApi.scrollTo(index)
@@ -108,22 +111,34 @@ var Carousel = ({
     }
   ));
 };
-var Dots = ({ onDotClick, itemsLength, selectedIndex }) => {
+var Dots = ({
+  onDotClick,
+  itemsLength,
+  selectedIndex,
+  direction
+}) => {
   const arr = new Array(itemsLength).fill(0);
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: "hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1" }, arr.map((_, index) => {
-    const selected = index === selectedIndex;
-    return /* @__PURE__ */ import_react.default.createElement(
-      "div",
-      {
-        key: index,
-        onClick: () => onDotClick(index),
-        className: cn(
-          "hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer",
-          !selected ? "hawa-w-2 hawa-opacity-50" : "hawa-w-6 hawa-opacity-100"
-        )
-      }
-    );
-  }));
+  return /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      dir: direction,
+      className: "hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1"
+    },
+    arr.map((_, index) => {
+      const selected = index === selectedIndex;
+      return /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          key: index,
+          onClick: () => onDotClick(index),
+          className: cn(
+            "hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer",
+            !selected ? "hawa-w-2 hawa-opacity-50" : "hawa-w-6 hawa-opacity-100"
+          )
+        }
+      );
+    })
+  );
 };
 var CarouselControls = (props) => {
   return /* @__PURE__ */ import_react.default.createElement("div", { className: "hawa-flex hawa-justify-end hawa-gap-2 " }, /* @__PURE__ */ import_react.default.createElement(

package/dist/carousel/index.mjs

@@ -10,11 +10,13 @@ var Carousel = ({
   showArrows,
   options,
   autoplay,
+  direction = "ltr",
   autoplayInterval = 3e3,
   ...props
 }) => {
   const [emblaRef, emblaApi] = useEmblaCarousel({
     ...options,
+    direction,
     loop: autoplay ? true : (options == null ? void 0 : options.loop) || false
   });
   const [selectedIndex, setSelectedIndex] = useState(0);
@@ -53,6 +55,7 @@ var Carousel = ({
   ))))), /* @__PURE__ */ React.createElement(
     Dots,
     {
+      direction,
       itemsLength: length,
       selectedIndex,
       onDotClick: (index) => emblaApi == null ? void 0 : emblaApi.scrollTo(index)
@@ -67,22 +70,34 @@ var Carousel = ({
     }
   ));
 };
-var Dots = ({ onDotClick, itemsLength, selectedIndex }) => {
+var Dots = ({
+  onDotClick,
+  itemsLength,
+  selectedIndex,
+  direction
+}) => {
   const arr = new Array(itemsLength).fill(0);
-  return /* @__PURE__ */ React.createElement("div", { className: "hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1" }, arr.map((_, index) => {
-    const selected = index === selectedIndex;
-    return /* @__PURE__ */ React.createElement(
-      "div",
-      {
-        key: index,
-        onClick: () => onDotClick(index),
-        className: cn(
-          "hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer",
-          !selected ? "hawa-w-2 hawa-opacity-50" : "hawa-w-6 hawa-opacity-100"
-        )
-      }
-    );
-  }));
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      dir: direction,
+      className: "hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1"
+    },
+    arr.map((_, index) => {
+      const selected = index === selectedIndex;
+      return /* @__PURE__ */ React.createElement(
+        "div",
+        {
+          key: index,
+          onClick: () => onDotClick(index),
+          className: cn(
+            "hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer",
+            !selected ? "hawa-w-2 hawa-opacity-50" : "hawa-w-6 hawa-opacity-100"
+          )
+        }
+      );
+    })
+  );
 };
 var CarouselControls = (props) => {
   return /* @__PURE__ */ React.createElement("div", { className: "hawa-flex hawa-justify-end hawa-gap-2 " }, /* @__PURE__ */ React.createElement(

package/dist/checkbox/index.d.mts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
-import { R as RadiusType } from '../commonTypes-PBumfOBg.mjs';
+import { R as RadiusType } from '../commonTypes-2k6FnHw5.mjs';
 
 type CheckBoxTypes = {
     id: string;

package/dist/checkbox/index.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
-import { R as RadiusType } from '../commonTypes-PBumfOBg.js';
+import { R as RadiusType } from '../commonTypes-2k6FnHw5.js';
 
 type CheckBoxTypes = {
     id: string;

package/dist/chip/index.d.mts

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import { R as RadiusType } from '../commonTypes-PBumfOBg.mjs';
+import { R as RadiusType } from '../commonTypes-2k6FnHw5.mjs';
 
 type ChipColors = "green" | "blue" | "red" | "yellow" | "orange" | "purple" | "cyan" | "hyper" | "oceanic";
 type ChipTypes = React__default.HTMLAttributes<HTMLSpanElement> & {

package/dist/chip/index.d.ts

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import { R as RadiusType } from '../commonTypes-PBumfOBg.js';
+import { R as RadiusType } from '../commonTypes-2k6FnHw5.js';
 
 type ChipColors = "green" | "blue" | "red" | "yellow" | "orange" | "purple" | "cyan" | "hyper" | "oceanic";
 type ChipTypes = React__default.HTMLAttributes<HTMLSpanElement> & {

package/dist/{chunk-OTGCLEKC.mjs → chunk-2R7F2GL7.mjs}

@@ -4,6 +4,25 @@ import { twMerge } from "tailwind-merge";
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
+var parseColor = (color) => {
+  if (color.startsWith("#")) {
+    let r = parseInt(color.slice(1, 3), 16);
+    let g = parseInt(color.slice(3, 5), 16);
+    let b = parseInt(color.slice(5, 7), 16);
+    return [r, g, b];
+  } else if (color.startsWith("rgb")) {
+    return color.match(/\d+/g).map(Number);
+  }
+  return [255, 255, 255];
+};
+var calculateLuminance = (color) => {
+  var _a;
+  const [r, g, b] = (_a = parseColor(color)) == null ? void 0 : _a.map((c) => {
+    c /= 255;
+    return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
+  });
+  return 0.2126 * r + 0.7152 * g + 0.0722 * b;
+};
 
 // elements/tooltip/Tooltip.tsx
 import React from "react";
@@ -58,5 +77,6 @@ var Tooltip = ({
 
 export {
   cn,
+  calculateLuminance,
   Tooltip
 };

package/dist/{chunk-POIP5U4M.mjs → chunk-4EGKGSGY.mjs}

@@ -1,6 +1,6 @@
 import {
   cn
-} from "./chunk-AREFDTXK.mjs";
+} from "./chunk-D36MPDGE.mjs";
 
 // elements/scrollArea/ScrollArea.tsx
 import * as React from "react";

package/dist/{chunk-APZM24KK.mjs → chunk-5YXZXYLH.mjs}

@@ -1,7 +1,8 @@
 import {
   Label,
+  Skeleton,
   cn
-} from "./chunk-AREFDTXK.mjs";
+} from "./chunk-D36MPDGE.mjs";
 
 // elements/textarea/Textarea.tsx
 import * as React from "react";
@@ -14,6 +15,7 @@ var Textarea = React.forwardRef(
     forceHideHelperText,
     textareaProps,
     countPosition = "bottom",
+    isLoading,
     ...props
   }, ref) => {
     return /* @__PURE__ */ React.createElement(
@@ -25,12 +27,20 @@ var Textarea = React.forwardRef(
           className
         )
       },
-      props.label && /* @__PURE__ */ React.createElement(Label, { ...labelProps }, props.label),
-      /* @__PURE__ */ React.createElement(
+      /* @__PURE__ */ React.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between" }, props.label && /* @__PURE__ */ React.createElement(Label, { ...labelProps }, props.label), showCount && countPosition === "top" && /* @__PURE__ */ React.createElement(
+        "div",
+        {
+          className: "hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none"
+        },
+        (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0,
+        "/",
+        textareaProps == null ? void 0 : textareaProps.maxLength
+      )),
+      isLoading ? /* @__PURE__ */ React.createElement(Skeleton, { style: { height: 40 } }) : /* @__PURE__ */ React.createElement(
         "textarea",
         {
           className: cn(
-            "hawa-flex hawa-min-h-[40px] hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50",
+            "hawa-flex hawa-min-h-[40px] hawa-h-[40px]  hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50",
             classNames == null ? void 0 : classNames.textarea
           ),
           ref,
@@ -46,20 +56,7 @@ var Textarea = React.forwardRef(
           )
         },
         props.helperText
-      ), showCount && /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          className: cn(
-            "hawa-text-start hawa-text-xs hawa-transition-all",
-            {
-              "hawa-absolute hawa-bottom-[80px] hawa-end-0 hawa-translate-y-1/2": countPosition === "top"
-            }
-          )
-        },
-        (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0,
-        "/",
-        textareaProps == null ? void 0 : textareaProps.maxLength
-      ))
+      ), showCount && countPosition === "bottom" && /* @__PURE__ */ React.createElement("div", { className: "hawa-text-start hawa-text-xs hawa-transition-all" }, (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0, "/", textareaProps == null ? void 0 : textareaProps.maxLength))
     );
   }
 );