@sikka/hawa 0.7.2-next → 0.7.4-next

package/dist/index.css

@@ -1012,6 +1012,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-h-\[130px\] {
   height: 130px;
 }
+.hawa-h-\[15px\] {
+  height: 15px;
+}
 .hawa-h-\[16px\] {
   height: 16px;
 }
@@ -1119,9 +1122,6 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-w-32 {
   width: 8rem;
 }
-.hawa-w-36 {
-  width: 9rem;
-}
 .hawa-w-4 {
   width: 1rem;
 }
@@ -1671,10 +1671,6 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-bg-opacity: 1;
   background-color: rgb(219 234 254 / var(--tw-bg-opacity));
 }
-.hawa-bg-blue-200 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(191 219 254 / var(--tw-bg-opacity));
-}
 .hawa-bg-blue-50 {
   --tw-bg-opacity: 1;
   background-color: rgb(239 246 255 / var(--tw-bg-opacity));
@@ -1689,6 +1685,10 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-bg-card {
   background-color: hsl(var(--card));
 }
+.hawa-bg-cyan-100 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(207 250 254 / var(--tw-bg-opacity));
+}
 .hawa-bg-destructive {
   --tw-bg-opacity: 1;
   background-color: hsl(var(--destructive) / var(--tw-bg-opacity));
@@ -1748,6 +1748,10 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-bg-muted\/60 {
   background-color: hsl(var(--muted) / 0.6);
 }
+.hawa-bg-orange-100 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 237 213 / var(--tw-bg-opacity));
+}
 .hawa-bg-popover {
   background-color: hsl(var(--popover));
 }
@@ -1772,6 +1776,10 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-bg-primary\/90 {
   background-color: hsl(var(--primary) / 0.9);
 }
+.hawa-bg-purple-100 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(243 232 255 / var(--tw-bg-opacity));
+}
 .hawa-bg-red-100 {
   --tw-bg-opacity: 1;
   background-color: rgb(254 226 226 / var(--tw-bg-opacity));
@@ -1805,6 +1813,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-bg-opacity-80 {
   --tw-bg-opacity: 0.8;
 }
+.hawa-bg-none {
+  background-image: none;
+}
 .hawa-bg-cover {
   background-size: cover;
 }
@@ -2104,16 +2115,16 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-text-opacity: 1;
   color: rgb(29 78 216 / var(--tw-text-opacity));
 }
-.hawa-text-blue-800 {
-  --tw-text-opacity: 1;
-  color: rgb(30 64 175 / var(--tw-text-opacity));
-}
 .hawa-text-card-foreground {
   color: hsl(var(--card-foreground));
 }
 .hawa-text-current {
   color: currentColor;
 }
+.hawa-text-cyan-500 {
+  --tw-text-opacity: 1;
+  color: rgb(6 182 212 / var(--tw-text-opacity));
+}
 .hawa-text-destructive-foreground {
   --tw-text-opacity: 1;
   color: hsl(var(--destructive-foreground) / var(--tw-text-opacity));
@@ -2178,6 +2189,10 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-text-opacity: 1;
   color: rgb(23 23 23 / var(--tw-text-opacity));
 }
+.hawa-text-orange-500 {
+  --tw-text-opacity: 1;
+  color: rgb(249 115 22 / var(--tw-text-opacity));
+}
 .hawa-text-popover-foreground {
   color: hsl(var(--popover-foreground));
 }
@@ -2190,6 +2205,10 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-text-primary\/70 {
   color: hsl(var(--primary) / 0.7);
 }
