@sikka/hawa 0.28.1-next → 0.29.0-next

package/dist/elements/index.d.mts

@@ -832,4 +832,13 @@ declare const InterfaceSettings: FC<TypographyTypes>;
 
 declare const FileUploader: ({ handleFile, className }: any) => React__default.JSX.Element;
 
-export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, Alert, AppStores, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, Checkbox, ChipTypes, CodeBlock, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Count, DataTable, DestroyableCard, Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger, FileDropzone, FileUploader, Input, InterfaceSettings, LabelProps, Loading, Logos, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuRoot, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PasswordInput, PasswordStrengthIndicator, PhoneInput, PinInput, Popover, PopoverContent, PopoverTrigger, Progress, ProgressCircle, ScrollArea, ScrollBar, ScrollIndicator, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SimpleTable, Skeleton, Slider, SortButton, StandardNavigationMenuItem, StopPropagationWrapper, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, type TextFieldTypes, Textarea, type TextareaProps, Toaster, ToasterToastProps, Tooltip, buttonVariants, navigationMenuTriggerStyle };
+type PhoneMockupProps = {
+    children?: any;
+    upperOverlayGradiant?: boolean;
+    lowerOverlayGradiant?: boolean;
+    phone?: "iphone" | "android" | "default";
+    hideButtons?: boolean;
+};
+declare const PhoneMockup: React__default.FC<PhoneMockupProps>;
+
+export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, Alert, AppStores, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, Checkbox, ChipTypes, CodeBlock, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Count, DataTable, DestroyableCard, Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger, FileDropzone, FileUploader, Input, InterfaceSettings, LabelProps, Loading, Logos, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuRoot, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PasswordInput, PasswordStrengthIndicator, PhoneInput, PhoneMockup, PinInput, Popover, PopoverContent, PopoverTrigger, Progress, ProgressCircle, ScrollArea, ScrollBar, ScrollIndicator, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SimpleTable, Skeleton, Slider, SortButton, StandardNavigationMenuItem, StopPropagationWrapper, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, type TextFieldTypes, Textarea, type TextareaProps, Toaster, ToasterToastProps, Tooltip, buttonVariants, navigationMenuTriggerStyle };

package/dist/elements/index.d.ts

@@ -832,4 +832,13 @@ declare const InterfaceSettings: FC<TypographyTypes>;
 
 declare const FileUploader: ({ handleFile, className }: any) => React__default.JSX.Element;
 
-export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, Alert, AppStores, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, Checkbox, ChipTypes, CodeBlock, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Count, DataTable, DestroyableCard, Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger, FileDropzone, FileUploader, Input, InterfaceSettings, LabelProps, Loading, Logos, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuRoot, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PasswordInput, PasswordStrengthIndicator, PhoneInput, PinInput, Popover, PopoverContent, PopoverTrigger, Progress, ProgressCircle, ScrollArea, ScrollBar, ScrollIndicator, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SimpleTable, Skeleton, Slider, SortButton, StandardNavigationMenuItem, StopPropagationWrapper, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, type TextFieldTypes, Textarea, type TextareaProps, Toaster, ToasterToastProps, Tooltip, buttonVariants, navigationMenuTriggerStyle };
+type PhoneMockupProps = {
+    children?: any;
+    upperOverlayGradiant?: boolean;
+    lowerOverlayGradiant?: boolean;
+    phone?: "iphone" | "android" | "default";
+    hideButtons?: boolean;
+};
+declare const PhoneMockup: React__default.FC<PhoneMockupProps>;
+
+export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, Alert, AppStores, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, Checkbox, ChipTypes, CodeBlock, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Count, DataTable, DestroyableCard, Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger, FileDropzone, FileUploader, Input, InterfaceSettings, LabelProps, Loading, Logos, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuRoot, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PasswordInput, PasswordStrengthIndicator, PhoneInput, PhoneMockup, PinInput, Popover, PopoverContent, PopoverTrigger, Progress, ProgressCircle, ScrollArea, ScrollBar, ScrollIndicator, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SimpleTable, Skeleton, Slider, SortButton, StandardNavigationMenuItem, StopPropagationWrapper, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, type TextFieldTypes, Textarea, type TextareaProps, Toaster, ToasterToastProps, Tooltip, buttonVariants, navigationMenuTriggerStyle };

package/dist/elements/index.js

