@dnb/eufemia 10.62.4 → 10.63.0

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

@@ -1 +1 @@
-{"version":3,"file":"PhoneNumber.js","names":["React","useMemo","useContext","useCallback","useEffect","useRef","Autocomplete","Flex","classnames","countries","StringField","FieldBlock","useFieldProps","pickSpacingProps","SharedContext","countryFilter","getCountryData","useTranslation","defaultCountryCode","defaultPlaceholder","defaultMask","PhoneNumber","props","_sharedContext$locale","_props$inputRef","_countryCodeRef$curre","_props$width","sharedContext","label","defaultLabel","countryCodeLabel","defaultCountryCodeLabel","errorRequired","lang","locale","split","countryCodeRef","emptyValue","numberRef","dataRef","langRef","wasFilled","errorMessages","_objectSpread","validateRequired","value","required","isChanged","error","countryCode","phoneNumber","splitValue","prevCountryCodeRef","current","undefined","fromExternal","external","omitCountryCodeField","toEvent","schema","_props$schema","type","pattern","defaultProps","ref","preparedProps","inputRef","id","className","countryCodeFieldClassName","numberFieldClassName","countryCodePlaceholder","placeholder","numberMask","ccFilter","info","warning","hasError","disabled","width","help","validateInitially","continuousValidation","validateUnchanged","setHasFocus","handleChange","setDisplayValue","onCountryCodeChange","onNumberChange","filterCountries","_inputRef$current","number","path","length","joinValue","filter","country","updateCurrentDataSet","formatCountryCode","cdc","sort","makeObject","getEventValues","callOnChange","eventValues","callOnBlurOrFocus","hasFocus","handleCountryCodeChange","data","_data$selectedKey","selectedKey","trim","handleNumberChange","handleOnBlur","handleOnFocus","handleCountryCodeFocus","updateData","onTypeHandler","revalidateInputValue","event","_event$nativeEvent","nativeEvent","cdcVal","test","find","window","requestAnimationFrame","isDefault","includes","fieldBlockProps","createElement","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","innerRef","breakout","outset","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, {\n  useMemo,\n  useContext,\n  useCallback,\n  useEffect,\n  useRef,\n} 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, { Props as FieldBlockProps } from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport {\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 useTranslation from '../../hooks/useTranslation'\nimport { DrawerListDataArrayItem } from '../../../../fragments/DrawerList'\n\nexport type Props = Omit<\n  FieldPropsWithExtraValue<\n    string,\n    { country: string; phone: string },\n    undefined | string\n  >,\n  'layout' | 'layoutOptions'\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  inputRef?: React.RefObject<HTMLInputElement>\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 {\n    label: defaultLabel,\n    countryCodeLabel: defaultCountryCodeLabel,\n    errorRequired,\n  } = useTranslation().PhoneNumber\n  const lang = sharedContext.locale?.split('-')[0] as CountryLang\n\n  const countryCodeRef = useRef<Props['value']>(props?.emptyValue)\n  const numberRef = useRef<Props['value']>(props?.emptyValue)\n  const dataRef = useRef<Array<DrawerListDataArrayItem>>(null)\n  const langRef = useRef<string>(lang)\n  const wasFilled = useRef<boolean>(false)\n\n  const errorMessages = useMemo(\n    () => ({\n      'Field.errorRequired': errorRequired,\n      'Field.errorPattern': errorRequired,\n      ...props.errorMessages,\n    }),\n    [errorRequired, props.errorMessages]\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 fromExternal = useCallback(\n    (external: string) => {\n      const [, phoneNumber] = splitValue(external)\n      if (!phoneNumber && !props.omitCountryCodeField) {\n        return countryCodeRef.current\n      }\n      return external\n    },\n    [props.omitCountryCodeField]\n  )\n\n  const toEvent = useCallback(\n    (value: string) => {\n      const [, phoneNumber] = splitValue(value)\n      if (!phoneNumber) {\n        return props.emptyValue\n      }\n      return value\n    },\n    [props.emptyValue]\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 ref = useRef<HTMLInputElement>()\n  const preparedProps: Props = {\n    ...props,\n    ...defaultProps,\n    validateRequired,\n    fromExternal,\n    toEvent,\n    inputRef: props.inputRef ?? ref,\n  }\n\n  const {\n    id,\n    value,\n    className,\n    inputRef,\n    countryCodeFieldClassName,\n    numberFieldClassName,\n    countryCodePlaceholder,\n    placeholder,\n    countryCodeLabel,\n    label = defaultLabel,\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    setDisplayValue,\n    onCountryCodeChange,\n    onNumberChange,\n    filterCountries,\n  } = useFieldProps(preparedProps)\n\n  useEffect(() => {\n    const number = inputRef.current?.value\n    setDisplayValue(\n      props.path,\n      number?.length > 0\n        ? joinValue([countryCodeRef.current, number])\n        : undefined\n    )\n  }, [inputRef, props.path, setDisplayValue, value])\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 = 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  const fieldBlockProps: FieldBlockProps = {\n    id,\n    className: classnames('dnb-forms-field-phone-number', className),\n    width: omitCountryCodeField || props.width ? undefined : width,\n    label: undefined,\n    help: undefined,\n    ...pickSpacingProps(props),\n  }\n\n  return (\n    <FieldBlock {...fieldBlockProps}>\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={countryCodeLabel ?? defaultCountryCodeLabel}\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          innerRef={inputRef}\n          info={info}\n          warning={warning}\n          error={error}\n          disabled={disabled}\n          width={\n            omitCountryCodeField ? 'medium' : props.width ?? 'stretch'\n          }\n          help={{ ...help, breakout: false, outset: false }}\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","useEffect","useRef","Autocomplete","Flex","classnames","countries","StringField","FieldBlock","useFieldProps","pickSpacingProps","SharedContext","countryFilter","getCountryData","useTranslation","defaultCountryCode","defaultPlaceholder","defaultMask","PhoneNumber","props","_sharedContext$locale","_props$inputRef","_countryCodeRef$curre","_props$width","sharedContext","label","defaultLabel","countryCodeLabel","defaultCountryCodeLabel","errorRequired","lang","locale","split","countryCodeRef","emptyValue","numberRef","dataRef","langRef","wasFilled","errorMessages","_objectSpread","validateRequired","value","required","isChanged","error","countryCode","phoneNumber","splitValue","prevCountryCodeRef","current","undefined","fromExternal","external","omitCountryCodeField","toEvent","schema","_props$schema","type","pattern","defaultProps","ref","preparedProps","inputRef","id","path","itemPath","className","countryCodeFieldClassName","numberFieldClassName","countryCodePlaceholder","placeholder","numberMask","ccFilter","info","warning","hasError","disabled","width","help","validateInitially","continuousValidation","validateContinuously","validateUnchanged","setHasFocus","handleChange","setDisplayValue","onCountryCodeChange","onNumberChange","filterCountries","_inputRef$current","number","length","joinValue","filter","country","updateCurrentDataSet","formatCountryCode","cdc","sort","makeObject","getEventValues","callOnChange","eventValues","callOnBlurOrFocus","hasFocus","handleCountryCodeChange","data","_data$selectedKey","selectedKey","trim","handleNumberChange","handleOnBlur","handleOnFocus","handleCountryCodeFocus","updateData","onTypeHandler","revalidateInputValue","event","_event$nativeEvent","nativeEvent","cdcVal","test","find","window","requestAnimationFrame","isDefault","includes","fieldBlockProps","createElement","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","innerRef","breakout","outset","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, {\n  useMemo,\n  useContext,\n  useCallback,\n  useEffect,\n  useRef,\n} 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, { Props as FieldBlockProps } from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport {\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 useTranslation from '../../hooks/useTranslation'\nimport { DrawerListDataArrayItem } from '../../../../fragments/DrawerList'\n\nexport type Props = Omit<\n  FieldPropsWithExtraValue<\n    string,\n    { country: string; phone: string },\n    undefined | string\n  >,\n  'layout' | 'layoutOptions'\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  inputRef?: React.RefObject<HTMLInputElement>\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 {\n    label: defaultLabel,\n    countryCodeLabel: defaultCountryCodeLabel,\n    errorRequired,\n  } = useTranslation().PhoneNumber\n  const lang = sharedContext.locale?.split('-')[0] as CountryLang\n\n  const countryCodeRef = useRef<Props['value']>(props?.emptyValue)\n  const numberRef = useRef<Props['value']>(props?.emptyValue)\n  const dataRef = useRef<Array<DrawerListDataArrayItem>>(null)\n  const langRef = useRef<string>(lang)\n  const wasFilled = useRef<boolean>(false)\n\n  const errorMessages = useMemo(\n    () => ({\n      'Field.errorRequired': errorRequired,\n      'Field.errorPattern': errorRequired,\n      ...props.errorMessages,\n    }),\n    [errorRequired, props.errorMessages]\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 fromExternal = useCallback(\n    (external: string) => {\n      const [, phoneNumber] = splitValue(external)\n      if (!phoneNumber && !props.omitCountryCodeField) {\n        return countryCodeRef.current\n      }\n      return external\n    },\n    [props.omitCountryCodeField]\n  )\n\n  const toEvent = useCallback(\n    (value: string) => {\n      const [, phoneNumber] = splitValue(value)\n      if (!phoneNumber) {\n        return props.emptyValue\n      }\n      return value\n    },\n    [props.emptyValue]\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 ref = useRef<HTMLInputElement>()\n  const preparedProps: Props = {\n    ...props,\n    ...defaultProps,\n    validateRequired,\n    fromExternal,\n    toEvent,\n    inputRef: props.inputRef ?? ref,\n  }\n\n  const {\n    id,\n    path,\n    itemPath,\n    value,\n    className,\n    inputRef,\n    countryCodeFieldClassName,\n    numberFieldClassName,\n    countryCodePlaceholder,\n    placeholder,\n    countryCodeLabel,\n    label = defaultLabel,\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    validateContinuously,\n    validateUnchanged,\n    omitCountryCodeField,\n    setHasFocus,\n    handleChange,\n    setDisplayValue,\n    onCountryCodeChange,\n    onNumberChange,\n    filterCountries,\n  } = useFieldProps(preparedProps)\n\n  useEffect(() => {\n    if (path || itemPath) {\n      const number = inputRef.current?.value\n      setDisplayValue(\n        number?.length > 0\n          ? joinValue([countryCodeRef.current, number])\n          : undefined\n      )\n    }\n  }, [inputRef, itemPath, path, setDisplayValue, value])\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 = 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  const fieldBlockProps: FieldBlockProps = {\n    id,\n    className: classnames('dnb-forms-field-phone-number', className),\n    width: omitCountryCodeField || props.width ? undefined : width,\n    label: undefined,\n    help: undefined,\n    ...pickSpacingProps(props),\n  }\n\n  return (\n    <FieldBlock {...fieldBlockProps}>\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={countryCodeLabel ?? defaultCountryCodeLabel}\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          innerRef={inputRef}\n          info={info}\n          warning={warning}\n          error={error}\n          disabled={disabled}\n          width={\n            omitCountryCodeField ? 'medium' : props.width ?? 'stretch'\n          }\n          help={{ ...help, breakout: false, outset: false }}\n          required={required}\n          errorMessages={errorMessages}\n          validateInitially={validateInitially}\n          validateContinuously={\n            continuousValidation || validateContinuously\n          }\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/es/extensions/forms/Field/Provider/useFieldProvider.d.ts

@@ -8,12 +8,12 @@ declare function useFieldProvider(props?: Omit<FieldProviderProps, 'children'>):
         space?: import("../../../../shared/types").SpaceTypeAll;
         left?: import("../../../../shared/types").SpaceType;
         right?: import("../../../../shared/types").SpaceType;
-        error?: Error | import("../..").FormError | (Error | import("../..").FormError)[];
+        error?: import("../../types").MessageProp<unknown, Error | import("../..").FormError | (Error | import("../..").FormError)[]>;
         label?: import("react").ReactNode;
         path?: string;
         'aria-hidden'?: boolean | "true" | "false";
         value?: unknown;
-        info?: import("react").ReactNode;
+        info?: import("../../types").MessageProp<unknown, import("react").ReactNode | import("react").ReactNode[]>;
         'aria-labelledby'?: string;
         'aria-describedby'?: string;
         'aria-details'?: string;
@@ -88,10 +88,11 @@ declare function useFieldProvider(props?: Omit<FieldProviderProps, 'children'>):
         layout?: "horizontal" | "vertical";
         translations?: import("../../../../shared/Context").Translations | import("../../../../shared/Context").TranslationCustomLocales;
         valueType?: string | number | boolean | (string | number | boolean)[];
-        warning?: import("react").ReactNode;
+        warning?: import("../../types").MessageProp<unknown, import("react").ReactNode | import("react").ReactNode[]>;
         emptyValue?: unknown;
         validateInitially?: boolean;
         continuousValidation?: boolean;
+        validateContinuously?: boolean;
         htmlAttributes?: Record<string, unknown>;
         schema?: import("../../types").AllJSONSchemaVersions<unknown>;
         validator?: import("../../types").Validator<unknown, import("../../types").DefaultErrorMessages>;

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

@@ -51,6 +51,8 @@ function SelectCountry(props) {
   });
   const {
     id,
+    path,
+    itemPath,
     className,
     placeholder = defaultPlaceholder,
     label = defaultLabel,
@@ -136,9 +138,11 @@ function SelectCountry(props) {
     }
   }, [handleChange]);
   useMemo(() => {
-    var _getCountryObjectByIs, _getCountryObjectByIs2;
-    setDisplayValue(props.path, (_getCountryObjectByIs = getCountryObjectByIso(value)) === null || _getCountryObjectByIs === void 0 ? void 0 : (_getCountryObjectByIs2 = _getCountryObjectByIs.i18n) === null || _getCountryObjectByIs2 === void 0 ? void 0 : _getCountryObjectByIs2[langRef.current]);
-  }, [getCountryObjectByIso, props.path, setDisplayValue, value]);
+    if (path || itemPath) {
+      var _getCountryObjectByIs, _getCountryObjectByIs2;
+      setDisplayValue((_getCountryObjectByIs = getCountryObjectByIso(value)) === null || _getCountryObjectByIs === void 0 ? void 0 : (_getCountryObjectByIs2 = _getCountryObjectByIs.i18n) === null || _getCountryObjectByIs2 === void 0 ? void 0 : _getCountryObjectByIs2[langRef.current]);
+    }
+  }, [getCountryObjectByIso, itemPath, path, setDisplayValue, value]);
   const fieldBlockProps = _objectSpread({
     forId: id,
     className: classnames('dnb-forms-field-select-country', className),
@@ -179,7 +183,7 @@ export function getCountryData({
     };
   }
 } = {}) {
-  return countries.filter(country => {
+  const sortedCountries = countries.filter(country => {
     if (typeof filter === 'function') {
       return filter(country);
     }
@@ -205,6 +209,10 @@ export function getCountryData({
     }
     return (_String = String(a[lang])) === null || _String === void 0 ? void 0 : (_String$localeCompare = _String.localeCompare) === null || _String$localeCompare === void 0 ? void 0 : _String$localeCompare.call(_String, b[lang], 'nb');
   }).map(country => makeObject(country, lang));
+  if (sortedCountries.length === 0) {
+    return undefined;
+  }
+  return sortedCountries;
 }
 export function countryFilter(country, filterCountries, ccFilter) {
   let result = true;

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

@@ -1 +1 @@
-{"version":3,"file":"SelectCountry.js","names":["React","useCallback","useContext","useMemo","useRef","classnames","SharedContext","FieldBlockContext","LOCALE","Autocomplete","pickSpacingProps","countries","prioritizedCountries","useFieldProps","FieldBlock","useTranslation","SelectCountry","props","_props$width","sharedContext","fieldBlockContext","label","defaultLabel","placeholder","defaultPlaceholder","errorRequired","lang","locale","split","getCountryObjectByIso","value","country","find","iso","i18n","provideAdditionalArgs","errorMessages","required","preparedProps","_objectSpread","width","composition","id","className","ccFilter","hasError","disabled","htmlAttributes","handleFocus","handleBlur","handleChange","updateValue","setDisplayValue","forceUpdate","filterCountries","dataRef","langRef","wasFilled","filter","countryFilter","isLangChange","current","getCountryData","sort","window","requestAnimationFrame","handleCountryChange","data","newValue","selectedKey","fillData","onFocusHandler","updateData","onTypeHandler","currentValue","setHidden","event","_event$nativeEvent","nativeEvent","search","toLowerCase","Object","values","some","s","includes","_getCountryObjectByIs","_getCountryObjectByIs2","path","fieldBlockProps","forId","undefined","contentWidth","createElement","_extends","input_icon","on_show","on_focus","on_blur","on_change","on_type","stretch","status","show_submit_button","keep_selection","autoComplete","no_animation","noAnimation","makeObject","_country$i18n$lang","content","en","a","b","_String","_String$localeCompare","indexA","indexOf","indexB","priorityA","priorityB","String","localeCompare","call","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 FieldBlockContext from '../../FieldBlock/FieldBlockContext'\nimport { LOCALE } from '../../../../shared/defaults'\nimport { Autocomplete } 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 { FieldPropsWithExtraValue } from '../../types'\nimport FieldBlock, {\n  Props as FieldBlockProps,\n  FieldBlockWidth,\n} from '../../FieldBlock'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport type CountryFilterSet =\n  | 'Scandinavia'\n  | 'Nordic'\n  | 'Europe'\n  | 'Prioritized'\nexport type { CountryType }\n\nexport type Props = FieldPropsWithExtraValue<\n  string,\n  CountryType,\n  undefined | string\n> & {\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 fieldBlockContext = useContext(FieldBlockContext)\n  const {\n    label: defaultLabel,\n    placeholder: defaultPlaceholder,\n    errorRequired,\n  } = useTranslation().SelectCountry\n  const lang = (sharedContext.locale || LOCALE).split(\n    '-'\n  )[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 = useMemo(\n    () => ({\n      required: errorRequired,\n    }),\n    [errorRequired]\n  )\n\n  const preparedProps: Props = {\n    errorMessages,\n    ...props,\n    width:\n      props.width ??\n      (fieldBlockContext?.composition ? 'stretch' : 'large'),\n    provideAdditionalArgs,\n  }\n\n  const {\n    id,\n    className,\n    placeholder = defaultPlaceholder,\n    label = defaultLabel,\n    countries: ccFilter = 'Prioritized',\n    hasError,\n    disabled,\n    value,\n    width,\n    htmlAttributes,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    updateValue,\n    setDisplayValue,\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  useMemo(() => {\n    setDisplayValue(\n      props.path,\n      getCountryObjectByIso(value)?.i18n?.[langRef.current]\n    )\n  }, [getCountryObjectByIso, props.path, setDisplayValue, value])\n\n  const fieldBlockProps: FieldBlockProps = {\n    forId: id,\n    className: classnames('dnb-forms-field-select-country', className),\n    label,\n    width:\n      width === 'stretch' || fieldBlockContext?.composition\n        ? width\n        : undefined,\n    contentWidth: width !== false ? width : undefined,\n    ...pickSpacingProps(props),\n  }\n\n  return (\n    <FieldBlock {...fieldBlockProps}>\n      <Autocomplete\n        id={id}\n        placeholder={placeholder}\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        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 String(a[lang])?.localeCompare?.(b[lang], 'nb') // Always sort by nb, because åøæ (for Åland) is not in the en alphabet\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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"}
+{"version":3,"file":"SelectCountry.js","names":["React","useCallback","useContext","useMemo","useRef","classnames","SharedContext","FieldBlockContext","LOCALE","Autocomplete","pickSpacingProps","countries","prioritizedCountries","useFieldProps","FieldBlock","useTranslation","SelectCountry","props","_props$width","sharedContext","fieldBlockContext","label","defaultLabel","placeholder","defaultPlaceholder","errorRequired","lang","locale","split","getCountryObjectByIso","value","country","find","iso","i18n","provideAdditionalArgs","errorMessages","required","preparedProps","_objectSpread","width","composition","id","path","itemPath","className","ccFilter","hasError","disabled","htmlAttributes","handleFocus","handleBlur","handleChange","updateValue","setDisplayValue","forceUpdate","filterCountries","dataRef","langRef","wasFilled","filter","countryFilter","isLangChange","current","getCountryData","sort","window","requestAnimationFrame","handleCountryChange","data","newValue","selectedKey","fillData","onFocusHandler","updateData","onTypeHandler","currentValue","setHidden","event","_event$nativeEvent","nativeEvent","search","toLowerCase","Object","values","some","s","includes","_getCountryObjectByIs","_getCountryObjectByIs2","fieldBlockProps","forId","undefined","contentWidth","createElement","_extends","input_icon","on_show","on_focus","on_blur","on_change","on_type","stretch","status","show_submit_button","keep_selection","autoComplete","no_animation","noAnimation","makeObject","_country$i18n$lang","content","en","sortedCountries","a","b","_String","_String$localeCompare","indexA","indexOf","indexB","priorityA","priorityB","String","localeCompare","call","map","length","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 FieldBlockContext from '../../FieldBlock/FieldBlockContext'\nimport { LOCALE } from '../../../../shared/defaults'\nimport { Autocomplete } 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 { FieldPropsWithExtraValue } from '../../types'\nimport FieldBlock, {\n  Props as FieldBlockProps,\n  FieldBlockWidth,\n} from '../../FieldBlock'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport type CountryFilterSet =\n  | 'Scandinavia'\n  | 'Nordic'\n  | 'Europe'\n  | 'Prioritized'\nexport type { CountryType }\n\nexport type Props = FieldPropsWithExtraValue<\n  string,\n  CountryType,\n  undefined | string\n> & {\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 fieldBlockContext = useContext(FieldBlockContext)\n  const {\n    label: defaultLabel,\n    placeholder: defaultPlaceholder,\n    errorRequired,\n  } = useTranslation().SelectCountry\n  const lang = (sharedContext.locale || LOCALE).split(\n    '-'\n  )[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 = useMemo(\n    () => ({\n      required: errorRequired,\n    }),\n    [errorRequired]\n  )\n\n  const preparedProps: Props = {\n    errorMessages,\n    ...props,\n    width:\n      props.width ??\n      (fieldBlockContext?.composition ? 'stretch' : 'large'),\n    provideAdditionalArgs,\n  }\n\n  const {\n    id,\n    path,\n    itemPath,\n    className,\n    placeholder = defaultPlaceholder,\n    label = defaultLabel,\n    countries: ccFilter = 'Prioritized',\n    hasError,\n    disabled,\n    value,\n    width,\n    htmlAttributes,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    updateValue,\n    setDisplayValue,\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  useMemo(() => {\n    if (path || itemPath) {\n      setDisplayValue(\n        getCountryObjectByIso(value)?.i18n?.[langRef.current]\n      )\n    }\n  }, [getCountryObjectByIso, itemPath, path, setDisplayValue, value])\n\n  const fieldBlockProps: FieldBlockProps = {\n    forId: id,\n    className: classnames('dnb-forms-field-select-country', className),\n    label,\n    width:\n      width === 'stretch' || fieldBlockContext?.composition\n        ? width\n        : undefined,\n    contentWidth: width !== false ? width : undefined,\n    ...pickSpacingProps(props),\n  }\n\n  return (\n    <FieldBlock {...fieldBlockProps}>\n      <Autocomplete\n        id={id}\n        placeholder={placeholder}\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        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  const sortedCountries = 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 String(a[lang])?.localeCompare?.(b[lang], 'nb') // Always sort by nb, because åøæ (for Åland) is not in the en alphabet\n    })\n    .map((country) => makeObject(country, lang))\n\n  if (sortedCountries.length === 0) {\n    return undefined\n  }\n\n  return sortedCountries\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/es/extensions/forms/Field/Selection/Selection.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { Props as OptionFieldProps } from '../Option';
 import { FieldBlockWidth } from '../../FieldBlock';
 import { FieldProps, Path } from '../../types';
 import type { FormStatusText } from '../../../../components/FormStatus';
@@ -18,6 +19,7 @@ export type Data = Array<{
     title: React.ReactNode;
     text?: React.ReactNode;
     disabled?: boolean;
+    style?: React.CSSProperties;
 }>;
 export type Props = FieldProps<IOption['value']> & {
     /**
@@ -34,6 +36,11 @@ export type Props = FieldProps<IOption['value']> & {
      * Defines the layout of the options for radio and button variants.
      */
     optionsLayout?: 'horizontal' | 'vertical';
+    /**
+     * Transform the displayed selection for Dropdown and Autocomplete variant.
+     * Use it to display a different value than the one in the data set.
+     */
+    transformSelection?: (props: OptionFieldProps) => React.ReactNode;
     /**
      * The path to the context data (Form.Handler).
      * The context data object needs to have a `value` and a `title` property.
@@ -71,5 +78,5 @@ type OptionProps = React.ComponentProps<React.FC<{
 export declare function mapOptions(children: React.ReactNode, { createOption, }: {
     createOption: (props: OptionProps, i: number) => React.ReactNode;
 }): any;
-export declare function makeOptions<T = DrawerListProps['data']>(children: React.ReactNode): T;
+export declare function makeOptions<T = DrawerListProps['data']>(children: React.ReactNode, transformSelection?: Props['transformSelection']): T;
 export default Selection;

package/es/extensions/forms/Field/Selection/Selection.js

@@ -25,7 +25,6 @@ function Selection(props) {
     layout = 'vertical',
     optionsLayout = 'vertical',
     placeholder,
-    path,
     value,
     info,
     warning,
@@ -38,6 +37,7 @@ function Selection(props) {
     setHasFocus,
     handleChange,
     setDisplayValue,
+    transformSelection,
     data,
     dataPath,
     children,
@@ -98,7 +98,7 @@ function Selection(props) {
             label
           }) => {
             if (v === value) {
-              setDisplayValue(path, label);
+              setDisplayValue(label);
             }
           }
         });
@@ -117,9 +117,9 @@ function Selection(props) {
     case 'dropdown':
       {
         var _data$find;
-        const data = renderDropdownItems(dataList).concat(makeOptions(children)).filter(Boolean);
+        const data = renderDropdownItems(dataList, transformSelection).concat(makeOptions(children, transformSelection)).filter(Boolean);
         const displayValue = (_data$find = data.find(item => item.selectedKey === value)) === null || _data$find === void 0 ? void 0 : _data$find.content;
-        setDisplayValue(path, displayValue);
+        setDisplayValue(displayValue);
         const sharedProps = _objectSpread(_objectSpread({
           id,
           list_class: 'dnb-forms-field-selection__list',
@@ -213,7 +213,7 @@ export function mapOptions(children, {
     return child;
   });
 }
-export function makeOptions(children) {
+export function makeOptions(children, transformSelection) {
   return React.Children.map(children, child => {
     var _child, _child$props, _child$props$children;
     if (((_child = child) === null || _child === void 0 ? void 0 : (_child$props = _child['props']) === null || _child$props === void 0 ? void 0 : (_child$props$children = _child$props.children) === null || _child$props$children === void 0 ? void 0 : _child$props$children.type) === OptionField) {
@@ -224,12 +224,16 @@ export function makeOptions(children) {
       const props = child.props;
       const title = (_ref2 = (_props$title = props.title) !== null && _props$title !== void 0 ? _props$title : props.children) !== null && _ref2 !== void 0 ? _ref2 : _em || (_em = React.createElement("em", null, "Untitled"));
       const content = props.text ? [title, props.text] : title;
+      const selected_value = transformSelection ? transformSelection(props) : undefined;
       const selectedKey = String((_props$value = props.value) !== null && _props$value !== void 0 ? _props$value : '');
       const disabled = props.disabled;
+      const style = props.style;
       return {
         selectedKey,
+        selected_value,
         content,
-        disabled
+        disabled,
+        style
       };
     }
     if (child) {
@@ -239,17 +243,21 @@ export function makeOptions(children) {
     }
   });
 }
-function renderDropdownItems(data) {
-  return (data === null || data === void 0 ? void 0 : data.map(({
-    value,
-    title,
-    text,
-    disabled
-  }) => {
+function renderDropdownItems(data, transformSelection) {
+  return (data === null || data === void 0 ? void 0 : data.map(props => {
+    const {
+      value,
+      title,
+      text,
+      disabled,
+      style
+    } = props;
     return {
       selectedKey: value,
       content: (text ? [title, text] : title) || _em2 || (_em2 = React.createElement("em", null, "Untitled")),
-      disabled
+      selected_value: transformSelection ? transformSelection(props) : undefined,
+      disabled,
+      style
     };
   })) || [];
 }

package/es/extensions/forms/Field/Selection/Selection.js.map

@@ -1 +1 @@
-{"version":3,"file":"Selection.js","names":["React","useMemo","useCallback","classnames","convertJsxToString","makeUniqueId","ToggleButton","Dropdown","Radio","Autocomplete","HelpButton","OptionField","useFieldProps","checkForError","pickSpacingProps","FieldBlock","convertCamelCaseProps","useDataValue","Selection","props","clearValue","id","className","variant","layout","optionsLayout","placeholder","path","value","info","warning","error","hasError","disabled","emptyValue","width","htmlAttributes","setHasFocus","handleChange","setDisplayValue","data","dataPath","children","autocompleteProps","dropdownProps","getValueByPath","dataList","handleDropdownChange","selectedKey","onChangeHandler","undefined","handleShow","handleHide","cn","fieldBlockProps","_objectSpread","forId","disableStatusSummary","Component","items","renderRadioItems","iterateOverItems","v","label","createElement","_extends","labelHeight","asFieldset","Children","count","Group","layout_direction","on_change","String","_data$find","renderDropdownItems","concat","makeOptions","filter","Boolean","displayValue","find","item","content","sharedProps","list_class","portal_class","title","status","on_show","on_hide","stretch","specificFieldBlockProps","contentWidth","valueProp","optionsCount","length","createOption","i","_ref","help","rest","_objectWithoutProperties","_excluded","suffix","size","key","text","map","mapOptions","child","isValidElement","type","nestedChildren","cloneElement","_child","_child$props","_child$props$children","_ref2","_props$title","_props$value","_em","_em2","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Selection/Selection.tsx"],"sourcesContent":["import React, { useMemo, useCallback } from 'react'\nimport classnames from 'classnames'\nimport {\n  convertJsxToString,\n  makeUniqueId,\n} from '../../../../shared/component-helper'\nimport {\n  ToggleButton,\n  Dropdown,\n  Radio,\n  Autocomplete,\n  HelpButton,\n} from '../../../../components'\nimport OptionField, { Props as OptionFieldProps } from '../Option'\nimport { useFieldProps } from '../../hooks'\nimport { checkForError, ReturnAdditional } from '../../hooks/useFieldProps'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport FieldBlock, {\n  Props as FieldBlockProps,\n  FieldBlockWidth,\n} from '../../FieldBlock'\nimport { FieldProps, Path } from '../../types'\nimport type { FormStatusText } from '../../../../components/FormStatus'\nimport type { AutocompleteAllProps } from '../../../../components/Autocomplete'\nimport type { DropdownAllProps } from '../../../../components/Dropdown'\nimport { HelpProps } from '../../../../components/help-button/HelpButtonInline'\nimport { DrawerListProps } from '../../../../fragments/DrawerList'\nimport {\n  convertCamelCaseProps,\n  ToCamelCase,\n} from '../../../../shared/helpers/withCamelCaseProps'\nimport useDataValue from '../../hooks/useDataValue'\nimport { FormError } from '../../utils'\n\ntype IOption = {\n  title: string | React.ReactNode\n  value: number | string\n  status: FormStatusText\n}\nexport type Data = Array<{\n  value: string\n  title: React.ReactNode\n  text?: React.ReactNode\n  disabled?: boolean\n}>\n\nexport type Props = FieldProps<IOption['value']> & {\n  /**\n   * Defines the variant of the component.\n   * Default: dropdown\n   */\n  variant?: 'dropdown' | 'autocomplete' | 'radio' | 'button'\n\n  /**\n   * The width of the component.\n   * Default: large\n   */\n  width?: FieldBlockWidth\n\n  /**\n   * Defines the layout of the options for radio and button variants.\n   */\n  optionsLayout?: 'horizontal' | 'vertical'\n\n  /**\n   * The path to the context data (Form.Handler).\n   * The context data object needs to have a `value` and a `title` property.\n   */\n  dataPath?: Path\n\n  /**\n   * Data to be used for the component. The object needs to have a `value` and a `title` property.\n   * The generated options will be placed above given JSX based children.\n   */\n  data?: Data\n\n  /**\n   * Autocomplete specific props\n   */\n  autocompleteProps?: ToCamelCase<AutocompleteAllProps>\n\n  /**\n   * Dropdown specific props\n   */\n  dropdownProps?: ToCamelCase<DropdownAllProps>\n\n  /**\n   * The content of the component.\n   */\n  children?: React.ReactNode\n}\n\nfunction Selection(props: Props) {\n  const clearValue = useMemo(() => `clear-option-${makeUniqueId()}`, [])\n\n  const {\n    id,\n    className,\n    variant = 'dropdown',\n    layout = 'vertical',\n    optionsLayout = 'vertical',\n    placeholder,\n    path,\n    value,\n    info,\n    warning,\n    error,\n    hasError,\n    disabled,\n    emptyValue,\n    width = 'large',\n    htmlAttributes,\n    setHasFocus,\n    handleChange,\n    setDisplayValue,\n    data,\n    dataPath,\n    children,\n\n    // - Autocomplete and Dropdown specific props\n    autocompleteProps,\n    dropdownProps,\n  } = useFieldProps(props)\n\n  const { getValueByPath } = useDataValue()\n  let dataList = data\n  if (dataPath) {\n    dataList = getValueByPath(dataPath)\n  }\n\n  const handleDropdownChange = useCallback(\n    ({ data }) => {\n      const selectedKey = data?.selectedKey\n      handleChange?.(\n        !selectedKey || selectedKey === clearValue\n          ? emptyValue\n          : selectedKey\n      )\n    },\n    [handleChange, emptyValue, clearValue]\n  )\n\n  const onChangeHandler = useCallback(\n    ({ value }) => {\n      handleChange?.(value === undefined ? emptyValue : value)\n    },\n    [handleChange, emptyValue]\n  )\n\n  // Specific handleShow and handleHide because Dropdown preserve the initially received callbacks, so changes\n  // due to `useCallback` usage will have no effect, leading to useFieldPropss handleFocus and handleBlur sending out old\n  // copies of value as arguments.\n  const handleShow = useCallback(\n    ({ data }) => {\n      setHasFocus(true, data?.selectedKey)\n    },\n    [setHasFocus]\n  )\n\n  const handleHide = useCallback(\n    ({ data }) => {\n      setHasFocus(false, data?.selectedKey)\n    },\n    [setHasFocus]\n  )\n\n  const cn = classnames(\n    'dnb-forms-field-selection',\n    `dnb-forms-field-selection__variant--${variant}`,\n    `dnb-forms-field-selection--layout-${layout}`,\n    `dnb-forms-field-selection--options-layout--${optionsLayout}`,\n    className\n  )\n\n  const fieldBlockProps: FieldBlockProps = {\n    forId: id,\n    className: cn,\n    disableStatusSummary: true,\n    ...pickSpacingProps(props),\n  }\n\n  switch (variant) {\n    case 'radio':\n    case 'button': {\n      const Component = (\n        variant === 'radio' ? Radio : ToggleButton\n      ) as typeof Radio & typeof ToggleButton\n\n      const items = renderRadioItems({\n        id,\n        value,\n        variant,\n        info,\n        warning,\n        htmlAttributes,\n        children,\n        dataList,\n        hasError,\n        iterateOverItems: ({ value: v, label }) => {\n          if (v === value) {\n            setDisplayValue(path, label)\n          }\n        },\n      })\n\n      return (\n        <FieldBlock\n          {...fieldBlockProps}\n          labelHeight=\"small\"\n          asFieldset={React.Children.count(items) > 1}\n        >\n          <Component.Group\n            className={cn}\n            layout_direction={\n              optionsLayout === 'horizontal' ? 'row' : 'column'\n            }\n            disabled={disabled}\n            on_change={onChangeHandler}\n            value={String(value ?? '')}\n          >\n            {items}\n          </Component.Group>\n        </FieldBlock>\n      )\n    }\n\n    case 'autocomplete':\n    case 'dropdown': {\n      const data = renderDropdownItems(dataList)\n        .concat(makeOptions(children))\n        .filter(Boolean)\n      const displayValue = data.find((item) => item.selectedKey === value)\n        ?.content\n      setDisplayValue(path, displayValue)\n\n      const sharedProps: AutocompleteAllProps & DropdownAllProps = {\n        id,\n        list_class: 'dnb-forms-field-selection__list',\n        portal_class: 'dnb-forms-field-selection__portal',\n        title: placeholder,\n        value: String(value ?? ''),\n        status:\n          (hasError || checkForError([error, info, warning])) && 'error',\n        disabled,\n        ...htmlAttributes,\n        data,\n        on_change: handleDropdownChange,\n        on_show: handleShow,\n        on_hide: handleHide,\n        stretch: true,\n      }\n\n      const specificFieldBlockProps: FieldBlockProps = {\n        width,\n      }\n      if (layout === 'horizontal') {\n        specificFieldBlockProps.width = undefined\n        specificFieldBlockProps.contentWidth = width\n      }\n\n      return (\n        <FieldBlock {...fieldBlockProps} {...specificFieldBlockProps}>\n          {variant === 'autocomplete' ? (\n            <Autocomplete\n              {...sharedProps}\n              {...(autocompleteProps\n                ? (convertCamelCaseProps(\n                    autocompleteProps\n                  ) as AutocompleteAllProps)\n                : null)}\n            />\n          ) : (\n            <Dropdown\n              {...sharedProps}\n              {...(dropdownProps\n                ? (convertCamelCaseProps(\n                    dropdownProps\n                  ) as DropdownAllProps)\n                : null)}\n            />\n          )}\n        </FieldBlock>\n      )\n    }\n  }\n}\n\ntype OptionProps = React.ComponentProps<\n  React.FC<{\n    value: Props['value']\n    error: Error | FormError | undefined\n    help: HelpProps\n    title: React.ReactNode\n    children: React.ReactNode\n  }>\n>\n\nfunction renderRadioItems({\n  id,\n  value: valueProp,\n  variant,\n  info,\n  warning,\n  htmlAttributes,\n  children,\n  dataList,\n  hasError,\n  iterateOverItems,\n}: {\n  id: string\n  value: Props['value']\n  variant: Props['variant']\n  info: Props['info']\n  warning: Props['warning']\n  htmlAttributes: Props['htmlAttributes']\n  children: Props['children']\n  dataList: Data\n  hasError: ReturnAdditional<Props['value']>['hasError']\n  iterateOverItems?: (item: {\n    value: Props['value']\n    label: Props['children']\n  }) => void\n}) {\n  const optionsCount =\n    React.Children.count(children) + (dataList?.length || 0)\n\n  const createOption = (props: OptionProps, i: number) => {\n    const { value, title, children, error, help, ...rest } = props\n\n    const label = title ?? children\n    const suffix = help ? (\n      <HelpButton size=\"small\" title={convertJsxToString(help.title)}>\n        {help.content}\n      </HelpButton>\n    ) : undefined\n\n    iterateOverItems?.({ value, label })\n\n    const Component = (\n      variant === 'radio' ? Radio : ToggleButton\n    ) as typeof Radio & typeof ToggleButton\n\n    return (\n      <Component\n        id={optionsCount === 1 ? id : undefined}\n        key={`option-${i}-${id}`}\n        label={variant === 'radio' ? label : undefined}\n        text={variant === 'button' ? label : undefined}\n        value={String(value ?? valueProp ?? '')}\n        status={\n          (hasError || checkForError([error, info, warning])) && 'error'\n        }\n        suffix={suffix}\n        {...htmlAttributes}\n        {...rest}\n      />\n    )\n  }\n\n  return [\n    ...(dataList || []).map((props, i) => {\n      return createOption(props as OptionProps, i)\n    }),\n    ...(mapOptions(children, { createOption }) || []),\n  ].filter(Boolean)\n}\n\nexport function mapOptions(\n  children: React.ReactNode,\n  {\n    createOption,\n  }: { createOption: (props: OptionProps, i: number) => React.ReactNode }\n) {\n  return React.Children.map(\n    children,\n    (child: React.ReactElement<OptionProps>, i) => {\n      if (React.isValidElement(child)) {\n        if (child.type === OptionField) {\n          return createOption(child.props, i)\n        }\n\n        if (child.props.children) {\n          const nestedChildren = mapOptions(child.props.children, {\n            createOption,\n          })\n          return React.cloneElement(child, child.props, nestedChildren)\n        }\n      }\n\n      return child\n    }\n  )\n}\n\nexport function makeOptions<T = DrawerListProps['data']>(\n  children: React.ReactNode\n): T {\n  return React.Children.map(children, (child) => {\n    if (child?.['props']?.children?.type === OptionField) {\n      child = child['props'].children\n    }\n\n    if (React.isValidElement(child) && child.type === OptionField) {\n      const props = child.props as OptionFieldProps\n      const title = props.title ?? props.children ?? <em>Untitled</em>\n      const content = props.text ? [title, props.text] : title\n      const selectedKey = String(props.value ?? '')\n      const disabled = props.disabled\n\n      return { selectedKey, content, disabled }\n    }\n\n    // For other children, just show them as content\n    if (child) {\n      return {\n        content: child,\n      }\n    }\n  }) as T\n}\n\nfunction renderDropdownItems(data: Data) {\n  return (\n    data?.map(({ value, title, text, disabled }) => {\n      return {\n        selectedKey: value,\n        content: (text ? [title, text] : title) || <em>Untitled</em>,\n        disabled,\n      }\n    }) || []\n  )\n}\n\nSelection._supportsSpacingProps = true\nexport default Selection\n"],"mappings":"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"}
+{"version":3,"file":"Selection.js","names":["React","useMemo","useCallback","classnames","convertJsxToString","makeUniqueId","ToggleButton","Dropdown","Radio","Autocomplete","HelpButton","OptionField","useFieldProps","checkForError","pickSpacingProps","FieldBlock","convertCamelCaseProps","useDataValue","Selection","props","clearValue","id","className","variant","layout","optionsLayout","placeholder","value","info","warning","error","hasError","disabled","emptyValue","width","htmlAttributes","setHasFocus","handleChange","setDisplayValue","transformSelection","data","dataPath","children","autocompleteProps","dropdownProps","getValueByPath","dataList","handleDropdownChange","selectedKey","onChangeHandler","undefined","handleShow","handleHide","cn","fieldBlockProps","_objectSpread","forId","disableStatusSummary","Component","items","renderRadioItems","iterateOverItems","v","label","createElement","_extends","labelHeight","asFieldset","Children","count","Group","layout_direction","on_change","String","_data$find","renderDropdownItems","concat","makeOptions","filter","Boolean","displayValue","find","item","content","sharedProps","list_class","portal_class","title","status","on_show","on_hide","stretch","specificFieldBlockProps","contentWidth","valueProp","optionsCount","length","createOption","i","_ref","help","rest","_objectWithoutProperties","_excluded","suffix","size","key","text","map","mapOptions","child","isValidElement","type","nestedChildren","cloneElement","_child","_child$props","_child$props$children","_ref2","_props$title","_props$value","_em","selected_value","style","_em2","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Selection/Selection.tsx"],"sourcesContent":["import React, { useMemo, useCallback } from 'react'\nimport classnames from 'classnames'\nimport {\n  convertJsxToString,\n  makeUniqueId,\n} from '../../../../shared/component-helper'\nimport {\n  ToggleButton,\n  Dropdown,\n  Radio,\n  Autocomplete,\n  HelpButton,\n} from '../../../../components'\nimport OptionField, { Props as OptionFieldProps } from '../Option'\nimport { useFieldProps } from '../../hooks'\nimport { checkForError, ReturnAdditional } from '../../hooks/useFieldProps'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport FieldBlock, {\n  Props as FieldBlockProps,\n  FieldBlockWidth,\n} from '../../FieldBlock'\nimport { FieldProps, Path } from '../../types'\nimport type { FormStatusText } from '../../../../components/FormStatus'\nimport type { AutocompleteAllProps } from '../../../../components/Autocomplete'\nimport type { DropdownAllProps } from '../../../../components/Dropdown'\nimport { HelpProps } from '../../../../components/help-button/HelpButtonInline'\nimport { DrawerListProps } from '../../../../fragments/DrawerList'\nimport {\n  convertCamelCaseProps,\n  ToCamelCase,\n} from '../../../../shared/helpers/withCamelCaseProps'\nimport useDataValue from '../../hooks/useDataValue'\nimport { FormError } from '../../utils'\n\ntype IOption = {\n  title: string | React.ReactNode\n  value: number | string\n  status: FormStatusText\n}\nexport type Data = Array<{\n  value: string\n  title: React.ReactNode\n  text?: React.ReactNode\n  disabled?: boolean\n  style?: React.CSSProperties\n}>\n\nexport type Props = FieldProps<IOption['value']> & {\n  /**\n   * Defines the variant of the component.\n   * Default: dropdown\n   */\n  variant?: 'dropdown' | 'autocomplete' | 'radio' | 'button'\n\n  /**\n   * The width of the component.\n   * Default: large\n   */\n  width?: FieldBlockWidth\n\n  /**\n   * Defines the layout of the options for radio and button variants.\n   */\n  optionsLayout?: 'horizontal' | 'vertical'\n\n  /**\n   * Transform the displayed selection for Dropdown and Autocomplete variant.\n   * Use it to display a different value than the one in the data set.\n   */\n  transformSelection?: (props: OptionFieldProps) => React.ReactNode\n\n  /**\n   * The path to the context data (Form.Handler).\n   * The context data object needs to have a `value` and a `title` property.\n   */\n  dataPath?: Path\n\n  /**\n   * Data to be used for the component. The object needs to have a `value` and a `title` property.\n   * The generated options will be placed above given JSX based children.\n   */\n  data?: Data\n\n  /**\n   * Autocomplete specific props\n   */\n  autocompleteProps?: ToCamelCase<AutocompleteAllProps>\n\n  /**\n   * Dropdown specific props\n   */\n  dropdownProps?: ToCamelCase<DropdownAllProps>\n\n  /**\n   * The content of the component.\n   */\n  children?: React.ReactNode\n}\n\nfunction Selection(props: Props) {\n  const clearValue = useMemo(() => `clear-option-${makeUniqueId()}`, [])\n\n  const {\n    id,\n    className,\n    variant = 'dropdown',\n    layout = 'vertical',\n    optionsLayout = 'vertical',\n    placeholder,\n    value,\n    info,\n    warning,\n    error,\n    hasError,\n    disabled,\n    emptyValue,\n    width = 'large',\n    htmlAttributes,\n    setHasFocus,\n    handleChange,\n    setDisplayValue,\n    transformSelection,\n    data,\n    dataPath,\n    children,\n\n    // - Autocomplete and Dropdown specific props\n    autocompleteProps,\n    dropdownProps,\n  } = useFieldProps(props)\n\n  const { getValueByPath } = useDataValue()\n  let dataList = data\n  if (dataPath) {\n    dataList = getValueByPath(dataPath)\n  }\n\n  const handleDropdownChange = useCallback(\n    ({ data }) => {\n      const selectedKey = data?.selectedKey\n      handleChange?.(\n        !selectedKey || selectedKey === clearValue\n          ? emptyValue\n          : selectedKey\n      )\n    },\n    [handleChange, emptyValue, clearValue]\n  )\n\n  const onChangeHandler = useCallback(\n    ({ value }) => {\n      handleChange?.(value === undefined ? emptyValue : value)\n    },\n    [handleChange, emptyValue]\n  )\n\n  // Specific handleShow and handleHide because Dropdown preserve the initially received callbacks, so changes\n  // due to `useCallback` usage will have no effect, leading to useFieldPropss handleFocus and handleBlur sending out old\n  // copies of value as arguments.\n  const handleShow = useCallback(\n    ({ data }) => {\n      setHasFocus(true, data?.selectedKey)\n    },\n    [setHasFocus]\n  )\n\n  const handleHide = useCallback(\n    ({ data }) => {\n      setHasFocus(false, data?.selectedKey)\n    },\n    [setHasFocus]\n  )\n\n  const cn = classnames(\n    'dnb-forms-field-selection',\n    `dnb-forms-field-selection__variant--${variant}`,\n    `dnb-forms-field-selection--layout-${layout}`,\n    `dnb-forms-field-selection--options-layout--${optionsLayout}`,\n    className\n  )\n\n  const fieldBlockProps: FieldBlockProps = {\n    forId: id,\n    className: cn,\n    disableStatusSummary: true,\n    ...pickSpacingProps(props),\n  }\n\n  switch (variant) {\n    case 'radio':\n    case 'button': {\n      const Component = (\n        variant === 'radio' ? Radio : ToggleButton\n      ) as typeof Radio & typeof ToggleButton\n\n      const items = renderRadioItems({\n        id,\n        value,\n        variant,\n        info,\n        warning,\n        htmlAttributes,\n        children,\n        dataList,\n        hasError,\n        iterateOverItems: ({ value: v, label }) => {\n          if (v === value) {\n            setDisplayValue(label)\n          }\n        },\n      })\n\n      return (\n        <FieldBlock\n          {...fieldBlockProps}\n          labelHeight=\"small\"\n          asFieldset={React.Children.count(items) > 1}\n        >\n          <Component.Group\n            className={cn}\n            layout_direction={\n              optionsLayout === 'horizontal' ? 'row' : 'column'\n            }\n            disabled={disabled}\n            on_change={onChangeHandler}\n            value={String(value ?? '')}\n          >\n            {items}\n          </Component.Group>\n        </FieldBlock>\n      )\n    }\n\n    case 'autocomplete':\n    case 'dropdown': {\n      const data = renderDropdownItems(dataList, transformSelection)\n        .concat(makeOptions(children, transformSelection))\n        .filter(Boolean)\n      const displayValue = data.find((item) => item.selectedKey === value)\n        ?.content\n      setDisplayValue(displayValue)\n\n      const sharedProps: AutocompleteAllProps & DropdownAllProps = {\n        id,\n        list_class: 'dnb-forms-field-selection__list',\n        portal_class: 'dnb-forms-field-selection__portal',\n        title: placeholder,\n        value: String(value ?? ''),\n        status:\n          (hasError || checkForError([error, info, warning])) && 'error',\n        disabled,\n        ...htmlAttributes,\n        data,\n        on_change: handleDropdownChange,\n        on_show: handleShow,\n        on_hide: handleHide,\n        stretch: true,\n      }\n\n      const specificFieldBlockProps: FieldBlockProps = {\n        width,\n      }\n      if (layout === 'horizontal') {\n        specificFieldBlockProps.width = undefined\n        specificFieldBlockProps.contentWidth = width\n      }\n\n      return (\n        <FieldBlock {...fieldBlockProps} {...specificFieldBlockProps}>\n          {variant === 'autocomplete' ? (\n            <Autocomplete\n              {...sharedProps}\n              {...(autocompleteProps\n                ? (convertCamelCaseProps(\n                    autocompleteProps\n                  ) as AutocompleteAllProps)\n                : null)}\n            />\n          ) : (\n            <Dropdown\n              {...sharedProps}\n              {...(dropdownProps\n                ? (convertCamelCaseProps(\n                    dropdownProps\n                  ) as DropdownAllProps)\n                : null)}\n            />\n          )}\n        </FieldBlock>\n      )\n    }\n  }\n}\n\ntype OptionProps = React.ComponentProps<\n  React.FC<{\n    value: Props['value']\n    error: Error | FormError | undefined\n    help: HelpProps\n    title: React.ReactNode\n    children: React.ReactNode\n  }>\n>\n\nfunction renderRadioItems({\n  id,\n  value: valueProp,\n  variant,\n  info,\n  warning,\n  htmlAttributes,\n  children,\n  dataList,\n  hasError,\n  iterateOverItems,\n}: {\n  id: string\n  value: Props['value']\n  variant: Props['variant']\n  info: Props['info']\n  warning: Props['warning']\n  htmlAttributes: Props['htmlAttributes']\n  children: Props['children']\n  dataList: Data\n  hasError: ReturnAdditional<Props['value']>['hasError']\n  iterateOverItems?: (item: {\n    value: Props['value']\n    label: Props['children']\n  }) => void\n}) {\n  const optionsCount =\n    React.Children.count(children) + (dataList?.length || 0)\n\n  const createOption = (props: OptionProps, i: number) => {\n    const { value, title, children, error, help, ...rest } = props\n\n    const label = title ?? children\n    const suffix = help ? (\n      <HelpButton size=\"small\" title={convertJsxToString(help.title)}>\n        {help.content}\n      </HelpButton>\n    ) : undefined\n\n    iterateOverItems?.({ value, label })\n\n    const Component = (\n      variant === 'radio' ? Radio : ToggleButton\n    ) as typeof Radio & typeof ToggleButton\n\n    return (\n      <Component\n        id={optionsCount === 1 ? id : undefined}\n        key={`option-${i}-${id}`}\n        label={variant === 'radio' ? label : undefined}\n        text={variant === 'button' ? label : undefined}\n        value={String(value ?? valueProp ?? '')}\n        status={\n          (hasError || checkForError([error, info, warning])) && 'error'\n        }\n        suffix={suffix}\n        {...htmlAttributes}\n        {...rest}\n      />\n    )\n  }\n\n  return [\n    ...(dataList || []).map((props, i) => {\n      return createOption(props as OptionProps, i)\n    }),\n    ...(mapOptions(children, { createOption }) || []),\n  ].filter(Boolean)\n}\n\nexport function mapOptions(\n  children: React.ReactNode,\n  {\n    createOption,\n  }: { createOption: (props: OptionProps, i: number) => React.ReactNode }\n) {\n  return React.Children.map(\n    children,\n    (child: React.ReactElement<OptionProps>, i) => {\n      if (React.isValidElement(child)) {\n        if (child.type === OptionField) {\n          return createOption(child.props, i)\n        }\n\n        if (child.props.children) {\n          const nestedChildren = mapOptions(child.props.children, {\n            createOption,\n          })\n          return React.cloneElement(child, child.props, nestedChildren)\n        }\n      }\n\n      return child\n    }\n  )\n}\n\nexport function makeOptions<T = DrawerListProps['data']>(\n  children: React.ReactNode,\n  transformSelection?: Props['transformSelection']\n): T {\n  return React.Children.map(children, (child) => {\n    if (child?.['props']?.children?.type === OptionField) {\n      child = child['props'].children\n    }\n\n    if (React.isValidElement(child) && child.type === OptionField) {\n      const props = child.props as OptionFieldProps\n      const title = props.title ?? props.children ?? <em>Untitled</em>\n      const content = props.text ? [title, props.text] : title\n      const selected_value = transformSelection\n        ? transformSelection(props)\n        : undefined\n      const selectedKey = String(props.value ?? '')\n      const disabled = props.disabled\n      const style = props.style\n\n      return { selectedKey, selected_value, content, disabled, style }\n    }\n\n    // For other children, just show them as content\n    if (child) {\n      return {\n        content: child,\n      }\n    }\n  }) as T\n}\n\nfunction renderDropdownItems(\n  data: Data,\n  transformSelection?: Props['transformSelection']\n) {\n  return (\n    data?.map((props) => {\n      const { value, title, text, disabled, style } = props\n      return {\n        selectedKey: value,\n        content: (text ? [title, text] : title) || <em>Untitled</em>,\n        selected_value: transformSelection\n          ? transformSelection(props)\n          : undefined,\n        disabled,\n        style,\n      }\n    }) || []\n  )\n}\n\nSelection._supportsSpacingProps = true\nexport default Selection\n"],"mappings":"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"}

package/es/extensions/forms/Field/Selection/SelectionDocs.js

@@ -9,6 +9,11 @@ export const SelectionProperties = {
     type: ['number', 'string'],
     status: 'optional'
   },
+  transformSelection: {
+    doc: 'Transform the displayed selection for Dropdown and Autocomplete variant. Use it to display a different value than the one in the data set. The first parameter is the props of the Option component or data item. You can return a React.Node that will be displayed in the selection.',
+    type: 'function',
+    status: 'optional'
+  },
   optionsLayout: {
     doc: 'Layout for the list of options. Can be `horizontal` or `vertical`.',
     type: 'string',

package/es/extensions/forms/Field/Selection/SelectionDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectionDocs.js","names":["SelectionProperties","variant","doc","type","status","value","optionsLayout","width","data","dataPath","autocompleteProps","dropdownProps","children"],"sources":["../../../../../../src/extensions/forms/Field/Selection/SelectionDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const SelectionProperties: PropertiesTableProps = {\n  variant: {\n    doc: 'Choice of UI feature. Can be: `dropdown`, `autocomplete`, `radio` or `button`.',\n    type: 'string',\n    status: 'optional',\n  },\n  value: {\n    doc: 'Defines the `value`. When using variant `radio` or `button`, value has to be a `string`.',\n    type: ['number', 'string'],\n    status: 'optional',\n  },\n  optionsLayout: {\n    doc: 'Layout for the list of options. Can be `horizontal` or `vertical`.',\n    type: 'string',\n    status: 'optional',\n  },\n  width: {\n    doc: '`small`, `medium` or `large` for predefined standard widths, `stretch` for fill available width.',\n    type: ['string', 'false'],\n    status: 'optional',\n  },\n  data: {\n    doc: 'Data to be used for the component. The object needs to have a `value` and a `title` property. Provide the Dropdown or Autocomplete data in the format documented here: [Dropdown](/uilib/components/dropdown) and [Autocomplete](/uilib/components/autocomplete) documentation.',\n    type: 'array',\n    status: 'optional',\n  },\n  dataPath: {\n    doc: 'The path to the context data (Form.Handler). The context data object needs to have a `value` and a `title` property. The generated options will be placed above given JSX based children.',\n    type: 'string',\n    status: 'optional',\n  },\n  autocompleteProps: {\n    doc: 'Forward any additional props (camelCase) to the [Autocomplete](/uilib/components/autocomplete/) component.',\n    type: 'object',\n    status: 'optional',\n  },\n  dropdownProps: {\n    doc: 'Forward any additional props (camelCase) to the [Dropdown](/uilib/components/dropdown/) component.',\n    type: 'object',\n    status: 'optional',\n  },\n  children: {\n    doc: 'For providing Option components, and other children.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,mBAAyC,GAAG;EACvDC,OAAO,EAAE;IACPC,GAAG,EAAE,gFAAgF;IACrFC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,KAAK,EAAE;IACLH,GAAG,EAAE,0FAA0F;IAC/FC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV,CAAC;EACDE,aAAa,EAAE;IACbJ,GAAG,EAAE,oEAAoE;IACzEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,KAAK,EAAE;IACLL,GAAG,EAAE,kGAAkG;IACvGC,IAAI,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC;IACzBC,MAAM,EAAE;EACV,CAAC;EACDI,IAAI,EAAE;IACJN,GAAG,EAAE,iRAAiR;IACtRC,IAAI,EAAE,OAAO;IACbC,MAAM,EAAE;EACV,CAAC;EACDK,QAAQ,EAAE;IACRP,GAAG,EAAE,2LAA2L;IAChMC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDM,iBAAiB,EAAE;IACjBR,GAAG,EAAE,4GAA4G;IACjHC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDO,aAAa,EAAE;IACbT,GAAG,EAAE,oGAAoG;IACzGC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDQ,QAAQ,EAAE;IACRV,GAAG,EAAE,sDAAsD;IAC3DC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV;AACF,CAAC"}
+{"version":3,"file":"SelectionDocs.js","names":["SelectionProperties","variant","doc","type","status","value","transformSelection","optionsLayout","width","data","dataPath","autocompleteProps","dropdownProps","children"],"sources":["../../../../../../src/extensions/forms/Field/Selection/SelectionDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const SelectionProperties: PropertiesTableProps = {\n  variant: {\n    doc: 'Choice of UI feature. Can be: `dropdown`, `autocomplete`, `radio` or `button`.',\n    type: 'string',\n    status: 'optional',\n  },\n  value: {\n    doc: 'Defines the `value`. When using variant `radio` or `button`, value has to be a `string`.',\n    type: ['number', 'string'],\n    status: 'optional',\n  },\n  transformSelection: {\n    doc: 'Transform the displayed selection for Dropdown and Autocomplete variant. Use it to display a different value than the one in the data set. The first parameter is the props of the Option component or data item. You can return a React.Node that will be displayed in the selection.',\n    type: 'function',\n    status: 'optional',\n  },\n  optionsLayout: {\n    doc: 'Layout for the list of options. Can be `horizontal` or `vertical`.',\n    type: 'string',\n    status: 'optional',\n  },\n  width: {\n    doc: '`small`, `medium` or `large` for predefined standard widths, `stretch` for fill available width.',\n    type: ['string', 'false'],\n    status: 'optional',\n  },\n  data: {\n    doc: 'Data to be used for the component. The object needs to have a `value` and a `title` property. Provide the Dropdown or Autocomplete data in the format documented here: [Dropdown](/uilib/components/dropdown) and [Autocomplete](/uilib/components/autocomplete) documentation.',\n    type: 'array',\n    status: 'optional',\n  },\n  dataPath: {\n    doc: 'The path to the context data (Form.Handler). The context data object needs to have a `value` and a `title` property. The generated options will be placed above given JSX based children.',\n    type: 'string',\n    status: 'optional',\n  },\n  autocompleteProps: {\n    doc: 'Forward any additional props (camelCase) to the [Autocomplete](/uilib/components/autocomplete/) component.',\n    type: 'object',\n    status: 'optional',\n  },\n  dropdownProps: {\n    doc: 'Forward any additional props (camelCase) to the [Dropdown](/uilib/components/dropdown/) component.',\n    type: 'object',\n    status: 'optional',\n  },\n  children: {\n    doc: 'For providing Option components, and other children.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,mBAAyC,GAAG;EACvDC,OAAO,EAAE;IACPC,GAAG,EAAE,gFAAgF;IACrFC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,KAAK,EAAE;IACLH,GAAG,EAAE,0FAA0F;IAC/FC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV,CAAC;EACDE,kBAAkB,EAAE;IAClBJ,GAAG,EAAE,wRAAwR;IAC7RC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV,CAAC;EACDG,aAAa,EAAE;IACbL,GAAG,EAAE,oEAAoE;IACzEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,KAAK,EAAE;IACLN,GAAG,EAAE,kGAAkG;IACvGC,IAAI,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC;IACzBC,MAAM,EAAE;EACV,CAAC;EACDK,IAAI,EAAE;IACJP,GAAG,EAAE,iRAAiR;IACtRC,IAAI,EAAE,OAAO;IACbC,MAAM,EAAE;EACV,CAAC;EACDM,QAAQ,EAAE;IACRR,GAAG,EAAE,2LAA2L;IAChMC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDO,iBAAiB,EAAE;IACjBT,GAAG,EAAE,4GAA4G;IACjHC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDQ,aAAa,EAAE;IACbV,GAAG,EAAE,oGAAoG;IACzGC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDS,QAAQ,EAAE;IACRX,GAAG,EAAE,sDAAsD;IAC3DC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV;AACF,CAAC"}