@dnb/eufemia 10.48.0 → 10.50.0

package/extensions/forms/Field/PhoneNumber/PhoneNumber.js.map

@@ -1 +1 @@
-{"version":3,"file":"PhoneNumber.js","names":["React","useMemo","useContext","useCallback","Autocomplete","Flex","classnames","countries","StringField","FieldBlock","useFieldProps","pickSpacingProps","SharedContext","getCountryData","makeCountryFilterSet","useErrorMessage","useTranslation","defaultCountryCode","defaultPlaceholder","defaultMask","PhoneNumber","props","_sharedContext$locale","_countryCodeRef$curre","sharedContext","translations","lang","locale","split","countryCodeRef","useRef","emptyValue","numberRef","dataRef","langRef","wasFilled","errorMessages","path","required","errorRequired","pattern","validateRequired","value","_ref","isChanged","error","countryCode","phoneNumber","splitValue","prevCountryCodeRef","current","undefined","schema","_props$schema","type","defaultProps","preparedProps","_objectSpread","fromExternal","toEvent","className","countryCodeFieldClassName","numberFieldClassName","countryCodePlaceholder","placeholder","countryCodeLabel","label","numberMask","ccFilter","info","warning","hasError","disabled","width","help","validateInitially","continuousValidation","validateUnchanged","omitCountryCodeField","setHasFocus","handleChange","onCountryCodeChange","onNumberChange","filterCountries","external","updateCurrentDataSet","filter","country","formatCountryCode","cdc","sort","makeObject","getEventValues","arguments","length","callOnChange","_ref2","eventValues","joinValue","callOnBlurOrFocus","hasFocus","handleCountryCodeChange","_ref3","_data$selectedKey","data","selectedKey","trim","handleNumberChange","handleOnBlur","handleOnFocus","handleCountryCodeFocus","_ref4","updateData","onTypeHandler","_ref5","_event$nativeEvent","revalidateInputValue","event","nativeEvent","cdcVal","test","find","_ref6","window","requestAnimationFrame","isDefault","includes","createElement","_extends","Horizontal","align","mode","label_direction","status","on_focus","on_blur","on_change","on_type","independent_width","search_numbers","keep_selection","autoComplete","no_animation","noAnimation","stretch","layout","mask","Array","fill","onFocus","onBlur","onChange","inputMode","_country$i18n$lang","selected_value","iso","content","i18n","en","match","slice","array","Boolean","join","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/PhoneNumber/PhoneNumber.tsx"],"sourcesContent":["import React, { useMemo, useContext, useCallback } from 'react'\nimport { Autocomplete, Flex } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport classnames from 'classnames'\nimport countries, {\n  type CountryLang,\n  type CountryType,\n} from '../../constants/countries'\nimport StringField, { Props as StringFieldProps } from '../String'\nimport FieldBlock from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport {\n  FieldHelpProps,\n  FieldPropsWithExtraValue,\n  AllJSONSchemaVersions,\n} from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport SharedContext from '../../../../shared/Context'\nimport {\n  CountryFilterSet,\n  getCountryData,\n  makeCountryFilterSet,\n} from '../SelectCountry'\nimport useErrorMessage from '../../hooks/useErrorMessage'\nimport useTranslation from '../../hooks/useTranslation'\nimport { DrawerListDataObject } from '../../../../fragments/DrawerList'\n\nexport type Props = FieldHelpProps &\n  FieldPropsWithExtraValue<\n    string,\n    { country: string; phone: string },\n    undefined | string\n  > & {\n    countryCodeFieldClassName?: string\n    numberFieldClassName?: string\n    countryCodePlaceholder?: string\n    countryCodeLabel?: string\n    numberMask?: InputMaskedProps['mask']\n    pattern?: StringFieldProps['pattern']\n    width?: 'large' | 'stretch'\n    omitCountryCodeField?: boolean\n    onCountryCodeChange?: (value: string | undefined) => void\n    onNumberChange?: (value: string | undefined) => void\n    countries?: CountryFilterSet\n\n    /**\n     * For internal use only.\n     *\n     * @param country\n     * @returns boolean\n     */\n    filterCountries?: (country: CountryType) => boolean\n\n    /**\n     * For internal testing purposes\n     */\n    noAnimation?: boolean\n  }\n\n// Important for the default value to be defined here, and not after the useFieldProps call, to avoid the UI jumping\n// back to +47 once the user empty the field so handleChange send out undefined.\nconst defaultCountryCode = '+47'\nconst defaultPlaceholder = '00 00 00 00'\nconst defaultMask = [\n  /\\d/,\n  /\\d/,\n  ' ',\n  /\\d/,\n  /\\d/,\n  ' ',\n  /\\d/,\n  /\\d/,\n  ' ',\n  /\\d/,\n  /\\d/,\n]\n\nfunction PhoneNumber(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const translations = useTranslation()\n  const lang = sharedContext.locale?.split('-')[0] as CountryLang\n\n  const countryCodeRef = React.useRef<Props['value']>(props?.emptyValue)\n  const numberRef = React.useRef<Props['value']>(props?.emptyValue)\n  const dataRef = React.useRef<Array<DrawerListDataObject>>(null)\n  const langRef = React.useRef<string>(lang)\n  const wasFilled = React.useRef<boolean>(false)\n\n  const errorMessages = useErrorMessage(props.path, props.errorMessages, {\n    required: translations.PhoneNumber.errorRequired,\n    pattern: translations.PhoneNumber.errorRequired,\n  })\n\n  const validateRequired = useCallback(\n    (value: string, { required, isChanged, error }) => {\n      if (required) {\n        const [countryCode, phoneNumber] = splitValue(value)\n\n        if (countryCode !== prevCountryCodeRef.current) {\n          if (countryCode) {\n            prevCountryCodeRef.current = countryCode\n          }\n          return undefined\n        }\n\n        if (isChanged && !phoneNumber) {\n          return error\n        }\n      }\n\n      return undefined\n    },\n    []\n  )\n\n  const schema = useMemo<AllJSONSchemaVersions>(\n    () =>\n      props.schema ?? {\n        type: 'string',\n        pattern: props.pattern,\n      },\n    [props.schema, props.pattern]\n  )\n  const defaultProps: Partial<Props> = {\n    schema,\n    errorMessages,\n  }\n  const preparedProps: Props = {\n    ...props,\n    ...defaultProps,\n    validateRequired,\n    fromExternal,\n    toEvent,\n  }\n\n  const {\n    value,\n    className,\n    countryCodeFieldClassName,\n    numberFieldClassName,\n    countryCodePlaceholder,\n    placeholder,\n    countryCodeLabel,\n    label = translations.PhoneNumber.label,\n    numberMask,\n    countries: ccFilter = 'Prioritized',\n    emptyValue,\n    info,\n    warning,\n    error,\n    hasError,\n    disabled,\n    width = 'large',\n    help,\n    required,\n    validateInitially,\n    continuousValidation,\n    validateUnchanged,\n    omitCountryCodeField,\n    setHasFocus,\n    handleChange,\n    onCountryCodeChange,\n    onNumberChange,\n    filterCountries = ccFilter !== 'Prioritized'\n      ? makeCountryFilterSet(ccFilter)\n      : undefined,\n  } = useFieldProps(preparedProps)\n\n  function fromExternal(external: string) {\n    const [, phoneNumber] = splitValue(external)\n    if (!phoneNumber && !props.omitCountryCodeField) {\n      return countryCodeRef.current\n    }\n    return external\n  }\n\n  function toEvent(value: string) {\n    const [, phoneNumber] = splitValue(value)\n    if (!phoneNumber) {\n      return emptyValue\n    }\n    return value\n  }\n\n  const updateCurrentDataSet = useCallback(() => {\n    dataRef.current = getCountryData({\n      lang,\n      filter:\n        // Make sure the whole cc list is displayed when cc filter is set to specific region\n        ccFilter === 'Prioritized' && !wasFilled.current\n          ? (country) =>\n              `${formatCountryCode(country.cdc)}` ===\n              countryCodeRef.current\n          : filterCountries,\n      sort: ccFilter as Extract<CountryFilterSet, 'Prioritized'>,\n      makeObject,\n    })\n  }, [lang, filterCountries, ccFilter])\n\n  const getEventValues = useCallback(\n    ({\n      countryCode = countryCodeRef.current || emptyValue,\n      phoneNumber = numberRef.current || emptyValue,\n    } = {}) => {\n      return {\n        ...(!omitCountryCodeField ? { countryCode } : {}),\n        phoneNumber,\n      }\n    },\n    [omitCountryCodeField, emptyValue]\n  )\n\n  const callOnChange = useCallback(\n    ({ countryCode = undefined, phoneNumber = undefined }) => {\n      const eventValues = getEventValues({ countryCode, phoneNumber })\n      handleChange(\n        joinValue([eventValues.countryCode, eventValues.phoneNumber]),\n        eventValues\n      )\n    },\n    [getEventValues, handleChange]\n  )\n\n  const callOnBlurOrFocus = useCallback(\n    (hasFocus: boolean) => {\n      setHasFocus(hasFocus, undefined, getEventValues())\n    },\n    [setHasFocus, getEventValues]\n  )\n\n  /**\n   * We do not process the whole country list at the first render.\n   * Only when the Autocomplete opens (focus).\n   * To achieve this, we use memo instead of effect to update refs in sync.\n   *\n   * We set or update the data list depending on if the countrycode changes or lang changes.\n   * We then update countryCode and phoneNumber when value changes.\n   */\n  useMemo(() => {\n    const [countryCode, phoneNumber] = splitValue(props.value || value)\n    numberRef.current = phoneNumber\n\n    if (lang !== langRef.current || !wasFilled.current) {\n      if (!countryCodeRef.current || countryCode) {\n        countryCodeRef.current = countryCode || defaultCountryCode\n      }\n      langRef.current = lang\n\n      updateCurrentDataSet()\n    }\n  }, [value, props.value, lang, updateCurrentDataSet])\n\n  const prevCountryCodeRef = React.useRef(countryCodeRef.current)\n\n  const handleCountryCodeChange = useCallback(\n    ({ data }: { data: { selectedKey: string } }) => {\n      const countryCode = (countryCodeRef.current =\n        data?.selectedKey?.trim() || emptyValue)\n\n      callOnChange({ countryCode })\n      onCountryCodeChange?.(countryCode)\n    },\n    [emptyValue, callOnChange, onCountryCodeChange]\n  )\n\n  const handleNumberChange = useCallback(\n    (value: string) => {\n      const phoneNumber = (numberRef.current = value || emptyValue)\n\n      callOnChange({ phoneNumber })\n      onNumberChange?.(phoneNumber)\n    },\n    [emptyValue, callOnChange, onNumberChange]\n  )\n\n  const handleOnBlur = useCallback(() => {\n    callOnBlurOrFocus(false)\n  }, [callOnBlurOrFocus])\n\n  const handleOnFocus = useCallback(() => {\n    callOnBlurOrFocus(true)\n  }, [callOnBlurOrFocus])\n\n  const handleCountryCodeFocus = useCallback(\n    ({ updateData }) => {\n      if (!wasFilled.current) {\n        wasFilled.current = true\n        updateCurrentDataSet()\n        updateData(dataRef.current)\n      }\n      handleOnFocus()\n    },\n    [handleOnFocus, updateCurrentDataSet]\n  )\n\n  const onTypeHandler = useCallback(\n    ({ value, updateData, revalidateInputValue, event }) => {\n      // Handle browser autofill/autocomplete\n      if (typeof event?.nativeEvent?.data === 'undefined') {\n        const cdcVal = /\\+\\d{1,3}\\s{1}\\d+/.test(value)\n          ? splitValue(value)[0]\n          : value\n        const country = countries.find(({ cdc }) => cdc === cdcVal)\n        if (country?.cdc) {\n          const countryCode = (countryCodeRef.current = formatCountryCode(\n            country.cdc\n          ))\n\n          updateCurrentDataSet()\n          updateData(dataRef.current)\n          callOnChange({ countryCode })\n\n          // To ensure correct input value,\n          // regardless if there is changed data before or not.\n          window.requestAnimationFrame(() => {\n            revalidateInputValue()\n          })\n        }\n      }\n    },\n    [callOnChange, updateCurrentDataSet]\n  )\n\n  const isDefault = countryCodeRef.current?.includes(defaultCountryCode)\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-phone-number', className)}\n      width={omitCountryCodeField ? undefined : width}\n      info={info}\n      warning={warning}\n      error={error}\n      disabled={disabled}\n      {...pickSpacingProps(props)}\n    >\n      <Flex.Horizontal align=\"flex-end\">\n        {!omitCountryCodeField && (\n          <Autocomplete\n            className={classnames(\n              'dnb-forms-field-phone-number__country-code',\n              countryCodeFieldClassName\n            )}\n            mode=\"async\"\n            placeholder={countryCodePlaceholder}\n            label_direction=\"vertical\"\n            label={\n              countryCodeLabel ?? translations.PhoneNumber.countryCodeLabel\n            }\n            data={dataRef.current}\n            value={countryCodeRef.current}\n            status={hasError ? 'error' : undefined}\n            disabled={disabled}\n            on_focus={handleCountryCodeFocus}\n            on_blur={handleOnBlur}\n            on_change={handleCountryCodeChange}\n            on_type={onTypeHandler}\n            independent_width\n            search_numbers\n            keep_selection\n            autoComplete=\"tel-country-code\"\n            no_animation={props.noAnimation}\n            stretch={width === 'stretch'}\n          />\n        )}\n\n        <StringField\n          className={classnames(\n            'dnb-forms-field-phone-number__number',\n            numberFieldClassName\n          )}\n          type=\"tel\"\n          autoComplete=\"tel-national\"\n          emptyValue={emptyValue}\n          layout=\"vertical\"\n          label={label}\n          placeholder={\n            placeholder ?? (isDefault ? defaultPlaceholder : undefined)\n          }\n          mask={\n            numberMask ?? (isDefault ? defaultMask : Array(12).fill(/\\d/))\n          }\n          onFocus={handleOnFocus}\n          onBlur={handleOnBlur}\n          onChange={handleNumberChange}\n          value={numberRef.current}\n          info={info}\n          warning={warning}\n          error={error}\n          disabled={disabled}\n          width={omitCountryCodeField ? 'medium' : 'stretch'}\n          help={help}\n          required={required}\n          errorMessages={errorMessages}\n          validateInitially={validateInitially}\n          continuousValidation={continuousValidation}\n          validateUnchanged={validateUnchanged}\n          inputMode=\"tel\"\n        />\n      </Flex.Horizontal>\n    </FieldBlock>\n  )\n}\n\nfunction makeObject(country: CountryType, lang: string) {\n  return {\n    selectedKey: formatCountryCode(country.cdc),\n    selected_value: `${country.iso} (${formatCountryCode(country.cdc)})`,\n    content: `${formatCountryCode(country.cdc)} ${\n      country.i18n[lang] ?? country.i18n.en\n    }`,\n  }\n}\n\nfunction formatCountryCode(value: string) {\n  return `+${value}`\n}\n\nfunction splitValue(value: string) {\n  return (\n    typeof value === 'string'\n      ? value.match(/^(\\+[^ ]+)? ?(.*)$/)\n      : [undefined, '', '']\n  ).slice(1)\n}\n\nfunction joinValue(array: Array<string>) {\n  return array.filter(Boolean).join(' ')\n}\n\nPhoneNumber._supportsSpacingProps = true\nexport default PhoneNumber\n"],"mappings":"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"}
+{"version":3,"file":"PhoneNumber.js","names":["React","useMemo","useContext","useCallback","Autocomplete","Flex","classnames","countries","StringField","FieldBlock","useFieldProps","pickSpacingProps","SharedContext","countryFilter","getCountryData","useErrorMessage","useTranslation","defaultCountryCode","defaultPlaceholder","defaultMask","PhoneNumber","props","_sharedContext$locale","_countryCodeRef$curre","sharedContext","translations","lang","locale","split","countryCodeRef","useRef","emptyValue","numberRef","dataRef","langRef","wasFilled","errorMessages","path","required","errorRequired","pattern","validateRequired","value","_ref","isChanged","error","countryCode","phoneNumber","splitValue","prevCountryCodeRef","current","undefined","schema","_props$schema","type","defaultProps","preparedProps","_objectSpread","fromExternal","toEvent","className","countryCodeFieldClassName","numberFieldClassName","countryCodePlaceholder","placeholder","countryCodeLabel","label","numberMask","ccFilter","info","warning","hasError","disabled","width","help","validateInitially","continuousValidation","validateUnchanged","omitCountryCodeField","setHasFocus","handleChange","onCountryCodeChange","onNumberChange","filterCountries","external","filter","country","updateCurrentDataSet","formatCountryCode","cdc","sort","makeObject","getEventValues","arguments","length","callOnChange","_ref2","eventValues","joinValue","callOnBlurOrFocus","hasFocus","handleCountryCodeChange","_ref3","_data$selectedKey","data","selectedKey","trim","handleNumberChange","handleOnBlur","handleOnFocus","handleCountryCodeFocus","_ref4","updateData","onTypeHandler","_ref5","_event$nativeEvent","revalidateInputValue","event","nativeEvent","cdcVal","test","find","_ref6","window","requestAnimationFrame","isDefault","includes","createElement","_extends","Horizontal","align","mode","label_direction","status","on_focus","on_blur","on_change","on_type","independent_width","search_numbers","keep_selection","autoComplete","no_animation","noAnimation","stretch","layout","mask","Array","fill","onFocus","onBlur","onChange","inputMode","_country$i18n$lang","selected_value","iso","content","i18n","en","match","slice","array","Boolean","join","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/PhoneNumber/PhoneNumber.tsx"],"sourcesContent":["import React, { useMemo, useContext, useCallback } from 'react'\nimport { Autocomplete, Flex } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport classnames from 'classnames'\nimport countries, {\n  type CountryLang,\n  type CountryType,\n} from '../../constants/countries'\nimport StringField, { Props as StringFieldProps } from '../String'\nimport FieldBlock from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport {\n  FieldHelpProps,\n  FieldPropsWithExtraValue,\n  AllJSONSchemaVersions,\n} from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport SharedContext from '../../../../shared/Context'\nimport {\n  countryFilter,\n  CountryFilterSet,\n  getCountryData,\n} from '../SelectCountry'\nimport useErrorMessage from '../../hooks/useErrorMessage'\nimport useTranslation from '../../hooks/useTranslation'\nimport { DrawerListDataObject } from '../../../../fragments/DrawerList'\n\nexport type Props = FieldHelpProps &\n  FieldPropsWithExtraValue<\n    string,\n    { country: string; phone: string },\n    undefined | string\n  > & {\n    countryCodeFieldClassName?: string\n    numberFieldClassName?: string\n    countryCodePlaceholder?: string\n    countryCodeLabel?: string\n    numberMask?: InputMaskedProps['mask']\n    pattern?: StringFieldProps['pattern']\n    width?: 'large' | 'stretch'\n    omitCountryCodeField?: boolean\n    onCountryCodeChange?: (value: string | undefined) => void\n    onNumberChange?: (value: string | undefined) => void\n\n    /**\n     * Defines the countries to filter. Can be `Scandinavia`, `Nordic`, `Europe` or `Prioritized`.\n     * Defaults to `Prioritized`.\n     */\n    countries?: CountryFilterSet\n\n    /**\n     * Use this prop to filter out certain countries. The function receives the country object and should return a boolean. Returning `false` will omit the country.\n     */\n    filterCountries?: (country: CountryType) => boolean\n\n    /**\n     * For internal testing purposes\n     */\n    noAnimation?: boolean\n  }\n\n// Important for the default value to be defined here, and not after the useFieldProps call, to avoid the UI jumping\n// back to +47 once the user empty the field so handleChange send out undefined.\nconst defaultCountryCode = '+47'\nconst defaultPlaceholder = '00 00 00 00'\nconst defaultMask = [\n  /\\d/,\n  /\\d/,\n  ' ',\n  /\\d/,\n  /\\d/,\n  ' ',\n  /\\d/,\n  /\\d/,\n  ' ',\n  /\\d/,\n  /\\d/,\n]\n\nfunction PhoneNumber(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const translations = useTranslation()\n  const lang = sharedContext.locale?.split('-')[0] as CountryLang\n\n  const countryCodeRef = React.useRef<Props['value']>(props?.emptyValue)\n  const numberRef = React.useRef<Props['value']>(props?.emptyValue)\n  const dataRef = React.useRef<Array<DrawerListDataObject>>(null)\n  const langRef = React.useRef<string>(lang)\n  const wasFilled = React.useRef<boolean>(false)\n\n  const errorMessages = useErrorMessage(props.path, props.errorMessages, {\n    required: translations.PhoneNumber.errorRequired,\n    pattern: translations.PhoneNumber.errorRequired,\n  })\n\n  const validateRequired = useCallback(\n    (value: string, { required, isChanged, error }) => {\n      if (required) {\n        const [countryCode, phoneNumber] = splitValue(value)\n\n        if (countryCode !== prevCountryCodeRef.current) {\n          if (countryCode) {\n            prevCountryCodeRef.current = countryCode\n          }\n          return undefined\n        }\n\n        if (isChanged && !phoneNumber) {\n          return error\n        }\n      }\n\n      return undefined\n    },\n    []\n  )\n\n  const schema = useMemo<AllJSONSchemaVersions>(\n    () =>\n      props.schema ?? {\n        type: 'string',\n        pattern: props.pattern,\n      },\n    [props.schema, props.pattern]\n  )\n  const defaultProps: Partial<Props> = {\n    schema,\n    errorMessages,\n  }\n  const preparedProps: Props = {\n    ...props,\n    ...defaultProps,\n    validateRequired,\n    fromExternal,\n    toEvent,\n  }\n\n  const {\n    value,\n    className,\n    countryCodeFieldClassName,\n    numberFieldClassName,\n    countryCodePlaceholder,\n    placeholder,\n    countryCodeLabel,\n    label = translations.PhoneNumber.label,\n    numberMask,\n    countries: ccFilter = 'Prioritized',\n    emptyValue,\n    info,\n    warning,\n    error,\n    hasError,\n    disabled,\n    width = 'large',\n    help,\n    required,\n    validateInitially,\n    continuousValidation,\n    validateUnchanged,\n    omitCountryCodeField,\n    setHasFocus,\n    handleChange,\n    onCountryCodeChange,\n    onNumberChange,\n    filterCountries,\n  } = useFieldProps(preparedProps)\n\n  function fromExternal(external: string) {\n    const [, phoneNumber] = splitValue(external)\n    if (!phoneNumber && !props.omitCountryCodeField) {\n      return countryCodeRef.current\n    }\n    return external\n  }\n\n  function toEvent(value: string) {\n    const [, phoneNumber] = splitValue(value)\n    if (!phoneNumber) {\n      return emptyValue\n    }\n    return value\n  }\n\n  const filter = useCallback(\n    (country: CountryType) => {\n      return countryFilter(country, filterCountries, ccFilter)\n    },\n    [ccFilter, filterCountries]\n  )\n\n  const updateCurrentDataSet = useCallback(() => {\n    dataRef.current = getCountryData({\n      lang,\n      filter:\n        // Make sure the whole cc list is displayed when cc filter is set to specific region\n        ccFilter === 'Prioritized' && !wasFilled.current\n          ? (country) =>\n              `${formatCountryCode(country.cdc)}` ===\n              countryCodeRef.current\n          : filter,\n      sort: ccFilter as Extract<CountryFilterSet, 'Prioritized'>,\n      makeObject,\n    })\n  }, [lang, filter, ccFilter])\n\n  const getEventValues = useCallback(\n    ({\n      countryCode = countryCodeRef.current || emptyValue,\n      phoneNumber = numberRef.current || emptyValue,\n    } = {}) => {\n      return {\n        ...(!omitCountryCodeField ? { countryCode } : {}),\n        phoneNumber,\n      }\n    },\n    [omitCountryCodeField, emptyValue]\n  )\n\n  const callOnChange = useCallback(\n    ({ countryCode = undefined, phoneNumber = undefined }) => {\n      const eventValues = getEventValues({ countryCode, phoneNumber })\n      handleChange(\n        joinValue([eventValues.countryCode, eventValues.phoneNumber]),\n        eventValues\n      )\n    },\n    [getEventValues, handleChange]\n  )\n\n  const callOnBlurOrFocus = useCallback(\n    (hasFocus: boolean) => {\n      setHasFocus(hasFocus, undefined, getEventValues())\n    },\n    [setHasFocus, getEventValues]\n  )\n\n  /**\n   * We do not process the whole country list at the first render.\n   * Only when the Autocomplete opens (focus).\n   * To achieve this, we use memo instead of effect to update refs in sync.\n   *\n   * We set or update the data list depending on if the countrycode changes or lang changes.\n   * We then update countryCode and phoneNumber when value changes.\n   */\n  useMemo(() => {\n    const [countryCode, phoneNumber] = splitValue(props.value || value)\n    numberRef.current = phoneNumber\n\n    if (lang !== langRef.current || !wasFilled.current) {\n      if (!countryCodeRef.current || countryCode) {\n        countryCodeRef.current = countryCode || defaultCountryCode\n      }\n      langRef.current = lang\n\n      updateCurrentDataSet()\n    }\n  }, [value, props.value, lang, updateCurrentDataSet])\n\n  const prevCountryCodeRef = React.useRef(countryCodeRef.current)\n\n  const handleCountryCodeChange = useCallback(\n    ({ data }: { data: { selectedKey: string } }) => {\n      const countryCode = (countryCodeRef.current =\n        data?.selectedKey?.trim() || emptyValue)\n\n      callOnChange({ countryCode })\n      onCountryCodeChange?.(countryCode)\n    },\n    [emptyValue, callOnChange, onCountryCodeChange]\n  )\n\n  const handleNumberChange = useCallback(\n    (value: string) => {\n      const phoneNumber = (numberRef.current = value || emptyValue)\n\n      callOnChange({ phoneNumber })\n      onNumberChange?.(phoneNumber)\n    },\n    [emptyValue, callOnChange, onNumberChange]\n  )\n\n  const handleOnBlur = useCallback(() => {\n    callOnBlurOrFocus(false)\n  }, [callOnBlurOrFocus])\n\n  const handleOnFocus = useCallback(() => {\n    callOnBlurOrFocus(true)\n  }, [callOnBlurOrFocus])\n\n  const handleCountryCodeFocus = useCallback(\n    ({ updateData }) => {\n      if (!wasFilled.current) {\n        wasFilled.current = true\n        updateCurrentDataSet()\n        updateData(dataRef.current)\n      }\n      handleOnFocus()\n    },\n    [handleOnFocus, updateCurrentDataSet]\n  )\n\n  const onTypeHandler = useCallback(\n    ({ value, updateData, revalidateInputValue, event }) => {\n      // Handle browser autofill/autocomplete\n      if (typeof event?.nativeEvent?.data === 'undefined') {\n        const cdcVal = /\\+\\d{1,3}\\s{1}\\d+/.test(value)\n          ? splitValue(value)[0]\n          : value\n        const country = countries.find(({ cdc }) => cdc === cdcVal)\n        if (country?.cdc) {\n          const countryCode = (countryCodeRef.current = formatCountryCode(\n            country.cdc\n          ))\n\n          updateCurrentDataSet()\n          updateData(dataRef.current)\n          callOnChange({ countryCode })\n\n          // To ensure correct input value,\n          // regardless if there is changed data before or not.\n          window.requestAnimationFrame(() => {\n            revalidateInputValue()\n          })\n        }\n      }\n    },\n    [callOnChange, updateCurrentDataSet]\n  )\n\n  const isDefault = countryCodeRef.current?.includes(defaultCountryCode)\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-phone-number', className)}\n      width={omitCountryCodeField ? undefined : width}\n      info={info}\n      warning={warning}\n      error={error}\n      disabled={disabled}\n      {...pickSpacingProps(props)}\n    >\n      <Flex.Horizontal align=\"flex-end\">\n        {!omitCountryCodeField && (\n          <Autocomplete\n            className={classnames(\n              'dnb-forms-field-phone-number__country-code',\n              countryCodeFieldClassName\n            )}\n            mode=\"async\"\n            placeholder={countryCodePlaceholder}\n            label_direction=\"vertical\"\n            label={\n              countryCodeLabel ?? translations.PhoneNumber.countryCodeLabel\n            }\n            data={dataRef.current}\n            value={countryCodeRef.current}\n            status={hasError ? 'error' : undefined}\n            disabled={disabled}\n            on_focus={handleCountryCodeFocus}\n            on_blur={handleOnBlur}\n            on_change={handleCountryCodeChange}\n            on_type={onTypeHandler}\n            independent_width\n            search_numbers\n            keep_selection\n            autoComplete=\"tel-country-code\"\n            no_animation={props.noAnimation}\n            stretch={width === 'stretch'}\n          />\n        )}\n\n        <StringField\n          className={classnames(\n            'dnb-forms-field-phone-number__number',\n            numberFieldClassName\n          )}\n          type=\"tel\"\n          autoComplete=\"tel-national\"\n          emptyValue={emptyValue}\n          layout=\"vertical\"\n          label={label}\n          placeholder={\n            placeholder ?? (isDefault ? defaultPlaceholder : undefined)\n          }\n          mask={\n            numberMask ?? (isDefault ? defaultMask : Array(12).fill(/\\d/))\n          }\n          onFocus={handleOnFocus}\n          onBlur={handleOnBlur}\n          onChange={handleNumberChange}\n          value={numberRef.current}\n          info={info}\n          warning={warning}\n          error={error}\n          disabled={disabled}\n          width={omitCountryCodeField ? 'medium' : 'stretch'}\n          help={help}\n          required={required}\n          errorMessages={errorMessages}\n          validateInitially={validateInitially}\n          continuousValidation={continuousValidation}\n          validateUnchanged={validateUnchanged}\n          inputMode=\"tel\"\n        />\n      </Flex.Horizontal>\n    </FieldBlock>\n  )\n}\n\nfunction makeObject(country: CountryType, lang: string) {\n  return {\n    selectedKey: formatCountryCode(country.cdc),\n    selected_value: `${country.iso} (${formatCountryCode(country.cdc)})`,\n    content: `${formatCountryCode(country.cdc)} ${\n      country.i18n[lang] ?? country.i18n.en\n    }`,\n  }\n}\n\nfunction formatCountryCode(value: string) {\n  return `+${value}`\n}\n\nfunction splitValue(value: string) {\n  return (\n    typeof value === 'string'\n      ? value.match(/^(\\+[^ ]+)? ?(.*)$/)\n      : [undefined, '', '']\n  ).slice(1)\n}\n\nfunction joinValue(array: Array<string>) {\n  return array.filter(Boolean).join(' ')\n}\n\nPhoneNumber._supportsSpacingProps = true\nexport default PhoneNumber\n"],"mappings":"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"}