@@ -118,6 +118,7 @@ __export(elements_exports, {
   PasswordInput: () => PasswordInput,
   PasswordStrengthIndicator: () => PasswordStrengthIndicator,
   PhoneInput: () => PhoneInput,
+  PhoneMockup: () => PhoneMockup,
   PinInput: () => PinInput,
   Popover: () => Popover,
   PopoverContent: () => PopoverContent,
@@ -7878,6 +7879,16 @@ var InterfaceSettings = ({
     }
   ));
 };
+
+// elements/phoneMockup/PhoneMockup.tsx
+var import_react36 = __toESM(require("react"));
+var PhoneMockup = ({
+  children,
+  upperOverlayGradiant,
+  lowerOverlayGradiant,
+  phone,
+  hideButtons
+}) => /* @__PURE__ */ import_react36.default.createElement("div", { className: "hawa-relative hawa-mx-auto hawa-h-[600px] hawa-w-[300px] hawa-rounded-[2.5rem] hawa-border-[14px] hawa-border-gray-800 hawa-bg-gray-800 hawa-dark:border-gray-800" }, !hideButtons && /* @__PURE__ */ import_react36.default.createElement(import_react36.default.Fragment, null, /* @__PURE__ */ import_react36.default.createElement("div", { className: "hawa-absolute hawa--left-[16px] hawa-top-[72px] hawa-h-[32px] hawa-w-[3px] hawa-rounded-l-lg hawa-bg-gray-800 hawa-dark:bg-gray-800" }), /* @__PURE__ */ import_react36.default.createElement("div", { className: "hawa-absolute hawa--left-[16px] hawa-top-[124px] hawa-h-[46px] hawa-w-[3px] hawa-rounded-l-lg hawa-bg-gray-800 hawa-dark:bg-gray-800" }), /* @__PURE__ */ import_react36.default.createElement("div", { className: "hawa-absolute hawa--left-[16px] hawa-top-[178px] hawa-h-[46px] hawa-w-[3px] hawa-rounded-l-lg hawa-bg-gray-800 hawa-dark:bg-gray-800" }), /* @__PURE__ */ import_react36.default.createElement("div", { className: "hawa-absolute hawa--right-[16px] hawa-top-[142px] hawa-h-[64px] hawa-w-[3px] hawa-rounded-r-lg hawa-bg-gray-800 hawa-dark:bg-gray-800" })), /* @__PURE__ */ import_react36.default.createElement("div", { className: "no-scrollbar hawa-left-0 hawa-h-[572px] hawa-w-[272px] hawa-overflow-y-scroll hawa-rounded-[2rem] hawa-bg-white hawa-[clip-path:inset(0px_-1px_0px_0px_round_2rem)] hawa-dark:bg-gray-800" }, children), upperOverlayGradiant && /* @__PURE__ */ import_react36.default.createElement("div", { className: "hawa-pointer-events-none hawa-absolute hawa-left-0 hawa-top-0 hawa-h-[72px] hawa-w-[272px] hawa-rounded-t-[2rem] hawa-bg-gradient-to-t hawa-from-transparent hawa-to-black hawa-opacity-50 hawa-[clip-path:inset(0px_0px_0px_0px_round_0rem)]" }), lowerOverlayGradiant && /* @__PURE__ */ import_react36.default.createElement("div", { className: "hawa-pointer-events-none hawa-absolute hawa-bottom-0 hawa-left-0 hawa-h-[72px] hawa-w-[272px] hawa-rounded-b-[2rem] hawa-bg-gradient-to-t hawa-from-black hawa-to-transparent hawa-opacity-50 hawa-[clip-path:inset(0px_0px_0px_0px_round_0rem)]" }));
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Accordion,
@@ -7967,6 +7978,7 @@ var InterfaceSettings = ({
   PasswordInput,
   PasswordStrengthIndicator,
   PhoneInput,
+  PhoneMockup,
   PinInput,
   Popover,
   PopoverContent,

package/dist/elements/index.mjs

@@ -3293,6 +3293,16 @@ var InterfaceSettings = ({
     }
   ));
 };
