@sikka/hawa 0.31.17-next → 0.32.0

package/dist/{Radio-D52-m4Ns.d.mts → Radio-BpXOu4Hr.d.mts}

@@ -10,6 +10,22 @@ type LabelProps = {
 };
 declare const Label: React.ForwardRefExoticComponent<React.LabelHTMLAttributes<HTMLLabelElement> & LabelProps & React.RefAttributes<HTMLLabelElement>>;
 
+type PhoneInputProps = {
+    preferredCountry?: {
+        label: string;
+    };
+    helperText?: any;
+    label?: string;
+    labelProps?: LabelProps;
+    placeholder?: string;
+    handleChange?: (value: string) => void;
+    inputProps?: React__default.InputHTMLAttributes<HTMLInputElement>;
+    countryCodes?: {
+        label: string;
+    }[];
+};
+declare const PhoneInput: FC<PhoneInputProps>;
+
 type SelectOptionProps = {
     value: any;
     label: any;
@@ -76,4 +92,4 @@ type RadioTypes = {
 };
 declare const Radio: React__default.ForwardRefExoticComponent<RadioTypes & React__default.RefAttributes<HTMLInputElement>>;
 
-export { type LabelProps as L, type RadioOptionsTypes as R, type SelectOptionProps as S, Radio as a, Label as b, Select as c };
+export { type LabelProps as L, type PhoneInputProps as P, type RadioOptionsTypes as R, type SelectOptionProps as S, Radio as a, Label as b, Select as c, PhoneInput as d };

package/dist/{Radio-B-DG0FMr.d.ts → Radio-CREjhlGz.d.ts}

@@ -10,6 +10,22 @@ type LabelProps = {
 };
 declare const Label: React.ForwardRefExoticComponent<React.LabelHTMLAttributes<HTMLLabelElement> & LabelProps & React.RefAttributes<HTMLLabelElement>>;
 
+type PhoneInputProps = {
+    preferredCountry?: {
+        label: string;
+    };
+    helperText?: any;
+    label?: string;
+    labelProps?: LabelProps;
+    placeholder?: string;
+    handleChange?: (value: string) => void;
+    inputProps?: React__default.InputHTMLAttributes<HTMLInputElement>;
+    countryCodes?: {
+        label: string;
+    }[];
+};
+declare const PhoneInput: FC<PhoneInputProps>;
+
 type SelectOptionProps = {
     value: any;
     label: any;
@@ -76,4 +92,4 @@ type RadioTypes = {
 };
 declare const Radio: React__default.ForwardRefExoticComponent<RadioTypes & React__default.RefAttributes<HTMLInputElement>>;
 
-export { type LabelProps as L, type RadioOptionsTypes as R, type SelectOptionProps as S, Radio as a, Label as b, Select as c };
+export { type LabelProps as L, type PhoneInputProps as P, type RadioOptionsTypes as R, type SelectOptionProps as S, Radio as a, Label as b, Select as c, PhoneInput as d };

package/dist/blocks/auth/index.d.mts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import React__default, { FC } from 'react';
-import { a as ThirdPartyAuthTextsTypes, L as LoginFormTextsTypes, D as DirectionType, P as PositionType, b as RegisterFormTextsTypes, N as NewPasswordTextsTypes, c as ResetPasswordTextsTypes } from '../../textTypes-DXLtO2fL.mjs';
+import { a as ThirdPartyAuthTextsTypes, P as PositionType, L as LoginFormTextsTypes, D as DirectionType, b as RegisterFormTextsTypes, N as NewPasswordTextsTypes, c as ResetPasswordTextsTypes } from '../../textTypes-DXLtO2fL.mjs';
 
 type AuthButtonsType = {
     texts?: ThirdPartyAuthTextsTypes;
@@ -34,6 +34,28 @@ type AuthButtonsType = {
 };
 declare const AuthButtons: React__default.FC<AuthButtonsType>;
 
+type LabelProps = {
+    hint?: React.ReactNode;
+    hintSide?: PositionType;
+    htmlFor?: string;
+    required?: boolean;
+};
+
+type PhoneInputProps = {
+    preferredCountry?: {
+        label: string;
+    };
+    helperText?: any;
+    label?: string;
+    labelProps?: LabelProps;
+    placeholder?: string;
+    handleChange?: (value: string) => void;
+    inputProps?: React__default.InputHTMLAttributes<HTMLInputElement>;
+    countryCodes?: {
+        label: string;
+    }[];
+};
+
 type LoginFormTypes = {
     /** Object containing text labels used throughout the form. */
     texts?: LoginFormTextsTypes;
@@ -85,16 +107,11 @@ type LoginFormTypes = {
     passwordLength?: number;
     /** If true, the form is displayed without a card container styling.*/
     cardless?: boolean;
+    /** Props to pass to the PhoneInput component */
+    phoneInputProps: PhoneInputProps;
 };
 declare const LoginForm: FC<LoginFormTypes>;
 
-type LabelProps = {
-    hint?: React.ReactNode;
-    hintSide?: PositionType;
-    htmlFor?: string;
-    required?: boolean;
-};
-
 type SelectOptionProps = {
     value: any;
     label: any;

package/dist/blocks/auth/index.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import React__default, { FC } from 'react';
-import { a as ThirdPartyAuthTextsTypes, L as LoginFormTextsTypes, D as DirectionType, P as PositionType, b as RegisterFormTextsTypes, N as NewPasswordTextsTypes, c as ResetPasswordTextsTypes } from '../../textTypes-DXLtO2fL.js';
+import { a as ThirdPartyAuthTextsTypes, P as PositionType, L as LoginFormTextsTypes, D as DirectionType, b as RegisterFormTextsTypes, N as NewPasswordTextsTypes, c as ResetPasswordTextsTypes } from '../../textTypes-DXLtO2fL.js';
 
 type AuthButtonsType = {
     texts?: ThirdPartyAuthTextsTypes;
@@ -34,6 +34,28 @@ type AuthButtonsType = {
 };
 declare const AuthButtons: React__default.FC<AuthButtonsType>;
 
+type LabelProps = {
+    hint?: React.ReactNode;
+    hintSide?: PositionType;
+    htmlFor?: string;
+    required?: boolean;
+};
+
+type PhoneInputProps = {
+    preferredCountry?: {
+        label: string;
+    };
+    helperText?: any;
+    label?: string;
+    labelProps?: LabelProps;
+    placeholder?: string;
+    handleChange?: (value: string) => void;
+    inputProps?: React__default.InputHTMLAttributes<HTMLInputElement>;
+    countryCodes?: {
+        label: string;
+    }[];
+};
+
 type LoginFormTypes = {
     /** Object containing text labels used throughout the form. */
     texts?: LoginFormTextsTypes;
@@ -85,16 +107,11 @@ type LoginFormTypes = {
     passwordLength?: number;
     /** If true, the form is displayed without a card container styling.*/
     cardless?: boolean;
+    /** Props to pass to the PhoneInput component */
+    phoneInputProps: PhoneInputProps;
 };
 declare const LoginForm: FC<LoginFormTypes>;
 
-type LabelProps = {
-    hint?: React.ReactNode;
-    hintSide?: PositionType;
-    htmlFor?: string;
-    required?: boolean;
-};
-
 type SelectOptionProps = {
     value: any;
     label: any;

package/dist/blocks/auth/index.js

@@ -3228,12 +3228,14 @@ var Select = ({
 var PhoneInput = ({
   labelProps,
   inputProps,
+  countryCodes,
   ...props
 }) => {
   const [phoneNumber, setPhoneNumber] = (0, import_react9.useState)("");
   const [countryCode, setCountryCode] = (0, import_react9.useState)(props.preferredCountry);
   const inputRef = (0, import_react9.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)) {
@@ -3256,7 +3258,7 @@ var PhoneInput = ({
       isSearchable: true,
       isClearable: false,
       placeholder: "Code",
-      options: countries_default,
+      options: countryCodes || countries_default,
       onChange: setCountryCode,
       value: countryCode == null ? void 0 : countryCode.label,
       defaultValue: props.preferredCountry
@@ -3377,8 +3379,8 @@ var LoginForm = ({
         required_error: ((_m = texts == null ? void 0 : texts.phone) == null ? void 0 : _m.required) || "Phone Number Required"
       }).refine(
         (value) => {
-          let phoneNumber = (0, import_libphonenumber_js.parsePhoneNumber)(value);
-          return phoneNumber.isValid();
+          let isPhoneValid = (0, import_libphonenumber_js.isPossiblePhoneNumber)(value) && (0, import_libphonenumber_js.isValidPhoneNumber)(value) && (0, import_libphonenumber_js.validatePhoneNumberLength)(value) === void 0;
+          return isPhoneValid;
         },
         { message: ((_n = texts == null ? void 0 : texts.phone) == null ? void 0 : _n.invalid) || "Phone Number Invalid" }
       )
@@ -3532,7 +3534,15 @@ var LoginForm = ({
                   label: ((_a2 = texts == null ? void 0 : texts.phone) == null ? void 0 : _a2.label) || "Phone Number",
                   helperText: (_b2 = formState.errors.phone) == null ? void 0 : _b2.message,
                   preferredCountry: { label: "+966" },
-                  handleChange: (e) => field.onChange((0, import_libphonenumber_js.parsePhoneNumber)(e).number)
+                  ...props.phoneInputProps,
+                  handleChange: (e) => {
+                    if ((0, import_libphonenumber_js.isValidPhoneNumber)(e) && (0, import_libphonenumber_js.isPossiblePhoneNumber)(e) && (0, import_libphonenumber_js.validatePhoneNumberLength)(e) === void 0) {
+                      let parsed = (0, import_libphonenumber_js.parsePhoneNumber)(e);
+                      field.onChange(parsed.number);
+                    } else {
+                      field.onChange(e);
+                    }
+                  }
                 }
               );
             }

package/dist/blocks/auth/index.mjs

@@ -482,7 +482,12 @@ import React5 from "react";
 import { useState as useState3 } from "react";
 import { Controller, useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { parsePhoneNumber } from "libphonenumber-js";
+import {
+  isPossiblePhoneNumber,
+  isValidPhoneNumber,
+  parsePhoneNumber,
+  validatePhoneNumberLength
+} from "libphonenumber-js";
 import * as z from "zod";
 
 // elements/alert/Alert.tsx
@@ -2329,12 +2334,14 @@ var countries_default = countries;
 var PhoneInput = ({
   labelProps,
   inputProps,
+  countryCodes,
   ...props
 }) => {
   const [phoneNumber, setPhoneNumber] = useState2("");
   const [countryCode, setCountryCode] = useState2(props.preferredCountry);
   const inputRef = useRef2(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)) {
@@ -2357,7 +2364,7 @@ var PhoneInput = ({
       isSearchable: true,
       isClearable: false,
       placeholder: "Code",
-      options: countries_default,
+      options: countryCodes || countries_default,
       onChange: setCountryCode,
       value: countryCode == null ? void 0 : countryCode.label,
       defaultValue: props.preferredCountry
@@ -2439,8 +2446,8 @@ var LoginForm = ({
         required_error: ((_m = texts == null ? void 0 : texts.phone) == null ? void 0 : _m.required) || "Phone Number Required"
       }).refine(
         (value) => {
-          let phoneNumber = parsePhoneNumber(value);
-          return phoneNumber.isValid();
+          let isPhoneValid = isPossiblePhoneNumber(value) && isValidPhoneNumber(value) && validatePhoneNumberLength(value) === void 0;
+          return isPhoneValid;
         },
         { message: ((_n = texts == null ? void 0 : texts.phone) == null ? void 0 : _n.invalid) || "Phone Number Invalid" }
       )
@@ -2594,7 +2601,15 @@ var LoginForm = ({
                   label: ((_a2 = texts == null ? void 0 : texts.phone) == null ? void 0 : _a2.label) || "Phone Number",
                   helperText: (_b2 = formState.errors.phone) == null ? void 0 : _b2.message,
                   preferredCountry: { label: "+966" },
-                  handleChange: (e) => field.onChange(parsePhoneNumber(e).number)
+                  ...props.phoneInputProps,
+                  handleChange: (e) => {
+                    if (isValidPhoneNumber(e) && isPossiblePhoneNumber(e) && validatePhoneNumberLength(e) === void 0) {
+                      let parsed = parsePhoneNumber(e);
+                      field.onChange(parsed.number);
+                    } else {
+                      field.onChange(e);
+                    }
+                  }
                 }
               );
             }

package/dist/blocks/index.d.mts

@@ -1,7 +1,7 @@
 import React__default, { FC, InputHTMLAttributes } from 'react';
 import { ThirdPartyAuthTextsTypes, LoginFormTextsTypes, RegisterFormTextsTypes, NewPasswordTextsTypes, ResetPasswordTextsTypes, BaseInputType, TextInputType, PricingCardProps, PlanFeature, PricingPlanTexts } from '../types/index.mjs';
+import { P as PhoneInputProps, S as SelectOptionProps, L as LabelProps, R as RadioOptionsTypes } from '../Radio-BpXOu4Hr.mjs';
 import { D as DirectionType, a as RadioOptionType, O as OrientationType } from '../commonTypes-C-g8nFFC.mjs';
-import { S as SelectOptionProps, L as LabelProps, R as RadioOptionsTypes } from '../Radio-D52-m4Ns.mjs';
 import { M as MenuItemType } from '../DropdownMenu-K3ztliYc.mjs';
 import '@radix-ui/react-dropdown-menu';
 
@@ -88,6 +88,8 @@ type LoginFormTypes = {
     passwordLength?: number;
     /** If true, the form is displayed without a card container styling.*/
     cardless?: boolean;
+    /** Props to pass to the PhoneInput component */
+    phoneInputProps: PhoneInputProps;
 };
 declare const LoginForm: FC<LoginFormTypes>;
 

package/dist/blocks/index.d.ts

@@ -1,7 +1,7 @@
 import React__default, { FC, InputHTMLAttributes } from 'react';
 import { ThirdPartyAuthTextsTypes, LoginFormTextsTypes, RegisterFormTextsTypes, NewPasswordTextsTypes, ResetPasswordTextsTypes, BaseInputType, TextInputType, PricingCardProps, PlanFeature, PricingPlanTexts } from '../types/index.js';
+import { P as PhoneInputProps, S as SelectOptionProps, L as LabelProps, R as RadioOptionsTypes } from '../Radio-CREjhlGz.js';
 import { D as DirectionType, a as RadioOptionType, O as OrientationType } from '../commonTypes-C-g8nFFC.js';
-import { S as SelectOptionProps, L as LabelProps, R as RadioOptionsTypes } from '../Radio-B-DG0FMr.js';
 import { M as MenuItemType } from '../DropdownMenu-CJblb-9q.js';
 import '@radix-ui/react-dropdown-menu';
 
@@ -88,6 +88,8 @@ type LoginFormTypes = {
     passwordLength?: number;
     /** If true, the form is displayed without a card container styling.*/
     cardless?: boolean;
+    /** Props to pass to the PhoneInput component */
+    phoneInputProps: PhoneInputProps;
 };
 declare const LoginForm: FC<LoginFormTypes>;
 

package/dist/blocks/index.js

@@ -3249,12 +3249,14 @@ var Select = ({
 var PhoneInput = ({
   labelProps,
   inputProps,
+  countryCodes,
   ...props
 }) => {
   const [phoneNumber, setPhoneNumber] = (0, import_react9.useState)("");
   const [countryCode, setCountryCode] = (0, import_react9.useState)(props.preferredCountry);
   const inputRef = (0, import_react9.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)) {
@@ -3277,7 +3279,7 @@ var PhoneInput = ({
       isSearchable: true,
       isClearable: false,
       placeholder: "Code",
-      options: countries_default,
+      options: countryCodes || countries_default,
       onChange: setCountryCode,
       value: countryCode == null ? void 0 : countryCode.label,
       defaultValue: props.preferredCountry
@@ -3534,8 +3536,8 @@ var LoginForm = ({
         required_error: ((_m = texts == null ? void 0 : texts.phone) == null ? void 0 : _m.required) || "Phone Number Required"
       }).refine(
         (value) => {
-          let phoneNumber = (0, import_libphonenumber_js.parsePhoneNumber)(value);
-          return phoneNumber.isValid();
+          let isPhoneValid = (0, import_libphonenumber_js.isPossiblePhoneNumber)(value) && (0, import_libphonenumber_js.isValidPhoneNumber)(value) && (0, import_libphonenumber_js.validatePhoneNumberLength)(value) === void 0;
+          return isPhoneValid;
         },
         { message: ((_n = texts == null ? void 0 : texts.phone) == null ? void 0 : _n.invalid) || "Phone Number Invalid" }
       )
@@ -3689,7 +3691,15 @@ var LoginForm = ({
                   label: ((_a2 = texts == null ? void 0 : texts.phone) == null ? void 0 : _a2.label) || "Phone Number",
                   helperText: (_b2 = formState.errors.phone) == null ? void 0 : _b2.message,
                   preferredCountry: { label: "+966" },
-                  handleChange: (e) => field.onChange((0, import_libphonenumber_js.parsePhoneNumber)(e).number)
+                  ...props.phoneInputProps,
+                  handleChange: (e) => {
+                    if ((0, import_libphonenumber_js.isValidPhoneNumber)(e) && (0, import_libphonenumber_js.isPossiblePhoneNumber)(e) && (0, import_libphonenumber_js.validatePhoneNumberLength)(e) === void 0) {
+                      let parsed = (0, import_libphonenumber_js.parsePhoneNumber)(e);
+                      field.onChange(parsed.number);
+                    } else {
+                      field.onChange(e);
+                    }
+                  }
                 }
               );
             }

package/dist/blocks/index.mjs

@@ -26,7 +26,7 @@ import {
   UncheckMark,
   VeryBadEmoji,
   VeryGoodEmoji
-} from "../chunk-VZNDYO6H.mjs";
+} from "../chunk-WFPAI2QC.mjs";
 import "../chunk-OPYDG34F.mjs";
 import {
   Button,
@@ -148,7 +148,12 @@ import React2 from "react";
 import { useState } from "react";
 import { Controller, useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { parsePhoneNumber } from "libphonenumber-js";
+import {
+  isPossiblePhoneNumber,
+  isValidPhoneNumber,
+  parsePhoneNumber,
+  validatePhoneNumberLength
+} from "libphonenumber-js";
 import * as z from "zod";
 var LoginForm = ({
   loginType = "email",
@@ -200,8 +205,8 @@ var LoginForm = ({
         required_error: ((_m = texts == null ? void 0 : texts.phone) == null ? void 0 : _m.required) || "Phone Number Required"
       }).refine(
         (value) => {
-          let phoneNumber = parsePhoneNumber(value);
-          return phoneNumber.isValid();
+          let isPhoneValid = isPossiblePhoneNumber(value) && isValidPhoneNumber(value) && validatePhoneNumberLength(value) === void 0;
+          return isPhoneValid;
         },
         { message: ((_n = texts == null ? void 0 : texts.phone) == null ? void 0 : _n.invalid) || "Phone Number Invalid" }
       )
@@ -355,7 +360,15 @@ var LoginForm = ({
                   label: ((_a2 = texts == null ? void 0 : texts.phone) == null ? void 0 : _a2.label) || "Phone Number",
                   helperText: (_b2 = formState.errors.phone) == null ? void 0 : _b2.message,
                   preferredCountry: { label: "+966" },
-                  handleChange: (e) => field.onChange(parsePhoneNumber(e).number)
+                  ...props.phoneInputProps,
+                  handleChange: (e) => {
+                    if (isValidPhoneNumber(e) && isPossiblePhoneNumber(e) && validatePhoneNumberLength(e) === void 0) {
+                      let parsed = parsePhoneNumber(e);
+                      field.onChange(parsed.number);
+                    } else {
+                      field.onChange(e);
+                    }
+                  }
                 }
               );
             }

package/dist/{chunk-VZNDYO6H.mjs → chunk-WFPAI2QC.mjs}

@@ -2233,12 +2233,14 @@ var countries_default = countries;
 var PhoneInput = ({
   labelProps,
   inputProps,
+  countryCodes,
   ...props
 }) => {
   const [phoneNumber, setPhoneNumber] = useState2("");
   const [countryCode, setCountryCode] = useState2(props.preferredCountry);
   const inputRef = useRef2(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)) {
@@ -2261,7 +2263,7 @@ var PhoneInput = ({
       isSearchable: true,
       isClearable: false,
       placeholder: "Code",
-      options: countries_default,
+      options: countryCodes || countries_default,
       onChange: setCountryCode,
       value: countryCode == null ? void 0 : countryCode.label,
       defaultValue: props.preferredCountry

package/dist/elements/index.d.mts

@@ -13,8 +13,8 @@ import { DialogProps } from '@radix-ui/react-dialog';
 import { VariantProps } from 'class-variance-authority';
 import { RowData, ColumnDef } from '@tanstack/react-table';
 export { ColumnDef } from '@tanstack/react-table';
-import { L as LabelProps } from '../Radio-D52-m4Ns.mjs';
-export { b as Label, a as Radio, R as RadioOptionsTypes, c as Select, S as SelectOptionProps } from '../Radio-D52-m4Ns.mjs';
+import { L as LabelProps } from '../Radio-BpXOu4Hr.mjs';
+export { b as Label, d as PhoneInput, P as PhoneInputProps, a as Radio, R as RadioOptionsTypes, c as Select, S as SelectOptionProps } from '../Radio-BpXOu4Hr.mjs';
 import { Command as Command$1 } from 'cmdk';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
@@ -650,19 +650,6 @@ type BadgeTypes = {
 declare const Badge: FC<BadgeTypes>;
 declare const BadgedComponent: ({ children, className, hideBadge, position, size, text }: any) => React__default.JSX.Element;
 
-type PhoneInputTypes = {
-    preferredCountry?: {
-        label: string;
-    };
-    helperText?: any;
-    label?: string;
-    labelProps?: LabelProps;
-    placeholder?: string;
-    handleChange?: (value: string) => void;
-    inputProps?: React__default.InputHTMLAttributes<HTMLInputElement>;
-};
-declare const PhoneInput: FC<PhoneInputTypes>;
-
 type PinInputTypes = {
     /** Label text to display for the Pin Input */
     label?: string;
@@ -888,4 +875,4 @@ type PhoneMockupProps = {
 };
 declare const PhoneMockup: React__default.FC<PhoneMockupProps>;
 
-export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, Alert, AppStores, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, type BreadcrumbItemProps, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, Checkbox, ChipTypes, CodeBlock, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, type CommandInputProps, 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, PopoverPortal, PopoverRoot, 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 };
+export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, Alert, AppStores, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, type BreadcrumbItemProps, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, Checkbox, ChipTypes, CodeBlock, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, type CommandInputProps, 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, PhoneMockup, PinInput, Popover, PopoverContent, PopoverPortal, PopoverRoot, 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

@@ -13,8 +13,8 @@ import { DialogProps } from '@radix-ui/react-dialog';
 import { VariantProps } from 'class-variance-authority';
 import { RowData, ColumnDef } from '@tanstack/react-table';
 export { ColumnDef } from '@tanstack/react-table';
-import { L as LabelProps } from '../Radio-B-DG0FMr.js';
-export { b as Label, a as Radio, R as RadioOptionsTypes, c as Select, S as SelectOptionProps } from '../Radio-B-DG0FMr.js';
+import { L as LabelProps } from '../Radio-CREjhlGz.js';
+export { b as Label, d as PhoneInput, P as PhoneInputProps, a as Radio, R as RadioOptionsTypes, c as Select, S as SelectOptionProps } from '../Radio-CREjhlGz.js';
 import { Command as Command$1 } from 'cmdk';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
@@ -650,19 +650,6 @@ type BadgeTypes = {
 declare const Badge: FC<BadgeTypes>;
 declare const BadgedComponent: ({ children, className, hideBadge, position, size, text }: any) => React__default.JSX.Element;
 
-type PhoneInputTypes = {
-    preferredCountry?: {
-        label: string;
-    };
-    helperText?: any;
-    label?: string;
-    labelProps?: LabelProps;
-    placeholder?: string;
-    handleChange?: (value: string) => void;
-    inputProps?: React__default.InputHTMLAttributes<HTMLInputElement>;
-};
-declare const PhoneInput: FC<PhoneInputTypes>;
-
 type PinInputTypes = {
     /** Label text to display for the Pin Input */
     label?: string;
@@ -888,4 +875,4 @@ type PhoneMockupProps = {
 };
 declare const PhoneMockup: React__default.FC<PhoneMockupProps>;
 
-export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, Alert, AppStores, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, type BreadcrumbItemProps, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, Checkbox, ChipTypes, CodeBlock, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, type CommandInputProps, 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, PopoverPortal, PopoverRoot, 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 };
+export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, AccordionRoot, AccordionTrigger, Alert, AppStores, Avatar, BackToTop, Badge, BadgedComponent, Breadcrumb, type BreadcrumbItemProps, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, Checkbox, ChipTypes, CodeBlock, ColorPicker, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, type CommandInputProps, 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, PhoneMockup, PinInput, Popover, PopoverContent, PopoverPortal, PopoverRoot, 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

@@ -6692,12 +6692,14 @@ var countries_default = countries;
 var PhoneInput = ({
   labelProps,
   inputProps,
+  countryCodes,
   ...props
 }) => {
   const [phoneNumber, setPhoneNumber] = (0, import_react34.useState)("");
   const [countryCode, setCountryCode] = (0, import_react34.useState)(props.preferredCountry);
   const inputRef = (0, import_react34.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)) {
@@ -6720,7 +6722,7 @@ var PhoneInput = ({
       isSearchable: true,
       isClearable: false,
       placeholder: "Code",
-      options: countries_default,
+      options: countryCodes || countries_default,
       onChange: setCountryCode,
       value: countryCode == null ? void 0 : countryCode.label,
       defaultValue: props.preferredCountry

package/dist/elements/index.mjs

@@ -27,7 +27,7 @@ import {
   TabsTrigger,
   Textarea,
   UncheckMark
-} from "../chunk-VZNDYO6H.mjs";
+} from "../chunk-WFPAI2QC.mjs";
 import {
   useClipboard
 } from "../chunk-OPYDG34F.mjs";

package/dist/index.d.mts

@@ -851,7 +851,7 @@ type BadgeTypes = {
 declare const Badge: FC<BadgeTypes>;
 declare const BadgedComponent: ({ children, className, hideBadge, position, size, text }: any) => React__default.JSX.Element;
 
-type PhoneInputTypes = {
+type PhoneInputProps = {
     preferredCountry?: {
         label: string;
     };
@@ -861,8 +861,11 @@ type PhoneInputTypes = {
     placeholder?: string;
     handleChange?: (value: string) => void;
     inputProps?: React__default.InputHTMLAttributes<HTMLInputElement>;
+    countryCodes?: {
+        label: string;
+    }[];
 };
-declare const PhoneInput: FC<PhoneInputTypes>;
+declare const PhoneInput: FC<PhoneInputProps>;
 
 type PinInputTypes = {
     /** Label text to display for the Pin Input */
@@ -1572,6 +1575,8 @@ type LoginFormTypes = {
     passwordLength?: number;
     /** If true, the form is displayed without a card container styling.*/
     cardless?: boolean;
+    /** Props to pass to the PhoneInput component */
+    phoneInputProps: PhoneInputProps;
 };
 declare const LoginForm: FC<LoginFormTypes>;
 
@@ -2137,4 +2142,4 @@ interface ContentRect {
 }
 declare const useMeasureDirty: (ref: RefObject<HTMLElement>) => ContentRect;
 
-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, 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, 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, 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, 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, useMeasureDirty, 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, 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, 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, type PhoneInputProps, PhoneMockup, PinInput, 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, 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, useMeasureDirty, useMediaQuery, useMultiStepDialog, useTabs, useToast, useWindowSize };