@sikka/hawa 0.46.4-next → 0.48.0-next

package/dist/elements/index.js

@@ -5263,6 +5263,7 @@ var import_clsx3 = __toESM(require("clsx"));
 var Select = ({
   labelProps,
   labelKey = "label",
+  valueKey = "value",
   ...props
 }) => {
   const NoOption = () => {
@@ -5282,13 +5283,7 @@ var Select = ({
       children
     );
   };
-  const Option = ({
-    children,
-    innerProps,
-    innerRef,
-    isFocused,
-    isSelected
-  }) => {
+  const Option = ({ children, innerProps, innerRef, isFocused, isSelected }) => {
     return /* @__PURE__ */ import_react35.default.createElement(
       "div",
       {
@@ -5303,14 +5298,7 @@ var Select = ({
       children
     );
   };
-  const Menu = ({
-    cx,
-    children,
-    getStyles,
-    innerProps,
-    innerRef,
-    ...menuProps
-  }) => {
+  const Menu = ({ cx, children, getStyles, innerProps, innerRef, ...menuProps }) => {
     const menuOpen = menuProps.selectProps.menuIsOpen;
     return /* @__PURE__ */ import_react35.default.createElement(
       "div",
@@ -5339,71 +5327,72 @@ var Select = ({
       )
     },
     props.label && /* @__PURE__ */ import_react35.default.createElement(Label2, { ...labelProps }, props.label),
-    props.isLoading ? /* @__PURE__ */ import_react35.default.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" }) : !props.isCreatable ? (
-      //   TODO: enable keyboard to go to the next item in the list
-      /* @__PURE__ */ import_react35.default.createElement(
-        import_react_select.default,
-        {
-          noOptionsMessage: NoOption,
-          classNames: {
-            control: () => cn(
-              props.phoneCode && "hawa-rounded-r-none",
-              props.controlClassNames
-            ),
-            container: () => cn(
-              selectContainerStyles,
-              props.phoneCode && phoneCodeStyles,
-              props.isMulti && "hawa-ps-0 "
-            ),
-            placeholder: () => cn(
-              selectPlaceholderStyles,
-              props.disabled && "hawa-text-muted-foreground"
-            ),
-            valueContainer: () => "hawa-text-foreground hawa-px-1 ",
-            singleValue: () => cn(
-              props.disabled ? "hawa-text-muted-foreground hawa-opacity-30" : "hawa-text-foreground"
-            ),
-            indicatorsContainer: () => cn(
-              selectIndicatorContainerStyles,
-              props.hideIndicator ? "hawa-invisible" : "hawa-px-1",
-              props.disabled && "hawa-opacity-30"
-            )
-          },
-          unstyled: true,
-          autoFocus: false,
-          components: props.hideIndicator ? { Option, Menu, IndicatorsContainer: () => null } : {
+    props.isLoading ? /* @__PURE__ */ import_react35.default.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" }) : !props.isCreatable ? /* @__PURE__ */ import_react35.default.createElement(
+      import_react_select.default,
+      {
+        noOptionsMessage: NoOption,
+        classNames: {
+          control: () => cn(props.phoneCode && "hawa-rounded-r-none", props.controlClassNames),
+          container: () => cn(
+            selectContainerStyles,
+            props.phoneCode && phoneCodeStyles,
+            props.isMulti && "hawa-ps-0 "
+          ),
+          placeholder: () => cn(selectPlaceholderStyles, props.disabled && "hawa-text-muted-foreground"),
+          valueContainer: () => "hawa-text-foreground hawa-px-1",
+          singleValue: () => cn(
+            props.disabled ? "hawa-text-muted-foreground hawa-opacity-30" : "hawa-text-foreground"
+          ),
+          indicatorsContainer: () => cn(
+            selectIndicatorContainerStyles,
+            props.hideIndicator ? "hawa-invisible" : "hawa-px-1",
+            props.disabled && "hawa-opacity-30"
+          )
+        },
+        unstyled: true,
+        autoFocus: false,
+        components: props.hideIndicator ? {
+          Option: (optionProps) => /* @__PURE__ */ import_react35.default.createElement(
             Option,
-            Menu,
-            ValueContainer: (e) => /* @__PURE__ */ import_react35.default.createElement(
-              "div",
-              {
-                className: cn(
-                  e.className,
-                  "hawa-gap-1 hawa-flex hawa-flex-row hawa-flex-wrap hawa-p-1"
-                ),
-                ...e
-              }
-            ),
-            MultiValueContainer: (e) => /* @__PURE__ */ import_react35.default.createElement(
-              "div",
-              {
-                className: "hawa-rounded hawa-border hawa-p-1 hawa-px-2 hawa-flex hawa-flex-row",
-                ...e
-              }
-            )
-          },
-          onChange: (newValue, action) => props.onChange(newValue, action),
-          options: props.options,
-          getOptionLabel: props.getOptionLabel,
-          defaultValue: props.defaultValue,
-          value: props.value,
-          placeholder: props.placeholder,
-          isDisabled: props.disabled,
-          isClearable: props.isClearable,
-          isMulti: props.isMulti,
-          isSearchable: props.isSearchable
-        }
-      )
+            {
+              ...optionProps,
+              isSelected: optionProps.data[valueKey] === props.value[valueKey]
+            }
+          ),
+          Menu,
+          IndicatorsContainer: () => null
+        } : {
+          Option,
+          Menu,
+          ValueContainer: (e) => /* @__PURE__ */ import_react35.default.createElement(
+            "div",
+            {
+              className: cn(
+                e.className,
+                "hawa-gap-1 hawa-flex hawa-flex-row hawa-flex-wrap hawa-p-2 hawa-w-full hawa-cursor-pointer"
+              ),
+              ...e
+            }
+          ),
+          MultiValueContainer: (e) => /* @__PURE__ */ import_react35.default.createElement(
+            "div",
+            {
+              className: "hawa-rounded hawa-border hawa-p-1 hawa-px-2 hawa-flex hawa-flex-row",
+              ...e
+            }
+          )
+        },
+        onChange: (newValue, action) => props.onChange(newValue, action),
+        options: props.options,
+        getOptionLabel: props.getOptionLabel,
+        defaultValue: props.defaultValue,
+        value: props.value,
+        placeholder: props.placeholder,
+        isDisabled: props.disabled,
+        isClearable: props.isClearable,
+        isMulti: props.isMulti,
+        isSearchable: props.isSearchable
+      }
     ) : /* @__PURE__ */ import_react35.default.createElement(
       import_creatable.default,
       {
@@ -7393,11 +7382,13 @@ var PhoneInput = ({
   countryCodes,
   ...props
 }) => {
+  var _a;
   const [phoneNumber, setPhoneNumber] = (0, import_react39.useState)("");
-  const [countryCode, setCountryCode] = (0, import_react39.useState)(props.preferredCountry);
+  const [countryCode, setCountryCode] = (0, import_react39.useState)(
+    props.preferredCountry || { label: "+966" }
+  );
   const inputRef = (0, import_react39.useRef)(null);
   const handleInputChange = (e) => {
-    console.log("test e ", e.target.value);
     const validChars = /^[0-9-()]+$/;
     const input = e.target.value;
     if (input === "" || validChars.test(input)) {
@@ -7419,11 +7410,13 @@ var PhoneInput = ({
       isMulti: false,
       isSearchable: true,
       isClearable: false,
-      placeholder: "Code",
+      placeholder: (_a = props.preferredCountry) == null ? void 0 : _a.label,
       options: countryCodes || countries_default,
-      onChange: setCountryCode,
-      value: countryCode == null ? void 0 : countryCode.label,
-      defaultValue: props.preferredCountry
+      onChange: (e) => setCountryCode({ label: e.label, value: e.label }),
+      valueKey: "label",
+      labelKey: "label",
+      value: { label: countryCode == null ? void 0 : countryCode.label, value: countryCode == null ? void 0 : countryCode.label },
+      defaultValue: { label: countryCode == null ? void 0 : countryCode.label, value: countryCode == null ? void 0 : countryCode.label }
     }
   ), /* @__PURE__ */ import_react39.default.createElement("div", { className: "hawa-relative hawa-flex hawa-h-fit hawa-w-full hawa-flex-col hawa-justify-center hawa-gap-0" }, /* @__PURE__ */ import_react39.default.createElement(
     "input",
@@ -7536,14 +7529,7 @@ var PinInputRoot = React50.forwardRef(({ className, containerClassName, ...props
   }
 ));
 PinInputRoot.displayName = "PinInputRoot";
-var PinInputGroup = React50.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React50.createElement(
-  "div",
-  {
-    ref,
-    className: cn("hawa-flex hawa-items-center", className),
-    ...props
-  }
-));
+var PinInputGroup = React50.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React50.createElement("div", { ref, className: cn("hawa-flex hawa-items-center", className), ...props }));
 PinInputGroup.displayName = "PinInputGroup";
 var PinInputSlot = React50.forwardRef(({ index, className, ...props }, ref) => {
   const pinInputContext = React50.useContext(import_input_otp.OTPInputContext);
@@ -7566,22 +7552,12 @@ var PinInputSlot = React50.forwardRef(({ index, className, ...props }, ref) => {
 PinInputSlot.displayName = "PinInputSlot";
 var PinInputSeperator = React50.forwardRef(({ ...props }, ref) => /* @__PURE__ */ React50.createElement("div", { ref, role: "separator", ...props }, /* @__PURE__ */ React50.createElement(Dot, null)));
 PinInputSeperator.displayName = "PinInputSeperator";
-var PinInput = ({
-  separatorPosition = 0,
-  ...props
-}) => {
+var PinInput = ({ separatorPosition = 0, ...props }) => {
   const maxLength = props.maxLength || 6;
   const clampedSeparatorPosition = Math.min(separatorPosition, maxLength);
   const firstGroupLength = clampedSeparatorPosition > 0 ? clampedSeparatorPosition : 0;
   const secondGroupLength = maxLength - firstGroupLength;
-  return /* @__PURE__ */ React50.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, /* @__PURE__ */ React50.createElement(PinInputRoot, { ...props }, firstGroupLength > 0 && /* @__PURE__ */ React50.createElement(PinInputGroup, { className: "hawa-w-full hawa-gap-2" }, [...Array(firstGroupLength)].map((_, index) => /* @__PURE__ */ React50.createElement(
-    PinInputSlot,
-    {
-      key: index,
-      index,
-      className: "hawa-w-full hawa-border"
-    }
-  ))), separatorPosition > 0 && separatorPosition < props.maxLength && /* @__PURE__ */ React50.createElement(PinInputSeperator, null), secondGroupLength > 0 && /* @__PURE__ */ React50.createElement(PinInputGroup, { className: "hawa-w-full hawa-gap-2" }, [...Array(secondGroupLength)].map((_, index) => /* @__PURE__ */ React50.createElement(
+  return /* @__PURE__ */ React50.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2", dir: "ltr" }, /* @__PURE__ */ React50.createElement(PinInputRoot, { ...props }, firstGroupLength > 0 && /* @__PURE__ */ React50.createElement(PinInputGroup, { className: "hawa-w-full hawa-gap-2" }, [...Array(firstGroupLength)].map((_, index) => /* @__PURE__ */ React50.createElement(PinInputSlot, { key: index, index, className: "hawa-w-full hawa-border" }))), separatorPosition > 0 && separatorPosition < props.maxLength && /* @__PURE__ */ React50.createElement(PinInputSeperator, null), secondGroupLength > 0 && /* @__PURE__ */ React50.createElement(PinInputGroup, { className: "hawa-w-full hawa-gap-2" }, [...Array(secondGroupLength)].map((_, index) => /* @__PURE__ */ React50.createElement(
     PinInputSlot,
     {
       key: index + firstGroupLength,

package/dist/elements/index.mjs

@@ -26,7 +26,7 @@ import {
   TabsList,
   TabsTrigger,
   Textarea
-} from "../chunk-5CTMGPEF.mjs";
+} from "../chunk-GBLWUEYN.mjs";
 import {
   useClipboard
 } from "../chunk-WL7C2A5D.mjs";

package/dist/index.css

@@ -1224,6 +1224,10 @@ input[type="number"]::-webkit-inner-spin-button,
   margin-top: 0.5rem;
   margin-bottom: 0.5rem;
 }
+.hawa-my-4 {
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+}
 .-hawa-mt-4 {
   margin-top: -1rem;
 }
@@ -1329,6 +1333,9 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-mt-4 {
   margin-top: 1rem;
 }
+.hawa-mt-6 {
+  margin-top: 1.5rem;
+}
 .hawa-mt-8 {
   margin-top: 2rem;
 }

package/dist/index.d.mts

@@ -884,6 +884,7 @@ type SelectTypes = {
     hideHelperText?: boolean;
     options: SelectOptionProps[];
     labelKey?: string;
+    valueKey?: string;
     isCreatable?: boolean;
     isClearable?: boolean;
     isMulti?: boolean;
@@ -968,19 +969,19 @@ type BadgeTypes = {
 declare const Badge: FC<BadgeTypes>;
 declare const BadgedComponent: ({ children, className, hideBadge, position, size, text, }: any) => React__default.JSX.Element;
 
+type PhoneCodeValue = {
+    label: string;
+    value?: string;
+};
 type PhoneInputProps = {
-    preferredCountry?: {
-        label: string;
-    };
+    preferredCountry?: PhoneCodeValue;
     helperText?: any;
     label?: string;
     labelProps?: LabelProps;
     placeholder?: string;
     handleChange?: (value: string) => void;
     inputProps?: React__default.InputHTMLAttributes<HTMLInputElement>;
-    countryCodes?: {
-        label: string;
-    }[];
+    countryCodes?: PhoneCodeValue[];
 };
 declare const PhoneInput: FC<PhoneInputProps>;
 
@@ -1569,6 +1570,7 @@ type RegisterFormTextsTypes = ThirdPartyAuthTextsTypes & {
     fullName?: BaseInputType;
     email?: TextInputType;
     username?: UsernameInputType;
+    phone?: TextInputType;
     password?: PasswordInputType;
     confirm?: ConfirmInputType;
     userReference?: BaseInputType;
@@ -1722,11 +1724,17 @@ type RegisterFormTypes = {
     direction?: DirectionType;
     /** Determines whether to display logos only or with text in the social media registration section. */
     logosOnly?: boolean;
-    /** Enables registration via Google when set to true. */
+    /** Enables registration via Google when set to true.
+     * @default false
+     */
     viaGoogle?: boolean;
-    /** Enables registration via Github when set to true. */
+    /** Enables registration via Github when set to true.
+     * @default false
+     */
     viaGithub?: boolean;
-    /** Enables registration via Twitter when set to true. */
+    /** Enables registration via Twitter when set to true.
+     * @default false
+     */
     viaTwitter?: boolean;
     /** Determines whether to show the referral code field. */
     showRefCode?: boolean;
@@ -1748,16 +1756,14 @@ type RegisterFormTypes = {
     onTwitterRegister?: () => void;
     /** Callback function triggered to route to the Terms of Service page. */
     onRouteToTOS?: () => void;
-    /** Determines whether to show an error alert. */
-    showError?: boolean;
     /** Callback function triggered when the error alert is dismissed. */
     onErrorDismissed?: () => void;
+    /** Determines whether to show an error alert. */
+    showError?: boolean;
     /** Title for the error alert. */
     errorTitle?: any;
     /** Text for the error alert. */
     errorText?: any;
-    /** Array containing the fields to be included in the form. */
-    registerFields?: string[];
     /** Indicates whether the form submission is in progress. */
     isLoading?: boolean;
     /** If true, a loading spinner is displayed within the Google login button.   */
@@ -1783,8 +1789,21 @@ type RegisterFormTypes = {
     };
     /** The minimum length of the password input field */
     minPasswordLength?: number;
-    /** If true, the form is displayed without a card container styling.*/
+    /** If true, the form is displayed without a card container styling.
+     * @default false
+     */
     cardless?: boolean;
+    /** Array containing the fields to be included in the form. */
+    registerFields?: ("fullname" | "email" | "username" | "phone")[];
+    /** To show the register form in a different type, either "email" or "phone"
+     * @default "email"
+     */
+    registerTypes?: {
+        label: string;
+        value: string;
+    }[];
+    /** Props to pass to the PhoneInput component */
+    phoneInputProps?: PhoneInputProps;
 };
 declare const RegisterForm: FC<RegisterFormTypes>;
 
@@ -1862,7 +1881,7 @@ declare const ResetPasswordForm: FC<ResetPasswordType>;
 
 type TConfirmation = {
     texts?: {
-        checkYourPhone?: string;
+        checkYourIdentifier?: string;
         weSentCode?: string;
         didntGetCode?: string;
         resendCode?: string;
@@ -1876,7 +1895,7 @@ type TConfirmation = {
     showError?: any;
     errorTitle?: any;
     errorText?: any;
-    phoneNumber?: string;
+    identifier?: string;
     confirmLoading?: boolean;
     onConfirm?: any;
     onResend?: any;
@@ -2324,4 +2343,4 @@ declare function useViewportSize(): {
     height: number;
 };
 
-export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppCommand, AppLanding, AppLayout, type AppSidebarItemProps, AppStores, AppTabs, AppTopbar, AuthButtons, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, type BreadcrumbItemProps, 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, type CommandInputProps, CommandItem, CommandList, CommandSeparator, CommandShortcut, ComparingPlans, ContactForm, type ContentRect, 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, DropdownMenuRadio, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FeedbackEmoji, FeedbackForm, FeedbackRating, FileDropzone, FileUploader, FullCommand, type FullCommandItem, HorizontalPricing, type Hotkey, type HotkeyItem, type HotkeyItemOptions, Input, type InputFieldProps, InterfaceSettings, ItemCard, type KeyboardModifiers, 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, type PhoneInputProps, PhoneMockup, PinInput, PinInputGroup, PinInputRoot, PinInputSeperator, PinInputSlot, Popover, PopoverContent, PopoverPortal, PopoverRoot, 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, 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, getHotkeyHandler, getHotkeyMatcher, navigationMenuTriggerStyle, parseHotkey, reducer, toast, useBreakpoint, useClickOutside, useClipboard, useDialogCarousel, useFocusWithin, useIsomorphicEffect, useMeasureDirty, useMediaQuery, useMultiStepDialog, useShortcuts, useTabs, useToast, useViewportSize, useWindowEvent, useWindowSize };
+export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppCommand, AppLanding, AppLayout, type AppSidebarItemProps, AppStores, AppTabs, AppTopbar, AuthButtons, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, type BreadcrumbItemProps, 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, type CommandInputProps, CommandItem, CommandList, CommandSeparator, CommandShortcut, ComparingPlans, ContactForm, type ContentRect, 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, DropdownMenuRadio, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FeedbackEmoji, FeedbackForm, FeedbackRating, FileDropzone, FileUploader, FullCommand, type FullCommandItem, HorizontalPricing, type Hotkey, type HotkeyItem, type HotkeyItemOptions, Input, type InputFieldProps, InterfaceSettings, ItemCard, type KeyboardModifiers, 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, type PhoneCodeValue, PhoneInput, type PhoneInputProps, PhoneMockup, PinInput, PinInputGroup, PinInputRoot, PinInputSeperator, PinInputSlot, Popover, PopoverContent, PopoverPortal, PopoverRoot, 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, 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, getHotkeyHandler, getHotkeyMatcher, navigationMenuTriggerStyle, parseHotkey, reducer, toast, useBreakpoint, useClickOutside, useClipboard, useDialogCarousel, useFocusWithin, useIsomorphicEffect, useMeasureDirty, useMediaQuery, useMultiStepDialog, useShortcuts, useTabs, useToast, useViewportSize, useWindowEvent, useWindowSize };

package/dist/index.d.ts

@@ -884,6 +884,7 @@ type SelectTypes = {
     hideHelperText?: boolean;
     options: SelectOptionProps[];
     labelKey?: string;
+    valueKey?: string;
     isCreatable?: boolean;
     isClearable?: boolean;
     isMulti?: boolean;
@@ -968,19 +969,19 @@ type BadgeTypes = {
 declare const Badge: FC<BadgeTypes>;
 declare const BadgedComponent: ({ children, className, hideBadge, position, size, text, }: any) => React__default.JSX.Element;
 
+type PhoneCodeValue = {
+    label: string;
+    value?: string;
+};
 type PhoneInputProps = {
-    preferredCountry?: {
-        label: string;
-    };
+    preferredCountry?: PhoneCodeValue;
     helperText?: any;
     label?: string;
     labelProps?: LabelProps;
     placeholder?: string;
     handleChange?: (value: string) => void;
     inputProps?: React__default.InputHTMLAttributes<HTMLInputElement>;
-    countryCodes?: {
-        label: string;
-    }[];
+    countryCodes?: PhoneCodeValue[];
 };
 declare const PhoneInput: FC<PhoneInputProps>;
 
@@ -1569,6 +1570,7 @@ type RegisterFormTextsTypes = ThirdPartyAuthTextsTypes & {
     fullName?: BaseInputType;
     email?: TextInputType;
     username?: UsernameInputType;
+    phone?: TextInputType;
     password?: PasswordInputType;
     confirm?: ConfirmInputType;
     userReference?: BaseInputType;
@@ -1722,11 +1724,17 @@ type RegisterFormTypes = {
     direction?: DirectionType;
     /** Determines whether to display logos only or with text in the social media registration section. */
     logosOnly?: boolean;
-    /** Enables registration via Google when set to true. */
+    /** Enables registration via Google when set to true.
+     * @default false
+     */
     viaGoogle?: boolean;
-    /** Enables registration via Github when set to true. */
+    /** Enables registration via Github when set to true.
+     * @default false
+     */
     viaGithub?: boolean;
-    /** Enables registration via Twitter when set to true. */
+    /** Enables registration via Twitter when set to true.
+     * @default false
+     */
     viaTwitter?: boolean;
     /** Determines whether to show the referral code field. */
     showRefCode?: boolean;
@@ -1748,16 +1756,14 @@ type RegisterFormTypes = {
     onTwitterRegister?: () => void;
     /** Callback function triggered to route to the Terms of Service page. */
     onRouteToTOS?: () => void;
-    /** Determines whether to show an error alert. */
-    showError?: boolean;
     /** Callback function triggered when the error alert is dismissed. */
     onErrorDismissed?: () => void;
+    /** Determines whether to show an error alert. */
+    showError?: boolean;
     /** Title for the error alert. */
     errorTitle?: any;
     /** Text for the error alert. */
     errorText?: any;
-    /** Array containing the fields to be included in the form. */
-    registerFields?: string[];
     /** Indicates whether the form submission is in progress. */
     isLoading?: boolean;
     /** If true, a loading spinner is displayed within the Google login button.   */
@@ -1783,8 +1789,21 @@ type RegisterFormTypes = {
     };
     /** The minimum length of the password input field */
     minPasswordLength?: number;
-    /** If true, the form is displayed without a card container styling.*/
+    /** If true, the form is displayed without a card container styling.
+     * @default false
+     */
     cardless?: boolean;
+    /** Array containing the fields to be included in the form. */
+    registerFields?: ("fullname" | "email" | "username" | "phone")[];
+    /** To show the register form in a different type, either "email" or "phone"
+     * @default "email"
+     */
+    registerTypes?: {
+        label: string;
+        value: string;
+    }[];
+    /** Props to pass to the PhoneInput component */
+    phoneInputProps?: PhoneInputProps;
 };
 declare const RegisterForm: FC<RegisterFormTypes>;
 
@@ -1862,7 +1881,7 @@ declare const ResetPasswordForm: FC<ResetPasswordType>;
 
 type TConfirmation = {
     texts?: {
-        checkYourPhone?: string;
+        checkYourIdentifier?: string;
         weSentCode?: string;
         didntGetCode?: string;
         resendCode?: string;
@@ -1876,7 +1895,7 @@ type TConfirmation = {
     showError?: any;
     errorTitle?: any;
     errorText?: any;
-    phoneNumber?: string;
+    identifier?: string;
     confirmLoading?: boolean;
     onConfirm?: any;
     onResend?: any;
@@ -2324,4 +2343,4 @@ declare function useViewportSize(): {
     height: number;
 };
 
-export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppCommand, AppLanding, AppLayout, type AppSidebarItemProps, AppStores, AppTabs, AppTopbar, AuthButtons, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, type BreadcrumbItemProps, 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, type CommandInputProps, CommandItem, CommandList, CommandSeparator, CommandShortcut, ComparingPlans, ContactForm, type ContentRect, 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, DropdownMenuRadio, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FeedbackEmoji, FeedbackForm, FeedbackRating, FileDropzone, FileUploader, FullCommand, type FullCommandItem, HorizontalPricing, type Hotkey, type HotkeyItem, type HotkeyItemOptions, Input, type InputFieldProps, InterfaceSettings, ItemCard, type KeyboardModifiers, 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, type PhoneInputProps, PhoneMockup, PinInput, PinInputGroup, PinInputRoot, PinInputSeperator, PinInputSlot, Popover, PopoverContent, PopoverPortal, PopoverRoot, 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, 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, getHotkeyHandler, getHotkeyMatcher, navigationMenuTriggerStyle, parseHotkey, reducer, toast, useBreakpoint, useClickOutside, useClipboard, useDialogCarousel, useFocusWithin, useIsomorphicEffect, useMeasureDirty, useMediaQuery, useMultiStepDialog, useShortcuts, useTabs, useToast, useViewportSize, useWindowEvent, useWindowSize };
+export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, ActionCard, AdCard, Alert, Announcement, AppCommand, AppLanding, AppLayout, type AppSidebarItemProps, AppStores, AppTabs, AppTopbar, AuthButtons, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, type BreadcrumbItemProps, 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, type CommandInputProps, CommandItem, CommandList, CommandSeparator, CommandShortcut, ComparingPlans, ContactForm, type ContentRect, 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, DropdownMenuRadio, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FeedbackEmoji, FeedbackForm, FeedbackRating, FileDropzone, FileUploader, FullCommand, type FullCommandItem, HorizontalPricing, type Hotkey, type HotkeyItem, type HotkeyItemOptions, Input, type InputFieldProps, InterfaceSettings, ItemCard, type KeyboardModifiers, 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, type PhoneCodeValue, PhoneInput, type PhoneInputProps, PhoneMockup, PinInput, PinInputGroup, PinInputRoot, PinInputSeperator, PinInputSlot, Popover, PopoverContent, PopoverPortal, PopoverRoot, 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, 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, getHotkeyHandler, getHotkeyMatcher, navigationMenuTriggerStyle, parseHotkey, reducer, toast, useBreakpoint, useClickOutside, useClipboard, useDialogCarousel, useFocusWithin, useIsomorphicEffect, useMeasureDirty, useMediaQuery, useMultiStepDialog, useShortcuts, useTabs, useToast, useViewportSize, useWindowEvent, useWindowSize };