+.hawa-text-purple-500 {
+  --tw-text-opacity: 1;
+  color: rgb(168 85 247 / var(--tw-text-opacity));
+}
 .hawa-text-red-500 {
   --tw-text-opacity: 1;
   color: rgb(239 68 68 / var(--tw-text-opacity));
@@ -2217,6 +2236,10 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
+.hawa-text-yellow-500 {
+  --tw-text-opacity: 1;
+  color: rgb(234 179 8 / var(--tw-text-opacity));
+}
 .hawa-text-yellow-700 {
   --tw-text-opacity: 1;
   color: rgb(161 98 7 / var(--tw-text-opacity));

package/dist/index.d.mts

@@ -40,6 +40,7 @@ type AdCardTypes = {
     imageURL: string;
     handleHide?: any;
     handleCantHide?: () => void;
+    handleClick?: () => void;
     canHide: boolean;
 };
 declare const AdCard: FC<AdCardTypes>;
@@ -167,8 +168,8 @@ type TCheckBoxTypes = {
     sublabel?: any;
     helperText?: any;
 };
-type HawaCheckboxProps = TCheckBoxTypes & React$1.ComponentProps<typeof CheckboxElement>;
-declare const Checkbox: React$1.FC<HawaCheckboxProps>;
+type CheckboxProps = TCheckBoxTypes & React$1.ComponentProps<typeof CheckboxElement>;
+declare const Checkbox: React$1.FC<CheckboxProps>;
 declare const CheckboxElement: React$1.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
 
 declare const ToastProvider: React$1.FC<ToastPrimitives.ToastProviderProps>;
@@ -235,7 +236,6 @@ type TChipTypes = {
     dot?: boolean;
     /** Red/Green dot next to the label of the chip indicating online/offline or available/unavailable */
     dotType?: "available" | "unavailable";
-    variant?: "default" | "outline";
 };
 declare const Chip: FC<TChipTypes>;
 
@@ -1391,4 +1391,4 @@ declare function useTabs(initialTab?: string): {
     handleTabChange: (index: any) => void;
 };
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppLanding, AppLayout, AppStores, BackToTop, Breadcrumb, Button, ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CheckEmail, Checkbox, Chip, CodeBlock, CodeConfirmation, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ComparingPlans, Copyrights, DataTable, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, DropdownMenu, EmptyState, FeedbackEmoji, FeedbackForm, FeedbackRating, FileDropzone, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HorizontalPricing, Input, InterfaceSettings, Label, LeadGenerator, LegalTexts, Loading, LoginForm, Logos, MenuItemType, NewPasswordForm, NoPermission, NotFound, PhoneInput, PinInput, Popover, PopoverContent, PopoverTrigger, PricingCard, PricingPlans, Progress, Radio, RadioOptionsTypes, RegisterForm, ResetPasswordForm, ScrollArea, ScrollBar, Select, Separator, SidebarGroup, SidebarItem, SimpleTable, Skeleton, Slider, SortButton, Stats, SubItem$2 as SubItem, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Testimonial, Textarea, TextareaProps, Toast$1 as Toast, ToastAction, ToastActionElement, ToastClose, ToastDescription, ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, Tooltip, Usage, UseFocusWithinOptions, UseMediaQueryOptions, UserReferralSource, buttonVariants, reducer, toast, useClipboard, useFocusWithin, useFormField, useMediaQuery, useTabs, useToast };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppLanding, AppLayout, AppStores, BackToTop, Breadcrumb, Button, ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CheckEmail, Checkbox, Chip, CodeBlock, CodeConfirmation, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ComparingPlans, Copyrights, DataTable, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, DropdownMenu, EmptyState, FeedbackEmoji, FeedbackForm, FeedbackRating, FileDropzone, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HorizontalPricing, Input, InterfaceSettings, Label, LeadGenerator, LegalTexts, Loading, LoginForm, Logos, MenuItemType, NewPasswordForm, NoPermission, NotFound, PhoneInput, PinInput, Popover, PopoverContent, PopoverTrigger, PricingCard, PricingPlans, Progress, Radio, RadioOptionsTypes, RegisterForm, ResetPasswordForm, ScrollArea, ScrollBar, Select, Separator, SidebarGroup, SidebarItem, SimpleTable, Skeleton, Slider, SortButton, Stats, SubItem$2 as SubItem, Switch, TChipTypes, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Testimonial, Textarea, TextareaProps, Toast$1 as Toast, ToastAction, ToastActionElement, ToastClose, ToastDescription, ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, Tooltip, Usage, UseFocusWithinOptions, UseMediaQueryOptions, UserReferralSource, buttonVariants, reducer, toast, useClipboard, useFocusWithin, useFormField, useMediaQuery, useTabs, useToast };

package/dist/index.d.ts

@@ -40,6 +40,7 @@ type AdCardTypes = {
     imageURL: string;
     handleHide?: any;
     handleCantHide?: () => void;
+    handleClick?: () => void;
     canHide: boolean;
 };
 declare const AdCard: FC<AdCardTypes>;
@@ -167,8 +168,8 @@ type TCheckBoxTypes = {
     sublabel?: any;
     helperText?: any;
 };
-type HawaCheckboxProps = TCheckBoxTypes & React$1.ComponentProps<typeof CheckboxElement>;
-declare const Checkbox: React$1.FC<HawaCheckboxProps>;
+type CheckboxProps = TCheckBoxTypes & React$1.ComponentProps<typeof CheckboxElement>;
+declare const Checkbox: React$1.FC<CheckboxProps>;
 declare const CheckboxElement: React$1.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
 
 declare const ToastProvider: React$1.FC<ToastPrimitives.ToastProviderProps>;
