@sikka/hawa 0.18.14-next → 0.18.18-next

package/dist/index.css

@@ -1054,6 +1054,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-top-\[22px\] {
   top: 22px;
 }
+.hawa-top-\[47px\] {
+  top: 47px;
+}
 .hawa-top-\[50\%\] {
   top: 50%;
 }
@@ -1081,6 +1084,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-z-10 {
   z-index: 10;
 }
+.hawa-z-20 {
+  z-index: 20;
+}
 .hawa-z-30 {
   z-index: 30;
 }
@@ -1310,9 +1316,6 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-h-24 {
   height: 6rem;
 }
-.hawa-h-28 {
-  height: 7rem;
-}
 .hawa-h-3 {
   height: 0.75rem;
 }
@@ -1403,6 +1406,12 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-h-\[44px\] {
   height: 44px;
 }
+.hawa-h-\[72px\] {
+  height: 72px;
+}
+.hawa-h-\[88px\] {
+  height: 88px;
+}
 .hawa-h-\[calc\(100dvh\)\] {
   height: calc(100dvh);
 }
@@ -1492,9 +1501,6 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-w-24 {
   width: 6rem;
 }
-.hawa-w-28 {
-  width: 7rem;
-}
 .hawa-w-3 {
   width: 0.75rem;
 }
@@ -1573,6 +1579,12 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-w-\[47px\] {
   width: 47px;
 }
+.hawa-w-\[72px\] {
+  width: 72px;
+}
+.hawa-w-\[88px\] {
+  width: 88px;
+}
 .hawa-w-auto {
   width: auto;
 }
