@sikka/hawa 0.13.16-next → 0.13.19-next

package/dist/index.css

@@ -890,6 +890,9 @@ input[type="number"]::-webkit-inner-spin-button,
   margin-top: 1rem;
   margin-bottom: 1rem;
 }
+.-hawa-mt-4 {
+  margin-top: -1rem;
+}
 .hawa--mt-1 {
   margin-top: -0.25rem;
 }
@@ -2417,10 +2420,6 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-text-opacity: 1;
   color: rgb(37 99 235 / var(--tw-text-opacity));
 }
-.hawa-text-blue-700 {
-  --tw-text-opacity: 1;
-  color: rgb(29 78 216 / var(--tw-text-opacity));
-}
 .hawa-text-card-foreground {
   color: hsl(var(--card-foreground));
 }
@@ -2469,10 +2468,6 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-text-opacity: 1;
   color: rgb(34 197 94 / var(--tw-text-opacity));
 }
-.hawa-text-green-700 {
-  --tw-text-opacity: 1;
-  color: rgb(21 128 61 / var(--tw-text-opacity));
-}
 .hawa-text-helper-color {
   color: hsl(var(--helper-text));
 }
@@ -2524,10 +2519,6 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-text-opacity: 1;
   color: rgb(239 68 68 / var(--tw-text-opacity));
 }
-.hawa-text-red-700 {
-  --tw-text-opacity: 1;
-  color: rgb(185 28 28 / var(--tw-text-opacity));
-}
 .hawa-text-secondary-foreground {
   color: hsl(var(--secondary-foreground));
 }
@@ -2547,10 +2538,6 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-text-opacity: 1;
   color: rgb(202 138 4 / var(--tw-text-opacity));
 }
-.hawa-text-yellow-700 {
-  --tw-text-opacity: 1;
-  color: rgb(161 98 7 / var(--tw-text-opacity));
-}
 .hawa-underline-offset-4 {
   text-underline-offset: 4px;
 }
@@ -2870,10 +2857,6 @@ body {
 .hover\:hawa-bg-accent:hover {
   background-color: hsl(var(--accent));
 }
-.hover\:hawa-bg-blue-300:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(147 197 253 / var(--tw-bg-opacity));
-}
 .hover\:hawa-bg-destructive\/90:hover {
   background-color: hsl(var(--destructive) / 0.9);
 }
@@ -2889,10 +2872,6 @@ body {
   --tw-bg-opacity: 1;
   background-color: rgb(209 213 219 / var(--tw-bg-opacity));
 }
-.hover\:hawa-bg-green-300:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(134 239 172 / var(--tw-bg-opacity));
-}
 .hover\:hawa-bg-muted:hover {
   background-color: hsl(var(--muted));
 }
@@ -2914,20 +2893,12 @@ body {
 .hover\:hawa-bg-primary\/90:hover {
   background-color: hsl(var(--primary) / 0.9);
 }
-.hover\:hawa-bg-red-300:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(252 165 165 / var(--tw-bg-opacity));
-}
 .hover\:hawa-bg-secondary:hover {
   background-color: hsl(var(--secondary));
 }
 .hover\:hawa-bg-secondary\/80:hover {
   background-color: hsl(var(--secondary) / 0.8);
 }
-.hover\:hawa-bg-yellow-300:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(253 224 71 / var(--tw-bg-opacity));
-}
 .hover\:hawa-text-accent-foreground:hover {
   color: hsl(var(--accent-foreground));
 }
@@ -3509,10 +3480,6 @@ body {
   --tw-bg-opacity: 1;
   background-color: rgb(0 0 0 / var(--tw-bg-opacity));
 }