package/extensions/forms/Field/PhoneNumber/PhoneNumberDocs.d.ts

@@ -1,3 +1,4 @@
 import { PropertiesTableProps } from '../../../../shared/types';
+export declare const phoneNumberSpecificProperties: PropertiesTableProps;
 export declare const phoneNumberSpecificEvents: PropertiesTableProps;
 export declare const phoneNumberGeneralEvents: PropertiesTableProps;

package/extensions/forms/Field/PhoneNumber/PhoneNumberDocs.js

@@ -1,7 +1,69 @@
 import { getFieldEventsWithTypes } from '../FieldDocs';
+export const phoneNumberSpecificProperties = {
+  countries: {
+    doc: 'List only a certain set of countries: `Scandinavia`, `Nordic`, `Europe` or `Prioritized`(all countries [sorted by priority](/uilib/extensions/forms/feature-fields/SelectCountry/#filter-or-prioritize-country-listing)). Defaults to `Prioritized`.',
+    type: 'string',
+    status: 'optional'
+  },
+  filterCountries: {
+    doc: 'Use this prop to filter out certain countries. The function receives the country object and should return a boolean. Returning `false` will omit the country.',
+    type: 'function',
+    status: 'optional'
+  },
+  pattern: {
+    doc: 'Validation based on regex pattern for the number field e.g. `pattern="^[49]+"`.',
+    type: 'string',
+    status: 'optional'
+  },
+  help: {
+    doc: 'Provide a help button. Object consisting of `title` and `content`.',
+    type: 'object',
+    status: 'optional'
+  },
+  omitCountryCodeField: {
+    doc: 'If `true` is given, then everything related to country code is removed.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  countryCodeFieldClassName: {
+    doc: 'Class name for the country code component.',
+    type: 'string',
+    status: 'optional'
+  },
+  numberFieldClassName: {
+    doc: 'Class name for the number component.',
+    type: 'string',
+    status: 'optional'
+  },
+  countryCodePlaceholder: {
+    doc: 'Placeholder for the country code field.',
+    type: 'string',
+    status: 'optional'
+  },
+  countryCodeLabel: {
+    doc: 'Label to show above / before the country code field.',
+    type: 'string',
+    status: 'optional'
+  },
+  numberMask: {
+    doc: 'See property `mask` of the [InputMasked](/uilib/components/input-masked/properties) component.',
+    type: 'Various',
+    status: 'optional'
+  },
+  width: {
+    doc: '`large` for predefined standard width, `stretch` for fill available width.',
+    type: 'string | false',
+    status: 'optional'
+  },
+  '[Space](/uilib/layout/space/properties)': {
+    doc: 'Spacing properties like `top` or `bottom` are supported.',
+    type: ['string', 'object'],
+    status: 'optional'
+  }
+};
 export const phoneNumberSpecificEvents = {
   onCountryCodeChange: {
-    doc: ' Callback on country code change.',
+    doc: 'Callback on country code change.',
     type: '(value?: string) => void',
     status: 'optional'
   },

package/extensions/forms/Field/PhoneNumber/PhoneNumberDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"PhoneNumberDocs.js","names":["getFieldEventsWithTypes","phoneNumberSpecificEvents","onCountryCodeChange","doc","type","status","onNumberChange","phoneNumberGeneralEvents","optional"],"sources":["../../../../../../src/extensions/forms/Field/PhoneNumber/PhoneNumberDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\nimport { getFieldEventsWithTypes } from '../FieldDocs'\n\nexport const phoneNumberSpecificEvents: PropertiesTableProps = {\n  onCountryCodeChange: {\n    doc: ' Callback on country code change.',\n    type: '(value?: string) => void',\n    status: 'optional',\n  },\n  onNumberChange: {\n    doc: 'Callback on phone number change.',\n    type: '(value?: string) => void',\n    status: 'optional',\n  },\n}\n\nexport const phoneNumberGeneralEvents = getFieldEventsWithTypes(\n  { type: 'string', optional: true },\n  { type: 'object' }\n)\n"],"mappings":"AACA,SAASA,uBAAuB,QAAQ,cAAc;AAEtD,OAAO,MAAMC,yBAA+C,GAAG;EAC7DC,mBAAmB,EAAE;IACnBC,GAAG,EAAE,mCAAmC;IACxCC,IAAI,EAAE,0BAA0B;IAChCC,MAAM,EAAE;EACV,CAAC;EACDC,cAAc,EAAE;IACdH,GAAG,EAAE,kCAAkC;IACvCC,IAAI,EAAE,0BAA0B;IAChCC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAME,wBAAwB,GAAGP,uBAAuB,CAC7D;EAAEI,IAAI,EAAE,QAAQ;EAAEI,QAAQ,EAAE;AAAK,CAAC,EAClC;EAAEJ,IAAI,EAAE;AAAS,CACnB,CAAC"}
+{"version":3,"file":"PhoneNumberDocs.js","names":["getFieldEventsWithTypes","phoneNumberSpecificProperties","countries","doc","type","status","filterCountries","pattern","help","omitCountryCodeField","countryCodeFieldClassName","numberFieldClassName","countryCodePlaceholder","countryCodeLabel","numberMask","width","phoneNumberSpecificEvents","onCountryCodeChange","onNumberChange","phoneNumberGeneralEvents","optional"],"sources":["../../../../../../src/extensions/forms/Field/PhoneNumber/PhoneNumberDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\nimport { getFieldEventsWithTypes } from '../FieldDocs'\n\nexport const phoneNumberSpecificProperties: PropertiesTableProps = {\n  countries: {\n    doc: 'List only a certain set of countries: `Scandinavia`, `Nordic`, `Europe` or `Prioritized`(all countries [sorted by priority](/uilib/extensions/forms/feature-fields/SelectCountry/#filter-or-prioritize-country-listing)). Defaults to `Prioritized`.',\n    type: 'string',\n    status: 'optional',\n  },\n  filterCountries: {\n    doc: 'Use this prop to filter out certain countries. The function receives the country object and should return a boolean. Returning `false` will omit the country.',\n    type: 'function',\n    status: 'optional',\n  },\n  pattern: {\n    doc: 'Validation based on regex pattern for the number field e.g. `pattern=\"^[49]+\"`.',\n    type: 'string',\n    status: 'optional',\n  },\n  help: {\n    doc: 'Provide a help button. Object consisting of `title` and `content`.',\n    type: 'object',\n    status: 'optional',\n  },\n  omitCountryCodeField: {\n    doc: 'If `true` is given, then everything related to country code is removed.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  countryCodeFieldClassName: {\n    doc: 'Class name for the country code component.',\n    type: 'string',\n    status: 'optional',\n  },\n  numberFieldClassName: {\n    doc: 'Class name for the number component.',\n    type: 'string',\n    status: 'optional',\n  },\n  countryCodePlaceholder: {\n    doc: 'Placeholder for the country code field.',\n    type: 'string',\n    status: 'optional',\n  },\n  countryCodeLabel: {\n    doc: 'Label to show above / before the country code field.',\n    type: 'string',\n    status: 'optional',\n  },\n  numberMask: {\n    doc: 'See property `mask` of the [InputMasked](/uilib/components/input-masked/properties) component.',\n    type: 'Various',\n    status: 'optional',\n  },\n  width: {\n    doc: '`large` for predefined standard width, `stretch` for fill available width.',\n    type: 'string | false',\n    status: 'optional',\n  },\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n\nexport const phoneNumberSpecificEvents: PropertiesTableProps = {\n  onCountryCodeChange: {\n    doc: 'Callback on country code change.',\n    type: '(value?: string) => void',\n    status: 'optional',\n  },\n  onNumberChange: {\n    doc: 'Callback on phone number change.',\n    type: '(value?: string) => void',\n    status: 'optional',\n  },\n}\n\nexport const phoneNumberGeneralEvents = getFieldEventsWithTypes(\n  { type: 'string', optional: true },\n  { type: 'object' }\n)\n"],"mappings":"AACA,SAASA,uBAAuB,QAAQ,cAAc;AAEtD,OAAO,MAAMC,6BAAmD,GAAG;EACjEC,SAAS,EAAE;IACTC,GAAG,EAAE,sPAAsP;IAC3PC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,eAAe,EAAE;IACfH,GAAG,EAAE,+JAA+J;IACpKC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV,CAAC;EACDE,OAAO,EAAE;IACPJ,GAAG,EAAE,iFAAiF;IACtFC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,IAAI,EAAE;IACJL,GAAG,EAAE,oEAAoE;IACzEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,oBAAoB,EAAE;IACpBN,GAAG,EAAE,yEAAyE;IAC9EC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDK,yBAAyB,EAAE;IACzBP,GAAG,EAAE,4CAA4C;IACjDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDM,oBAAoB,EAAE;IACpBR,GAAG,EAAE,sCAAsC;IAC3CC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDO,sBAAsB,EAAE;IACtBT,GAAG,EAAE,yCAAyC;IAC9CC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDQ,gBAAgB,EAAE;IAChBV,GAAG,EAAE,sDAAsD;IAC3DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDS,UAAU,EAAE;IACVX,GAAG,EAAE,gGAAgG;IACrGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDU,KAAK,EAAE;IACLZ,GAAG,EAAE,4EAA4E;IACjFC,IAAI,EAAE,gBAAgB;IACtBC,MAAM,EAAE;EACV,CAAC;EACD,yCAAyC,EAAE;IACzCF,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAMW,yBAA+C,GAAG;EAC7DC,mBAAmB,EAAE;IACnBd,GAAG,EAAE,kCAAkC;IACvCC,IAAI,EAAE,0BAA0B;IAChCC,MAAM,EAAE;EACV,CAAC;EACDa,cAAc,EAAE;IACdf,GAAG,EAAE,kCAAkC;IACvCC,IAAI,EAAE,0BAA0B;IAChCC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAMc,wBAAwB,GAAGnB,uBAAuB,CAC7D;EAAEI,IAAI,EAAE,QAAQ;EAAEgB,QAAQ,EAAE;AAAK,CAAC,EAClC;EAAEhB,IAAI,EAAE;AAAS,CACnB,CAAC"}