@@ -1713,6 +1725,10 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-translate-x: -50%;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+.hawa-translate-y-1\/2 {
+  --tw-translate-y: 50%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .hawa-translate-y-\[-50\%\] {
   --tw-translate-y: -50%;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -2952,6 +2968,11 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
+.hawa-shadow-none {
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
 .hawa-shadow-sm {
   --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
   --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
@@ -2972,6 +2993,10 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-ring-offset-background {
   --tw-ring-offset-color: hsl(var(--background));
 }
+.hawa-drop-shadow-md {
+  --tw-drop-shadow: drop-shadow(0 4px 3px rgb(0 0 0 / 0.07)) drop-shadow(0 2px 2px rgb(0 0 0 / 0.06));
+  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
+}
 .hawa-drop-shadow-xl {
   --tw-drop-shadow: drop-shadow(0 20px 13px rgb(0 0 0 / 0.03)) drop-shadow(0 8px 5px rgb(0 0 0 / 0.08));
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);

package/dist/index.d.mts

@@ -296,6 +296,8 @@ declare const Input: React__default.ForwardRefExoticComponent<React__default.Inp
     } | undefined;
     startIcon?: React__default.ReactNode;
     placeholder?: React__default.ReactNode;
+    /** Show the count of characters left in the input field. Works along with maxLength prop.   */
+    showCount?: boolean | undefined;
 } & React__default.RefAttributes<HTMLInputElement>>;
 
 type ComboboxTypes<T> = {
@@ -367,7 +369,7 @@ interface AvatarProps {
     isUploadable?: boolean;
     src?: string;
     alt?: string;
-    size?: "xs" | "sm" | "default" | "lg" | "xl" | "2xl" | "3xl" | "4xl";
+    size?: "2xs" | "xs" | "sm" | "default" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl";
     radius?: RadiusType;
     className?: string;
 }
@@ -611,8 +613,8 @@ interface PopoverProps {
     disableTrigger?: any;
     width?: "trigger" | "default";
     open?: boolean;
-    contentProps?: any;
-    triggerProps?: any;
+    contentProps?: PopoverPrimitive.PopoverContentProps;
+    triggerProps?: PopoverPrimitive.PopoverTriggerProps;
 }
 type HawaPopoverTypes = PopoverProps & React$1.ComponentProps<typeof PopoverPrimitive.Root>;
 declare const Popover: React$1.FC<HawaPopoverTypes>;
@@ -1535,18 +1537,24 @@ type ComponentTypes = {
 };
 declare const FeedbackEmoji: FC<ComponentTypes>;
 
+type FeedbackFormRequestTypeInputProps = BaseInputType & {
+    required?: string;
+};
+type FeedbackFormDescriptionInputProps = BaseInputType & {
+    required?: string;
+    tooShort?: string;
+};
 type FeedbackFormType = {
     onSubmit: (e: any) => void;
     requestTypes?: {
         label: string;
         value: any;
     }[];
+    selectProps?: any;
+    cardless?: boolean;
     texts: {
-        requestType?: string;
-        requestTypeRequired?: string;
-        description?: string;
-        descriptionRequired?: string;
-        descriptionTooShort?: string;
+        requestType: FeedbackFormRequestTypeInputProps;
+        description: FeedbackFormDescriptionInputProps;
         submit?: string;
     };
 };
@@ -1839,4 +1847,4 @@ declare function useTabs(initialTab?: string): {
     handleTabChange: (index: any) => void;
 };
 
-export { Accordion, AccordionContent, AccordionItem, AccordionRoot, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppLanding, AppLayout, AppSidebarItemProps, AppStores, AppTabs, AppTopbar, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, Button, ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CheckEmail, Checkbox, Chip, ChipColors, ChipTypes, CodeBlock, CodeConfirmation, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ComparingPlans, Copyrights, Count, DataTable, DestroyableCard, Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger, DocsLayout, DocsSidebar, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FeedbackEmoji, FeedbackForm, FeedbackRating, FileDropzone, FileUploader, HorizontalPricing, Input, InterfaceSettings, ItemCard, Label, LabelProps, LandingCard, LeadGenerator, LegalTexts, Loading, LoginForm, Logos, MenuItemType, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NavMenuItem, Navbar, NavigationMenu, NavigationMenuLink, NewPasswordForm, NoPermission, NotFound, Pagination, PasswordInput, PasswordStrengthIndicator, PhoneInput, PinInput, Popover, PopoverContent, PopoverTrigger, PricingCard, PricingPlans, Progress, ProgressCircle, Radio, RadioOptionsTypes, RegisterForm, ResetPasswordForm, ScrollArea, ScrollBar, ScrollIndicator, Select, SelectOptionProps, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SidebarGroup, SidebarItem, SimpleTable, Skeleton, Slider, SortButton, SplitButton, Stats, StopPropagationWrapper, SubItem$1 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, useBreakpoint, useClipboard, useDialogCarousel, useFocusWithin, useIsomorphicEffect, useMediaQuery, useMultiStepDialog, useTabs, useToast, useWindowSize };
+export { Accordion, AccordionContent, AccordionItem, AccordionRoot, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppLanding, AppLayout, type AppSidebarItemProps, AppStores, AppTabs, AppTopbar, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CheckEmail, Checkbox, Chip, type ChipColors, type ChipTypes, CodeBlock, CodeConfirmation, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ComparingPlans, Copyrights, Count, DataTable, DestroyableCard, Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger, DocsLayout, DocsSidebar, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FeedbackEmoji, FeedbackForm, FeedbackRating, FileDropzone, FileUploader, HorizontalPricing, Input, InterfaceSettings, ItemCard, Label, type LabelProps, LandingCard, LeadGenerator, LegalTexts, Loading, LoginForm, Logos, type MenuItemType, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NavMenuItem, Navbar, NavigationMenu, NavigationMenuLink, NewPasswordForm, NoPermission, NotFound, Pagination, PasswordInput, PasswordStrengthIndicator, PhoneInput, PinInput, Popover, PopoverContent, PopoverTrigger, PricingCard, PricingPlans, Progress, ProgressCircle, Radio, type RadioOptionsTypes, RegisterForm, ResetPasswordForm, ScrollArea, ScrollBar, ScrollIndicator, Select, type SelectOptionProps, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SidebarGroup, SidebarItem, SimpleTable, Skeleton, Slider, SortButton, SplitButton, Stats, StopPropagationWrapper, type SubItem$1 as SubItem, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Testimonial, Textarea, type TextareaProps, Toast$1 as Toast, ToastAction, type ToastActionElement, ToastClose, ToastDescription, type ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, Tooltip, Usage, type UseFocusWithinOptions, type UseMediaQueryOptions, UserReferralSource, buttonVariants, reducer, toast, useBreakpoint, useClipboard, useDialogCarousel, useFocusWithin, useIsomorphicEffect, useMediaQuery, useMultiStepDialog, useTabs, useToast, useWindowSize };

package/dist/index.d.ts

@@ -296,6 +296,8 @@ declare const Input: React__default.ForwardRefExoticComponent<React__default.Inp
     } | undefined;
     startIcon?: React__default.ReactNode;
     placeholder?: React__default.ReactNode;
+    /** Show the count of characters left in the input field. Works along with maxLength prop.   */
+    showCount?: boolean | undefined;
 } & React__default.RefAttributes<HTMLInputElement>>;
 
 type ComboboxTypes<T> = {
@@ -367,7 +369,7 @@ interface AvatarProps {
     isUploadable?: boolean;
     src?: string;
     alt?: string;
-    size?: "xs" | "sm" | "default" | "lg" | "xl" | "2xl" | "3xl" | "4xl";
+    size?: "2xs" | "xs" | "sm" | "default" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl";
     radius?: RadiusType;
     className?: string;
 }
@@ -611,8 +613,8 @@ interface PopoverProps {
     disableTrigger?: any;
     width?: "trigger" | "default";
     open?: boolean;
-    contentProps?: any;
-    triggerProps?: any;
+    contentProps?: PopoverPrimitive.PopoverContentProps;
+    triggerProps?: PopoverPrimitive.PopoverTriggerProps;
 }
 type HawaPopoverTypes = PopoverProps & React$1.ComponentProps<typeof PopoverPrimitive.Root>;
 declare const Popover: React$1.FC<HawaPopoverTypes>;
@@ -1535,18 +1537,24 @@ type ComponentTypes = {
 };
 declare const FeedbackEmoji: FC<ComponentTypes>;
 
+type FeedbackFormRequestTypeInputProps = BaseInputType & {
+    required?: string;
+};
+type FeedbackFormDescriptionInputProps = BaseInputType & {
+    required?: string;
+    tooShort?: string;
+};
 type FeedbackFormType = {
     onSubmit: (e: any) => void;
     requestTypes?: {
         label: string;
         value: any;
     }[];
+    selectProps?: any;
+    cardless?: boolean;
     texts: {
-        requestType?: string;
-        requestTypeRequired?: string;
-        description?: string;
-        descriptionRequired?: string;
-        descriptionTooShort?: string;
+        requestType: FeedbackFormRequestTypeInputProps;
+        description: FeedbackFormDescriptionInputProps;
         submit?: string;
     };
 };
@@ -1839,4 +1847,4 @@ declare function useTabs(initialTab?: string): {
     handleTabChange: (index: any) => void;
 };
 
-export { Accordion, AccordionContent, AccordionItem, AccordionRoot, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppLanding, AppLayout, AppSidebarItemProps, AppStores, AppTabs, AppTopbar, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, Button, ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CheckEmail, Checkbox, Chip, ChipColors, ChipTypes, CodeBlock, CodeConfirmation, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ComparingPlans, Copyrights, Count, DataTable, DestroyableCard, Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger, DocsLayout, DocsSidebar, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FeedbackEmoji, FeedbackForm, FeedbackRating, FileDropzone, FileUploader, HorizontalPricing, Input, InterfaceSettings, ItemCard, Label, LabelProps, LandingCard, LeadGenerator, LegalTexts, Loading, LoginForm, Logos, MenuItemType, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NavMenuItem, Navbar, NavigationMenu, NavigationMenuLink, NewPasswordForm, NoPermission, NotFound, Pagination, PasswordInput, PasswordStrengthIndicator, PhoneInput, PinInput, Popover, PopoverContent, PopoverTrigger, PricingCard, PricingPlans, Progress, ProgressCircle, Radio, RadioOptionsTypes, RegisterForm, ResetPasswordForm, ScrollArea, ScrollBar, ScrollIndicator, Select, SelectOptionProps, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SidebarGroup, SidebarItem, SimpleTable, Skeleton, Slider, SortButton, SplitButton, Stats, StopPropagationWrapper, SubItem$1 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, useBreakpoint, useClipboard, useDialogCarousel, useFocusWithin, useIsomorphicEffect, useMediaQuery, useMultiStepDialog, useTabs, useToast, useWindowSize };
+export { Accordion, AccordionContent, AccordionItem, AccordionRoot, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppLanding, AppLayout, type AppSidebarItemProps, AppStores, AppTabs, AppTopbar, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CheckEmail, Checkbox, Chip, type ChipColors, type ChipTypes, CodeBlock, CodeConfirmation, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ComparingPlans, Copyrights, Count, DataTable, DestroyableCard, Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger, DocsLayout, DocsSidebar, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FeedbackEmoji, FeedbackForm, FeedbackRating, FileDropzone, FileUploader, HorizontalPricing, Input, InterfaceSettings, ItemCard, Label, type LabelProps, LandingCard, LeadGenerator, LegalTexts, Loading, LoginForm, Logos, type MenuItemType, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NavMenuItem, Navbar, NavigationMenu, NavigationMenuLink, NewPasswordForm, NoPermission, NotFound, Pagination, PasswordInput, PasswordStrengthIndicator, PhoneInput, PinInput, Popover, PopoverContent, PopoverTrigger, PricingCard, PricingPlans, Progress, ProgressCircle, Radio, type RadioOptionsTypes, RegisterForm, ResetPasswordForm, ScrollArea, ScrollBar, ScrollIndicator, Select, type SelectOptionProps, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SidebarGroup, SidebarItem, SimpleTable, Skeleton, Slider, SortButton, SplitButton, Stats, StopPropagationWrapper, type SubItem$1 as SubItem, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Testimonial, Textarea, type TextareaProps, Toast$1 as Toast, ToastAction, type ToastActionElement, ToastClose, ToastDescription, type ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, Tooltip, Usage, type UseFocusWithinOptions, type UseMediaQueryOptions, UserReferralSource, buttonVariants, reducer, toast, useBreakpoint, useClipboard, useDialogCarousel, useFocusWithin, useIsomorphicEffect, useMediaQuery, useMultiStepDialog, useTabs, useToast, useWindowSize };

package/dist/index.js

@@ -3787,6 +3787,7 @@ var Input = (0, import_react15.forwardRef)(
     forceHideHelperText = false,
     labelProps,
     placeholder,
+    showCount,
     ...props
   }, ref) => {
     var _a, _b;
@@ -3835,6 +3836,7 @@ var Input = (0, import_react15.forwardRef)(
       ), /* @__PURE__ */ import_react15.default.createElement(
         "input",
         {
+          ...props,
           required: true,
           dir: props.dir,
           type: props.type,
@@ -3863,6 +3865,25 @@ var Input = (0, import_react15.forwardRef)(
           )
         },
         props.helperText
+      ), !props.disabled && forceHideHelperText && /* @__PURE__ */ import_react15.default.createElement(
+        "div",
+        {
+          className: cn(
+            "hawa-absolute hawa-top-[47px] hawa-text-sm hawa-text-helper-color hawa-transition-all hawa-text-start hawa-rounded hawa-end-0  hawa-z-20 hawa-drop-shadow-md hawa-bg-background hawa-translate-y-1/2",
+            props.helperText ? "hawa-border hawa-p-1" : " hawa-border-none hawa-p-0"
+          )
+        },
+        props.helperText
+      ), showCount && /* @__PURE__ */ import_react15.default.createElement(
+        "div",
+        {
+          className: cn(
+            "hawa-absolute hawa-top-[60px] hawa-text-sm hawa-transition-all hawa-text-start hawa-end-0   hawa-translate-y-1/2"
+          )
+        },
+        props.value ? String(props.value).length : 0,
+        "/",
+        props.maxLength
       )))
     );
   }