-:is(.hawa-dark .dark\:hawa-bg-blue-200) {
-  --tw-bg-opacity: 1;
-  background-color: rgb(191 219 254 / var(--tw-bg-opacity));
-}
 :is(.hawa-dark .dark\:hawa-bg-blue-400) {
   --tw-bg-opacity: 1;
   background-color: rgb(96 165 250 / var(--tw-bg-opacity));
@@ -3521,10 +3488,6 @@ body {
   --tw-bg-opacity: 1;
   background-color: rgb(34 211 238 / var(--tw-bg-opacity));
 }
-:is(.hawa-dark .dark\:hawa-bg-gray-200) {
-  --tw-bg-opacity: 1;
-  background-color: rgb(229 231 235 / var(--tw-bg-opacity));
-}
 :is(.hawa-dark .dark\:hawa-bg-gray-600) {
   --tw-bg-opacity: 1;
   background-color: rgb(75 85 99 / var(--tw-bg-opacity));
@@ -3541,10 +3504,6 @@ body {
   --tw-bg-opacity: 1;
   background-color: rgb(17 24 39 / var(--tw-bg-opacity));
 }
-:is(.hawa-dark .dark\:hawa-bg-green-200) {
-  --tw-bg-opacity: 1;
-  background-color: rgb(187 247 208 / var(--tw-bg-opacity));
-}
 :is(.hawa-dark .dark\:hawa-bg-green-400) {
   --tw-bg-opacity: 1;
   background-color: rgb(74 222 128 / var(--tw-bg-opacity));
@@ -3572,18 +3531,10 @@ body {
   --tw-bg-opacity: 1;
   background-color: rgb(192 132 252 / var(--tw-bg-opacity));
 }
-:is(.hawa-dark .dark\:hawa-bg-red-200) {
-  --tw-bg-opacity: 1;
-  background-color: rgb(254 202 202 / var(--tw-bg-opacity));
-}
 :is(.hawa-dark .dark\:hawa-bg-red-400) {
   --tw-bg-opacity: 1;
   background-color: rgb(248 113 113 / var(--tw-bg-opacity));
 }
-:is(.hawa-dark .dark\:hawa-bg-yellow-200) {
-  --tw-bg-opacity: 1;
-  background-color: rgb(254 240 138 / var(--tw-bg-opacity));
-}
 :is(.hawa-dark .dark\:hawa-bg-yellow-400) {
   --tw-bg-opacity: 1;
   background-color: rgb(250 204 21 / var(--tw-bg-opacity));
@@ -3592,10 +3543,6 @@ body {
   --tw-text-opacity: 1;
   color: rgb(219 234 254 / var(--tw-text-opacity));
 }
-:is(.hawa-dark .dark\:hawa-text-blue-800) {
-  --tw-text-opacity: 1;
-  color: rgb(30 64 175 / var(--tw-text-opacity));
-}
 :is(.hawa-dark .dark\:hawa-text-cyan-800) {
   --tw-text-opacity: 1;
   color: rgb(21 94 117 / var(--tw-text-opacity));
@@ -3612,10 +3559,6 @@ body {
   --tw-text-opacity: 1;
   color: rgb(107 114 128 / var(--tw-text-opacity));
 }
-:is(.hawa-dark .dark\:hawa-text-gray-800) {
-  --tw-text-opacity: 1;
-  color: rgb(31 41 55 / var(--tw-text-opacity));
-}
 :is(.hawa-dark .dark\:hawa-text-green-800) {
   --tw-text-opacity: 1;
   color: rgb(22 101 52 / var(--tw-text-opacity));
@@ -3635,10 +3578,6 @@ body {
   --tw-text-opacity: 1;
   color: rgb(254 226 226 / var(--tw-text-opacity));
 }
-:is(.hawa-dark .dark\:hawa-text-red-800) {
-  --tw-text-opacity: 1;
-  color: rgb(153 27 27 / var(--tw-text-opacity));
-}
 :is(.hawa-dark .dark\:hawa-text-white) {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));

package/dist/index.d.mts

@@ -106,6 +106,7 @@ interface DropdownMenuProps {
     size?: "default" | "sm";
     onItemSelect?: any;
     onOpenChange?: any;
+    header?: React$1.ReactNode;
     open?: any;
 }
 declare const DropdownMenu: React$1.FC<DropdownMenuProps>;

package/dist/index.d.ts

@@ -106,6 +106,7 @@ interface DropdownMenuProps {
     size?: "default" | "sm";
     onItemSelect?: any;
     onOpenChange?: any;
+    header?: React$1.ReactNode;
     open?: any;
 }
 declare const DropdownMenu: React$1.FC<DropdownMenuProps>;

package/dist/index.js

@@ -1316,7 +1316,7 @@ var DropdownMenuShortcut = function(_param) {
 };
 DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
 var DropdownMenu = function(param) {
-    var trigger = param.trigger, items = param.items, direction = param.direction, sideOffset = param.sideOffset, side = param.side, className = param.className, triggerClassname = param.triggerClassname, align = param.align, alignOffset = param.alignOffset, onItemSelect = param.onItemSelect, _param_size = param.size, size = _param_size === void 0 ? "default" : _param_size, _param_width = param.width, width = _param_width === void 0 ? "default" : _param_width, onOpenChange = param.onOpenChange, open = param.open;
+    var trigger = param.trigger, items = param.items, direction = param.direction, sideOffset = param.sideOffset, side = param.side, className = param.className, triggerClassname = param.triggerClassname, align = param.align, alignOffset = param.alignOffset, onItemSelect = param.onItemSelect, _param_size = param.size, size = _param_size === void 0 ? "default" : _param_size, _param_width = param.width, width = _param_width === void 0 ? "default" : _param_width, header = param.header, onOpenChange = param.onOpenChange, open = param.open;
     var widthStyles = {
         default: "hawa-min-w-[8rem]",
         sm: "hawa-w-fit",
@@ -1341,7 +1341,7 @@ var DropdownMenu = function(param) {
         className: cn(className, widthStyles[width], "hawa-flex hawa-flex-col hawa-gap-1"),
         align: align,
         alignOffset: alignOffset
-    }, items && items.map(function(item, index) {
+    }, header && header, items && items.map(function(item, index) {
         if (item.itemType === "separator") {
             return /* @__PURE__ */ React7.createElement(DropdownMenuSeparator, {
                 key: index
@@ -1559,9 +1559,7 @@ var SplitButton = function(_param) /* @__PURE__ */ {
         className: cn("hawa-h-fit hawa-flex  hawa-justify-center", direction === "rtl" ? "hawa-flex-row-reverse" : "hawa-flex-row")
     }, /* @__PURE__ */ React11.createElement(Button, {
         variant: variant,
-        onClick: function() {
-            return console.log("btn clicked");
-        },
+        onClick: props.onClick,
         className: cn(direction === "rtl" ? "hawa-rounded-r-none" : "hawa-rounded-l-none", props.className)
     }, children), /* @__PURE__ */ React11.createElement(DropdownMenu, {
         size: "sm",
@@ -2406,8 +2404,8 @@ var Radio = function(_param) {
                     htmlFor: opt.value.toString(),
                     className: cn("hawa-text-sm hawa-font-medium  dark:hawa-text-white", opt.disabled ? "hawa-text-gray-400" : "hawa-cursor-pointer hawa-text-gray-900")
                 }, opt.label));
-            })), props.helperText && /* @__PURE__ */ import_react13.default.createElement("p", {
-                className: "hawa-text-xs hawa-text-helper-color"
+            })), /* @__PURE__ */ import_react13.default.createElement("p", {
+                className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
             }, props.helperText));
     }
 };
@@ -2534,6 +2532,8 @@ var Alert = function(_param) {
     return /* @__PURE__ */ import_react16.default.createElement("div", {
         ref: alertRef
     }, /* @__PURE__ */ import_react16.default.createElement("div", {
+        "data-testid": "alert",
+        "aria-label": "Alert",
         role: "alert",
         dir: direction,
         className: (0, import_clsx6.default)("hawa-relative hawa-mb-4 hawa-flex hawa-flex-col hawa-rounded hawa-p-4 hawa-text-sm hawa-transition-all", styleVariant[severity], closed ? "hawa-opacity-0" : "hawa-opacity-100", className)
@@ -2633,9 +2633,9 @@ var Textarea = React27.forwardRef(function(_param, ref) {
     }, /* @__PURE__ */ React27.createElement("textarea", _object_spread({
         className: cn("hawa-flex hawa-min-h-[80px] 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-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50", className),
         ref: ref
-    }, props)), props.helperText && /* @__PURE__ */ React27.createElement("p", {
-        className: "hawa-text-xs hawa-text-helper-color"
-    }, props.helperText));
+    }, props)), /* @__PURE__ */ React27.createElement("p", {
+        className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
+    }, props.helperText), " ");
 });
 Textarea.displayName = "Textarea";
 // components/elements/Slider.tsx
@@ -2728,7 +2728,7 @@ var ColorPicker = function(_param) {
         value: selectedColor,
         className: cn("hawa-block hawa-h-[40px] hawa-rounded hawa-border hawa-transition-all hawa-bg-background hawa-p-2 hawa-text-sm  hawa-border-l-0 hawa-border-l-transparent hawa-rounded-l-none hawa-w-24")
     }, textInputProps)))), /* @__PURE__ */ import_react17.default.createElement("p", {
-        className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
+        className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
     }, props.helperText));
 };
 // components/elements/DestroyableCard.tsx