+
+// elements/phoneMockup/PhoneMockup.tsx
+import React34 from "react";
+var PhoneMockup = ({
+  children,
+  upperOverlayGradiant,
+  lowerOverlayGradiant,
+  phone,
+  hideButtons
+}) => /* @__PURE__ */ React34.createElement("div", { className: "hawa-relative hawa-mx-auto hawa-h-[600px] hawa-w-[300px] hawa-rounded-[2.5rem] hawa-border-[14px] hawa-border-gray-800 hawa-bg-gray-800 hawa-dark:border-gray-800" }, !hideButtons && /* @__PURE__ */ React34.createElement(React34.Fragment, null, /* @__PURE__ */ React34.createElement("div", { className: "hawa-absolute hawa--left-[16px] hawa-top-[72px] hawa-h-[32px] hawa-w-[3px] hawa-rounded-l-lg hawa-bg-gray-800 hawa-dark:bg-gray-800" }), /* @__PURE__ */ React34.createElement("div", { className: "hawa-absolute hawa--left-[16px] hawa-top-[124px] hawa-h-[46px] hawa-w-[3px] hawa-rounded-l-lg hawa-bg-gray-800 hawa-dark:bg-gray-800" }), /* @__PURE__ */ React34.createElement("div", { className: "hawa-absolute hawa--left-[16px] hawa-top-[178px] hawa-h-[46px] hawa-w-[3px] hawa-rounded-l-lg hawa-bg-gray-800 hawa-dark:bg-gray-800" }), /* @__PURE__ */ React34.createElement("div", { className: "hawa-absolute hawa--right-[16px] hawa-top-[142px] hawa-h-[64px] hawa-w-[3px] hawa-rounded-r-lg hawa-bg-gray-800 hawa-dark:bg-gray-800" })), /* @__PURE__ */ React34.createElement("div", { className: "no-scrollbar hawa-left-0 hawa-h-[572px] hawa-w-[272px] hawa-overflow-y-scroll hawa-rounded-[2rem] hawa-bg-white hawa-[clip-path:inset(0px_-1px_0px_0px_round_2rem)] hawa-dark:bg-gray-800" }, children), upperOverlayGradiant && /* @__PURE__ */ React34.createElement("div", { className: "hawa-pointer-events-none hawa-absolute hawa-left-0 hawa-top-0 hawa-h-[72px] hawa-w-[272px] hawa-rounded-t-[2rem] hawa-bg-gradient-to-t hawa-from-transparent hawa-to-black hawa-opacity-50 hawa-[clip-path:inset(0px_0px_0px_0px_round_0rem)]" }), lowerOverlayGradiant && /* @__PURE__ */ React34.createElement("div", { className: "hawa-pointer-events-none hawa-absolute hawa-bottom-0 hawa-left-0 hawa-h-[72px] hawa-w-[272px] hawa-rounded-b-[2rem] hawa-bg-gradient-to-t hawa-from-black hawa-to-transparent hawa-opacity-50 hawa-[clip-path:inset(0px_0px_0px_0px_round_0rem)]" }));
 export {
   Accordion,
   AccordionContent,
@@ -3381,6 +3391,7 @@ export {
   PasswordInput,
   PasswordStrengthIndicator,
   PhoneInput,
+  PhoneMockup,
   PinInput,
   Popover,
   PopoverContent,

package/dist/index.css

@@ -994,6 +994,12 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa--left-1 {
   left: -0.25rem;
 }
+.hawa--left-\[16px\] {
+  left: -16px;
+}
+.hawa--right-\[16px\] {
+  right: -16px;
+}
 .hawa-bottom-0 {
   bottom: 0px;
 }
@@ -1078,6 +1084,15 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-top-4 {
   top: 1rem;
 }
+.hawa-top-\[124px\] {
+  top: 124px;
+}
+.hawa-top-\[142px\] {
+  top: 142px;
+}
+.hawa-top-\[178px\] {
+  top: 178px;
+}
 .hawa-top-\[1px\] {
   top: 1px;
 }
@@ -1172,6 +1187,10 @@ input[type="number"]::-webkit-inner-spin-button,
   margin-left: 0.625rem;
   margin-right: 0.625rem;
 }
+.hawa-mx-auto {
+  margin-left: auto;
+  margin-right: auto;
+}
 .hawa-my-0 {
   margin-top: 0px;
   margin-bottom: 0px;
@@ -1406,6 +1425,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-h-\[30px\] {
   height: 30px;
 }
+.hawa-h-\[32px\] {
+  height: 32px;
+}
 .hawa-h-\[38px\] {
   height: 38px;
 }
@@ -1415,9 +1437,21 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-h-\[44px\] {
   height: 44px;
 }
+.hawa-h-\[46px\] {
+  height: 46px;
+}
 .hawa-h-\[48px\] {
   height: 48px;
 }
+.hawa-h-\[572px\] {
+  height: 572px;
+}
+.hawa-h-\[600px\] {
+  height: 600px;
+}
+.hawa-h-\[64px\] {
+  height: 64px;
+}
 .hawa-h-\[72px\] {
   height: 72px;
 }
@@ -1574,9 +1608,18 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-w-\[26px\] {
   width: 26px;
 }
+.hawa-w-\[272px\] {
+  width: 272px;
+}
+.hawa-w-\[300px\] {
+  width: 300px;
+}
 .hawa-w-\[37px\] {
   width: 37px;
 }
+.hawa-w-\[3px\] {
+  width: 3px;
+}
 .hawa-w-\[42px\] {
   width: 42px;
 }
@@ -1963,6 +2006,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-overflow-x-clip {
   overflow-x: clip;
 }
+.hawa-overflow-y-scroll {
+  overflow-y: scroll;
+}
 .hawa-truncate {
   overflow: hidden;
   text-overflow: ellipsis;
@@ -1980,6 +2026,12 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-rounded-3xl {
   border-radius: 1.5rem;
 }
+.hawa-rounded-\[2\.5rem\] {
+  border-radius: 2.5rem;
+}
+.hawa-rounded-\[2rem\] {
+  border-radius: 2rem;
+}
 .hawa-rounded-\[inherit\] {
   border-radius: inherit;
 }
@@ -2008,6 +2060,10 @@ input[type="number"]::-webkit-inner-spin-button,
   border-bottom-right-radius: var(--radius);
   border-bottom-left-radius: var(--radius);
 }
+.hawa-rounded-b-\[2rem\] {
+  border-bottom-right-radius: 2rem;
+  border-bottom-left-radius: 2rem;
+}
 .hawa-rounded-b-lg {
   border-bottom-right-radius: var(--radius);
   border-bottom-left-radius: var(--radius);
@@ -2024,10 +2080,18 @@ input[type="number"]::-webkit-inner-spin-button,
   border-top-left-radius: var(--radius);
   border-bottom-left-radius: var(--radius);
 }
+.hawa-rounded-l-lg {
+  border-top-left-radius: var(--radius);
+  border-bottom-left-radius: var(--radius);
+}
 .hawa-rounded-l-none {
   border-top-left-radius: 0px;
   border-bottom-left-radius: 0px;
 }
+.hawa-rounded-r-lg {
+  border-top-right-radius: var(--radius);
+  border-bottom-right-radius: var(--radius);
+}
 .hawa-rounded-r-none {
   border-top-right-radius: 0px;
   border-bottom-right-radius: 0px;
@@ -2036,6 +2100,10 @@ input[type="number"]::-webkit-inner-spin-button,
   border-top-left-radius: var(--radius);
   border-top-right-radius: var(--radius);
 }
+.hawa-rounded-t-\[2rem\] {
+  border-top-left-radius: 2rem;
+  border-top-right-radius: 2rem;
+}
 .hawa-rounded-t-lg {
   border-top-left-radius: var(--radius);
   border-top-right-radius: var(--radius);
@@ -2068,6 +2136,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-border-2 {
   border-width: 2px;
 }
+.hawa-border-\[14px\] {
+  border-width: 14px;
+}
 .hawa-border-x-0 {
   border-left-width: 0px;
   border-right-width: 0px;
@@ -2130,6 +2201,10 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-border-opacity: 1;
   border-color: rgb(229 231 235 / var(--tw-border-opacity));
 }
+.hawa-border-gray-800 {
+  --tw-border-opacity: 1;
+  border-color: rgb(31 41 55 / var(--tw-border-opacity));
+}
 .hawa-border-input {
   border-color: hsl(var(--input));
 }
@@ -2364,12 +2439,20 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-bg-gradient-to-bl {
   background-image: linear-gradient(to bottom left, var(--tw-gradient-stops));
 }
+.hawa-bg-gradient-to-t {
+  background-image: linear-gradient(to top, var(--tw-gradient-stops));
+}
 .hawa-bg-gradient-to-tl {
   background-image: linear-gradient(to top left, var(--tw-gradient-stops));
 }
 .hawa-bg-none {
   background-image: none;
 }
+.hawa-from-black {
+  --tw-gradient-from: #000 var(--tw-gradient-from-position);
+  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
 .hawa-from-green-300 {
   --tw-gradient-from: #86efac var(--tw-gradient-from-position);
   --tw-gradient-to: rgb(134 239 172 / 0) var(--tw-gradient-to-position);
@@ -2390,6 +2473,11 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-gradient-to: rgb(190 24 93 / 0) var(--tw-gradient-to-position);
   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
 }
+.hawa-from-transparent {
+  --tw-gradient-from: transparent var(--tw-gradient-from-position);
+  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
 .hawa-via-blue-500 {
   --tw-gradient-to: rgb(59 130 246 / 0)  var(--tw-gradient-to-position);
   --tw-gradient-stops: var(--tw-gradient-from), #3b82f6 var(--tw-gradient-via-position), var(--tw-gradient-to);
@@ -2402,12 +2490,18 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-gradient-to: rgb(239 68 68 / 0)  var(--tw-gradient-to-position);
   --tw-gradient-stops: var(--tw-gradient-from), #ef4444 var(--tw-gradient-via-position), var(--tw-gradient-to);
 }
+.hawa-to-black {
+  --tw-gradient-to: #000 var(--tw-gradient-to-position);
+}
 .hawa-to-purple-500 {
   --tw-gradient-to: #a855f7 var(--tw-gradient-to-position);
 }
 .hawa-to-purple-600 {
   --tw-gradient-to: #9333ea var(--tw-gradient-to-position);
 }
+.hawa-to-transparent {
+  --tw-gradient-to: transparent var(--tw-gradient-to-position);
+}
 .hawa-to-yellow-500 {
   --tw-gradient-to: #eab308 var(--tw-gradient-to-position);
 }
@@ -3065,6 +3159,13 @@ input[type="number"]::-webkit-inner-spin-button,
     --tw-shadow: 0.25rem 0.25rem hsl(var(--primary));
     box-shadow: var(--tw-shadow);
   }
+.no-scrollbar::-webkit-scrollbar {
+    display: none;
+  }
+.no-scrollbar {
+    -ms-overflow-style: none;
+    scrollbar-width: none;
+  }
 body {
   font-family: "IBM Plex Sans Arabic", sans-serif;
 }

package/dist/index.d.mts

@@ -1055,6 +1055,15 @@ declare const InterfaceSettings: FC<TypographyTypes>;
 
 declare const FileUploader: ({ handleFile, className }: any) => React__default.JSX.Element;
 
+type PhoneMockupProps = {
+    children?: any;
+    upperOverlayGradiant?: boolean;
+    lowerOverlayGradiant?: boolean;
+    phone?: "iphone" | "android" | "default";
+    hideButtons?: boolean;
+};
+declare const PhoneMockup: React__default.FC<PhoneMockupProps>;
+
 interface StatTypes extends React__default.HTMLAttributes<HTMLDivElement> {
     label?: string;
     color?: string;
@@ -2035,4 +2044,4 @@ declare function useTabs(initialTab?: string): {
     handleTabChange: (index: any) => void;
 };
 
-export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppLanding, AppLayout, type AppSidebarItemProps, AppStores, AppTabs, AppTopbar, AuthButtons, 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, ContactForm, Copyrights, Count, DataTable, DestroyableCard, Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger, DocsLayout, DocsSidebar, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadio, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, 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, Navbar, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem$1 as NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuRoot, NavigationMenuTrigger, NavigationMenuViewport, 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, StandardNavigationMenuItem, Stats, StopPropagationWrapper, type SubItem$1 as SubItem, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Testimonial, type TextFieldTypes, Textarea, type TextareaProps, Toast$1 as Toast, ToastAction, type ToastActionElement, ToastClose, ToastDescription, type ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, type ToasterToastProps, Tooltip, Usage, type UseFocusWithinOptions, type UseMediaQueryOptions, UserReferralSource, buttonVariants, navigationMenuTriggerStyle, reducer, toast, useBreakpoint, useClipboard, useDialogCarousel, useFocusWithin, useIsomorphicEffect, useMediaQuery, useMultiStepDialog, useTabs, useToast, useWindowSize };
+export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppLanding, AppLayout, type AppSidebarItemProps, AppStores, AppTabs, AppTopbar, AuthButtons, 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, ContactForm, Copyrights, Count, DataTable, DestroyableCard, Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger, DocsLayout, DocsSidebar, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadio, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, 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, Navbar, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem$1 as NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuRoot, NavigationMenuTrigger, NavigationMenuViewport, NewPasswordForm, NoPermission, NotFound, Pagination, PasswordInput, PasswordStrengthIndicator, PhoneInput, PhoneMockup, 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, StandardNavigationMenuItem, Stats, StopPropagationWrapper, type SubItem$1 as SubItem, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Testimonial, type TextFieldTypes, Textarea, type TextareaProps, Toast$1 as Toast, ToastAction, type ToastActionElement, ToastClose, ToastDescription, type ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, type ToasterToastProps, Tooltip, Usage, type UseFocusWithinOptions, type UseMediaQueryOptions, UserReferralSource, buttonVariants, navigationMenuTriggerStyle, reducer, toast, useBreakpoint, useClipboard, useDialogCarousel, useFocusWithin, useIsomorphicEffect, useMediaQuery, useMultiStepDialog, useTabs, useToast, useWindowSize };

package/dist/index.d.ts

@@ -1055,6 +1055,15 @@ declare const InterfaceSettings: FC<TypographyTypes>;
 
 declare const FileUploader: ({ handleFile, className }: any) => React__default.JSX.Element;
 
+type PhoneMockupProps = {
+    children?: any;
+    upperOverlayGradiant?: boolean;
+    lowerOverlayGradiant?: boolean;
+    phone?: "iphone" | "android" | "default";
+    hideButtons?: boolean;
+};
+declare const PhoneMockup: React__default.FC<PhoneMockupProps>;
+
 interface StatTypes extends React__default.HTMLAttributes<HTMLDivElement> {
     label?: string;
     color?: string;
@@ -2035,4 +2044,4 @@ declare function useTabs(initialTab?: string): {
     handleTabChange: (index: any) => void;
 };
 
-export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppLanding, AppLayout, type AppSidebarItemProps, AppStores, AppTabs, AppTopbar, AuthButtons, 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, ContactForm, Copyrights, Count, DataTable, DestroyableCard, Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger, DocsLayout, DocsSidebar, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadio, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, 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, Navbar, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem$1 as NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuRoot, NavigationMenuTrigger, NavigationMenuViewport, 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, StandardNavigationMenuItem, Stats, StopPropagationWrapper, type SubItem$1 as SubItem, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Testimonial, type TextFieldTypes, Textarea, type TextareaProps, Toast$1 as Toast, ToastAction, type ToastActionElement, ToastClose, ToastDescription, type ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, type ToasterToastProps, Tooltip, Usage, type UseFocusWithinOptions, type UseMediaQueryOptions, UserReferralSource, buttonVariants, navigationMenuTriggerStyle, reducer, toast, useBreakpoint, useClipboard, useDialogCarousel, useFocusWithin, useIsomorphicEffect, useMediaQuery, useMultiStepDialog, useTabs, useToast, useWindowSize };
+export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppLanding, AppLayout, type AppSidebarItemProps, AppStores, AppTabs, AppTopbar, AuthButtons, 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, ContactForm, Copyrights, Count, DataTable, DestroyableCard, Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger, DocsLayout, DocsSidebar, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadio, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, 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, Navbar, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem$1 as NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuRoot, NavigationMenuTrigger, NavigationMenuViewport, NewPasswordForm, NoPermission, NotFound, Pagination, PasswordInput, PasswordStrengthIndicator, PhoneInput, PhoneMockup, 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, StandardNavigationMenuItem, Stats, StopPropagationWrapper, type SubItem$1 as SubItem, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Testimonial, type TextFieldTypes, Textarea, type TextareaProps, Toast$1 as Toast, ToastAction, type ToastActionElement, ToastClose, ToastDescription, type ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, type ToasterToastProps, Tooltip, Usage, type UseFocusWithinOptions, type UseMediaQueryOptions, UserReferralSource, buttonVariants, navigationMenuTriggerStyle, reducer, toast, useBreakpoint, useClipboard, useDialogCarousel, useFocusWithin, useIsomorphicEffect, useMediaQuery, useMultiStepDialog, useTabs, useToast, useWindowSize };