@@ -4515,14 +4536,17 @@ var Avatar = ({
   ...props
 }) => {
   let sizeStyles = {
-    xs: "hawa-h-4 hawa-w-4",
+    "2xs": "hawa-h-4 hawa-w-4",
+    xs: "hawa-h-6 hawa-w-6",
     sm: "hawa-h-8 hawa-w-8",
-    default: "hawa-h-12 hawa-w-12",
-    lg: "hawa-h-16 hawa-w-16",
-    xl: "hawa-h-20 hawa-w-20",
-    "2xl": "hawa-h-24 hawa-w-24",
-    "3xl": "hawa-h-28 hawa-w-28",
-    "4xl": "hawa-h-32 hawa-w-32"
+    default: "hawa-h-10 hawa-w-10",
+    lg: "hawa-h-12 hawa-w-12",
+    xl: "hawa-h-14 hawa-w-14",
+    "2xl": "hawa-h-16 hawa-w-16",
+    "3xl": "hawa-h-[72px] hawa-w-[72px]",
+    "4xl": "hawa-h-20 hawa-w-20",
+    "5xl": "hawa-h-[88px] hawa-w-[88px]",
+    "6xl": "hawa-h-24 hawa-w-24"
   };
   let radiusStyles = {
     full: "hawa-rounded-full",
@@ -4543,7 +4567,7 @@ var Avatar = ({
       FileUploader,
       {
         className: cn(
-          "hawa-bg-red-400 hawa-absolute hawa-top-0 hawa-left-0 hawa-opacity-0",
+          "hawa-bg-red-400 hawa-absolute hawa-w- hawa-top-0 hawa-left-0 hawa-opacity-0",
           sizeStyles[size],
           radiusStyles[radius],
           (!isUploadable || !!src) && "hawa-hidden"
@@ -4562,6 +4586,30 @@ var Avatar = ({
         src,
         alt
       }
+    ),
+    !src && !isUploadable && /* @__PURE__ */ import_react17.default.createElement(
+      "div",
+      {
+        className: cn(
+          sizeStyles[size],
+          "hawa-justify-center hawa-items-center hawa-flex hawa-flex-col"
+        )
+      },
+      /* @__PURE__ */ import_react17.default.createElement(
+        "svg",
+        {
+          xmlns: "http://www.w3.org/2000/svg",
+          style: { width: "50%", opacity: 0.35 },
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        },
+        /* @__PURE__ */ import_react17.default.createElement("circle", { cx: "12", cy: "8", r: "5" }),
+        /* @__PURE__ */ import_react17.default.createElement("path", { d: "M20 21a8 8 0 1 0-16 0" })
+      )
     )
   );
 };
@@ -10554,65 +10602,75 @@ var z7 = __toESM(require("zod"));
 var FeedbackForm = (props) => {
   var _a, _b;
   const formSchema = z7.object({
-    requestType: z7.string({ required_error: props.texts.requestTypeRequired }).min(1, { message: props.texts.requestTypeRequired }),
-    description: z7.string({ required_error: props.texts.descriptionRequired }).min(10, { message: props.texts.descriptionTooShort })
+    requestType: z7.string({ required_error: props.texts.requestType.required }).min(1, { message: props.texts.requestType.required }),
+    description: z7.string({ required_error: props.texts.description.required }).min(10, { message: props.texts.description.tooShort })
   });
   const { handleSubmit, control, formState } = (0, import_react_hook_form7.useForm)({
     resolver: (0, import_zod7.zodResolver)(formSchema)
   });
-  return /* @__PURE__ */ import_react59.default.createElement(Card, null, /* @__PURE__ */ import_react59.default.createElement(CardContent, { headless: true }, /* @__PURE__ */ import_react59.default.createElement(
-    "form",
+  return /* @__PURE__ */ import_react59.default.createElement(
+    Card,
     {
-      noValidate: true,
-      onSubmit: handleSubmit((e) => {
-        if (props.onSubmit) {
-          return props.onSubmit(e);
-        } else {
-          console.log("Form is submitted but onSubmit prop is missing");
-        }
-      }),
-      className: "hawa-flex hawa-flex-col hawa-gap-4"
+      className: cn(
+        props.cardless ? "hawa-bg-transparent hawa-border-none hawa-shadow-none" : ""
+      )
     },
-    /* @__PURE__ */ import_react59.default.createElement(Label2, null, (_a = props.texts) == null ? void 0 : _a.requestType),
-    /* @__PURE__ */ import_react59.default.createElement(
-      import_react_hook_form7.Controller,
+    /* @__PURE__ */ import_react59.default.createElement(CardContent, { headless: true }, /* @__PURE__ */ import_react59.default.createElement(
+      "form",
       {
-        name: "requestType",
-        control,
-        render: ({ field }) => {
-          var _a2, _b2;
-          return /* @__PURE__ */ import_react59.default.createElement(
-            Select,
-            {
-              ...field,
-              onChange: (option) => field.onChange(option.value),
-              options: props.requestTypes,
-              helperText: (_b2 = (_a2 = formState.errors.requestType) == null ? void 0 : _a2.message) == null ? void 0 : _b2.toString()
-            }
-          );
+        noValidate: true,
+        onSubmit: handleSubmit((e) => {
+          if (props.onSubmit) {
+            return props.onSubmit(e);
+          } else {
+            console.log("Form is submitted but onSubmit prop is missing");
+          }
+        }),
+        className: "hawa-flex hawa-flex-col hawa-gap-4"
+      },
+      /* @__PURE__ */ import_react59.default.createElement(Label2, null, (_a = props.texts) == null ? void 0 : _a.requestType.label),
+      /* @__PURE__ */ import_react59.default.createElement(
+        import_react_hook_form7.Controller,
+        {
+          name: "requestType",
+          control,
+          render: ({ field }) => {
+            var _a2, _b2, _c;
+            return /* @__PURE__ */ import_react59.default.createElement(
+              Select,
+              {
+                ...field,
+                ...props.selectProps,
+                onChange: (option) => field.onChange(option.value),
+                options: props.requestTypes,
+                helperText: (_b2 = (_a2 = formState.errors.requestType) == null ? void 0 : _a2.message) == null ? void 0 : _b2.toString(),
+                placeholder: (_c = props.texts) == null ? void 0 : _c.requestType.placeholder
+              }
+            );
+          }
         }
-      }
-    ),
-    /* @__PURE__ */ import_react59.default.createElement(Label2, null, props.texts.description),
-    /* @__PURE__ */ import_react59.default.createElement(
-      import_react_hook_form7.Controller,
-      {
-        name: "description",
-        control,
-        render: ({ field }) => {
-          var _a2, _b2;
-          return /* @__PURE__ */ import_react59.default.createElement(
-            Textarea,
-            {
-              ...field,
-              helperText: formState.errors.description && ((_b2 = (_a2 = formState.errors.description) == null ? void 0 : _a2.message) == null ? void 0 : _b2.toString())
-            }
-          );
+      ),
+      /* @__PURE__ */ import_react59.default.createElement(Label2, null, props.texts.description.label),
+      /* @__PURE__ */ import_react59.default.createElement(
+        import_react_hook_form7.Controller,
+        {
+          name: "description",
+          control,
+          render: ({ field }) => {
+            var _a2, _b2;
+            return /* @__PURE__ */ import_react59.default.createElement(
+              Textarea,
+              {
+                ...field,
+                helperText: formState.errors.description && ((_b2 = (_a2 = formState.errors.description) == null ? void 0 : _a2.message) == null ? void 0 : _b2.toString())
+              }
+            );
+          }
         }
-      }
-    ),
-    /* @__PURE__ */ import_react59.default.createElement(Button, { type: "submit" }, (_b = props.texts) == null ? void 0 : _b.submit)
-  )));
+      ),
+      /* @__PURE__ */ import_react59.default.createElement(Button, { type: "submit" }, (_b = props.texts) == null ? void 0 : _b.submit)
+    ))
+  );
 };
 
 // components/blocks/misc/LegalTexts.tsx

package/dist/index.mjs

@@ -3565,6 +3565,7 @@ var Input = forwardRef9(
     forceHideHelperText = false,
     labelProps,
     placeholder,
+    showCount,
     ...props
   }, ref) => {
     var _a, _b;
@@ -3613,6 +3614,7 @@ var Input = forwardRef9(
       ), /* @__PURE__ */ React24.createElement(
         "input",
         {
+          ...props,
           required: true,
           dir: props.dir,
           type: props.type,
@@ -3641,6 +3643,25 @@ var Input = forwardRef9(
           )
         },
         props.helperText
+      ), !props.disabled && forceHideHelperText && /* @__PURE__ */ React24.createElement(
+        "div",
+        {
+          className: cn(
+            "hawa-absolute hawa-top-[47px] hawa-text-sm hawa-text-helper-color hawa-transition-all hawa-text-start hawa-rounded hawa-end-0  hawa-z-20 hawa-drop-shadow-md hawa-bg-background hawa-translate-y-1/2",
+            props.helperText ? "hawa-border hawa-p-1" : " hawa-border-none hawa-p-0"
+          )
+        },
+        props.helperText
+      ), showCount && /* @__PURE__ */ React24.createElement(
+        "div",
+        {
+          className: cn(
+            "hawa-absolute hawa-top-[60px] hawa-text-sm hawa-transition-all hawa-text-start hawa-end-0   hawa-translate-y-1/2"
+          )
+        },
+        props.value ? String(props.value).length : 0,
+        "/",
+        props.maxLength
       )))
     );
   }
@@ -4293,14 +4314,17 @@ var Avatar = ({
   ...props
 }) => {
   let sizeStyles = {
-    xs: "hawa-h-4 hawa-w-4",
+    "2xs": "hawa-h-4 hawa-w-4",
+    xs: "hawa-h-6 hawa-w-6",
     sm: "hawa-h-8 hawa-w-8",
-    default: "hawa-h-12 hawa-w-12",
-    lg: "hawa-h-16 hawa-w-16",
-    xl: "hawa-h-20 hawa-w-20",
-    "2xl": "hawa-h-24 hawa-w-24",
-    "3xl": "hawa-h-28 hawa-w-28",
-    "4xl": "hawa-h-32 hawa-w-32"
+    default: "hawa-h-10 hawa-w-10",
+    lg: "hawa-h-12 hawa-w-12",
+    xl: "hawa-h-14 hawa-w-14",
+    "2xl": "hawa-h-16 hawa-w-16",
+    "3xl": "hawa-h-[72px] hawa-w-[72px]",
+    "4xl": "hawa-h-20 hawa-w-20",
+    "5xl": "hawa-h-[88px] hawa-w-[88px]",
+    "6xl": "hawa-h-24 hawa-w-24"
   };
   let radiusStyles = {
     full: "hawa-rounded-full",
@@ -4321,7 +4345,7 @@ var Avatar = ({
       FileUploader,
       {
         className: cn(
-          "hawa-bg-red-400 hawa-absolute hawa-top-0 hawa-left-0 hawa-opacity-0",
+          "hawa-bg-red-400 hawa-absolute hawa-w- hawa-top-0 hawa-left-0 hawa-opacity-0",
           sizeStyles[size],
           radiusStyles[radius],
           (!isUploadable || !!src) && "hawa-hidden"
@@ -4340,6 +4364,30 @@ var Avatar = ({
         src,
         alt
       }
+    ),
+    !src && !isUploadable && /* @__PURE__ */ React30.createElement(
+      "div",
+      {
+        className: cn(
+          sizeStyles[size],
+          "hawa-justify-center hawa-items-center hawa-flex hawa-flex-col"
+        )
+      },
+      /* @__PURE__ */ React30.createElement(
+        "svg",
+        {
+          xmlns: "http://www.w3.org/2000/svg",
+          style: { width: "50%", opacity: 0.35 },
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        },
+        /* @__PURE__ */ React30.createElement("circle", { cx: "12", cy: "8", r: "5" }),
+        /* @__PURE__ */ React30.createElement("path", { d: "M20 21a8 8 0 1 0-16 0" })
+      )
     )
   );
 };
@@ -10346,65 +10394,75 @@ import * as z7 from "zod";
 var FeedbackForm = (props) => {
   var _a, _b;
   const formSchema = z7.object({
-    requestType: z7.string({ required_error: props.texts.requestTypeRequired }).min(1, { message: props.texts.requestTypeRequired }),
-    description: z7.string({ required_error: props.texts.descriptionRequired }).min(10, { message: props.texts.descriptionTooShort })
+    requestType: z7.string({ required_error: props.texts.requestType.required }).min(1, { message: props.texts.requestType.required }),
+    description: z7.string({ required_error: props.texts.description.required }).min(10, { message: props.texts.description.tooShort })
   });
   const { handleSubmit, control, formState } = useForm7({
     resolver: zodResolver7(formSchema)
   });
-  return /* @__PURE__ */ React86.createElement(Card, null, /* @__PURE__ */ React86.createElement(CardContent, { headless: true }, /* @__PURE__ */ React86.createElement(
-    "form",
+  return /* @__PURE__ */ React86.createElement(
+    Card,
     {
-      noValidate: true,
-      onSubmit: handleSubmit((e) => {
-        if (props.onSubmit) {
-          return props.onSubmit(e);
-        } else {
-          console.log("Form is submitted but onSubmit prop is missing");
-        }
-      }),
-      className: "hawa-flex hawa-flex-col hawa-gap-4"
+      className: cn(
+        props.cardless ? "hawa-bg-transparent hawa-border-none hawa-shadow-none" : ""
+      )
     },
-    /* @__PURE__ */ React86.createElement(Label2, null, (_a = props.texts) == null ? void 0 : _a.requestType),
-    /* @__PURE__ */ React86.createElement(
-      Controller7,
+    /* @__PURE__ */ React86.createElement(CardContent, { headless: true }, /* @__PURE__ */ React86.createElement(
+      "form",
       {
-        name: "requestType",
-        control,
-        render: ({ field }) => {
-          var _a2, _b2;
-          return /* @__PURE__ */ React86.createElement(
-            Select,
-            {
-              ...field,
-              onChange: (option) => field.onChange(option.value),
-              options: props.requestTypes,
-              helperText: (_b2 = (_a2 = formState.errors.requestType) == null ? void 0 : _a2.message) == null ? void 0 : _b2.toString()
-            }
-          );
+        noValidate: true,
+        onSubmit: handleSubmit((e) => {
+          if (props.onSubmit) {
+            return props.onSubmit(e);
+          } else {
+            console.log("Form is submitted but onSubmit prop is missing");
+          }
+        }),
+        className: "hawa-flex hawa-flex-col hawa-gap-4"
+      },
+      /* @__PURE__ */ React86.createElement(Label2, null, (_a = props.texts) == null ? void 0 : _a.requestType.label),
+      /* @__PURE__ */ React86.createElement(
+        Controller7,
+        {
+          name: "requestType",
+          control,
+          render: ({ field }) => {
+            var _a2, _b2, _c;
+            return /* @__PURE__ */ React86.createElement(
+              Select,
+              {
+                ...field,
+                ...props.selectProps,
+                onChange: (option) => field.onChange(option.value),
+                options: props.requestTypes,
+                helperText: (_b2 = (_a2 = formState.errors.requestType) == null ? void 0 : _a2.message) == null ? void 0 : _b2.toString(),
+                placeholder: (_c = props.texts) == null ? void 0 : _c.requestType.placeholder
+              }
+            );
+          }
         }
-      }
-    ),
-    /* @__PURE__ */ React86.createElement(Label2, null, props.texts.description),
-    /* @__PURE__ */ React86.createElement(
-      Controller7,
-      {
-        name: "description",
-        control,
-        render: ({ field }) => {
-          var _a2, _b2;
-          return /* @__PURE__ */ React86.createElement(
-            Textarea,
-            {
-              ...field,
-              helperText: formState.errors.description && ((_b2 = (_a2 = formState.errors.description) == null ? void 0 : _a2.message) == null ? void 0 : _b2.toString())
-            }
-          );
+      ),
+      /* @__PURE__ */ React86.createElement(Label2, null, props.texts.description.label),
+      /* @__PURE__ */ React86.createElement(
+        Controller7,
+        {
+          name: "description",
+          control,
+          render: ({ field }) => {
+            var _a2, _b2;
+            return /* @__PURE__ */ React86.createElement(
+              Textarea,
+              {
+                ...field,
+                helperText: formState.errors.description && ((_b2 = (_a2 = formState.errors.description) == null ? void 0 : _a2.message) == null ? void 0 : _b2.toString())
+              }
+            );
+          }
         }
-      }
-    ),
-    /* @__PURE__ */ React86.createElement(Button, { type: "submit" }, (_b = props.texts) == null ? void 0 : _b.submit)
-  )));
+      ),
+      /* @__PURE__ */ React86.createElement(Button, { type: "submit" }, (_b = props.texts) == null ? void 0 : _b.submit)
+    ))
+  );
 };
 
 // components/blocks/misc/LegalTexts.tsx

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sikka/hawa",
-  "version": "0.18.14-next",
+  "version": "0.18.18-next",
   "description": "Modern UI Kit made with Tailwind",
   "author": {
     "name": "Sikka Software",