@@ -2846,8 +2846,8 @@ var PinInput = function(_param) {
                 return e.target.select();
             }
         }, props));
-    })), props.helperText && /* @__PURE__ */ import_react19.default.createElement("p", {
-        className: "hawa-my-0 hawa-text-xs hawa-text-helper-color"
+    })), /* @__PURE__ */ import_react19.default.createElement("p", {
+        className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
     }, props.helperText));
 };
 // components/elements/FileDropzone.tsx
@@ -4881,8 +4881,8 @@ var Select = function(_param) {
         onInputChange: function(newValue, action) {
             return props.onInputChange(newValue, action);
         }
-    }), props.helperText && /* @__PURE__ */ import_react21.default.createElement("p", {
-        className: "hawa-text-xs hawa-text-helper-color"
+    }), /* @__PURE__ */ import_react21.default.createElement("p", {
+        className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
     }, props.helperText));
 };
 // components/elements/PhoneInput.tsx
@@ -4932,10 +4932,10 @@ var PhoneInput = function(props) {
         type: "tel",
         placeholder: "531045453"
     }))), /* @__PURE__ */ import_react22.default.createElement("p", {
-        className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
+        className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
     }, props.helperText));
 };
-{}// components/elements/AppStores.tsx
+// components/elements/AppStores.tsx
 var import_react23 = __toESM(require("react"));
 var AppStores = function(props) {
     return /* @__PURE__ */ import_react23.default.createElement("div", {
@@ -5194,7 +5194,7 @@ var Input = function(_param) {
     })), props.iconInside && /* @__PURE__ */ import_react25.default.createElement("div", {
         className: "hawa-absolute hawa-end-2 hawa-top-[41px] hawa-mx-1  hawa--translate-y-1/2"
     }, props.iconInside), !forceHideHelperText && /* @__PURE__ */ import_react25.default.createElement("p", {
-        className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
+        className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
     }, props.helperText))));
 };
 // components/elements/DataTable.tsx
