@commercetools-frontend/experimental-components 5.3.1 → 5.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/commercetools-frontend-experimental-components.cjs.dev.js +89 -23
  2. package/dist/commercetools-frontend-experimental-components.cjs.prod.js +88 -22
  3. package/dist/commercetools-frontend-experimental-components.esm.js +89 -23
  4. package/dist/styles.css +167 -167
  5. package/package.json +9 -9
package/dist/commercetools-frontend-experimental-components.cjs.dev.js CHANGED
@@ -1684,7 +1684,7 @@ function formatMoneyRangeValue(value, intl) {
1684
1684
  return '';
1685
1685
  }
1686
1686
  function formatMoneyValue(amount, currency, intl) {
1687
- return formatMoney$1(_objectSpread$1l({
1687
+ return formatMoney$2(_objectSpread$1l({
1688
1688
  centAmount: amount,
1689
1689
  fractionDigits: getFractionDigit(currency)
1690
1690
  }, currency ? {
@@ -1699,7 +1699,7 @@ function getFractionedAmount(moneyValue) {
1699
1699
  const amount = moneyValue.type === PRECISION_TYPES.highPrecision ? moneyValue.preciseAmount : moneyValue.centAmount;
1700
1700
  return amount / 10 ** fractionDigits;
1701
1701
  }
1702
- function formatMoney$1(moneyValue, intl, options) {
1702
+ function formatMoney$2(moneyValue, intl, options) {
1703
1703
  var _moneyValue$fractione;
1704
1704
  return intl.formatNumber((_moneyValue$fractione = moneyValue.fractionedAmount) !== null && _moneyValue$fractione !== void 0 ? _moneyValue$fractione : getFractionedAmount(moneyValue), _objectSpread$1l({
1705
1705
  style: 'currency',
@@ -1750,10 +1750,10 @@ const formatLtext = _ref3 => {
1750
1750
  locale: language
1751
1751
  });
1752
1752
  };
1753
- const formatMoney = _ref4 => {
1753
+ const formatMoney$1 = _ref4 => {
1754
1754
  let value = _ref4.value,
1755
1755
  intl = _ref4.intl;
1756
- return formatMoney$1(value, intl);
1756
+ return formatMoney$2(value, intl);
1757
1757
  };
1758
1758
  const formatReference = _ref5 => {
1759
1759
  let value = _ref5.value;
@@ -1843,7 +1843,7 @@ const doNotFormat = _ref13 => {
1843
1843
  let value = _ref13.value;
1844
1844
  return value;
1845
1845
  };
1846
- const getFormatter = type => isNil__default["default"](type) ? formatNilType : type.name === 'nested' ? formatNested : type.name === 'set' ? formatSet : type.name === 'enum' ? formatEnum : type.name === 'lenum' ? formatLenum : type.name === 'ltext' ? formatLtext : type.name === 'money' ? formatMoney : type.name === 'reference' ? formatReference : type.name === 'date' ? formatDate : type.name === 'time' ? doNotFormat : type.name === 'datetime' ? formatDateTime : type.name === 'boolean' ? formatBoolean : type.name === 'text' ? doNotFormat : type.name === 'number' ? doNotFormat : formatUnknown;
1846
+ const getFormatter = type => isNil__default["default"](type) ? formatNilType : type.name === 'nested' ? formatNested : type.name === 'set' ? formatSet : type.name === 'enum' ? formatEnum : type.name === 'lenum' ? formatLenum : type.name === 'ltext' ? formatLtext : type.name === 'money' ? formatMoney$1 : type.name === 'reference' ? formatReference : type.name === 'date' ? formatDate : type.name === 'time' ? doNotFormat : type.name === 'datetime' ? formatDateTime : type.name === 'boolean' ? formatBoolean : type.name === 'text' ? doNotFormat : type.name === 'number' ? doNotFormat : formatUnknown;
1847
1847
  function formatAttribute(_ref14) {
1848
1848
  let type = _ref14.type,
1849
1849
  value = _ref14.value,
@@ -4333,12 +4333,38 @@ const createAttributeTypeValue = attribute => {
4333
4333
  return attribute.type;
4334
4334
  }
4335
4335
  };
4336
+
4337
+ /*
4338
+ * Fixed price supports high precision. Action format is nested with the
4339
+ * the type of the money. Absolute discount only works with cent precision,
4340
+ * hence the action structure is flat.
4341
+ */
4342
+ const formatMoney = valueType => money => {
4343
+ if (valueType === 'fixed') {
4344
+ return {
4345
+ [money.type]: _objectSpread$10({
4346
+ centAmount: money.centAmount,
4347
+ currencyCode: money.currencyCode
4348
+ }, money.type === PRECISION_TYPES.highPrecision && {
4349
+ preciseAmount: money.preciseAmount,
4350
+ fractionDigits: money.fractionDigits
4351
+ })
4352
+ };
4353
+ } else if (valueType === 'absolute') {
4354
+ return {
4355
+ centAmount: money.centAmount,
4356
+ currencyCode: money.currencyCode
4357
+ };
4358
+ } else {
4359
+ throw new Error('Unexpected value type for money.');
4360
+ }
4361
+ };
4362
+
4336
4363
  /**
4337
4364
  * converts the `changeValue` action to GraphQL actions variable
4338
4365
  * @param {Object} actionPayload
4339
4366
  */
4340
4367
  const convertChangeValueAction = actionPayload => {
4341
- var _context2;
4342
4368
  const valueType = actionPayload.value.type;
4343
4369
  const possibleTypeKeys = {
4344
4370
  relative: ['permyriad'],
@@ -4347,7 +4373,11 @@ const convertChangeValueAction = actionPayload => {
4347
4373
  giftLineItem: ['product', 'variantId', 'distributionChannel', 'supplyChannel', 'ResourceIdentifierInput']
4348
4374
  };
4349
4375
  const filteredValue = pick__default["default"](actionPayload.value, possibleTypeKeys[valueType]);
4350
- if (filteredValue.money) filteredValue.money = _mapInstanceProperty__default["default"](_context2 = filteredValue.money).call(_context2, valueItem => omit__default["default"](valueItem, '__typename'));
4376
+ if (filteredValue.money) {
4377
+ var _context2;
4378
+ const moneyFormatter = formatMoney(valueType);
4379
+ filteredValue.money = _mapInstanceProperty__default["default"](_context2 = filteredValue.money).call(_context2, moneyFormatter);
4380
+ }
4351
4381
  return {
4352
4382
  changeValue: {
4353
4383
  value: {
@@ -4356,6 +4386,7 @@ const convertChangeValueAction = actionPayload => {
4356
4386
  }
4357
4387
  };
4358
4388
  };
4389
+
4359
4390
  /**
4360
4391
  * This function changes any payload after the actions have been computed.
4361
4392
  * Currently we only need to change the `setCustomField` action payload
@@ -7209,6 +7240,13 @@ function CustomInputSet(props) {
7209
7240
  children: jsxRuntime.jsx(formik.Field, {
7210
7241
  name: props.name,
7211
7242
  validate: values => {
7243
+ // This validate function overrides the one found in CustomFieldInternal ,
7244
+ // so we need to check if the field is required here.
7245
+ if (props.fieldDefinition.required && isNil__default["default"](dropEmptyEntries(values))) {
7246
+ return {
7247
+ missing: true
7248
+ };
7249
+ }
7212
7250
  const errors = getDuplicateErrors(values);
7213
7251
  return errors.length > 0 ? errors : undefined;
7214
7252
  },
@@ -8974,7 +9012,7 @@ function formatDiscount(discount, currencyCode, intl) {
8974
9012
  if (discount.type === 'relative') return "".concat(discount.permyriad / 100, "%");
8975
9013
  if (!discount.money) return null;
8976
9014
  const moneyForCurrencyCode = _findInstanceProperty__default["default"](_context = discount.money).call(_context, discountMoney => discountMoney.currencyCode === currencyCode);
8977
- return moneyForCurrencyCode ? formatMoney$1(moneyForCurrencyCode, intl) : null;
9015
+ return moneyForCurrencyCode ? formatMoney$2(moneyForCurrencyCode, intl) : null;
8978
9016
  }
8979
9017
 
8980
9018
  function formatPercentage(percentage) {
@@ -12622,7 +12660,7 @@ const computedProperties = {
12622
12660
  intl = _ref4.intl;
12623
12661
  const allVariants = _concatInstanceProperty__default["default"](_context2 = product.variants).call(_context2, product.masterVariant);
12624
12662
  const variantPrices = flatMap__default["default"](allVariants, variant => variant.prices);
12625
- return _mapInstanceProperty__default["default"](_context3 = getMinimumPricesByCurrencyCode(variantPrices)).call(_context3, price => formatMoney$1(price, intl)).join(', ') || constants.NO_VALUE_FALLBACK;
12663
+ return _mapInstanceProperty__default["default"](_context3 = getMinimumPricesByCurrencyCode(variantPrices)).call(_context3, price => formatMoney$2(price, intl)).join(', ') || constants.NO_VALUE_FALLBACK;
12626
12664
  },
12627
12665
  sku(_ref5) {
12628
12666
  var _context4, _context5;
@@ -12927,13 +12965,18 @@ var messages = reactIntl.defineMessages({
12927
12965
  id: 'CustomTypesSubform.typesPlaceholder',
12928
12966
  description: 'The placeholder for the types',
12929
12967
  defaultMessage: 'Select...'
12968
+ },
12969
+ noInputValues: {
12970
+ id: 'CustomTypesSubform.noInputValues',
12971
+ description: 'The label when there are no input values defined for the custom fields.',
12972
+ defaultMessage: 'There are no input values defined for the custom fields.'
12930
12973
  }
12931
12974
  });
12932
12975
 
12933
12976
  const FIELD_NAME = 'custom';
12934
12977
 
12935
12978
  function ownKeys$2(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
12936
- function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$2(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
12979
+ function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$2(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
12937
12980
  const typeDefinitionsExist = typeDefinitions => {
12938
12981
  return typeDefinitions.length > 0;
12939
12982
  };
@@ -12944,9 +12987,18 @@ const typeDefinitionSelected = formValues => {
12944
12987
  const typeDefinitionContainsFieldDefinitions = formValues => {
12945
12988
  return formValues[FIELD_NAME].type.obj.key && formValues[FIELD_NAME].type.obj.fieldDefinitions.length > 0;
12946
12989
  };
12947
- const CustomFieldsInputWrapper = _ref => {
12948
- let typeDefinitions = _ref.typeDefinitions,
12949
- isReadOnly = _ref.isReadOnly;
12990
+ const fieldDefinitionsWithValues = formValues => {
12991
+ var _context;
12992
+ const fieldValues = formValues[FIELD_NAME].fields;
12993
+ return _filterInstanceProperty__default["default"](_context = formValues[FIELD_NAME].type.obj.fieldDefinitions).call(_context, _ref => {
12994
+ let name = _ref.name;
12995
+ return fieldValues[name] !== undefined;
12996
+ });
12997
+ };
12998
+ const CustomFieldsInputWrapper = _ref2 => {
12999
+ let typeDefinitions = _ref2.typeDefinitions,
13000
+ isReadOnly = _ref2.isReadOnly,
13001
+ hideEmptyFields = _ref2.hideEmptyFields;
12950
13002
  const _useFormikContext = formik.useFormikContext(),
12951
13003
  formValues = _valuesInstanceProperty__default["default"](_useFormikContext);
12952
13004
  if (!typeDefinitionsExist(typeDefinitions)) {
@@ -12958,12 +13010,15 @@ const CustomFieldsInputWrapper = _ref => {
12958
13010
  if (!typeDefinitionContainsFieldDefinitions(formValues)) {
12959
13011
  return jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$2({}, messages.noCustomFields));
12960
13012
  }
13013
+ if (fieldDefinitionsWithValues(formValues).length === 0 && isReadOnly && hideEmptyFields) {
13014
+ return jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$2({}, messages.noInputValues));
13015
+ }
12961
13016
  return jsxRuntime.jsx(uiKit.Constraints.Horizontal, {
12962
13017
  max: "scale",
12963
13018
  children: jsxRuntime.jsx(CustomFields, {
12964
13019
  isReadOnly: isReadOnly,
12965
13020
  name: "".concat(FIELD_NAME, ".fields"),
12966
- fieldDefinitions: formValues[FIELD_NAME].type.obj.fieldDefinitions
13021
+ fieldDefinitions: isReadOnly && hideEmptyFields ? fieldDefinitionsWithValues(formValues) : formValues[FIELD_NAME].type.obj.fieldDefinitions
12967
13022
  })
12968
13023
  });
12969
13024
  };
@@ -12997,10 +13052,11 @@ const createFormStateFromTypeDefinition = selectedTypeDefinition => {
12997
13052
  };
12998
13053
  };
12999
13054
  const CustomTypeSubform = _ref => {
13000
- var _formValues$FIELD_NAM, _formValues$FIELD_NAM2;
13055
+ var _formValues$FIELD_NAM3, _formValues$FIELD_NAM4;
13001
13056
  let typeDefinitions = _ref.typeDefinitions,
13002
13057
  isReadOnly = _ref.isReadOnly,
13003
- isCondensed = _ref.isCondensed;
13058
+ isCondensed = _ref.isCondensed,
13059
+ hideEmptyFields = _ref.hideEmptyFields;
13004
13060
  const _useFormikContext = formik.useFormikContext(),
13005
13061
  formValues = _valuesInstanceProperty__default["default"](_useFormikContext),
13006
13062
  setFieldValue = _useFormikContext.setFieldValue,
@@ -13027,19 +13083,26 @@ const CustomTypeSubform = _ref => {
13027
13083
  });
13028
13084
  }
13029
13085
  }, [typeDefinitions, setFieldValue, validateForm]);
13086
+ const typeDefinitionSelected = formValues => {
13087
+ var _formValues$FIELD_NAM, _formValues$FIELD_NAM2;
13088
+ return ((_formValues$FIELD_NAM = formValues[FIELD_NAME]) === null || _formValues$FIELD_NAM === void 0 ? void 0 : _formValues$FIELD_NAM.type) && ((_formValues$FIELD_NAM2 = formValues[FIELD_NAME]) === null || _formValues$FIELD_NAM2 === void 0 || (_formValues$FIELD_NAM2 = _formValues$FIELD_NAM2.type) === null || _formValues$FIELD_NAM2 === void 0 ? void 0 : _formValues$FIELD_NAM2.obj);
13089
+ };
13090
+
13091
+ // if the user has read-only permissions, empty fields are hidden, and no type definition is selected, hide the component
13092
+ if (isReadOnly && hideEmptyFields && !typeDefinitionSelected(formValues)) return null;
13030
13093
  return jsxRuntime.jsx(uiKit.CollapsiblePanel, {
13031
13094
  header: jsxRuntime.jsx(uiKit.CollapsiblePanel.Header, {
13032
13095
  isCondensed: isCondensed,
13033
13096
  children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$1({}, messages.title))
13034
13097
  }),
13035
13098
  headerControls: typeDefinitions.length > 0 && jsxRuntime.jsx("div", {
13036
- css: /*#__PURE__*/react$1.css("min-width:", uiKit.designTokens.constraint11, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:CustomTypeSubform;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImN1c3RvbS10eXBlLXN1YmZvcm0uanN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtHb0IiLCJmaWxlIjoiY3VzdG9tLXR5cGUtc3ViZm9ybS5qc3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyB1c2VDYWxsYmFjayB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBQcm9wVHlwZXMgZnJvbSAncHJvcC10eXBlcyc7XG5pbXBvcnQgeyB1c2VGb3JtaWtDb250ZXh0IH0gZnJvbSAnZm9ybWlrJztcbmltcG9ydCB7IEZvcm1hdHRlZE1lc3NhZ2UsIHVzZUludGwgfSBmcm9tICdyZWFjdC1pbnRsJztcbmltcG9ydCB7IHVzZUFwcGxpY2F0aW9uQ29udGV4dCB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL2FwcGxpY2F0aW9uLXNoZWxsLWNvbm5lY3RvcnMnO1xuaW1wb3J0IHsgZm9ybWF0TG9jYWxpemVkU3RyaW5nIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtZnJvbnRlbmQvbDEwbic7XG5pbXBvcnQge1xuICBDb2xsYXBzaWJsZVBhbmVsLFxuICBTZWxlY3RJbnB1dCxcbiAgZGVzaWduVG9rZW5zLFxufSBmcm9tICdAY29tbWVyY2V0b29scy1mcm9udGVuZC91aS1raXQnO1xuaW1wb3J0IG1lc3NhZ2VzIGZyb20gJy4vbWVzc2FnZXMnO1xuaW1wb3J0IEN1c3RvbUZpZWxkc0lucHV0V3JhcHBlciBmcm9tICcuL2N1c3RvbS1maWVsZHMtaW5wdXQtd3JhcHBlcic7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyBGSUVMRF9OQU1FIH0gZnJvbSAnLi9jb25zdGFudHMnO1xuXG4vLyBDcmVhdGVzIGRyb3Bkb3duIG9wdGlvbnNcbmV4cG9ydCBjb25zdCBtYXBUeXBlRGVmaW5pdGlvbnNUb09wdGlvbnMgPSAoXG4gIHR5cGVEZWZpbml0aW9ucyxcbiAgbGFuZ3VhZ2UsXG4gIGxhbmd1YWdlcyxcbiAgc2VsZWN0ZWRUeXBlRGVmaW5pdGlvbklkXG4pID0+IHtcbiAgcmV0dXJuIHR5cGVEZWZpbml0aW9ucy5tYXAoKHR5cGVEZWZpbml0aW9uKSA9PiAoe1xuICAgIGlzRGlzYWJsZWQ6XG4gICAgICBzZWxlY3RlZFR5cGVEZWZpbml0aW9uSWQgJiZcbiAgICAgIHNlbGVjdGVkVHlwZURlZmluaXRpb25JZCA9PT0gdHlwZURlZmluaXRpb24udHlwZS5pZCxcbiAgICB2YWx1ZTogdHlwZURlZmluaXRpb24udHlwZS5rZXksXG4gICAgbGFiZWw6IGZvcm1hdExvY2FsaXplZFN0cmluZyh0eXBlRGVmaW5pdGlvbi50eXBlLCB7XG4gICAgICBrZXk6ICduYW1lJyxcbiAgICAgIGxvY2FsZTogbGFuZ3VhZ2UsXG4gICAgICBmYWxsYmFja09yZGVyOiBsYW5ndWFnZXMsXG4gICAgfSksXG4gIH0pKTtcbn07XG5cbi8vIFVzZWQgdG8gZ2VuZXJhdGUgZm9ybSBzdGF0ZSB3aGVuIHRoZSB1c2VyIHNlbGVjdHMgYSB0eXBlIGRlZmluaXRpb24gZnJvbSB0aGUgZHJvcGRvd25cbmNvbnN0IGNyZWF0ZUZvcm1TdGF0ZUZyb21UeXBlRGVmaW5pdGlvbiA9IChzZWxlY3RlZFR5cGVEZWZpbml0aW9uKSA9PiB7XG4gIHJldHVybiB7XG4gICAgdHlwZToge1xuICAgICAgaWQ6IHNlbGVjdGVkVHlwZURlZmluaXRpb24udHlwZS5pZCxcbiAgICAgIG9iajoge1xuICAgICAgICBmaWVsZERlZmluaXRpb25zOiBzZWxlY3RlZFR5cGVEZWZpbml0aW9uLnR5cGUuZmllbGREZWZpbml0aW9ucyxcbiAgICAgICAga2V5OiBzZWxlY3RlZFR5cGVEZWZpbml0aW9uLnR5cGUua2V5LFxuICAgICAgfSxcbiAgICB9LFxuICAgIGZpZWxkczoge30sXG4gIH07XG59O1xuXG5jb25zdCBDdXN0b21UeXBlU3ViZm9ybSA9ICh7IHR5cGVEZWZpbml0aW9ucywgaXNSZWFkT25seSwgaXNDb25kZW5zZWQgfSkgPT4ge1xuICBjb25zdCB7XG4gICAgdmFsdWVzOiBmb3JtVmFsdWVzLFxuICAgIHNldEZpZWxkVmFsdWUsXG4gICAgdmFsaWRhdGVGb3JtLFxuICB9ID0gdXNlRm9ybWlrQ29udGV4dCgpO1xuICBjb25zdCB7IGZvcm1hdE1lc3NhZ2UgfSA9IHVzZUludGwoKTtcbiAgY29uc3QgeyBsYW5ndWFnZSwgbGFuZ3VhZ2VzIH0gPSB1c2VBcHBsaWNhdGlvbkNvbnRleHQoXG4gICAgKGFwcGxpY2F0aW9uQ29udGV4dCkgPT4gKHtcbiAgICAgIGxhbmd1YWdlOiBhcHBsaWNhdGlvbkNvbnRleHQuZGF0YUxvY2FsZSxcbiAgICAgIGxhbmd1YWdlczogYXBwbGljYXRpb25Db250ZXh0LnByb2plY3QubGFuZ3VhZ2VzLFxuICAgIH0pXG4gICk7XG5cbiAgY29uc3QgaGFuZGxlVHlwZURlZmluaXRpb25TZWxlY3QgPSB1c2VDYWxsYmFjayhcbiAgICAoZXZlbnQpID0+IHtcbiAgICAgIGNvbnN0IHNlbGVjdGVkVHlwZURlZmluaXRpb24gPSB0eXBlRGVmaW5pdGlvbnMuZmluZChcbiAgICAgICAgKHR5cGVEZWZpbml0aW9uKSA9PiB0eXBlRGVmaW5pdGlvbi50eXBlLmtleSA9PT0gZXZlbnQudGFyZ2V0LnZhbHVlXG4gICAgICApO1xuXG4gICAgICBpZiAoc2VsZWN0ZWRUeXBlRGVmaW5pdGlvbikge1xuICAgICAgICBjb25zdCBuZXh0Q3VzdG9tID0gY3JlYXRlRm9ybVN0YXRlRnJvbVR5cGVEZWZpbml0aW9uKFxuICAgICAgICAgIHNlbGVjdGVkVHlwZURlZmluaXRpb25cbiAgICAgICAgKTtcblxuICAgICAgICBzZXRGaWVsZFZhbHVlKEZJRUxEX05BTUUsIG5leHRDdXN0b20pLnRoZW4oKCkgPT4ge1xuICAgICAgICAgIHZhbGlkYXRlRm9ybSgpO1xuICAgICAgICB9KTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIC8vIGlmIHRoZSBkcm9wZG93biBzZWxlY3RvciBpcyBjbGVhcmVkLCByZW1vdmUgdGhlIGBjdXN0b21gIGZpZWxkIGZyb20gdGhlIGZvcm0gc3RhdGUgZW50aXJlbHlcbiAgICAgICAgc2V0RmllbGRWYWx1ZShGSUVMRF9OQU1FLCB1bmRlZmluZWQpLnRoZW4oKCkgPT4ge1xuICAgICAgICAgIHZhbGlkYXRlRm9ybSgpO1xuICAgICAgICB9KTtcbiAgICAgIH1cbiAgICB9LFxuICAgIFt0eXBlRGVmaW5pdGlvbnMsIHNldEZpZWxkVmFsdWUsIHZhbGlkYXRlRm9ybV1cbiAgKTtcblxuICByZXR1cm4gKFxuICAgIDxDb2xsYXBzaWJsZVBhbmVsXG4gICAgICBoZWFkZXI9e1xuICAgICAgICA8Q29sbGFwc2libGVQYW5lbC5IZWFkZXIgaXNDb25kZW5zZWQ9e2lzQ29uZGVuc2VkfT5cbiAgICAgICAgICA8Rm9ybWF0dGVkTWVzc2FnZSB7Li4ubWVzc2FnZXMudGl0bGV9IC8+XG4gICAgICAgIDwvQ29sbGFwc2libGVQYW5lbC5IZWFkZXI+XG4gICAgICB9XG4gICAgICBoZWFkZXJDb250cm9scz17XG4gICAgICAgIHR5cGVEZWZpbml0aW9ucy5sZW5ndGggPiAwICYmIChcbiAgICAgICAgICA8ZGl2XG4gICAgICAgICAgICBjc3M9e2Nzc2BcbiAgICAgICAgICAgICAgbWluLXdpZHRoOiAke2Rlc2lnblRva2Vucy5jb25zdHJhaW50MTF9O1xuICAgICAgICAgICAgYH1cbiAgICAgICAgICA+XG4gICAgICAgICAgICA8U2VsZWN0SW5wdXRcbiAgICAgICAgICAgICAgaXNDbGVhcmFibGVcbiAgICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJjdXN0b20tdHlwZS1zZWxlY3RcIlxuICAgICAgICAgICAgICBuYW1lPXtgJHtGSUVMRF9OQU1FfS50eXBlLm9iai5rZXlgfVxuICAgICAgICAgICAgICBvcHRpb25zPXttYXBUeXBlRGVmaW5pdGlvbnNUb09wdGlvbnMoXG4gICAgICAgICAgICAgICAgdHlwZURlZmluaXRpb25zLFxuICAgICAgICAgICAgICAgIGxhbmd1YWdlLFxuICAgICAgICAgICAgICAgIGxhbmd1YWdlcyxcbiAgICAgICAgICAgICAgICBmb3JtVmFsdWVzW0ZJRUxEX05BTUVdPy50eXBlPy5pZFxuICAgICAgICAgICAgICApfVxuICAgICAgICAgICAgICB2YWx1ZT17Zm9ybVZhbHVlc1tGSUVMRF9OQU1FXT8udHlwZT8ub2JqPy5rZXl9XG4gICAgICAgICAgICAgIG9uQ2hhbmdlPXtoYW5kbGVUeXBlRGVmaW5pdGlvblNlbGVjdH1cbiAgICAgICAgICAgICAgcGxhY2Vob2xkZXI9e2Zvcm1hdE1lc3NhZ2UobWVzc2FnZXMudHlwZXNQbGFjZWhvbGRlcil9XG4gICAgICAgICAgICAgIGlzUmVhZE9ubHk9e2lzUmVhZE9ubHl9XG4gICAgICAgICAgICAvPlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICApXG4gICAgICB9XG4gICAgICBoZWFkZXJDb250cm9sc0FsaWdubWVudD1cInJpZ2h0XCJcbiAgICA+XG4gICAgICA8Q3VzdG9tRmllbGRzSW5wdXRXcmFwcGVyXG4gICAgICAgIHR5cGVEZWZpbml0aW9ucz17dHlwZURlZmluaXRpb25zfVxuICAgICAgICBpc1JlYWRPbmx5PXtpc1JlYWRPbmx5fVxuICAgICAgLz5cbiAgICA8L0NvbGxhcHNpYmxlUGFuZWw+XG4gICk7XG59O1xuXG5DdXN0b21UeXBlU3ViZm9ybS5kaXNwbGF5TmFtZSA9ICdDdXN0b21UeXBlU3ViZm9ybSc7XG5DdXN0b21UeXBlU3ViZm9ybS5wcm9wVHlwZXMgPSB7XG4gIHR5cGVEZWZpbml0aW9uczogUHJvcFR5cGVzLmFycmF5LmlzUmVxdWlyZWQsXG4gIGlzUmVhZE9ubHk6IFByb3BUeXBlcy5ib29sLFxuICBpc0NvbmRlbnNlZDogUHJvcFR5cGVzLmJvb2wsXG59O1xuXG5leHBvcnQgZGVmYXVsdCBDdXN0b21UeXBlU3ViZm9ybTtcbiJdfQ== */"),
13099
+ css: /*#__PURE__*/react$1.css("min-width:", uiKit.designTokens.constraint11, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:CustomTypeSubform;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImN1c3RvbS10eXBlLXN1YmZvcm0uanN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQStHb0IiLCJmaWxlIjoiY3VzdG9tLXR5cGUtc3ViZm9ybS5qc3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyB1c2VDYWxsYmFjayB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBQcm9wVHlwZXMgZnJvbSAncHJvcC10eXBlcyc7XG5pbXBvcnQgeyB1c2VGb3JtaWtDb250ZXh0IH0gZnJvbSAnZm9ybWlrJztcbmltcG9ydCB7IEZvcm1hdHRlZE1lc3NhZ2UsIHVzZUludGwgfSBmcm9tICdyZWFjdC1pbnRsJztcbmltcG9ydCB7IHVzZUFwcGxpY2F0aW9uQ29udGV4dCB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL2FwcGxpY2F0aW9uLXNoZWxsLWNvbm5lY3RvcnMnO1xuaW1wb3J0IHsgZm9ybWF0TG9jYWxpemVkU3RyaW5nIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtZnJvbnRlbmQvbDEwbic7XG5pbXBvcnQge1xuICBDb2xsYXBzaWJsZVBhbmVsLFxuICBTZWxlY3RJbnB1dCxcbiAgZGVzaWduVG9rZW5zLFxufSBmcm9tICdAY29tbWVyY2V0b29scy1mcm9udGVuZC91aS1raXQnO1xuaW1wb3J0IG1lc3NhZ2VzIGZyb20gJy4vbWVzc2FnZXMnO1xuaW1wb3J0IEN1c3RvbUZpZWxkc0lucHV0V3JhcHBlciBmcm9tICcuL2N1c3RvbS1maWVsZHMtaW5wdXQtd3JhcHBlcic7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyBGSUVMRF9OQU1FIH0gZnJvbSAnLi9jb25zdGFudHMnO1xuXG4vLyBDcmVhdGVzIGRyb3Bkb3duIG9wdGlvbnNcbmV4cG9ydCBjb25zdCBtYXBUeXBlRGVmaW5pdGlvbnNUb09wdGlvbnMgPSAoXG4gIHR5cGVEZWZpbml0aW9ucyxcbiAgbGFuZ3VhZ2UsXG4gIGxhbmd1YWdlcyxcbiAgc2VsZWN0ZWRUeXBlRGVmaW5pdGlvbklkXG4pID0+IHtcbiAgcmV0dXJuIHR5cGVEZWZpbml0aW9ucy5tYXAoKHR5cGVEZWZpbml0aW9uKSA9PiAoe1xuICAgIGlzRGlzYWJsZWQ6XG4gICAgICBzZWxlY3RlZFR5cGVEZWZpbml0aW9uSWQgJiZcbiAgICAgIHNlbGVjdGVkVHlwZURlZmluaXRpb25JZCA9PT0gdHlwZURlZmluaXRpb24udHlwZS5pZCxcbiAgICB2YWx1ZTogdHlwZURlZmluaXRpb24udHlwZS5rZXksXG4gICAgbGFiZWw6IGZvcm1hdExvY2FsaXplZFN0cmluZyh0eXBlRGVmaW5pdGlvbi50eXBlLCB7XG4gICAgICBrZXk6ICduYW1lJyxcbiAgICAgIGxvY2FsZTogbGFuZ3VhZ2UsXG4gICAgICBmYWxsYmFja09yZGVyOiBsYW5ndWFnZXMsXG4gICAgfSksXG4gIH0pKTtcbn07XG5cbi8vIFVzZWQgdG8gZ2VuZXJhdGUgZm9ybSBzdGF0ZSB3aGVuIHRoZSB1c2VyIHNlbGVjdHMgYSB0eXBlIGRlZmluaXRpb24gZnJvbSB0aGUgZHJvcGRvd25cbmNvbnN0IGNyZWF0ZUZvcm1TdGF0ZUZyb21UeXBlRGVmaW5pdGlvbiA9IChzZWxlY3RlZFR5cGVEZWZpbml0aW9uKSA9PiB7XG4gIHJldHVybiB7XG4gICAgdHlwZToge1xuICAgICAgaWQ6IHNlbGVjdGVkVHlwZURlZmluaXRpb24udHlwZS5pZCxcbiAgICAgIG9iajoge1xuICAgICAgICBmaWVsZERlZmluaXRpb25zOiBzZWxlY3RlZFR5cGVEZWZpbml0aW9uLnR5cGUuZmllbGREZWZpbml0aW9ucyxcbiAgICAgICAga2V5OiBzZWxlY3RlZFR5cGVEZWZpbml0aW9uLnR5cGUua2V5LFxuICAgICAgfSxcbiAgICB9LFxuICAgIGZpZWxkczoge30sXG4gIH07XG59O1xuXG5jb25zdCBDdXN0b21UeXBlU3ViZm9ybSA9ICh7XG4gIHR5cGVEZWZpbml0aW9ucyxcbiAgaXNSZWFkT25seSxcbiAgaXNDb25kZW5zZWQsXG4gIGhpZGVFbXB0eUZpZWxkcyxcbn0pID0+IHtcbiAgY29uc3Qge1xuICAgIHZhbHVlczogZm9ybVZhbHVlcyxcbiAgICBzZXRGaWVsZFZhbHVlLFxuICAgIHZhbGlkYXRlRm9ybSxcbiAgfSA9IHVzZUZvcm1pa0NvbnRleHQoKTtcbiAgY29uc3QgeyBmb3JtYXRNZXNzYWdlIH0gPSB1c2VJbnRsKCk7XG4gIGNvbnN0IHsgbGFuZ3VhZ2UsIGxhbmd1YWdlcyB9ID0gdXNlQXBwbGljYXRpb25Db250ZXh0KFxuICAgIChhcHBsaWNhdGlvbkNvbnRleHQpID0+ICh7XG4gICAgICBsYW5ndWFnZTogYXBwbGljYXRpb25Db250ZXh0LmRhdGFMb2NhbGUsXG4gICAgICBsYW5ndWFnZXM6IGFwcGxpY2F0aW9uQ29udGV4dC5wcm9qZWN0Lmxhbmd1YWdlcyxcbiAgICB9KVxuICApO1xuXG4gIGNvbnN0IGhhbmRsZVR5cGVEZWZpbml0aW9uU2VsZWN0ID0gdXNlQ2FsbGJhY2soXG4gICAgKGV2ZW50KSA9PiB7XG4gICAgICBjb25zdCBzZWxlY3RlZFR5cGVEZWZpbml0aW9uID0gdHlwZURlZmluaXRpb25zLmZpbmQoXG4gICAgICAgICh0eXBlRGVmaW5pdGlvbikgPT4gdHlwZURlZmluaXRpb24udHlwZS5rZXkgPT09IGV2ZW50LnRhcmdldC52YWx1ZVxuICAgICAgKTtcblxuICAgICAgaWYgKHNlbGVjdGVkVHlwZURlZmluaXRpb24pIHtcbiAgICAgICAgY29uc3QgbmV4dEN1c3RvbSA9IGNyZWF0ZUZvcm1TdGF0ZUZyb21UeXBlRGVmaW5pdGlvbihcbiAgICAgICAgICBzZWxlY3RlZFR5cGVEZWZpbml0aW9uXG4gICAgICAgICk7XG5cbiAgICAgICAgc2V0RmllbGRWYWx1ZShGSUVMRF9OQU1FLCBuZXh0Q3VzdG9tKS50aGVuKCgpID0+IHtcbiAgICAgICAgICB2YWxpZGF0ZUZvcm0oKTtcbiAgICAgICAgfSk7XG4gICAgICB9IGVsc2Uge1xuICAgICAgICAvLyBpZiB0aGUgZHJvcGRvd24gc2VsZWN0b3IgaXMgY2xlYXJlZCwgcmVtb3ZlIHRoZSBgY3VzdG9tYCBmaWVsZCBmcm9tIHRoZSBmb3JtIHN0YXRlIGVudGlyZWx5XG4gICAgICAgIHNldEZpZWxkVmFsdWUoRklFTERfTkFNRSwgdW5kZWZpbmVkKS50aGVuKCgpID0+IHtcbiAgICAgICAgICB2YWxpZGF0ZUZvcm0oKTtcbiAgICAgICAgfSk7XG4gICAgICB9XG4gICAgfSxcbiAgICBbdHlwZURlZmluaXRpb25zLCBzZXRGaWVsZFZhbHVlLCB2YWxpZGF0ZUZvcm1dXG4gICk7XG5cbiAgY29uc3QgdHlwZURlZmluaXRpb25TZWxlY3RlZCA9IChmb3JtVmFsdWVzKSA9PiB7XG4gICAgcmV0dXJuIGZvcm1WYWx1ZXNbRklFTERfTkFNRV0/LnR5cGUgJiYgZm9ybVZhbHVlc1tGSUVMRF9OQU1FXT8udHlwZT8ub2JqO1xuICB9O1xuXG4gIC8vIGlmIHRoZSB1c2VyIGhhcyByZWFkLW9ubHkgcGVybWlzc2lvbnMsIGVtcHR5IGZpZWxkcyBhcmUgaGlkZGVuLCBhbmQgbm8gdHlwZSBkZWZpbml0aW9uIGlzIHNlbGVjdGVkLCBoaWRlIHRoZSBjb21wb25lbnRcbiAgaWYgKGlzUmVhZE9ubHkgJiYgaGlkZUVtcHR5RmllbGRzICYmICF0eXBlRGVmaW5pdGlvblNlbGVjdGVkKGZvcm1WYWx1ZXMpKVxuICAgIHJldHVybiBudWxsO1xuXG4gIHJldHVybiAoXG4gICAgPENvbGxhcHNpYmxlUGFuZWxcbiAgICAgIGhlYWRlcj17XG4gICAgICAgIDxDb2xsYXBzaWJsZVBhbmVsLkhlYWRlciBpc0NvbmRlbnNlZD17aXNDb25kZW5zZWR9PlxuICAgICAgICAgIDxGb3JtYXR0ZWRNZXNzYWdlIHsuLi5tZXNzYWdlcy50aXRsZX0gLz5cbiAgICAgICAgPC9Db2xsYXBzaWJsZVBhbmVsLkhlYWRlcj5cbiAgICAgIH1cbiAgICAgIGhlYWRlckNvbnRyb2xzPXtcbiAgICAgICAgdHlwZURlZmluaXRpb25zLmxlbmd0aCA+IDAgJiYgKFxuICAgICAgICAgIDxkaXZcbiAgICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgICBtaW4td2lkdGg6ICR7ZGVzaWduVG9rZW5zLmNvbnN0cmFpbnQxMX07XG4gICAgICAgICAgICBgfVxuICAgICAgICAgID5cbiAgICAgICAgICAgIDxTZWxlY3RJbnB1dFxuICAgICAgICAgICAgICBpc0NsZWFyYWJsZVxuICAgICAgICAgICAgICBkYXRhLXRlc3RpZD1cImN1c3RvbS10eXBlLXNlbGVjdFwiXG4gICAgICAgICAgICAgIG5hbWU9e2Ake0ZJRUxEX05BTUV9LnR5cGUub2JqLmtleWB9XG4gICAgICAgICAgICAgIG9wdGlvbnM9e21hcFR5cGVEZWZpbml0aW9uc1RvT3B0aW9ucyhcbiAgICAgICAgICAgICAgICB0eXBlRGVmaW5pdGlvbnMsXG4gICAgICAgICAgICAgICAgbGFuZ3VhZ2UsXG4gICAgICAgICAgICAgICAgbGFuZ3VhZ2VzLFxuICAgICAgICAgICAgICAgIGZvcm1WYWx1ZXNbRklFTERfTkFNRV0/LnR5cGU/LmlkXG4gICAgICAgICAgICAgICl9XG4gICAgICAgICAgICAgIHZhbHVlPXtmb3JtVmFsdWVzW0ZJRUxEX05BTUVdPy50eXBlPy5vYmo/LmtleX1cbiAgICAgICAgICAgICAgb25DaGFuZ2U9e2hhbmRsZVR5cGVEZWZpbml0aW9uU2VsZWN0fVxuICAgICAgICAgICAgICBwbGFjZWhvbGRlcj17Zm9ybWF0TWVzc2FnZShtZXNzYWdlcy50eXBlc1BsYWNlaG9sZGVyKX1cbiAgICAgICAgICAgICAgaXNSZWFkT25seT17aXNSZWFkT25seX1cbiAgICAgICAgICAgIC8+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIClcbiAgICAgIH1cbiAgICAgIGhlYWRlckNvbnRyb2xzQWxpZ25tZW50PVwicmlnaHRcIlxuICAgID5cbiAgICAgIDxDdXN0b21GaWVsZHNJbnB1dFdyYXBwZXJcbiAgICAgICAgdHlwZURlZmluaXRpb25zPXt0eXBlRGVmaW5pdGlvbnN9XG4gICAgICAgIGlzUmVhZE9ubHk9e2lzUmVhZE9ubHl9XG4gICAgICAgIGhpZGVFbXB0eUZpZWxkcz17aGlkZUVtcHR5RmllbGRzfVxuICAgICAgLz5cbiAgICA8L0NvbGxhcHNpYmxlUGFuZWw+XG4gICk7XG59O1xuXG5DdXN0b21UeXBlU3ViZm9ybS5kaXNwbGF5TmFtZSA9ICdDdXN0b21UeXBlU3ViZm9ybSc7XG5DdXN0b21UeXBlU3ViZm9ybS5wcm9wVHlwZXMgPSB7XG4gIHR5cGVEZWZpbml0aW9uczogUHJvcFR5cGVzLmFycmF5LmlzUmVxdWlyZWQsXG4gIGlzUmVhZE9ubHk6IFByb3BUeXBlcy5ib29sLFxuICBpc0NvbmRlbnNlZDogUHJvcFR5cGVzLmJvb2wsXG4gIGhpZGVFbXB0eUZpZWxkczogUHJvcFR5cGVzLmJvb2wsXG59O1xuXG5leHBvcnQgZGVmYXVsdCBDdXN0b21UeXBlU3ViZm9ybTtcbiJdfQ== */"),
13037
13100
  children: jsxRuntime.jsx(uiKit.SelectInput, {
13038
13101
  isClearable: true,
13039
13102
  "data-testid": "custom-type-select",
13040
13103
  name: "".concat(FIELD_NAME, ".type.obj.key"),
13041
- options: mapTypeDefinitionsToOptions(typeDefinitions, language, languages, (_formValues$FIELD_NAM = formValues[FIELD_NAME]) === null || _formValues$FIELD_NAM === void 0 || (_formValues$FIELD_NAM = _formValues$FIELD_NAM.type) === null || _formValues$FIELD_NAM === void 0 ? void 0 : _formValues$FIELD_NAM.id),
13042
- value: (_formValues$FIELD_NAM2 = formValues[FIELD_NAME]) === null || _formValues$FIELD_NAM2 === void 0 || (_formValues$FIELD_NAM2 = _formValues$FIELD_NAM2.type) === null || _formValues$FIELD_NAM2 === void 0 || (_formValues$FIELD_NAM2 = _formValues$FIELD_NAM2.obj) === null || _formValues$FIELD_NAM2 === void 0 ? void 0 : _formValues$FIELD_NAM2.key,
13104
+ options: mapTypeDefinitionsToOptions(typeDefinitions, language, languages, (_formValues$FIELD_NAM3 = formValues[FIELD_NAME]) === null || _formValues$FIELD_NAM3 === void 0 || (_formValues$FIELD_NAM3 = _formValues$FIELD_NAM3.type) === null || _formValues$FIELD_NAM3 === void 0 ? void 0 : _formValues$FIELD_NAM3.id),
13105
+ value: (_formValues$FIELD_NAM4 = formValues[FIELD_NAME]) === null || _formValues$FIELD_NAM4 === void 0 || (_formValues$FIELD_NAM4 = _formValues$FIELD_NAM4.type) === null || _formValues$FIELD_NAM4 === void 0 || (_formValues$FIELD_NAM4 = _formValues$FIELD_NAM4.obj) === null || _formValues$FIELD_NAM4 === void 0 ? void 0 : _formValues$FIELD_NAM4.key,
13043
13106
  onChange: handleTypeDefinitionSelect,
13044
13107
  placeholder: formatMessage(messages.typesPlaceholder),
13045
13108
  isReadOnly: isReadOnly
@@ -13048,7 +13111,8 @@ const CustomTypeSubform = _ref => {
13048
13111
  headerControlsAlignment: "right",
13049
13112
  children: jsxRuntime.jsx(CustomFieldsInputWrapper, {
13050
13113
  typeDefinitions: typeDefinitions,
13051
- isReadOnly: isReadOnly
13114
+ isReadOnly: isReadOnly,
13115
+ hideEmptyFields: hideEmptyFields
13052
13116
  })
13053
13117
  });
13054
13118
  };
@@ -13144,7 +13208,8 @@ const createGraphQlDocFromFormState = formState => {
13144
13208
  const CustomFieldsFormField = _ref => {
13145
13209
  let resources = _ref.resources,
13146
13210
  isReadOnly = _ref.isReadOnly,
13147
- isCondensed = _ref.isCondensed;
13211
+ isCondensed = _ref.isCondensed,
13212
+ hideEmptyFields = _ref.hideEmptyFields;
13148
13213
  const projectKey = applicationShellConnectors.useApplicationContext(applicationContext => applicationContext.project.key);
13149
13214
  return jsxRuntime.jsx(CustomFieldTypeDefinitionsConnector$1, {
13150
13215
  resources: resources,
@@ -13161,7 +13226,8 @@ const CustomFieldsFormField = _ref => {
13161
13226
  return jsxRuntime.jsx(CustomTypeSubform, {
13162
13227
  typeDefinitions: typeDefinitions,
13163
13228
  isReadOnly: isReadOnly,
13164
- isCondensed: isCondensed
13229
+ isCondensed: isCondensed,
13230
+ hideEmptyFields: hideEmptyFields
13165
13231
  });
13166
13232
  }
13167
13233
  });
@@ -13248,7 +13314,7 @@ exports.formatCustomerName = formatCustomerName;
13248
13314
  exports.formatDateRangeValue = formatDateRangeValue;
13249
13315
  exports.formatDateTime = formatDateTime$1;
13250
13316
  exports.formatDiscount = formatDiscount;
13251
- exports.formatMoney = formatMoney$1;
13317
+ exports.formatMoney = formatMoney$2;
13252
13318
  exports.formatMoneyRangeValue = formatMoneyRangeValue;
13253
13319
  exports.formatMoneyValue = formatMoneyValue;
13254
13320
  exports.formatPercentage = formatPercentage;
package/dist/commercetools-frontend-experimental-components.cjs.prod.js CHANGED
@@ -1683,7 +1683,7 @@ function formatMoneyRangeValue(value, intl) {
1683
1683
  return '';
1684
1684
  }
1685
1685
  function formatMoneyValue(amount, currency, intl) {
1686
- return formatMoney$1(_objectSpread$1l({
1686
+ return formatMoney$2(_objectSpread$1l({
1687
1687
  centAmount: amount,
1688
1688
  fractionDigits: getFractionDigit(currency)
1689
1689
  }, currency ? {
@@ -1698,7 +1698,7 @@ function getFractionedAmount(moneyValue) {
1698
1698
  const amount = moneyValue.type === PRECISION_TYPES.highPrecision ? moneyValue.preciseAmount : moneyValue.centAmount;
1699
1699
  return amount / 10 ** fractionDigits;
1700
1700
  }
1701
- function formatMoney$1(moneyValue, intl, options) {
1701
+ function formatMoney$2(moneyValue, intl, options) {
1702
1702
  var _moneyValue$fractione;
1703
1703
  return intl.formatNumber((_moneyValue$fractione = moneyValue.fractionedAmount) !== null && _moneyValue$fractione !== void 0 ? _moneyValue$fractione : getFractionedAmount(moneyValue), _objectSpread$1l({
1704
1704
  style: 'currency',
@@ -1749,10 +1749,10 @@ const formatLtext = _ref3 => {
1749
1749
  locale: language
1750
1750
  });
1751
1751
  };
1752
- const formatMoney = _ref4 => {
1752
+ const formatMoney$1 = _ref4 => {
1753
1753
  let value = _ref4.value,
1754
1754
  intl = _ref4.intl;
1755
- return formatMoney$1(value, intl);
1755
+ return formatMoney$2(value, intl);
1756
1756
  };
1757
1757
  const formatReference = _ref5 => {
1758
1758
  let value = _ref5.value;
@@ -1842,7 +1842,7 @@ const doNotFormat = _ref13 => {
1842
1842
  let value = _ref13.value;
1843
1843
  return value;
1844
1844
  };
1845
- const getFormatter = type => isNil__default["default"](type) ? formatNilType : type.name === 'nested' ? formatNested : type.name === 'set' ? formatSet : type.name === 'enum' ? formatEnum : type.name === 'lenum' ? formatLenum : type.name === 'ltext' ? formatLtext : type.name === 'money' ? formatMoney : type.name === 'reference' ? formatReference : type.name === 'date' ? formatDate : type.name === 'time' ? doNotFormat : type.name === 'datetime' ? formatDateTime : type.name === 'boolean' ? formatBoolean : type.name === 'text' ? doNotFormat : type.name === 'number' ? doNotFormat : formatUnknown;
1845
+ const getFormatter = type => isNil__default["default"](type) ? formatNilType : type.name === 'nested' ? formatNested : type.name === 'set' ? formatSet : type.name === 'enum' ? formatEnum : type.name === 'lenum' ? formatLenum : type.name === 'ltext' ? formatLtext : type.name === 'money' ? formatMoney$1 : type.name === 'reference' ? formatReference : type.name === 'date' ? formatDate : type.name === 'time' ? doNotFormat : type.name === 'datetime' ? formatDateTime : type.name === 'boolean' ? formatBoolean : type.name === 'text' ? doNotFormat : type.name === 'number' ? doNotFormat : formatUnknown;
1846
1846
  function formatAttribute(_ref14) {
1847
1847
  let type = _ref14.type,
1848
1848
  value = _ref14.value,
@@ -4332,12 +4332,38 @@ const createAttributeTypeValue = attribute => {
4332
4332
  return attribute.type;
4333
4333
  }
4334
4334
  };
4335
+
4336
+ /*
4337
+ * Fixed price supports high precision. Action format is nested with the
4338
+ * the type of the money. Absolute discount only works with cent precision,
4339
+ * hence the action structure is flat.
4340
+ */
4341
+ const formatMoney = valueType => money => {
4342
+ if (valueType === 'fixed') {
4343
+ return {
4344
+ [money.type]: _objectSpread$10({
4345
+ centAmount: money.centAmount,
4346
+ currencyCode: money.currencyCode
4347
+ }, money.type === PRECISION_TYPES.highPrecision && {
4348
+ preciseAmount: money.preciseAmount,
4349
+ fractionDigits: money.fractionDigits
4350
+ })
4351
+ };
4352
+ } else if (valueType === 'absolute') {
4353
+ return {
4354
+ centAmount: money.centAmount,
4355
+ currencyCode: money.currencyCode
4356
+ };
4357
+ } else {
4358
+ throw new Error('Unexpected value type for money.');
4359
+ }
4360
+ };
4361
+
4335
4362
  /**
4336
4363
  * converts the `changeValue` action to GraphQL actions variable
4337
4364
  * @param {Object} actionPayload
4338
4365
  */
4339
4366
  const convertChangeValueAction = actionPayload => {
4340
- var _context2;
4341
4367
  const valueType = actionPayload.value.type;
4342
4368
  const possibleTypeKeys = {
4343
4369
  relative: ['permyriad'],
@@ -4346,7 +4372,11 @@ const convertChangeValueAction = actionPayload => {
4346
4372
  giftLineItem: ['product', 'variantId', 'distributionChannel', 'supplyChannel', 'ResourceIdentifierInput']
4347
4373
  };
4348
4374
  const filteredValue = pick__default["default"](actionPayload.value, possibleTypeKeys[valueType]);
4349
- if (filteredValue.money) filteredValue.money = _mapInstanceProperty__default["default"](_context2 = filteredValue.money).call(_context2, valueItem => omit__default["default"](valueItem, '__typename'));
4375
+ if (filteredValue.money) {
4376
+ var _context2;
4377
+ const moneyFormatter = formatMoney(valueType);
4378
+ filteredValue.money = _mapInstanceProperty__default["default"](_context2 = filteredValue.money).call(_context2, moneyFormatter);
4379
+ }
4350
4380
  return {
4351
4381
  changeValue: {
4352
4382
  value: {
@@ -4355,6 +4385,7 @@ const convertChangeValueAction = actionPayload => {
4355
4385
  }
4356
4386
  };
4357
4387
  };
4388
+
4358
4389
  /**
4359
4390
  * This function changes any payload after the actions have been computed.
4360
4391
  * Currently we only need to change the `setCustomField` action payload
@@ -7208,6 +7239,13 @@ function CustomInputSet(props) {
7208
7239
  children: jsxRuntime.jsx(formik.Field, {
7209
7240
  name: props.name,
7210
7241
  validate: values => {
7242
+ // This validate function overrides the one found in CustomFieldInternal ,
7243
+ // so we need to check if the field is required here.
7244
+ if (props.fieldDefinition.required && isNil__default["default"](dropEmptyEntries(values))) {
7245
+ return {
7246
+ missing: true
7247
+ };
7248
+ }
7211
7249
  const errors = getDuplicateErrors(values);
7212
7250
  return errors.length > 0 ? errors : undefined;
7213
7251
  },
@@ -8967,7 +9005,7 @@ function formatDiscount(discount, currencyCode, intl) {
8967
9005
  if (discount.type === 'relative') return "".concat(discount.permyriad / 100, "%");
8968
9006
  if (!discount.money) return null;
8969
9007
  const moneyForCurrencyCode = _findInstanceProperty__default["default"](_context = discount.money).call(_context, discountMoney => discountMoney.currencyCode === currencyCode);
8970
- return moneyForCurrencyCode ? formatMoney$1(moneyForCurrencyCode, intl) : null;
9008
+ return moneyForCurrencyCode ? formatMoney$2(moneyForCurrencyCode, intl) : null;
8971
9009
  }
8972
9010
 
8973
9011
  function formatPercentage(percentage) {
@@ -12607,7 +12645,7 @@ const computedProperties = {
12607
12645
  intl = _ref4.intl;
12608
12646
  const allVariants = _concatInstanceProperty__default["default"](_context2 = product.variants).call(_context2, product.masterVariant);
12609
12647
  const variantPrices = flatMap__default["default"](allVariants, variant => variant.prices);
12610
- return _mapInstanceProperty__default["default"](_context3 = getMinimumPricesByCurrencyCode(variantPrices)).call(_context3, price => formatMoney$1(price, intl)).join(', ') || constants.NO_VALUE_FALLBACK;
12648
+ return _mapInstanceProperty__default["default"](_context3 = getMinimumPricesByCurrencyCode(variantPrices)).call(_context3, price => formatMoney$2(price, intl)).join(', ') || constants.NO_VALUE_FALLBACK;
12611
12649
  },
12612
12650
  sku(_ref5) {
12613
12651
  var _context4, _context5;
@@ -12912,13 +12950,18 @@ var messages = reactIntl.defineMessages({
12912
12950
  id: 'CustomTypesSubform.typesPlaceholder',
12913
12951
  description: 'The placeholder for the types',
12914
12952
  defaultMessage: 'Select...'
12953
+ },
12954
+ noInputValues: {
12955
+ id: 'CustomTypesSubform.noInputValues',
12956
+ description: 'The label when there are no input values defined for the custom fields.',
12957
+ defaultMessage: 'There are no input values defined for the custom fields.'
12915
12958
  }
12916
12959
  });
12917
12960
 
12918
12961
  const FIELD_NAME = 'custom';
12919
12962
 
12920
12963
  function ownKeys$2(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
12921
- function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$2(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
12964
+ function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$2(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
12922
12965
  const typeDefinitionsExist = typeDefinitions => {
12923
12966
  return typeDefinitions.length > 0;
12924
12967
  };
@@ -12929,9 +12972,18 @@ const typeDefinitionSelected = formValues => {
12929
12972
  const typeDefinitionContainsFieldDefinitions = formValues => {
12930
12973
  return formValues[FIELD_NAME].type.obj.key && formValues[FIELD_NAME].type.obj.fieldDefinitions.length > 0;
12931
12974
  };
12932
- const CustomFieldsInputWrapper = _ref => {
12933
- let typeDefinitions = _ref.typeDefinitions,
12934
- isReadOnly = _ref.isReadOnly;
12975
+ const fieldDefinitionsWithValues = formValues => {
12976
+ var _context;
12977
+ const fieldValues = formValues[FIELD_NAME].fields;
12978
+ return _filterInstanceProperty__default["default"](_context = formValues[FIELD_NAME].type.obj.fieldDefinitions).call(_context, _ref => {
12979
+ let name = _ref.name;
12980
+ return fieldValues[name] !== undefined;
12981
+ });
12982
+ };
12983
+ const CustomFieldsInputWrapper = _ref2 => {
12984
+ let typeDefinitions = _ref2.typeDefinitions,
12985
+ isReadOnly = _ref2.isReadOnly,
12986
+ hideEmptyFields = _ref2.hideEmptyFields;
12935
12987
  const _useFormikContext = formik.useFormikContext(),
12936
12988
  formValues = _valuesInstanceProperty__default["default"](_useFormikContext);
12937
12989
  if (!typeDefinitionsExist(typeDefinitions)) {
@@ -12943,12 +12995,15 @@ const CustomFieldsInputWrapper = _ref => {
12943
12995
  if (!typeDefinitionContainsFieldDefinitions(formValues)) {
12944
12996
  return jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$2({}, messages.noCustomFields));
12945
12997
  }
12998
+ if (fieldDefinitionsWithValues(formValues).length === 0 && isReadOnly && hideEmptyFields) {
12999
+ return jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$2({}, messages.noInputValues));
13000
+ }
12946
13001
  return jsxRuntime.jsx(uiKit.Constraints.Horizontal, {
12947
13002
  max: "scale",
12948
13003
  children: jsxRuntime.jsx(CustomFields, {
12949
13004
  isReadOnly: isReadOnly,
12950
13005
  name: "".concat(FIELD_NAME, ".fields"),
12951
- fieldDefinitions: formValues[FIELD_NAME].type.obj.fieldDefinitions
13006
+ fieldDefinitions: isReadOnly && hideEmptyFields ? fieldDefinitionsWithValues(formValues) : formValues[FIELD_NAME].type.obj.fieldDefinitions
12952
13007
  })
12953
13008
  });
12954
13009
  };
@@ -12982,10 +13037,11 @@ const createFormStateFromTypeDefinition = selectedTypeDefinition => {
12982
13037
  };
12983
13038
  };
12984
13039
  const CustomTypeSubform = _ref => {
12985
- var _formValues$FIELD_NAM, _formValues$FIELD_NAM2;
13040
+ var _formValues$FIELD_NAM3, _formValues$FIELD_NAM4;
12986
13041
  let typeDefinitions = _ref.typeDefinitions,
12987
13042
  isReadOnly = _ref.isReadOnly,
12988
- isCondensed = _ref.isCondensed;
13043
+ isCondensed = _ref.isCondensed,
13044
+ hideEmptyFields = _ref.hideEmptyFields;
12989
13045
  const _useFormikContext = formik.useFormikContext(),
12990
13046
  formValues = _valuesInstanceProperty__default["default"](_useFormikContext),
12991
13047
  setFieldValue = _useFormikContext.setFieldValue,
@@ -13012,6 +13068,13 @@ const CustomTypeSubform = _ref => {
13012
13068
  });
13013
13069
  }
13014
13070
  }, [typeDefinitions, setFieldValue, validateForm]);
13071
+ const typeDefinitionSelected = formValues => {
13072
+ var _formValues$FIELD_NAM, _formValues$FIELD_NAM2;
13073
+ return ((_formValues$FIELD_NAM = formValues[FIELD_NAME]) === null || _formValues$FIELD_NAM === void 0 ? void 0 : _formValues$FIELD_NAM.type) && ((_formValues$FIELD_NAM2 = formValues[FIELD_NAME]) === null || _formValues$FIELD_NAM2 === void 0 || (_formValues$FIELD_NAM2 = _formValues$FIELD_NAM2.type) === null || _formValues$FIELD_NAM2 === void 0 ? void 0 : _formValues$FIELD_NAM2.obj);
13074
+ };
13075
+
13076
+ // if the user has read-only permissions, empty fields are hidden, and no type definition is selected, hide the component
13077
+ if (isReadOnly && hideEmptyFields && !typeDefinitionSelected(formValues)) return null;
13015
13078
  return jsxRuntime.jsx(uiKit.CollapsiblePanel, {
13016
13079
  header: jsxRuntime.jsx(uiKit.CollapsiblePanel.Header, {
13017
13080
  isCondensed: isCondensed,
@@ -13023,8 +13086,8 @@ const CustomTypeSubform = _ref => {
13023
13086
  isClearable: true,
13024
13087
  "data-testid": "custom-type-select",
13025
13088
  name: "".concat(FIELD_NAME, ".type.obj.key"),
13026
- options: mapTypeDefinitionsToOptions(typeDefinitions, language, languages, (_formValues$FIELD_NAM = formValues[FIELD_NAME]) === null || _formValues$FIELD_NAM === void 0 || (_formValues$FIELD_NAM = _formValues$FIELD_NAM.type) === null || _formValues$FIELD_NAM === void 0 ? void 0 : _formValues$FIELD_NAM.id),
13027
- value: (_formValues$FIELD_NAM2 = formValues[FIELD_NAME]) === null || _formValues$FIELD_NAM2 === void 0 || (_formValues$FIELD_NAM2 = _formValues$FIELD_NAM2.type) === null || _formValues$FIELD_NAM2 === void 0 || (_formValues$FIELD_NAM2 = _formValues$FIELD_NAM2.obj) === null || _formValues$FIELD_NAM2 === void 0 ? void 0 : _formValues$FIELD_NAM2.key,
13089
+ options: mapTypeDefinitionsToOptions(typeDefinitions, language, languages, (_formValues$FIELD_NAM3 = formValues[FIELD_NAME]) === null || _formValues$FIELD_NAM3 === void 0 || (_formValues$FIELD_NAM3 = _formValues$FIELD_NAM3.type) === null || _formValues$FIELD_NAM3 === void 0 ? void 0 : _formValues$FIELD_NAM3.id),
13090
+ value: (_formValues$FIELD_NAM4 = formValues[FIELD_NAME]) === null || _formValues$FIELD_NAM4 === void 0 || (_formValues$FIELD_NAM4 = _formValues$FIELD_NAM4.type) === null || _formValues$FIELD_NAM4 === void 0 || (_formValues$FIELD_NAM4 = _formValues$FIELD_NAM4.obj) === null || _formValues$FIELD_NAM4 === void 0 ? void 0 : _formValues$FIELD_NAM4.key,
13028
13091
  onChange: handleTypeDefinitionSelect,
13029
13092
  placeholder: formatMessage(messages.typesPlaceholder),
13030
13093
  isReadOnly: isReadOnly
@@ -13033,7 +13096,8 @@ const CustomTypeSubform = _ref => {
13033
13096
  headerControlsAlignment: "right",
13034
13097
  children: jsxRuntime.jsx(CustomFieldsInputWrapper, {
13035
13098
  typeDefinitions: typeDefinitions,
13036
- isReadOnly: isReadOnly
13099
+ isReadOnly: isReadOnly,
13100
+ hideEmptyFields: hideEmptyFields
13037
13101
  })
13038
13102
  });
13039
13103
  };
@@ -13129,7 +13193,8 @@ const createGraphQlDocFromFormState = formState => {
13129
13193
  const CustomFieldsFormField = _ref => {
13130
13194
  let resources = _ref.resources,
13131
13195
  isReadOnly = _ref.isReadOnly,
13132
- isCondensed = _ref.isCondensed;
13196
+ isCondensed = _ref.isCondensed,
13197
+ hideEmptyFields = _ref.hideEmptyFields;
13133
13198
  const projectKey = applicationShellConnectors.useApplicationContext(applicationContext => applicationContext.project.key);
13134
13199
  return jsxRuntime.jsx(CustomFieldTypeDefinitionsConnector$1, {
13135
13200
  resources: resources,
@@ -13146,7 +13211,8 @@ const CustomFieldsFormField = _ref => {
13146
13211
  return jsxRuntime.jsx(CustomTypeSubform, {
13147
13212
  typeDefinitions: typeDefinitions,
13148
13213
  isReadOnly: isReadOnly,
13149
- isCondensed: isCondensed
13214
+ isCondensed: isCondensed,
13215
+ hideEmptyFields: hideEmptyFields
13150
13216
  });
13151
13217
  }
13152
13218
  });
@@ -13233,7 +13299,7 @@ exports.formatCustomerName = formatCustomerName;
13233
13299
  exports.formatDateRangeValue = formatDateRangeValue;
13234
13300
  exports.formatDateTime = formatDateTime$1;
13235
13301
  exports.formatDiscount = formatDiscount;
13236
- exports.formatMoney = formatMoney$1;
13302
+ exports.formatMoney = formatMoney$2;
13237
13303
  exports.formatMoneyRangeValue = formatMoneyRangeValue;
13238
13304
  exports.formatMoneyValue = formatMoneyValue;
13239
13305
  exports.formatPercentage = formatPercentage;