@dnb/eufemia 10.12.0 → 10.13.0

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

@@ -1 +1 @@
-{"version":3,"file":"Date.js","names":["React","useContext","DatePicker","HelpButton","useDataValue","pickSpacingProps","SharedContext","DateComponent","props","sharedContext","preparedProps","_objectSpread","fromInput","date","className","label","value","help","error","disabled","handleFocus","handleBlur","handleChange","createElement","_extends","translation","Forms","dateLabel","label_direction","status","message","show_input","show_cancel_button","show_reset_button","suffix","title","contents","undefined","on_change","on_show","on_hide","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Date/Date.tsx"],"sourcesContent":["import React, { useContext } from 'react'\nimport { DatePicker, HelpButton } from '../../../../components'\nimport { useDataValue } from '../../hooks'\nimport { FieldProps, FieldHelpProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport SharedContext from '../../../../shared/Context'\n\nexport type Props = FieldHelpProps & FieldProps<string>\n\nfunction DateComponent(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const preparedProps: Props = {\n    ...props,\n    fromInput: ({ date }: { date: string }) => {\n      return date\n    },\n  }\n\n  const {\n    className,\n    label,\n    value,\n    help,\n    error,\n    disabled,\n    handleFocus,\n    handleBlur,\n    handleChange,\n  } = useDataValue(preparedProps)\n\n  return (\n    <DatePicker\n      className={className}\n      label={label ?? sharedContext?.translation.Forms.dateLabel}\n      label_direction=\"vertical\"\n      date={value}\n      status={error?.message}\n      disabled={disabled}\n      show_input={true}\n      show_cancel_button={true}\n      show_reset_button={true}\n      suffix={\n        help ? (\n          <HelpButton title={help.title}>{help.contents}</HelpButton>\n        ) : undefined\n      }\n      on_change={handleChange}\n      on_show={handleFocus}\n      on_hide={handleBlur}\n      {...pickSpacingProps(props)}\n    />\n  )\n}\n\nDateComponent._supportsSpacingProps = true\nexport default DateComponent\n"],"mappings":";;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAASC,UAAU,EAAEC,UAAU,QAAQ,wBAAwB;AAC/D,SAASC,YAAY,QAAQ,aAAa;AAE1C,SAASC,gBAAgB,QAAQ,mCAAmC;AACpE,OAAOC,aAAa,MAAM,4BAA4B;AAItD,SAASC,aAAaA,CAACC,KAAY,EAAE;EACnC,MAAMC,aAAa,GAAGR,UAAU,CAACK,aAAa,CAAC;EAC/C,MAAMI,aAAoB,GAAAC,aAAA,CAAAA,aAAA,KACrBH,KAAK;IACRI,SAAS,EAAEA,CAAC;MAAEC;IAAuB,CAAC,KAAK;MACzC,OAAOA,IAAI;IACb;EAAC,EACF;EAED,MAAM;IACJC,SAAS;IACTC,KAAK;IACLC,KAAK;IACLC,IAAI;IACJC,KAAK;IACLC,QAAQ;IACRC,WAAW;IACXC,UAAU;IACVC;EACF,CAAC,GAAGlB,YAAY,CAACM,aAAa,CAAC;EAE/B,OACEV,KAAA,CAAAuB,aAAA,CAACrB,UAAU,EAAAsB,QAAA;IACTV,SAAS,EAAEA,SAAU;IACrBC,KAAK,EAAEA,KAAK,KAAIN,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEgB,WAAW,CAACC,KAAK,CAACC,SAAS,CAAC;IAC3DC,eAAe,EAAC,UAAU;IAC1Bf,IAAI,EAAEG,KAAM;IACZa,MAAM,EAAEX,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEY,OAAQ;IACvBX,QAAQ,EAAEA,QAAS;IACnBY,UAAU,EAAE,IAAK;IACjBC,kBAAkB,EAAE,IAAK;IACzBC,iBAAiB,EAAE,IAAK;IACxBC,MAAM,EACJjB,IAAI,GACFjB,KAAA,CAAAuB,aAAA,CAACpB,UAAU;MAACgC,KAAK,EAAElB,IAAI,CAACkB;IAAM,GAAElB,IAAI,CAACmB,QAAqB,CAAC,GACzDC,SACL;IACDC,SAAS,EAAEhB,YAAa;IACxBiB,OAAO,EAAEnB,WAAY;IACrBoB,OAAO,EAAEnB;EAAW,GAChBhB,gBAAgB,CAACG,KAAK,CAAC,CAC5B,CAAC;AAEN;AAEAD,aAAa,CAACkC,qBAAqB,GAAG,IAAI;AAC1C,eAAelC,aAAa"}
+{"version":3,"file":"Date.js","names":["React","useContext","DatePicker","HelpButton","useDataValue","pickSpacingProps","SharedContext","DateComponent","props","sharedContext","preparedProps","_objectSpread","fromInput","date","className","label","value","help","error","disabled","handleFocus","handleBlur","handleChange","createElement","_extends","translation","Forms","dateLabel","label_direction","status","message","show_input","show_cancel_button","show_reset_button","suffix","title","contents","undefined","on_change","on_show","on_hide","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Date/Date.tsx"],"sourcesContent":["import React, { useContext } from 'react'\nimport { DatePicker, HelpButton } from '../../../../components'\nimport { useDataValue } from '../../hooks'\nimport { FieldProps, FieldHelpProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport SharedContext from '../../../../shared/Context'\n\nexport type Props = FieldHelpProps & FieldProps<string>\n\nfunction DateComponent(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const preparedProps: Props = {\n    ...props,\n    fromInput: ({ date }: { date: string }) => {\n      return date\n    },\n  }\n\n  const {\n    className,\n    label,\n    value,\n    help,\n    error,\n    disabled,\n    handleFocus,\n    handleBlur,\n    handleChange,\n  } = useDataValue(preparedProps)\n\n  return (\n    <DatePicker\n      className={className}\n      label={label ?? sharedContext?.translation.Forms.dateLabel}\n      label_direction=\"vertical\"\n      date={value}\n      status={error?.message}\n      disabled={disabled}\n      show_input={true}\n      show_cancel_button={true}\n      show_reset_button={true}\n      suffix={\n        help ? (\n          <HelpButton title={help.title}>{help.contents}</HelpButton>\n        ) : undefined\n      }\n      on_change={handleChange}\n      on_show={handleFocus}\n      on_hide={handleBlur}\n      {...pickSpacingProps(props)}\n    />\n  )\n}\n\nDateComponent._supportsSpacingProps = true\nexport default DateComponent\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAASC,UAAU,EAAEC,UAAU,QAAQ,wBAAwB;AAC/D,SAASC,YAAY,QAAQ,aAAa;AAE1C,SAASC,gBAAgB,QAAQ,mCAAmC;AACpE,OAAOC,aAAa,MAAM,4BAA4B;AAItD,SAASC,aAAaA,CAACC,KAAY,EAAE;EACnC,MAAMC,aAAa,GAAGR,UAAU,CAACK,aAAa,CAAC;EAC/C,MAAMI,aAAoB,GAAAC,aAAA,CAAAA,aAAA,KACrBH,KAAK;IACRI,SAAS,EAAEA,CAAC;MAAEC;IAAuB,CAAC,KAAK;MACzC,OAAOA,IAAI;IACb;EAAC,EACF;EAED,MAAM;IACJC,SAAS;IACTC,KAAK;IACLC,KAAK;IACLC,IAAI;IACJC,KAAK;IACLC,QAAQ;IACRC,WAAW;IACXC,UAAU;IACVC;EACF,CAAC,GAAGlB,YAAY,CAACM,aAAa,CAAC;EAE/B,OACEV,KAAA,CAAAuB,aAAA,CAACrB,UAAU,EAAAsB,QAAA;IACTV,SAAS,EAAEA,SAAU;IACrBC,KAAK,EAAEA,KAAK,aAALA,KAAK,cAALA,KAAK,GAAIN,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEgB,WAAW,CAACC,KAAK,CAACC,SAAU;IAC3DC,eAAe,EAAC,UAAU;IAC1Bf,IAAI,EAAEG,KAAM;IACZa,MAAM,EAAEX,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEY,OAAQ;IACvBX,QAAQ,EAAEA,QAAS;IACnBY,UAAU,EAAE,IAAK;IACjBC,kBAAkB,EAAE,IAAK;IACzBC,iBAAiB,EAAE,IAAK;IACxBC,MAAM,EACJjB,IAAI,GACFjB,KAAA,CAAAuB,aAAA,CAACpB,UAAU;MAACgC,KAAK,EAAElB,IAAI,CAACkB;IAAM,GAAElB,IAAI,CAACmB,QAAqB,CAAC,GACzDC,SACL;IACDC,SAAS,EAAEhB,YAAa;IACxBiB,OAAO,EAAEnB,WAAY;IACrBoB,OAAO,EAAEnB;EAAW,GAChBhB,gBAAgB,CAACG,KAAK,CAAC,CAC5B,CAAC;AAEN;AAEAD,aAAa,CAACkC,qBAAqB,GAAG,IAAI;AAC1C,eAAelC,aAAa"}

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

@@ -1,3 +1,5 @@
+"use client";
+
 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; }
