Added the option to display optional phone number

nsbno · Aug 26, 2024 · 8dcd815 · 8dcd815
1 parent 572fc31
commit 8dcd815
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/apps/docs/package.json b/apps/docs/package.json
@@ -1,6 +1,6 @@
 {
   "private": true,
-  "version": "0.0.47",
+  "version": "0.0.48",
   "name": "@vygruppen/docs",
   "description": "The Spor documentation",
   "license": "MIT",

diff --git a/packages/spor-react/src/input/PhoneNumberInput.tsx b/packages/spor-react/src/input/PhoneNumberInput.tsx
@@ -25,6 +25,7 @@ type PhoneNumberInputProps = Omit<BoxProps, "onChange"> & {
   /** The optional value of the country code and phone number */
   value?: CountryCodeAndPhoneNumber;
   variant?: "base" | "floating";
+  isOptional?: boolean;
 };
 /**
  * A component for entering phone numbers.
@@ -51,12 +52,13 @@ export const PhoneNumberInput = forwardRef<PhoneNumberInputProps, As>(
       value: externalValue,
       onChange: externalOnChange,
       variant,
+      isOptional,
       ...boxProps
     },
     ref,
   ) => {
     const { t } = useTranslation();
-    const label = externalLabel ?? t(texts.phoneNumber);
+    const label = externalLabel ?? isOptional ? t(texts.phoneNumberOptional) : t(texts.phoneNumber);
     const [value, onChange] = useControllableState({
       value: externalValue,
       onChange: externalOnChange,
@@ -125,6 +127,12 @@ const texts = createTexts({
     en: "Phone number",
     sv: "Telefonnummer",
   },
+  phoneNumberOptional: {
+    nb: "Telefonnummer (valgfritt)",
+    nn: "Telefonnummer (valgfritt)",
+    en: "Phone number (optional)",
+    sv: "Telefonnummer (valfritt)",
+  },
   countryCodeLabel: {
     nb: "Landskode",
     nn: "Landskode",