@dnb/eufemia 10.54.1 → 10.55.1

package/es/extensions/forms/Field/Boolean/Boolean.d.ts

@@ -9,10 +9,11 @@ type BooleanProps = {
 type NeverBooleanProps = {
     [K in keyof Partial<Omit<BooleanProps, 'dependencePaths'>>]: never;
 };
-export type IndeterminateProps = FieldProps<unknown> & {
+type SharedFieldProps = Omit<FieldProps<unknown>, 'layout' | 'layoutOptions'>;
+export type IndeterminateProps = SharedFieldProps & {
     dependencePaths: Array<Path>;
 } & NeverBooleanProps;
-export type Props = FieldHelpProps & FieldProps<unknown> & BooleanProps;
+export type Props = FieldHelpProps & SharedFieldProps & BooleanProps;
 declare function BooleanComponent(props: Props | IndeterminateProps): import("react/jsx-runtime").JSX.Element;
 declare namespace BooleanComponent {
     var _supportsSpacingProps: boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"Boolean.js","names":["React","ToggleField","useTranslation","BooleanComponent","props","trueText","falseText","restProps","_objectWithoutProperties","_excluded","translations","BooleanField","createElement","_extends","valueOn","valueOff","textOn","yes","textOff","no","valueType","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Boolean/Boolean.tsx"],"sourcesContent":["import React from 'react'\nimport ToggleField, { Props as ToggleFieldProps } from '../Toggle'\nimport useTranslation from '../../hooks/useTranslation'\nimport { FieldHelpProps, FieldProps, Path } from '../../types'\n\ntype BooleanProps = {\n  trueText?: string\n  falseText?: string\n  variant?: ToggleFieldProps['variant']\n  dependencePaths?: never\n}\ntype NeverBooleanProps = {\n  // eslint-disable-next-line no-unused-vars\n  [K in keyof Partial<Omit<BooleanProps, 'dependencePaths'>>]: never\n}\nexport type IndeterminateProps = FieldProps<unknown> & {\n  dependencePaths: Array<Path>\n} & NeverBooleanProps\nexport type Props = FieldHelpProps & FieldProps<unknown> & BooleanProps\n\nfunction BooleanComponent(props: Props | IndeterminateProps) {\n  const { trueText, falseText, ...restProps } = props\n  const translations = useTranslation().BooleanField\n\n  return (\n    <ToggleField\n      {...(restProps as ToggleFieldProps)}\n      valueOn={true}\n      valueOff={false}\n      textOn={trueText ?? translations.yes}\n      textOff={falseText ?? translations.no}\n      valueType=\"boolean\"\n    />\n  )\n}\n\nBooleanComponent._supportsSpacingProps = true\nexport default BooleanComponent\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,WAAW,MAAqC,WAAW;AAClE,OAAOC,cAAc,MAAM,4BAA4B;AAkBvD,SAASC,gBAAgBA,CAACC,KAAiC,EAAE;EAC3D,MAAM;MAAEC,QAAQ;MAAEC;IAAwB,CAAC,GAAGF,KAAK;IAAnBG,SAAS,GAAAC,wBAAA,CAAKJ,KAAK,EAAAK,SAAA;EACnD,MAAMC,YAAY,GAAGR,cAAc,CAAC,CAAC,CAACS,YAAY;EAElD,OACEX,KAAA,CAAAY,aAAA,CAACX,WAAW,EAAAY,QAAA,KACLN,SAAS;IACdO,OAAO,EAAE,IAAK;IACdC,QAAQ,EAAE,KAAM;IAChBC,MAAM,EAAEX,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIK,YAAY,CAACO,GAAI;IACrCC,OAAO,EAAEZ,SAAS,aAATA,SAAS,cAATA,SAAS,GAAII,YAAY,CAACS,EAAG;IACtCC,SAAS,EAAC;EAAS,EACpB,CAAC;AAEN;AAEAjB,gBAAgB,CAACkB,qBAAqB,GAAG,IAAI;AAC7C,eAAelB,gBAAgB"}
+{"version":3,"file":"Boolean.js","names":["React","ToggleField","useTranslation","BooleanComponent","props","trueText","falseText","restProps","_objectWithoutProperties","_excluded","translations","BooleanField","createElement","_extends","valueOn","valueOff","textOn","yes","textOff","no","valueType","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Boolean/Boolean.tsx"],"sourcesContent":["import React from 'react'\nimport ToggleField, { Props as ToggleFieldProps } from '../Toggle'\nimport useTranslation from '../../hooks/useTranslation'\nimport { FieldHelpProps, FieldProps, Path } from '../../types'\n\ntype BooleanProps = {\n  trueText?: string\n  falseText?: string\n  variant?: ToggleFieldProps['variant']\n  dependencePaths?: never\n}\ntype NeverBooleanProps = {\n  // eslint-disable-next-line no-unused-vars\n  [K in keyof Partial<Omit<BooleanProps, 'dependencePaths'>>]: never\n}\ntype SharedFieldProps = Omit<\n  FieldProps<unknown>,\n  'layout' | 'layoutOptions'\n>\nexport type IndeterminateProps = SharedFieldProps & {\n  dependencePaths: Array<Path>\n} & NeverBooleanProps\nexport type Props = FieldHelpProps & SharedFieldProps & BooleanProps\n\nfunction BooleanComponent(props: Props | IndeterminateProps) {\n  const { trueText, falseText, ...restProps } = props\n  const translations = useTranslation().BooleanField\n\n  return (\n    <ToggleField\n      {...(restProps as ToggleFieldProps)}\n      valueOn={true}\n      valueOff={false}\n      textOn={trueText ?? translations.yes}\n      textOff={falseText ?? translations.no}\n      valueType=\"boolean\"\n    />\n  )\n}\n\nBooleanComponent._supportsSpacingProps = true\nexport default BooleanComponent\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,WAAW,MAAqC,WAAW;AAClE,OAAOC,cAAc,MAAM,4BAA4B;AAsBvD,SAASC,gBAAgBA,CAACC,KAAiC,EAAE;EAC3D,MAAM;MAAEC,QAAQ;MAAEC;IAAwB,CAAC,GAAGF,KAAK;IAAnBG,SAAS,GAAAC,wBAAA,CAAKJ,KAAK,EAAAK,SAAA;EACnD,MAAMC,YAAY,GAAGR,cAAc,CAAC,CAAC,CAACS,YAAY;EAElD,OACEX,KAAA,CAAAY,aAAA,CAACX,WAAW,EAAAY,QAAA,KACLN,SAAS;IACdO,OAAO,EAAE,IAAK;IACdC,QAAQ,EAAE,KAAM;IAChBC,MAAM,EAAEX,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIK,YAAY,CAACO,GAAI;IACrCC,OAAO,EAAEZ,SAAS,aAATA,SAAS,cAATA,SAAS,GAAII,YAAY,CAACS,EAAG;IACtCC,SAAS,EAAC;EAAS,EACpB,CAAC;AAEN;AAEAjB,gBAAgB,CAACkB,qBAAqB,GAAG,IAAI;AAC7C,eAAelB,gBAAgB"}

package/es/extensions/forms/Field/Composition/CompositionDocs.js

@@ -1,8 +1,8 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-import { fieldBlockProperties } from '../../FieldBlock/FieldBlockDocs';
-export const CompositionProperties = _objectSpread(_objectSpread({}, fieldBlockProperties), {}, {
+import { FieldBlockProperties } from '../../FieldBlock/FieldBlockDocs';
+export const CompositionProperties = _objectSpread(_objectSpread({}, FieldBlockProperties), {}, {
   align: {
     doc: '`center` or `bottom` for aligning the contents vertically. Defaults to `bottom`.',
     type: ['string', 'false'],

package/es/extensions/forms/Field/Composition/CompositionDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"CompositionDocs.js","names":["fieldBlockProperties","CompositionProperties","_objectSpread","align","doc","type","status","asFieldset","undefined","composition"],"sources":["../../../../../../src/extensions/forms/Field/Composition/CompositionDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\nimport { fieldBlockProperties } from '../../FieldBlock/FieldBlockDocs'\n\nexport const CompositionProperties: PropertiesTableProps = {\n  ...fieldBlockProperties,\n  align: {\n    doc: '`center` or `bottom` for aligning the contents vertically. Defaults to `bottom`.',\n    type: ['string', 'false'],\n    status: 'optional',\n  },\n  asFieldset: undefined,\n  composition: undefined,\n}\n"],"mappings":";;;AACA,SAASA,oBAAoB,QAAQ,iCAAiC;AAEtE,OAAO,MAAMC,qBAA2C,GAAAC,aAAA,CAAAA,aAAA,KACnDF,oBAAoB;EACvBG,KAAK,EAAE;IACLC,GAAG,EAAE,kFAAkF;IACvFC,IAAI,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC;IACzBC,MAAM,EAAE;EACV,CAAC;EACDC,UAAU,EAAEC,SAAS;EACrBC,WAAW,EAAED;AAAS,EACvB"}
+{"version":3,"file":"CompositionDocs.js","names":["FieldBlockProperties","CompositionProperties","_objectSpread","align","doc","type","status","asFieldset","undefined","composition"],"sources":["../../../../../../src/extensions/forms/Field/Composition/CompositionDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\nimport { FieldBlockProperties } from '../../FieldBlock/FieldBlockDocs'\n\nexport const CompositionProperties: PropertiesTableProps = {\n  ...FieldBlockProperties,\n  align: {\n    doc: '`center` or `bottom` for aligning the contents vertically. Defaults to `bottom`.',\n    type: ['string', 'false'],\n    status: 'optional',\n  },\n  asFieldset: undefined,\n  composition: undefined,\n}\n"],"mappings":";;;AACA,SAASA,oBAAoB,QAAQ,iCAAiC;AAEtE,OAAO,MAAMC,qBAA2C,GAAAC,aAAA,CAAAA,aAAA,KACnDF,oBAAoB;EACvBG,KAAK,EAAE;IACLC,GAAG,EAAE,kFAAkF;IACvFC,IAAI,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC;IACzBC,MAAM,EAAE;EACV,CAAC;EACDC,UAAU,EAAEC,SAAS;EACrBC,WAAW,EAAED;AAAS,EACvB"}

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

@@ -58,12 +58,8 @@ function DateComponent(props) {
     path,
     className,
     label,
-    labelDescription,
     value,
     help,
-    info,
-    warning,
-    error,
     hasError,
     disabled,
     htmlAttributes,
@@ -90,16 +86,12 @@ function DateComponent(props) {
       }));
     }
   }, [locale, path, setDisplayValue, value]);
-  return React.createElement(FieldBlock, _extends({
-    className: classnames('dnb-forms-field-string', className),
+  const fieldBlockProps = _objectSpread({
     forId: id,
     label: label !== null && label !== void 0 ? label : translations.Date.label,
-    labelDescription: labelDescription,
-    info: info,
-    warning: warning,
-    disabled: disabled,
-    error: error
-  }, pickSpacingProps(props)), React.createElement(DatePicker, _extends({
+    className: classnames('dnb-forms-field-string', className)
+  }, pickSpacingProps(props));
+  return React.createElement(FieldBlock, fieldBlockProps, React.createElement(DatePicker, _extends({
     id: id,
     date: !range ? value : undefined,
     disabled: disabled,

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

@@ -1 +1 @@
-{"version":3,"file":"Date.js","names":["React","useCallback","useContext","useMemo","DatePicker","HelpButton","useFieldProps","pickSpacingProps","classnames","FieldBlock","SharedContext","parseISO","isValid","useTranslation","formatDate","DateComponent","props","translations","locale","errorMessages","_objectSpread","Date","errorRequired","schema","_props$schema","type","pattern","validateRequired","value","required","error","undefined","preparedProps","fromInput","date","start_date","end_date","range","id","path","className","label","labelDescription","help","info","warning","hasError","disabled","htmlAttributes","handleFocus","handleBlur","handleChange","setDisplayValue","rangeValue","startDate","endDate","split","createElement","_extends","forId","show_input","show_cancel_button","show_reset_button","status","suffix","title","content","on_change","on_reset","onFocus","onBlur","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Date/Date.tsx"],"sourcesContent":["import React, { useCallback, useContext, useMemo } from 'react'\nimport { DatePicker, HelpButton } from '../../../../components'\nimport { useFieldProps } from '../../hooks'\nimport {\n  FieldProps,\n  FieldHelpProps,\n  AllJSONSchemaVersions,\n} from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport classnames from 'classnames'\nimport FieldBlock from '../../FieldBlock'\nimport SharedContext from '../../../../shared/Context'\nimport { parseISO, isValid } from 'date-fns'\nimport useTranslation from '../../hooks/useTranslation'\nimport { DatePickerEvent } from '../../../../components/DatePicker'\nimport { formatDate } from '../../Value/Date'\n\nexport type Props = FieldHelpProps &\n  FieldProps<string, undefined | string> & {\n    // Validation\n    pattern?: string\n    /**\n     * Defines if the Date field should support a value of two dates (starting and ending date).\n     * The value needs to be a string containing two dates, separated by a pipe character (`|`) i.e. (`01-09-2024|30-09-2024`) when this is set to `true`.\n     * Defaults to `false`.\n     */\n    range?: boolean\n  }\n\nfunction DateComponent(props: Props) {\n  const translations = useTranslation()\n  const { locale } = useContext(SharedContext)\n\n  const errorMessages = useMemo(() => {\n    return {\n      'Field.errorRequired': translations.Date.errorRequired,\n      'Field.errorPattern': translations.Date.errorRequired,\n      ...props.errorMessages,\n    }\n  }, [props.errorMessages, translations.Date.errorRequired])\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\n  const validateRequired = useCallback(\n    (value: string, { required, error }) => {\n      if (required && (!value || !isValid(parseISO(value)))) {\n        return error\n      }\n\n      return undefined\n    },\n    []\n  )\n\n  const preparedProps: Props = {\n    ...props,\n    errorMessages,\n    schema,\n    fromInput: ({\n      date,\n      start_date,\n      end_date,\n    }: DatePickerEvent<React.ChangeEvent<HTMLInputElement>>) => {\n      return range ? `${start_date}|${end_date}` : date\n    },\n    validateRequired,\n  }\n\n  const {\n    id,\n    path,\n    className,\n    label,\n    labelDescription,\n    value,\n    help,\n    info,\n    warning,\n    error,\n    hasError,\n    disabled,\n    htmlAttributes,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    setDisplayValue,\n    range,\n  } = useFieldProps(preparedProps)\n\n  const rangeValue = useMemo(() => {\n    if (!range) {\n      return\n    }\n\n    const [startDate, endDate] = value.split('|')\n\n    return { startDate, endDate }\n  }, [range, value])\n\n  useMemo(() => {\n    if (path && value) {\n      setDisplayValue(path, formatDate(value, { locale }))\n    }\n  }, [locale, path, setDisplayValue, value])\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-string', className)}\n      forId={id}\n      label={label ?? translations.Date.label}\n      labelDescription={labelDescription}\n      info={info}\n      warning={warning}\n      disabled={disabled}\n      error={error}\n      {...pickSpacingProps(props)}\n    >\n      <DatePicker\n        id={id}\n        date={!range ? value : undefined}\n        disabled={disabled}\n        show_input={true}\n        show_cancel_button={true}\n        show_reset_button={true}\n        start_date={range ? rangeValue.startDate : undefined}\n        end_date={range ? rangeValue.endDate : undefined}\n        status={hasError ? 'error' : undefined}\n        suffix={\n          help ? (\n            <HelpButton title={help.title}>{help.content}</HelpButton>\n          ) : undefined\n        }\n        range={range}\n        on_change={handleChange}\n        on_reset={handleChange}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        {...htmlAttributes}\n      />\n    </FieldBlock>\n  )\n}\n\nDateComponent._supportsSpacingProps = true\nexport default DateComponent\n"],"mappings":"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"}
+{"version":3,"file":"Date.js","names":["React","useCallback","useContext","useMemo","DatePicker","HelpButton","useFieldProps","pickSpacingProps","classnames","FieldBlock","SharedContext","parseISO","isValid","useTranslation","formatDate","DateComponent","props","translations","locale","errorMessages","_objectSpread","Date","errorRequired","schema","_props$schema","type","pattern","validateRequired","value","required","error","undefined","preparedProps","fromInput","date","start_date","end_date","range","id","path","className","label","help","hasError","disabled","htmlAttributes","handleFocus","handleBlur","handleChange","setDisplayValue","rangeValue","startDate","endDate","split","fieldBlockProps","forId","createElement","_extends","show_input","show_cancel_button","show_reset_button","status","suffix","title","content","on_change","on_reset","onFocus","onBlur","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Date/Date.tsx"],"sourcesContent":["import React, { useCallback, useContext, useMemo } from 'react'\nimport { DatePicker, HelpButton } from '../../../../components'\nimport { useFieldProps } from '../../hooks'\nimport {\n  FieldProps,\n  FieldHelpProps,\n  AllJSONSchemaVersions,\n} from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport classnames from 'classnames'\nimport FieldBlock, { Props as FieldBlockProps } from '../../FieldBlock'\nimport SharedContext from '../../../../shared/Context'\nimport { parseISO, isValid } from 'date-fns'\nimport useTranslation from '../../hooks/useTranslation'\nimport { DatePickerEvent } from '../../../../components/DatePicker'\nimport { formatDate } from '../../Value/Date'\n\nexport type Props = FieldHelpProps &\n  FieldProps<string, undefined | string> & {\n    // Validation\n    pattern?: string\n    /**\n     * Defines if the Date field should support a value of two dates (starting and ending date).\n     * The value needs to be a string containing two dates, separated by a pipe character (`|`) i.e. (`01-09-2024|30-09-2024`) when this is set to `true`.\n     * Defaults to `false`.\n     */\n    range?: boolean\n  }\n\nfunction DateComponent(props: Props) {\n  const translations = useTranslation()\n  const { locale } = useContext(SharedContext)\n\n  const errorMessages = useMemo(() => {\n    return {\n      'Field.errorRequired': translations.Date.errorRequired,\n      'Field.errorPattern': translations.Date.errorRequired,\n      ...props.errorMessages,\n    }\n  }, [props.errorMessages, translations.Date.errorRequired])\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\n  const validateRequired = useCallback(\n    (value: string, { required, error }) => {\n      if (required && (!value || !isValid(parseISO(value)))) {\n        return error\n      }\n\n      return undefined\n    },\n    []\n  )\n\n  const preparedProps: Props = {\n    ...props,\n    errorMessages,\n    schema,\n    fromInput: ({\n      date,\n      start_date,\n      end_date,\n    }: DatePickerEvent<React.ChangeEvent<HTMLInputElement>>) => {\n      return range ? `${start_date}|${end_date}` : date\n    },\n    validateRequired,\n  }\n\n  const {\n    id,\n    path,\n    className,\n    label,\n    value,\n    help,\n    hasError,\n    disabled,\n    htmlAttributes,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    setDisplayValue,\n    range,\n  } = useFieldProps(preparedProps)\n\n  const rangeValue = useMemo(() => {\n    if (!range) {\n      return\n    }\n\n    const [startDate, endDate] = value.split('|')\n\n    return { startDate, endDate }\n  }, [range, value])\n\n  useMemo(() => {\n    if (path && value) {\n      setDisplayValue(path, formatDate(value, { locale }))\n    }\n  }, [locale, path, setDisplayValue, value])\n\n  const fieldBlockProps: FieldBlockProps = {\n    forId: id,\n    label: label ?? translations.Date.label,\n    className: classnames('dnb-forms-field-string', className),\n    ...pickSpacingProps(props),\n  }\n\n  return (\n    <FieldBlock {...fieldBlockProps}>\n      <DatePicker\n        id={id}\n        date={!range ? value : undefined}\n        disabled={disabled}\n        show_input={true}\n        show_cancel_button={true}\n        show_reset_button={true}\n        start_date={range ? rangeValue.startDate : undefined}\n        end_date={range ? rangeValue.endDate : undefined}\n        status={hasError ? 'error' : undefined}\n        suffix={\n          help ? (\n            <HelpButton title={help.title}>{help.content}</HelpButton>\n          ) : undefined\n        }\n        range={range}\n        on_change={handleChange}\n        on_reset={handleChange}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        {...htmlAttributes}\n      />\n    </FieldBlock>\n  )\n}\n\nDateComponent._supportsSpacingProps = true\nexport default DateComponent\n"],"mappings":"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"}

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

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -46,15 +45,12 @@ function Expiry(props) {
     path,
     className,
     label = expiryLabel,
-    error,
     hasError,
     info,
     warning,
     help,
     disabled,
     value = '',
-    labelDescription,
-    layout = 'vertical',
     htmlAttributes,
     handleFocus,
     handleBlur,
@@ -74,17 +70,13 @@ function Expiry(props) {
     }
   }, [expiry.month, expiry.year, path, setDisplayValue]);
   const status = hasError ? 'error' : warning ? 'warn' : info ? 'info' : null;
-  return React.createElement(FieldBlock, _extends({
-    className: classnames('dnb-forms-field-expiry', className),
-    id: id,
+  const fieldBlockProps = _objectSpread({
+    id,
     forId: `${id}-input-month`,
-    label: label,
-    layout: layout,
-    labelDescription: labelDescription,
-    info: info,
-    warning: warning,
-    error: error
-  }, pickSpacingProps(props)), React.createElement(MultiInputMask, {
+    className: classnames('dnb-forms-field-expiry', className),
+    label
+  }, pickSpacingProps(props));
+  return React.createElement(FieldBlock, fieldBlockProps, React.createElement(MultiInputMask, {
     stretch: true,
     id: `${id}-input`,
     values: expiry,

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

@@ -1 +1 @@
-{"version":3,"file":"Expiry.js","names":["React","useCallback","useMemo","pickSpacingProps","useFieldProps","classnames","FieldBlock","MultiInputMask","HelpButton","useTranslation","useSharedTranslation","Expiry","props","Date","errorRequired","label","expiryLabel","DatePicker","placeholder_characters","placeholders","month","monthLabel","year","yearLabel","errorMessages","_objectSpread","validateRequired","value","required","error","undefined","preparedProps","fromInput","toExpiryString","id","path","className","hasError","info","warning","help","disabled","labelDescription","layout","htmlAttributes","handleFocus","handleBlur","handleChange","setDisplayValue","expiry","_value$substring","ensureValidMonth","substring","status","createElement","_extends","forId","stretch","values","statusState","onChange","onBlur","onFocus","delimiter","inputMode","inputs","mask","getMonthMask","placeholderCharacter","autoComplete","suffix","title","content","_supportsEufemiaSpacingProps","Object","join","firstMask","secondMask","firstDigit","charAt","isFirstDigitValid","test","secondDigit","isSecondDigitValid"],"sources":["../../../../../../src/extensions/forms/Field/Expiry/Expiry.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react'\nimport { FieldHelpProps, FieldProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport { useFieldProps } from '../../hooks'\nimport classnames from 'classnames'\nimport FieldBlock from '../../FieldBlock'\nimport { MultiInputMask } from '../../../../components/input-masked'\nimport type { MultiInputMaskValue } from '../../../../components/input-masked'\nimport { HelpButton } from '../../../../components'\nimport { useTranslation as useSharedTranslation } from '../../../../shared'\nimport useTranslation from '../../hooks/useTranslation'\n\ntype ExpiryValue = MultiInputMaskValue<'month' | 'year'>\n\nexport type ExpiryProps = FieldHelpProps &\n  FieldProps<string, undefined | ''>\n\nfunction Expiry(props: ExpiryProps) {\n  const {\n    Date: { errorRequired },\n    Expiry: { label: expiryLabel },\n  } = useTranslation()\n\n  const {\n    DatePicker: {\n      placeholder_characters: placeholders,\n      month: monthLabel,\n      year: yearLabel,\n    },\n  } = useSharedTranslation()\n\n  const errorMessages = useMemo(\n    () => ({\n      'Field.errorRequired': errorRequired,\n      ...props.errorMessages,\n    }),\n    [errorRequired, props.errorMessages]\n  )\n\n  const validateRequired = useCallback(\n    (value: string, { required, error }) => {\n      return required && !value ? error : undefined\n    },\n    []\n  )\n\n  const preparedProps: ExpiryProps = {\n    ...props,\n    errorMessages,\n    fromInput: toExpiryString,\n    validateRequired,\n  }\n\n  const {\n    id,\n    path,\n    className,\n    label = expiryLabel,\n    error,\n    hasError,\n    info,\n    warning,\n    help,\n    disabled,\n    value = '',\n    labelDescription,\n    layout = 'vertical',\n    htmlAttributes,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    setDisplayValue,\n  } = useFieldProps(preparedProps)\n\n  const expiry: ExpiryValue = useMemo(() => {\n    return {\n      month: ensureValidMonth(value?.substring(0, 2)),\n      year: value?.substring(2, 4) ?? '',\n    }\n  }, [value])\n\n  useMemo(() => {\n    if (path && expiry.month && expiry.year) {\n      setDisplayValue(path, `${expiry.month}/${expiry.year}`)\n    }\n  }, [expiry.month, expiry.year, path, setDisplayValue])\n\n  const status = hasError\n    ? 'error'\n    : warning\n    ? 'warn'\n    : info\n    ? 'info'\n    : null\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-expiry', className)}\n      id={id}\n      forId={`${id}-input-month`}\n      label={label}\n      layout={layout}\n      labelDescription={labelDescription}\n      info={info}\n      warning={warning}\n      error={error}\n      {...pickSpacingProps(props)}\n    >\n      <MultiInputMask\n        stretch\n        id={`${id}-input`}\n        values={expiry}\n        status={status}\n        statusState={disabled ? 'disabled' : undefined}\n        disabled={disabled}\n        onChange={handleChange}\n        onBlur={handleBlur}\n        onFocus={handleFocus}\n        delimiter=\"/\"\n        inputMode=\"numeric\"\n        inputs={[\n          {\n            id: 'month',\n            label: monthLabel,\n            mask: getMonthMask(expiry?.month),\n            placeholderCharacter: placeholders['month'],\n            autoComplete: 'cc-exp-month',\n            ...htmlAttributes,\n          },\n          {\n            id: 'year',\n            label: yearLabel,\n            mask: [/[0-9]/, /[0-9]/],\n            placeholderCharacter: placeholders['year'],\n            autoComplete: 'cc-exp-year',\n            ...htmlAttributes,\n          },\n        ]}\n        suffix={\n          help ? (\n            <HelpButton title={help.title}>{help.content}</HelpButton>\n          ) : undefined\n        }\n      />\n    </FieldBlock>\n  )\n}\n\nExpiry._supportsEufemiaSpacingProps = true\nexport default Expiry\n\nfunction toExpiryString(values: ExpiryValue) {\n  return Object.values(values).join('')\n}\n\nfunction ensureValidMonth(month: string) {\n  // Return empty value if no month is given\n  if (!month) {\n    return ''\n  }\n\n  const [firstMask, secondMask] = getMonthMask(month)\n\n  const firstDigit = month?.charAt(0)\n  const isFirstDigitValid = firstMask.test(firstDigit)\n\n  if (firstDigit && !isFirstDigitValid) {\n    // Return empty value if the first digit is invalid\n    return ''\n  }\n\n  const secondDigit = month?.charAt(1)\n  const isSecondDigitValid = secondMask.test(secondDigit)\n\n  if (secondDigit && !isSecondDigitValid) {\n    // Return empty value if the second digit is invalid\n    return ''\n  }\n\n  // Return given month of month value is valid\n  return month\n}\n\nfunction getMonthMask(month: string) {\n  const firstDigit = month?.charAt(0)\n\n  return [\n    /[0-1]/,\n    firstDigit === '0' || firstDigit === '' ? /[1-9]/ : /[0-2]/,\n  ]\n}\n"],"mappings":"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"}
+{"version":3,"file":"Expiry.js","names":["React","useCallback","useMemo","pickSpacingProps","useFieldProps","classnames","FieldBlock","MultiInputMask","HelpButton","useTranslation","useSharedTranslation","Expiry","props","Date","errorRequired","label","expiryLabel","DatePicker","placeholder_characters","placeholders","month","monthLabel","year","yearLabel","errorMessages","_objectSpread","validateRequired","value","required","error","undefined","preparedProps","fromInput","toExpiryString","id","path","className","hasError","info","warning","help","disabled","htmlAttributes","handleFocus","handleBlur","handleChange","setDisplayValue","expiry","_value$substring","ensureValidMonth","substring","status","fieldBlockProps","forId","createElement","stretch","values","statusState","onChange","onBlur","onFocus","delimiter","inputMode","inputs","mask","getMonthMask","placeholderCharacter","autoComplete","suffix","title","content","_supportsEufemiaSpacingProps","Object","join","firstMask","secondMask","firstDigit","charAt","isFirstDigitValid","test","secondDigit","isSecondDigitValid"],"sources":["../../../../../../src/extensions/forms/Field/Expiry/Expiry.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react'\nimport { FieldHelpProps, FieldProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport { useFieldProps } from '../../hooks'\nimport classnames from 'classnames'\nimport FieldBlock, { Props as FieldBlockProps } from '../../FieldBlock'\nimport { MultiInputMask } from '../../../../components/input-masked'\nimport type { MultiInputMaskValue } from '../../../../components/input-masked'\nimport { HelpButton } from '../../../../components'\nimport { useTranslation as useSharedTranslation } from '../../../../shared'\nimport useTranslation from '../../hooks/useTranslation'\n\ntype ExpiryValue = MultiInputMaskValue<'month' | 'year'>\n\nexport type ExpiryProps = FieldHelpProps &\n  FieldProps<string, undefined | ''>\n\nfunction Expiry(props: ExpiryProps) {\n  const {\n    Date: { errorRequired },\n    Expiry: { label: expiryLabel },\n  } = useTranslation()\n\n  const {\n    DatePicker: {\n      placeholder_characters: placeholders,\n      month: monthLabel,\n      year: yearLabel,\n    },\n  } = useSharedTranslation()\n\n  const errorMessages = useMemo(\n    () => ({\n      'Field.errorRequired': errorRequired,\n      ...props.errorMessages,\n    }),\n    [errorRequired, props.errorMessages]\n  )\n\n  const validateRequired = useCallback(\n    (value: string, { required, error }) => {\n      return required && !value ? error : undefined\n    },\n    []\n  )\n\n  const preparedProps: ExpiryProps = {\n    ...props,\n    errorMessages,\n    fromInput: toExpiryString,\n    validateRequired,\n  }\n\n  const {\n    id,\n    path,\n    className,\n    label = expiryLabel,\n    hasError,\n    info,\n    warning,\n    help,\n    disabled,\n    value = '',\n    htmlAttributes,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    setDisplayValue,\n  } = useFieldProps(preparedProps)\n\n  const expiry: ExpiryValue = useMemo(() => {\n    return {\n      month: ensureValidMonth(value?.substring(0, 2)),\n      year: value?.substring(2, 4) ?? '',\n    }\n  }, [value])\n\n  useMemo(() => {\n    if (path && expiry.month && expiry.year) {\n      setDisplayValue(path, `${expiry.month}/${expiry.year}`)\n    }\n  }, [expiry.month, expiry.year, path, setDisplayValue])\n\n  const status = hasError\n    ? 'error'\n    : warning\n    ? 'warn'\n    : info\n    ? 'info'\n    : null\n\n  const fieldBlockProps: FieldBlockProps = {\n    id,\n    forId: `${id}-input-month`,\n    className: classnames('dnb-forms-field-expiry', className),\n    label,\n    ...pickSpacingProps(props),\n  }\n\n  return (\n    <FieldBlock {...fieldBlockProps}>\n      <MultiInputMask\n        stretch\n        id={`${id}-input`}\n        values={expiry}\n        status={status}\n        statusState={disabled ? 'disabled' : undefined}\n        disabled={disabled}\n        onChange={handleChange}\n        onBlur={handleBlur}\n        onFocus={handleFocus}\n        delimiter=\"/\"\n        inputMode=\"numeric\"\n        inputs={[\n          {\n            id: 'month',\n            label: monthLabel,\n            mask: getMonthMask(expiry?.month),\n            placeholderCharacter: placeholders['month'],\n            autoComplete: 'cc-exp-month',\n            ...htmlAttributes,\n          },\n          {\n            id: 'year',\n            label: yearLabel,\n            mask: [/[0-9]/, /[0-9]/],\n            placeholderCharacter: placeholders['year'],\n            autoComplete: 'cc-exp-year',\n            ...htmlAttributes,\n          },\n        ]}\n        suffix={\n          help ? (\n            <HelpButton title={help.title}>{help.content}</HelpButton>\n          ) : undefined\n        }\n      />\n    </FieldBlock>\n  )\n}\n\nExpiry._supportsEufemiaSpacingProps = true\nexport default Expiry\n\nfunction toExpiryString(values: ExpiryValue) {\n  return Object.values(values).join('')\n}\n\nfunction ensureValidMonth(month: string) {\n  // Return empty value if no month is given\n  if (!month) {\n    return ''\n  }\n\n  const [firstMask, secondMask] = getMonthMask(month)\n\n  const firstDigit = month?.charAt(0)\n  const isFirstDigitValid = firstMask.test(firstDigit)\n\n  if (firstDigit && !isFirstDigitValid) {\n    // Return empty value if the first digit is invalid\n    return ''\n  }\n\n  const secondDigit = month?.charAt(1)\n  const isSecondDigitValid = secondMask.test(secondDigit)\n\n  if (secondDigit && !isSecondDigitValid) {\n    // Return empty value if the second digit is invalid\n    return ''\n  }\n\n  // Return given month of month value is valid\n  return month\n}\n\nfunction getMonthMask(month: string) {\n  const firstDigit = month?.charAt(0)\n\n  return [\n    /[0-1]/,\n    firstDigit === '0' || firstDigit === '' ? /[1-9]/ : /[0-2]/,\n  ]\n}\n"],"mappings":"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"}

package/es/extensions/forms/Field/FieldDocs.d.ts

@@ -1,6 +1,6 @@
 import { PropertiesTableProps } from '../../../shared/types';
-export declare const fieldProperties: PropertiesTableProps;
-export declare const fieldEvents: PropertiesTableProps;
+export declare const FieldProperties: PropertiesTableProps;
+export declare const FieldEvents: PropertiesTableProps;
 export declare const getFieldEventsWithTypes: (valueType?: {
     type: string;
     optional?: boolean;

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

@@ -1,22 +1,22 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-import { fieldBlockSharedProperties } from '../FieldBlock/FieldBlockDocs';
-import { dataValueEvents, dataValueProperties } from '../hooks/DataValueDocs';
-export const fieldProperties = _objectSpread(_objectSpread({}, dataValueProperties), fieldBlockSharedProperties);
-export const fieldEvents = _objectSpread({}, dataValueEvents);
+import { FieldBlockSharedProperties } from '../FieldBlock/FieldBlockDocs';
+import { DataValueWritePropsEvents, DataValueWritePropsProperties } from '../hooks/DataValueWritePropsDocs';
+export const FieldProperties = _objectSpread(_objectSpread({}, DataValueWritePropsProperties), FieldBlockSharedProperties);
+export const FieldEvents = _objectSpread({}, DataValueWritePropsEvents);
 export const getFieldEventsWithTypes = (valueType = undefined, additionalArgsType = undefined) => {
   const value = valueType ? `value${valueType.optional ? '?' : ''}: ${valueType.type}` : 'value';
   const add = additionalArgsType ? `, additionalArgs${additionalArgsType.optional ? '?' : ''}: ${additionalArgsType.type}` : '';
   const typeString = `(${value}${add}) => void`;
-  return _objectSpread(_objectSpread({}, fieldEvents), {}, {
-    onChange: _objectSpread(_objectSpread({}, fieldEvents.onChange), {}, {
+  return _objectSpread(_objectSpread({}, FieldEvents), {}, {
+    onChange: _objectSpread(_objectSpread({}, FieldEvents.onChange), {}, {
       type: typeString
     }),
-    onFocus: _objectSpread(_objectSpread({}, fieldEvents.onFocus), {}, {
+    onFocus: _objectSpread(_objectSpread({}, FieldEvents.onFocus), {}, {
       type: typeString
     }),
-    onBlur: _objectSpread(_objectSpread({}, fieldEvents.onBlur), {}, {
+    onBlur: _objectSpread(_objectSpread({}, FieldEvents.onBlur), {}, {
       type: typeString
     })
   });

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

@@ -1 +1 @@
-{"version":3,"file":"FieldDocs.js","names":["fieldBlockSharedProperties","dataValueEvents","dataValueProperties","fieldProperties","_objectSpread","fieldEvents","getFieldEventsWithTypes","valueType","undefined","additionalArgsType","value","optional","type","add","typeString","onChange","onFocus","onBlur"],"sources":["../../../../../src/extensions/forms/Field/FieldDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../shared/types'\nimport { fieldBlockSharedProperties } from '../FieldBlock/FieldBlockDocs'\nimport {\n  dataValueEvents,\n  dataValueProperties,\n} from '../hooks/DataValueDocs'\n\nexport const fieldProperties: PropertiesTableProps = {\n  ...dataValueProperties,\n  ...fieldBlockSharedProperties,\n}\n\nexport const fieldEvents: PropertiesTableProps = {\n  ...dataValueEvents,\n}\n\nexport const getFieldEventsWithTypes = (\n  valueType: { type: string; optional?: boolean } = undefined,\n  additionalArgsType: { type: string; optional?: boolean } = undefined\n): PropertiesTableProps => {\n  const value = valueType\n    ? `value${valueType.optional ? '?' : ''}: ${valueType.type}`\n    : 'value'\n\n  const add = additionalArgsType\n    ? `, additionalArgs${additionalArgsType.optional ? '?' : ''}: ${\n        additionalArgsType.type\n      }`\n    : ''\n\n  const typeString = `(${value}${add}) => void`\n\n  return {\n    ...fieldEvents,\n    onChange: {\n      ...fieldEvents.onChange,\n      type: typeString,\n    },\n    onFocus: {\n      ...fieldEvents.onFocus,\n      type: typeString,\n    },\n    onBlur: {\n      ...fieldEvents.onBlur,\n      type: typeString,\n    },\n  }\n}\n"],"mappings":";;;AACA,SAASA,0BAA0B,QAAQ,8BAA8B;AACzE,SACEC,eAAe,EACfC,mBAAmB,QACd,wBAAwB;AAE/B,OAAO,MAAMC,eAAqC,GAAAC,aAAA,CAAAA,aAAA,KAC7CF,mBAAmB,GACnBF,0BAA0B,CAC9B;AAED,OAAO,MAAMK,WAAiC,GAAAD,aAAA,KACzCH,eAAe,CACnB;AAED,OAAO,MAAMK,uBAAuB,GAAGA,CACrCC,SAA+C,GAAGC,SAAS,EAC3DC,kBAAwD,GAAGD,SAAS,KAC3C;EACzB,MAAME,KAAK,GAAGH,SAAS,GAClB,QAAOA,SAAS,CAACI,QAAQ,GAAG,GAAG,GAAG,EAAG,KAAIJ,SAAS,CAACK,IAAK,EAAC,GAC1D,OAAO;EAEX,MAAMC,GAAG,GAAGJ,kBAAkB,GACzB,mBAAkBA,kBAAkB,CAACE,QAAQ,GAAG,GAAG,GAAG,EAAG,KACxDF,kBAAkB,CAACG,IACpB,EAAC,GACF,EAAE;EAEN,MAAME,UAAU,GAAI,IAAGJ,KAAM,GAAEG,GAAI,WAAU;EAE7C,OAAAT,aAAA,CAAAA,aAAA,KACKC,WAAW;IACdU,QAAQ,EAAAX,aAAA,CAAAA,aAAA,KACHC,WAAW,CAACU,QAAQ;MACvBH,IAAI,EAAEE;IAAU,EACjB;IACDE,OAAO,EAAAZ,aAAA,CAAAA,aAAA,KACFC,WAAW,CAACW,OAAO;MACtBJ,IAAI,EAAEE;IAAU,EACjB;IACDG,MAAM,EAAAb,aAAA,CAAAA,aAAA,KACDC,WAAW,CAACY,MAAM;MACrBL,IAAI,EAAEE;IAAU;EACjB;AAEL,CAAC"}
+{"version":3,"file":"FieldDocs.js","names":["FieldBlockSharedProperties","DataValueWritePropsEvents","DataValueWritePropsProperties","FieldProperties","_objectSpread","FieldEvents","getFieldEventsWithTypes","valueType","undefined","additionalArgsType","value","optional","type","add","typeString","onChange","onFocus","onBlur"],"sources":["../../../../../src/extensions/forms/Field/FieldDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../shared/types'\nimport { FieldBlockSharedProperties } from '../FieldBlock/FieldBlockDocs'\nimport {\n  DataValueWritePropsEvents,\n  DataValueWritePropsProperties,\n} from '../hooks/DataValueWritePropsDocs'\n\nexport const FieldProperties: PropertiesTableProps = {\n  ...DataValueWritePropsProperties,\n  ...FieldBlockSharedProperties,\n}\n\nexport const FieldEvents: PropertiesTableProps = {\n  ...DataValueWritePropsEvents,\n}\n\nexport const getFieldEventsWithTypes = (\n  valueType: { type: string; optional?: boolean } = undefined,\n  additionalArgsType: { type: string; optional?: boolean } = undefined\n): PropertiesTableProps => {\n  const value = valueType\n    ? `value${valueType.optional ? '?' : ''}: ${valueType.type}`\n    : 'value'\n\n  const add = additionalArgsType\n    ? `, additionalArgs${additionalArgsType.optional ? '?' : ''}: ${\n        additionalArgsType.type\n      }`\n    : ''\n\n  const typeString = `(${value}${add}) => void`\n\n  return {\n    ...FieldEvents,\n    onChange: {\n      ...FieldEvents.onChange,\n      type: typeString,\n    },\n    onFocus: {\n      ...FieldEvents.onFocus,\n      type: typeString,\n    },\n    onBlur: {\n      ...FieldEvents.onBlur,\n      type: typeString,\n    },\n  }\n}\n"],"mappings":";;;AACA,SAASA,0BAA0B,QAAQ,8BAA8B;AACzE,SACEC,yBAAyB,EACzBC,6BAA6B,QACxB,kCAAkC;AAEzC,OAAO,MAAMC,eAAqC,GAAAC,aAAA,CAAAA,aAAA,KAC7CF,6BAA6B,GAC7BF,0BAA0B,CAC9B;AAED,OAAO,MAAMK,WAAiC,GAAAD,aAAA,KACzCH,yBAAyB,CAC7B;AAED,OAAO,MAAMK,uBAAuB,GAAGA,CACrCC,SAA+C,GAAGC,SAAS,EAC3DC,kBAAwD,GAAGD,SAAS,KAC3C;EACzB,MAAME,KAAK,GAAGH,SAAS,GAClB,QAAOA,SAAS,CAACI,QAAQ,GAAG,GAAG,GAAG,EAAG,KAAIJ,SAAS,CAACK,IAAK,EAAC,GAC1D,OAAO;EAEX,MAAMC,GAAG,GAAGJ,kBAAkB,GACzB,mBAAkBA,kBAAkB,CAACE,QAAQ,GAAG,GAAG,GAAG,EAAG,KACxDF,kBAAkB,CAACG,IACpB,EAAC,GACF,EAAE;EAEN,MAAME,UAAU,GAAI,IAAGJ,KAAM,GAAEG,GAAI,WAAU;EAE7C,OAAAT,aAAA,CAAAA,aAAA,KACKC,WAAW;IACdU,QAAQ,EAAAX,aAAA,CAAAA,aAAA,KACHC,WAAW,CAACU,QAAQ;MACvBH,IAAI,EAAEE;IAAU,EACjB;IACDE,OAAO,EAAAZ,aAAA,CAAAA,aAAA,KACFC,WAAW,CAACW,OAAO;MACtBJ,IAAI,EAAEE;IAAU,EACjB;IACDG,MAAM,EAAAb,aAAA,CAAAA,aAAA,KACDC,WAAW,CAACY,MAAM;MACrBL,IAAI,EAAEE;IAAU;EACjB;AAEL,CAAC"}

package/es/extensions/forms/Field/Number/Number.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
 import { InputMaskedProps } from '../../../../components/InputMasked';
 import type { InputAlign, InputSize } from '../../../../components/Input';
-import { FieldProps, FieldHelpProps, FieldBlockWidth } from '../../types';
+import { FieldBlockWidth } from '../../FieldBlock';
+import { FieldProps, FieldHelpProps } from '../../types';
 export type Props = FieldHelpProps & FieldProps<number, undefined | number> & {
     innerRef?: React.RefObject<HTMLInputElement>;
     inputClassName?: string;

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

@@ -77,19 +77,13 @@ function NumberComponent(props) {
     innerRef,
     inputClassName,
     autoComplete,
-    layout,
     placeholder,
-    label,
-    labelDescription,
     value,
     startWith = null,
     minimum = defaultMinimum,
     maximum = defaultMaximum,
     disabled,
     htmlAttributes,
-    info,
-    warning,
-    error,
     hasError,
     help,
     size,
@@ -107,10 +101,11 @@ function NumberComponent(props) {
   const {
     handleSubmit
   } = dataContext !== null && dataContext !== void 0 ? dataContext : {};
-  const onKeyDownHandler = useCallback(({
-    event
-  }) => {
+  const onKeyDownHandler = useCallback(e => {
     var _dataContext$props;
+    const {
+      event
+    } = e;
     if (dataContext !== null && dataContext !== void 0 && (_dataContext$props = dataContext.props) !== null && _dataContext$props !== void 0 && _dataContext$props.isolate && event.key === 'Enter') {
       var _event$preventDefault;
       handleSubmit();
@@ -137,16 +132,9 @@ function NumberComponent(props) {
     }
   }, [dataContext === null || dataContext === void 0 ? void 0 : (_dataContext$props2 = dataContext.props) === null || _dataContext$props2 === void 0 ? void 0 : _dataContext$props2.isolate, handleChange, handleSubmit, maximum, minimum, showStepControls, startWith, step, value]);
   const fieldBlockProps = _objectSpread({
+    forId: id,
     className: classnames("dnb-forms-field-number dnb-input__border--tokens", className),
     contentClassName: classnames('dnb-forms-field-number__contents', showStepControls && 'dnb-forms-field-number__contents--has-controls', hasError && 'dnb-input__status--error', disabled && 'dnb-input--disabled'),
-    forId: id,
-    layout,
-    label,
-    labelDescription,
-    info,
-    warning,
-    error,
-    disabled,
     width: (width === 'stretch' || fieldBlockContext !== null && fieldBlockContext !== void 0 && fieldBlockContext.composition) && !showStepControls ? width : undefined,
     contentWidth: width !== false ? width : undefined
   }, pickSpacingProps(props));
@@ -236,11 +224,12 @@ function NumberComponent(props) {
     disabled
   }, htmlAttributes), {}, {
     status: hasError ? 'error' : undefined,
-    stretch: Boolean(width !== undefined || (fieldBlockContext === null || fieldBlockContext === void 0 ? void 0 : fieldBlockContext.composition)),
+    stretch: Boolean(width),
     suffix: help && !showStepControls ? React.createElement(HelpButton, {
       title: help.title
     }, help.content) : undefined
-  }, ariaParams);
+  });
+  Object.assign(inputProps, ariaParams);
   if (showStepControls) {
     return React.createElement(FieldBlock, _extends({}, fieldBlockProps, {
       asFieldset: false

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

@@ -1 +1 @@
-{"version":3,"file":"Number.js","names":["React","useContext","useMemo","useCallback","useEffect","useRef","InputMasked","HelpButton","Button","SharedContext","FieldBlockContext","classnames","FieldBlock","useFieldProps","pickSpacingProps","clamp","DataContext","defaultMinimum","Number","MIN_SAFE_INTEGER","defaultMaximum","MAX_SAFE_INTEGER","NumberComponent","props","_props$width","_props$innerRef","_dataContext$props2","_sharedContext$transl","_sharedContext$transl2","dataContext","fieldBlockContext","sharedContext","currency","currencyDisplay","percent","mask","step","decimalLimit","allowNegative","disallowLeadingZeroes","prefix","prefixProp","suffix","suffixProp","showStepControls","schema","_props$schema","_props$minimum","_props$maximum","type","minimum","maximum","exclusiveMinimum","exclusiveMaximum","multipleOf","toInput","external","undefined","fromInput","value","numberValue","emptyValue","ref","preparedProps","_objectSpread","valueType","width","composition","innerRef","id","name","className","inputClassName","autoComplete","layout","placeholder","label","labelDescription","startWith","disabled","htmlAttributes","info","warning","error","hasError","help","size","align","handleFocus","handleBlur","handleChange","setDisplayValue","_innerRef$current","path","current","handleSubmit","onKeyDownHandler","event","_dataContext$props","isolate","key","_event$preventDefault","preventDefault","call","persist","fieldBlockProps","contentClassName","forId","contentWidth","increaseClickHandler","increaseProps","variant","icon","tabIndex","onClick","title","translation","Slider","addTitle","replace","String","decreaseClickHandler","decreaseProps","subtractTitle","maskProps","mask_options","as_currency","currency_mask","as_percent","as_number","number_mask","ariaParams","role","inputProps","inner_ref","onKeyDown","onFocus","onBlur","onChange","status","stretch","Boolean","createElement","content","_extends","asFieldset","left","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Number/Number.tsx"],"sourcesContent":["import React, {\n  useContext,\n  useMemo,\n  useCallback,\n  useEffect,\n  useRef,\n} from 'react'\nimport { InputMasked, HelpButton, Button } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport type { InputAlign, InputSize } from '../../../../components/Input'\nimport SharedContext from '../../../../shared/Context'\nimport FieldBlockContext from '../../FieldBlock/FieldBlockContext'\nimport classnames from 'classnames'\nimport FieldBlock from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport {\n  FieldProps,\n  FieldHelpProps,\n  AllJSONSchemaVersions,\n  FieldBlockWidth,\n} from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport { ButtonProps, ButtonSize } from '../../../../components/Button'\nimport { clamp } from '../../../../components/slider/SliderHelpers'\nimport DataContext from '../../DataContext/Context'\n\nexport type Props = FieldHelpProps &\n  FieldProps<number, undefined | number> & {\n    innerRef?: React.RefObject<HTMLInputElement>\n    inputClassName?: string\n    currency?: InputMaskedProps['as_currency']\n    currencyDisplay?: 'code' | 'symbol' | 'narrowSymbol' | 'name'\n    percent?: InputMaskedProps['as_percent']\n    mask?: InputMaskedProps['mask']\n    step?: number\n    startWith?: number\n    // Formatting\n    decimalLimit?: number\n    allowNegative?: boolean\n    disallowLeadingZeroes?: boolean\n    prefix?: string | ((value: number) => string)\n    suffix?: string | ((value: number) => string)\n    // Validation\n    minimum?: number // aka greater than or equal to\n    maximum?: number // aka less than or equal to\n    exclusiveMinimum?: number // aka greater than\n    exclusiveMaximum?: number // aka less than\n    multipleOf?: number\n    // Styling\n    size?: InputSize\n    width?: FieldBlockWidth\n    align?: InputAlign\n    showStepControls?: boolean\n  }\n\nconst defaultMinimum = Number.MIN_SAFE_INTEGER\nconst defaultMaximum = Number.MAX_SAFE_INTEGER\n\nfunction NumberComponent(props: Props) {\n  const dataContext = useContext(DataContext)\n  const fieldBlockContext = useContext(FieldBlockContext)\n  const sharedContext = useContext(SharedContext)\n\n  const {\n    currency,\n    currencyDisplay,\n    percent,\n    mask,\n    step = 1,\n    decimalLimit = 12,\n    allowNegative = true,\n    disallowLeadingZeroes = false,\n    prefix: prefixProp,\n    suffix: suffixProp,\n    showStepControls,\n  } = props\n\n  const schema = useMemo<AllJSONSchemaVersions>(\n    () =>\n      props.schema ?? {\n        type: 'number',\n        minimum: props.minimum ?? defaultMinimum,\n        maximum: props.maximum ?? defaultMaximum,\n        exclusiveMinimum: props.exclusiveMinimum,\n        exclusiveMaximum: props.exclusiveMaximum,\n        multipleOf: props.multipleOf,\n      },\n    [\n      props.schema,\n      props.minimum,\n      props.maximum,\n      props.exclusiveMinimum,\n      props.exclusiveMaximum,\n      props.multipleOf,\n    ]\n  )\n\n  const toInput = useCallback((external: number | undefined) => {\n    if (external === undefined) {\n      return null\n    }\n    return external\n  }, [])\n  const fromInput = useCallback(\n    ({ value, numberValue }: { value: string; numberValue: number }) => {\n      if (value === '') {\n        return props.emptyValue\n      }\n      return numberValue\n    },\n    [props.emptyValue]\n  )\n\n  const ref = useRef<HTMLInputElement>()\n  const preparedProps: Props = {\n    valueType: 'number',\n    ...props,\n    schema,\n    toInput,\n    fromInput,\n    width:\n      props.width ??\n      (fieldBlockContext?.composition ? 'stretch' : 'medium'),\n    innerRef: props.innerRef ?? ref,\n  }\n\n  const {\n    id,\n    name,\n    className,\n    innerRef,\n    inputClassName,\n    autoComplete,\n    layout,\n    placeholder,\n    label,\n    labelDescription,\n    value,\n    startWith = null,\n    minimum = defaultMinimum,\n    maximum = defaultMaximum,\n    disabled,\n    htmlAttributes,\n    info,\n    warning,\n    error,\n    hasError,\n    help,\n    size,\n    width,\n    align,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    setDisplayValue,\n  } = useFieldProps(preparedProps)\n\n  useEffect(() => {\n    setDisplayValue(props.path, innerRef.current?.value)\n  }, [innerRef, props.path, setDisplayValue, value])\n\n  const { handleSubmit } = dataContext ?? {}\n  const onKeyDownHandler = useCallback(\n    ({ event }: { event: React.KeyboardEvent<HTMLInputElement> }) => {\n      if (dataContext?.props?.isolate && event.key === 'Enter') {\n        handleSubmit() // So we commit the data to the outer context\n        event.preventDefault?.() // And prevent the default form submit\n      }\n\n      if (!showStepControls) {\n        return\n      }\n\n      let numberValue = null\n\n      switch (event.key) {\n        case 'ArrowUp':\n          numberValue = clamp(\n            (value ?? startWith) + step,\n            minimum,\n            maximum\n          )\n          break\n        case 'ArrowDown':\n          numberValue = clamp(\n            (value ?? startWith) - step,\n            minimum,\n            maximum\n          )\n          break\n      }\n\n      if (numberValue !== null) {\n        event.persist()\n        event.preventDefault()\n        handleChange({ numberValue })\n      }\n    },\n    [\n      dataContext?.props?.isolate,\n      handleChange,\n      handleSubmit,\n      maximum,\n      minimum,\n      showStepControls,\n      startWith,\n      step,\n      value,\n    ]\n  )\n\n  const fieldBlockProps = {\n    className: classnames(\n      'dnb-forms-field-number',\n      'dnb-input__border--tokens', // Used by \"dnb-input__border\"\n      className\n    ),\n    contentClassName: classnames(\n      'dnb-forms-field-number__contents',\n      showStepControls && 'dnb-forms-field-number__contents--has-controls',\n      hasError && 'dnb-input__status--error', // Also used by \"dnb-input__border\"\n      disabled && 'dnb-input--disabled' // Also used by \"dnb-input__border\"\n    ),\n    forId: id,\n    layout,\n    label,\n    labelDescription,\n    info,\n    warning,\n    error,\n    disabled,\n    width:\n      (width === 'stretch' || fieldBlockContext?.composition) &&\n      !showStepControls\n        ? width\n        : undefined,\n    contentWidth: width !== false ? width : undefined,\n    ...pickSpacingProps(props),\n  }\n\n  const increaseClickHandler = useCallback(() => {\n    handleChange({\n      numberValue: clamp((value ?? startWith) + step, minimum, maximum),\n    })\n  }, [handleChange, maximum, minimum, startWith, step, value])\n\n  const increaseProps: ButtonProps = showStepControls && {\n    'aria-hidden': true,\n    className: 'dnb-button--control-after',\n    variant: 'secondary',\n    icon: 'add',\n    size: (size || 'small') as ButtonSize,\n    tabIndex: -1,\n    disabled: disabled || value >= maximum,\n    onClick: increaseClickHandler,\n    title: sharedContext?.translation.Slider.addTitle?.replace(\n      '%s',\n      String(value + step)\n    ),\n  }\n\n  const decreaseClickHandler = useCallback(() => {\n    handleChange({\n      numberValue: clamp((value ?? startWith) - step, minimum, maximum),\n    })\n  }, [handleChange, maximum, minimum, startWith, step, value])\n\n  const decreaseProps: ButtonProps = showStepControls && {\n    ...increaseProps,\n    className: 'dnb-button--control-before',\n    icon: 'subtract',\n    size: (size || 'small') as ButtonSize,\n    disabled: disabled || value <= minimum,\n    onClick: decreaseClickHandler,\n    title: sharedContext?.translation.Slider.subtractTitle?.replace(\n      '%s',\n      String(value - step)\n    ),\n  }\n\n  const prefix =\n    typeof prefixProp === 'function' ? prefixProp(value) : prefixProp\n  const suffix =\n    typeof suffixProp === 'function' ? suffixProp(value) : suffixProp\n\n  const maskProps: Partial<InputMaskedProps> = useMemo(() => {\n    const mask_options = {\n      prefix,\n      suffix,\n      decimalLimit,\n      allowNegative,\n      disallowLeadingZeroes,\n    }\n\n    if (currency) {\n      return {\n        as_currency: currency,\n        mask_options,\n        currency_mask: {\n          currencyDisplay,\n          decimalLimit,\n        },\n      }\n    }\n\n    if (percent) {\n      return {\n        as_percent: percent,\n        mask_options,\n      }\n    }\n\n    // Custom mask based on props\n    return {\n      as_number: true,\n      mask,\n      number_mask: {\n        ...mask_options,\n      },\n    }\n  }, [\n    currency,\n    currencyDisplay,\n    decimalLimit,\n    mask,\n    percent,\n    prefix,\n    suffix,\n    allowNegative,\n    disallowLeadingZeroes,\n  ])\n\n  const ariaParams = showStepControls && {\n    role: 'spinbutton',\n    'aria-valuemin': String(minimum),\n    'aria-valuemax': String(maximum),\n    'aria-valuenow': String(value), // without it, VO will read an invalid value\n    'aria-valuetext': String(value), // without it, VO will read %\n  }\n\n  const inputProps = {\n    id,\n    name,\n    inner_ref: innerRef,\n    autoComplete,\n    className: classnames(\n      'dnb-forms-field-number__input',\n      `dnb-input--${size}`,\n      inputClassName\n    ),\n    step: showStepControls ? step : undefined,\n    placeholder,\n    value,\n    align: showStepControls ? 'center' : align,\n    ...maskProps,\n    onKeyDown: onKeyDownHandler,\n    onFocus: handleFocus,\n    onBlur: handleBlur,\n    onChange: handleChange,\n    disabled,\n    ...htmlAttributes,\n    status: hasError ? 'error' : undefined,\n    stretch: Boolean(\n      width !== undefined || fieldBlockContext?.composition\n    ),\n    suffix:\n      help && !showStepControls ? (\n        <HelpButton title={help.title}>{help.content}</HelpButton>\n      ) : undefined,\n    ...ariaParams,\n  }\n\n  if (showStepControls) {\n    return (\n      <FieldBlock {...fieldBlockProps} asFieldset={false}>\n        <span className=\"dnb-input__border dnb-input__border--root\">\n          {<Button {...decreaseProps} />}\n          <InputMasked {...inputProps} />\n          {<Button {...increaseProps} />}\n        </span>\n        {help && (\n          <HelpButton left=\"x-small\" title={help.title}>\n            {help.content}\n          </HelpButton>\n        )}\n      </FieldBlock>\n    )\n  }\n\n  return (\n    <FieldBlock {...fieldBlockProps} asFieldset={false}>\n      <InputMasked {...inputProps} />\n    </FieldBlock>\n  )\n}\n\nNumberComponent._supportsSpacingProps = true\nexport default NumberComponent\n"],"mappings":"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"}
+{"version":3,"file":"Number.js","names":["React","useContext","useMemo","useCallback","useEffect","useRef","InputMasked","HelpButton","Button","SharedContext","FieldBlockContext","classnames","FieldBlock","useFieldProps","pickSpacingProps","clamp","DataContext","defaultMinimum","Number","MIN_SAFE_INTEGER","defaultMaximum","MAX_SAFE_INTEGER","NumberComponent","props","_props$width","_props$innerRef","_dataContext$props2","_sharedContext$transl","_sharedContext$transl2","dataContext","fieldBlockContext","sharedContext","currency","currencyDisplay","percent","mask","step","decimalLimit","allowNegative","disallowLeadingZeroes","prefix","prefixProp","suffix","suffixProp","showStepControls","schema","_props$schema","_props$minimum","_props$maximum","type","minimum","maximum","exclusiveMinimum","exclusiveMaximum","multipleOf","toInput","external","undefined","fromInput","value","numberValue","emptyValue","ref","preparedProps","_objectSpread","valueType","width","composition","innerRef","id","name","className","inputClassName","autoComplete","placeholder","startWith","disabled","htmlAttributes","hasError","help","size","align","handleFocus","handleBlur","handleChange","setDisplayValue","_innerRef$current","path","current","handleSubmit","onKeyDownHandler","e","_dataContext$props","event","isolate","key","_event$preventDefault","preventDefault","call","persist","fieldBlockProps","forId","contentClassName","contentWidth","increaseClickHandler","increaseProps","variant","icon","tabIndex","onClick","title","translation","Slider","addTitle","replace","String","decreaseClickHandler","decreaseProps","subtractTitle","maskProps","mask_options","as_currency","currency_mask","as_percent","as_number","number_mask","ariaParams","role","inputProps","inner_ref","onKeyDown","onFocus","onBlur","onChange","status","stretch","Boolean","createElement","content","Object","assign","_extends","asFieldset","left","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Number/Number.tsx"],"sourcesContent":["import React, {\n  useContext,\n  useMemo,\n  useCallback,\n  useEffect,\n  useRef,\n} from 'react'\nimport { InputMasked, HelpButton, Button } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport type {\n  InputAlign,\n  InputProps,\n  InputSize,\n} from '../../../../components/Input'\nimport SharedContext from '../../../../shared/Context'\nimport FieldBlockContext from '../../FieldBlock/FieldBlockContext'\nimport classnames from 'classnames'\nimport FieldBlock, {\n  Props as FieldBlockProps,\n  FieldBlockWidth,\n} from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport {\n  FieldProps,\n  FieldHelpProps,\n  AllJSONSchemaVersions,\n} from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport { ButtonProps, ButtonSize } from '../../../../components/Button'\nimport { clamp } from '../../../../components/slider/SliderHelpers'\nimport DataContext from '../../DataContext/Context'\n\nexport type Props = FieldHelpProps &\n  FieldProps<number, undefined | number> & {\n    innerRef?: React.RefObject<HTMLInputElement>\n    inputClassName?: string\n    currency?: InputMaskedProps['as_currency']\n    currencyDisplay?: 'code' | 'symbol' | 'narrowSymbol' | 'name'\n    percent?: InputMaskedProps['as_percent']\n    mask?: InputMaskedProps['mask']\n    step?: number\n    startWith?: number\n    // Formatting\n    decimalLimit?: number\n    allowNegative?: boolean\n    disallowLeadingZeroes?: boolean\n    prefix?: string | ((value: number) => string)\n    suffix?: string | ((value: number) => string)\n    // Validation\n    minimum?: number // aka greater than or equal to\n    maximum?: number // aka less than or equal to\n    exclusiveMinimum?: number // aka greater than\n    exclusiveMaximum?: number // aka less than\n    multipleOf?: number\n    // Styling\n    size?: InputSize\n    width?: FieldBlockWidth\n    align?: InputAlign\n    showStepControls?: boolean\n  }\n\nconst defaultMinimum = Number.MIN_SAFE_INTEGER\nconst defaultMaximum = Number.MAX_SAFE_INTEGER\n\nfunction NumberComponent(props: Props) {\n  const dataContext = useContext(DataContext)\n  const fieldBlockContext = useContext(FieldBlockContext)\n  const sharedContext = useContext(SharedContext)\n\n  const {\n    currency,\n    currencyDisplay,\n    percent,\n    mask,\n    step = 1,\n    decimalLimit = 12,\n    allowNegative = true,\n    disallowLeadingZeroes = false,\n    prefix: prefixProp,\n    suffix: suffixProp,\n    showStepControls,\n  } = props\n\n  const schema = useMemo<AllJSONSchemaVersions>(\n    () =>\n      props.schema ?? {\n        type: 'number',\n        minimum: props.minimum ?? defaultMinimum,\n        maximum: props.maximum ?? defaultMaximum,\n        exclusiveMinimum: props.exclusiveMinimum,\n        exclusiveMaximum: props.exclusiveMaximum,\n        multipleOf: props.multipleOf,\n      },\n    [\n      props.schema,\n      props.minimum,\n      props.maximum,\n      props.exclusiveMinimum,\n      props.exclusiveMaximum,\n      props.multipleOf,\n    ]\n  )\n\n  const toInput = useCallback((external: number | undefined) => {\n    if (external === undefined) {\n      return null\n    }\n    return external\n  }, [])\n  const fromInput = useCallback(\n    ({ value, numberValue }: { value: string; numberValue: number }) => {\n      if (value === '') {\n        return props.emptyValue\n      }\n      return numberValue\n    },\n    [props.emptyValue]\n  )\n\n  const ref = useRef<HTMLInputElement>()\n  const preparedProps: Props = {\n    valueType: 'number',\n    ...props,\n    schema,\n    toInput,\n    fromInput,\n    width:\n      props.width ??\n      (fieldBlockContext?.composition ? 'stretch' : 'medium'),\n    innerRef: props.innerRef ?? ref,\n  }\n\n  const {\n    id,\n    name,\n    className,\n    innerRef,\n    inputClassName,\n    autoComplete,\n    placeholder,\n    value,\n    startWith = null,\n    minimum = defaultMinimum,\n    maximum = defaultMaximum,\n    disabled,\n    htmlAttributes,\n    hasError,\n    help,\n    size,\n    width,\n    align,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    setDisplayValue,\n  } = useFieldProps(preparedProps)\n\n  useEffect(() => {\n    setDisplayValue(props.path, innerRef.current?.value)\n  }, [innerRef, props.path, setDisplayValue, value])\n\n  const { handleSubmit } = dataContext ?? {}\n  const onKeyDownHandler = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>) => {\n      const { event } = e as unknown as {\n        event: React.KeyboardEvent<HTMLInputElement>\n      }\n      if (dataContext?.props?.isolate && event.key === 'Enter') {\n        handleSubmit() // So we commit the data to the outer context\n        event.preventDefault?.() // And prevent the default form submit\n      }\n\n      if (!showStepControls) {\n        return\n      }\n\n      let numberValue = null\n\n      switch (event.key) {\n        case 'ArrowUp':\n          numberValue = clamp(\n            (value ?? startWith) + step,\n            minimum,\n            maximum\n          )\n          break\n        case 'ArrowDown':\n          numberValue = clamp(\n            (value ?? startWith) - step,\n            minimum,\n            maximum\n          )\n          break\n      }\n\n      if (numberValue !== null) {\n        event.persist()\n        event.preventDefault()\n        handleChange({ numberValue })\n      }\n    },\n    [\n      dataContext?.props?.isolate,\n      handleChange,\n      handleSubmit,\n      maximum,\n      minimum,\n      showStepControls,\n      startWith,\n      step,\n      value,\n    ]\n  )\n\n  const fieldBlockProps: FieldBlockProps = {\n    forId: id,\n    className: classnames(\n      'dnb-forms-field-number',\n      'dnb-input__border--tokens', // Used by \"dnb-input__border\"\n      className\n    ),\n    contentClassName: classnames(\n      'dnb-forms-field-number__contents',\n      showStepControls && 'dnb-forms-field-number__contents--has-controls',\n      hasError && 'dnb-input__status--error', // Also used by \"dnb-input__border\"\n      disabled && 'dnb-input--disabled' // Also used by \"dnb-input__border\"\n    ),\n    width:\n      (width === 'stretch' || fieldBlockContext?.composition) &&\n      !showStepControls\n        ? width\n        : undefined,\n    contentWidth: width !== false ? width : undefined,\n    ...pickSpacingProps(props),\n  }\n\n  const increaseClickHandler = useCallback(() => {\n    handleChange({\n      numberValue: clamp((value ?? startWith) + step, minimum, maximum),\n    })\n  }, [handleChange, maximum, minimum, startWith, step, value])\n\n  const increaseProps: ButtonProps = showStepControls && {\n    'aria-hidden': true,\n    className: 'dnb-button--control-after',\n    variant: 'secondary',\n    icon: 'add',\n    size: (size || 'small') as ButtonSize,\n    tabIndex: -1,\n    disabled: disabled || value >= maximum,\n    onClick: increaseClickHandler,\n    title: sharedContext?.translation.Slider.addTitle?.replace(\n      '%s',\n      String(value + step)\n    ),\n  }\n\n  const decreaseClickHandler = useCallback(() => {\n    handleChange({\n      numberValue: clamp((value ?? startWith) - step, minimum, maximum),\n    })\n  }, [handleChange, maximum, minimum, startWith, step, value])\n\n  const decreaseProps: ButtonProps = showStepControls && {\n    ...increaseProps,\n    className: 'dnb-button--control-before',\n    icon: 'subtract',\n    size: (size || 'small') as ButtonSize,\n    disabled: disabled || value <= minimum,\n    onClick: decreaseClickHandler,\n    title: sharedContext?.translation.Slider.subtractTitle?.replace(\n      '%s',\n      String(value - step)\n    ),\n  }\n\n  const prefix =\n    typeof prefixProp === 'function' ? prefixProp(value) : prefixProp\n  const suffix =\n    typeof suffixProp === 'function' ? suffixProp(value) : suffixProp\n\n  const maskProps: Partial<InputMaskedProps> = useMemo(() => {\n    const mask_options = {\n      prefix,\n      suffix,\n      decimalLimit,\n      allowNegative,\n      disallowLeadingZeroes,\n    }\n\n    if (currency) {\n      return {\n        as_currency: currency,\n        mask_options,\n        currency_mask: {\n          currencyDisplay,\n          decimalLimit,\n        },\n      }\n    }\n\n    if (percent) {\n      return {\n        as_percent: percent,\n        mask_options,\n      }\n    }\n\n    // Custom mask based on props\n    return {\n      as_number: true,\n      mask,\n      number_mask: {\n        ...mask_options,\n      },\n    }\n  }, [\n    currency,\n    currencyDisplay,\n    decimalLimit,\n    mask,\n    percent,\n    prefix,\n    suffix,\n    allowNegative,\n    disallowLeadingZeroes,\n  ])\n\n  const ariaParams = showStepControls && {\n    role: 'spinbutton',\n    'aria-valuemin': String(minimum),\n    'aria-valuemax': String(maximum),\n    'aria-valuenow': String(value), // without it, VO will read an invalid value\n    'aria-valuetext': String(value), // without it, VO will read %\n  }\n\n  const inputProps: InputProps = {\n    id,\n    name,\n    inner_ref: innerRef,\n    autoComplete,\n    className: classnames(\n      'dnb-forms-field-number__input',\n      `dnb-input--${size}`,\n      inputClassName\n    ),\n    step: showStepControls ? step : undefined,\n    placeholder,\n    value,\n    align: showStepControls ? 'center' : align,\n    ...maskProps,\n    onKeyDown: onKeyDownHandler,\n    onFocus: handleFocus,\n    onBlur: handleBlur,\n    onChange: handleChange,\n    disabled,\n    ...htmlAttributes,\n    status: hasError ? 'error' : undefined,\n    stretch: Boolean(width),\n    suffix:\n      help && !showStepControls ? (\n        <HelpButton title={help.title}>{help.content}</HelpButton>\n      ) : undefined,\n  }\n  Object.assign(inputProps, ariaParams)\n\n  if (showStepControls) {\n    return (\n      <FieldBlock {...fieldBlockProps} asFieldset={false}>\n        <span className=\"dnb-input__border dnb-input__border--root\">\n          {<Button {...decreaseProps} />}\n          <InputMasked {...inputProps} />\n          {<Button {...increaseProps} />}\n        </span>\n        {help && (\n          <HelpButton left=\"x-small\" title={help.title}>\n            {help.content}\n          </HelpButton>\n        )}\n      </FieldBlock>\n    )\n  }\n\n  return (\n    <FieldBlock {...fieldBlockProps} asFieldset={false}>\n      <InputMasked {...inputProps} />\n    </FieldBlock>\n  )\n}\n\nNumberComponent._supportsSpacingProps = true\nexport default NumberComponent\n"],"mappings":"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"}

package/es/extensions/forms/Field/Number/style/dnb-number.css

@@ -25,9 +25,6 @@
     var(--number-control-button-width--large) * 2
   );
 }
-.dnb-forms-field-number__contents {
-  display: flex;
-}
 .dnb-forms-field-number__contents--has-controls .dnb-input__input {
   align-items: center;
 }

package/es/extensions/forms/Field/Number/style/dnb-number.min.css

@@ -1 +1 @@
-.dnb-forms-field-number{--number-control-button-border-color:#000;--number-control-button-border-color--hover:#a9a9a9;--number-control-button-border-color--focus:#a9a9a9;--number-control-button-border-width--focus:0.125rem;--number-control-button-background-color--hover:grey;--number-control-button-color--hover:#000;--number-control-button-background-color--active:#000;--number-control-button-color--active:#d3d3d3;--number-control-button--error:red;--number-control-button--error-contrast:#fff;--number-control-button-width--small:2rem;--number-control-button-width--medium:2.5rem;--number-control-button-width--large:3rem;--forms-field-block--number-control-buttons-width--small:calc(var(--number-control-button-width--small)*2);--forms-field-block--number-control-buttons-width--medium:calc(var(--number-control-button-width--medium)*2);--forms-field-block--number-control-buttons-width--large:calc(var(--number-control-button-width--large)*2)}.dnb-forms-field-number__contents{display:flex}.dnb-forms-field-number__contents--has-controls .dnb-input__input{align-items:center}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border{border-radius:0}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:hover,html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within{box-shadow:none}.dnb-forms-field-number__contents--has-controls>.dnb-input__border--root{--input-border-inset: ;--input-border-inset--hover: ;--input-border-inset--active: ;--input-border-inset--focus: ;--input-border-inset--disabled: }html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button-background-color--hover);color:var(--number-control-button-color--hover)}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button-background-color--active);color:var(--number-control-button-color--active)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button--error-contrast);color:var(--number-control-button--error)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button--error);color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-before[disabled]{background-color:var(--color-black-3);color:var(--color-black-20)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small{width:calc(var(--forms-field-width--small) + var(--forms-field-block--number-control-buttons-width--small))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-before{width:var(--number-control-button-width--small)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium{width:calc(var(--forms-field-width--medium) + var(--forms-field-block--number-control-buttons-width--medium))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-before{width:var(--number-control-button-width--medium)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large{width:calc(var(--forms-field-width--large) + var(--forms-field-block--number-control-buttons-width--large))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-stretch .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-stretch .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-stretch .dnb-input__border{flex-grow:1}
+.dnb-forms-field-number{--number-control-button-border-color:#000;--number-control-button-border-color--hover:#a9a9a9;--number-control-button-border-color--focus:#a9a9a9;--number-control-button-border-width--focus:0.125rem;--number-control-button-background-color--hover:grey;--number-control-button-color--hover:#000;--number-control-button-background-color--active:#000;--number-control-button-color--active:#d3d3d3;--number-control-button--error:red;--number-control-button--error-contrast:#fff;--number-control-button-width--small:2rem;--number-control-button-width--medium:2.5rem;--number-control-button-width--large:3rem;--forms-field-block--number-control-buttons-width--small:calc(var(--number-control-button-width--small)*2);--forms-field-block--number-control-buttons-width--medium:calc(var(--number-control-button-width--medium)*2);--forms-field-block--number-control-buttons-width--large:calc(var(--number-control-button-width--large)*2)}.dnb-forms-field-number__contents--has-controls .dnb-input__input{align-items:center}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border{border-radius:0}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:hover,html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within{box-shadow:none}.dnb-forms-field-number__contents--has-controls>.dnb-input__border--root{--input-border-inset: ;--input-border-inset--hover: ;--input-border-inset--active: ;--input-border-inset--focus: ;--input-border-inset--disabled: }html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button-background-color--hover);color:var(--number-control-button-color--hover)}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button-background-color--active);color:var(--number-control-button-color--active)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button--error-contrast);color:var(--number-control-button--error)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button--error);color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-before[disabled]{background-color:var(--color-black-3);color:var(--color-black-20)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small{width:calc(var(--forms-field-width--small) + var(--forms-field-block--number-control-buttons-width--small))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-before{width:var(--number-control-button-width--small)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium{width:calc(var(--forms-field-width--medium) + var(--forms-field-block--number-control-buttons-width--medium))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-before{width:var(--number-control-button-width--medium)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large{width:calc(var(--forms-field-width--large) + var(--forms-field-block--number-control-buttons-width--large))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-stretch .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-stretch .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-stretch .dnb-input__border{flex-grow:1}

package/es/extensions/forms/Field/Number/style/dnb-number.scss

@@ -25,8 +25,6 @@
   );
 
   &__contents {
-    display: flex;
-
     &--has-controls {
       .dnb-input {
         &__input {

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

@@ -4,10 +4,10 @@ import { type CountryType } from '../../constants/countries';
 import { Props as StringFieldProps } from '../String';
 import { FieldHelpProps, FieldPropsWithExtraValue } from '../../types';
 import { CountryFilterSet } from '../SelectCountry';
-export type Props = FieldHelpProps & FieldPropsWithExtraValue<string, {
+export type Props = FieldHelpProps & Omit<FieldPropsWithExtraValue<string, {
     country: string;
     phone: string;
-}, undefined | string> & {
+}, undefined | string>, 'layout' | 'layoutOptions'> & {
     countryCodeFieldClassName?: string;
     numberFieldClassName?: string;
     countryCodePlaceholder?: string;