@@ -5,11 +7,12 @@ import React, { useContext } from 'react';
 import StringComponent from '../String';
 import SharedContext from '../../../../shared/Context';
 function Email(props) {
+  var _props$type, _props$pattern, _props$label;
   const sharedContext = useContext(SharedContext);
   const stringComponentProps = _objectSpread(_objectSpread({}, props), {}, {
-    type: props.type ?? 'email',
-    pattern: props.pattern ?? "^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:.[a-zA-Z0-9-]+)*$",
-    label: props.label ?? (sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.emailLabel),
+    type: (_props$type = props.type) !== null && _props$type !== void 0 ? _props$type : 'email',
+    pattern: (_props$pattern = props.pattern) !== null && _props$pattern !== void 0 ? _props$pattern : "^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:.[a-zA-Z0-9-]+)*$",
+    label: (_props$label = props.label) !== null && _props$label !== void 0 ? _props$label : sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.emailLabel,
     errorMessages: _objectSpread({
       required: sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.emailErrorRequired,
       pattern: sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.emailErrorPattern

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

@@ -1 +1 @@
-{"version":3,"file":"Email.js","names":["React","useContext","StringComponent","SharedContext","Email","props","sharedContext","stringComponentProps","_objectSpread","type","pattern","label","translation","Forms","emailLabel","errorMessages","required","emailErrorRequired","emailErrorPattern","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Email/Email.tsx"],"sourcesContent":["import React, { useContext } from 'react'\nimport StringComponent, { Props as StringComponentProps } from '../String'\nimport SharedContext from '../../../../shared/Context'\n\nexport type Props = StringComponentProps\n\nfunction Email(props: Props) {\n  const sharedContext = useContext(SharedContext)\n\n  const stringComponentProps: Props = {\n    ...props,\n    type: props.type ?? 'email',\n    pattern:\n      props.pattern ??\n      \"^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:.[a-zA-Z0-9-]+)*$\",\n    label: props.label ?? sharedContext?.translation.Forms.emailLabel,\n    errorMessages: {\n      required: sharedContext?.translation.Forms.emailErrorRequired,\n      pattern: sharedContext?.translation.Forms.emailErrorPattern,\n      ...props.errorMessages,\n    },\n  }\n\n  return <StringComponent {...stringComponentProps} />\n}\n\nEmail._supportsSpacingProps = true\nexport default Email\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,eAAe,MAAyC,WAAW;AAC1E,OAAOC,aAAa,MAAM,4BAA4B;AAItD,SAASC,KAAKA,CAACC,KAAY,EAAE;EAC3B,MAAMC,aAAa,GAAGL,UAAU,CAACE,aAAa,CAAC;EAE/C,MAAMI,oBAA2B,GAAAC,aAAA,CAAAA,aAAA,KAC5BH,KAAK;IACRI,IAAI,EAAEJ,KAAK,CAACI,IAAI,IAAI,OAAO;IAC3BC,OAAO,EACLL,KAAK,CAACK,OAAO,IACb,qEAAqE;IACvEC,KAAK,EAAEN,KAAK,CAACM,KAAK,KAAIL,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEM,WAAW,CAACC,KAAK,CAACC,UAAU;IACjEC,aAAa,EAAAP,aAAA;MACXQ,QAAQ,EAAEV,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEM,WAAW,CAACC,KAAK,CAACI,kBAAkB;MAC7DP,OAAO,EAAEJ,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEM,WAAW,CAACC,KAAK,CAACK;IAAiB,GACxDb,KAAK,CAACU,aAAa;EACvB,EACF;EAED,OAAOf,KAAA,CAAAmB,aAAA,CAACjB,eAAe,EAAKK,oBAAuB,CAAC;AACtD;AAEAH,KAAK,CAACgB,qBAAqB,GAAG,IAAI;AAClC,eAAehB,KAAK"}
+{"version":3,"file":"Email.js","names":["React","useContext","StringComponent","SharedContext","Email","props","_props$type","_props$pattern","_props$label","sharedContext","stringComponentProps","_objectSpread","type","pattern","label","translation","Forms","emailLabel","errorMessages","required","emailErrorRequired","emailErrorPattern","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Email/Email.tsx"],"sourcesContent":["import React, { useContext } from 'react'\nimport StringComponent, { Props as StringComponentProps } from '../String'\nimport SharedContext from '../../../../shared/Context'\n\nexport type Props = StringComponentProps\n\nfunction Email(props: Props) {\n  const sharedContext = useContext(SharedContext)\n\n  const stringComponentProps: Props = {\n    ...props,\n    type: props.type ?? 'email',\n    pattern:\n      props.pattern ??\n      \"^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:.[a-zA-Z0-9-]+)*$\",\n    label: props.label ?? sharedContext?.translation.Forms.emailLabel,\n    errorMessages: {\n      required: sharedContext?.translation.Forms.emailErrorRequired,\n      pattern: sharedContext?.translation.Forms.emailErrorPattern,\n      ...props.errorMessages,\n    },\n  }\n\n  return <StringComponent {...stringComponentProps} />\n}\n\nEmail._supportsSpacingProps = true\nexport default Email\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,eAAe,MAAyC,WAAW;AAC1E,OAAOC,aAAa,MAAM,4BAA4B;AAItD,SAASC,KAAKA,CAACC,KAAY,EAAE;EAAA,IAAAC,WAAA,EAAAC,cAAA,EAAAC,YAAA;EAC3B,MAAMC,aAAa,GAAGR,UAAU,CAACE,aAAa,CAAC;EAE/C,MAAMO,oBAA2B,GAAAC,aAAA,CAAAA,aAAA,KAC5BN,KAAK;IACRO,IAAI,GAAAN,WAAA,GAAED,KAAK,CAACO,IAAI,cAAAN,WAAA,cAAAA,WAAA,GAAI,OAAO;IAC3BO,OAAO,GAAAN,cAAA,GACLF,KAAK,CAACQ,OAAO,cAAAN,cAAA,cAAAA,cAAA,GACb,qEAAqE;IACvEO,KAAK,GAAAN,YAAA,GAAEH,KAAK,CAACS,KAAK,cAAAN,YAAA,cAAAA,YAAA,GAAIC,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEM,WAAW,CAACC,KAAK,CAACC,UAAU;IACjEC,aAAa,EAAAP,aAAA;MACXQ,QAAQ,EAAEV,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEM,WAAW,CAACC,KAAK,CAACI,kBAAkB;MAC7DP,OAAO,EAAEJ,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEM,WAAW,CAACC,KAAK,CAACK;IAAiB,GACxDhB,KAAK,CAACa,aAAa;EACvB,EACF;EAED,OAAOlB,KAAA,CAAAsB,aAAA,CAACpB,eAAe,EAAKQ,oBAAuB,CAAC;AACtD;AAEAN,KAAK,CAACmB,qBAAqB,GAAG,IAAI;AAClC,eAAenB,KAAK"}

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

@@ -1,3 +1,5 @@
+"use client";
+
 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; }
@@ -5,20 +7,21 @@ import React, { useContext } from 'react';
 import StringComponent from '../String';
 import SharedContext from '../../../../shared/Context';
 function NationalIdentityNumber(props) {
+  var _props$pattern, _props$label, _props$width;
   const sharedContext = useContext(SharedContext);
   const {
     validate = true,
     omitMask
   } = props;
   const stringComponentProps = _objectSpread(_objectSpread({}, props), {}, {
-    pattern: props.pattern ?? (validate ? '^[0-9]{11}$' : undefined),
-    label: props.label ?? (sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.nationalIdentityNumberLabel),
+    pattern: (_props$pattern = props.pattern) !== null && _props$pattern !== void 0 ? _props$pattern : validate ? '^[0-9]{11}$' : undefined,
+    label: (_props$label = props.label) !== null && _props$label !== void 0 ? _props$label : sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.nationalIdentityNumberLabel,
     errorMessages: _objectSpread({
       required: sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.nationalIdentityNumberErrorRequired,
       pattern: sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.nationalIdentityNumberErrorPattern
     }, props.errorMessages),
     mask: omitMask ? [/\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/] : [/\d/, /\d/, /\d/, /\d/, /\d/, /\d/, ' ', /\d/, /\d/, /\d/, /\d/, /\d/],
-    width: props.width ?? 'medium'
+    width: (_props$width = props.width) !== null && _props$width !== void 0 ? _props$width : 'medium'
   });
   return React.createElement(StringComponent, stringComponentProps);
 }

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

@@ -1 +1 @@
-{"version":3,"file":"NationalIdentityNumber.js","names":["React","useContext","StringComponent","SharedContext","NationalIdentityNumber","props","sharedContext","validate","omitMask","stringComponentProps","_objectSpread","pattern","undefined","label","translation","Forms","nationalIdentityNumberLabel","errorMessages","required","nationalIdentityNumberErrorRequired","nationalIdentityNumberErrorPattern","mask","width","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.tsx"],"sourcesContent":["import React, { useContext } from 'react'\nimport StringComponent, { Props as StringComponentProps } from '../String'\nimport SharedContext from '../../../../shared/Context'\n\nexport type Props = StringComponentProps & {\n  omitMask?: boolean\n  validate?: boolean\n}\n\nfunction NationalIdentityNumber(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const { validate = true, omitMask } = props\n\n  const stringComponentProps: Props = {\n    ...props,\n    pattern: props.pattern ?? (validate ? '^[0-9]{11}$' : undefined),\n    label:\n      props.label ??\n      sharedContext?.translation.Forms.nationalIdentityNumberLabel,\n    errorMessages: {\n      required:\n        sharedContext?.translation.Forms\n          .nationalIdentityNumberErrorRequired,\n      pattern:\n        sharedContext?.translation.Forms\n          .nationalIdentityNumberErrorPattern,\n      ...props.errorMessages,\n    },\n    mask: omitMask\n      ? [/\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/]\n      : [\n          /\\d/,\n          /\\d/,\n          /\\d/,\n          /\\d/,\n          /\\d/,\n          /\\d/,\n          ' ',\n          /\\d/,\n          /\\d/,\n          /\\d/,\n          /\\d/,\n          /\\d/,\n        ],\n    width: props.width ?? 'medium',\n  }\n\n  return <StringComponent {...stringComponentProps} />\n}\n\nNationalIdentityNumber._supportsSpacingProps = true\nexport default NationalIdentityNumber\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,eAAe,MAAyC,WAAW;AAC1E,OAAOC,aAAa,MAAM,4BAA4B;AAOtD,SAASC,sBAAsBA,CAACC,KAAY,EAAE;EAC5C,MAAMC,aAAa,GAAGL,UAAU,CAACE,aAAa,CAAC;EAC/C,MAAM;IAAEI,QAAQ,GAAG,IAAI;IAAEC;EAAS,CAAC,GAAGH,KAAK;EAE3C,MAAMI,oBAA2B,GAAAC,aAAA,CAAAA,aAAA,KAC5BL,KAAK;IACRM,OAAO,EAAEN,KAAK,CAACM,OAAO,KAAKJ,QAAQ,GAAG,aAAa,GAAGK,SAAS,CAAC;IAChEC,KAAK,EACHR,KAAK,CAACQ,KAAK,KACXP,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEQ,WAAW,CAACC,KAAK,CAACC,2BAA2B;IAC9DC,aAAa,EAAAP,aAAA;MACXQ,QAAQ,EACNZ,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEQ,WAAW,CAACC,KAAK,CAC7BI,mCAAmC;MACxCR,OAAO,EACLL,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEQ,WAAW,CAACC,KAAK,CAC7BK;IAAkC,GACpCf,KAAK,CAACY,aAAa,CACvB;IACDI,IAAI,EAAEb,QAAQ,GACV,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,GAClE,CACE,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,GAAG,EACH,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,CACL;IACLc,KAAK,EAAEjB,KAAK,CAACiB,KAAK,IAAI;EAAQ,EAC/B;EAED,OAAOtB,KAAA,CAAAuB,aAAA,CAACrB,eAAe,EAAKO,oBAAuB,CAAC;AACtD;AAEAL,sBAAsB,CAACoB,qBAAqB,GAAG,IAAI;AACnD,eAAepB,sBAAsB"}
+{"version":3,"file":"NationalIdentityNumber.js","names":["React","useContext","StringComponent","SharedContext","NationalIdentityNumber","props","_props$pattern","_props$label","_props$width","sharedContext","validate","omitMask","stringComponentProps","_objectSpread","pattern","undefined","label","translation","Forms","nationalIdentityNumberLabel","errorMessages","required","nationalIdentityNumberErrorRequired","nationalIdentityNumberErrorPattern","mask","width","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.tsx"],"sourcesContent":["import React, { useContext } from 'react'\nimport StringComponent, { Props as StringComponentProps } from '../String'\nimport SharedContext from '../../../../shared/Context'\n\nexport type Props = StringComponentProps & {\n  omitMask?: boolean\n  validate?: boolean\n}\n\nfunction NationalIdentityNumber(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const { validate = true, omitMask } = props\n\n  const stringComponentProps: Props = {\n    ...props,\n    pattern: props.pattern ?? (validate ? '^[0-9]{11}$' : undefined),\n    label:\n      props.label ??\n      sharedContext?.translation.Forms.nationalIdentityNumberLabel,\n    errorMessages: {\n      required:\n        sharedContext?.translation.Forms\n          .nationalIdentityNumberErrorRequired,\n      pattern:\n        sharedContext?.translation.Forms\n          .nationalIdentityNumberErrorPattern,\n      ...props.errorMessages,\n    },\n    mask: omitMask\n      ? [/\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/]\n      : [\n          /\\d/,\n          /\\d/,\n          /\\d/,\n          /\\d/,\n          /\\d/,\n          /\\d/,\n          ' ',\n          /\\d/,\n          /\\d/,\n          /\\d/,\n          /\\d/,\n          /\\d/,\n        ],\n    width: props.width ?? 'medium',\n  }\n\n  return <StringComponent {...stringComponentProps} />\n}\n\nNationalIdentityNumber._supportsSpacingProps = true\nexport default NationalIdentityNumber\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,eAAe,MAAyC,WAAW;AAC1E,OAAOC,aAAa,MAAM,4BAA4B;AAOtD,SAASC,sBAAsBA,CAACC,KAAY,EAAE;EAAA,IAAAC,cAAA,EAAAC,YAAA,EAAAC,YAAA;EAC5C,MAAMC,aAAa,GAAGR,UAAU,CAACE,aAAa,CAAC;EAC/C,MAAM;IAAEO,QAAQ,GAAG,IAAI;IAAEC;EAAS,CAAC,GAAGN,KAAK;EAE3C,MAAMO,oBAA2B,GAAAC,aAAA,CAAAA,aAAA,KAC5BR,KAAK;IACRS,OAAO,GAAAR,cAAA,GAAED,KAAK,CAACS,OAAO,cAAAR,cAAA,cAAAA,cAAA,GAAKI,QAAQ,GAAG,aAAa,GAAGK,SAAU;IAChEC,KAAK,GAAAT,YAAA,GACHF,KAAK,CAACW,KAAK,cAAAT,YAAA,cAAAA,YAAA,GACXE,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEQ,WAAW,CAACC,KAAK,CAACC,2BAA2B;IAC9DC,aAAa,EAAAP,aAAA;MACXQ,QAAQ,EACNZ,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEQ,WAAW,CAACC,KAAK,CAC7BI,mCAAmC;MACxCR,OAAO,EACLL,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEQ,WAAW,CAACC,KAAK,CAC7BK;IAAkC,GACpClB,KAAK,CAACe,aAAa,CACvB;IACDI,IAAI,EAAEb,QAAQ,GACV,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,GAClE,CACE,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,GAAG,EACH,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,CACL;IACLc,KAAK,GAAAjB,YAAA,GAAEH,KAAK,CAACoB,KAAK,cAAAjB,YAAA,cAAAA,YAAA,GAAI;EAAQ,EAC/B;EAED,OAAOR,KAAA,CAAA0B,aAAA,CAACxB,eAAe,EAAKU,oBAAuB,CAAC;AACtD;AAEAR,sBAAsB,CAACuB,qBAAqB,GAAG,IAAI;AACnD,eAAevB,sBAAsB"}

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

@@ -9,6 +9,7 @@ import FieldBlock from '../../FieldBlock';
 import { useDataValue } from '../../hooks';
 import { pickSpacingProps } from '../../../../components/flex/utils';
 function NumberComponent(props) {
+  var _props$schema, _props$width;
   const {
     currency,
     percent,
@@ -45,7 +46,7 @@ function NumberComponent(props) {
     };
   }, [currency, percent, mask, decimalLimit, decimalSymbol, thousandSeparator, prefix, suffix]);
   const preparedProps = _objectSpread(_objectSpread({}, props), {}, {
-    schema: props.schema ?? {
+    schema: (_props$schema = props.schema) !== null && _props$schema !== void 0 ? _props$schema : {
       type: 'number',
       minimum: props.minimum,
       maximum: props.maximum,
@@ -68,7 +69,7 @@ function NumberComponent(props) {
       }
       return numberValue;
     },
-    width: props.width ?? 'medium'
+    width: (_props$width = props.width) !== null && _props$width !== void 0 ? _props$width : 'medium'
   });
   const {
     id,

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

@@ -1 +1 @@
-{"version":3,"file":"Number.js","names":["React","useMemo","InputMasked","HelpButton","classnames","FieldBlock","useDataValue","pickSpacingProps","NumberComponent","props","currency","percent","mask","thousandSeparator","decimalSymbol","decimalLimit","prefix","suffix","rightAligned","maskProps","as_currency","as_percent","as_number","number_mask","includeThousandsSeparator","undefined","thousandsSeparatorSymbol","preparedProps","_objectSpread","schema","type","minimum","maximum","exclusiveMinimum","exclusiveMaximum","multipleOf","toInput","external","fromInput","value","numberValue","emptyValue","width","id","name","className","autoComplete","inputClassName","layout","placeholder","label","labelDescription","labelSecondary","disabled","info","warning","error","help","handleFocus","handleBlur","handleChange","createElement","_extends","forId","contentsWidth","right","on_focus","on_blur","on_change","status","stretch","title","contents","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Number/Number.tsx"],"sourcesContent":["import React, { useMemo } from 'react'\nimport { InputMasked, HelpButton } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport classnames from 'classnames'\nimport FieldBlock from '../../FieldBlock'\nimport { useDataValue } from '../../hooks'\nimport { FieldProps, FieldHelpProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\n\ninterface ErrorMessages {\n  required?: string\n  schema?: string\n  minimum?: string\n  maximum?: string\n  exclusiveMinimum?: string\n  exclusiveMaximum?: string\n  multipleOf?: string\n}\n\nexport type Props = FieldHelpProps &\n  FieldProps<number, undefined, ErrorMessages> & {\n    inputClassName?: string\n    currency?: InputMaskedProps['as_currency']\n    percent?: InputMaskedProps['as_percent']\n    mask?: InputMaskedProps['mask']\n    // Formatting\n    thousandSeparator?: string | true\n    decimalSymbol?: string\n    decimalLimit?: number\n    prefix?: string\n    suffix?: 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    width?: false | 'small' | 'medium' | 'large' | 'stretch'\n    rightAligned?: boolean\n  }\n\nfunction NumberComponent(props: Props) {\n  const {\n    currency,\n    percent,\n    mask,\n    thousandSeparator,\n    decimalSymbol,\n    decimalLimit = 12,\n    prefix,\n    suffix,\n    rightAligned,\n  } = props\n\n  const maskProps: Partial<InputMaskedProps> = useMemo(() => {\n    if (currency) {\n      return {\n        as_currency: currency,\n      }\n    }\n    if (percent) {\n      return {\n        as_percent: percent,\n      }\n    }\n    // Custom mask based on props\n    return {\n      as_number: true,\n      mask,\n      number_mask: {\n        decimalLimit,\n        decimalSymbol,\n        includeThousandsSeparator: thousandSeparator !== undefined,\n        thousandsSeparatorSymbol:\n          thousandSeparator === true ? ' ' : thousandSeparator,\n        prefix,\n        suffix,\n      },\n    }\n  }, [\n    currency,\n    percent,\n    mask,\n    decimalLimit,\n    decimalSymbol,\n    thousandSeparator,\n    prefix,\n    suffix,\n  ])\n\n  const preparedProps: Props = {\n    ...props,\n    schema: props.schema ?? {\n      type: 'number',\n      minimum: props.minimum,\n      maximum: props.maximum,\n      exclusiveMinimum: props.exclusiveMinimum,\n      exclusiveMaximum: props.exclusiveMaximum,\n      multipleOf: props.multipleOf,\n    },\n    toInput: (external: number | undefined) => {\n      if (external === undefined) {\n        return ''\n      }\n      return external\n    },\n    fromInput: ({\n      value,\n      numberValue,\n    }: {\n      value: string\n      numberValue: number\n    }) => {\n      if (value === '') {\n        return emptyValue\n      }\n      return numberValue\n    },\n    width: props.width ?? 'medium',\n  }\n\n  const {\n    id,\n    name,\n    className,\n    autoComplete,\n    inputClassName,\n    layout,\n    placeholder,\n    label,\n    labelDescription,\n    labelSecondary,\n    value,\n    disabled,\n    info,\n    warning,\n    error,\n    help,\n    emptyValue,\n    width,\n    handleFocus,\n    handleBlur,\n    handleChange,\n  } = useDataValue(preparedProps)\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-number', className)}\n      forId={id}\n      layout={layout}\n      label={label}\n      labelDescription={labelDescription}\n      labelSecondary={labelSecondary}\n      info={info}\n      warning={warning}\n      error={error}\n      contentsWidth={width !== false ? width : undefined}\n      {...pickSpacingProps(props)}\n    >\n      <InputMasked\n        id={id}\n        name={name}\n        autoComplete={autoComplete}\n        className={classnames(\n          'dnb-forms-field-number__input',\n          inputClassName\n        )}\n        placeholder={placeholder}\n        value={value}\n        {...maskProps}\n        right={rightAligned}\n        on_focus={handleFocus}\n        on_blur={handleBlur}\n        on_change={handleChange}\n        disabled={disabled}\n        status={error ? 'error' : undefined}\n        stretch={width !== undefined}\n        suffix={\n          help ? (\n            <HelpButton title={help.title}>{help.contents}</HelpButton>\n          ) : undefined\n        }\n      />\n    </FieldBlock>\n  )\n}\n\nNumberComponent._supportsSpacingProps = true\nexport default NumberComponent\n"],"mappings":"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"}
+{"version":3,"file":"Number.js","names":["React","useMemo","InputMasked","HelpButton","classnames","FieldBlock","useDataValue","pickSpacingProps","NumberComponent","props","_props$schema","_props$width","currency","percent","mask","thousandSeparator","decimalSymbol","decimalLimit","prefix","suffix","rightAligned","maskProps","as_currency","as_percent","as_number","number_mask","includeThousandsSeparator","undefined","thousandsSeparatorSymbol","preparedProps","_objectSpread","schema","type","minimum","maximum","exclusiveMinimum","exclusiveMaximum","multipleOf","toInput","external","fromInput","value","numberValue","emptyValue","width","id","name","className","autoComplete","inputClassName","layout","placeholder","label","labelDescription","labelSecondary","disabled","info","warning","error","help","handleFocus","handleBlur","handleChange","createElement","_extends","forId","contentsWidth","right","on_focus","on_blur","on_change","status","stretch","title","contents","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Number/Number.tsx"],"sourcesContent":["import React, { useMemo } from 'react'\nimport { InputMasked, HelpButton } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport classnames from 'classnames'\nimport FieldBlock from '../../FieldBlock'\nimport { useDataValue } from '../../hooks'\nimport { FieldProps, FieldHelpProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\n\ninterface ErrorMessages {\n  required?: string\n  schema?: string\n  minimum?: string\n  maximum?: string\n  exclusiveMinimum?: string\n  exclusiveMaximum?: string\n  multipleOf?: string\n}\n\nexport type Props = FieldHelpProps &\n  FieldProps<number, undefined, ErrorMessages> & {\n    inputClassName?: string\n    currency?: InputMaskedProps['as_currency']\n    percent?: InputMaskedProps['as_percent']\n    mask?: InputMaskedProps['mask']\n    // Formatting\n    thousandSeparator?: string | true\n    decimalSymbol?: string\n    decimalLimit?: number\n    prefix?: string\n    suffix?: 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    width?: false | 'small' | 'medium' | 'large' | 'stretch'\n    rightAligned?: boolean\n  }\n\nfunction NumberComponent(props: Props) {\n  const {\n    currency,\n    percent,\n    mask,\n    thousandSeparator,\n    decimalSymbol,\n    decimalLimit = 12,\n    prefix,\n    suffix,\n    rightAligned,\n  } = props\n\n  const maskProps: Partial<InputMaskedProps> = useMemo(() => {\n    if (currency) {\n      return {\n        as_currency: currency,\n      }\n    }\n    if (percent) {\n      return {\n        as_percent: percent,\n      }\n    }\n    // Custom mask based on props\n    return {\n      as_number: true,\n      mask,\n      number_mask: {\n        decimalLimit,\n        decimalSymbol,\n        includeThousandsSeparator: thousandSeparator !== undefined,\n        thousandsSeparatorSymbol:\n          thousandSeparator === true ? ' ' : thousandSeparator,\n        prefix,\n        suffix,\n      },\n    }\n  }, [\n    currency,\n    percent,\n    mask,\n    decimalLimit,\n    decimalSymbol,\n    thousandSeparator,\n    prefix,\n    suffix,\n  ])\n\n  const preparedProps: Props = {\n    ...props,\n    schema: props.schema ?? {\n      type: 'number',\n      minimum: props.minimum,\n      maximum: props.maximum,\n      exclusiveMinimum: props.exclusiveMinimum,\n      exclusiveMaximum: props.exclusiveMaximum,\n      multipleOf: props.multipleOf,\n    },\n    toInput: (external: number | undefined) => {\n      if (external === undefined) {\n        return ''\n      }\n      return external\n    },\n    fromInput: ({\n      value,\n      numberValue,\n    }: {\n      value: string\n      numberValue: number\n    }) => {\n      if (value === '') {\n        return emptyValue\n      }\n      return numberValue\n    },\n    width: props.width ?? 'medium',\n  }\n\n  const {\n    id,\n    name,\n    className,\n    autoComplete,\n    inputClassName,\n    layout,\n    placeholder,\n    label,\n    labelDescription,\n    labelSecondary,\n    value,\n    disabled,\n    info,\n    warning,\n    error,\n    help,\n    emptyValue,\n    width,\n    handleFocus,\n    handleBlur,\n    handleChange,\n  } = useDataValue(preparedProps)\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-number', className)}\n      forId={id}\n      layout={layout}\n      label={label}\n      labelDescription={labelDescription}\n      labelSecondary={labelSecondary}\n      info={info}\n      warning={warning}\n      error={error}\n      contentsWidth={width !== false ? width : undefined}\n      {...pickSpacingProps(props)}\n    >\n      <InputMasked\n        id={id}\n        name={name}\n        autoComplete={autoComplete}\n        className={classnames(\n          'dnb-forms-field-number__input',\n          inputClassName\n        )}\n        placeholder={placeholder}\n        value={value}\n        {...maskProps}\n        right={rightAligned}\n        on_focus={handleFocus}\n        on_blur={handleBlur}\n        on_change={handleChange}\n        disabled={disabled}\n        status={error ? 'error' : undefined}\n        stretch={width !== undefined}\n        suffix={\n          help ? (\n            <HelpButton title={help.title}>{help.contents}</HelpButton>\n          ) : undefined\n        }\n      />\n    </FieldBlock>\n  )\n}\n\nNumberComponent._supportsSpacingProps = true\nexport default NumberComponent\n"],"mappings":"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"}

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

@@ -9,6 +9,6 @@ export default function Option({
   return React.createElement("span", {
     className: classnames('dnb-forms-field-option', className),
     role: "option"
-  }, children ?? title, text);
+  }, children !== null && children !== void 0 ? children : title, text);
 }
 //# sourceMappingURL=Option.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Option.js","names":["React","classnames","Option","className","title","text","children","createElement","role"],"sources":["../../../../../../src/extensions/forms/Field/Option/Option.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport type { FieldProps } from '../../types'\n\nexport type Props = FieldProps<number | string> & {\n  title?: string\n  text?: string\n  children?: React.ReactNode\n}\n\nexport default function Option({\n  className,\n  title,\n  text,\n  children,\n}: Props) {\n  return (\n    <span\n      className={classnames('dnb-forms-field-option', className)}\n      // eslint-disable-next-line jsx-a11y/role-has-required-aria-props\n      role=\"option\"\n    >\n      {children ?? title}\n      {text}\n    </span>\n  )\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AASnC,eAAe,SAASC,MAAMA,CAAC;EAC7BC,SAAS;EACTC,KAAK;EACLC,IAAI;EACJC;AACK,CAAC,EAAE;EACR,OACEN,KAAA,CAAAO,aAAA;IACEJ,SAAS,EAAEF,UAAU,CAAC,wBAAwB,EAAEE,SAAS,CAAE;IAE3DK,IAAI,EAAC;EAAQ,GAEZF,QAAQ,IAAIF,KAAK,EACjBC,IACG,CAAC;AAEX"}
+{"version":3,"file":"Option.js","names":["React","classnames","Option","className","title","text","children","createElement","role"],"sources":["../../../../../../src/extensions/forms/Field/Option/Option.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport type { FieldProps } from '../../types'\n\nexport type Props = FieldProps<number | string> & {\n  title?: string\n  text?: string\n  children?: React.ReactNode\n}\n\nexport default function Option({\n  className,\n  title,\n  text,\n  children,\n}: Props) {\n  return (\n    <span\n      className={classnames('dnb-forms-field-option', className)}\n      // eslint-disable-next-line jsx-a11y/role-has-required-aria-props\n      role=\"option\"\n    >\n      {children ?? title}\n      {text}\n    </span>\n  )\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AASnC,eAAe,SAASC,MAAMA,CAAC;EAC7BC,SAAS;EACTC,KAAK;EACLC,IAAI;EACJC;AACK,CAAC,EAAE;EACR,OACEN,KAAA,CAAAO,aAAA;IACEJ,SAAS,EAAEF,UAAU,CAAC,wBAAwB,EAAEE,SAAS,CAAE;IAE3DK,IAAI,EAAC;EAAQ,GAEZF,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIF,KAAK,EACjBC,IACG,CAAC;AAEX"}

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

@@ -1,3 +1,5 @@
+"use client";
+
 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; }
@@ -5,6 +7,7 @@ import React, { useContext } from 'react';
 import StringComponent from '../String';
 import SharedContext from '../../../../shared/Context';
 function OrganizationNumber(props) {
+  var _props$pattern, _props$label, _props$width;
   const sharedContext = useContext(SharedContext);
   const {
     validate = true,
@@ -12,14 +15,14 @@ function OrganizationNumber(props) {
   } = props;
   const stringComponentProps = _objectSpread(_objectSpread({}, props), {}, {
     className: 'dnb-forms-field-organization-number',
-    pattern: props.pattern ?? (validate ? '^[0-9]{9}$' : undefined),
-    label: props.label ?? (sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.organizationNumberLabel),
+    pattern: (_props$pattern = props.pattern) !== null && _props$pattern !== void 0 ? _props$pattern : validate ? '^[0-9]{9}$' : undefined,
+    label: (_props$label = props.label) !== null && _props$label !== void 0 ? _props$label : sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.organizationNumberLabel,
     errorMessages: _objectSpread({
       required: sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.organizationNumberErrorRequired,
       pattern: sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.organizationNumberErrorPattern
     }, props.errorMessages),
     mask: omitMask ? [/\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/] : [/\d/, /\d/, /\d/, ' ', /\d/, /\d/, /\d/, ' ', /\d/, /\d/, /\d/],
-    width: props.width ?? 'medium'
+    width: (_props$width = props.width) !== null && _props$width !== void 0 ? _props$width : 'medium'
   });
   return React.createElement(StringComponent, stringComponentProps);
 }

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

@@ -1 +1 @@
-{"version":3,"file":"OrganizationNumber.js","names":["React","useContext","StringComponent","SharedContext","OrganizationNumber","props","sharedContext","validate","omitMask","stringComponentProps","_objectSpread","className","pattern","undefined","label","translation","Forms","organizationNumberLabel","errorMessages","required","organizationNumberErrorRequired","organizationNumberErrorPattern","mask","width","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/OrganizationNumber/OrganizationNumber.tsx"],"sourcesContent":["import React, { useContext } from 'react'\nimport StringComponent, { Props as StringComponentProps } from '../String'\nimport SharedContext from '../../../../shared/Context'\n\nexport type Props = StringComponentProps & {\n  validate?: boolean\n  omitMask?: boolean\n}\n\nfunction OrganizationNumber(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const { validate = true, omitMask } = props\n\n  const stringComponentProps: Props = {\n    ...props,\n    className: 'dnb-forms-field-organization-number',\n    pattern: props.pattern ?? (validate ? '^[0-9]{9}$' : undefined),\n    label:\n      props.label ??\n      sharedContext?.translation.Forms.organizationNumberLabel,\n    errorMessages: {\n      required:\n        sharedContext?.translation.Forms.organizationNumberErrorRequired,\n      pattern:\n        sharedContext?.translation.Forms.organizationNumberErrorPattern,\n      ...props.errorMessages,\n    },\n    mask: omitMask\n      ? [/\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/]\n      : [/\\d/, /\\d/, /\\d/, ' ', /\\d/, /\\d/, /\\d/, ' ', /\\d/, /\\d/, /\\d/],\n    width: props.width ?? 'medium',\n  }\n\n  return <StringComponent {...stringComponentProps} />\n}\n\nOrganizationNumber._supportsSpacingProps = true\nexport default OrganizationNumber\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,eAAe,MAAyC,WAAW;AAC1E,OAAOC,aAAa,MAAM,4BAA4B;AAOtD,SAASC,kBAAkBA,CAACC,KAAY,EAAE;EACxC,MAAMC,aAAa,GAAGL,UAAU,CAACE,aAAa,CAAC;EAC/C,MAAM;IAAEI,QAAQ,GAAG,IAAI;IAAEC;EAAS,CAAC,GAAGH,KAAK;EAE3C,MAAMI,oBAA2B,GAAAC,aAAA,CAAAA,aAAA,KAC5BL,KAAK;IACRM,SAAS,EAAE,qCAAqC;IAChDC,OAAO,EAAEP,KAAK,CAACO,OAAO,KAAKL,QAAQ,GAAG,YAAY,GAAGM,SAAS,CAAC;IAC/DC,KAAK,EACHT,KAAK,CAACS,KAAK,KACXR,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAES,WAAW,CAACC,KAAK,CAACC,uBAAuB;IAC1DC,aAAa,EAAAR,aAAA;MACXS,QAAQ,EACNb,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAES,WAAW,CAACC,KAAK,CAACI,+BAA+B;MAClER,OAAO,EACLN,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAES,WAAW,CAACC,KAAK,CAACK;IAA8B,GAC9DhB,KAAK,CAACa,aAAa,CACvB;IACDI,IAAI,EAAEd,QAAQ,GACV,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,GACtD,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;IACpEe,KAAK,EAAElB,KAAK,CAACkB,KAAK,IAAI;EAAQ,EAC/B;EAED,OAAOvB,KAAA,CAAAwB,aAAA,CAACtB,eAAe,EAAKO,oBAAuB,CAAC;AACtD;AAEAL,kBAAkB,CAACqB,qBAAqB,GAAG,IAAI;AAC/C,eAAerB,kBAAkB"}
+{"version":3,"file":"OrganizationNumber.js","names":["React","useContext","StringComponent","SharedContext","OrganizationNumber","props","_props$pattern","_props$label","_props$width","sharedContext","validate","omitMask","stringComponentProps","_objectSpread","className","pattern","undefined","label","translation","Forms","organizationNumberLabel","errorMessages","required","organizationNumberErrorRequired","organizationNumberErrorPattern","mask","width","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/OrganizationNumber/OrganizationNumber.tsx"],"sourcesContent":["import React, { useContext } from 'react'\nimport StringComponent, { Props as StringComponentProps } from '../String'\nimport SharedContext from '../../../../shared/Context'\n\nexport type Props = StringComponentProps & {\n  validate?: boolean\n  omitMask?: boolean\n}\n\nfunction OrganizationNumber(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const { validate = true, omitMask } = props\n\n  const stringComponentProps: Props = {\n    ...props,\n    className: 'dnb-forms-field-organization-number',\n    pattern: props.pattern ?? (validate ? '^[0-9]{9}$' : undefined),\n    label:\n      props.label ??\n      sharedContext?.translation.Forms.organizationNumberLabel,\n    errorMessages: {\n      required:\n        sharedContext?.translation.Forms.organizationNumberErrorRequired,\n      pattern:\n        sharedContext?.translation.Forms.organizationNumberErrorPattern,\n      ...props.errorMessages,\n    },\n    mask: omitMask\n      ? [/\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/, /\\d/]\n      : [/\\d/, /\\d/, /\\d/, ' ', /\\d/, /\\d/, /\\d/, ' ', /\\d/, /\\d/, /\\d/],\n    width: props.width ?? 'medium',\n  }\n\n  return <StringComponent {...stringComponentProps} />\n}\n\nOrganizationNumber._supportsSpacingProps = true\nexport default OrganizationNumber\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,eAAe,MAAyC,WAAW;AAC1E,OAAOC,aAAa,MAAM,4BAA4B;AAOtD,SAASC,kBAAkBA,CAACC,KAAY,EAAE;EAAA,IAAAC,cAAA,EAAAC,YAAA,EAAAC,YAAA;EACxC,MAAMC,aAAa,GAAGR,UAAU,CAACE,aAAa,CAAC;EAC/C,MAAM;IAAEO,QAAQ,GAAG,IAAI;IAAEC;EAAS,CAAC,GAAGN,KAAK;EAE3C,MAAMO,oBAA2B,GAAAC,aAAA,CAAAA,aAAA,KAC5BR,KAAK;IACRS,SAAS,EAAE,qCAAqC;IAChDC,OAAO,GAAAT,cAAA,GAAED,KAAK,CAACU,OAAO,cAAAT,cAAA,cAAAA,cAAA,GAAKI,QAAQ,GAAG,YAAY,GAAGM,SAAU;IAC/DC,KAAK,GAAAV,YAAA,GACHF,KAAK,CAACY,KAAK,cAAAV,YAAA,cAAAA,YAAA,GACXE,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAES,WAAW,CAACC,KAAK,CAACC,uBAAuB;IAC1DC,aAAa,EAAAR,aAAA;MACXS,QAAQ,EACNb,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAES,WAAW,CAACC,KAAK,CAACI,+BAA+B;MAClER,OAAO,EACLN,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAES,WAAW,CAACC,KAAK,CAACK;IAA8B,GAC9DnB,KAAK,CAACgB,aAAa,CACvB;IACDI,IAAI,EAAEd,QAAQ,GACV,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,GACtD,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;IACpEe,KAAK,GAAAlB,YAAA,GAAEH,KAAK,CAACqB,KAAK,cAAAlB,YAAA,cAAAA,YAAA,GAAI;EAAQ,EAC/B;EAED,OAAOR,KAAA,CAAA2B,aAAA,CAACzB,eAAe,EAAKU,oBAAuB,CAAC;AACtD;AAEAR,kBAAkB,CAACwB,qBAAqB,GAAG,IAAI;AAC/C,eAAexB,kBAAkB"}

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

@@ -9,6 +9,11 @@ export type Props = FieldHelpProps & FieldProps<string, undefined> & {
     width?: 'large' | 'stretch';
     onCountryCodeChange?: (value: string | undefined) => void;
     onNumberChange?: (value: string | undefined) => void;
+} & {
+    /**
+     * For internal testing purposes
+     */
+    noAnimation?: boolean;
 };
 declare function PhoneNumber(props: Props): import("react/jsx-runtime").JSX.Element;
 declare namespace PhoneNumber {

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

@@ -1,3 +1,5 @@
+"use client";
+
 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; }
@@ -12,7 +14,6 @@ import FieldBlock from '../../FieldBlock';
 import { pickSpacingProps } from '../../../../components/flex/utils';
 import SharedContext from '../../../../shared/Context';
 function PhoneNumber(props) {
-  var _sharedContext$locale;
   const sharedContext = useContext(SharedContext);
   const defaultProps = {
     value: '+47',
@@ -46,17 +47,29 @@ function PhoneNumber(props) {
     onNumberChange
   } = useDataValue(preparedProps);
   const [, countryCode, phoneNumber] = value !== undefined ? value.match(/^(\+[^ ]+)? ?(.*)$/) : [undefined, '', ''];
-  const lang = (_sharedContext$locale = sharedContext.locale) === null || _sharedContext$locale === void 0 ? void 0 : _sharedContext$locale.split('-')[0];
-  const countryCodeData = useMemo(() => countries.map(country => ({
-    selectedKey: `+${country.cdc}`,
-    selected_value: `${country.iso} (+${country.cdc})`,
-    content: `+${country.cdc} ${country.i18n[lang] ?? country.i18n.en}`
-  })), [sharedContext.locale]);
+  const getCountryData = ({
+    filter = null
+  } = {}) => {
+    var _sharedContext$locale;
+    const lang = (_sharedContext$locale = sharedContext.locale) === null || _sharedContext$locale === void 0 ? void 0 : _sharedContext$locale.split('-')[0];
+    return countries.filter(({
+      cdc
+    }) => !filter || `+${cdc}` === filter).sort(({
+      i18n: a
+    }, {
+      i18n: b
+    }) => a[lang] > b[lang] ? 1 : -1).map(country => makeObject(country, lang));
+  };
+  const singleCountryCodeData = useMemo(() => {
+    return getCountryData({
+      filter: countryCode
+    });
+  }, []);
   const handleCountryCodeChange = useCallback(({
     data
   }) => {
-    var _data$selectedKey;
-    const countryCode = (data === null || data === void 0 ? void 0 : (_data$selectedKey = data.selectedKey) === null || _data$selectedKey === void 0 ? void 0 : _data$selectedKey.trim()) ?? emptyValue;
+    var _data$selectedKey$tri, _data$selectedKey;
+    const countryCode = (_data$selectedKey$tri = data === null || data === void 0 ? void 0 : (_data$selectedKey = data.selectedKey) === null || _data$selectedKey === void 0 ? void 0 : _data$selectedKey.trim()) !== null && _data$selectedKey$tri !== void 0 ? _data$selectedKey$tri : emptyValue;
     if (!countryCode && !phoneNumber) {
       handleChange === null || handleChange === void 0 ? void 0 : handleChange(emptyValue);
       onCountryCodeChange === null || onCountryCodeChange === void 0 ? void 0 : onCountryCodeChange(emptyValue);
@@ -74,6 +87,15 @@ function PhoneNumber(props) {
     handleChange === null || handleChange === void 0 ? void 0 : handleChange([countryCode, phoneNumber].filter(Boolean).join(' '));
     onNumberChange === null || onNumberChange === void 0 ? void 0 : onNumberChange(phoneNumber);
   }, [countryCode, emptyValue, handleChange, onNumberChange]);
+  const onFocusHandler = ({
+    dataList,
+    updateData
+  }) => {
+    if (dataList.length < 10) {
+      updateData(getCountryData());
+    }
+    handleFocus();
+  };
   return React.createElement(FieldBlock, _extends({
     className: classnames('dnb-forms-field-phone-number', className),
     width: width !== 'stretch' ? width : undefined,
@@ -82,26 +104,28 @@ function PhoneNumber(props) {
     error: error
   }, pickSpacingProps(props)), React.createElement(Flex.Horizontal, null, React.createElement(Autocomplete, {
     className: classnames('dnb-forms-field-phone-number__country-code', countryCodeFieldClassName),
-    placeholder: countryCodePlaceholder ?? ' ',
+    placeholder: countryCodePlaceholder !== null && countryCodePlaceholder !== void 0 ? countryCodePlaceholder : ' ',
     label_direction: layout,
-    label: countryCodeLabel ?? (sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.countryCodeLabel),
-    data: countryCodeData,
+    label: countryCodeLabel !== null && countryCodeLabel !== void 0 ? countryCodeLabel : sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.countryCodeLabel,
+    mode: "async",
+    data: singleCountryCodeData,
     value: countryCode,
     disabled: disabled,
-    on_focus: handleFocus,
+    on_focus: onFocusHandler,
     on_blur: handleBlur,
     on_change: handleCountryCodeChange,
     independent_width: true,
     search_numbers: true,
+    no_animation: props.noAnimation,
     stretch: width === 'stretch'
   }), React.createElement(StringComponent, {
     className: classnames('dnb-forms-field-phone-number__number', numberFieldClassName),
     type: "tel",
     emptyValue: "",
     layout: "vertical",
-    label: label ?? ' ',
-    placeholder: placeholder ?? '00 00 00 00',
-    mask: numberMask ?? [/\d/, /\d/, ' ', /\d/, /\d/, ' ', /\d/, /\d/, ' ', /\d/, /\d/],
+    label: label !== null && label !== void 0 ? label : ' ',
+    placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : '00 00 00 00',
+    mask: numberMask !== null && numberMask !== void 0 ? numberMask : [/\d/, /\d/, ' ', /\d/, /\d/, ' ', /\d/, /\d/, ' ', /\d/, /\d/],
     onFocus: handleFocus,
     onBlur: handleBlur,
     onChange: handleNumberChange,
@@ -114,6 +138,14 @@ function PhoneNumber(props) {
     help: help
   })));
 }
+function makeObject(country, lang) {
+  var _country$i18n$lang;
+  return {
+    selectedKey: `+${country.cdc}`,
+    selected_value: `${country.iso} (+${country.cdc})`,
+    content: `+${country.cdc} ${(_country$i18n$lang = country.i18n[lang]) !== null && _country$i18n$lang !== void 0 ? _country$i18n$lang : country.i18n.en}`
+  };
+}
 PhoneNumber._supportsSpacingProps = true;
 export default PhoneNumber;
 //# sourceMappingURL=PhoneNumber.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PhoneNumber.js","names":["React","useMemo","useContext","useCallback","Autocomplete","Flex","classnames","countries","StringComponent","useDataValue","FieldBlock","pickSpacingProps","SharedContext","PhoneNumber","props","_sharedContext$locale","sharedContext","defaultProps","value","errorMessages","_objectSpread","required","translation","Forms","phoneNumberErrorRequired","preparedProps","className","countryCodeFieldClassName","numberFieldClassName","layout","countryCodePlaceholder","placeholder","countryCodeLabel","label","phoneNumberLabel","numberMask","emptyValue","info","warning","error","disabled","width","help","handleFocus","handleBlur","handleChange","onCountryCodeChange","onNumberChange","countryCode","phoneNumber","undefined","match","lang","locale","split","countryCodeData","map","country","selectedKey","cdc","selected_value","iso","content","i18n","en","handleCountryCodeChange","data","_data$selectedKey","trim","filter","Boolean","join","handleNumberChange","createElement","_extends","Horizontal","label_direction","on_focus","on_blur","on_change","independent_width","search_numbers","stretch","type","mask","onFocus","onBlur","onChange","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/PhoneNumber/PhoneNumber.tsx"],"sourcesContent":["import React, { useMemo, useContext, useCallback } from 'react'\nimport { Autocomplete, Flex } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport classnames from 'classnames'\nimport countries from '../../constants/countries'\nimport StringComponent from '../String'\nimport { useDataValue } from '../../hooks'\nimport FieldBlock from '../../FieldBlock'\nimport { FieldHelpProps, FieldProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport SharedContext from '../../../../shared/Context'\n\nexport type Props = FieldHelpProps &\n  FieldProps<string, undefined> & {\n    countryCodeFieldClassName?: string\n    numberFieldClassName?: string\n    countryCodePlaceholder?: string\n    countryCodeLabel?: string\n    numberMask?: InputMaskedProps['mask']\n    width?: 'large' | 'stretch'\n    onCountryCodeChange?: (value: string | undefined) => void\n    onNumberChange?: (value: string | undefined) => void\n  }\n\nfunction PhoneNumber(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const defaultProps: Partial<Props> = {\n    // Important for the default value to be defined here, and not after the useDataValue call, to avoid the UI jumping\n    // back to +47 once the user empty the field so handleChange send out undefined.\n    value: '+47',\n    errorMessages: {\n      required: sharedContext?.translation.Forms.phoneNumberErrorRequired,\n      ...props?.errorMessages,\n    },\n  }\n  const preparedProps: Props = {\n    ...defaultProps,\n    ...props,\n  }\n\n  const {\n    className,\n    countryCodeFieldClassName,\n    numberFieldClassName,\n    layout = 'vertical',\n    countryCodePlaceholder,\n    placeholder,\n    countryCodeLabel,\n    label = sharedContext?.translation.Forms.phoneNumberLabel,\n    value,\n    numberMask,\n    emptyValue,\n    info,\n    warning,\n    error,\n    disabled,\n    width = 'large',\n    help,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    onCountryCodeChange,\n    onNumberChange,\n  } = useDataValue(preparedProps)\n\n  const [, countryCode, phoneNumber] =\n    value !== undefined\n      ? value.match(/^(\\+[^ ]+)? ?(.*)$/)\n      : [undefined, '', '']\n\n  const lang = sharedContext.locale?.split('-')[0]\n  const countryCodeData = useMemo(\n    () =>\n      countries.map((country) => ({\n        selectedKey: `+${country.cdc}`,\n        selected_value: `${country.iso} (+${country.cdc})`,\n        content: `+${country.cdc} ${\n          country.i18n[lang] ?? country.i18n.en\n        }`,\n      })),\n    [sharedContext.locale]\n  )\n\n  const handleCountryCodeChange = useCallback(\n    ({ data }: { data: { selectedKey: string } }) => {\n      const countryCode = data?.selectedKey?.trim() ?? emptyValue\n\n      if (!countryCode && !phoneNumber) {\n        handleChange?.(emptyValue)\n        onCountryCodeChange?.(emptyValue)\n        return\n      }\n\n      handleChange?.([countryCode, phoneNumber].filter(Boolean).join(' '))\n      onCountryCodeChange?.(countryCode)\n    },\n    [phoneNumber, emptyValue, handleChange, onCountryCodeChange]\n  )\n\n  const handleNumberChange = useCallback(\n    (phoneNumber: string) => {\n      if (!countryCode && !phoneNumber) {\n        handleChange?.(emptyValue)\n        onNumberChange?.(emptyValue)\n        return\n      }\n\n      handleChange?.([countryCode, phoneNumber].filter(Boolean).join(' '))\n      onNumberChange?.(phoneNumber)\n    },\n    [countryCode, emptyValue, handleChange, onNumberChange]\n  )\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-phone-number', className)}\n      width={width !== 'stretch' ? width : undefined}\n      info={info}\n      warning={warning}\n      error={error}\n      {...pickSpacingProps(props)}\n    >\n      <Flex.Horizontal>\n        <Autocomplete\n          className={classnames(\n            'dnb-forms-field-phone-number__country-code',\n            countryCodeFieldClassName\n          )}\n          placeholder={countryCodePlaceholder ?? ' '}\n          label_direction={layout}\n          label={\n            countryCodeLabel ??\n            sharedContext?.translation.Forms.countryCodeLabel\n          }\n          data={countryCodeData}\n          value={countryCode}\n          disabled={disabled}\n          on_focus={handleFocus}\n          on_blur={handleBlur}\n          on_change={handleCountryCodeChange}\n          independent_width\n          search_numbers\n          stretch={width === 'stretch'}\n        />\n\n        <StringComponent\n          className={classnames(\n            'dnb-forms-field-phone-number__number',\n            numberFieldClassName\n          )}\n          type=\"tel\"\n          emptyValue=\"\"\n          layout=\"vertical\"\n          label={label ?? ' '}\n          placeholder={placeholder ?? '00 00 00 00'}\n          mask={\n            numberMask ?? [\n              /\\d/,\n              /\\d/,\n              ' ',\n              /\\d/,\n              /\\d/,\n              ' ',\n              /\\d/,\n              /\\d/,\n              ' ',\n              /\\d/,\n              /\\d/,\n            ]\n          }\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          onChange={handleNumberChange}\n          value={phoneNumber}\n          info={info}\n          warning={warning}\n          error={error}\n          disabled={disabled}\n          width=\"stretch\"\n          help={help}\n        />\n      </Flex.Horizontal>\n    </FieldBlock>\n  )\n}\n\nPhoneNumber._supportsSpacingProps = true\nexport default PhoneNumber\n"],"mappings":"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"}
+{"version":3,"file":"PhoneNumber.js","names":["React","useMemo","useContext","useCallback","Autocomplete","Flex","classnames","countries","StringComponent","useDataValue","FieldBlock","pickSpacingProps","SharedContext","PhoneNumber","props","sharedContext","defaultProps","value","errorMessages","_objectSpread","required","translation","Forms","phoneNumberErrorRequired","preparedProps","className","countryCodeFieldClassName","numberFieldClassName","layout","countryCodePlaceholder","placeholder","countryCodeLabel","label","phoneNumberLabel","numberMask","emptyValue","info","warning","error","disabled","width","help","handleFocus","handleBlur","handleChange","onCountryCodeChange","onNumberChange","countryCode","phoneNumber","undefined","match","getCountryData","filter","_sharedContext$locale","lang","locale","split","cdc","sort","i18n","a","b","map","country","makeObject","singleCountryCodeData","handleCountryCodeChange","data","_data$selectedKey$tri","_data$selectedKey","selectedKey","trim","Boolean","join","handleNumberChange","onFocusHandler","dataList","updateData","length","createElement","_extends","Horizontal","label_direction","mode","on_focus","on_blur","on_change","independent_width","search_numbers","no_animation","noAnimation","stretch","type","mask","onFocus","onBlur","onChange","_country$i18n$lang","selected_value","iso","content","en","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/PhoneNumber/PhoneNumber.tsx"],"sourcesContent":["import React, { useMemo, useContext, useCallback } from 'react'\nimport { Autocomplete, Flex } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport classnames from 'classnames'\nimport countries from '../../constants/countries'\nimport StringComponent from '../String'\nimport { useDataValue } from '../../hooks'\nimport FieldBlock from '../../FieldBlock'\nimport { FieldHelpProps, FieldProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport SharedContext from '../../../../shared/Context'\n\nexport type Props = FieldHelpProps &\n  FieldProps<string, undefined> & {\n    countryCodeFieldClassName?: string\n    numberFieldClassName?: string\n    countryCodePlaceholder?: string\n    countryCodeLabel?: string\n    numberMask?: InputMaskedProps['mask']\n    width?: 'large' | 'stretch'\n    onCountryCodeChange?: (value: string | undefined) => void\n    onNumberChange?: (value: string | undefined) => void\n  } & {\n    /**\n     * For internal testing purposes\n     */\n    noAnimation?: boolean\n  }\n\nfunction PhoneNumber(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const defaultProps: Partial<Props> = {\n    // Important for the default value to be defined here, and not after the useDataValue call, to avoid the UI jumping\n    // back to +47 once the user empty the field so handleChange send out undefined.\n    value: '+47',\n    errorMessages: {\n      required: sharedContext?.translation.Forms.phoneNumberErrorRequired,\n      ...props?.errorMessages,\n    },\n  }\n  const preparedProps: Props = {\n    ...defaultProps,\n    ...props,\n  }\n\n  const {\n    className,\n    countryCodeFieldClassName,\n    numberFieldClassName,\n    layout = 'vertical',\n    countryCodePlaceholder,\n    placeholder,\n    countryCodeLabel,\n    label = sharedContext?.translation.Forms.phoneNumberLabel,\n    value,\n    numberMask,\n    emptyValue,\n    info,\n    warning,\n    error,\n    disabled,\n    width = 'large',\n    help,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    onCountryCodeChange,\n    onNumberChange,\n  } = useDataValue(preparedProps)\n\n  const [, countryCode, phoneNumber] =\n    value !== undefined\n      ? value.match(/^(\\+[^ ]+)? ?(.*)$/)\n      : [undefined, '', '']\n\n  const getCountryData = ({ filter = null } = {}) => {\n    const lang = sharedContext.locale?.split('-')[0]\n    return countries\n      .filter(({ cdc }) => !filter || `+${cdc}` === filter)\n      .sort(({ i18n: a }, { i18n: b }) => (a[lang] > b[lang] ? 1 : -1))\n      .map((country) => makeObject(country, lang))\n  }\n\n  const singleCountryCodeData = useMemo(() => {\n    return getCountryData({ filter: countryCode })\n  }, [])\n\n  const handleCountryCodeChange = useCallback(\n    ({ data }: { data: { selectedKey: string } }) => {\n      const countryCode = data?.selectedKey?.trim() ?? emptyValue\n\n      if (!countryCode && !phoneNumber) {\n        handleChange?.(emptyValue)\n        onCountryCodeChange?.(emptyValue)\n        return\n      }\n\n      handleChange?.([countryCode, phoneNumber].filter(Boolean).join(' '))\n      onCountryCodeChange?.(countryCode)\n    },\n    [phoneNumber, emptyValue, handleChange, onCountryCodeChange]\n  )\n\n  const handleNumberChange = useCallback(\n    (phoneNumber: string) => {\n      if (!countryCode && !phoneNumber) {\n        handleChange?.(emptyValue)\n        onNumberChange?.(emptyValue)\n        return\n      }\n\n      handleChange?.([countryCode, phoneNumber].filter(Boolean).join(' '))\n      onNumberChange?.(phoneNumber)\n    },\n    [countryCode, emptyValue, handleChange, onNumberChange]\n  )\n\n  const onFocusHandler = ({ dataList, updateData }) => {\n    // because there can be more than one country with same cdc\n    if (dataList.length < 10) {\n      updateData(getCountryData())\n    }\n    handleFocus()\n  }\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-phone-number', className)}\n      width={width !== 'stretch' ? width : undefined}\n      info={info}\n      warning={warning}\n      error={error}\n      {...pickSpacingProps(props)}\n    >\n      <Flex.Horizontal>\n        <Autocomplete\n          className={classnames(\n            'dnb-forms-field-phone-number__country-code',\n            countryCodeFieldClassName\n          )}\n          placeholder={countryCodePlaceholder ?? ' '}\n          label_direction={layout}\n          label={\n            countryCodeLabel ??\n            sharedContext?.translation.Forms.countryCodeLabel\n          }\n          mode=\"async\"\n          data={singleCountryCodeData}\n          value={countryCode}\n          disabled={disabled}\n          on_focus={onFocusHandler}\n          on_blur={handleBlur}\n          on_change={handleCountryCodeChange}\n          independent_width\n          search_numbers\n          no_animation={props.noAnimation}\n          stretch={width === 'stretch'}\n        />\n\n        <StringComponent\n          className={classnames(\n            'dnb-forms-field-phone-number__number',\n            numberFieldClassName\n          )}\n          type=\"tel\"\n          emptyValue=\"\"\n          layout=\"vertical\"\n          label={label ?? ' '}\n          placeholder={placeholder ?? '00 00 00 00'}\n          mask={\n            numberMask ?? [\n              /\\d/,\n              /\\d/,\n              ' ',\n              /\\d/,\n              /\\d/,\n              ' ',\n              /\\d/,\n              /\\d/,\n              ' ',\n              /\\d/,\n              /\\d/,\n            ]\n          }\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          onChange={handleNumberChange}\n          value={phoneNumber}\n          info={info}\n          warning={warning}\n          error={error}\n          disabled={disabled}\n          width=\"stretch\"\n          help={help}\n        />\n      </Flex.Horizontal>\n    </FieldBlock>\n  )\n}\n\ntype CountryType = {\n  cdc: string\n  iso: string\n  i18n: {\n    en: string\n  }\n}\n\nfunction makeObject(country: CountryType, lang: string) {\n  return {\n    selectedKey: `+${country.cdc}`,\n    selected_value: `${country.iso} (+${country.cdc})`,\n    content: `+${country.cdc} ${country.i18n[lang] ?? country.i18n.en}`,\n  }\n}\n\nPhoneNumber._supportsSpacingProps = true\nexport default PhoneNumber\n"],"mappings":"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"}

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

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
@@ -10,6 +12,7 @@ import SharedContext from '../../../../shared/Context';
 import FieldBlock from '../../FieldBlock';
 import StringComponent from '../String';
 function PostalCodeAndCity(props) {
+  var _postalCode$pattern, _postalCode$label, _postalCode$placehold, _city$label;
   const sharedContext = useContext(SharedContext);
   const {
       postalCode = {},
@@ -23,19 +26,19 @@ function PostalCodeAndCity(props) {
   }, fieldBlockProps), React.createElement("div", {
     className: 'dnb-forms-field-postal-code-and-city__fields' + (width !== undefined ? ` dnb-forms-field-postal-code-and-city--width-${width}` : "")
   }, React.createElement(StringComponent, _extends({}, postalCode, {
-    pattern: postalCode.pattern ?? '^[0-9]{4}$',
+    pattern: (_postalCode$pattern = postalCode.pattern) !== null && _postalCode$pattern !== void 0 ? _postalCode$pattern : '^[0-9]{4}$',
     className: classnames('dnb-forms-field-postal-code-and-city__postal-code', postalCode.className),
-    label: postalCode.label ?? (sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.postalCodeLabel),
+    label: (_postalCode$label = postalCode.label) !== null && _postalCode$label !== void 0 ? _postalCode$label : sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.postalCodeLabel,
     errorMessages: _objectSpread({
       required: sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.postalCodeErrorRequired,
       pattern: sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.postalCodeErrorPattern
     }, postalCode.errorMessages),
-    placeholder: postalCode.placeholder ?? '0000',
+    placeholder: (_postalCode$placehold = postalCode.placeholder) !== null && _postalCode$placehold !== void 0 ? _postalCode$placehold : '0000',
     width: false,
     inputClassName: "dnb-forms-field-postal-code-and-city__postal-code-input"
   })), React.createElement(StringComponent, _extends({}, city, {
     className: classnames('dnb-forms-field-postal-code-and-city__city', city.className),
-    label: city.label ?? (sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.cityLabel),
+    label: (_city$label = city.label) !== null && _city$label !== void 0 ? _city$label : sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.cityLabel,
     errorMessages: _objectSpread({
       required: sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.cityErrorRequired
     }, city.errorMessages),

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

@@ -1 +1 @@
-{"version":3,"file":"PostalCodeAndCity.js","names":["React","useContext","classnames","SharedContext","FieldBlock","StringComponent","PostalCodeAndCity","props","sharedContext","postalCode","city","width","help","fieldBlockProps","_objectWithoutProperties","_excluded","createElement","_extends","className","undefined","pattern","label","translation","Forms","postalCodeLabel","errorMessages","_objectSpread","required","postalCodeErrorRequired","postalCodeErrorPattern","placeholder","inputClassName","cityLabel","cityErrorRequired","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCity.tsx"],"sourcesContent":["import React, { useContext } from 'react'\nimport classnames from 'classnames'\nimport SharedContext from '../../../../shared/Context'\nimport FieldBlock, { Props as FieldBlockProps } from '../../FieldBlock'\nimport StringComponent, { Props as StringComponentProps } from '../String'\nimport { FieldHelpProps } from '../../types'\n\nexport type Props = FieldHelpProps &\n  Omit<FieldBlockProps, 'children'> &\n  Record<'postalCode' | 'city', StringComponentProps> & {\n    width?: 'small' | 'medium' | 'large'\n  }\n\nfunction PostalCodeAndCity(props: Props) {\n  const sharedContext = useContext(SharedContext)\n\n  const {\n    postalCode = {},\n    city = {},\n    width = 'large',\n    help,\n    ...fieldBlockProps\n  } = props\n\n  return (\n    <FieldBlock\n      className={classnames(\n        'dnb-forms-field-postal-code-and-city',\n        props.className\n      )}\n      {...fieldBlockProps}\n    >\n      <div\n        className={classnames(\n          'dnb-forms-field-postal-code-and-city__fields',\n          width !== undefined &&\n            `dnb-forms-field-postal-code-and-city--width-${width}`\n        )}\n      >\n        <StringComponent\n          {...postalCode}\n          pattern={postalCode.pattern ?? '^[0-9]{4}$'}\n          className={classnames(\n            'dnb-forms-field-postal-code-and-city__postal-code',\n            postalCode.className\n          )}\n          label={\n            postalCode.label ??\n            sharedContext?.translation.Forms.postalCodeLabel\n          }\n          errorMessages={{\n            required:\n              sharedContext?.translation.Forms.postalCodeErrorRequired,\n            pattern:\n              sharedContext?.translation.Forms.postalCodeErrorPattern,\n            ...postalCode.errorMessages,\n          }}\n          placeholder={postalCode.placeholder ?? '0000'}\n          width={false}\n          inputClassName=\"dnb-forms-field-postal-code-and-city__postal-code-input\"\n        />\n        <StringComponent\n          {...city}\n          className={classnames(\n            'dnb-forms-field-postal-code-and-city__city',\n            city.className\n          )}\n          label={city.label ?? sharedContext?.translation.Forms.cityLabel}\n          errorMessages={{\n            required: sharedContext?.translation.Forms.cityErrorRequired,\n            ...city.errorMessages,\n          }}\n          width=\"stretch\"\n          help={help}\n        />\n      </div>\n    </FieldBlock>\n  )\n}\n\nPostalCodeAndCity._supportsSpacingProps = true\nexport default PostalCodeAndCity\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,aAAa,MAAM,4BAA4B;AACtD,OAAOC,UAAU,MAAoC,kBAAkB;AACvE,OAAOC,eAAe,MAAyC,WAAW;AAS1E,SAASC,iBAAiBA,CAACC,KAAY,EAAE;EACvC,MAAMC,aAAa,GAAGP,UAAU,CAACE,aAAa,CAAC;EAE/C,MAAM;MACJM,UAAU,GAAG,CAAC,CAAC;MACfC,IAAI,GAAG,CAAC,CAAC;MACTC,KAAK,GAAG,OAAO;MACfC;IAEF,CAAC,GAAGL,KAAK;IADJM,eAAe,GAAAC,wBAAA,CAChBP,KAAK,EAAAQ,SAAA;EAET,OACEf,KAAA,CAAAgB,aAAA,CAACZ,UAAU,EAAAa,QAAA;IACTC,SAAS,EAAEhB,UAAU,CACnB,sCAAsC,EACtCK,KAAK,CAACW,SACR;EAAE,GACEL,eAAe,GAEnBb,KAAA,CAAAgB,aAAA;IACEE,SAAS,EACP,8CAA8C,IAC9CP,KAAK,KAAKQ,SAAS,mDAC8BR,KAAM;EACvD,GAEFX,KAAA,CAAAgB,aAAA,CAACX,eAAe,EAAAY,QAAA,KACVR,UAAU;IACdW,OAAO,EAAEX,UAAU,CAACW,OAAO,IAAI,YAAa;IAC5CF,SAAS,EAAEhB,UAAU,CACnB,mDAAmD,EACnDO,UAAU,CAACS,SACb,CAAE;IACFG,KAAK,EACHZ,UAAU,CAACY,KAAK,KAChBb,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEc,WAAW,CAACC,KAAK,CAACC,eAAe,CACjD;IACDC,aAAa,EAAAC,aAAA;MACXC,QAAQ,EACNnB,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEc,WAAW,CAACC,KAAK,CAACK,uBAAuB;MAC1DR,OAAO,EACLZ,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEc,WAAW,CAACC,KAAK,CAACM;IAAsB,GACtDpB,UAAU,CAACgB,aAAa,CAC3B;IACFK,WAAW,EAAErB,UAAU,CAACqB,WAAW,IAAI,MAAO;IAC9CnB,KAAK,EAAE,KAAM;IACboB,cAAc,EAAC;EAAyD,EACzE,CAAC,EACF/B,KAAA,CAAAgB,aAAA,CAACX,eAAe,EAAAY,QAAA,KACVP,IAAI;IACRQ,SAAS,EAAEhB,UAAU,CACnB,4CAA4C,EAC5CQ,IAAI,CAACQ,SACP,CAAE;IACFG,KAAK,EAAEX,IAAI,CAACW,KAAK,KAAIb,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEc,WAAW,CAACC,KAAK,CAACS,SAAS,CAAC;IAChEP,aAAa,EAAAC,aAAA;MACXC,QAAQ,EAAEnB,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEc,WAAW,CAACC,KAAK,CAACU;IAAiB,GACzDvB,IAAI,CAACe,aAAa,CACrB;IACFd,KAAK,EAAC,SAAS;IACfC,IAAI,EAAEA;EAAK,EACZ,CACE,CACK,CAAC;AAEjB;AAEAN,iBAAiB,CAAC4B,qBAAqB,GAAG,IAAI;AAC9C,eAAe5B,iBAAiB"}
+{"version":3,"file":"PostalCodeAndCity.js","names":["React","useContext","classnames","SharedContext","FieldBlock","StringComponent","PostalCodeAndCity","props","_postalCode$pattern","_postalCode$label","_postalCode$placehold","_city$label","sharedContext","postalCode","city","width","help","fieldBlockProps","_objectWithoutProperties","_excluded","createElement","_extends","className","undefined","pattern","label","translation","Forms","postalCodeLabel","errorMessages","_objectSpread","required","postalCodeErrorRequired","postalCodeErrorPattern","placeholder","inputClassName","cityLabel","cityErrorRequired","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCity.tsx"],"sourcesContent":["import React, { useContext } from 'react'\nimport classnames from 'classnames'\nimport SharedContext from '../../../../shared/Context'\nimport FieldBlock, { Props as FieldBlockProps } from '../../FieldBlock'\nimport StringComponent, { Props as StringComponentProps } from '../String'\nimport { FieldHelpProps } from '../../types'\n\nexport type Props = FieldHelpProps &\n  Omit<FieldBlockProps, 'children'> &\n  Record<'postalCode' | 'city', StringComponentProps> & {\n    width?: 'small' | 'medium' | 'large'\n  }\n\nfunction PostalCodeAndCity(props: Props) {\n  const sharedContext = useContext(SharedContext)\n\n  const {\n    postalCode = {},\n    city = {},\n    width = 'large',\n    help,\n    ...fieldBlockProps\n  } = props\n\n  return (\n    <FieldBlock\n      className={classnames(\n        'dnb-forms-field-postal-code-and-city',\n        props.className\n      )}\n      {...fieldBlockProps}\n    >\n      <div\n        className={classnames(\n          'dnb-forms-field-postal-code-and-city__fields',\n          width !== undefined &&\n            `dnb-forms-field-postal-code-and-city--width-${width}`\n        )}\n      >\n        <StringComponent\n          {...postalCode}\n          pattern={postalCode.pattern ?? '^[0-9]{4}$'}\n          className={classnames(\n            'dnb-forms-field-postal-code-and-city__postal-code',\n            postalCode.className\n          )}\n          label={\n            postalCode.label ??\n            sharedContext?.translation.Forms.postalCodeLabel\n          }\n          errorMessages={{\n            required:\n              sharedContext?.translation.Forms.postalCodeErrorRequired,\n            pattern:\n              sharedContext?.translation.Forms.postalCodeErrorPattern,\n            ...postalCode.errorMessages,\n          }}\n          placeholder={postalCode.placeholder ?? '0000'}\n          width={false}\n          inputClassName=\"dnb-forms-field-postal-code-and-city__postal-code-input\"\n        />\n        <StringComponent\n          {...city}\n          className={classnames(\n            'dnb-forms-field-postal-code-and-city__city',\n            city.className\n          )}\n          label={city.label ?? sharedContext?.translation.Forms.cityLabel}\n          errorMessages={{\n            required: sharedContext?.translation.Forms.cityErrorRequired,\n            ...city.errorMessages,\n          }}\n          width=\"stretch\"\n          help={help}\n        />\n      </div>\n    </FieldBlock>\n  )\n}\n\nPostalCodeAndCity._supportsSpacingProps = true\nexport default PostalCodeAndCity\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,aAAa,MAAM,4BAA4B;AACtD,OAAOC,UAAU,MAAoC,kBAAkB;AACvE,OAAOC,eAAe,MAAyC,WAAW;AAS1E,SAASC,iBAAiBA,CAACC,KAAY,EAAE;EAAA,IAAAC,mBAAA,EAAAC,iBAAA,EAAAC,qBAAA,EAAAC,WAAA;EACvC,MAAMC,aAAa,GAAGX,UAAU,CAACE,aAAa,CAAC;EAE/C,MAAM;MACJU,UAAU,GAAG,CAAC,CAAC;MACfC,IAAI,GAAG,CAAC,CAAC;MACTC,KAAK,GAAG,OAAO;MACfC;IAEF,CAAC,GAAGT,KAAK;IADJU,eAAe,GAAAC,wBAAA,CAChBX,KAAK,EAAAY,SAAA;EAET,OACEnB,KAAA,CAAAoB,aAAA,CAAChB,UAAU,EAAAiB,QAAA;IACTC,SAAS,EAAEpB,UAAU,CACnB,sCAAsC,EACtCK,KAAK,CAACe,SACR;EAAE,GACEL,eAAe,GAEnBjB,KAAA,CAAAoB,aAAA;IACEE,SAAS,EACP,8CAA8C,IAC9CP,KAAK,KAAKQ,SAAS,mDAC8BR,KAAM;EACvD,GAEFf,KAAA,CAAAoB,aAAA,CAACf,eAAe,EAAAgB,QAAA,KACVR,UAAU;IACdW,OAAO,GAAAhB,mBAAA,GAAEK,UAAU,CAACW,OAAO,cAAAhB,mBAAA,cAAAA,mBAAA,GAAI,YAAa;IAC5Cc,SAAS,EAAEpB,UAAU,CACnB,mDAAmD,EACnDW,UAAU,CAACS,SACb,CAAE;IACFG,KAAK,GAAAhB,iBAAA,GACHI,UAAU,CAACY,KAAK,cAAAhB,iBAAA,cAAAA,iBAAA,GAChBG,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEc,WAAW,CAACC,KAAK,CAACC,eAClC;IACDC,aAAa,EAAAC,aAAA;MACXC,QAAQ,EACNnB,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEc,WAAW,CAACC,KAAK,CAACK,uBAAuB;MAC1DR,OAAO,EACLZ,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEc,WAAW,CAACC,KAAK,CAACM;IAAsB,GACtDpB,UAAU,CAACgB,aAAa,CAC3B;IACFK,WAAW,GAAAxB,qBAAA,GAAEG,UAAU,CAACqB,WAAW,cAAAxB,qBAAA,cAAAA,qBAAA,GAAI,MAAO;IAC9CK,KAAK,EAAE,KAAM;IACboB,cAAc,EAAC;EAAyD,EACzE,CAAC,EACFnC,KAAA,CAAAoB,aAAA,CAACf,eAAe,EAAAgB,QAAA,KACVP,IAAI;IACRQ,SAAS,EAAEpB,UAAU,CACnB,4CAA4C,EAC5CY,IAAI,CAACQ,SACP,CAAE;IACFG,KAAK,GAAAd,WAAA,GAAEG,IAAI,CAACW,KAAK,cAAAd,WAAA,cAAAA,WAAA,GAAIC,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEc,WAAW,CAACC,KAAK,CAACS,SAAU;IAChEP,aAAa,EAAAC,aAAA;MACXC,QAAQ,EAAEnB,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEc,WAAW,CAACC,KAAK,CAACU;IAAiB,GACzDvB,IAAI,CAACe,aAAa,CACrB;IACFd,KAAK,EAAC,SAAS;IACfC,IAAI,EAAEA;EAAK,EACZ,CACE,CACK,CAAC;AAEjB;AAEAV,iBAAiB,CAACgC,qBAAqB,GAAG,IAAI;AAC9C,eAAehC,iBAAiB"}

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

@@ -1,3 +1,5 @@
+"use client";
+
 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; }
@@ -7,21 +9,24 @@ import Option from '../Option';
 import countries from '../../constants/countries';
 import SharedContext from '../../../../shared/Context';
 function SelectCountry(props) {
-  var _sharedContext$locale;
+  var _props$placeholder, _props$label, _sharedContext$locale;
   const sharedContext = useContext(SharedContext);
   const selectComponentProps = _objectSpread(_objectSpread({}, props), {}, {
-    placeholder: props.placeholder ?? (sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.selectCountryPlaceholder),
-    label: props.label ?? (sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.selectCountryLabel),
+    placeholder: (_props$placeholder = props.placeholder) !== null && _props$placeholder !== void 0 ? _props$placeholder : sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.selectCountryPlaceholder,
+    label: (_props$label = props.label) !== null && _props$label !== void 0 ? _props$label : sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.selectCountryLabel,
     errorMessages: _objectSpread({
       required: sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.selectCountryErrorRequired
     }, props.errorMessages)
   });
   const lang = (_sharedContext$locale = sharedContext.locale) === null || _sharedContext$locale === void 0 ? void 0 : _sharedContext$locale.split('-')[0];
-  const countryOptions = useMemo(() => countries.map(country => React.createElement(Option, {
-    key: country.iso,
-    value: country.iso,
-    title: country.i18n[lang] ?? country.i18n.en
-  })), [sharedContext.locale]);
+  const countryOptions = useMemo(() => countries.map(country => {
+    var _country$i18n$lang;
+    return React.createElement(Option, {
+      key: country.iso,
+      value: country.iso,
+      title: (_country$i18n$lang = country.i18n[lang]) !== null && _country$i18n$lang !== void 0 ? _country$i18n$lang : country.i18n.en
+    });
+  }), [sharedContext.locale]);
   return React.createElement(Selection, selectComponentProps, countryOptions);
 }
 SelectCountry._supportsSpacingProps = true;