package/extensions/forms/Field/SelectCountry/SelectCountry.d.ts

@@ -2,19 +2,23 @@ import { type CountryType, type CountryLang } from '../../constants/countries';
 import { FieldBlockWidth, FieldHelpProps, FieldPropsWithExtraValue } from '../../types';
 export type CountryFilterSet = 'Scandinavia' | 'Nordic' | 'Europe' | 'Prioritized';
 export type Props = FieldHelpProps & FieldPropsWithExtraValue<string, CountryType, undefined | string> & {
+    /**
+     * Lists only the countries you want to show. Can be `Scandinavia`, `Nordic`, `Europe` or `Prioritized`.
+     * Defaults to `Prioritized`.
+     */
     countries?: CountryFilterSet;
-    width?: FieldBlockWidth;
     /**
-     * For internal use only.
-     *
-     * @param country
-     * @returns boolean
+     * Use this prop to filter out certain countries. The function receives the country object and should return a boolean. Returning `false` will omit the country.
      */
     filterCountries?: (country: CountryType) => boolean;
     /**
      * For internal testing purposes
      */
     noAnimation?: boolean;
+    /**
+     * The width of the component.
+     */
+    width?: FieldBlockWidth;
 };
 declare function SelectCountry(props: Props): import("react/jsx-runtime").JSX.Element;
 declare namespace SelectCountry {
@@ -35,5 +39,6 @@ export declare function getCountryData({ lang, filter, sort, makeObject, }?: Get
     selected_value?: string;
     content: string;
 }[];
+export declare function countryFilter(country: CountryType, filterCountries: (country: CountryType) => boolean, ccFilter: CountryFilterSet): boolean;
 export declare function makeCountryFilterSet(ccFilter: CountryFilterSet): (country: CountryType) => boolean;
 export default SelectCountry;

package/extensions/forms/Field/SelectCountry/SelectCountry.js

@@ -4,7 +4,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-import React, { useCallback, useContext, useMemo } from 'react';
+import React, { useCallback, useContext, useMemo, useRef } from 'react';
 import classnames from 'classnames';
 import SharedContext from '../../../../shared/Context';
 import { Autocomplete, HelpButton } from '../../../../components';
@@ -19,19 +19,24 @@ function SelectCountry(props) {
   const sharedContext = useContext(SharedContext);
   const translations = useTranslation().SelectCountry;
   const lang = (_sharedContext$locale = sharedContext.locale) === null || _sharedContext$locale === void 0 ? void 0 : _sharedContext$locale.split('-')[0];
-  const transformAdditionalArgs = (additionalArgs, value) => {
+  const getCountryObjectByIso = useCallback(value => {
     const country = countries.find(_ref => {
       let {
         iso
       } = _ref;
       return value === iso;
     });
+    if (country !== null && country !== void 0 && country.i18n) {
+      country['name'] = country.i18n[lang];
+    }
+    return country;
+  }, [lang]);
+  const provideAdditionalArgs = useCallback(value => {
+    const country = getCountryObjectByIso(value);
     if (country !== null && country !== void 0 && country.iso) {
       return country;
-    } else {
-      return additionalArgs;
     }
-  };
+  }, [getCountryObjectByIso]);
   const errorMessages = useErrorMessage(props.path, props.errorMessages, {
     required: translations.errorRequired
   });
@@ -39,7 +44,7 @@ function SelectCountry(props) {
     errorMessages
   };
   const preparedProps = _objectSpread(_objectSpread(_objectSpread({}, defaultProps), props), {}, {
-    transformAdditionalArgs
+    provideAdditionalArgs
   });
   const {
     className,
@@ -60,18 +65,21 @@ function SelectCountry(props) {
     handleChange,
     updateValue,
     forceUpdate,
-    filterCountries = ccFilter !== 'Prioritized' ? makeCountryFilterSet(ccFilter) : undefined
+    filterCountries
   } = useFieldProps(preparedProps);
-  const dataRef = React.useRef(null);
-  const langRef = React.useRef(lang);
-  const wasFilled = React.useRef(false);
+  const dataRef = useRef(null);
+  const langRef = useRef(lang);
+  const wasFilled = useRef(false);
+  const filter = useCallback(country => {
+    return countryFilter(country, filterCountries, ccFilter);
+  }, [ccFilter, filterCountries]);
   useMemo(() => {
     const isLangChange = lang !== langRef.current;
     if (isLangChange || !wasFilled.current) {
       langRef.current = lang;
       dataRef.current = getCountryData({
         lang,
-        filter: !wasFilled.current ? country => country.iso === value : filterCountries,
+        filter: !wasFilled.current ? country => country.iso === value : filter,
         sort: ccFilter
       });
       if (isLangChange && value && typeof window !== 'undefined') {
@@ -81,54 +89,49 @@ function SelectCountry(props) {
         });
       }
     }
-  }, [lang, filterCountries, ccFilter, updateValue, value]);
+  }, [lang, filter, ccFilter, updateValue, value]);
   const handleCountryChange = useCallback(_ref2 => {
     let {
       data
     } = _ref2;
     const newValue = data === null || data === void 0 ? void 0 : data.selectedKey;
-    const country = countries.find(_ref3 => {
-      let {
-        iso
-      } = _ref3;
-      return newValue === iso;
-    });
+    const country = getCountryObjectByIso(newValue);
     if (country !== null && country !== void 0 && country.iso) {
-      handleChange(country.iso);
+      handleChange(country.iso, country);
     }
-  }, [handleChange]);
+  }, [getCountryObjectByIso, handleChange]);
   const fillData = useCallback(() => {
     if (!wasFilled.current) {
       wasFilled.current = true;
       dataRef.current = getCountryData({
         lang: langRef.current,
-        filter: filterCountries,
+        filter,
         sort: ccFilter
       });
       forceUpdate();
     }
-  }, [ccFilter, filterCountries, forceUpdate]);
-  const onFocusHandler = useCallback(_ref4 => {
+  }, [ccFilter, filter, forceUpdate]);
+  const onFocusHandler = useCallback(_ref3 => {
     let {
       updateData
-    } = _ref4;
+    } = _ref3;
     fillData();
     updateData(dataRef.current);
     handleFocus();
   }, [fillData, handleFocus]);