@@ -5768,7 +5768,6 @@ var TabsList = React47.forwardRef(function(_param, ref) {
         "className"
     ]);
     var orientation = React47.useContext(TabsContext).orientation;
-    console.log("orient ", orientation);
     return /* @__PURE__ */ React47.createElement(TabsPrimitive.List, _object_spread({
         ref: ref,
         className: cn("hawa-flex hawa-w-fit hawa-flex-wrap hawa-items-center hawa-justify-start hawa-gap-1 hawa-rounded hawa-border hawa-bg-muted hawa-p-1 hawa-text-muted-foreground  dark:hawa-border-primary/10", orientation === "vertical" ? "hawa-flex-col" : "hawa-flex-row", className)
@@ -6191,13 +6190,14 @@ var Combobox = function(_param) {
         open: open,
         onOpenChange: setOpen
     }, /* @__PURE__ */ React51.createElement(PopoverTrigger, {
+        asChild: true,
         disabled: props.isLoading || props.preview
     }, props.isLoading ? /* @__PURE__ */ React51.createElement("div", {
         className: "hawa-pb-2"
     }, /* @__PURE__ */ React51.createElement(Skeleton, {
         className: "hawa-h-[40px] hawa-w-full"
     })) : /* @__PURE__ */ React51.createElement("div", {
-        className: "hawa-flex hawa-flex-col hawa-gap-2 "
+        className: "hawa-flex hawa-flex-col hawa-gap-2 hawa-items-start "
     }, /* @__PURE__ */ React51.createElement("div", {
         className: cn("hawa-absolute hawa-top-[22px] hawa-h-[0.8px] hawa-w-full hawa-bg-gray-200 hawa-transition-all dark:hawa-bg-gray-800", props.preview ? "hawa-opacity-100" : "hawa-opacity-0")
     }), /* @__PURE__ */ React51.createElement("button", {
@@ -6218,9 +6218,9 @@ var Combobox = function(_param) {
     }, /* @__PURE__ */ React51.createElement("path", {
         d: "m6 9 6 6 6-6"
     }))), /* @__PURE__ */ React51.createElement("p", {
-        className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
-    }, props.helperText), " ")), /* @__PURE__ */ React51.createElement(PopoverContent, {
-        className: cn("popover-w-parent")
+        className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
+    }, props.helperText))), /* @__PURE__ */ React51.createElement(PopoverContent, {
+        className: cn("popover-w-parent", props.helperText && "-hawa-mt-4")
     }, /* @__PURE__ */ React51.createElement(Command, null, !props.hideInput && /* @__PURE__ */ React51.createElement(CommandInput, {
         placeholder: props.searchPlaceholder
     }), /* @__PURE__ */ React51.createElement(CommandEmpty, null, "No framework found."), /* @__PURE__ */ React51.createElement(CommandGroup, {
@@ -6661,8 +6661,8 @@ var Stats = function(_param) {
         className: "hawa-text-2xl hawa-font-bold"
     }, props.number), props.isLoading && props.helperText ? /* @__PURE__ */ import_react33.default.createElement(Skeleton, {
         className: "hawa-mt-2 hawa-h-4 hawa-w-1/2"
-    }) : props.helperText && /* @__PURE__ */ import_react33.default.createElement("p", {
-        className: "hawa-text-xs hawa-text-muted-foreground"
+    }) : /* @__PURE__ */ import_react33.default.createElement("p", {
+        className: cn("hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start", props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0")
     }, props.helperText), props.isLoading && props.chart ? /* @__PURE__ */ import_react33.default.createElement(Skeleton, {
         className: "hawa-mt-2 hawa-h-4 hawa-w-1/2"
     }) : props.chart));
@@ -8674,7 +8674,6 @@ var FeedbackEmoji = function(props) {
             return _ts_generator(this, function(_state) {
                 switch(_state.label){
                     case 0:
-                        console.log("submitting");
                         if (!feedbackText) return [
                             3,
                             6
@@ -8785,7 +8784,6 @@ var FeedbackEmoji = function(props) {
                     setHelperText(false);
                 }
                 setFeedbackText(e.target.value);
-                console.log("changing to", e.target.value);
             }
         })
     }, /* @__PURE__ */ import_react52.default.createElement("span", {

package/dist/index.mjs

@@ -606,6 +606,7 @@ var DropdownMenu = ({
   onItemSelect,
   size = "default",
   width = "default",
+  header,
   onOpenChange,
   open
 }) => {
@@ -641,6 +642,7 @@ var DropdownMenu = ({
         align,
         alignOffset
       },
+      header && header,
       items && items.map((item, index) => {
         if (item.itemType === "separator") {
           return /* @__PURE__ */ React7.createElement(DropdownMenuSeparator, { key: index });
@@ -897,7 +899,7 @@ var SplitButton = ({
     Button,
     {
       variant,
-      onClick: () => console.log("btn clicked"),
+      onClick: props.onClick,
       className: cn(
         direction === "rtl" ? "hawa-rounded-r-none" : "hawa-rounded-l-none",
         props.className
@@ -1885,7 +1887,16 @@ var Radio = ({
           },
           opt.label
         )
-      ))), props.helperText && /* @__PURE__ */ React22.createElement("p", { className: "hawa-text-xs hawa-text-helper-color" }, props.helperText));
+      ))), /* @__PURE__ */ React22.createElement(
+        "p",
+        {
+          className: cn(
+            "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start",
+            props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0"
+          )
+        },
+        props.helperText
+      ));
   }
 };
 
@@ -2049,6 +2060,8 @@ var Alert = ({
   return /* @__PURE__ */ React25.createElement("div", { ref: alertRef }, /* @__PURE__ */ React25.createElement(
     "div",
     {
+      "data-testid": "alert",
+      "aria-label": "Alert",
       role: "alert",
       dir: direction,
       className: clsx6(
@@ -2187,7 +2200,16 @@ var Textarea = React27.forwardRef(
         ref,
         ...props
       }
-    ), props.helperText && /* @__PURE__ */ React27.createElement("p", { className: "hawa-text-xs hawa-text-helper-color" }, props.helperText));
+    ), /* @__PURE__ */ React27.createElement(
+      "p",
+      {
+        className: cn(
+          "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start",
+          props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0"
+        )
+      },
+      props.helperText
+    ), " ");
   }
 );
 Textarea.displayName = "Textarea";
@@ -2294,7 +2316,7 @@ var ColorPicker = ({
     "p",
     {
       className: cn(
-        "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all",
+        "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start",
         props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0"
       )
     },
@@ -2446,7 +2468,16 @@ var PinInput = ({
         ...props
       }
     ))
-  ), props.helperText && /* @__PURE__ */ React31.createElement("p", { className: "hawa-my-0 hawa-text-xs hawa-text-helper-color" }, props.helperText));
+  ), /* @__PURE__ */ React31.createElement(
+    "p",
+    {
+      className: cn(
+        "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start",
+        props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0"
+      )
+    },
+    props.helperText
+  ));
 };
 
 // components/elements/FileDropzone.tsx
@@ -4498,7 +4529,16 @@ var Select = ({ labelKey = "label", ...props }) => {
         onInputChange: (newValue, action) => props.onInputChange(newValue, action)
       }
     ),
