@commercetools-frontend-extensions/export-resources-modal 0.0.0-canary-20250528102549 → 0.0.0-canary-20250617132829

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 (19) hide show
  1. package/dist/{active-drag-drop-area-fb905a01.esm.js → active-drag-drop-area-98149234.esm.js} +1 -1
  2. package/dist/{active-drag-drop-area-e3f74c13.cjs.dev.js → active-drag-drop-area-f0ea9b7b.cjs.dev.js} +1 -1
  3. package/dist/{active-drag-drop-area-e9bf7129.cjs.prod.js → active-drag-drop-area-fb42a613.cjs.prod.js} +1 -1
  4. package/dist/commercetools-frontend-extensions-export-resources-modal.cjs.dev.js +1 -1
  5. package/dist/commercetools-frontend-extensions-export-resources-modal.cjs.prod.js +1 -1
  6. package/dist/commercetools-frontend-extensions-export-resources-modal.esm.js +1 -1
  7. package/dist/declarations/src/@constants/urls.d.ts +1 -0
  8. package/dist/declarations/src/@types/export-api.d.ts +1 -0
  9. package/dist/declarations/src/@types/form.d.ts +1 -0
  10. package/dist/{enabled-drop-area-3161efde.cjs.prod.js → enabled-drop-area-26c2b035.cjs.prod.js} +1 -1
  11. package/dist/{enabled-drop-area-5d5a61c8.esm.js → enabled-drop-area-64110e94.esm.js} +1 -1
  12. package/dist/{enabled-drop-area-b35ddf49.cjs.dev.js → enabled-drop-area-c11b08f9.cjs.dev.js} +1 -1
  13. package/dist/{file-dropped-area-85fb3d1d.cjs.prod.js → file-dropped-area-55af62d7.cjs.prod.js} +1 -1
  14. package/dist/{file-dropped-area-ff7e0b8e.cjs.dev.js → file-dropped-area-698edef8.cjs.dev.js} +1 -1
  15. package/dist/{file-dropped-area-aad1bd09.esm.js → file-dropped-area-c0cb76ab.esm.js} +1 -1
  16. package/dist/{index-2ed12fce.cjs.dev.js → index-06c30ade.cjs.dev.js} +141 -108
  17. package/dist/{index-f0396960.esm.js → index-d48404fd.esm.js} +142 -109
  18. package/dist/{index-e73d846c.cjs.prod.js → index-d8cef75f.cjs.prod.js} +141 -108
  19. package/package.json +31 -31
@@ -1,4 +1,4 @@
1
- import { F as FileDropped, E as EnabledDropArea } from './index-f0396960.esm.js';
1
+ import { F as FileDropped, E as EnabledDropArea } from './index-d48404fd.esm.js';
2
2
  import { jsx } from '@emotion/react/jsx-runtime';
3
3
  import '@babel/runtime-corejs3/helpers/defineProperty';
4
4
  import '@babel/runtime-corejs3/helpers/objectWithoutProperties';
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-2ed12fce.cjs.dev.js');
3
+ var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-06c30ade.cjs.dev.js');
4
4
  var jsxRuntime = require('@emotion/react/jsx-runtime');
5
5
  require('@babel/runtime-corejs3/helpers/defineProperty');
6
6
  require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-e73d846c.cjs.prod.js');
3
+ var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-d8cef75f.cjs.prod.js');
4
4
  var jsxRuntime = require('@emotion/react/jsx-runtime');
5
5
  require('@babel/runtime-corejs3/helpers/defineProperty');
6
6
  require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-2ed12fce.cjs.dev.js');
5
+ var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-06c30ade.cjs.dev.js');
6
6
  require('react');
7
7
  require('@commercetools-frontend/ui-kit');
8
8
  require('@emotion/react/jsx-runtime');
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-e73d846c.cjs.prod.js');
5
+ var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-d8cef75f.cjs.prod.js');
6
6
  require('react');
7
7
  require('@commercetools-frontend/ui-kit');
8
8
  require('@emotion/react/jsx-runtime');
@@ -1,4 +1,4 @@
1
- export { c as EXPORTABLE_RESOURCES, b as EXPORT_TYPES, L as LocaleOption, S as Step, a as default, d as useConvertFieldDefinitionsForExport } from './index-f0396960.esm.js';
1
+ export { c as EXPORTABLE_RESOURCES, b as EXPORT_TYPES, L as LocaleOption, S as Step, a as default, d as useConvertFieldDefinitionsForExport } from './index-d48404fd.esm.js';
2
2
  import 'react';
3
3
  import '@commercetools-frontend/ui-kit';
4
4
  import '@emotion/react/jsx-runtime';
@@ -1,3 +1,4 @@
1
1
  export declare const EXPORT_DATA_DOCUMENTATION_LINK = "https://docs.commercetools.com/merchant-center/export-data";
2
2
  export declare const CSV_TEMPLATES_LINK = "https://docs.commercetools.com/merchant-center/import-data#download-a-template";
3
3
  export declare const CSV_STRUCTURE_DOCUMENTATION_LINK = "https://docs.commercetools.com/merchant-center/export-data#structure-of-exported-csv-files";