@@ -235,7 +236,6 @@ type TChipTypes = {
     dot?: boolean;
     /** Red/Green dot next to the label of the chip indicating online/offline or available/unavailable */
     dotType?: "available" | "unavailable";
-    variant?: "default" | "outline";
 };
 declare const Chip: FC<TChipTypes>;
 
@@ -1391,4 +1391,4 @@ declare function useTabs(initialTab?: string): {
     handleTabChange: (index: any) => void;
 };
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppLanding, AppLayout, AppStores, BackToTop, Breadcrumb, Button, ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CheckEmail, Checkbox, Chip, CodeBlock, CodeConfirmation, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ComparingPlans, Copyrights, DataTable, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, DropdownMenu, EmptyState, FeedbackEmoji, FeedbackForm, FeedbackRating, FileDropzone, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HorizontalPricing, Input, InterfaceSettings, Label, LeadGenerator, LegalTexts, Loading, LoginForm, Logos, MenuItemType, NewPasswordForm, NoPermission, NotFound, PhoneInput, PinInput, Popover, PopoverContent, PopoverTrigger, PricingCard, PricingPlans, Progress, Radio, RadioOptionsTypes, RegisterForm, ResetPasswordForm, ScrollArea, ScrollBar, Select, Separator, SidebarGroup, SidebarItem, SimpleTable, Skeleton, Slider, SortButton, Stats, SubItem$2 as SubItem, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Testimonial, Textarea, TextareaProps, Toast$1 as Toast, ToastAction, ToastActionElement, ToastClose, ToastDescription, ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, Tooltip, Usage, UseFocusWithinOptions, UseMediaQueryOptions, UserReferralSource, buttonVariants, reducer, toast, useClipboard, useFocusWithin, useFormField, useMediaQuery, useTabs, useToast };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppLanding, AppLayout, AppStores, BackToTop, Breadcrumb, Button, ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CheckEmail, Checkbox, Chip, CodeBlock, CodeConfirmation, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ComparingPlans, Copyrights, DataTable, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, DropdownMenu, EmptyState, FeedbackEmoji, FeedbackForm, FeedbackRating, FileDropzone, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HorizontalPricing, Input, InterfaceSettings, Label, LeadGenerator, LegalTexts, Loading, LoginForm, Logos, MenuItemType, NewPasswordForm, NoPermission, NotFound, PhoneInput, PinInput, Popover, PopoverContent, PopoverTrigger, PricingCard, PricingPlans, Progress, Radio, RadioOptionsTypes, RegisterForm, ResetPasswordForm, ScrollArea, ScrollBar, Select, Separator, SidebarGroup, SidebarItem, SimpleTable, Skeleton, Slider, SortButton, Stats, SubItem$2 as SubItem, Switch, TChipTypes, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Testimonial, Textarea, TextareaProps, Toast$1 as Toast, ToastAction, ToastActionElement, ToastClose, ToastDescription, ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, Tooltip, Usage, UseFocusWithinOptions, UseMediaQueryOptions, UserReferralSource, buttonVariants, reducer, toast, useClipboard, useFocusWithin, useFormField, useMediaQuery, useTabs, useToast };

package/dist/index.js

