@vygruppen/spor-react 11.3.6 → 11.3.7

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @vygruppen/spor-react@11.3.6 build /home/runner/work/spor/spor/packages/spor-react
+> @vygruppen/spor-react@11.3.7 build /home/runner/work/spor/spor/packages/spor-react
 > tsup
 
 CLI Building entry: src/index.tsx
@@ -10,12 +10,12 @@ CLI Target: node16
 CJS Build start
 ESM Build start
 DTS Build start
-CJS dist/index.js     287.92 KB
-CJS dist/index.js.map 591.55 KB
-CJS ⚡️ Build success in 2575ms
-ESM dist/index.mjs     269.06 KB
-ESM dist/index.mjs.map 591.55 KB
-ESM ⚡️ Build success in 2575ms
-DTS ⚡️ Build success in 17931ms
-DTS dist/index.d.ts  341.83 KB
-DTS dist/index.d.mts 341.83 KB
+CJS dist/index.js     288.05 KB
+CJS dist/index.js.map 592.13 KB
+CJS ⚡️ Build success in 2507ms
+ESM dist/index.mjs     269.19 KB
+ESM dist/index.mjs.map 592.13 KB
+ESM ⚡️ Build success in 2507ms
+DTS ⚡️ Build success in 17542ms
+DTS dist/index.d.ts  342.06 KB
+DTS dist/index.d.mts 342.06 KB

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @vygruppen/spor-react
 
+## 11.3.7
+
+### Patch Changes
+
+- d4cfe80: Update PhoneNumberInput name prop
+
 ## 11.3.6
 
 ### Patch Changes

package/dist/index.d.mts