4
+ export declare const EXPORT_EXCEL_DOCUMENTATION_LINK = "https://docs.commercetools.com/merchant-center/export-data#optimize-csv-file-for-microsoft-excel";
@@ -16,6 +16,7 @@ export interface ExportApiRequest {
16
16
  filters?: QueryFilter | SearchFilter;
17
17
  where?: string;
18
18
  fillRows?: boolean;
19
+ excelCompatible?: boolean;
19
20
  fullText?: {
20
21
  text: string;
21
22
  locale: string;
@@ -16,6 +16,7 @@ export interface FormValues {
16
16
  groups: FormGroup[];
17
17
  locales: string[];
18
18
  fillRows?: boolean;
19
+ excelCompatible?: boolean;
19
20
  columnSeparator: string;
20
21
  decimalSeparator: string;
21
22
  importedCsvTemplateFile: File | null;
@@ -12,7 +12,7 @@ var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/obje
12
12
  var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
13
13
  require('react');
14
14
  var jsxRuntime = require('@emotion/react/jsx-runtime');
15
- var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-e73d846c.cjs.prod.js');
15
+ var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-d8cef75f.cjs.prod.js');
16
16
  require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
17
17
  require('@babel/runtime-corejs3/helpers/slicedToArray');
18
18
  require('@babel/runtime-corejs3/core-js-stable/object/entries');
@@ -10,7 +10,7 @@ import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object
10
10
  import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
11
11
  import 'react';
12
12
  import { jsxs, jsx } from '@emotion/react/jsx-runtime';
13
- import { m as messages } from './index-f0396960.esm.js';
13
+ import { m as messages } from './index-d48404fd.esm.js';
14
14
  import '@babel/runtime-corejs3/helpers/objectWithoutProperties';
15
15
  import '@babel/runtime-corejs3/helpers/slicedToArray';
16
16
  import '@babel/runtime-corejs3/core-js-stable/object/entries';
@@ -12,7 +12,7 @@ var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/obje
12
12
  var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
13
13
  require('react');
14
14
  var jsxRuntime = require('@emotion/react/jsx-runtime');
15
- var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-2ed12fce.cjs.dev.js');
15
+ var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-06c30ade.cjs.dev.js');
16
16
  require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
17
17
  require('@babel/runtime-corejs3/helpers/slicedToArray');
18
18
  require('@babel/runtime-corejs3/core-js-stable/object/entries');
@@ -3,7 +3,7 @@
3
3
  var _valuesInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/values');
4
4
  var reactIntl = require('react-intl');
5
5
  var uiKit = require('@commercetools-frontend/ui-kit');
6
- var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-e73d846c.cjs.prod.js');
6
+ var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-d8cef75f.cjs.prod.js');
7
7
  require('@babel/runtime-corejs3/helpers/slicedToArray');
8
8
  require('@babel/runtime-corejs3/core-js-stable/instance/reduce');
9
9
  require('react');
@@ -3,7 +3,7 @@
3
3
  var _valuesInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/values');
4
4
  var reactIntl = require('react-intl');
5
5
  var uiKit = require('@commercetools-frontend/ui-kit');
6
- var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-2ed12fce.cjs.dev.js');
6
+ var dist_commercetoolsFrontendExtensionsExportResourcesModal = require('./index-06c30ade.cjs.dev.js');
7
7
  require('@babel/runtime-corejs3/helpers/slicedToArray');
8
8
  require('@babel/runtime-corejs3/core-js-stable/instance/reduce');
9
9
  require('react');
@@ -1,7 +1,7 @@
1
1
  import _valuesInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/values';
2
2
  import { useIntl } from 'react-intl';
3
3
  import { Spacings, PaperclipIcon, Constraints, Text, SecondaryButton } from '@commercetools-frontend/ui-kit';
4
- import { u as useExportResourcesModalContext, m as messages } from './index-f0396960.esm.js';
4
+ import { u as useExportResourcesModalContext, m as messages } from './index-d48404fd.esm.js';
5
5
  import '@babel/runtime-corejs3/helpers/slicedToArray';
6
6
  import '@babel/runtime-corejs3/core-js-stable/instance/reduce';
7
7
  import 'react';
@@ -656,12 +656,12 @@ var messages = reactIntl.defineMessages({
656
656
  columns: {
657
657
  id: 'ExportResourcesModal.columns',
658
658
  description: 'Label for column separator select',
659
- defaultMessage: 'Columns:'
659
+ defaultMessage: 'Columns'
660
660
  },
661
- decimal: {
662
- id: 'ExportResourcesModal.decimal',
661
+ decimals: {
662
+ id: 'ExportResourcesModal.decimals',
663
663
  description: 'Label for decimal separator select',
664
- defaultMessage: 'Decimals:'
664
+ defaultMessage: 'Decimals'
665
665
  },
666
666
  columnSeparatorComma: {
667
667
  id: 'ExportResourcesModal.columnSeparatorComma',
@@ -697,6 +697,21 @@ var messages = reactIntl.defineMessages({
697
697
  id: 'ExportResourcesModal.csvSettings',
698
698
  description: 'Label for CSV settings section',
699
699
  defaultMessage: 'CSV settings:'
700
+ },
701
+ excelOptimized: {
702
+ id: 'ExportResourcesModal.excelOptimized',
703
+ description: 'Label for Excel-optimized CSV export checkbox',
704
+ defaultMessage: 'CSV file optimized for Excel'
705
+ },
706
+ excelOptimizedDescription: {
707
+ id: 'ExportResourcesModal.excelOptimizedDescription',
708
+ description: 'Description for Excel-optimized CSV export checkbox',
709
+ defaultMessage: 'Checking this option will prevent Excel from interpreting the data of the file.'
710
+ },
711
+ readMoreOnDocumentation: {
712
+ id: 'ExportResourcesModal.readMoreOnDocumentation',
713
+ description: 'Read more on documentation',
714
+ defaultMessage: 'Read more on the {documentationLink}'
700
715
  }
701
716
  });
702
717
 
@@ -805,6 +820,7 @@ const OUTPUT_FORMAT_OPTIONS = [{
805
820
  const EXPORT_DATA_DOCUMENTATION_LINK = 'https://docs.commercetools.com/merchant-center/export-data';
806
821
  const CSV_TEMPLATES_LINK = 'https://docs.commercetools.com/merchant-center/import-data#download-a-template';
807
822
  const CSV_STRUCTURE_DOCUMENTATION_LINK = 'https://docs.commercetools.com/merchant-center/export-data#structure-of-exported-csv-files';
823
+ const EXPORT_EXCEL_DOCUMENTATION_LINK = 'https://docs.commercetools.com/merchant-center/export-data#optimize-csv-file-for-microsoft-excel';
808
824
 
809
825
  const resourceTypeMessages = {
810
826
  [EXPORTABLE_RESOURCES.CATEGORY]: {
@@ -1577,6 +1593,7 @@ const useInitialValues = props => {
1577
1593
  groups: updateFieldGroupWithAdditionalFieldExtensions(groups),
1578
1594
  queryPredicate: '',
1579
1595
  fillRows: false,
1596
+ excelCompatible: false,
1580
1597
  outputFormat: props.outputFormat,
1581
1598
  columnSeparator: DELIMITERS$1.COMMA,
1582
1599
  decimalSeparator: DELIMITERS$1.POINT,
@@ -1663,6 +1680,7 @@ const useStartExportOperation = props => {
1663
1680
  fileFormat: values.outputFormat,
1664
1681
  locales,
1665
1682
  fillRows: isCsv && values.fillRows,
1683
+ excelCompatible: isCsv && values.excelCompatible,
1666
1684
  separator: isCsv ? {
1667
1685
  columns: values.columnSeparator,
1668
1686
  decimal: values.decimalSeparator
@@ -1898,6 +1916,7 @@ const useValidateExportOperation = () => {
1898
1916
  function ownKeys$a(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; }
1899
1917
  function _objectSpread$a(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$a(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$a(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1900
1918
  const ExportPreferenceSection = () => {
1919
+ const intl = reactIntl.useIntl();
1901
1920
  const _useExportResourcesMo = useExportResourcesModalContext(),
1902
1921
  formik = _useExportResourcesMo.formik;
1903
1922
  const columnSeparatorOptions = _mapInstanceProperty__default["default"](COLUMN_DELIMITER_OPTIONS).call(COLUMN_DELIMITER_OPTIONS, option => _objectSpread$a(_objectSpread$a({}, option), {}, {
@@ -1907,7 +1926,7 @@ const ExportPreferenceSection = () => {
1907
1926
  label: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$a({}, option.label))
1908
1927
  }));
1909
1928
  return jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1910
- scale: "m",
1929
+ scale: "xl",
1911
1930
  children: [jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1912
1931
  scale: "s",
1913
1932
  children: [jsxRuntime.jsxs("div", {
@@ -1918,60 +1937,80 @@ const ExportPreferenceSection = () => {
1918
1937
  })]
1919
1938
  }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1920
1939
  scale: "s",
1921
- children: [jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1922
- scale: "xs",
1923
- alignItems: "center",
1924
- children: [jsxRuntime.jsx(uiKit.Text.Body, {
1925
- intlMessage: messages.columns
1926
- }), jsxRuntime.jsx(uiKit.SelectInput, {
1927
- horizontalConstraint: 4,
1928
- isSearchable: false,
1929
- options: columnSeparatorOptions,
1930
- value: _valuesInstanceProperty__default["default"](formik).columnSeparator,
1931
- onChange: e => {
1932
- formik.setFieldValue('columnSeparator', e.target.value);
1933
- },
1934
- menuPortalTarget: document.body,
1935
- menuPortalZIndex: Z_INDEX_DROPDOWN
1936
- })]
1937
- }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1938
- scale: "s",
1939
- alignItems: "center",
1940
- children: [jsxRuntime.jsx(uiKit.Text.Body, {
1941
- intlMessage: messages.decimal
1942
- }), jsxRuntime.jsx(uiKit.SelectInput, {
1943
- isSearchable: false,
1944
- options: decimalSeparatorOptions,
1945
- value: _valuesInstanceProperty__default["default"](formik).decimalSeparator,
1946
- onChange: e => {
1947
- formik.setFieldValue('decimalSeparator', e.target.value);
1948
- },
1949
- menuPortalTarget: document.body,
1950
- horizontalConstraint: 4,
1951
- menuPortalZIndex: Z_INDEX_DROPDOWN
1952
- })]
1940
+ children: [jsxRuntime.jsx(uiKit.SelectField, {
1941
+ title: intl.formatMessage(messages.columns),
1942
+ isSearchable: false,
1943
+ options: columnSeparatorOptions,
1944
+ value: _valuesInstanceProperty__default["default"](formik).columnSeparator,
1945
+ onChange: e => {
1946
+ formik.setFieldValue('columnSeparator', e.target.value);
1947
+ },
1948
+ menuPortalTarget: document.body,
1949
+ menuPortalZIndex: Z_INDEX_DROPDOWN
1950
+ }), jsxRuntime.jsx(uiKit.SelectField, {
1951
+ title: intl.formatMessage(messages.decimals),
1952
+ isSearchable: false,
1953
+ options: decimalSeparatorOptions,
1954
+ value: _valuesInstanceProperty__default["default"](formik).decimalSeparator,
1955
+ onChange: e => {
1956
+ formik.setFieldValue('decimalSeparator', e.target.value);
1957
+ },
1958
+ menuPortalTarget: document.body,
1959
+ menuPortalZIndex: Z_INDEX_DROPDOWN
1953
1960
  })]
1954
1961
  })]
1955
- }), jsxRuntime.jsxs("div", {
1956
- children: [jsxRuntime.jsx(uiKit.CheckboxInput, {
1957
- isChecked: _valuesInstanceProperty__default["default"](formik).fillRows,
1958
- onChange: e => {
1959
- formik.setFieldValue('fillRows', e.target.checked);
1960
- },
1961
- children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$a({}, messages.fillRows))
1962
- }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1963
- scale: "xl",
1964
- children: [jsxRuntime.jsx("div", {}), jsxRuntime.jsx(uiKit.Text.Caption, {
1965
- intlMessage: _objectSpread$a(_objectSpread$a({}, messages.moreInformation), {}, {
1966
- values: {
1967
- documentationLink: jsxRuntime.jsx(uiKit.Link, {
1968
- intlMessage: messages.documentation,
1969
- isExternal: true,
1970
- to: CSV_STRUCTURE_DOCUMENTATION_LINK
1971
- }, "documentation-link")
1972
- }
1962
+ }), jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1963
+ scale: "xl",
1964
+ children: [jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1965
+ scale: "m",
1966
+ children: [jsxRuntime.jsx(uiKit.CheckboxInput, {
1967
+ isChecked: _valuesInstanceProperty__default["default"](formik).excelCompatible,
1968
+ onChange: e => {
1969
+ formik.setFieldValue('excelCompatible', e.target.checked);
1970
+ },
1971
+ children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$a({}, messages.excelOptimized))
1972
+ }), _valuesInstanceProperty__default["default"](formik).excelCompatible && jsxRuntime.jsx(uiKit.ContentNotification, {
1973
+ type: "info",
1974
+ children: jsxRuntime.jsx(uiKit.Spacings.Inset, {
1975
+ scale: "xs",
1976
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1977
+ children: [jsxRuntime.jsx("div", {
1978
+ children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$a({}, messages.excelOptimizedDescription))
1979
+ }), jsxRuntime.jsx("div", {
1980
+ children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$a(_objectSpread$a({}, messages.readMoreOnDocumentation), {}, {
1981
+ values: {
1982
+ documentationLink: jsxRuntime.jsx(uiKit.Link, {
1983
+ intlMessage: messages.documentation,
1984
+ isExternal: true,
1985
+ to: EXPORT_EXCEL_DOCUMENTATION_LINK
1986
+ }, "documentation-link")
1987
+ }
1988
+ }))
1989
+ })]
1990
+ })
1973
1991
  })
1974
1992
  })]
1993
+ }), jsxRuntime.jsxs("div", {
1994
+ children: [jsxRuntime.jsx(uiKit.CheckboxInput, {
1995
+ isChecked: _valuesInstanceProperty__default["default"](formik).fillRows,
1996
+ onChange: e => {
1997
+ formik.setFieldValue('fillRows', e.target.checked);
1998
+ },
1999
+ children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$a({}, messages.fillRows))
2000
+ }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
2001
+ scale: "xl",
2002
+ children: [jsxRuntime.jsx("div", {}), jsxRuntime.jsx(uiKit.Text.Caption, {
2003
+ intlMessage: _objectSpread$a(_objectSpread$a({}, messages.moreInformation), {}, {
2004
+ values: {
2005
+ documentationLink: jsxRuntime.jsx(uiKit.Link, {
2006
+ intlMessage: messages.documentation,
2007
+ isExternal: true,
2008
+ to: CSV_STRUCTURE_DOCUMENTATION_LINK
2009
+ }, "documentation-link")
2010
+ }
2011
+ })
2012
+ })]
2013
+ })]
1975
2014
  })]
1976
2015
  })]
1977
2016
  });
@@ -2085,59 +2124,53 @@ const ExportFileSettingsStep = () => {
2085
2124
  onClose: onClose,
2086
2125
  size: 16,
2087
2126
  children: jsxRuntime.jsx(fullstory.Masking.Unmask, {
2088
- children: jsxRuntime.jsx(uiKit.Spacings.Stack, {
2089
- scale: "xxxl",
2090
- children: jsxRuntime.jsx(uiKit.Spacings.Stack, {
2091
- scale: "l",
2092
- children: jsxRuntime.jsxs(uiKit.Grid, {
2093
- gridRowGap: uiKit.designTokens.spacingM,
2094
- gridTemplateColumns: `calc(${uiKit.designTokens.constraint3} + ${uiKit.designTokens.spacingL}) auto`,
2095
- children: [jsxRuntime.jsx(uiKit.Grid.Item, {
2096
- children: jsxRuntime.jsx(uiKit.Text.Body, {
2097
- intlMessage: messages.scope
2098
- })
2099
- }), jsxRuntime.jsx(uiKit.Grid.Item, {
2100
- children: jsxRuntime.jsx(ExportScopeSection, {})
2101
- }), jsxRuntime.jsx(uiKit.Grid.Item, {
2102
- children: jsxRuntime.jsx(uiKit.Text.Body, {
2103
- intlMessage: messages.saveAs
2104
- })
2105
- }), jsxRuntime.jsx(uiKit.Grid.Item, {
2106
- children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
2107
- scale: "s",
2108
- children: [jsxRuntime.jsx(fullstory.Masking.Mask, {
2109
- children: jsxRuntime.jsx(uiKit.TextField, {
2110
- name: "fileName",
2111
- onChange: formik.handleChange,
2112
- onBlur: formik.handleBlur,
2113
- value: _valuesInstanceProperty__default["default"](formik).fileName,
2114
- title: intl.formatMessage(messages.fileName),
2115
- touched: formik.touched.fileName,
2116
- errors: mapFormikErrors(formik.errors.fileName),
2117
- renderError: renderFileNameError
2118
- })
2119
- }), jsxRuntime.jsx(uiKit.SelectField, {
2120
- name: "outputFormat",
2121
- onChange: handleOutputFormatChange,
2122
- onBlur: formik.handleBlur,
2123
- value: _valuesInstanceProperty__default["default"](formik).outputFormat,
2124
- title: intl.formatMessage(messages.outputFormat),
2125
- options: OUTPUT_FORMAT_OPTIONS,
2126
- menuPortalTarget: document.body,
2127
- menuPortalZIndex: Z_INDEX_DROPDOWN
2128
- })]
2127
+ children: jsxRuntime.jsxs(uiKit.Grid, {
2128
+ gridRowGap: uiKit.designTokens.spacingXl,
2129
+ gridTemplateColumns: `calc(${uiKit.designTokens.constraint3} + ${uiKit.designTokens.spacingL}) auto`,
2130
+ children: [jsxRuntime.jsx(uiKit.Grid.Item, {
2131
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
2132
+ intlMessage: messages.scope
2133
+ })
2134
+ }), jsxRuntime.jsx(uiKit.Grid.Item, {
2135
+ children: jsxRuntime.jsx(ExportScopeSection, {})
2136
+ }), jsxRuntime.jsx(uiKit.Grid.Item, {
2137
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
2138
+ intlMessage: messages.saveAs
2139
+ })
2140
+ }), jsxRuntime.jsx(uiKit.Grid.Item, {
2141
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
2142
+ scale: "xl",
2143
+ children: [jsxRuntime.jsx(fullstory.Masking.Mask, {
2144
+ children: jsxRuntime.jsx(uiKit.TextField, {
2145
+ name: "fileName",
2146
+ onChange: formik.handleChange,
2147
+ onBlur: formik.handleBlur,
2148
+ value: _valuesInstanceProperty__default["default"](formik).fileName,
2149
+ title: intl.formatMessage(messages.fileName),
2150
+ touched: formik.touched.fileName,
2151
+ errors: mapFormikErrors(formik.errors.fileName),
2152
+ renderError: renderFileNameError
2129
2153
  })
2130
- }), shouldShowPreferences && jsxRuntime.jsxs(jsxRuntime.Fragment, {
2131
- children: [jsxRuntime.jsx(uiKit.Grid.Item, {
2132
- children: jsxRuntime.jsx(uiKit.Text.Body, {
2133
- intlMessage: messages.csvSettings
2134
- })
2135
- }), jsxRuntime.jsx(uiKit.Grid.Item, {
2136
- children: jsxRuntime.jsx(ExportPreferenceSection, {})
2137
- })]
2154
+ }), jsxRuntime.jsx(uiKit.SelectField, {
2155
+ name: "outputFormat",
2156
+ onChange: handleOutputFormatChange,
2157
+ onBlur: formik.handleBlur,
2158
+ value: _valuesInstanceProperty__default["default"](formik).outputFormat,
2159
+ title: intl.formatMessage(messages.outputFormat),
2160
+ options: OUTPUT_FORMAT_OPTIONS,
2161
+ menuPortalTarget: document.body,
2162
+ menuPortalZIndex: Z_INDEX_DROPDOWN
2138
2163
  })]
2139
2164
  })
2140
- })
2165
+ }), shouldShowPreferences && jsxRuntime.jsxs(jsxRuntime.Fragment, {
2166
+ children: [jsxRuntime.jsx(uiKit.Grid.Item, {
2167
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
2168
+ intlMessage: messages.csvSettings
2169
+ })
2170
+ }), jsxRuntime.jsx(uiKit.Grid.Item, {
2171
+ children: jsxRuntime.jsx(ExportPreferenceSection, {})
2172
+ })]
2173
+ })]
2141
2174
  })
2142
2175
  })
2143
2176
  });
@@ -3358,11 +3391,11 @@ function getDefaultDropWrapperStyles(_dropAreaState) {
3358
3391
  return /*#__PURE__*/react.css(process.env.NODE_ENV === "production" ? "" : ";label:getDefaultDropWrapperStyles;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRyb3AtYXJlYS13cmFwcGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5QlkiLCJmaWxlIjoiZHJvcC1hcmVhLXdyYXBwZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdHlwZSBEcm9wem9uZVJvb3RQcm9wcyB9IGZyb20gJ3JlYWN0LWRyb3B6b25lJ1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IHN0eWxlcyB9IGZyb20gJy4vc3R5bGVzJ1xuaW1wb3J0IHsgdHlwZSBEcm9wQXJlYVN0YXRlIH0gZnJvbSAnLi4vLi4vLi4vQHR5cGVzJ1xuXG5pbnRlcmZhY2UgRHJvcFdyYXBwZXJQcm9wcyBleHRlbmRzIERyb3B6b25lUm9vdFByb3BzIHtcbiAgZHJvcEFyZWFTdGF0ZTogRHJvcEFyZWFTdGF0ZVxufVxuZXhwb3J0IGNvbnN0IERyb3BXcmFwcGVyID0gc3R5bGVkLmRpdjxEcm9wV3JhcHBlclByb3BzPmBcbiAgJHtzdHlsZXMuYmFzZX1cbiAgJHsocHJvcHMpID0+IHtcbiAgICBpZiAocHJvcHMuZHJvcEFyZWFTdGF0ZSA9PT0gJ2RlZmF1bHQnKSB7XG4gICAgICByZXR1cm4gc3R5bGVzLnJlYWR5Rm9yRHJvcFxuICAgIH1cbiAgICBpZiAocHJvcHMuZHJvcEFyZWFTdGF0ZSA9PT0gJ2FjdGl2ZS1kcmFnJykge1xuICAgICAgcmV0dXJuIHN0eWxlcy5hY3RpdmVEcmFnXG4gICAgfVxuICAgIGlmIChwcm9wcy5kcm9wQXJlYVN0YXRlID09PSAnZmlsZS1kcm9wcGVkJykge1xuICAgICAgcmV0dXJuIHN0eWxlcy5maWxlRHJvcHBlZFxuICAgIH1cbiAgICByZXR1cm4gZ2V0RGVmYXVsdERyb3BXcmFwcGVyU3R5bGVzKHByb3BzLmRyb3BBcmVhU3RhdGUpXG4gIH19XG5gXG5mdW5jdGlvbiBnZXREZWZhdWx0RHJvcFdyYXBwZXJTdHlsZXMoX2Ryb3BBcmVhU3RhdGU6IG5ldmVyKSB7XG4gIHJldHVybiBjc3NgYFxufVxuIl19 */");
3359
3392
  }
3360
3393
 
3361
- var ActiveDragDropArea = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./active-drag-drop-area-e3f74c13.cjs.dev.js' /* webpackChunkName: "active-drag-drop-area" */); }));
3394
+ var ActiveDragDropArea = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./active-drag-drop-area-f0ea9b7b.cjs.dev.js' /* webpackChunkName: "active-drag-drop-area" */); }));
3362
3395
 
3363
- var EnabledDropArea = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./enabled-drop-area-b35ddf49.cjs.dev.js' /* webpackChunkName: "enabled-drop-area" */); }));
3396
+ var EnabledDropArea = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./enabled-drop-area-c11b08f9.cjs.dev.js' /* webpackChunkName: "enabled-drop-area" */); }));
3364
3397
 
3365
- var FileDropped = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./file-dropped-area-ff7e0b8e.cjs.dev.js' /* webpackChunkName: "filed-dropped-area" */); }));
3398
+ var FileDropped = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./file-dropped-area-698edef8.cjs.dev.js' /* webpackChunkName: "filed-dropped-area" */); }));
3366
3399
 
3367
3400
  function getDropArea(_ref) {
3368
3401
  let dropAreaState = _ref.dropAreaState,
@@ -15,7 +15,7 @@ import _Object$defineProperties from '@babel/runtime-corejs3/core-js-stable/obje
15
15
  import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object/define-property';
16
16
  import { defineMessages, FormattedMessage, useIntl, IntlProvider } from 'react-intl';
17
17
  import { useApplicationContext } from '@commercetools-frontend/application-shell-connectors';
18
- import { Text, TextInput, Spacings, SelectInput, CheckboxInput, Link, RadioInput, TextField, AngleRightIcon, Grid, designTokens, SelectField, FieldLabel, Constraints, Tooltip, SupportIcon, Stamp, IconButton, AngleDownIcon, CollapsibleMotion, Card, SearchTextInput, TagList, FlatButton, AngleUpIcon, CheckBoldIcon, DataTable } from '@commercetools-frontend/ui-kit';
18
+ import { Text, TextInput, Spacings, SelectField, CheckboxInput, ContentNotification, Link, RadioInput, TextField, AngleRightIcon, Grid, designTokens, FieldLabel, Constraints, Tooltip, SupportIcon, Stamp, IconButton, AngleDownIcon, CollapsibleMotion, Card, SearchTextInput, TagList, FlatButton, AngleUpIcon, CheckBoldIcon, DataTable } from '@commercetools-frontend/ui-kit';
19
19
  import { jsx, jsxs, Fragment } from '@emotion/react/jsx-runtime';
20
20
  import _valuesInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/values';
21
21
  import { FormDialog } from '@commercetools-frontend/application-components';
@@ -615,12 +615,12 @@ var messages = defineMessages({
615
615
  columns: {
616
616
  id: 'ExportResourcesModal.columns',
617
617
  description: 'Label for column separator select',
618
- defaultMessage: 'Columns:'
618
+ defaultMessage: 'Columns'
619
619
  },
620
- decimal: {
621
- id: 'ExportResourcesModal.decimal',
620
+ decimals: {
621
+ id: 'ExportResourcesModal.decimals',
622
622
  description: 'Label for decimal separator select',
623
- defaultMessage: 'Decimals:'
623
+ defaultMessage: 'Decimals'
624
624
  },
625
625
  columnSeparatorComma: {
626
626
  id: 'ExportResourcesModal.columnSeparatorComma',
@@ -656,6 +656,21 @@ var messages = defineMessages({
656
656
  id: 'ExportResourcesModal.csvSettings',
657
657
  description: 'Label for CSV settings section',
658
658
  defaultMessage: 'CSV settings:'
659
+ },
660
+ excelOptimized: {
661
+ id: 'ExportResourcesModal.excelOptimized',
662
+ description: 'Label for Excel-optimized CSV export checkbox',
663
+ defaultMessage: 'CSV file optimized for Excel'
664
+ },
665
+ excelOptimizedDescription: {
666
+ id: 'ExportResourcesModal.excelOptimizedDescription',
667
+ description: 'Description for Excel-optimized CSV export checkbox',
668
+ defaultMessage: 'Checking this option will prevent Excel from interpreting the data of the file.'
669
+ },
670
+ readMoreOnDocumentation: {
671
+ id: 'ExportResourcesModal.readMoreOnDocumentation',
672
+ description: 'Read more on documentation',
673
+ defaultMessage: 'Read more on the {documentationLink}'
659
674
  }
660
675
  });
661
676
 
@@ -764,6 +779,7 @@ const OUTPUT_FORMAT_OPTIONS = [{
764
779
  const EXPORT_DATA_DOCUMENTATION_LINK = 'https://docs.commercetools.com/merchant-center/export-data';
765
780
  const CSV_TEMPLATES_LINK = 'https://docs.commercetools.com/merchant-center/import-data#download-a-template';
766
781
  const CSV_STRUCTURE_DOCUMENTATION_LINK = 'https://docs.commercetools.com/merchant-center/export-data#structure-of-exported-csv-files';
782
+ const EXPORT_EXCEL_DOCUMENTATION_LINK = 'https://docs.commercetools.com/merchant-center/export-data#optimize-csv-file-for-microsoft-excel';
767
783
 
768
784
  const resourceTypeMessages = {
769
785
  [EXPORTABLE_RESOURCES.CATEGORY]: {
@@ -1536,6 +1552,7 @@ const useInitialValues = props => {
1536
1552
  groups: updateFieldGroupWithAdditionalFieldExtensions(groups),
1537
1553
  queryPredicate: '',
1538
1554
  fillRows: false,
1555
+ excelCompatible: false,
1539
1556
  outputFormat: props.outputFormat,
1540
1557
  columnSeparator: DELIMITERS$1.COMMA,
1541
1558
  decimalSeparator: DELIMITERS$1.POINT,
@@ -1622,6 +1639,7 @@ const useStartExportOperation = props => {
1622
1639
  fileFormat: values.outputFormat,
1623
1640
  locales,
1624
1641
  fillRows: isCsv && values.fillRows,
1642
+ excelCompatible: isCsv && values.excelCompatible,
1625
1643
  separator: isCsv ? {
1626
1644
  columns: values.columnSeparator,
1627
1645
  decimal: values.decimalSeparator
@@ -1857,6 +1875,7 @@ const useValidateExportOperation = () => {
1857
1875
  function ownKeys$a(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
1858
1876
  function _objectSpread$a(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys$a(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys$a(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
1859
1877
  const ExportPreferenceSection = () => {
1878
+ const intl = useIntl();
1860
1879
  const _useExportResourcesMo = useExportResourcesModalContext(),
1861
1880
  formik = _useExportResourcesMo.formik;
1862
1881
  const columnSeparatorOptions = _mapInstanceProperty(COLUMN_DELIMITER_OPTIONS).call(COLUMN_DELIMITER_OPTIONS, option => _objectSpread$a(_objectSpread$a({}, option), {}, {
@@ -1866,7 +1885,7 @@ const ExportPreferenceSection = () => {
1866
1885
  label: jsx(FormattedMessage, _objectSpread$a({}, option.label))
1867
1886
  }));
1868
1887
  return jsxs(Spacings.Stack, {
1869
- scale: "m",
1888
+ scale: "xl",
1870
1889
  children: [jsxs(Spacings.Stack, {
1871
1890
  scale: "s",
1872
1891
  children: [jsxs("div", {
@@ -1877,60 +1896,80 @@ const ExportPreferenceSection = () => {
1877
1896
  })]
1878
1897
  }), jsxs(Spacings.Inline, {
1879
1898
  scale: "s",
1880
- children: [jsxs(Spacings.Inline, {
1881
- scale: "xs",
1882
- alignItems: "center",
1883
- children: [jsx(Text.Body, {
1884
- intlMessage: messages.columns
1885
- }), jsx(SelectInput, {
1886
- horizontalConstraint: 4,
1887
- isSearchable: false,
1888
- options: columnSeparatorOptions,
1889
- value: _valuesInstanceProperty(formik).columnSeparator,
1890
- onChange: e => {
1891
- formik.setFieldValue('columnSeparator', e.target.value);
1892
- },
1893
- menuPortalTarget: document.body,
1894
- menuPortalZIndex: Z_INDEX_DROPDOWN
1895
- })]
1896
- }), jsxs(Spacings.Inline, {
1897
- scale: "s",
1898
- alignItems: "center",
1899
- children: [jsx(Text.Body, {
1900
- intlMessage: messages.decimal
1901
- }), jsx(SelectInput, {
1902
- isSearchable: false,
1903
- options: decimalSeparatorOptions,
1904
- value: _valuesInstanceProperty(formik).decimalSeparator,
1905
- onChange: e => {
1906
- formik.setFieldValue('decimalSeparator', e.target.value);
1907
- },
1908
- menuPortalTarget: document.body,
1909
- horizontalConstraint: 4,
1910
- menuPortalZIndex: Z_INDEX_DROPDOWN
1911
- })]
1899
+ children: [jsx(SelectField, {
1900
+ title: intl.formatMessage(messages.columns),
1901
+ isSearchable: false,
1902
+ options: columnSeparatorOptions,
1903
+ value: _valuesInstanceProperty(formik).columnSeparator,
1904
+ onChange: e => {
1905
+ formik.setFieldValue('columnSeparator', e.target.value);
1906
+ },
1907
+ menuPortalTarget: document.body,
1908
+ menuPortalZIndex: Z_INDEX_DROPDOWN
1909
+ }), jsx(SelectField, {
1910
+ title: intl.formatMessage(messages.decimals),
1911
+ isSearchable: false,
1912
+ options: decimalSeparatorOptions,
1913
+ value: _valuesInstanceProperty(formik).decimalSeparator,
1914
+ onChange: e => {
1915
+ formik.setFieldValue('decimalSeparator', e.target.value);
1916
+ },
1917
+ menuPortalTarget: document.body,
1918
+ menuPortalZIndex: Z_INDEX_DROPDOWN
1912
1919
  })]
1913
1920
  })]
1914
- }), jsxs("div", {
1915
- children: [jsx(CheckboxInput, {
1916
- isChecked: _valuesInstanceProperty(formik).fillRows,
1917
- onChange: e => {
1918
- formik.setFieldValue('fillRows', e.target.checked);
1919
- },
1920
- children: jsx(FormattedMessage, _objectSpread$a({}, messages.fillRows))
1921
- }), jsxs(Spacings.Inline, {
1922
- scale: "xl",
1923
- children: [jsx("div", {}), jsx(Text.Caption, {
1924
- intlMessage: _objectSpread$a(_objectSpread$a({}, messages.moreInformation), {}, {
1925
- values: {
1926
- documentationLink: jsx(Link, {
1927
- intlMessage: messages.documentation,
1928
- isExternal: true,
1929
- to: CSV_STRUCTURE_DOCUMENTATION_LINK
1930
- }, "documentation-link")
1931
- }
1921
+ }), jsxs(Spacings.Stack, {
1922
+ scale: "xl",
1923
+ children: [jsxs(Spacings.Stack, {
1924
+ scale: "m",
1925
+ children: [jsx(CheckboxInput, {
1926
+ isChecked: _valuesInstanceProperty(formik).excelCompatible,
1927
+ onChange: e => {
1928
+ formik.setFieldValue('excelCompatible', e.target.checked);
1929
+ },
1930
+ children: jsx(FormattedMessage, _objectSpread$a({}, messages.excelOptimized))
1931
+ }), _valuesInstanceProperty(formik).excelCompatible && jsx(ContentNotification, {
1932
+ type: "info",
1933
+ children: jsx(Spacings.Inset, {
1934
+ scale: "xs",
1935
+ children: jsxs(Spacings.Stack, {
1936
+ children: [jsx("div", {
1937
+ children: jsx(FormattedMessage, _objectSpread$a({}, messages.excelOptimizedDescription))
1938
+ }), jsx("div", {
1939
+ children: jsx(FormattedMessage, _objectSpread$a(_objectSpread$a({}, messages.readMoreOnDocumentation), {}, {
1940
+ values: {
1941
+ documentationLink: jsx(Link, {
1942
+ intlMessage: messages.documentation,
1943
+ isExternal: true,
1944
+ to: EXPORT_EXCEL_DOCUMENTATION_LINK
1945
+ }, "documentation-link")
1946
+ }
1947
+ }))
1948
+ })]
1949
+ })
1932
1950
  })
1933
1951
  })]
1952
+ }), jsxs("div", {
1953
+ children: [jsx(CheckboxInput, {
1954
+ isChecked: _valuesInstanceProperty(formik).fillRows,
1955
+ onChange: e => {
1956
+ formik.setFieldValue('fillRows', e.target.checked);
1957
+ },
1958
+ children: jsx(FormattedMessage, _objectSpread$a({}, messages.fillRows))
1959
+ }), jsxs(Spacings.Inline, {
1960
+ scale: "xl",
1961
+ children: [jsx("div", {}), jsx(Text.Caption, {
1962
+ intlMessage: _objectSpread$a(_objectSpread$a({}, messages.moreInformation), {}, {
1963
+ values: {
1964
+ documentationLink: jsx(Link, {
1965
+ intlMessage: messages.documentation,
1966
+ isExternal: true,
1967
+ to: CSV_STRUCTURE_DOCUMENTATION_LINK
1968
+ }, "documentation-link")
1969
+ }
1970
+ })
1971
+ })]
1972
+ })]
1934
1973
  })]
1935
1974
  })]
1936
1975
  });
@@ -2044,59 +2083,53 @@ const ExportFileSettingsStep = () => {
2044
2083
  onClose: onClose,
2045
2084
  size: 16,
2046
2085
  children: jsx(Masking.Unmask, {
2047
- children: jsx(Spacings.Stack, {
2048
- scale: "xxxl",
2049
- children: jsx(Spacings.Stack, {
2050
- scale: "l",
2051
- children: jsxs(Grid, {
2052
- gridRowGap: designTokens.spacingM,
2053
- gridTemplateColumns: `calc(${designTokens.constraint3} + ${designTokens.spacingL}) auto`,
2054
- children: [jsx(Grid.Item, {
2055
- children: jsx(Text.Body, {
2056
- intlMessage: messages.scope
2057
- })
2058
- }), jsx(Grid.Item, {
2059
- children: jsx(ExportScopeSection, {})
2060
- }), jsx(Grid.Item, {
2061
- children: jsx(Text.Body, {
2062
- intlMessage: messages.saveAs
2063
- })
2064
- }), jsx(Grid.Item, {
2065
- children: jsxs(Spacings.Stack, {
2066
- scale: "s",
2067
- children: [jsx(Masking.Mask, {
2068
- children: jsx(TextField, {
2069
- name: "fileName",
2070
- onChange: formik.handleChange,
2071
- onBlur: formik.handleBlur,
2072
- value: _valuesInstanceProperty(formik).fileName,
2073
- title: intl.formatMessage(messages.fileName),
2074
- touched: formik.touched.fileName,
2075
- errors: mapFormikErrors(formik.errors.fileName),
2076
- renderError: renderFileNameError
2077
- })
2078
- }), jsx(SelectField, {
2079
- name: "outputFormat",
2080
- onChange: handleOutputFormatChange,
2081
- onBlur: formik.handleBlur,
2082
- value: _valuesInstanceProperty(formik).outputFormat,
2083
- title: intl.formatMessage(messages.outputFormat),
2084
- options: OUTPUT_FORMAT_OPTIONS,
2085
- menuPortalTarget: document.body,
2086
- menuPortalZIndex: Z_INDEX_DROPDOWN
2087
- })]
2086
+ children: jsxs(Grid, {
2087
+ gridRowGap: designTokens.spacingXl,
2088
+ gridTemplateColumns: `calc(${designTokens.constraint3} + ${designTokens.spacingL}) auto`,
2089
+ children: [jsx(Grid.Item, {
2090
+ children: jsx(Text.Body, {
2091
+ intlMessage: messages.scope
2092
+ })
2093
+ }), jsx(Grid.Item, {
2094
+ children: jsx(ExportScopeSection, {})
2095
+ }), jsx(Grid.Item, {
2096
+ children: jsx(Text.Body, {
2097
+ intlMessage: messages.saveAs
2098
+ })
2099
+ }), jsx(Grid.Item, {
2100
+ children: jsxs(Spacings.Stack, {
2101
+ scale: "xl",
2102
+ children: [jsx(Masking.Mask, {
2103
+ children: jsx(TextField, {
2104
+ name: "fileName",
2105
+ onChange: formik.handleChange,
2106
+ onBlur: formik.handleBlur,
2107
+ value: _valuesInstanceProperty(formik).fileName,
2108
+ title: intl.formatMessage(messages.fileName),
2109
+ touched: formik.touched.fileName,
2110
+ errors: mapFormikErrors(formik.errors.fileName),
2111
+ renderError: renderFileNameError
2088
2112
  })
2089
- }), shouldShowPreferences && jsxs(Fragment, {
2090
- children: [jsx(Grid.Item, {
2091
- children: jsx(Text.Body, {
2092
- intlMessage: messages.csvSettings
2093
- })
2094
- }), jsx(Grid.Item, {
2095
- children: jsx(ExportPreferenceSection, {})
2096
- })]
2113
+ }), jsx(SelectField, {
2114
+ name: "outputFormat",
2115
+ onChange: handleOutputFormatChange,
2116
+ onBlur: formik.handleBlur,
2117
+ value: _valuesInstanceProperty(formik).outputFormat,
2118
+ title: intl.formatMessage(messages.outputFormat),
2119
+ options: OUTPUT_FORMAT_OPTIONS,
2120
+ menuPortalTarget: document.body,
2121
+ menuPortalZIndex: Z_INDEX_DROPDOWN
2097
2122
  })]
2098
2123
  })
2099
- })
2124
+ }), shouldShowPreferences && jsxs(Fragment, {
2125
+ children: [jsx(Grid.Item, {
2126
+ children: jsx(Text.Body, {
2127
+ intlMessage: messages.csvSettings
2128
+ })
2129
+ }), jsx(Grid.Item, {
2130
+ children: jsx(ExportPreferenceSection, {})
2131
+ })]
2132
+ })]
2100
2133
  })
2101
2134
  })
2102
2135
  });
@@ -3317,11 +3350,11 @@ function getDefaultDropWrapperStyles(_dropAreaState) {
3317
3350
  return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? "" : ";label:getDefaultDropWrapperStyles;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRyb3AtYXJlYS13cmFwcGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5QlkiLCJmaWxlIjoiZHJvcC1hcmVhLXdyYXBwZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdHlwZSBEcm9wem9uZVJvb3RQcm9wcyB9IGZyb20gJ3JlYWN0LWRyb3B6b25lJ1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IHN0eWxlcyB9IGZyb20gJy4vc3R5bGVzJ1xuaW1wb3J0IHsgdHlwZSBEcm9wQXJlYVN0YXRlIH0gZnJvbSAnLi4vLi4vLi4vQHR5cGVzJ1xuXG5pbnRlcmZhY2UgRHJvcFdyYXBwZXJQcm9wcyBleHRlbmRzIERyb3B6b25lUm9vdFByb3BzIHtcbiAgZHJvcEFyZWFTdGF0ZTogRHJvcEFyZWFTdGF0ZVxufVxuZXhwb3J0IGNvbnN0IERyb3BXcmFwcGVyID0gc3R5bGVkLmRpdjxEcm9wV3JhcHBlclByb3BzPmBcbiAgJHtzdHlsZXMuYmFzZX1cbiAgJHsocHJvcHMpID0+IHtcbiAgICBpZiAocHJvcHMuZHJvcEFyZWFTdGF0ZSA9PT0gJ2RlZmF1bHQnKSB7XG4gICAgICByZXR1cm4gc3R5bGVzLnJlYWR5Rm9yRHJvcFxuICAgIH1cbiAgICBpZiAocHJvcHMuZHJvcEFyZWFTdGF0ZSA9PT0gJ2FjdGl2ZS1kcmFnJykge1xuICAgICAgcmV0dXJuIHN0eWxlcy5hY3RpdmVEcmFnXG4gICAgfVxuICAgIGlmIChwcm9wcy5kcm9wQXJlYVN0YXRlID09PSAnZmlsZS1kcm9wcGVkJykge1xuICAgICAgcmV0dXJuIHN0eWxlcy5maWxlRHJvcHBlZFxuICAgIH1cbiAgICByZXR1cm4gZ2V0RGVmYXVsdERyb3BXcmFwcGVyU3R5bGVzKHByb3BzLmRyb3BBcmVhU3RhdGUpXG4gIH19XG5gXG5mdW5jdGlvbiBnZXREZWZhdWx0RHJvcFdyYXBwZXJTdHlsZXMoX2Ryb3BBcmVhU3RhdGU6IG5ldmVyKSB7XG4gIHJldHVybiBjc3NgYFxufVxuIl19 */");
3318
3351
  }
3319
3352
 
3320
- var ActiveDragDropArea = /*#__PURE__*/lazy(() => import('./active-drag-drop-area-fb905a01.esm.js' /* webpackChunkName: "active-drag-drop-area" */));
3353
+ var ActiveDragDropArea = /*#__PURE__*/lazy(() => import('./active-drag-drop-area-98149234.esm.js' /* webpackChunkName: "active-drag-drop-area" */));
3321
3354
 
3322
- var EnabledDropArea = /*#__PURE__*/lazy(() => import('./enabled-drop-area-5d5a61c8.esm.js' /* webpackChunkName: "enabled-drop-area" */));
3355
+ var EnabledDropArea = /*#__PURE__*/lazy(() => import('./enabled-drop-area-64110e94.esm.js' /* webpackChunkName: "enabled-drop-area" */));
3323
3356
 
3324
- var FileDropped = /*#__PURE__*/lazy(() => import('./file-dropped-area-aad1bd09.esm.js' /* webpackChunkName: "filed-dropped-area" */));
3357
+ var FileDropped = /*#__PURE__*/lazy(() => import('./file-dropped-area-c0cb76ab.esm.js' /* webpackChunkName: "filed-dropped-area" */));
3325
3358
 
3326
3359
  function getDropArea(_ref) {
3327
3360
  let dropAreaState = _ref.dropAreaState,
@@ -656,12 +656,12 @@ var messages = reactIntl.defineMessages({
656
656
  columns: {
657
657
  id: 'ExportResourcesModal.columns',
658
658
  description: 'Label for column separator select',
659
- defaultMessage: 'Columns:'
659
+ defaultMessage: 'Columns'
660
660
  },
661
- decimal: {
662
- id: 'ExportResourcesModal.decimal',
661
+ decimals: {
662
+ id: 'ExportResourcesModal.decimals',
663
663
  description: 'Label for decimal separator select',
664
- defaultMessage: 'Decimals:'
664
+ defaultMessage: 'Decimals'
665
665
  },
666
666
  columnSeparatorComma: {
667
667
  id: 'ExportResourcesModal.columnSeparatorComma',
@@ -697,6 +697,21 @@ var messages = reactIntl.defineMessages({
697
697
  id: 'ExportResourcesModal.csvSettings',
698
698
  description: 'Label for CSV settings section',
699
699
  defaultMessage: 'CSV settings:'
700
+ },
701
+ excelOptimized: {
702
+ id: 'ExportResourcesModal.excelOptimized',
703
+ description: 'Label for Excel-optimized CSV export checkbox',
704
+ defaultMessage: 'CSV file optimized for Excel'
705
+ },
706
+ excelOptimizedDescription: {
707
+ id: 'ExportResourcesModal.excelOptimizedDescription',
708
+ description: 'Description for Excel-optimized CSV export checkbox',
709
+ defaultMessage: 'Checking this option will prevent Excel from interpreting the data of the file.'
710
+ },
711
+ readMoreOnDocumentation: {
712
+ id: 'ExportResourcesModal.readMoreOnDocumentation',
713
+ description: 'Read more on documentation',
714
+ defaultMessage: 'Read more on the {documentationLink}'
700
715
  }
701
716
  });
702
717
 
@@ -805,6 +820,7 @@ const OUTPUT_FORMAT_OPTIONS = [{
805
820
  const EXPORT_DATA_DOCUMENTATION_LINK = 'https://docs.commercetools.com/merchant-center/export-data';
806
821
  const CSV_TEMPLATES_LINK = 'https://docs.commercetools.com/merchant-center/import-data#download-a-template';
807
822
  const CSV_STRUCTURE_DOCUMENTATION_LINK = 'https://docs.commercetools.com/merchant-center/export-data#structure-of-exported-csv-files';
823
+ const EXPORT_EXCEL_DOCUMENTATION_LINK = 'https://docs.commercetools.com/merchant-center/export-data#optimize-csv-file-for-microsoft-excel';
808
824
 
809
825
  const resourceTypeMessages = {
810
826
  [EXPORTABLE_RESOURCES.CATEGORY]: {
@@ -1577,6 +1593,7 @@ const useInitialValues = props => {
1577
1593
  groups: updateFieldGroupWithAdditionalFieldExtensions(groups),
1578
1594
  queryPredicate: '',
1579
1595
  fillRows: false,
1596
+ excelCompatible: false,
1580
1597
  outputFormat: props.outputFormat,
1581
1598
  columnSeparator: DELIMITERS$1.COMMA,
1582
1599
  decimalSeparator: DELIMITERS$1.POINT,
@@ -1663,6 +1680,7 @@ const useStartExportOperation = props => {
1663
1680
  fileFormat: values.outputFormat,
1664
1681
  locales,
1665
1682
  fillRows: isCsv && values.fillRows,
1683
+ excelCompatible: isCsv && values.excelCompatible,
1666
1684
  separator: isCsv ? {
1667
1685
  columns: values.columnSeparator,
1668
1686
  decimal: values.decimalSeparator
@@ -1898,6 +1916,7 @@ const useValidateExportOperation = () => {
1898
1916
  function ownKeys$a(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; }
1899
1917
  function _objectSpread$a(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$a(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$a(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1900
1918
  const ExportPreferenceSection = () => {
1919
+ const intl = reactIntl.useIntl();
1901
1920
  const _useExportResourcesMo = useExportResourcesModalContext(),
1902
1921
  formik = _useExportResourcesMo.formik;
1903
1922
  const columnSeparatorOptions = _mapInstanceProperty__default["default"](COLUMN_DELIMITER_OPTIONS).call(COLUMN_DELIMITER_OPTIONS, option => _objectSpread$a(_objectSpread$a({}, option), {}, {
@@ -1907,7 +1926,7 @@ const ExportPreferenceSection = () => {
1907
1926
  label: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$a({}, option.label))
1908
1927
  }));
1909
1928
  return jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1910
- scale: "m",
1929
+ scale: "xl",
1911
1930
  children: [jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1912
1931
  scale: "s",
1913
1932
  children: [jsxRuntime.jsxs("div", {
@@ -1918,60 +1937,80 @@ const ExportPreferenceSection = () => {
1918
1937
  })]
1919
1938
  }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1920
1939
  scale: "s",
1921
- children: [jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1922
- scale: "xs",
1923
- alignItems: "center",
1924
- children: [jsxRuntime.jsx(uiKit.Text.Body, {
1925
- intlMessage: messages.columns
1926
- }), jsxRuntime.jsx(uiKit.SelectInput, {
1927
- horizontalConstraint: 4,
1928
- isSearchable: false,
1929
- options: columnSeparatorOptions,
1930
- value: _valuesInstanceProperty__default["default"](formik).columnSeparator,
1931
- onChange: e => {
1932
- formik.setFieldValue('columnSeparator', e.target.value);
1933
- },
1934
- menuPortalTarget: document.body,
1935
- menuPortalZIndex: Z_INDEX_DROPDOWN
1936
- })]
1937
- }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1938
- scale: "s",
1939
- alignItems: "center",
1940
- children: [jsxRuntime.jsx(uiKit.Text.Body, {
1941
- intlMessage: messages.decimal
1942
- }), jsxRuntime.jsx(uiKit.SelectInput, {
1943
- isSearchable: false,
1944
- options: decimalSeparatorOptions,
1945
- value: _valuesInstanceProperty__default["default"](formik).decimalSeparator,
1946
- onChange: e => {
1947
- formik.setFieldValue('decimalSeparator', e.target.value);
1948
- },
1949
- menuPortalTarget: document.body,
1950
- horizontalConstraint: 4,
1951
- menuPortalZIndex: Z_INDEX_DROPDOWN
1952
- })]
1940
+ children: [jsxRuntime.jsx(uiKit.SelectField, {
1941
+ title: intl.formatMessage(messages.columns),
1942
+ isSearchable: false,
1943
+ options: columnSeparatorOptions,
1944
+ value: _valuesInstanceProperty__default["default"](formik).columnSeparator,
1945
+ onChange: e => {
1946
+ formik.setFieldValue('columnSeparator', e.target.value);
1947
+ },
1948
+ menuPortalTarget: document.body,
1949
+ menuPortalZIndex: Z_INDEX_DROPDOWN
1950
+ }), jsxRuntime.jsx(uiKit.SelectField, {
1951
+ title: intl.formatMessage(messages.decimals),
1952
+ isSearchable: false,
1953
+ options: decimalSeparatorOptions,
1954
+ value: _valuesInstanceProperty__default["default"](formik).decimalSeparator,
1955
+ onChange: e => {
1956
+ formik.setFieldValue('decimalSeparator', e.target.value);
1957
+ },
1958
+ menuPortalTarget: document.body,
1959
+ menuPortalZIndex: Z_INDEX_DROPDOWN
1953
1960
  })]
1954
1961
  })]
1955
- }), jsxRuntime.jsxs("div", {
1956
- children: [jsxRuntime.jsx(uiKit.CheckboxInput, {
1957
- isChecked: _valuesInstanceProperty__default["default"](formik).fillRows,
1958
- onChange: e => {
1959
- formik.setFieldValue('fillRows', e.target.checked);
1960
- },
1961
- children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$a({}, messages.fillRows))
1962
- }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1963
- scale: "xl",
1964
- children: [jsxRuntime.jsx("div", {}), jsxRuntime.jsx(uiKit.Text.Caption, {
1965
- intlMessage: _objectSpread$a(_objectSpread$a({}, messages.moreInformation), {}, {
1966
- values: {
1967
- documentationLink: jsxRuntime.jsx(uiKit.Link, {
1968
- intlMessage: messages.documentation,
1969
- isExternal: true,
1970
- to: CSV_STRUCTURE_DOCUMENTATION_LINK
1971
- }, "documentation-link")
1972
- }
1962
+ }), jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1963
+ scale: "xl",
1964
+ children: [jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1965
+ scale: "m",
1966
+ children: [jsxRuntime.jsx(uiKit.CheckboxInput, {
1967
+ isChecked: _valuesInstanceProperty__default["default"](formik).excelCompatible,
1968
+ onChange: e => {
1969
+ formik.setFieldValue('excelCompatible', e.target.checked);
1970
+ },
1971
+ children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$a({}, messages.excelOptimized))
1972
+ }), _valuesInstanceProperty__default["default"](formik).excelCompatible && jsxRuntime.jsx(uiKit.ContentNotification, {
1973
+ type: "info",
1974
+ children: jsxRuntime.jsx(uiKit.Spacings.Inset, {
1975
+ scale: "xs",
1976
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1977
+ children: [jsxRuntime.jsx("div", {
1978
+ children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$a({}, messages.excelOptimizedDescription))
1979
+ }), jsxRuntime.jsx("div", {
1980
+ children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$a(_objectSpread$a({}, messages.readMoreOnDocumentation), {}, {
1981
+ values: {
1982
+ documentationLink: jsxRuntime.jsx(uiKit.Link, {
1983
+ intlMessage: messages.documentation,
1984
+ isExternal: true,
1985
+ to: EXPORT_EXCEL_DOCUMENTATION_LINK
1986
+ }, "documentation-link")
1987
+ }
1988
+ }))
1989
+ })]
1990
+ })
1973
1991
  })
1974
1992
  })]
1993
+ }), jsxRuntime.jsxs("div", {
1994
+ children: [jsxRuntime.jsx(uiKit.CheckboxInput, {
1995
+ isChecked: _valuesInstanceProperty__default["default"](formik).fillRows,
1996
+ onChange: e => {
1997
+ formik.setFieldValue('fillRows', e.target.checked);
1998
+ },
1999
+ children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$a({}, messages.fillRows))
2000
+ }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
2001
+ scale: "xl",
2002
+ children: [jsxRuntime.jsx("div", {}), jsxRuntime.jsx(uiKit.Text.Caption, {
2003
+ intlMessage: _objectSpread$a(_objectSpread$a({}, messages.moreInformation), {}, {
2004
+ values: {
2005
+ documentationLink: jsxRuntime.jsx(uiKit.Link, {
2006
+ intlMessage: messages.documentation,
2007
+ isExternal: true,
2008
+ to: CSV_STRUCTURE_DOCUMENTATION_LINK
2009
+ }, "documentation-link")
2010
+ }
2011
+ })
2012
+ })]
2013
+ })]
1975
2014
  })]
1976
2015
  })]
1977
2016
  });
@@ -2085,59 +2124,53 @@ const ExportFileSettingsStep = () => {
2085
2124
  onClose: onClose,
2086
2125
  size: 16,
2087
2126
  children: jsxRuntime.jsx(fullstory.Masking.Unmask, {
2088
- children: jsxRuntime.jsx(uiKit.Spacings.Stack, {
2089
- scale: "xxxl",
2090
- children: jsxRuntime.jsx(uiKit.Spacings.Stack, {
2091
- scale: "l",
2092
- children: jsxRuntime.jsxs(uiKit.Grid, {
2093
- gridRowGap: uiKit.designTokens.spacingM,
2094
- gridTemplateColumns: `calc(${uiKit.designTokens.constraint3} + ${uiKit.designTokens.spacingL}) auto`,
2095
- children: [jsxRuntime.jsx(uiKit.Grid.Item, {
2096
- children: jsxRuntime.jsx(uiKit.Text.Body, {
2097
- intlMessage: messages.scope
2098
- })
2099
- }), jsxRuntime.jsx(uiKit.Grid.Item, {
2100
- children: jsxRuntime.jsx(ExportScopeSection, {})
2101
- }), jsxRuntime.jsx(uiKit.Grid.Item, {
2102
- children: jsxRuntime.jsx(uiKit.Text.Body, {
2103
- intlMessage: messages.saveAs
2104
- })
2105
- }), jsxRuntime.jsx(uiKit.Grid.Item, {
2106
- children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
2107
- scale: "s",
2108
- children: [jsxRuntime.jsx(fullstory.Masking.Mask, {
2109
- children: jsxRuntime.jsx(uiKit.TextField, {
2110
- name: "fileName",
2111
- onChange: formik.handleChange,
2112
- onBlur: formik.handleBlur,
2113
- value: _valuesInstanceProperty__default["default"](formik).fileName,
2114
- title: intl.formatMessage(messages.fileName),
2115
- touched: formik.touched.fileName,
2116
- errors: mapFormikErrors(formik.errors.fileName),
2117
- renderError: renderFileNameError
2118
- })
2119
- }), jsxRuntime.jsx(uiKit.SelectField, {
2120
- name: "outputFormat",
2121
- onChange: handleOutputFormatChange,
2122
- onBlur: formik.handleBlur,
2123
- value: _valuesInstanceProperty__default["default"](formik).outputFormat,
2124
- title: intl.formatMessage(messages.outputFormat),
2125
- options: OUTPUT_FORMAT_OPTIONS,
2126
- menuPortalTarget: document.body,
2127
- menuPortalZIndex: Z_INDEX_DROPDOWN
2128
- })]
2127
+ children: jsxRuntime.jsxs(uiKit.Grid, {
2128
+ gridRowGap: uiKit.designTokens.spacingXl,
2129
+ gridTemplateColumns: `calc(${uiKit.designTokens.constraint3} + ${uiKit.designTokens.spacingL}) auto`,
2130
+ children: [jsxRuntime.jsx(uiKit.Grid.Item, {
2131
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
2132
+ intlMessage: messages.scope
2133
+ })
2134
+ }), jsxRuntime.jsx(uiKit.Grid.Item, {
2135
+ children: jsxRuntime.jsx(ExportScopeSection, {})
2136
+ }), jsxRuntime.jsx(uiKit.Grid.Item, {
2137
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
2138
+ intlMessage: messages.saveAs
2139
+ })
2140
+ }), jsxRuntime.jsx(uiKit.Grid.Item, {
2141
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
2142
+ scale: "xl",
2143
+ children: [jsxRuntime.jsx(fullstory.Masking.Mask, {
2144
+ children: jsxRuntime.jsx(uiKit.TextField, {
2145
+ name: "fileName",
2146
+ onChange: formik.handleChange,
2147
+ onBlur: formik.handleBlur,
2148
+ value: _valuesInstanceProperty__default["default"](formik).fileName,
2149
+ title: intl.formatMessage(messages.fileName),
2150
+ touched: formik.touched.fileName,
2151
+ errors: mapFormikErrors(formik.errors.fileName),
2152
+ renderError: renderFileNameError
2129
2153
  })
2130
- }), shouldShowPreferences && jsxRuntime.jsxs(jsxRuntime.Fragment, {
2131
- children: [jsxRuntime.jsx(uiKit.Grid.Item, {
2132
- children: jsxRuntime.jsx(uiKit.Text.Body, {
2133
- intlMessage: messages.csvSettings
2134
- })
2135
- }), jsxRuntime.jsx(uiKit.Grid.Item, {
2136
- children: jsxRuntime.jsx(ExportPreferenceSection, {})
2137
- })]
2154
+ }), jsxRuntime.jsx(uiKit.SelectField, {
2155
+ name: "outputFormat",
2156
+ onChange: handleOutputFormatChange,
2157
+ onBlur: formik.handleBlur,
2158
+ value: _valuesInstanceProperty__default["default"](formik).outputFormat,
2159
+ title: intl.formatMessage(messages.outputFormat),
2160
+ options: OUTPUT_FORMAT_OPTIONS,
2161
+ menuPortalTarget: document.body,
2162
+ menuPortalZIndex: Z_INDEX_DROPDOWN
2138
2163
  })]
2139
2164
  })
2140
- })
2165
+ }), shouldShowPreferences && jsxRuntime.jsxs(jsxRuntime.Fragment, {
2166
+ children: [jsxRuntime.jsx(uiKit.Grid.Item, {
2167
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
2168
+ intlMessage: messages.csvSettings
2169
+ })
2170
+ }), jsxRuntime.jsx(uiKit.Grid.Item, {
2171
+ children: jsxRuntime.jsx(ExportPreferenceSection, {})
2172
+ })]
2173
+ })]
2141
2174
  })
2142
2175
  })
2143
2176
  });
@@ -3322,11 +3355,11 @@ function getDefaultDropWrapperStyles(_dropAreaState) {
3322
3355
  return /*#__PURE__*/react.css("" , "" );
3323
3356
  }
3324
3357
 
3325
- var ActiveDragDropArea = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./active-drag-drop-area-e9bf7129.cjs.prod.js' /* webpackChunkName: "active-drag-drop-area" */); }));
3358
+ var ActiveDragDropArea = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./active-drag-drop-area-fb42a613.cjs.prod.js' /* webpackChunkName: "active-drag-drop-area" */); }));
3326
3359
 
3327
- var EnabledDropArea = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./enabled-drop-area-3161efde.cjs.prod.js' /* webpackChunkName: "enabled-drop-area" */); }));
3360
+ var EnabledDropArea = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./enabled-drop-area-26c2b035.cjs.prod.js' /* webpackChunkName: "enabled-drop-area" */); }));
3328
3361
 
3329
- var FileDropped = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./file-dropped-area-85fb3d1d.cjs.prod.js' /* webpackChunkName: "filed-dropped-area" */); }));
3362
+ var FileDropped = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./file-dropped-area-55af62d7.cjs.prod.js' /* webpackChunkName: "filed-dropped-area" */); }));
3330
3363
 
3331
3364
  function getDropArea(_ref) {
3332
3365
  let dropAreaState = _ref.dropAreaState,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@commercetools-frontend-extensions/export-resources-modal",
3
3
  "description": "Shared export modal for exporting resources",
4
- "version": "0.0.0-canary-20250528102549",
4
+ "version": "0.0.0-canary-20250617132829",
5
5
  "license": "BSD-3-Clause",
6
6
  "publishConfig": {
7
7
  "access": "public"
@@ -15,8 +15,8 @@
15
15
  "README.md"
16
16
  ],
17
17
  "dependencies": {
18
- "@babel/runtime": "7.27.1",
19
- "@babel/runtime-corejs3": "7.27.1",
18
+ "@babel/runtime": "7.27.4",
19
+ "@babel/runtime-corejs3": "7.27.4",
20
20
  "@emotion/react": "11.14.0",
21
21
  "@emotion/styled": "11.14.0",
22
22
  "@formatjs/cli": "6.7.1",
@@ -29,20 +29,20 @@
29
29
  "react-dropzone": "14.3.8"
30
30
  },
31
31
  "devDependencies": {
32
- "@commercetools-frontend/actions-global": "fec-156-react19",
33
- "@commercetools-frontend/application-components": "fec-156-react19",
34
- "@commercetools-frontend/application-shell": "fec-156-react19",
35
- "@commercetools-frontend/application-shell-connectors": "fec-156-react19",
36
- "@commercetools-frontend/constants": "fec-156-react19",
37
- "@commercetools-frontend/fullstory": "react-19-migration",
38
- "@commercetools-frontend/i18n": "fec-156-react19",
39
- "@commercetools-frontend/jest-preset-mc-app": "fec-156-react19",
40
- "@commercetools-frontend/l10n": "fec-156-react19",
41
- "@commercetools-frontend/sdk": "fec-156-react19",
42
- "@commercetools-frontend/sentry": "fec-156-react19",
43
- "@commercetools-frontend/ui-kit": "fec-155-react-19",
44
- "@commercetools-uikit/design-system": "fec-155-react-19",
45
- "@commercetools-uikit/icons": "fec-155-react-19",
32
+ "@commercetools-frontend/actions-global": "24.2.0",
33
+ "@commercetools-frontend/application-components": "24.2.0",
34
+ "@commercetools-frontend/application-shell": "24.2.0",
35
+ "@commercetools-frontend/application-shell-connectors": "24.2.0",
36
+ "@commercetools-frontend/constants": "24.2.0",
37
+ "@commercetools-frontend/fullstory": "4.0.0",
38
+ "@commercetools-frontend/i18n": "24.2.0",
39
+ "@commercetools-frontend/jest-preset-mc-app": "24.2.0",
40
+ "@commercetools-frontend/l10n": "24.2.0",
41
+ "@commercetools-frontend/sdk": "24.2.0",
42
+ "@commercetools-frontend/sentry": "24.2.0",
43
+ "@commercetools-frontend/ui-kit": "20.0.0",
44
+ "@commercetools-uikit/design-system": "20.0.0",
45
+ "@commercetools-uikit/icons": "20.0.0",
46
46
  "@preconstruct/cli": "2.8.12",
47
47
  "@types/jest": "29.5.14",
48
48
  "@types/testing-library__jest-dom": "^5.14.5",
@@ -54,20 +54,20 @@
54
54
  "rimraf": "6.0.1"
55
55
  },
56
56
  "peerDependencies": {
57
- "@commercetools-frontend/actions-global": "23.x || 24.x || fec-156-react19",
58
- "@commercetools-frontend/application-components": "23.x || 24.x || fec-156-react19",
59
- "@commercetools-frontend/application-shell": "23.x || 24.x || fec-156-react19",
60
- "@commercetools-frontend/application-shell-connectors": "23.x || 24.x || fec-156-react19",
61
- "@commercetools-frontend/constants": "23.x || 24.x || fec-156-react19",
62
- "@commercetools-frontend/fullstory": "2.x || 3.x || 4.x || react-19-migration",
63
- "@commercetools-frontend/i18n": "23.x || 24.x || fec-156-react19",
64
- "@commercetools-frontend/jest-preset-mc-app": "23.x || 24.x || fec-156-react19",
65
- "@commercetools-frontend/l10n": "23.x || 24.x || fec-156-react19",
66
- "@commercetools-frontend/sdk": "23.x || 24.x || fec-156-react19",
67
- "@commercetools-frontend/sentry": "23.x || 24.x || fec-156-react19",
68
- "@commercetools-frontend/ui-kit": "19.x || 20.x || fec-155-react-19",
69
- "@commercetools-uikit/design-system": "19.x || 20.x || fec-155-react-19",
70
- "@commercetools-uikit/icons": "19.x || 20.x || fec-155-react-19",
57
+ "@commercetools-frontend/actions-global": "23.x || 24.x",
58
+ "@commercetools-frontend/application-components": "23.x || 24.x",
59
+ "@commercetools-frontend/application-shell": "23.x || 24.x",
60
+ "@commercetools-frontend/application-shell-connectors": "23.x || 24.x",
61
+ "@commercetools-frontend/constants": "23.x || 24.x",
62
+ "@commercetools-frontend/fullstory": "2.x || 3.x || 4.x",
63
+ "@commercetools-frontend/i18n": "23.x || 24.x",
64
+ "@commercetools-frontend/jest-preset-mc-app": "23.x || 24.x",
65
+ "@commercetools-frontend/l10n": "23.x || 24.x",
66
+ "@commercetools-frontend/sdk": "23.x || 24.x",
67
+ "@commercetools-frontend/sentry": "23.x || 24.x",
68
+ "@commercetools-frontend/ui-kit": "19.x || 20.x",
69
+ "@commercetools-uikit/design-system": "19.x || 20.x",
70
+ "@commercetools-uikit/icons": "19.x || 20.x",
71
71
  "react": "17.x || 19.x",
72
72
  "react-intl": "6.x || 7.x",
73
73
  "react-redux": "7.x",