@@ -815,9 +815,11 @@ var AdCard = function(_param) {
     };
     return /* @__PURE__ */ import_react2.default.createElement("div", {
         ref: adRef
-    }, /* @__PURE__ */ import_react2.default.createElement("div", _object_spread({
+    }, /* @__PURE__ */ import_react2.default.createElement("div", _object_spread_props(_object_spread({
         className: (0, import_clsx.default)(cardStyles[orientation], "dark:hawa-text-white")
-    }, props), /* @__PURE__ */ import_react2.default.createElement("div", {
+    }, props), {
+        onClick: props.handleClick
+    }), /* @__PURE__ */ import_react2.default.createElement("div", {
         className: "hawa-flex hawa-aspect-square hawa-w-full  hawa-max-w-fit  hawa-items-start "
     }, /* @__PURE__ */ import_react2.default.createElement("img", {
         src: props.imageURL ? props.imageURL : "https://via.placeholder.com/50",
@@ -829,7 +831,8 @@ var AdCard = function(_param) {
     }, props.title), /* @__PURE__ */ import_react2.default.createElement("div", {
         className: "hawa-text-[12px]"
     }, props.description)), props.canHide && /* @__PURE__ */ import_react2.default.createElement("span", {
-        onClick: function() {
+        onClick: function(e) {
+            e.stopPropagation();
             if (props.canHide) {
                 setClosed(true);
                 setTimeout(function() {
@@ -1391,15 +1394,12 @@ var Checkbox = function(_param) {
     }, checkboxProps)), (label || helperText) && /* @__PURE__ */ React11.createElement("div", {
         className: "hawa-grid hawa-gap-1.5 hawa-leading-none"
     }, label && /* @__PURE__ */ React11.createElement("label", {
-        role: "checkbox",
         htmlFor: id,
         className: cn("hawa-cursor-pointer hawa-select-none hawa-text-sm hawa-font-medium hawa-leading-none hawa-pt-0.5", checkboxProps.disabled && "hawa-cursor-not-allowed hawa-text-muted-foreground hawa-opacity-70 ")
     }, label), sublabel && /* @__PURE__ */ React11.createElement("label", {
-        role: "checkbox",
         htmlFor: id,
         className: cn("hawa-cursor-pointer hawa-select-none hawa-text-sm hawa-text-muted-foreground", checkboxProps.disabled && "hawa-cursor-not-allowed hawa-text-muted-foreground hawa-opacity-70")
     }, sublabel), helperText && !checkboxProps.disabled && /* @__PURE__ */ React11.createElement("label", {
-        role: "checkbox",
         htmlFor: id,
         className: cn("hawa-select-none hawa-text-xs  hawa-text-red-500", checkboxProps.disabled && "hawa-cursor-not-allowed hawa-opacity-70")
     }, helperText)));
@@ -1865,12 +1865,12 @@ function Skeleton(_param) {
 var import_react12 = __toESM(require("react"));
 var import_clsx5 = __toESM(require("clsx"));
 var Chip = function(param) {
-    var label = param.label, _param_size = param.size, size = _param_size === void 0 ? "normal" : _param_size, icon = param.icon, color = param.color, dot = param.dot, _param_dotType = param.dotType, dotType = _param_dotType === void 0 ? "available" : _param_dotType;
-    var defaultStyles = "hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-rounded  hawa-px-2.5 hawa-py-0.5  hawa-font-bold hawa-text-blue-800 hawa-bg-blue-200 dark:hawa-text-blue-800";
+    var label = param.label, _param_size = param.size, size = _param_size === void 0 ? "normal" : _param_size, icon = param.icon, color = param.color, dotType = param.dotType;
+    var defaultStyles = "hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-rounded  hawa-px-2.5 hawa-py-1  hawa-font-bold ";
     var sizeStyles = {
-        small: "hawa-h-full hawa-leading-4 hawa-px-1 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 ",
+        small: "hawa-h-[15px] hawa-leading-4 hawa-px-0 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 ",
         normal: "hawa-h-fit hawa-text-xs",
-        large: ""
+        large: "hawa-text-base"
     };
     var dotStyles = {
         small: "hawa-flex hawa-h-1 hawa-w-1 hawa-rounded-full",
@@ -1881,9 +1881,18 @@ var Chip = function(param) {
         available: "hawa-bg-green-500",
         unavailable: "hawa-bg-red-500"
     };
+    var colorStyles = {
+        green: "hawa-bg-green-100 hawa-text-green-500",
+        blue: "hawa-bg-blue-100 hawa-text-blue-500",
+        red: "hawa-bg-red-100 hawa-text-red-500",
+        yellow: "hawa-bg-yellow-100 hawa-text-yellow-500",
+        orange: "hawa-bg-orange-100 hawa-text-orange-500",
+        purple: "hawa-bg-purple-100 hawa-text-purple-500",
+        cyan: "hawa-bg-cyan-100 hawa-text-cyan-500"
+    };
     return /* @__PURE__ */ import_react12.default.createElement("span", {
-        className: (0, import_clsx5.default)(defaultStyles, sizeStyles[size], color ? "hawa-bg-".concat(color, "-100 hawa-text-").concat(color, "-500") : "hawa-bg-layoutPrimary-500")
-    }, dot && /* @__PURE__ */ import_react12.default.createElement("span", {
+        className: (0, import_clsx5.default)(defaultStyles, sizeStyles[size], color ? colorStyles[color] : "hawa-border hawa-bg-none")
+    }, dotType && /* @__PURE__ */ import_react12.default.createElement("span", {
         className: (0, import_clsx5.default)(dotStyles[size], dotTypeStyles[dotType])
     }), icon && icon, label);
 };
@@ -2089,7 +2098,7 @@ var DropdownMenuSubTrigger = React24.forwardRef(function(_param, ref) /* @__PURE
     ]);
     return React24.createElement(DropdownMenuPrimitive.SubTrigger, _object_spread({
         ref: ref,
-        className: cn("hawa-flex hawa-cursor-default hawa-select-none hawa-items-center hawa-justify-between hawa-rounded-sm hawa-px-2 hawa-py-3 hawa-text-sm hawa-outline-none focus:hawa-bg-accent data-[state=open]:hawa-bg-accent", inset && "hawa-pl-8", className)
+        className: cn("hawa-flex hawa-cursor-default hawa-select-none hawa-items-center hawa-justify-between hawa-rounded-sm hawa-text-sm hawa-outline-none focus:hawa-bg-accent data-[state=open]:hawa-bg-accent", inset && "hawa-pl-8", className)
     }, props), /* @__PURE__ */ React24.createElement("div", {
         className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-2"
     }, children), " ", /* @__PURE__ */ React24.createElement("svg", {
@@ -2113,7 +2122,7 @@ var DropdownMenuSubContent = React24.forwardRef(function(_param, ref) /* @__PURE
     ]);
     return React24.createElement(DropdownMenuPrimitive.SubContent, _object_spread({
         ref: ref,
-        className: cn("hawa-z-50 hawa-min-w-[8rem] hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-p-1 hawa-text-popover-foreground hawa-shadow-lg data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2", className)
+        className: cn("hawa-z-50 hawa-min-w-[8rem] hawa-gap-1 hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-p-1 hawa-text-popover-foreground hawa-shadow-lg data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2", className)
     }, props));
 });
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
@@ -2238,7 +2247,7 @@ var DropdownMenu = function(param) {
     };
     var sizeStyles = {
         default: "hawa-px-2 hawa-py-3 ",
-        sm: "hawa-text-xs hawa-px-1.5 hawa-py-1.5"
+        sm: "hawa-text-xs hawa-px-1.5 hawa-py-1.5 "
     };
     return /* @__PURE__ */ React24.createElement(DropdownMenuRoot, {
         dir: direction
@@ -2248,7 +2257,7 @@ var DropdownMenu = function(param) {
     }, trigger), /* @__PURE__ */ React24.createElement(DropdownMenuPortal, null, /* @__PURE__ */ React24.createElement(DropdownMenuContent, {
         side: side,
         sideOffset: sideOffset,
-        className: cn(className, widthStyles[width], "hawa-flex hawa-flex-col hawa-gap-2"),
+        className: cn(className, widthStyles[width], "hawa-flex hawa-flex-col hawa-gap-1"),
         align: align,
         alignOffset: alignOffset
     }, items && items.map(function(item, index) {
@@ -2443,7 +2452,8 @@ var FileDropzone = function(param) {
         setFiles(acceptedFiles);
     }, [
         acceptedFiles,
-        cmp
+        cmp,
+        setFiles
     ]);
     onClearFiles = function() {
         acceptedFiles.length = 0;
@@ -4335,7 +4345,7 @@ var Input = function(_param) {
     }, props.icon && /* @__PURE__ */ import_react17.default.createElement("div", {
         className: "hawa-absolute hawa-left-3 hawa-top-1/2 hawa--translate-y-1/2"
     }, props.icon), /* @__PURE__ */ import_react17.default.createElement("input", {
-        className: cn(defaultInputStyle, "hawa-text-black dark:hawa-text-white", props.icon && "hawa-pl-10", "focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0", preview && "hawa-border-transparent hawa-bg-transparent hawa-px-0", (_props_inputProps = props.inputProps) === null || _props_inputProps === void 0 ? void 0 : _props_inputProps.className),
+        className: cn(defaultInputStyle, " dark:hawa-text-white", props.icon && "hawa-pl-10", "focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0", preview && "hawa-border-transparent hawa-bg-transparent hawa-px-0", (_props_inputProps = props.inputProps) === null || _props_inputProps === void 0 ? void 0 : _props_inputProps.className),
         onChange: props.onChange,
         autoComplete: props.autoComplete,
         value: props.value,
@@ -4977,6 +4987,7 @@ var Accordion = React36.forwardRef(function(_param, ref) /* @__PURE__ */ {
         }, /* @__PURE__ */ React36.createElement(AccordionTrigger, null, item.trigger), /* @__PURE__ */ React36.createElement(AccordionContent, null, item.content));
     }));
 });
+Accordion.displayName = "Accordion";
 var AccordionItem = React36.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
@@ -5298,7 +5309,10 @@ var BackToTop = function(_param) {
             (_props_anchor_current = props.anchor.current) === null || _props_anchor_current === void 0 ? void 0 : _props_anchor_current.removeEventListener("scroll", onScroll);
             clearInterval(interval);
         };
-    }, []);
+    }, [
+        onScroll,
+        props.anchor
+    ]);
     var getStyles = function() {
         var _self_current;
         if (!props.anchor.current || !self.current) return {};
@@ -6204,10 +6218,8 @@ var AppLayout = function(_param) {
     var isRTL = direction === "rtl";
     var _ref = _sliced_to_array((0, import_react31.useState)(""), 2), openedSidebarItem = _ref[0], setOpenedSidebarItem = _ref[1];
     var _ref1 = _sliced_to_array((0, import_react31.useState)(currentPage), 2), selectedItem = _ref1[0], setSelectedItem = _ref1[1];
-    var size;
-    if (typeof window !== "undefined") {
-        size = useBreakpoint_default();
-    } else {
+    var size = useBreakpoint_default();
+    if (typeof window == "undefined") {
         size = 1200;
     }
     var _ref2 = _sliced_to_array((0, import_react31.useState)(function() {
@@ -7922,7 +7934,7 @@ var NotFound = function(param) {
         className: "hawa-m-2 hawa-text-center hawa-text-xl hawa-font-bold "
     }, (_texts_pageNotFound = texts === null || texts === void 0 ? void 0 : texts.pageNotFound) !== null && _texts_pageNotFound !== void 0 ? _texts_pageNotFound : "Page Not Found"), /* @__PURE__ */ import_react49.default.createElement("div", {
         className: "hawa-mb-4 hawa-text-center"
-    }, (_texts_ifLost = texts === null || texts === void 0 ? void 0 : texts.ifLost) !== null && _texts_ifLost !== void 0 ? _texts_ifLost : /* @__PURE__ */ import_react49.default.createElement(import_react49.default.Fragment, null, "If you're lost please contact us", " ", /* @__PURE__ */ import_react49.default.createElement("span", {
+    }, (_texts_ifLost = texts === null || texts === void 0 ? void 0 : texts.ifLost) !== null && _texts_ifLost !== void 0 ? _texts_ifLost : /* @__PURE__ */ import_react49.default.createElement(import_react49.default.Fragment, null, "If you're lost please contact us ", /* @__PURE__ */ import_react49.default.createElement("span", {
         className: "clickable-link"
     }, "help@sikka.io"))), /* @__PURE__ */ import_react49.default.createElement(Button, {
         className: "hawa-w-full"

package/dist/index.mjs

@@ -73,7 +73,8 @@ var AdCard = ({ orientation, ...props }) => {
     "div",
     {
       className: clsx(cardStyles[orientation], "dark:hawa-text-white"),
-      ...props
+      ...props,
+      onClick: props.handleClick
     },
     /* @__PURE__ */ React2.createElement("div", { className: "hawa-flex hawa-aspect-square hawa-w-full  hawa-max-w-fit  hawa-items-start " }, /* @__PURE__ */ React2.createElement(
       "img",
@@ -86,7 +87,8 @@ var AdCard = ({ orientation, ...props }) => {
     props.canHide && /* @__PURE__ */ React2.createElement(
       "span",
       {
-        onClick: () => {
+        onClick: (e) => {
+          e.stopPropagation();
           if (props.canHide) {
             setClosed(true);
             setTimeout(() => {
@@ -749,7 +751,6 @@ var Checkbox = ({
   return /* @__PURE__ */ React11.createElement("div", { className: "hawa-items-top  hawa-flex hawa-gap-2 " }, /* @__PURE__ */ React11.createElement(CheckboxElement, { id, ...checkboxProps }), (label || helperText) && /* @__PURE__ */ React11.createElement("div", { className: "hawa-grid hawa-gap-1.5 hawa-leading-none" }, label && /* @__PURE__ */ React11.createElement(
     "label",
     {
-      role: "checkbox",
       htmlFor: id,
       className: cn(
         "hawa-cursor-pointer hawa-select-none hawa-text-sm hawa-font-medium hawa-leading-none hawa-pt-0.5",
@@ -760,7 +761,6 @@ var Checkbox = ({
   ), sublabel && /* @__PURE__ */ React11.createElement(
     "label",
     {
-      role: "checkbox",
       htmlFor: id,
       className: cn(
         "hawa-cursor-pointer hawa-select-none hawa-text-sm hawa-text-muted-foreground",
@@ -771,7 +771,6 @@ var Checkbox = ({
   ), helperText && !checkboxProps.disabled && /* @__PURE__ */ React11.createElement(
     "label",
     {
-      role: "checkbox",
       htmlFor: id,
       className: cn(
         "hawa-select-none hawa-text-xs  hawa-text-red-500",
@@ -1314,14 +1313,13 @@ var Chip = ({
   size = "normal",
   icon,
   color,
-  dot,
-  dotType = "available"
+  dotType
 }) => {
-  let defaultStyles = "hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-rounded  hawa-px-2.5 hawa-py-0.5  hawa-font-bold hawa-text-blue-800 hawa-bg-blue-200 dark:hawa-text-blue-800";
+  let defaultStyles = "hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-rounded  hawa-px-2.5 hawa-py-1  hawa-font-bold ";
   let sizeStyles = {
-    small: "hawa-h-full hawa-leading-4 hawa-px-1 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 ",
+    small: "hawa-h-[15px] hawa-leading-4 hawa-px-0 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 ",
     normal: "hawa-h-fit hawa-text-xs",
-    large: ""
+    large: "hawa-text-base"
   };
   let dotStyles = {
     small: "hawa-flex hawa-h-1 hawa-w-1 hawa-rounded-full",
@@ -1332,16 +1330,25 @@ var Chip = ({
     available: "hawa-bg-green-500",
     unavailable: "hawa-bg-red-500"
   };
+  let colorStyles = {
+    green: "hawa-bg-green-100 hawa-text-green-500",
+    blue: "hawa-bg-blue-100 hawa-text-blue-500",
+    red: "hawa-bg-red-100 hawa-text-red-500",
+    yellow: "hawa-bg-yellow-100 hawa-text-yellow-500",
+    orange: "hawa-bg-orange-100 hawa-text-orange-500",
+    purple: "hawa-bg-purple-100 hawa-text-purple-500",
+    cyan: "hawa-bg-cyan-100 hawa-text-cyan-500"
+  };
   return /* @__PURE__ */ React18.createElement(
     "span",
     {
       className: clsx5(
         defaultStyles,
         sizeStyles[size],
-        color ? `hawa-bg-${color}-100 hawa-text-${color}-500` : "hawa-bg-layoutPrimary-500"
+        color ? colorStyles[color] : "hawa-border hawa-bg-none"
       )
     },
-    dot && /* @__PURE__ */ React18.createElement("span", { className: clsx5(dotStyles[size], dotTypeStyles[dotType]) }),
+    dotType && /* @__PURE__ */ React18.createElement("span", { className: clsx5(dotStyles[size], dotTypeStyles[dotType]) }),
     icon && icon,
     label
   );
@@ -1577,7 +1584,7 @@ var DropdownMenuSubTrigger = React24.forwardRef(({ className, inset, children, .
   {
     ref,
     className: cn(
-      "hawa-flex hawa-cursor-default hawa-select-none hawa-items-center hawa-justify-between hawa-rounded-sm hawa-px-2 hawa-py-3 hawa-text-sm hawa-outline-none focus:hawa-bg-accent data-[state=open]:hawa-bg-accent",
+      "hawa-flex hawa-cursor-default hawa-select-none hawa-items-center hawa-justify-between hawa-rounded-sm hawa-text-sm hawa-outline-none focus:hawa-bg-accent data-[state=open]:hawa-bg-accent",
       inset && "hawa-pl-8",
       className
     ),
@@ -1612,7 +1619,7 @@ var DropdownMenuSubContent = React24.forwardRef(({ className, ...props }, ref) =
   {
     ref,
     className: cn(
-      "hawa-z-50 hawa-min-w-[8rem] hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-p-1 hawa-text-popover-foreground hawa-shadow-lg data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
+      "hawa-z-50 hawa-min-w-[8rem] hawa-gap-1 hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-p-1 hawa-text-popover-foreground hawa-shadow-lg data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
       className
     ),
     ...props
@@ -1769,7 +1776,7 @@ var DropdownMenu = ({
   };
   const sizeStyles = {
     default: "hawa-px-2 hawa-py-3 ",
-    sm: "hawa-text-xs hawa-px-1.5 hawa-py-1.5"
+    sm: "hawa-text-xs hawa-px-1.5 hawa-py-1.5 "
   };
   return /* @__PURE__ */ React24.createElement(DropdownMenuRoot, { dir: direction }, /* @__PURE__ */ React24.createElement(DropdownMenuTrigger, { asChild: true, className: triggerClassname }, trigger), /* @__PURE__ */ React24.createElement(DropdownMenuPortal, null, /* @__PURE__ */ React24.createElement(
     DropdownMenuContent,
@@ -1779,7 +1786,7 @@ var DropdownMenu = ({
       className: cn(
         className,
         widthStyles[width],
-        "hawa-flex hawa-flex-col hawa-gap-2"
+        "hawa-flex hawa-flex-col hawa-gap-1"
       ),
       align,
       alignOffset
@@ -2026,7 +2033,7 @@ var FileDropzone = ({
   );
   useEffect8(() => {
     setFiles(acceptedFiles);
-  }, [acceptedFiles, cmp]);
+  }, [acceptedFiles, cmp, setFiles]);
   onClearFiles = () => {
     acceptedFiles.length = 0;
     acceptedFiles.splice(0, acceptedFiles.length);
@@ -3933,7 +3940,7 @@ var Input = ({
       {
         className: cn(
           defaultInputStyle,
-          "hawa-text-black dark:hawa-text-white",
+          " dark:hawa-text-white",
           props.icon && "hawa-pl-10",
           "focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0",
           preview && "hawa-border-transparent hawa-bg-transparent hawa-px-0",
@@ -4607,6 +4614,7 @@ var SimpleTable = ({
 import * as React36 from "react";
 import * as AccordionPrimitive from "@radix-ui/react-accordion";
 var Accordion = React36.forwardRef(({ items, className, ...props }, ref) => /* @__PURE__ */ React36.createElement(AccordionPrimitive.Root, { type: props.type, collapsible: true }, items.map((item, index) => /* @__PURE__ */ React36.createElement(AccordionItem, { key: index, value: `item-${index}` }, /* @__PURE__ */ React36.createElement(AccordionTrigger, null, item.trigger), /* @__PURE__ */ React36.createElement(AccordionContent, null, item.content)))));
+Accordion.displayName = "Accordion";
 var AccordionItem = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React36.createElement(AccordionPrimitive.Item, { ref, className: cn(className), ...props }));
 AccordionItem.displayName = "AccordionItem";
 var AccordionTrigger = React36.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React36.createElement(AccordionPrimitive.Header, { className: "hawa-flex" }, /* @__PURE__ */ React36.createElement(
@@ -4939,7 +4947,7 @@ var BackToTop = ({ ...props }) => {
       props.anchor.current?.removeEventListener("scroll", onScroll);
       clearInterval(interval);
     };
-  }, []);
+  }, [onScroll, props.anchor]);
   const getStyles = () => {
     if (!props.anchor.current || !self.current)
       return {};
@@ -5926,10 +5934,8 @@ var AppLayout = ({
   const isRTL = direction === "rtl";
   const [openedSidebarItem, setOpenedSidebarItem] = useState18("");
   const [selectedItem, setSelectedItem] = useState18(currentPage);
-  let size;
-  if (typeof window !== "undefined") {
-    size = useBreakpoint_default();
-  } else {
+  let size = useBreakpoint_default();
+  if (typeof window == "undefined") {
     size = 1200;
   }
   const [keepOpen, setKeepOpen] = useState18(() => {
@@ -7739,7 +7745,7 @@ var NotFound = ({
   variant = "contained",
   texts
 }) => {
-  return /* @__PURE__ */ React68.createElement(Card, null, /* @__PURE__ */ React68.createElement(CardContent, { headless: true }, /* @__PURE__ */ React68.createElement("div", { className: "hawa-flex hawa-flex-col hawa-items-center dark:hawa-text-white" }, /* @__PURE__ */ React68.createElement("div", { className: "hawa-text-center hawa-text-6xl hawa-font-bold " }, "404"), /* @__PURE__ */ React68.createElement("div", { className: "hawa-m-2 hawa-text-center hawa-text-xl hawa-font-bold " }, texts?.pageNotFound ?? "Page Not Found"), /* @__PURE__ */ React68.createElement("div", { className: "hawa-mb-4 hawa-text-center" }, texts?.ifLost ?? /* @__PURE__ */ React68.createElement(React68.Fragment, null, "If you're lost please contact us", " ", /* @__PURE__ */ React68.createElement("span", { className: "clickable-link" }, "help@sikka.io"))), /* @__PURE__ */ React68.createElement(Button, { className: "hawa-w-full" }, texts?.home ?? "Home"))));
+  return /* @__PURE__ */ React68.createElement(Card, null, /* @__PURE__ */ React68.createElement(CardContent, { headless: true }, /* @__PURE__ */ React68.createElement("div", { className: "hawa-flex hawa-flex-col hawa-items-center dark:hawa-text-white" }, /* @__PURE__ */ React68.createElement("div", { className: "hawa-text-center hawa-text-6xl hawa-font-bold " }, "404"), /* @__PURE__ */ React68.createElement("div", { className: "hawa-m-2 hawa-text-center hawa-text-xl hawa-font-bold " }, texts?.pageNotFound ?? "Page Not Found"), /* @__PURE__ */ React68.createElement("div", { className: "hawa-mb-4 hawa-text-center" }, texts?.ifLost ?? /* @__PURE__ */ React68.createElement(React68.Fragment, null, "If you're lost please contact us ", /* @__PURE__ */ React68.createElement("span", { className: "clickable-link" }, "help@sikka.io"))), /* @__PURE__ */ React68.createElement(Button, { className: "hawa-w-full" }, texts?.home ?? "Home"))));
 };
 
 // components/blocks/misc/NoPermission.tsx

package/package.json

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