-  const onTypeHandler = useCallback(_ref5 => {
+  const onTypeHandler = useCallback(_ref4 => {
     var _event$nativeEvent;
     let {
       value: currentValue,
       setHidden,
       event
-    } = _ref5;
+    } = _ref4;
     if (typeof (event === null || event === void 0 ? void 0 : (_event$nativeEvent = event.nativeEvent) === null || _event$nativeEvent === void 0 ? void 0 : _event$nativeEvent.data) === 'undefined') {
       const search = currentValue.toLowerCase();
-      const country = countries.find(_ref6 => {
+      const country = countries.find(_ref5 => {
         let {
           i18n
-        } = _ref6;
+        } = _ref5;
         return Object.values(i18n).some(s => s.toLowerCase().includes(search));
       });
       if (country !== null && country !== void 0 && country.iso) {
@@ -186,13 +189,13 @@ export function getCountryData() {
       return filter(country);
     }
     return !filter;
-  }).sort((_ref7, _ref8) => {
+  }).sort((_ref6, _ref7) => {
     let {
       i18n: a
-    } = _ref7;
+    } = _ref6;
     let {
       i18n: b
-    } = _ref8;
+    } = _ref7;
     if (sort === 'Prioritized') {
       const indexA = prioritizedCountries.indexOf(a['en']);
       const indexB = prioritizedCountries.indexOf(b['en']);
@@ -209,13 +212,36 @@ export function getCountryData() {
     return a[lang].localeCompare(b[lang]);
   }).map(country => makeObject(country, lang));
 }
+export function countryFilter(country, filterCountries, ccFilter) {
+  let result = true;
+  if (ccFilter !== 'Prioritized') {
+    switch (ccFilter) {
+      case 'Scandinavia':
+      case 'Nordic':
+        {
+          var _country$regions;
+          result = (_country$regions = country.regions) === null || _country$regions === void 0 ? void 0 : _country$regions.includes(ccFilter);
+          break;
+        }
+      case 'Europe':
+        {
+          result = country.continent.includes(ccFilter);
+          break;
+        }
+    }
+  }
+  if (result && filterCountries) {
+    result = filterCountries(country);
+  }
+  return result;
+}
 export function makeCountryFilterSet(ccFilter) {
   return country => {
-    var _country$regions;
+    var _country$regions2;
     switch (ccFilter) {
       case 'Scandinavia':
       case 'Nordic':
-        return (_country$regions = country.regions) === null || _country$regions === void 0 ? void 0 : _country$regions.includes(ccFilter);
+        return (_country$regions2 = country.regions) === null || _country$regions2 === void 0 ? void 0 : _country$regions2.includes(ccFilter);
       case 'Europe':
         return country.continent.includes(ccFilter);
     }

package/extensions/forms/Field/SelectCountry/SelectCountry.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectCountry.js","names":["React","useCallback","useContext","useMemo","classnames","SharedContext","Autocomplete","HelpButton","pickSpacingProps","countries","prioritizedCountries","useFieldProps","FieldBlock","useErrorMessage","useTranslation","SelectCountry","props","_sharedContext$locale","sharedContext","translations","lang","locale","split","transformAdditionalArgs","additionalArgs","value","country","find","_ref","iso","errorMessages","path","required","errorRequired","defaultProps","preparedProps","_objectSpread","className","placeholder","label","ccFilter","info","warning","error","hasError","disabled","width","help","htmlAttributes","handleFocus","handleBlur","handleChange","updateValue","forceUpdate","filterCountries","makeCountryFilterSet","undefined","dataRef","useRef","langRef","wasFilled","isLangChange","current","getCountryData","filter","sort","window","requestAnimationFrame","handleCountryChange","_ref2","data","newValue","selectedKey","_ref3","fillData","onFocusHandler","_ref4","updateData","onTypeHandler","_ref5","_event$nativeEvent","currentValue","setHidden","event","nativeEvent","search","toLowerCase","_ref6","i18n","Object","values","some","s","includes","createElement","_extends","label_direction","input_icon","on_show","on_focus","on_blur","on_change","on_type","stretch","status","show_submit_button","keep_selection","suffix","title","content","autoComplete","no_animation","noAnimation","makeObject","_country$i18n$lang","en","arguments","length","_ref7","_ref8","a","b","indexA","indexOf","indexB","priorityA","priorityB","localeCompare","map","_country$regions","regions","continent","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/SelectCountry/SelectCountry.tsx"],"sourcesContent":["import React, { useCallback, useContext, useMemo } from 'react'\nimport classnames from 'classnames'\nimport SharedContext from '../../../../shared/Context'\nimport { Autocomplete, HelpButton } from '../../../../components'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport countries, {\n  prioritizedCountries,\n  type CountryType,\n  type CountryLang,\n} from '../../constants/countries'\nimport { useFieldProps } from '../../hooks'\nimport {\n  FieldBlockWidth,\n  FieldHelpProps,\n  FieldPropsWithExtraValue,\n} from '../../types'\nimport FieldBlock from '../../FieldBlock'\nimport useErrorMessage from '../../hooks/useErrorMessage'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport type CountryFilterSet =\n  | 'Scandinavia'\n  | 'Nordic'\n  | 'Europe'\n  | 'Prioritized'\n\nexport type Props = FieldHelpProps &\n  FieldPropsWithExtraValue<string, CountryType, undefined | string> & {\n    countries?: CountryFilterSet\n\n    // Styling\n    width?: FieldBlockWidth\n\n    /**\n     * For internal use only.\n     *\n     * @param country\n     * @returns boolean\n     */\n    filterCountries?: (country: CountryType) => boolean\n\n    /**\n     * For internal testing purposes\n     */\n    noAnimation?: boolean\n  }\n\nfunction SelectCountry(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const translations = useTranslation().SelectCountry\n  const lang = sharedContext.locale?.split('-')[0] as CountryLang\n\n  const transformAdditionalArgs = (additionalArgs: CountryType, value) => {\n    const country = countries.find(({ iso }) => value === iso)\n    if (country?.iso) {\n      return country\n    } else {\n      return additionalArgs\n    }\n  }\n\n  const errorMessages = useErrorMessage(props.path, props.errorMessages, {\n    required: translations.errorRequired,\n  })\n\n  const defaultProps: Partial<Props> = {\n    errorMessages,\n  }\n  const preparedProps: Props = {\n    ...defaultProps,\n    ...props,\n    transformAdditionalArgs,\n  }\n\n  const {\n    className,\n    placeholder = translations.placeholder,\n    label = translations.label,\n    countries: ccFilter = 'Prioritized',\n    info,\n    warning,\n    error,\n    hasError,\n    disabled,\n    value,\n    width = 'large',\n    help,\n    htmlAttributes,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    updateValue,\n    forceUpdate,\n    filterCountries = ccFilter !== 'Prioritized'\n      ? makeCountryFilterSet(ccFilter)\n      : undefined,\n  } = useFieldProps(preparedProps)\n\n  const dataRef = React.useRef(null)\n  const langRef = React.useRef(lang)\n  const wasFilled = React.useRef(false)\n\n  /**\n   * We do not process the whole country list at the first render.\n   * Only when the Autocomplete opens (focus).\n   * To achieve this, we use memo instead of effect to update refs in sync.\n   *\n   * We set or update the data list depending on if the countrycode changes or lang changes.\n   * We then update data set when value changes.\n   */\n  useMemo(() => {\n    const isLangChange = lang !== langRef.current\n\n    if (isLangChange || !wasFilled.current) {\n      langRef.current = lang\n      dataRef.current = getCountryData({\n        lang,\n        filter: !wasFilled.current\n          ? (country) => country.iso === value\n          : filterCountries,\n        sort: ccFilter as Extract<CountryFilterSet, 'Prioritized'>,\n      })\n\n      // To force Autocomplete to re-evaluate the internal data\n      if (isLangChange && value && typeof window !== 'undefined') {\n        updateValue(null)\n        window.requestAnimationFrame(() => {\n          updateValue(value)\n        })\n      }\n    }\n  }, [lang, filterCountries, ccFilter, updateValue, value])\n\n  const handleCountryChange = useCallback(\n    ({ data }: { data: { selectedKey: string } }) => {\n      const newValue = data?.selectedKey\n      const country = countries.find(({ iso }) => newValue === iso)\n      if (country?.iso) {\n        handleChange(country.iso)\n      }\n    },\n    [handleChange]\n  )\n\n  const fillData = useCallback(() => {\n    if (!wasFilled.current) {\n      wasFilled.current = true\n      dataRef.current = getCountryData({\n        lang: langRef.current,\n        filter: filterCountries,\n        sort: ccFilter as Extract<CountryFilterSet, 'Prioritized'>,\n      })\n      forceUpdate()\n    }\n  }, [ccFilter, filterCountries, forceUpdate])\n\n  const onFocusHandler = useCallback(\n    ({ updateData }) => {\n      fillData()\n      updateData(dataRef.current)\n      handleFocus()\n    },\n    [fillData, handleFocus]\n  )\n\n  const onTypeHandler = useCallback(\n    ({ value: currentValue, setHidden, event }) => {\n      // Handle browser autofill/autocomplete\n      if (typeof event?.nativeEvent?.data === 'undefined') {\n        const search = currentValue.toLowerCase()\n        const country = countries.find(({ i18n }) =>\n          Object.values(i18n).some((s) => s.toLowerCase().includes(search))\n        )\n        if (country?.iso) {\n          setHidden()\n          handleChange(country.iso)\n        }\n      }\n    },\n    [handleChange]\n  )\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-select-country', className)}\n      width={width}\n      info={info}\n      warning={warning}\n      error={error}\n      {...pickSpacingProps(props)}\n    >\n      <Autocomplete\n        placeholder={placeholder}\n        label_direction=\"vertical\"\n        label={label}\n        input_icon={false}\n        data={dataRef.current}\n        value={typeof value === 'string' ? value : null}\n        disabled={disabled}\n        on_show={fillData}\n        on_focus={onFocusHandler}\n        on_blur={handleBlur}\n        on_change={handleCountryChange}\n        on_type={onTypeHandler}\n        stretch\n        status={hasError ? 'error' : undefined}\n        show_submit_button\n        keep_selection\n        suffix={\n          help ? (\n            <HelpButton title={help.title}>{help.content}</HelpButton>\n          ) : undefined\n        }\n        autoComplete=\"country-name\"\n        no_animation={props.noAnimation}\n        {...htmlAttributes}\n      />\n    </FieldBlock>\n  )\n}\n\ntype GetCountryData = {\n  lang?: CountryLang\n  filter?: Props['filterCountries']\n  sort?: Extract<CountryFilterSet, 'Prioritized'>\n  makeObject?: (\n    country: CountryType,\n    lang: string\n  ) => {\n    selectedKey: string\n    selected_value?: string\n    content: string\n  }\n}\n\nexport function getCountryData({\n  lang = 'nb',\n  filter = null,\n  sort = null,\n  makeObject = (country: CountryType, lang: string) => {\n    const content = country.i18n[lang] ?? country.i18n.en\n    return {\n      selectedKey: country.iso,\n      content,\n    }\n  },\n}: GetCountryData = {}) {\n  return countries\n    .filter((country) => {\n      if (typeof filter === 'function') {\n        return filter(country)\n      }\n\n      return !filter\n    })\n    .sort(({ i18n: a }, { i18n: b }) => {\n      if (sort === 'Prioritized') {\n        const indexA = prioritizedCountries.indexOf(a['en'])\n        const indexB = prioritizedCountries.indexOf(b['en'])\n\n        const priorityA = indexA !== -1\n        const priorityB = indexB !== -1\n\n        if (priorityA && priorityB) {\n          return indexA - indexB\n        } else if (priorityA) {\n          return -1\n        } else if (priorityB) {\n          return 1\n        }\n      }\n\n      return a[lang].localeCompare(b[lang])\n    })\n    .map((country) => makeObject(country, lang))\n}\n\nexport function makeCountryFilterSet(ccFilter: CountryFilterSet) {\n  return (country: CountryType) => {\n    switch (ccFilter) {\n      case 'Scandinavia':\n      case 'Nordic':\n        return country.regions?.includes(ccFilter)\n      case 'Europe':\n        return country.continent.includes(ccFilter)\n    }\n    return true\n  }\n}\n\nSelectCountry._supportsSpacingProps = true\nexport default SelectCountry\n"],"mappings":"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"}
+{"version":3,"file":"SelectCountry.js","names":["React","useCallback","useContext","useMemo","useRef","classnames","SharedContext","Autocomplete","HelpButton","pickSpacingProps","countries","prioritizedCountries","useFieldProps","FieldBlock","useErrorMessage","useTranslation","SelectCountry","props","_sharedContext$locale","sharedContext","translations","lang","locale","split","getCountryObjectByIso","value","country","find","_ref","iso","i18n","provideAdditionalArgs","errorMessages","path","required","errorRequired","defaultProps","preparedProps","_objectSpread","className","placeholder","label","ccFilter","info","warning","error","hasError","disabled","width","help","htmlAttributes","handleFocus","handleBlur","handleChange","updateValue","forceUpdate","filterCountries","dataRef","langRef","wasFilled","filter","countryFilter","isLangChange","current","getCountryData","sort","window","requestAnimationFrame","handleCountryChange","_ref2","data","newValue","selectedKey","fillData","onFocusHandler","_ref3","updateData","onTypeHandler","_ref4","_event$nativeEvent","currentValue","setHidden","event","nativeEvent","search","toLowerCase","_ref5","Object","values","some","s","includes","createElement","_extends","label_direction","input_icon","on_show","on_focus","on_blur","on_change","on_type","stretch","status","undefined","show_submit_button","keep_selection","suffix","title","content","autoComplete","no_animation","noAnimation","makeObject","_country$i18n$lang","en","arguments","length","_ref6","_ref7","a","b","indexA","indexOf","indexB","priorityA","priorityB","localeCompare","map","result","_country$regions","regions","continent","makeCountryFilterSet","_country$regions2","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/SelectCountry/SelectCountry.tsx"],"sourcesContent":["import React, { useCallback, useContext, useMemo, useRef } from 'react'\nimport classnames from 'classnames'\nimport SharedContext from '../../../../shared/Context'\nimport { Autocomplete, HelpButton } from '../../../../components'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport countries, {\n  prioritizedCountries,\n  type CountryType,\n  type CountryLang,\n} from '../../constants/countries'\nimport { useFieldProps } from '../../hooks'\nimport {\n  FieldBlockWidth,\n  FieldHelpProps,\n  FieldPropsWithExtraValue,\n} from '../../types'\nimport FieldBlock from '../../FieldBlock'\nimport useErrorMessage from '../../hooks/useErrorMessage'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport type CountryFilterSet =\n  | 'Scandinavia'\n  | 'Nordic'\n  | 'Europe'\n  | 'Prioritized'\n\nexport type Props = FieldHelpProps &\n  FieldPropsWithExtraValue<string, CountryType, undefined | string> & {\n    /**\n     * Lists only the countries you want to show. Can be `Scandinavia`, `Nordic`, `Europe` or `Prioritized`.\n     * Defaults to `Prioritized`.\n     */\n    countries?: CountryFilterSet\n\n    /**\n     * Use this prop to filter out certain countries. The function receives the country object and should return a boolean. Returning `false` will omit the country.\n     */\n    filterCountries?: (country: CountryType) => boolean\n\n    /**\n     * For internal testing purposes\n     */\n    noAnimation?: boolean\n\n    /**\n     * The width of the component.\n     */\n    width?: FieldBlockWidth\n  }\n\nfunction SelectCountry(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const translations = useTranslation().SelectCountry\n  const lang = sharedContext.locale?.split('-')[0] as CountryLang\n\n  const getCountryObjectByIso = useCallback(\n    (value: CountryType['iso']) => {\n      const country = countries.find(({ iso }) => value === iso)\n      if (country?.i18n) {\n        country['name'] = country.i18n[lang]\n      }\n      return country\n    },\n    [lang]\n  )\n\n  const provideAdditionalArgs = useCallback(\n    (value: CountryType['iso']) => {\n      const country = getCountryObjectByIso(value)\n\n      if (country?.iso) {\n        return country\n      }\n    },\n    [getCountryObjectByIso]\n  )\n\n  const errorMessages = useErrorMessage(props.path, props.errorMessages, {\n    required: translations.errorRequired,\n  })\n\n  const defaultProps: Partial<Props> = {\n    errorMessages,\n  }\n  const preparedProps: Props = {\n    ...defaultProps,\n    ...props,\n    provideAdditionalArgs,\n  }\n\n  const {\n    className,\n    placeholder = translations.placeholder,\n    label = translations.label,\n    countries: ccFilter = 'Prioritized',\n    info,\n    warning,\n    error,\n    hasError,\n    disabled,\n    value,\n    width = 'large',\n    help,\n    htmlAttributes,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    updateValue,\n    forceUpdate,\n    filterCountries,\n  } = useFieldProps(preparedProps)\n\n  const dataRef = useRef(null)\n  const langRef = useRef(lang)\n  const wasFilled = useRef(false)\n\n  const filter = useCallback(\n    (country: CountryType) => {\n      return countryFilter(country, filterCountries, ccFilter)\n    },\n    [ccFilter, filterCountries]\n  )\n\n  /**\n   * We do not process the whole country list at the first render.\n   * Only when the Autocomplete opens (focus).\n   * To achieve this, we use memo instead of effect to update refs in sync.\n   *\n   * We set or update the data list depending on if the countrycode changes or lang changes.\n   * We then update data set when value changes.\n   */\n  useMemo(() => {\n    const isLangChange = lang !== langRef.current\n\n    if (isLangChange || !wasFilled.current) {\n      langRef.current = lang\n      dataRef.current = getCountryData({\n        lang,\n        filter: !wasFilled.current\n          ? (country) => country.iso === value\n          : filter,\n        sort: ccFilter as Extract<CountryFilterSet, 'Prioritized'>,\n      })\n\n      // To force Autocomplete to re-evaluate the internal data\n      if (isLangChange && value && typeof window !== 'undefined') {\n        updateValue(null)\n        window.requestAnimationFrame(() => {\n          updateValue(value)\n        })\n      }\n    }\n  }, [lang, filter, ccFilter, updateValue, value])\n\n  const handleCountryChange = useCallback(\n    ({ data }: { data: { selectedKey: string } }) => {\n      const newValue = data?.selectedKey\n      const country = getCountryObjectByIso(newValue)\n      if (country?.iso) {\n        handleChange(country.iso, country)\n      }\n    },\n    [getCountryObjectByIso, handleChange]\n  )\n\n  const fillData = useCallback(() => {\n    if (!wasFilled.current) {\n      wasFilled.current = true\n      dataRef.current = getCountryData({\n        lang: langRef.current,\n        filter,\n        sort: ccFilter as Extract<CountryFilterSet, 'Prioritized'>,\n      })\n      forceUpdate()\n    }\n  }, [ccFilter, filter, forceUpdate])\n\n  const onFocusHandler = useCallback(\n    ({ updateData }) => {\n      fillData()\n      updateData(dataRef.current)\n      handleFocus()\n    },\n    [fillData, handleFocus]\n  )\n\n  const onTypeHandler = useCallback(\n    ({ value: currentValue, setHidden, event }) => {\n      // Handle browser autofill/autocomplete\n      if (typeof event?.nativeEvent?.data === 'undefined') {\n        const search = currentValue.toLowerCase()\n        const country = countries.find(({ i18n }) =>\n          Object.values(i18n).some((s) => s.toLowerCase().includes(search))\n        )\n        if (country?.iso) {\n          setHidden()\n          handleChange(country.iso)\n        }\n      }\n    },\n    [handleChange]\n  )\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-select-country', className)}\n      width={width}\n      info={info}\n      warning={warning}\n      error={error}\n      {...pickSpacingProps(props)}\n    >\n      <Autocomplete\n        placeholder={placeholder}\n        label_direction=\"vertical\"\n        label={label}\n        input_icon={false}\n        data={dataRef.current}\n        value={typeof value === 'string' ? value : null}\n        disabled={disabled}\n        on_show={fillData}\n        on_focus={onFocusHandler}\n        on_blur={handleBlur}\n        on_change={handleCountryChange}\n        on_type={onTypeHandler}\n        stretch\n        status={hasError ? 'error' : undefined}\n        show_submit_button\n        keep_selection\n        suffix={\n          help ? (\n            <HelpButton title={help.title}>{help.content}</HelpButton>\n          ) : undefined\n        }\n        autoComplete=\"country-name\"\n        no_animation={props.noAnimation}\n        {...htmlAttributes}\n      />\n    </FieldBlock>\n  )\n}\n\ntype GetCountryData = {\n  lang?: CountryLang\n  filter?: Props['filterCountries']\n  sort?: Extract<CountryFilterSet, 'Prioritized'>\n  makeObject?: (\n    country: CountryType,\n    lang: string\n  ) => {\n    selectedKey: string\n    selected_value?: string\n    content: string\n  }\n}\n\nexport function getCountryData({\n  lang = 'nb',\n  filter = null,\n  sort = null,\n  makeObject = (country: CountryType, lang: string) => {\n    const content = country.i18n[lang] ?? country.i18n.en\n    return {\n      selectedKey: country.iso,\n      content,\n    }\n  },\n}: GetCountryData = {}) {\n  return countries\n    .filter((country) => {\n      if (typeof filter === 'function') {\n        return filter(country)\n      }\n\n      return !filter\n    })\n    .sort(({ i18n: a }, { i18n: b }) => {\n      if (sort === 'Prioritized') {\n        const indexA = prioritizedCountries.indexOf(a['en'])\n        const indexB = prioritizedCountries.indexOf(b['en'])\n\n        const priorityA = indexA !== -1\n        const priorityB = indexB !== -1\n\n        if (priorityA && priorityB) {\n          return indexA - indexB\n        } else if (priorityA) {\n          return -1\n        } else if (priorityB) {\n          return 1\n        }\n      }\n\n      return a[lang].localeCompare(b[lang])\n    })\n    .map((country) => makeObject(country, lang))\n}\n\nexport function countryFilter(\n  country: CountryType,\n  filterCountries: (country: CountryType) => boolean,\n  ccFilter: CountryFilterSet\n) {\n  let result = true\n\n  if (ccFilter !== 'Prioritized') {\n    switch (ccFilter) {\n      case 'Scandinavia':\n      case 'Nordic': {\n        result = country.regions?.includes(ccFilter)\n        break\n      }\n      case 'Europe': {\n        result = country.continent.includes(ccFilter)\n        break\n      }\n    }\n  }\n\n  if (result && filterCountries) {\n    result = filterCountries(country)\n  }\n\n  return result\n}\n\nexport function makeCountryFilterSet(ccFilter: CountryFilterSet) {\n  return (country: CountryType) => {\n    switch (ccFilter) {\n      case 'Scandinavia':\n      case 'Nordic':\n        return country.regions?.includes(ccFilter)\n      case 'Europe':\n        return country.continent.includes(ccFilter)\n    }\n    return true\n  }\n}\n\nSelectCountry._supportsSpacingProps = true\nexport default SelectCountry\n"],"mappings":"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"}

package/extensions/forms/Field/SelectCountry/SelectCountryDocs.js

@@ -4,6 +4,11 @@ export const SelectCountryProperties = {
     doc: 'List only a certain set of countries: `Scandinavia`, `Nordic`, `Europe` or `Prioritized`(all countries [sorted by priority](/uilib/extensions/forms/feature-fields/SelectCountry/#filter-or-prioritize-country-listing)). Defaults to `Prioritized`.',
     type: 'string',
     status: 'optional'
+  },
+  filterCountries: {
+    doc: 'Use this prop to filter out certain countries. The function receives the country object and should return a boolean. Returning `false` will omit the country.',
+    type: 'function',
+    status: 'optional'
   }
 };
 export const SelectCountryGeneralEvents = getFieldEventsWithTypes({

package/extensions/forms/Field/SelectCountry/SelectCountryDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectCountryDocs.js","names":["getFieldEventsWithTypes","SelectCountryProperties","countries","doc","type","status","SelectCountryGeneralEvents","optional"],"sources":["../../../../../../src/extensions/forms/Field/SelectCountry/SelectCountryDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\nimport { getFieldEventsWithTypes } from '../FieldDocs'\n\nexport const SelectCountryProperties: PropertiesTableProps = {\n  countries: {\n    doc: 'List only a certain set of countries: `Scandinavia`, `Nordic`, `Europe` or `Prioritized`(all countries [sorted by priority](/uilib/extensions/forms/feature-fields/SelectCountry/#filter-or-prioritize-country-listing)). Defaults to `Prioritized`.',\n    type: 'string',\n    status: 'optional',\n  },\n}\n\nexport const SelectCountryGeneralEvents = getFieldEventsWithTypes(\n  { type: 'string', optional: true },\n  { type: 'object', optional: true }\n)\n"],"mappings":"AACA,SAASA,uBAAuB,QAAQ,cAAc;AAEtD,OAAO,MAAMC,uBAA6C,GAAG;EAC3DC,SAAS,EAAE;IACTC,GAAG,EAAE,sPAAsP;IAC3PC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAMC,0BAA0B,GAAGN,uBAAuB,CAC/D;EAAEI,IAAI,EAAE,QAAQ;EAAEG,QAAQ,EAAE;AAAK,CAAC,EAClC;EAAEH,IAAI,EAAE,QAAQ;EAAEG,QAAQ,EAAE;AAAK,CACnC,CAAC"}
+{"version":3,"file":"SelectCountryDocs.js","names":["getFieldEventsWithTypes","SelectCountryProperties","countries","doc","type","status","filterCountries","SelectCountryGeneralEvents","optional"],"sources":["../../../../../../src/extensions/forms/Field/SelectCountry/SelectCountryDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\nimport { getFieldEventsWithTypes } from '../FieldDocs'\n\nexport const SelectCountryProperties: PropertiesTableProps = {\n  countries: {\n    doc: 'List only a certain set of countries: `Scandinavia`, `Nordic`, `Europe` or `Prioritized`(all countries [sorted by priority](/uilib/extensions/forms/feature-fields/SelectCountry/#filter-or-prioritize-country-listing)). Defaults to `Prioritized`.',\n    type: 'string',\n    status: 'optional',\n  },\n  filterCountries: {\n    doc: 'Use this prop to filter out certain countries. The function receives the country object and should return a boolean. Returning `false` will omit the country.',\n    type: 'function',\n    status: 'optional',\n  },\n}\n\nexport const SelectCountryGeneralEvents = getFieldEventsWithTypes(\n  { type: 'string', optional: true },\n  { type: 'object', optional: true }\n)\n"],"mappings":"AACA,SAASA,uBAAuB,QAAQ,cAAc;AAEtD,OAAO,MAAMC,uBAA6C,GAAG;EAC3DC,SAAS,EAAE;IACTC,GAAG,EAAE,sPAAsP;IAC3PC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,eAAe,EAAE;IACfH,GAAG,EAAE,+JAA+J;IACpKC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAME,0BAA0B,GAAGP,uBAAuB,CAC/D;EAAEI,IAAI,EAAE,QAAQ;EAAEI,QAAQ,EAAE;AAAK,CAAC,EAClC;EAAEJ,IAAI,EAAE,QAAQ;EAAEI,QAAQ,EAAE;AAAK,CACnC,CAAC"}

package/extensions/forms/FieldBlock/FieldBlock.js

@@ -74,7 +74,7 @@ function FieldBlock(props) {
   const label = useMemo(() => {
     let content = labelProp;
     if (iterateIndex !== undefined) {
-      content = convertJsxToString(labelProp).replace('{itemNr}', String(iterateIndex + 1));
+      content = convertJsxToString(labelProp).replace('{itemNo}', String(iterateIndex + 1));
     }
     if (labelSuffixText) {
       if (convertJsxToString(content).includes(optionalLabelSuffix)) {