@@ -1346,9 +1346,12 @@ type PhoneNumberInputProps = Omit<BoxProps, "onChange"> & {
     label?: string;
     /** The root name.
      *
-     * Please note that when specifying the name, the rendered names will be `${name}-country-code` and `${name}-phone-number`, respectively
+     * Please note that when specifying the name, the rendered names will be `${name}-country-code` and `${name}-phone-number` unless a name is provided for both countryCode and nationalNumber.
      */
-    name?: string;
+    name?: string | {
+        countryCode: string;
+        nationalNumber: string;
+    };
     /** Callback for when the country code or phone number changes */
     onChange?: (change: CountryCodeAndPhoneNumber) => void;
     /** The optional value of the country code and phone number */
@@ -1363,7 +1366,7 @@ type PhoneNumberInputProps = Omit<BoxProps, "onChange"> & {
  * <PhoneNumberInput name="phone" />
  * ```
  *
- * > Please note that when specifying the name, the rendered names will be `${name}-country-code` and `${name}-phone-number`, respectively
+ * > Please note that when specifying the name, the rendered names will be `${name}-country-code` and `${name}-phone-number` unless a name is provided for both countryCode and nationalNumber.
  *
  * The field can be controlled as well:
  * ```tsx
@@ -9481,4 +9484,4 @@ declare const useMediaQuery: typeof useMediaQuery$1;
  **/
 declare function slugify(text: string | string[], maxLength?: number): string;
 
-export { Accordion, type AccordionProps, AttachedInputs, Badge, type BadgeProps, Brand, Breadcrumb, BreadcrumbItem, BreadcrumbLink, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, CardSelect, CargonetLogo, type CargonetLogoProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, ChoiceChip, type ChoiceChipProps, ClosableAlert, CloseButton, type CloseButtonProps, Code, type CodeProps, ColorInlineLoader, type ColorInlineLoaderProps, ColorSpinner, type ColorSpinnerProps, Combobox, type ComboboxProps, ContentLoader, type ContentLoaderProps, DarkFullScreenLoader, DarkInlineLoader, type DarkInlineLoaderProps, DarkSpinner, type DarkSpinnerProps, DatePicker, DateRangePicker, Divider, type DividerProps, Drawer, type DrawerBodyProps, DrawerContent, ModalHeader as DrawerHeader, Expandable, ExpandableAlert, ExpandableItem, type ExpandableItemProps, FloatingActionButton, FormErrorMessage, type FormErrorMessageProps, FormLabel, type FormLabelProps, FullScreenDrawer, Heading, type HeadingProps, IconButton, type IconButtonProps, InfoSelect, InfoTag, type InfoTagProps, Input, type InputElementProps, InputLeftElement, type InputProps, InputRightElement, ItemDescription, ItemLabel, JumpButton, Language, LanguageProvider, LightFullScreenLoader, LightInlineLoader, type LightInlineLoaderProps, LightSpinner, type LightSpinnerProps, LineIcon, type LineIconProps, ListBox, ModalHeader, type ModalHeaderProps, NativeSelect, type NativeSelectProps, Nudge, type NudgeProps, NumericStepper, Pagination, PasswordInput, type PasswordInputProps, PhoneNumberInput, PlayPauseButton, PressableCard, ProgressBar, ProgressIndicator, ProgressLoader, Radio, RadioCard, RadioCardGroup, RadioCardGroupContext, type RadioCardProps, RadioGroup, type RadioGroupProps, type RadioProps, SearchInput, type SearchInputProps, ServiceAlert, SimpleDrawer, type SimpleDrawerProps, Skeleton, SkeletonCircle, type SkeletonCircleProps, type SkeletonProps, SkeletonText, type SkeletonTextProps, SkipButton, type SpinnerProps, SporProvider, Stack, type StackProps, StaticAlert, StaticCard, type StaticCardProps, Stepper, StepperStep, Switch, type SwitchProps, Table, type TableProps, Tabs, type TabsProps, Text, TextLink, type TextProps, Textarea, type TextareaProps, TimePicker, type ToastOptions, Tooltip, type TooltipProps, type TranslationObject, type Translations, TravelTag, type TravelTagProps, VyLogo, VyLogoPride, type VyLogoPrideProps, type VyLogoProps, WizardNudge, type WizardNudgeProps, brandTheme, createTexts, fontFaces, slugify, theme, useMediaQuery, useToast, useTranslation };
+export { Accordion, type AccordionProps, AttachedInputs, Badge, type BadgeProps, Brand, Breadcrumb, BreadcrumbItem, BreadcrumbLink, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, CardSelect, CargonetLogo, type CargonetLogoProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, ChoiceChip, type ChoiceChipProps, ClosableAlert, CloseButton, type CloseButtonProps, Code, type CodeProps, ColorInlineLoader, type ColorInlineLoaderProps, ColorSpinner, type ColorSpinnerProps, Combobox, type ComboboxProps, ContentLoader, type ContentLoaderProps, type CountryCodeAndPhoneNumber, DarkFullScreenLoader, DarkInlineLoader, type DarkInlineLoaderProps, DarkSpinner, type DarkSpinnerProps, DatePicker, DateRangePicker, Divider, type DividerProps, Drawer, type DrawerBodyProps, DrawerContent, ModalHeader as DrawerHeader, Expandable, ExpandableAlert, ExpandableItem, type ExpandableItemProps, FloatingActionButton, FormErrorMessage, type FormErrorMessageProps, FormLabel, type FormLabelProps, FullScreenDrawer, Heading, type HeadingProps, IconButton, type IconButtonProps, InfoSelect, InfoTag, type InfoTagProps, Input, type InputElementProps, InputLeftElement, type InputProps, InputRightElement, ItemDescription, ItemLabel, JumpButton, Language, LanguageProvider, LightFullScreenLoader, LightInlineLoader, type LightInlineLoaderProps, LightSpinner, type LightSpinnerProps, LineIcon, type LineIconProps, ListBox, ModalHeader, type ModalHeaderProps, NativeSelect, type NativeSelectProps, Nudge, type NudgeProps, NumericStepper, Pagination, PasswordInput, type PasswordInputProps, PhoneNumberInput, type PhoneNumberInputProps, PlayPauseButton, PressableCard, ProgressBar, ProgressIndicator, ProgressLoader, Radio, RadioCard, RadioCardGroup, RadioCardGroupContext, type RadioCardProps, RadioGroup, type RadioGroupProps, type RadioProps, SearchInput, type SearchInputProps, ServiceAlert, SimpleDrawer, type SimpleDrawerProps, Skeleton, SkeletonCircle, type SkeletonCircleProps, type SkeletonProps, SkeletonText, type SkeletonTextProps, SkipButton, type SpinnerProps, SporProvider, Stack, type StackProps, StaticAlert, StaticCard, type StaticCardProps, Stepper, StepperStep, Switch, type SwitchProps, Table, type TableProps, Tabs, type TabsProps, Text, TextLink, type TextProps, Textarea, type TextareaProps, TimePicker, type ToastOptions, Tooltip, type TooltipProps, type TranslationObject, type Translations, TravelTag, type TravelTagProps, VyLogo, VyLogoPride, type VyLogoPrideProps, type VyLogoProps, WizardNudge, type WizardNudgeProps, brandTheme, createTexts, fontFaces, slugify, theme, useMediaQuery, useToast, useTranslation };

package/dist/index.d.ts

@@ -1346,9 +1346,12 @@ type PhoneNumberInputProps = Omit<BoxProps, "onChange"> & {
     label?: string;
     /** The root name.
      *
-     * Please note that when specifying the name, the rendered names will be `${name}-country-code` and `${name}-phone-number`, respectively
+     * Please note that when specifying the name, the rendered names will be `${name}-country-code` and `${name}-phone-number` unless a name is provided for both countryCode and nationalNumber.
      */
-    name?: string;
+    name?: string | {
+        countryCode: string;
+        nationalNumber: string;
+    };
     /** Callback for when the country code or phone number changes */
     onChange?: (change: CountryCodeAndPhoneNumber) => void;
     /** The optional value of the country code and phone number */
@@ -1363,7 +1366,7 @@ type PhoneNumberInputProps = Omit<BoxProps, "onChange"> & {
  * <PhoneNumberInput name="phone" />
  * ```
  *
- * > Please note that when specifying the name, the rendered names will be `${name}-country-code` and `${name}-phone-number`, respectively
+ * > Please note that when specifying the name, the rendered names will be `${name}-country-code` and `${name}-phone-number` unless a name is provided for both countryCode and nationalNumber.
  *
  * The field can be controlled as well:
  * ```tsx
@@ -9481,4 +9484,4 @@ declare const useMediaQuery: typeof useMediaQuery$1;
  **/
 declare function slugify(text: string | string[], maxLength?: number): string;
 
-export { Accordion, type AccordionProps, AttachedInputs, Badge, type BadgeProps, Brand, Breadcrumb, BreadcrumbItem, BreadcrumbLink, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, CardSelect, CargonetLogo, type CargonetLogoProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, ChoiceChip, type ChoiceChipProps, ClosableAlert, CloseButton, type CloseButtonProps, Code, type CodeProps, ColorInlineLoader, type ColorInlineLoaderProps, ColorSpinner, type ColorSpinnerProps, Combobox, type ComboboxProps, ContentLoader, type ContentLoaderProps, DarkFullScreenLoader, DarkInlineLoader, type DarkInlineLoaderProps, DarkSpinner, type DarkSpinnerProps, DatePicker, DateRangePicker, Divider, type DividerProps, Drawer, type DrawerBodyProps, DrawerContent, ModalHeader as DrawerHeader, Expandable, ExpandableAlert, ExpandableItem, type ExpandableItemProps, FloatingActionButton, FormErrorMessage, type FormErrorMessageProps, FormLabel, type FormLabelProps, FullScreenDrawer, Heading, type HeadingProps, IconButton, type IconButtonProps, InfoSelect, InfoTag, type InfoTagProps, Input, type InputElementProps, InputLeftElement, type InputProps, InputRightElement, ItemDescription, ItemLabel, JumpButton, Language, LanguageProvider, LightFullScreenLoader, LightInlineLoader, type LightInlineLoaderProps, LightSpinner, type LightSpinnerProps, LineIcon, type LineIconProps, ListBox, ModalHeader, type ModalHeaderProps, NativeSelect, type NativeSelectProps, Nudge, type NudgeProps, NumericStepper, Pagination, PasswordInput, type PasswordInputProps, PhoneNumberInput, PlayPauseButton, PressableCard, ProgressBar, ProgressIndicator, ProgressLoader, Radio, RadioCard, RadioCardGroup, RadioCardGroupContext, type RadioCardProps, RadioGroup, type RadioGroupProps, type RadioProps, SearchInput, type SearchInputProps, ServiceAlert, SimpleDrawer, type SimpleDrawerProps, Skeleton, SkeletonCircle, type SkeletonCircleProps, type SkeletonProps, SkeletonText, type SkeletonTextProps, SkipButton, type SpinnerProps, SporProvider, Stack, type StackProps, StaticAlert, StaticCard, type StaticCardProps, Stepper, StepperStep, Switch, type SwitchProps, Table, type TableProps, Tabs, type TabsProps, Text, TextLink, type TextProps, Textarea, type TextareaProps, TimePicker, type ToastOptions, Tooltip, type TooltipProps, type TranslationObject, type Translations, TravelTag, type TravelTagProps, VyLogo, VyLogoPride, type VyLogoPrideProps, type VyLogoProps, WizardNudge, type WizardNudgeProps, brandTheme, createTexts, fontFaces, slugify, theme, useMediaQuery, useToast, useTranslation };
+export { Accordion, type AccordionProps, AttachedInputs, Badge, type BadgeProps, Brand, Breadcrumb, BreadcrumbItem, BreadcrumbLink, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, CardSelect, CargonetLogo, type CargonetLogoProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, ChoiceChip, type ChoiceChipProps, ClosableAlert, CloseButton, type CloseButtonProps, Code, type CodeProps, ColorInlineLoader, type ColorInlineLoaderProps, ColorSpinner, type ColorSpinnerProps, Combobox, type ComboboxProps, ContentLoader, type ContentLoaderProps, type CountryCodeAndPhoneNumber, DarkFullScreenLoader, DarkInlineLoader, type DarkInlineLoaderProps, DarkSpinner, type DarkSpinnerProps, DatePicker, DateRangePicker, Divider, type DividerProps, Drawer, type DrawerBodyProps, DrawerContent, ModalHeader as DrawerHeader, Expandable, ExpandableAlert, ExpandableItem, type ExpandableItemProps, FloatingActionButton, FormErrorMessage, type FormErrorMessageProps, FormLabel, type FormLabelProps, FullScreenDrawer, Heading, type HeadingProps, IconButton, type IconButtonProps, InfoSelect, InfoTag, type InfoTagProps, Input, type InputElementProps, InputLeftElement, type InputProps, InputRightElement, ItemDescription, ItemLabel, JumpButton, Language, LanguageProvider, LightFullScreenLoader, LightInlineLoader, type LightInlineLoaderProps, LightSpinner, type LightSpinnerProps, LineIcon, type LineIconProps, ListBox, ModalHeader, type ModalHeaderProps, NativeSelect, type NativeSelectProps, Nudge, type NudgeProps, NumericStepper, Pagination, PasswordInput, type PasswordInputProps, PhoneNumberInput, type PhoneNumberInputProps, PlayPauseButton, PressableCard, ProgressBar, ProgressIndicator, ProgressLoader, Radio, RadioCard, RadioCardGroup, RadioCardGroupContext, type RadioCardProps, RadioGroup, type RadioGroupProps, type RadioProps, SearchInput, type SearchInputProps, ServiceAlert, SimpleDrawer, type SimpleDrawerProps, Skeleton, SkeletonCircle, type SkeletonCircleProps, type SkeletonProps, SkeletonText, type SkeletonTextProps, SkipButton, type SpinnerProps, SporProvider, Stack, type StackProps, StaticAlert, StaticCard, type StaticCardProps, Stepper, StepperStep, Switch, type SwitchProps, Table, type TableProps, Tabs, type TabsProps, Text, TextLink, type TextProps, Textarea, type TextareaProps, TimePicker, type ToastOptions, Tooltip, type TooltipProps, type TranslationObject, type Translations, TravelTag, type TravelTagProps, VyLogo, VyLogoPride, type VyLogoPrideProps, type VyLogoProps, WizardNudge, type WizardNudgeProps, brandTheme, createTexts, fontFaces, slugify, theme, useMediaQuery, useToast, useTranslation };

package/dist/index.js

@@ -1117,7 +1117,7 @@ var PhoneNumberInput = react.forwardRef(
           countryCode,
           nationalNumber: value.nationalNumber
         }),
-        name: name ? `${name}-country-code` : "country-code",
+        name: name ? typeof name !== "string" && name.countryCode ? name.countryCode : `${name}-country-code` : "country-code",
         height: "100%",
         width: "6.25rem",
         variant
@@ -1129,7 +1129,7 @@ var PhoneNumberInput = react.forwardRef(
         type: "tel",
         label,
         value: value.nationalNumber,
-        name: name ? `${name}-phone-number` : "phone-number",
+        name: name ? typeof name !== "string" && name.nationalNumber ? name.nationalNumber : `${name}-phone-number` : "phone-number",
         onChange: (e) => {
           const strippedValue = e.target.value.replace(/[^\d\s-]/g, "");
           onChange({