@dnb/eufemia 10.75.1 → 10.75.3

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

@@ -1 +1 @@
-{"version":3,"file":"PhoneNumber.js","names":["React","useMemo","useContext","useCallback","useEffect","useRef","Autocomplete","classnames","useCountries","StringField","CompositionField","useFieldProps","pickSpacingProps","SharedContext","countryFilter","getCountryData","useTranslation","defaultCountryCode","defaultPlaceholder","defaultMask","PhoneNumber","props","_sharedContext$locale","_props$inputRef","_countryCodeRef$curre","sharedContext","label","defaultLabel","countryCodeLabel","defaultCountryCodeLabel","errorRequired","lang","locale","split","countryCodeRef","emptyValue","prevCountryCodeRef","current","numberRef","dataRef","langRef","wasFilled","currentCountryRef","errorMessages","_objectSpread","validateRequired","value","_ref","required","isChanged","error","countryCode","phoneNumber","splitValue","undefined","fromExternal","external","omitCountryCodeField","toEvent","schema","_props$schema","type","pattern","defaultProps","ref","preparedProps","inputRef","id","path","itemPath","className","countryCodeFieldClassName","numberFieldClassName","countryCodePlaceholder","placeholder","labelSrOnly","numberMask","countries","ccFilter","info","warning","size","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","prepareEventValues","_currentCountryRef$cu","arguments","cdcVal","replace","item","find","_item$country","iso","callOnChange","data","eventValues","callOnBlurOrFocus","hasFocus","handleCountryCodeChange","_ref2","_data$selectedKey","selectedKey","trim","handleNumberChange","handleOnBlur","handleOnFocus","handleCountryCodeFocus","_ref3","updateData","onTypeHandler","_ref4","_event$nativeEvent","revalidateInputValue","event","nativeEvent","test","_ref5","window","requestAnimationFrame","isDefault","includes","fieldBlockProps","createElement","mode","label_direction","label_sr_only","status","on_focus","on_blur","on_change","on_type","independent_width","search_numbers","keep_selection","selectall","autoComplete","no_animation","noAnimation","layout","mask","Array","fill","onFocus","onBlur","onChange","innerRef","breakout","outset","inputMode","_country$i18n$lang","name","i18n","en","code","selected_value","search_content","content","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 } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport classnames from 'classnames'\nimport {\n  CountryISO,\n  type CountryLang,\n  type CountryType,\n} from '../../constants/countries'\nimport useCountries from '../SelectCountry/useCountries'\nimport StringField, { Props as StringFieldProps } from '../String'\nimport { Props as FieldBlockProps } from '../../FieldBlock'\nimport CompositionField from '../Composition'\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 AdditionalArgs = {\n  phoneNumber: string\n  countryCode: string\n  iso: string\n}\n\nexport type Props = Omit<\n  FieldPropsWithExtraValue<string, AdditionalArgs, undefined | string>,\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} & Pick<StringFieldProps, 'size'>\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\ntype EventValues = {\n  countryCode?: string\n  phoneNumber?: string\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 prevCountryCodeRef = useRef(countryCodeRef.current)\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  const currentCountryRef = useRef<CountryType>()\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 [countryCode, phoneNumber] = splitValue(external)\n      if (!countryCode && !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    labelSrOnly,\n    numberMask,\n    countries: ccFilter = 'Prioritized',\n    emptyValue,\n    info,\n    warning,\n    size,\n    error,\n    hasError,\n    disabled,\n    width = props.omitCountryCodeField ? 'medium' : '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 { countries } = useCountries()\n\n  const updateCurrentDataSet = useCallback(() => {\n    dataRef.current = getCountryData({\n      countries,\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  }, [countries, lang, ccFilter, filter])\n\n  const prepareEventValues = useCallback(\n    ({\n      countryCode = countryCodeRef.current || emptyValue,\n      phoneNumber = numberRef.current || emptyValue,\n    }: EventValues = {}) => {\n      if (!currentCountryRef.current) {\n        type Item = DrawerListDataArrayItem & { country: CountryType }\n\n        const cdcVal = countryCode?.replace(/^\\+/, '')\n        const item = dataRef.current.find((item: Item) => {\n          const cdc = item?.country?.cdc\n          return cdc === cdcVal\n        }) as Item\n\n        currentCountryRef.current = item?.country\n      }\n\n      return {\n        ...(!omitCountryCodeField ? { countryCode } : {}),\n        phoneNumber,\n        iso: currentCountryRef.current?.iso as CountryISO,\n      }\n    },\n    [emptyValue, omitCountryCodeField]\n  )\n\n  const callOnChange = useCallback(\n    (data: EventValues) => {\n      const eventValues = prepareEventValues(data)\n      handleChange(\n        joinValue([eventValues.countryCode, eventValues.phoneNumber]),\n        eventValues\n      )\n    },\n    [prepareEventValues, handleChange]\n  )\n\n  const callOnBlurOrFocus = useCallback(\n    (hasFocus: boolean) => {\n      setHasFocus(hasFocus, undefined, prepareEventValues())\n    },\n    [prepareEventValues, setHasFocus]\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 handleCountryCodeChange = useCallback(\n    ({\n      data,\n    }: {\n      data: { selectedKey: string; country: CountryType }\n    }) => {\n      const countryCode = (countryCodeRef.current =\n        data?.selectedKey?.trim() || emptyValue)\n      currentCountryRef.current = data?.country\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, countries, 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,\n    label: undefined,\n    help: undefined,\n    ...pickSpacingProps(props),\n  }\n\n  return (\n    <CompositionField {...fieldBlockProps}>\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          label_sr_only={labelSrOnly}\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          selectall\n          autoComplete=\"tel-country-code\"\n          no_animation={props.noAnimation}\n          size={size}\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        labelSrOnly={labelSrOnly}\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=\"stretch\"\n        help={{ ...help, breakout: false, outset: false }}\n        required={required}\n        errorMessages={errorMessages}\n        validateInitially={validateInitially}\n        validateContinuously={continuousValidation || validateContinuously}\n        validateUnchanged={validateUnchanged}\n        inputMode=\"tel\"\n        size={size}\n      />\n    </CompositionField>\n  )\n}\n\nfunction makeObject(country: CountryType, lang: string) {\n  const name = country.i18n[lang] ?? country.i18n.en\n  const code = formatCountryCode(country.cdc)\n  return {\n    selectedKey: code,\n    selected_value: `${country.iso} (${code})`,\n    search_content: [code, name],\n    content: [name, code],\n    country,\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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","ignoreList":[]}
+{"version":3,"file":"PhoneNumber.js","names":["React","useMemo","useContext","useCallback","useEffect","useRef","Autocomplete","classnames","useCountries","StringField","CompositionField","useFieldProps","pickSpacingProps","SharedContext","countryFilter","getCountryData","useTranslation","defaultCountryCode","defaultPlaceholder","defaultMask","PhoneNumber","props","_sharedContext$locale","_props$inputRef","_countryCodeRef$curre","sharedContext","label","defaultLabel","countryCodeLabel","defaultCountryCodeLabel","errorRequired","lang","locale","split","countryCodeRef","emptyValue","prevCountryCodeRef","current","numberRef","dataRef","langRef","wasFilled","currentCountryRef","errorMessages","_objectSpread","validateRequired","value","_ref","required","isChanged","error","countryCode","phoneNumber","splitValue","undefined","fromExternal","external","omitCountryCodeField","toEvent","schema","_props$schema","type","pattern","defaultProps","ref","preparedProps","inputRef","id","path","itemPath","className","countryCodeFieldClassName","numberFieldClassName","countryCodePlaceholder","placeholder","labelSrOnly","numberMask","countries","ccFilter","info","warning","size","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","prepareEventValues","_currentCountryRef$cu","arguments","cdcVal","replace","item","find","_item$country","iso","callOnChange","data","eventValues","callOnBlurOrFocus","hasFocus","handleCountryCodeChange","_ref2","_data$selectedKey","selectedKey","trim","handleNumberChange","handleOnBlur","handleOnFocus","handleCountryCodeFocus","_ref3","updateData","onTypeHandler","_ref4","_event$nativeEvent","revalidateInputValue","event","nativeEvent","test","_ref5","window","requestAnimationFrame","isDefault","includes","fieldBlockProps","createElement","mode","label_direction","label_sr_only","status","on_focus","on_blur","on_change","on_type","independent_width","search_numbers","keep_selection","selectall","autoComplete","no_animation","noAnimation","layout","mask","Array","fill","onFocus","onBlur","onChange","innerRef","breakout","outset","inputMode","_country$i18n$lang","name","i18n","en","code","selected_value","search_content","content","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 } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport classnames from 'classnames'\nimport {\n  CountryISO,\n  type CountryLang,\n  type CountryType,\n} from '../../constants/countries'\nimport useCountries from '../SelectCountry/useCountries'\nimport StringField, { Props as StringFieldProps } from '../String'\nimport { Props as FieldBlockProps } from '../../FieldBlock'\nimport CompositionField from '../Composition'\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 AdditionalArgs = {\n  phoneNumber: string\n  countryCode: string\n  iso: string\n}\n\nexport type Props = Omit<\n  FieldPropsWithExtraValue<string, AdditionalArgs, undefined | string>,\n  | 'layout'\n  | 'layoutOptions'\n  | 'labelSize'\n  | 'labelDescription'\n  | 'labelDescriptionInline'\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} & Pick<StringFieldProps, 'size'>\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\ntype EventValues = {\n  countryCode?: string\n  phoneNumber?: string\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 prevCountryCodeRef = useRef(countryCodeRef.current)\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  const currentCountryRef = useRef<CountryType>()\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 [countryCode, phoneNumber] = splitValue(external)\n      if (!countryCode && !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    labelSrOnly,\n    numberMask,\n    countries: ccFilter = 'Prioritized',\n    emptyValue,\n    info,\n    warning,\n    size,\n    error,\n    hasError,\n    disabled,\n    width = props.omitCountryCodeField ? 'medium' : '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 { countries } = useCountries()\n\n  const updateCurrentDataSet = useCallback(() => {\n    dataRef.current = getCountryData({\n      countries,\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  }, [countries, lang, ccFilter, filter])\n\n  const prepareEventValues = useCallback(\n    ({\n      countryCode = countryCodeRef.current || emptyValue,\n      phoneNumber = numberRef.current || emptyValue,\n    }: EventValues = {}) => {\n      if (!currentCountryRef.current) {\n        type Item = DrawerListDataArrayItem & { country: CountryType }\n\n        const cdcVal = countryCode?.replace(/^\\+/, '')\n        const item = dataRef.current.find((item: Item) => {\n          const cdc = item?.country?.cdc\n          return cdc === cdcVal\n        }) as Item\n\n        currentCountryRef.current = item?.country\n      }\n\n      return {\n        ...(!omitCountryCodeField ? { countryCode } : {}),\n        phoneNumber,\n        iso: currentCountryRef.current?.iso as CountryISO,\n      }\n    },\n    [emptyValue, omitCountryCodeField]\n  )\n\n  const callOnChange = useCallback(\n    (data: EventValues) => {\n      const eventValues = prepareEventValues(data)\n      handleChange(\n        joinValue([eventValues.countryCode, eventValues.phoneNumber]),\n        eventValues\n      )\n    },\n    [prepareEventValues, handleChange]\n  )\n\n  const callOnBlurOrFocus = useCallback(\n    (hasFocus: boolean) => {\n      setHasFocus(hasFocus, undefined, prepareEventValues())\n    },\n    [prepareEventValues, setHasFocus]\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 handleCountryCodeChange = useCallback(\n    ({\n      data,\n    }: {\n      data: { selectedKey: string; country: CountryType }\n    }) => {\n      const countryCode = (countryCodeRef.current =\n        data?.selectedKey?.trim() || emptyValue)\n      currentCountryRef.current = data?.country\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, countries, 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,\n    label: undefined,\n    help: undefined,\n    ...pickSpacingProps(props),\n  }\n\n  return (\n    <CompositionField {...fieldBlockProps}>\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          label_sr_only={labelSrOnly}\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          selectall\n          autoComplete=\"tel-country-code\"\n          no_animation={props.noAnimation}\n          size={size}\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        labelSrOnly={labelSrOnly}\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=\"stretch\"\n        help={{ ...help, breakout: false, outset: false }}\n        required={required}\n        errorMessages={errorMessages}\n        validateInitially={validateInitially}\n        validateContinuously={continuousValidation || validateContinuously}\n        validateUnchanged={validateUnchanged}\n        inputMode=\"tel\"\n        size={size}\n      />\n    </CompositionField>\n  )\n}\n\nfunction makeObject(country: CountryType, lang: string) {\n  const name = country.i18n[lang] ?? country.i18n.en\n  const code = formatCountryCode(country.cdc)\n  return {\n    selectedKey: code,\n    selected_value: `${country.iso} (${code})`,\n    search_content: [code, name],\n    content: [name, code],\n    country,\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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","ignoreList":[]}

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

@@ -1,5 +1,9 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { getFieldEventsWithTypes } from '../FieldDocs';
 import { stringProperties } from '../String/StringDocs';
+import { FieldProperties } from '../../Field/FieldDocs';
 export const PhoneNumberProperties = {
   countries: {
     doc: 'List only a certain set of countries: `Scandinavia`, `Nordic`, `Europe` or `Prioritized`(all countries [sorted by priority](/uilib/extensions/forms/feature-fields/SelectCountry/#filter-or-prioritize-country-listing)). Defaults to `Prioritized`.',
@@ -51,6 +55,9 @@ export const PhoneNumberProperties = {
     type: 'string | false',
     status: 'optional'
   },
+  label: _objectSpread(_objectSpread({}, FieldProperties.label), {}, {
+    doc: 'Field label to show above / before the phone number input field.'
+  }),
   size: stringProperties.size,
   '[Space](/uilib/layout/space/properties)': {
     doc: 'Spacing properties like `top` or `bottom` are supported.',

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

@@ -1 +1 @@
-{"version":3,"file":"PhoneNumberDocs.js","names":["getFieldEventsWithTypes","stringProperties","PhoneNumberProperties","countries","doc","type","status","filterCountries","pattern","omitCountryCodeField","countryCodeFieldClassName","numberFieldClassName","countryCodePlaceholder","countryCodeLabel","numberMask","width","size","PhoneNumberSpecificEvents","onChange","onCountryCodeChange","onNumberChange","PhoneNumberGeneralEvents","optional"],"sources":["../../../../../../src/extensions/forms/Field/PhoneNumber/PhoneNumberDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\nimport { getFieldEventsWithTypes } from '../FieldDocs'\nimport { stringProperties } from '../String/StringDocs'\n\nexport const PhoneNumberProperties: PropertiesTableProps = {\n  countries: {\n    doc: 'List only a certain set of countries: `Scandinavia`, `Nordic`, `Europe` or `Prioritized`(all countries [sorted by priority](/uilib/extensions/forms/feature-fields/SelectCountry/#filter-or-prioritize-country-listing)). Defaults to `Prioritized`.',\n    type: 'string',\n    status: 'optional',\n  },\n  filterCountries: {\n    doc: 'Use this prop to filter out certain countries. The function receives the country object and should return a boolean. Returning `false` will omit the country.',\n    type: 'function',\n    status: 'optional',\n  },\n  pattern: {\n    doc: 'Validation based on regex pattern for the number field e.g. `pattern=\"^[49]+\"`.',\n    type: 'string',\n    status: 'optional',\n  },\n  omitCountryCodeField: {\n    doc: 'If `true` is given, then everything related to country code is removed.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  countryCodeFieldClassName: {\n    doc: 'Class name for the country code component.',\n    type: 'string',\n    status: 'optional',\n  },\n  numberFieldClassName: {\n    doc: 'Class name for the number component.',\n    type: 'string',\n    status: 'optional',\n  },\n  countryCodePlaceholder: {\n    doc: 'Placeholder for the country code field.',\n    type: 'string',\n    status: 'optional',\n  },\n  countryCodeLabel: {\n    doc: 'Label to show above / before the country code field.',\n    type: 'string',\n    status: 'optional',\n  },\n  numberMask: {\n    doc: 'See property `mask` of the [InputMasked](/uilib/components/input-masked/properties) component.',\n    type: 'Various',\n    status: 'optional',\n  },\n  width: {\n    doc: '`large` for predefined standard width, `stretch` for fill available width.',\n    type: 'string | false',\n    status: 'optional',\n  },\n  size: stringProperties.size,\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n\nexport const PhoneNumberSpecificEvents: PropertiesTableProps = {\n  onChange: {\n    doc: 'Callback on phone number and country code change.',\n    type: '(value?: string, additionalArgs?: { countryCode?: string, phoneNumber?: string, iso?: string }) => void',\n    status: 'optional',\n  },\n  onCountryCodeChange: {\n    doc: 'Callback on country code change.',\n    type: '(value?: string) => void',\n    status: 'optional',\n  },\n  onNumberChange: {\n    doc: 'Callback on phone number change.',\n    type: '(value?: string) => void',\n    status: 'optional',\n  },\n}\n\nexport const PhoneNumberGeneralEvents = getFieldEventsWithTypes(\n  { type: 'string', optional: true },\n  { type: 'object' }\n)\n"],"mappings":"AACA,SAASA,uBAAuB,QAAQ,cAAc;AACtD,SAASC,gBAAgB,QAAQ,sBAAsB;AAEvD,OAAO,MAAMC,qBAA2C,GAAG;EACzDC,SAAS,EAAE;IACTC,GAAG,EAAE,sPAAsP;IAC3PC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,eAAe,EAAE;IACfH,GAAG,EAAE,+JAA+J;IACpKC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV,CAAC;EACDE,OAAO,EAAE;IACPJ,GAAG,EAAE,iFAAiF;IACtFC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,oBAAoB,EAAE;IACpBL,GAAG,EAAE,yEAAyE;IAC9EC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDI,yBAAyB,EAAE;IACzBN,GAAG,EAAE,4CAA4C;IACjDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDK,oBAAoB,EAAE;IACpBP,GAAG,EAAE,sCAAsC;IAC3CC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDM,sBAAsB,EAAE;IACtBR,GAAG,EAAE,yCAAyC;IAC9CC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDO,gBAAgB,EAAE;IAChBT,GAAG,EAAE,sDAAsD;IAC3DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDQ,UAAU,EAAE;IACVV,GAAG,EAAE,gGAAgG;IACrGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDS,KAAK,EAAE;IACLX,GAAG,EAAE,4EAA4E;IACjFC,IAAI,EAAE,gBAAgB;IACtBC,MAAM,EAAE;EACV,CAAC;EACDU,IAAI,EAAEf,gBAAgB,CAACe,IAAI;EAC3B,yCAAyC,EAAE;IACzCZ,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAMW,yBAA+C,GAAG;EAC7DC,QAAQ,EAAE;IACRd,GAAG,EAAE,mDAAmD;IACxDC,IAAI,EAAE,yGAAyG;IAC/GC,MAAM,EAAE;EACV,CAAC;EACDa,mBAAmB,EAAE;IACnBf,GAAG,EAAE,kCAAkC;IACvCC,IAAI,EAAE,0BAA0B;IAChCC,MAAM,EAAE;EACV,CAAC;EACDc,cAAc,EAAE;IACdhB,GAAG,EAAE,kCAAkC;IACvCC,IAAI,EAAE,0BAA0B;IAChCC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAMe,wBAAwB,GAAGrB,uBAAuB,CAC7D;EAAEK,IAAI,EAAE,QAAQ;EAAEiB,QAAQ,EAAE;AAAK,CAAC,EAClC;EAAEjB,IAAI,EAAE;AAAS,CACnB,CAAC","ignoreList":[]}
+{"version":3,"file":"PhoneNumberDocs.js","names":["getFieldEventsWithTypes","stringProperties","FieldProperties","PhoneNumberProperties","countries","doc","type","status","filterCountries","pattern","omitCountryCodeField","countryCodeFieldClassName","numberFieldClassName","countryCodePlaceholder","countryCodeLabel","numberMask","width","label","_objectSpread","size","PhoneNumberSpecificEvents","onChange","onCountryCodeChange","onNumberChange","PhoneNumberGeneralEvents","optional"],"sources":["../../../../../../src/extensions/forms/Field/PhoneNumber/PhoneNumberDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\nimport { getFieldEventsWithTypes } from '../FieldDocs'\nimport { stringProperties } from '../String/StringDocs'\nimport { FieldProperties } from '../../Field/FieldDocs'\n\nexport const PhoneNumberProperties: PropertiesTableProps = {\n  countries: {\n    doc: 'List only a certain set of countries: `Scandinavia`, `Nordic`, `Europe` or `Prioritized`(all countries [sorted by priority](/uilib/extensions/forms/feature-fields/SelectCountry/#filter-or-prioritize-country-listing)). Defaults to `Prioritized`.',\n    type: 'string',\n    status: 'optional',\n  },\n  filterCountries: {\n    doc: 'Use this prop to filter out certain countries. The function receives the country object and should return a boolean. Returning `false` will omit the country.',\n    type: 'function',\n    status: 'optional',\n  },\n  pattern: {\n    doc: 'Validation based on regex pattern for the number field e.g. `pattern=\"^[49]+\"`.',\n    type: 'string',\n    status: 'optional',\n  },\n  omitCountryCodeField: {\n    doc: 'If `true` is given, then everything related to country code is removed.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  countryCodeFieldClassName: {\n    doc: 'Class name for the country code component.',\n    type: 'string',\n    status: 'optional',\n  },\n  numberFieldClassName: {\n    doc: 'Class name for the number component.',\n    type: 'string',\n    status: 'optional',\n  },\n  countryCodePlaceholder: {\n    doc: 'Placeholder for the country code field.',\n    type: 'string',\n    status: 'optional',\n  },\n  countryCodeLabel: {\n    doc: 'Label to show above / before the country code field.',\n    type: 'string',\n    status: 'optional',\n  },\n  numberMask: {\n    doc: 'See property `mask` of the [InputMasked](/uilib/components/input-masked/properties) component.',\n    type: 'Various',\n    status: 'optional',\n  },\n  width: {\n    doc: '`large` for predefined standard width, `stretch` for fill available width.',\n    type: 'string | false',\n    status: 'optional',\n  },\n  label: {\n    ...FieldProperties.label,\n    doc: 'Field label to show above / before the phone number input field.',\n  },\n  size: stringProperties.size,\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n\nexport const PhoneNumberSpecificEvents: PropertiesTableProps = {\n  onChange: {\n    doc: 'Callback on phone number and country code change.',\n    type: '(value?: string, additionalArgs?: { countryCode?: string, phoneNumber?: string, iso?: string }) => void',\n    status: 'optional',\n  },\n  onCountryCodeChange: {\n    doc: 'Callback on country code change.',\n    type: '(value?: string) => void',\n    status: 'optional',\n  },\n  onNumberChange: {\n    doc: 'Callback on phone number change.',\n    type: '(value?: string) => void',\n    status: 'optional',\n  },\n}\n\nexport const PhoneNumberGeneralEvents = getFieldEventsWithTypes(\n  { type: 'string', optional: true },\n  { type: 'object' }\n)\n"],"mappings":";;;AACA,SAASA,uBAAuB,QAAQ,cAAc;AACtD,SAASC,gBAAgB,QAAQ,sBAAsB;AACvD,SAASC,eAAe,QAAQ,uBAAuB;AAEvD,OAAO,MAAMC,qBAA2C,GAAG;EACzDC,SAAS,EAAE;IACTC,GAAG,EAAE,sPAAsP;IAC3PC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,eAAe,EAAE;IACfH,GAAG,EAAE,+JAA+J;IACpKC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV,CAAC;EACDE,OAAO,EAAE;IACPJ,GAAG,EAAE,iFAAiF;IACtFC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,oBAAoB,EAAE;IACpBL,GAAG,EAAE,yEAAyE;IAC9EC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDI,yBAAyB,EAAE;IACzBN,GAAG,EAAE,4CAA4C;IACjDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDK,oBAAoB,EAAE;IACpBP,GAAG,EAAE,sCAAsC;IAC3CC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDM,sBAAsB,EAAE;IACtBR,GAAG,EAAE,yCAAyC;IAC9CC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDO,gBAAgB,EAAE;IAChBT,GAAG,EAAE,sDAAsD;IAC3DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDQ,UAAU,EAAE;IACVV,GAAG,EAAE,gGAAgG;IACrGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDS,KAAK,EAAE;IACLX,GAAG,EAAE,4EAA4E;IACjFC,IAAI,EAAE,gBAAgB;IACtBC,MAAM,EAAE;EACV,CAAC;EACDU,KAAK,EAAAC,aAAA,CAAAA,aAAA,KACAhB,eAAe,CAACe,KAAK;IACxBZ,GAAG,EAAE;EAAkE,EACxE;EACDc,IAAI,EAAElB,gBAAgB,CAACkB,IAAI;EAC3B,yCAAyC,EAAE;IACzCd,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAMa,yBAA+C,GAAG;EAC7DC,QAAQ,EAAE;IACRhB,GAAG,EAAE,mDAAmD;IACxDC,IAAI,EAAE,yGAAyG;IAC/GC,MAAM,EAAE;EACV,CAAC;EACDe,mBAAmB,EAAE;IACnBjB,GAAG,EAAE,kCAAkC;IACvCC,IAAI,EAAE,0BAA0B;IAChCC,MAAM,EAAE;EACV,CAAC;EACDgB,cAAc,EAAE;IACdlB,GAAG,EAAE,kCAAkC;IACvCC,IAAI,EAAE,0BAA0B;IAChCC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAMiB,wBAAwB,GAAGxB,uBAAuB,CAC7D;EAAEM,IAAI,EAAE,QAAQ;EAAEmB,QAAQ,EAAE;AAAK,CAAC,EAClC;EAAEnB,IAAI,EAAE;AAAS,CACnB,CAAC","ignoreList":[]}

package/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCityDocs.js

@@ -2,7 +2,7 @@ import { FieldProperties } from '../FieldDocs';
 import { stringProperties } from '../String/StringDocs';
 export const PostalCodeAndCityProperties = {
   countryCode: {
-    doc: 'Defines which country the postal code and city is for, based on the [ISO 3166-1 alpha-2 code](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2) i.e. `NO`, `DE` etc. ' + 'Setting it to anything other than `NO` will remove the default norwegian postal code pattern. ' + 'You can also use the value of another field to define the countryCode, by using a path value i.e. `/myCountryCodePath`. ' + 'Defaults to `NO`',
+    doc: 'Defines which country the postal code and city is for, based on the [ISO 3166-1 alpha-2 code](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2) i.e. `NO`, `DE` etc. ' + 'Setting it to anything other than `NO` will remove the default norwegian postal code pattern. ' + 'You can also use the value of another field to define the countryCode, by using a path value i.e. `/myCountryCodePath`. ' + 'Defaults to `NO`.',
     type: ['Path', 'string'],
     status: 'optional'
   },

package/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCityDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"PostalCodeAndCityDocs.js","names":["FieldProperties","stringProperties","PostalCodeAndCityProperties","countryCode","doc","type","status","postalCode","city","help","size"],"sources":["../../../../../../src/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCityDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\nimport { FieldProperties } from '../FieldDocs'\nimport { stringProperties } from '../String/StringDocs'\n\nexport const PostalCodeAndCityProperties: PropertiesTableProps = {\n  countryCode: {\n    doc:\n      'Defines which country the postal code and city is for, based on the [ISO 3166-1 alpha-2 code](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2) i.e. `NO`, `DE` etc. ' +\n      'Setting it to anything other than `NO` will remove the default norwegian postal code pattern. ' +\n      'You can also use the value of another field to define the countryCode, by using a path value i.e. `/myCountryCodePath`. ' +\n      'Defaults to `NO`',\n    type: ['Path', 'string'],\n    status: 'optional',\n  },\n  postalCode: {\n    doc: 'Properties for the [Field.String](/uilib/extensions/forms/base-fields/String/) component for postal code.',\n    type: 'object',\n    status: 'required',\n  },\n  city: {\n    doc: 'Properties for the [Field.String](/uilib/extensions/forms/base-fields/String/) component for city.',\n    type: 'object',\n    status: 'required',\n  },\n  help: FieldProperties.help,\n  size: stringProperties.size,\n}\n"],"mappings":"AACA,SAASA,eAAe,QAAQ,cAAc;AAC9C,SAASC,gBAAgB,QAAQ,sBAAsB;AAEvD,OAAO,MAAMC,2BAAiD,GAAG;EAC/DC,WAAW,EAAE;IACXC,GAAG,EACD,uKAAuK,GACvK,gGAAgG,GAChG,0HAA0H,GAC1H,kBAAkB;IACpBC,IAAI,EAAE,CAAC,MAAM,EAAE,QAAQ,CAAC;IACxBC,MAAM,EAAE;EACV,CAAC;EACDC,UAAU,EAAE;IACVH,GAAG,EAAE,2GAA2G;IAChHC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDE,IAAI,EAAE;IACJJ,GAAG,EAAE,oGAAoG;IACzGC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,IAAI,EAAET,eAAe,CAACS,IAAI;EAC1BC,IAAI,EAAET,gBAAgB,CAACS;AACzB,CAAC","ignoreList":[]}
+{"version":3,"file":"PostalCodeAndCityDocs.js","names":["FieldProperties","stringProperties","PostalCodeAndCityProperties","countryCode","doc","type","status","postalCode","city","help","size"],"sources":["../../../../../../src/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCityDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\nimport { FieldProperties } from '../FieldDocs'\nimport { stringProperties } from '../String/StringDocs'\n\nexport const PostalCodeAndCityProperties: PropertiesTableProps = {\n  countryCode: {\n    doc:\n      'Defines which country the postal code and city is for, based on the [ISO 3166-1 alpha-2 code](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2) i.e. `NO`, `DE` etc. ' +\n      'Setting it to anything other than `NO` will remove the default norwegian postal code pattern. ' +\n      'You can also use the value of another field to define the countryCode, by using a path value i.e. `/myCountryCodePath`. ' +\n      'Defaults to `NO`.',\n    type: ['Path', 'string'],\n    status: 'optional',\n  },\n  postalCode: {\n    doc: 'Properties for the [Field.String](/uilib/extensions/forms/base-fields/String/) component for postal code.',\n    type: 'object',\n    status: 'required',\n  },\n  city: {\n    doc: 'Properties for the [Field.String](/uilib/extensions/forms/base-fields/String/) component for city.',\n    type: 'object',\n    status: 'required',\n  },\n  help: FieldProperties.help,\n  size: stringProperties.size,\n}\n"],"mappings":"AACA,SAASA,eAAe,QAAQ,cAAc;AAC9C,SAASC,gBAAgB,QAAQ,sBAAsB;AAEvD,OAAO,MAAMC,2BAAiD,GAAG;EAC/DC,WAAW,EAAE;IACXC,GAAG,EACD,uKAAuK,GACvK,gGAAgG,GAChG,0HAA0H,GAC1H,mBAAmB;IACrBC,IAAI,EAAE,CAAC,MAAM,EAAE,QAAQ,CAAC;IACxBC,MAAM,EAAE;EACV,CAAC;EACDC,UAAU,EAAE;IACVH,GAAG,EAAE,2GAA2G;IAChHC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDE,IAAI,EAAE;IACJJ,GAAG,EAAE,oGAAoG;IACzGC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,IAAI,EAAET,eAAe,CAACS,IAAI;EAC1BC,IAAI,EAAET,gBAAgB,CAACS;AACzB,CAAC","ignoreList":[]}

package/extensions/forms/Field/Provider/useFieldProvider.d.ts

@@ -85,7 +85,7 @@ declare function useFieldProvider(props?: Omit<FieldProviderProps, 'children'>):
             };
             getValueByPath: import("../../hooks/useDataValue").GetValueByPath<unknown>;
             getSourceValue: import("../../hooks/useDataValue").GetValueByPath<unknown>;
-            setFieldEventListener: (path: string, type: "onSubmit" | "onBeforeSubmit" | "onSubmitCall" | "onSubmitRequest" | "onBeforeCommit" | "onPathChange" | "onMount", callback: (params?: {
+            setFieldEventListener: (path: string, type: "onSubmit" | "onBeforeSubmit" | "onSubmitCall" | "onSubmitRequest" | "onBeforeCommit" | "onPathChange" | "onMount" | "onSetFieldError", callback: (params?: {
                 value: unknown;
             } | {
                 preventSubmit: () => void;
@@ -107,7 +107,7 @@ declare function useFieldProvider(props?: Omit<FieldProviderProps, 'children'>):
             };
             getValueByPath: import("../../hooks/useDataValue").GetValueByPath<unknown>;
             getSourceValue: import("../../hooks/useDataValue").GetValueByPath<unknown>;
-            setFieldEventListener: (path: string, type: "onSubmit" | "onBeforeSubmit" | "onSubmitCall" | "onSubmitRequest" | "onBeforeCommit" | "onPathChange" | "onMount", callback: (params?: {
+            setFieldEventListener: (path: string, type: "onSubmit" | "onBeforeSubmit" | "onSubmitCall" | "onSubmitRequest" | "onBeforeCommit" | "onPathChange" | "onMount" | "onSetFieldError", callback: (params?: {
                 value: unknown;
             } | {
                 preventSubmit: () => void;
@@ -129,7 +129,7 @@ declare function useFieldProvider(props?: Omit<FieldProviderProps, 'children'>):
             };
             getValueByPath: import("../../hooks/useDataValue").GetValueByPath<unknown>;
             getSourceValue: import("../../hooks/useDataValue").GetValueByPath<unknown>;
-            setFieldEventListener: (path: string, type: "onSubmit" | "onBeforeSubmit" | "onSubmitCall" | "onSubmitRequest" | "onBeforeCommit" | "onPathChange" | "onMount", callback: (params?: {
+            setFieldEventListener: (path: string, type: "onSubmit" | "onBeforeSubmit" | "onSubmitCall" | "onSubmitRequest" | "onBeforeCommit" | "onPathChange" | "onMount" | "onSetFieldError", callback: (params?: {
                 value: unknown;
             } | {
                 preventSubmit: () => void;

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

@@ -50,7 +50,7 @@ export const SelectionProperties = {
     status: 'optional'
   },
   children: {
-    doc: 'For providing Option components, and other children.',
+    doc: 'For providing [Field.Option](/uilib/extensions/forms/base-fields/Option/) components, and other children.',
     type: 'React.Node',
     status: 'optional'
   }

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

@@ -1 +1 @@
-{"version":3,"file":"SelectionDocs.js","names":["SelectionProperties","variant","doc","type","status","value","transformSelection","optionsLayout","width","data","dataPath","autocompleteProps","dropdownProps","size","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`, `button`, `radio`, `radio-list`.',\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. `onType` will additionally provide the `value` parameter with `emptyValue` support in addition to the internal `dataContext`.',\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  size: {\n    doc: 'The sizes you can choose is small (1.5rem), default (2rem), medium (2.5rem) and large (3rem) are supported component sizes. Defaults to default / null. Also, if you define a number like size=\"2\" then it will be forwarded as the input element attribute. Consider rather setting field sizes with [Form.Appearance](/uilib/extensions/forms/Form/Appearance/).',\n    type: 'string',\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,4FAA4F;IACjGC,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,0OAA0O;IAC/OC,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,IAAI,EAAE;IACJX,GAAG,EAAE,oWAAoW;IACzWC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDU,QAAQ,EAAE;IACRZ,GAAG,EAAE,sDAAsD;IAC3DC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}
+{"version":3,"file":"SelectionDocs.js","names":["SelectionProperties","variant","doc","type","status","value","transformSelection","optionsLayout","width","data","dataPath","autocompleteProps","dropdownProps","size","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`, `button`, `radio`, `radio-list`.',\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. `onType` will additionally provide the `value` parameter with `emptyValue` support in addition to the internal `dataContext`.',\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  size: {\n    doc: 'The sizes you can choose is small (1.5rem), default (2rem), medium (2.5rem) and large (3rem) are supported component sizes. Defaults to default / null. Also, if you define a number like size=\"2\" then it will be forwarded as the input element attribute. Consider rather setting field sizes with [Form.Appearance](/uilib/extensions/forms/Form/Appearance/).',\n    type: 'string',\n    status: 'optional',\n  },\n  children: {\n    doc: 'For providing [Field.Option](/uilib/extensions/forms/base-fields/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,4FAA4F;IACjGC,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,0OAA0O;IAC/OC,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,IAAI,EAAE;IACJX,GAAG,EAAE,oWAAoW;IACzWC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDU,QAAQ,EAAE;IACRZ,GAAG,EAAE,2GAA2G;IAChHC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}

package/extensions/forms/Field/String/StringDocs.js

@@ -9,12 +9,12 @@ export const stringProperties = {
     status: 'optional'
   },
   leftIcon: {
-    doc: 'For icon at the left side of the text input.',
+    doc: 'For icon at the left side of the text input. Only one of `leftIcon` or `rightIcon` can be used at the same time.',
     type: 'string',
     status: 'optional'
   },
   rightIcon: {
-    doc: 'For icon at the right side of the text input.',
+    doc: 'For icon at the right side of the text input. Only one of `leftIcon` or `rightIcon` can be used at the same time.',
     type: 'string',
     status: 'optional'
   },
@@ -24,7 +24,7 @@ export const stringProperties = {
     status: 'optional'
   },
   trim: {
-    doc: 'When true, it will trim leading and trailing whitespaces on blur, triggering onChange if the value changes.',
+    doc: 'When true, it will trim leading and trailing whitespaces on blur, triggering `onChange` if the value changes.',
     type: 'boolean',
     status: 'optional'
   },
@@ -66,22 +66,22 @@ export const stringProperties = {
   clear: inputProperties.clear,
   keepPlaceholder: inputProperties.keep_placeholder,
   rows: {
-    doc: 'For multiline, set how many rows of text can be shown by default. Defaults to 2.',
+    doc: 'To be used together with `multiline`. Set how many rows of text can be shown by default. Defaults to `2`.',
     type: 'number',
     status: 'optional'
   },
   autoresizeMaxRows: {
-    doc: 'For multiline, set how many rows of text can be shown at max. Defaults to 6',
+    doc: 'To be used together with `multiline`. Set how many rows of text can be shown at max. Defaults to `6`.',
     type: 'number',
     status: 'optional'
   },
   characterCounter: {
-    doc: "For multiline, use a number to define the displayed max length e.g. `40` or `{ max: 40, variant: 'down' }`.",
+    doc: "To be used together with `multiline`. Use a number to define the displayed max length e.g. `40` or `{ max: 40, variant: 'down' }`.",
     type: ['number', 'object'],
     status: 'optional'
   },
   autoresize: {
-    doc: 'For multiline, set true to expand when writing longer texts. Defaults to true.',
+    doc: 'To be used together with `multiline`. Set true to expand when writing longer texts. Defaults to `true`.',
     type: 'boolean',
     status: 'optional'
   },

package/extensions/forms/Field/String/StringDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"StringDocs.js","names":["inputProperties","stringProperties","multiline","doc","type","status","leftIcon","rightIcon","capitalize","trim","inputMode","autoComplete","minLength","maxLength","pattern","width","size","_objectSpread","align","selectall","clear","keepPlaceholder","keep_placeholder","rows","autoresizeMaxRows","characterCounter","autoresize","inputClassName","innerRef","submitElement"],"sources":["../../../../../../src/extensions/forms/Field/String/StringDocs.ts"],"sourcesContent":["import { inputProperties } from '../../../../components/input/InputDocs'\nimport { PropertiesTableProps } from '../../../../shared/types'\n\nexport const stringProperties: PropertiesTableProps = {\n  multiline: {\n    doc: 'True to be able to write in multiple lines (switching from input-element to textarea-element).',\n    type: 'boolean',\n    status: 'optional',\n  },\n  leftIcon: {\n    doc: 'For icon at the left side of the text input.',\n    type: 'string',\n    status: 'optional',\n  },\n  rightIcon: {\n    doc: 'For icon at the right side of the text input.',\n    type: 'string',\n    status: 'optional',\n  },\n  capitalize: {\n    doc: 'When set to true, it will capitalize the first letter of every word, transforming the rest to lowercase.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  trim: {\n    doc: 'When true, it will trim leading and trailing whitespaces on blur, triggering onChange if the value changes.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  inputMode: {\n    doc: 'Define an [inputmode](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).',\n    type: 'string',\n    status: 'optional',\n  },\n  autoComplete: {\n    doc: 'For HTML [autocomplete](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) attributes.',\n    type: ['on', 'string'],\n    status: 'optional',\n  },\n  minLength: {\n    doc: 'Validation for minimum length of the text (number of characters).',\n    type: 'number',\n    status: 'optional',\n  },\n  maxLength: {\n    doc: 'Validation for maximum length of the text (number of characters).',\n    type: 'number',\n    status: 'optional',\n  },\n  pattern: {\n    doc: 'Validation based on regex pattern.',\n    type: 'string',\n    status: 'optional',\n  },\n  width: {\n    doc: '`false` for no width (use browser default), `small`, `medium` or `large` for predefined standard widths, `stretch` to fill available width.',\n    type: ['string', 'false'],\n    status: 'optional',\n  },\n\n  // - Input props\n  size: {\n    ...inputProperties.size,\n    doc: `${inputProperties.size.doc} Consider rather setting field sizes with [Form.Appearance](/uilib/extensions/forms/Form/Appearance/).`,\n  },\n  align: inputProperties.align,\n  selectall: inputProperties.selectall,\n  clear: inputProperties.clear,\n  keepPlaceholder: inputProperties.keep_placeholder,\n\n  // - Textarea props\n  rows: {\n    doc: 'For multiline, set how many rows of text can be shown by default. Defaults to 2.',\n    type: 'number',\n    status: 'optional',\n  },\n  autoresizeMaxRows: {\n    doc: 'For multiline, set how many rows of text can be shown at max. Defaults to 6',\n    type: 'number',\n    status: 'optional',\n  },\n  characterCounter: {\n    doc: \"For multiline, use a number to define the displayed max length e.g. `40` or `{ max: 40, variant: 'down' }`.\",\n    type: ['number', 'object'],\n    status: 'optional',\n  },\n  autoresize: {\n    doc: 'For multiline, set true to expand when writing longer texts. Defaults to true.',\n    type: 'boolean',\n    status: 'optional',\n  },\n\n  // - Additional props\n  inputClassName: {\n    doc: 'Class name set on the <input> DOM element.',\n    type: 'string',\n    status: 'optional',\n  },\n  innerRef: {\n    doc: 'By providing a React.Ref we can get the internally used input element (DOM).',\n    type: 'React.RefObject',\n    status: 'optional',\n  },\n  submitElement: {\n    doc: 'Accepts a React element which will show up like the \"submit button\" would do on type=\"search\".',\n    type: 'React.Element',\n    status: 'optional',\n  },\n}\n"],"mappings":";;;AAAA,SAASA,eAAe,QAAQ,wCAAwC;AAGxE,OAAO,MAAMC,gBAAsC,GAAG;EACpDC,SAAS,EAAE;IACTC,GAAG,EAAE,gGAAgG;IACrGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDC,QAAQ,EAAE;IACRH,GAAG,EAAE,8CAA8C;IACnDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDE,SAAS,EAAE;IACTJ,GAAG,EAAE,+CAA+C;IACpDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,UAAU,EAAE;IACVL,GAAG,EAAE,0GAA0G;IAC/GC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDI,IAAI,EAAE;IACJN,GAAG,EAAE,6GAA6G;IAClHC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDK,SAAS,EAAE;IACTP,GAAG,EAAE,uGAAuG;IAC5GC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDM,YAAY,EAAE;IACZR,GAAG,EAAE,gHAAgH;IACrHC,IAAI,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC;IACtBC,MAAM,EAAE;EACV,CAAC;EACDO,SAAS,EAAE;IACTT,GAAG,EAAE,mEAAmE;IACxEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDQ,SAAS,EAAE;IACTV,GAAG,EAAE,mEAAmE;IACxEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDS,OAAO,EAAE;IACPX,GAAG,EAAE,oCAAoC;IACzCC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDU,KAAK,EAAE;IACLZ,GAAG,EAAE,6IAA6I;IAClJC,IAAI,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC;IACzBC,MAAM,EAAE;EACV,CAAC;EAGDW,IAAI,EAAAC,aAAA,CAAAA,aAAA,KACCjB,eAAe,CAACgB,IAAI;IACvBb,GAAG,EAAE,GAAGH,eAAe,CAACgB,IAAI,CAACb,GAAG;EAAwG,EACzI;EACDe,KAAK,EAAElB,eAAe,CAACkB,KAAK;EAC5BC,SAAS,EAAEnB,eAAe,CAACmB,SAAS;EACpCC,KAAK,EAAEpB,eAAe,CAACoB,KAAK;EAC5BC,eAAe,EAAErB,eAAe,CAACsB,gBAAgB;EAGjDC,IAAI,EAAE;IACJpB,GAAG,EAAE,kFAAkF;IACvFC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDmB,iBAAiB,EAAE;IACjBrB,GAAG,EAAE,6EAA6E;IAClFC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDoB,gBAAgB,EAAE;IAChBtB,GAAG,EAAE,6GAA6G;IAClHC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV,CAAC;EACDqB,UAAU,EAAE;IACVvB,GAAG,EAAE,gFAAgF;IACrFC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EAGDsB,cAAc,EAAE;IACdxB,GAAG,EAAE,4CAA4C;IACjDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDuB,QAAQ,EAAE;IACRzB,GAAG,EAAE,8EAA8E;IACnFC,IAAI,EAAE,iBAAiB;IACvBC,MAAM,EAAE;EACV,CAAC;EACDwB,aAAa,EAAE;IACb1B,GAAG,EAAE,gGAAgG;IACrGC,IAAI,EAAE,eAAe;IACrBC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}
+{"version":3,"file":"StringDocs.js","names":["inputProperties","stringProperties","multiline","doc","type","status","leftIcon","rightIcon","capitalize","trim","inputMode","autoComplete","minLength","maxLength","pattern","width","size","_objectSpread","align","selectall","clear","keepPlaceholder","keep_placeholder","rows","autoresizeMaxRows","characterCounter","autoresize","inputClassName","innerRef","submitElement"],"sources":["../../../../../../src/extensions/forms/Field/String/StringDocs.ts"],"sourcesContent":["import { inputProperties } from '../../../../components/input/InputDocs'\nimport { PropertiesTableProps } from '../../../../shared/types'\n\nexport const stringProperties: PropertiesTableProps = {\n  multiline: {\n    doc: 'True to be able to write in multiple lines (switching from input-element to textarea-element).',\n    type: 'boolean',\n    status: 'optional',\n  },\n  leftIcon: {\n    doc: 'For icon at the left side of the text input. Only one of `leftIcon` or `rightIcon` can be used at the same time.',\n    type: 'string',\n    status: 'optional',\n  },\n  rightIcon: {\n    doc: 'For icon at the right side of the text input. Only one of `leftIcon` or `rightIcon` can be used at the same time.',\n    type: 'string',\n    status: 'optional',\n  },\n  capitalize: {\n    doc: 'When set to true, it will capitalize the first letter of every word, transforming the rest to lowercase.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  trim: {\n    doc: 'When true, it will trim leading and trailing whitespaces on blur, triggering `onChange` if the value changes.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  inputMode: {\n    doc: 'Define an [inputmode](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).',\n    type: 'string',\n    status: 'optional',\n  },\n  autoComplete: {\n    doc: 'For HTML [autocomplete](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) attributes.',\n    type: ['on', 'string'],\n    status: 'optional',\n  },\n  minLength: {\n    doc: 'Validation for minimum length of the text (number of characters).',\n    type: 'number',\n    status: 'optional',\n  },\n  maxLength: {\n    doc: 'Validation for maximum length of the text (number of characters).',\n    type: 'number',\n    status: 'optional',\n  },\n  pattern: {\n    doc: 'Validation based on regex pattern.',\n    type: 'string',\n    status: 'optional',\n  },\n  width: {\n    doc: '`false` for no width (use browser default), `small`, `medium` or `large` for predefined standard widths, `stretch` to fill available width.',\n    type: ['string', 'false'],\n    status: 'optional',\n  },\n\n  // - Input props\n  size: {\n    ...inputProperties.size,\n    doc: `${inputProperties.size.doc} Consider rather setting field sizes with [Form.Appearance](/uilib/extensions/forms/Form/Appearance/).`,\n  },\n  align: inputProperties.align,\n  selectall: inputProperties.selectall,\n  clear: inputProperties.clear,\n  keepPlaceholder: inputProperties.keep_placeholder,\n\n  // - Textarea props\n  rows: {\n    doc: 'To be used together with `multiline`. Set how many rows of text can be shown by default. Defaults to `2`.',\n    type: 'number',\n    status: 'optional',\n  },\n  autoresizeMaxRows: {\n    doc: 'To be used together with `multiline`. Set how many rows of text can be shown at max. Defaults to `6`.',\n    type: 'number',\n    status: 'optional',\n  },\n  characterCounter: {\n    doc: \"To be used together with `multiline`. Use a number to define the displayed max length e.g. `40` or `{ max: 40, variant: 'down' }`.\",\n    type: ['number', 'object'],\n    status: 'optional',\n  },\n  autoresize: {\n    doc: 'To be used together with `multiline`. Set true to expand when writing longer texts. Defaults to `true`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n\n  // - Additional props\n  inputClassName: {\n    doc: 'Class name set on the <input> DOM element.',\n    type: 'string',\n    status: 'optional',\n  },\n  innerRef: {\n    doc: 'By providing a React.Ref we can get the internally used input element (DOM).',\n    type: 'React.RefObject',\n    status: 'optional',\n  },\n  submitElement: {\n    doc: 'Accepts a React element which will show up like the \"submit button\" would do on type=\"search\".',\n    type: 'React.Element',\n    status: 'optional',\n  },\n}\n"],"mappings":";;;AAAA,SAASA,eAAe,QAAQ,wCAAwC;AAGxE,OAAO,MAAMC,gBAAsC,GAAG;EACpDC,SAAS,EAAE;IACTC,GAAG,EAAE,gGAAgG;IACrGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDC,QAAQ,EAAE;IACRH,GAAG,EAAE,kHAAkH;IACvHC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDE,SAAS,EAAE;IACTJ,GAAG,EAAE,mHAAmH;IACxHC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,UAAU,EAAE;IACVL,GAAG,EAAE,0GAA0G;IAC/GC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDI,IAAI,EAAE;IACJN,GAAG,EAAE,+GAA+G;IACpHC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDK,SAAS,EAAE;IACTP,GAAG,EAAE,uGAAuG;IAC5GC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDM,YAAY,EAAE;IACZR,GAAG,EAAE,gHAAgH;IACrHC,IAAI,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC;IACtBC,MAAM,EAAE;EACV,CAAC;EACDO,SAAS,EAAE;IACTT,GAAG,EAAE,mEAAmE;IACxEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDQ,SAAS,EAAE;IACTV,GAAG,EAAE,mEAAmE;IACxEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDS,OAAO,EAAE;IACPX,GAAG,EAAE,oCAAoC;IACzCC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDU,KAAK,EAAE;IACLZ,GAAG,EAAE,6IAA6I;IAClJC,IAAI,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC;IACzBC,MAAM,EAAE;EACV,CAAC;EAGDW,IAAI,EAAAC,aAAA,CAAAA,aAAA,KACCjB,eAAe,CAACgB,IAAI;IACvBb,GAAG,EAAE,GAAGH,eAAe,CAACgB,IAAI,CAACb,GAAG;EAAwG,EACzI;EACDe,KAAK,EAAElB,eAAe,CAACkB,KAAK;EAC5BC,SAAS,EAAEnB,eAAe,CAACmB,SAAS;EACpCC,KAAK,EAAEpB,eAAe,CAACoB,KAAK;EAC5BC,eAAe,EAAErB,eAAe,CAACsB,gBAAgB;EAGjDC,IAAI,EAAE;IACJpB,GAAG,EAAE,2GAA2G;IAChHC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDmB,iBAAiB,EAAE;IACjBrB,GAAG,EAAE,uGAAuG;IAC5GC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDoB,gBAAgB,EAAE;IAChBtB,GAAG,EAAE,oIAAoI;IACzIC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV,CAAC;EACDqB,UAAU,EAAE;IACVvB,GAAG,EAAE,yGAAyG;IAC9GC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EAGDsB,cAAc,EAAE;IACdxB,GAAG,EAAE,4CAA4C;IACjDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDuB,QAAQ,EAAE;IACRzB,GAAG,EAAE,8EAA8E;IACnFC,IAAI,EAAE,iBAAiB;IACvBC,MAAM,EAAE;EACV,CAAC;EACDwB,aAAa,EAAE;IACb1B,GAAG,EAAE,gGAAgG;IACrGC,IAAI,EAAE,eAAe;IACrBC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}

package/extensions/forms/Field/Toggle/Toggle.js

@@ -13,7 +13,7 @@ import { useFieldProps } from '../../hooks';
 import { pickSpacingProps } from '../../../../components/flex/utils';
 import ToggleButtonGroupContext from '../../../../components/toggle-button/ToggleButtonGroupContext';
 import useTranslation from '../../hooks/useTranslation';
-import { useIterateItemNo } from '../../Iterate/ItemNo/useIItemNo';
+import { useIterateItemNo } from '../../Iterate/ItemNo/useIterateItemNo';
 function Toggle(props) {
   const translations = useTranslation().ToggleField;
   const preparedProps = _objectSpread(_objectSpread({}, props), {}, {

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

@@ -1 +1 @@
-{"version":3,"file":"Toggle.js","names":["React","useCallback","useMemo","useRef","classnames","Checkbox","ToggleButton","ButtonRow","FieldBlock","useFieldProps","pickSpacingProps","ToggleButtonGroupContext","useTranslation","useIterateItemNo","Toggle","props","translations","ToggleField","preparedProps","_objectSpread","errorMessages","id","className","valueOn","valueOff","variant","disabled","textOn","textOff","value","size","hasError","htmlAttributes","handleChange","setDisplayValue","preventChangeRef","onClick","handleClick","args","preventDefault","_args$preventDefault","current","call","checked","event","handleCheckboxChange","handleToggleChange","_ref","cn","fieldBlockProps","forId","isOn","isOff","text","label","labelSuffix","required","labelSrOnly","labelWithItemNo","createElement","_extends","undefined","yes","no","status","onChange","on_change","role","asFieldset","bottom","Group","Provider","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Toggle/Toggle.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef } from 'react'\nimport classnames from 'classnames'\nimport { Checkbox, ToggleButton } from '../../../../components'\nimport ButtonRow from '../../Form/ButtonRow'\nimport FieldBlock, { Props as FieldBlockProps } from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport { FieldProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport ToggleButtonGroupContext from '../../../../components/toggle-button/ToggleButtonGroupContext'\nimport useTranslation from '../../hooks/useTranslation'\nimport { useIterateItemNo } from '../../Iterate/ItemNo/useIItemNo'\nimport type {\n  CheckboxProps,\n  OnChangeParams,\n  OnClickParams,\n} from '../../../../components/Checkbox'\nimport type { ToggleButtonProps } from '../../../../components/ToggleButton'\n\nexport type ToggleProps = {\n  valueOn: unknown\n  valueOff: unknown\n  variant?: 'checkbox' | 'checkbox-button' | 'button' | 'buttons'\n  textOn?: string\n  textOff?: string\n  size?: ToggleButtonProps['size'] | CheckboxProps['size']\n\n  /**\n   * Checkbox props\n   */\n  onClick?: (\n    value: unknown,\n    params: { event: React.MouseEvent<HTMLInputElement> }\n  ) => void\n}\n\nexport type Props = Omit<FieldProps<unknown>, 'layout' | 'layoutOptions'> &\n  ToggleProps\n\nfunction Toggle(props: Props) {\n  const translations = useTranslation().ToggleField\n\n  const preparedProps: Props = {\n    ...props,\n    errorMessages: props.errorMessages,\n  }\n\n  const {\n    id,\n    className,\n    valueOn,\n    valueOff,\n    variant,\n    disabled,\n    textOn,\n    textOff,\n    value,\n    size,\n    hasError,\n    htmlAttributes,\n    handleChange,\n    setDisplayValue,\n  } = useFieldProps(preparedProps)\n\n  const preventChangeRef = useRef(false)\n\n  const onClick = preparedProps?.onClick\n  const handleClick = useCallback(\n    (args: OnClickParams) => {\n      const preventDefault = () => {\n        preventChangeRef.current = true\n        args.preventDefault?.()\n      }\n\n      if (preventChangeRef.current) {\n        args.checked = !args.checked\n        preventChangeRef.current = false\n      }\n\n      const event = {\n        ...args,\n        preventDefault,\n      }\n      onClick?.(args.checked ? valueOn : valueOff, event)\n    },\n    [onClick, valueOff, valueOn]\n  )\n  const handleCheckboxChange = useCallback(\n    (args: OnChangeParams) => {\n      handleChange?.(args.checked ? valueOn : valueOff, args)\n    },\n    [handleChange, valueOn, valueOff]\n  )\n  const handleToggleChange = useCallback(\n    ({ value }) => {\n      handleChange?.(value === 'on' ? valueOn : valueOff)\n    },\n    [handleChange, valueOn, valueOff]\n  )\n\n  const cn = classnames('dnb-forms-field-toggle', className)\n\n  const fieldBlockProps: FieldBlockProps = {\n    forId: id,\n    className: cn,\n    disabled,\n    ...pickSpacingProps(props),\n  }\n\n  const isOn = value === valueOn\n  const isOff = value === valueOff\n\n  useMemo(() => {\n    const text = isOn ? textOn : textOff\n    if (text) {\n      setDisplayValue(text)\n    }\n  }, [isOn, setDisplayValue, textOff, textOn])\n\n  const { label, labelSuffix, required, labelSrOnly } = props\n  const labelWithItemNo = useIterateItemNo({\n    label,\n    labelSuffix,\n    required,\n  })\n\n  switch (variant) {\n    default:\n    case 'checkbox':\n      return (\n        <FieldBlock {...fieldBlockProps} label={undefined}>\n          <Checkbox\n            id={id}\n            className={cn}\n            label={\n              labelWithItemNo ??\n              (isOn\n                ? textOn ?? translations.yes\n                : textOff ?? translations.no)\n            }\n            labelSrOnly={labelSrOnly}\n            checked={isOn}\n            disabled={disabled}\n            size={size !== 'small' ? size : undefined}\n            status={hasError ? 'error' : undefined}\n            onChange={handleCheckboxChange}\n            onClick={handleClick}\n            {...htmlAttributes}\n          />\n        </FieldBlock>\n      )\n    case 'button':\n      return (\n        <FieldBlock {...fieldBlockProps}>\n          <ToggleButton\n            id={id}\n            text={\n              isOn\n                ? textOn ?? translations.yes\n                : textOff ?? translations.no\n            }\n            checked={isOn}\n            disabled={disabled}\n            status={hasError ? 'error' : undefined}\n            value={value ? 'true' : 'false'}\n            size={size}\n            on_change={handleCheckboxChange}\n            role=\"checkbox\"\n            {...htmlAttributes}\n          />\n        </FieldBlock>\n      )\n    case 'buttons':\n      return (\n        <FieldBlock {...fieldBlockProps} asFieldset>\n          <ButtonRow bottom=\"x-small\">\n            <ToggleButton.Group role=\"radiogroup\">\n              <ToggleButtonGroupContext.Provider\n                value={{\n                  value: isOn ? 'on' : isOff ? 'off' : null, // use \"null\" to reset the value\n                  onChange: handleToggleChange,\n                  status: hasError ? 'error' : undefined,\n                  disabled,\n                  size,\n                }}\n              >\n                <ToggleButton\n                  text={textOn ?? translations.yes}\n                  value=\"on\"\n                  role=\"radio\"\n                  {...htmlAttributes}\n                />\n                <ToggleButton\n                  text={textOff ?? translations.no}\n                  value=\"off\"\n                  role=\"radio\"\n                  {...htmlAttributes}\n                />\n              </ToggleButtonGroupContext.Provider>\n            </ToggleButton.Group>\n          </ButtonRow>\n        </FieldBlock>\n      )\n    case 'checkbox-button':\n      return (\n        <FieldBlock {...fieldBlockProps}>\n          <ToggleButton\n            id={id}\n            variant=\"checkbox\"\n            text={\n              isOn\n                ? textOn ?? translations.yes\n                : textOff ?? translations.no\n            }\n            checked={isOn}\n            disabled={disabled}\n            status={hasError ? 'error' : undefined}\n            value={value ? 'true' : 'false'}\n            size={size}\n            on_change={handleCheckboxChange}\n            role=\"checkbox\"\n            {...htmlAttributes}\n          />\n        </FieldBlock>\n      )\n  }\n}\n\nToggle._supportsSpacingProps = true\nexport default Toggle\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Toggle.js","names":["React","useCallback","useMemo","useRef","classnames","Checkbox","ToggleButton","ButtonRow","FieldBlock","useFieldProps","pickSpacingProps","ToggleButtonGroupContext","useTranslation","useIterateItemNo","Toggle","props","translations","ToggleField","preparedProps","_objectSpread","errorMessages","id","className","valueOn","valueOff","variant","disabled","textOn","textOff","value","size","hasError","htmlAttributes","handleChange","setDisplayValue","preventChangeRef","onClick","handleClick","args","preventDefault","_args$preventDefault","current","call","checked","event","handleCheckboxChange","handleToggleChange","_ref","cn","fieldBlockProps","forId","isOn","isOff","text","label","labelSuffix","required","labelSrOnly","labelWithItemNo","createElement","_extends","undefined","yes","no","status","onChange","on_change","role","asFieldset","bottom","Group","Provider","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Toggle/Toggle.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef } from 'react'\nimport classnames from 'classnames'\nimport { Checkbox, ToggleButton } from '../../../../components'\nimport ButtonRow from '../../Form/ButtonRow'\nimport FieldBlock, { Props as FieldBlockProps } from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport { FieldProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport ToggleButtonGroupContext from '../../../../components/toggle-button/ToggleButtonGroupContext'\nimport useTranslation from '../../hooks/useTranslation'\nimport { useIterateItemNo } from '../../Iterate/ItemNo/useIterateItemNo'\nimport type {\n  CheckboxProps,\n  OnChangeParams,\n  OnClickParams,\n} from '../../../../components/Checkbox'\nimport type { ToggleButtonProps } from '../../../../components/ToggleButton'\n\nexport type ToggleProps = {\n  valueOn: unknown\n  valueOff: unknown\n  variant?: 'checkbox' | 'checkbox-button' | 'button' | 'buttons'\n  textOn?: string\n  textOff?: string\n  size?: ToggleButtonProps['size'] | CheckboxProps['size']\n\n  /**\n   * Checkbox props\n   */\n  onClick?: (\n    value: unknown,\n    params: { event: React.MouseEvent<HTMLInputElement> }\n  ) => void\n}\n\nexport type Props = Omit<FieldProps<unknown>, 'layout' | 'layoutOptions'> &\n  ToggleProps\n\nfunction Toggle(props: Props) {\n  const translations = useTranslation().ToggleField\n\n  const preparedProps: Props = {\n    ...props,\n    errorMessages: props.errorMessages,\n  }\n\n  const {\n    id,\n    className,\n    valueOn,\n    valueOff,\n    variant,\n    disabled,\n    textOn,\n    textOff,\n    value,\n    size,\n    hasError,\n    htmlAttributes,\n    handleChange,\n    setDisplayValue,\n  } = useFieldProps(preparedProps)\n\n  const preventChangeRef = useRef(false)\n\n  const onClick = preparedProps?.onClick\n  const handleClick = useCallback(\n    (args: OnClickParams) => {\n      const preventDefault = () => {\n        preventChangeRef.current = true\n        args.preventDefault?.()\n      }\n\n      if (preventChangeRef.current) {\n        args.checked = !args.checked\n        preventChangeRef.current = false\n      }\n\n      const event = {\n        ...args,\n        preventDefault,\n      }\n      onClick?.(args.checked ? valueOn : valueOff, event)\n    },\n    [onClick, valueOff, valueOn]\n  )\n  const handleCheckboxChange = useCallback(\n    (args: OnChangeParams) => {\n      handleChange?.(args.checked ? valueOn : valueOff, args)\n    },\n    [handleChange, valueOn, valueOff]\n  )\n  const handleToggleChange = useCallback(\n    ({ value }) => {\n      handleChange?.(value === 'on' ? valueOn : valueOff)\n    },\n    [handleChange, valueOn, valueOff]\n  )\n\n  const cn = classnames('dnb-forms-field-toggle', className)\n\n  const fieldBlockProps: FieldBlockProps = {\n    forId: id,\n    className: cn,\n    disabled,\n    ...pickSpacingProps(props),\n  }\n\n  const isOn = value === valueOn\n  const isOff = value === valueOff\n\n  useMemo(() => {\n    const text = isOn ? textOn : textOff\n    if (text) {\n      setDisplayValue(text)\n    }\n  }, [isOn, setDisplayValue, textOff, textOn])\n\n  const { label, labelSuffix, required, labelSrOnly } = props\n  const labelWithItemNo = useIterateItemNo({\n    label,\n    labelSuffix,\n    required,\n  })\n\n  switch (variant) {\n    default:\n    case 'checkbox':\n      return (\n        <FieldBlock {...fieldBlockProps} label={undefined}>\n          <Checkbox\n            id={id}\n            className={cn}\n            label={\n              labelWithItemNo ??\n              (isOn\n                ? textOn ?? translations.yes\n                : textOff ?? translations.no)\n            }\n            labelSrOnly={labelSrOnly}\n            checked={isOn}\n            disabled={disabled}\n            size={size !== 'small' ? size : undefined}\n            status={hasError ? 'error' : undefined}\n            onChange={handleCheckboxChange}\n            onClick={handleClick}\n            {...htmlAttributes}\n          />\n        </FieldBlock>\n      )\n    case 'button':\n      return (\n        <FieldBlock {...fieldBlockProps}>\n          <ToggleButton\n            id={id}\n            text={\n              isOn\n                ? textOn ?? translations.yes\n                : textOff ?? translations.no\n            }\n            checked={isOn}\n            disabled={disabled}\n            status={hasError ? 'error' : undefined}\n            value={value ? 'true' : 'false'}\n            size={size}\n            on_change={handleCheckboxChange}\n            role=\"checkbox\"\n            {...htmlAttributes}\n          />\n        </FieldBlock>\n      )\n    case 'buttons':\n      return (\n        <FieldBlock {...fieldBlockProps} asFieldset>\n          <ButtonRow bottom=\"x-small\">\n            <ToggleButton.Group role=\"radiogroup\">\n              <ToggleButtonGroupContext.Provider\n                value={{\n                  value: isOn ? 'on' : isOff ? 'off' : null, // use \"null\" to reset the value\n                  onChange: handleToggleChange,\n                  status: hasError ? 'error' : undefined,\n                  disabled,\n                  size,\n                }}\n              >\n                <ToggleButton\n                  text={textOn ?? translations.yes}\n                  value=\"on\"\n                  role=\"radio\"\n                  {...htmlAttributes}\n                />\n                <ToggleButton\n                  text={textOff ?? translations.no}\n                  value=\"off\"\n                  role=\"radio\"\n                  {...htmlAttributes}\n                />\n              </ToggleButtonGroupContext.Provider>\n            </ToggleButton.Group>\n          </ButtonRow>\n        </FieldBlock>\n      )\n    case 'checkbox-button':\n      return (\n        <FieldBlock {...fieldBlockProps}>\n          <ToggleButton\n            id={id}\n            variant=\"checkbox\"\n            text={\n              isOn\n                ? textOn ?? translations.yes\n                : textOff ?? translations.no\n            }\n            checked={isOn}\n            disabled={disabled}\n            status={hasError ? 'error' : undefined}\n            value={value ? 'true' : 'false'}\n            size={size}\n            on_change={handleCheckboxChange}\n            role=\"checkbox\"\n            {...htmlAttributes}\n          />\n        </FieldBlock>\n      )\n  }\n}\n\nToggle._supportsSpacingProps = true\nexport default Toggle\n"],"mappings":"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","ignoreList":[]}

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

@@ -3,7 +3,7 @@ import { UploadFile, UploadFileNative, UploadProps } from '../../../../component
 import { SpacingProps } from '../../../../shared/types';
 export type { UploadFile, UploadFileNative };
 export type UploadValue = Array<UploadFile | UploadFileNative>;
-export type Props = Omit<FieldProps<UploadValue, UploadValue | undefined>, 'name'> & SpacingProps & Pick<Partial<UploadProps>, 'title' | 'text' | 'acceptedFileTypes' | 'filesAmountLimit' | 'fileMaxSize' | 'onFileDelete' | 'onFileClick' | 'skeleton' | 'download' | 'allowDuplicates' | 'disableDragAndDrop'> & {
+export type Props = Omit<FieldProps<UploadValue, UploadValue | undefined>, 'layout' | 'layoutOptions' | 'onBlurValidator' | 'onChangeValidator' | 'contentWidth' | 'labelSize' | 'labelDescriptionInline' | 'labelSrOnly' | 'labelSize' | 'labelSuffix'> & SpacingProps & Pick<Partial<UploadProps>, 'title' | 'text' | 'acceptedFileTypes' | 'filesAmountLimit' | 'fileMaxSize' | 'onFileDelete' | 'onFileClick' | 'skeleton' | 'download' | 'allowDuplicates' | 'disableDragAndDrop'> & {
     fileHandler?: (newFiles: UploadValue) => UploadValue | Promise<UploadValue>;
     width?: 'large' | 'stretch';
 };

package/extensions/forms/Field/Upload/Upload.js

@@ -3,7 +3,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-const _excluded = ["id", "className", "width", "value", "label", "labelDescription", "help", "htmlAttributes", "handleChange", "handleFocus", "handleBlur", "fileHandler"];
+const _excluded = ["id", "className", "width", "value", "label", "labelDescription", "help", "htmlAttributes", "disabled", "handleChange", "handleFocus", "handleBlur", "fileHandler"];
 import "core-js/modules/web.dom-collections.iterator.js";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -68,6 +68,7 @@ function UploadComponent(props) {
       labelDescription,
       help,
       htmlAttributes,
+      disabled,
       handleChange,
       handleFocus,
       handleBlur,
@@ -168,6 +169,7 @@ function UploadComponent(props) {
     download: download,
     allowDuplicates: allowDuplicates,
     disableDragAndDrop: disableDragAndDrop,
+    disabled: disabled,
     fileMaxSize: fileMaxSize,
     skeleton: skeleton,
     onChange: changeHandler,