-    props.helperText && /* @__PURE__ */ React33.createElement("p", { className: "hawa-text-xs hawa-text-helper-color" }, props.helperText)
+    /* @__PURE__ */ React33.createElement(
+      "p",
+      {
+        className: cn(
+          "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start",
+          props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0"
+        )
+      },
+      props.helperText
+    )
   );
 };
 
@@ -4552,15 +4592,13 @@ var PhoneInput = (props) => {
     "p",
     {
       className: cn(
-        "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all",
+        "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start",
         props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0"
       )
     },
     props.helperText
   ));
 };
-{
-}
 
 // components/elements/AppStores.tsx
 import React35 from "react";
@@ -4865,7 +4903,7 @@ var Input = ({
       "p",
       {
         className: cn(
-          "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all",
+          "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start",
           props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0"
         )
       },
@@ -5462,7 +5500,6 @@ var Tabs = React47.forwardRef(({ className, orientation, ...props }, ref) => /*
 Tabs.displayName = TabsPrimitive.Root.displayName;
 var TabsList = React47.forwardRef(({ className, ...props }, ref) => {
   const { orientation } = React47.useContext(TabsContext);
-  console.log("orient ", orientation);
   return /* @__PURE__ */ React47.createElement(
     TabsPrimitive.List,
     {
@@ -5907,7 +5944,7 @@ var Combobox = ({
       )
     },
     props.label && /* @__PURE__ */ React51.createElement(Label2, null, props.label),
-    /* @__PURE__ */ React51.createElement(PopoverPrimitive2.Root, { open, onOpenChange: setOpen }, /* @__PURE__ */ React51.createElement(PopoverTrigger, { disabled: props.isLoading || props.preview }, props.isLoading ? /* @__PURE__ */ React51.createElement("div", { className: "hawa-pb-2" }, /* @__PURE__ */ React51.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" })) : /* @__PURE__ */ React51.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2 " }, /* @__PURE__ */ React51.createElement(
+    /* @__PURE__ */ React51.createElement(PopoverPrimitive2.Root, { open, onOpenChange: setOpen }, /* @__PURE__ */ React51.createElement(PopoverTrigger, { asChild: true, disabled: props.isLoading || props.preview }, props.isLoading ? /* @__PURE__ */ React51.createElement("div", { className: "hawa-pb-2" }, /* @__PURE__ */ React51.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" })) : /* @__PURE__ */ React51.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2 hawa-items-start " }, /* @__PURE__ */ React51.createElement(
       "div",
       {
         className: cn(
@@ -5950,47 +5987,53 @@ var Combobox = ({
       "p",
       {
         className: cn(
-          "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all",
+          "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start",
           props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0"
         )
       },
       props.helperText
-    ), " ")), /* @__PURE__ */ React51.createElement(PopoverContent, { className: cn("popover-w-parent") }, /* @__PURE__ */ React51.createElement(Command, null, !props.hideInput && /* @__PURE__ */ React51.createElement(CommandInput, { placeholder: props.searchPlaceholder }), /* @__PURE__ */ React51.createElement(CommandEmpty, null, "No framework found."), /* @__PURE__ */ React51.createElement(CommandGroup, { className: "  hawa-max-h-[200px] hawa-overflow-y-auto" }, data.map((item) => /* @__PURE__ */ React51.createElement(
-      CommandItem,
+    ))), /* @__PURE__ */ React51.createElement(
+      PopoverContent,
       {
-        key: getProperty(item, valueKey),
-        onSelect: () => {
-          const newValue = getProperty(item, valueKey);
-          setValue(newValue === value ? "" : newValue);
-          if (props.onChange) {
-            props.onChange(
-              newValue === value ? "" : newValue
-            );
-          }
-          setOpen(false);
-        }
+        className: cn("popover-w-parent", props.helperText && "-hawa-mt-4")
       },
-      /* @__PURE__ */ React51.createElement(
-        "svg",
+      /* @__PURE__ */ React51.createElement(Command, null, !props.hideInput && /* @__PURE__ */ React51.createElement(CommandInput, { placeholder: props.searchPlaceholder }), /* @__PURE__ */ React51.createElement(CommandEmpty, null, "No framework found."), /* @__PURE__ */ React51.createElement(CommandGroup, { className: "  hawa-max-h-[200px] hawa-overflow-y-auto" }, data.map((item) => /* @__PURE__ */ React51.createElement(
+        CommandItem,
         {
-          xmlns: "http://www.w3.org/2000/svg",
-          width: "24",
-          height: "24",
-          viewBox: "0 0 24 24",
-          fill: "none",
-          stroke: "currentColor",
-          strokeWidth: "2",
-          strokeLinecap: "round",
-          strokeLinejoin: "round",
-          className: cn(
-            "hawa-mr-2 hawa-h-4 hawa-w-4",
-            value === getProperty(item, valueKey) ? "hawa-opacity-100" : "hawa-opacity-0"
-          )
+          key: getProperty(item, valueKey),
+          onSelect: () => {
+            const newValue = getProperty(item, valueKey);
+            setValue(newValue === value ? "" : newValue);
+            if (props.onChange) {
+              props.onChange(
+                newValue === value ? "" : newValue
+              );
+            }
+            setOpen(false);
+          }
         },
-        /* @__PURE__ */ React51.createElement("polyline", { points: "20 6 9 17 4 12" })
-      ),
-      getProperty(item, labelKey)
-    ))))))
+        /* @__PURE__ */ React51.createElement(
+          "svg",
+          {
+            xmlns: "http://www.w3.org/2000/svg",
+            width: "24",
+            height: "24",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            className: cn(
+              "hawa-mr-2 hawa-h-4 hawa-w-4",
+              value === getProperty(item, valueKey) ? "hawa-opacity-100" : "hawa-opacity-0"
+            )
+          },
+          /* @__PURE__ */ React51.createElement("polyline", { points: "20 6 9 17 4 12" })
+        ),
+        getProperty(item, labelKey)
+      ))))
+    ))
   );
 };
 
@@ -6459,7 +6502,16 @@ var Stats = ({ variant = "default", ...props }) => {
       className: cn(props.className)
     },
     /* @__PURE__ */ React57.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between hawa-p-4 hawa-items-center" }, /* @__PURE__ */ React57.createElement(CardTitle, { className: "hawa-text-sm hawa-font-medium" }, props.label), props.icon && /* @__PURE__ */ React57.createElement("span", null, props.icon)),
-    /* @__PURE__ */ React57.createElement(CardContent, null, props.isLoading ? /* @__PURE__ */ React57.createElement(Skeleton, { className: "hawa-h-8 hawa-w-3/4" }) : /* @__PURE__ */ React57.createElement("div", { className: "hawa-text-2xl hawa-font-bold" }, props.number), props.isLoading && props.helperText ? /* @__PURE__ */ React57.createElement(Skeleton, { className: "hawa-mt-2 hawa-h-4 hawa-w-1/2" }) : props.helperText && /* @__PURE__ */ React57.createElement("p", { className: "hawa-text-xs hawa-text-muted-foreground" }, props.helperText), props.isLoading && props.chart ? /* @__PURE__ */ React57.createElement(Skeleton, { className: "hawa-mt-2 hawa-h-4 hawa-w-1/2" }) : props.chart)
+    /* @__PURE__ */ React57.createElement(CardContent, null, props.isLoading ? /* @__PURE__ */ React57.createElement(Skeleton, { className: "hawa-h-8 hawa-w-3/4" }) : /* @__PURE__ */ React57.createElement("div", { className: "hawa-text-2xl hawa-font-bold" }, props.number), props.isLoading && props.helperText ? /* @__PURE__ */ React57.createElement(Skeleton, { className: "hawa-mt-2 hawa-h-4 hawa-w-1/2" }) : /* @__PURE__ */ React57.createElement(
+      "p",
+      {
+        className: cn(
+          "hawa-my-0 hawa-text-xs hawa-text-helper-color hawa-transition-all hawa-text-start",
+          props.helperText ? "hawa-opacity-100 hawa-h-4" : "hawa-opacity-0 hawa-h-0"
+        )
+      },
+      props.helperText
+    ), props.isLoading && props.chart ? /* @__PURE__ */ React57.createElement(Skeleton, { className: "hawa-mt-2 hawa-h-4 hawa-w-1/2" }) : props.chart)
   );
 };
 
@@ -8738,7 +8790,6 @@ var FeedbackEmoji = (props) => {
     { icon: /* @__PURE__ */ React77.createElement(VeryBadEmoji, null), value: "very-bad" }
   ];
   const onFeedbackSubmit = async () => {
-    console.log("submitting");
     if (feedbackText) {
       setLoadingSubmit(true);
       try {
@@ -8817,7 +8868,6 @@ var FeedbackEmoji = (props) => {
                   setHelperText(false);
                 }
                 setFeedbackText(e.target.value);
-                console.log("changing to", e.target.value);
               }
             }
           )

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sikka/hawa",
-  "version": "0.13.16-next",
+  "version": "0.13.19-next",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "exports": {