@dnb/eufemia/extensions/forms/Field/OrganizationNumber/OrganizationNumber.js

DNB Eufemia Design System UI Library

import { useCallback, useMemo } from 'react';
import StringField from "../String/index.js";
import { norwegianOrgNumberValidator } from "./validators.js";
import useTranslation from "../../hooks/useTranslation.js";
import withComponentMarkers from "../../../../shared/helpers/withComponentMarkers.js";
import { jsx as _jsx } from "react/jsx-runtime";
function OrganizationNumber(props) {
  const translations = useTranslation().OrganizationNumber;
  const {
    errorOrgNo,
    errorOrgNoLength,
    errorRequired,
    label
  } = translations;
  const errorMessages = useMemo(() => ({
    'Field.errorRequired': errorRequired,
    'Field.errorPattern': errorOrgNo,
    ...props.errorMessages
  }), [errorRequired, errorOrgNo, props.errorMessages]);
  const organizationNumberValidator = useCallback(value => norwegianOrgNumberValidator(value, {
    errorOrgNo,
    errorOrgNoLength
  }), [errorOrgNo, errorOrgNoLength]);
  const {
    validate = true,
    omitMask,
    onChangeValidator,
    onBlurValidator = organizationNumberValidator,
    label: labelProp,
    width
  } = props;
  const mask = useMemo(() => omitMask ? [/\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/] : [/\d/, /\d/, /\d/, ' ', /\d/, /\d/, /\d/, ' ', /\d/, /\d/, /\d/], [omitMask]);
  const onBlurValidatorToUse = onBlurValidator === false ? undefined : onBlurValidator;
  const StringFieldProps = {
    ...props,
    className: 'dnb-forms-field-organization-number',
    label: labelProp !== null && labelProp !== void 0 ? labelProp : label,
    errorMessages,
    mask,
    allowOverflow: true,
    width: width !== null && width !== void 0 ? width : 'medium',
    inputMode: 'numeric',
    onChangeValidator: validate ? onChangeValidator : undefined,
    onBlurValidator: validate ? onBlurValidatorToUse : undefined,
    exportValidators: {
      organizationNumberValidator
    }
  };
  return _jsx(StringField, {
    ...StringFieldProps
  });
}
withComponentMarkers(OrganizationNumber, {
  _supportsSpacingProps: true
});
export default OrganizationNumber;
//# sourceMappingURL=OrganizationNumber.js.map