@dhis2-ui/file-input 9.10.3 → 9.11.1-beta.1

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 (82) hide show
  1. package/build/cjs/file-input/__tests__/file-input.test.js +1 -9
  2. package/build/cjs/file-input/features/accepts_multiple_files/index.js +1 -2
  3. package/build/cjs/file-input/features/can_be_blurred/index.js +1 -2
  4. package/build/cjs/file-input/features/can_be_changed/index.js +1 -2
  5. package/build/cjs/file-input/features/can_be_focused/index.js +1 -2
  6. package/build/cjs/file-input/features/common/index.js +0 -1
  7. package/build/cjs/file-input/file-input.e2e.stories.js +49 -0
  8. package/build/cjs/file-input/file-input.js +13 -44
  9. package/build/cjs/file-input/{file-input.stories.js → file-input.prod.stories.js} +29 -36
  10. package/build/cjs/file-input/index.js +0 -1
  11. package/build/cjs/file-input-field/__tests__/file-input-field.test.js +1 -9
  12. package/build/cjs/file-input-field/features/can_be_required/index.js +0 -1
  13. package/build/cjs/file-input-field/features/has_default_button_label/index.js +0 -1
  14. package/build/cjs/file-input-field/features/has_default_placeholder/index.js +0 -1
  15. package/build/cjs/file-input-field/file-input-field.e2e.stories.js +24 -0
  16. package/build/cjs/file-input-field/file-input-field.js +8 -36
  17. package/build/cjs/file-input-field/{file-input-field.stories.js → file-input-field.prod.stories.js} +33 -51
  18. package/build/cjs/file-input-field/index.js +0 -1
  19. package/build/cjs/file-input-field-with-list/__tests__/file-input-field-with-list.test.js +1 -9
  20. package/build/cjs/file-input-field-with-list/features/common/index.js +0 -1
  21. package/build/cjs/file-input-field-with-list/features/deduplicates_the_file_list/index.js +0 -1
  22. package/build/cjs/file-input-field-with-list/features/disables_button_when_full/index.js +0 -1
  23. package/build/cjs/file-input-field-with-list/features/displays_files_in_a_list/index.js +0 -1
  24. package/build/cjs/file-input-field-with-list/features/files_can_be_removed/index.js +0 -1
  25. package/build/cjs/file-input-field-with-list/features/has_default_button_label/index.js +0 -1
  26. package/build/cjs/file-input-field-with-list/features/has_default_placeholder/index.js +0 -1
  27. package/build/cjs/file-input-field-with-list/features/has_default_remove_text/index.js +0 -1
  28. package/build/cjs/file-input-field-with-list/file-input-field-with-list.e2e.stories.js +63 -0
  29. package/build/cjs/file-input-field-with-list/file-input-field-with-list.js +9 -47
  30. package/build/cjs/file-input-field-with-list/{file-input-field-with-list.stories.js → file-input-field-with-list.prod.stories.js} +24 -27
  31. package/build/cjs/file-input-field-with-list/file-list-item-with-remove.js +7 -17
  32. package/build/cjs/file-input-field-with-list/index.js +0 -1
  33. package/build/cjs/file-list/features/accepts_cancel_text/index.js +1 -2
  34. package/build/cjs/file-list/features/accepts_label/index.js +0 -1
  35. package/build/cjs/file-list/features/accepts_remove_text/index.js +1 -2
  36. package/build/cjs/file-list/features/can_be_removed/index.js +1 -2
  37. package/build/cjs/file-list/features/file-list-item-accepts_children/index.js +0 -1
  38. package/build/cjs/file-list/features/file-list-placeholder-accepts_children/index.js +0 -1
  39. package/build/cjs/file-list/features/loading_can_be_cancelled/index.js +1 -2
  40. package/build/cjs/file-list/file-list-item.e2e.stories.js +49 -0
  41. package/build/cjs/file-list/file-list-item.js +5 -18
  42. package/build/cjs/file-list/file-list-placeholder.e2e.stories.js +14 -0
  43. package/build/cjs/file-list/file-list-placeholder.js +2 -9
  44. package/build/cjs/file-list/file-list.e2e.stories.js +14 -0
  45. package/build/cjs/file-list/file-list.js +1 -7
  46. package/build/cjs/file-list/index.js +0 -3
  47. package/build/cjs/index.js +0 -4
  48. package/build/cjs/locales/index.js +3 -73
  49. package/build/es/file-input/features/accepts_multiple_files/index.js +1 -1
  50. package/build/es/file-input/features/can_be_blurred/index.js +1 -1
  51. package/build/es/file-input/features/can_be_changed/index.js +1 -1
  52. package/build/es/file-input/features/can_be_focused/index.js +1 -1
  53. package/build/es/file-input/{file-input.stories.e2e.js → file-input.e2e.stories.js} +14 -9
  54. package/build/es/file-input/file-input.js +10 -31
  55. package/build/es/file-input/{file-input.stories.js → file-input.prod.stories.js} +23 -15
  56. package/build/es/file-input-field/file-input-field.e2e.stories.js +15 -0
  57. package/build/es/file-input-field/file-input-field.js +5 -23
  58. package/build/es/file-input-field/{file-input-field.stories.js → file-input-field.prod.stories.js} +21 -15
  59. package/build/es/file-input-field-with-list/{file-input-field-with-list.stories.e2e.js → file-input-field-with-list.e2e.stories.js} +15 -10
  60. package/build/es/file-input-field-with-list/file-input-field-with-list.js +8 -35
  61. package/build/es/file-input-field-with-list/{file-input-field-with-list.stories.js → file-input-field-with-list.prod.stories.js} +19 -11
  62. package/build/es/file-input-field-with-list/file-list-item-with-remove.js +4 -8
  63. package/build/es/file-list/features/accepts_cancel_text/index.js +1 -1
  64. package/build/es/file-list/features/accepts_remove_text/index.js +1 -1
  65. package/build/es/file-list/features/can_be_removed/index.js +1 -1
  66. package/build/es/file-list/features/loading_can_be_cancelled/index.js +1 -1
  67. package/build/es/file-list/{file-list-item.stories.e2e.js → file-list-item.e2e.stories.js} +13 -7
  68. package/build/es/file-list/file-list-item.js +4 -9
  69. package/build/es/file-list/file-list-placeholder.e2e.stories.js +6 -0
  70. package/build/es/file-list/file-list-placeholder.js +1 -3
  71. package/build/es/file-list/file-list.e2e.stories.js +6 -0
  72. package/build/es/file-list/file-list.js +0 -2
  73. package/package.json +11 -11
  74. package/build/cjs/file-input/file-input.stories.e2e.js +0 -40
  75. package/build/cjs/file-input-field/file-input-field.stories.e2e.js +0 -19
  76. package/build/cjs/file-input-field-with-list/file-input-field-with-list.stories.e2e.js +0 -53
  77. package/build/cjs/file-list/file-list-item.stories.e2e.js +0 -38
  78. package/build/cjs/file-list/file-list-placeholder.stories.e2e.js +0 -11
  79. package/build/cjs/file-list/file-list.stories.e2e.js +0 -11
  80. package/build/es/file-input-field/file-input-field.stories.e2e.js +0 -12
  81. package/build/es/file-list/file-list-placeholder.stories.e2e.js +0 -4
  82. package/build/es/file-list/file-list.stories.e2e.js +0 -4
@@ -4,28 +4,23 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = exports.WithLabel = exports.Statuses = exports.Sizes = exports.Required = exports.PlaceholderText = exports.Multiple = exports.HelpText = exports.FileList = exports.Disabled = exports.DesignSystemStackingOrderEmptyFileList = exports.DesignSystemStackingOrder = exports.DefaultButtonLabelAndPlaceholder = exports.Default = void 0;
7
-
8
7
  var _uiConstants = require("@dhis2/ui-constants");
9
-
10
8
  var _react = _interopRequireDefault(require("react"));
11
-
12
9
  var _index = require("../index.js");
13
-
14
10
  var _fileInputField = require("./file-input-field.js");
15
-
16
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
-
18
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
19
-
20
- const description = "\nThe `FileInputField` component wraps the `FileInput` component in a `Field` wrapper to add labels, help text, and validation text.\n\n```js\nimport { FileInputField, FileListItem } from '@dhis2/ui'\n```\n";
21
-
11
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
12
+ function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
13
+ const description = `
14
+ The \`FileInputField\` component wraps the \`FileInput\` component in a \`Field\` wrapper to add labels, help text, and validation text.
15
+
16
+ \`\`\`js
17
+ import { FileInputField, FileListItem } from '@dhis2/ui'
18
+ \`\`\`
19
+ `;
22
20
  const onChange = obj => console.log('onChange', obj);
23
-
24
21
  const onRemove = () => console.log('onRemove');
25
-
26
22
  const onCancel = () => console.log('onCancel');
27
-
28
- var _default = {
23
+ var _default = exports.default = {
29
24
  title: 'File Input Field',
30
25
  component: _fileInputField.FileInputField,
31
26
  parameters: {
@@ -36,54 +31,51 @@ var _default = {
36
31
  }
37
32
  },
38
33
  // Default args:
39
- args: { // Handle default values (see comment in Transfer.js)
34
+ args: {
35
+ // Handle default values (see comment in Transfer.js)
40
36
  ..._fileInputField.FileInputField.defaultProps,
41
37
  onChange: onChange,
42
38
  name: 'uploadName',
43
39
  label: 'Upload something'
44
40
  },
45
41
  argTypes: {
46
- small: { ..._uiConstants.sharedPropTypes.sizeArgType
42
+ small: {
43
+ ..._uiConstants.sharedPropTypes.sizeArgType
47
44
  },
48
- large: { ..._uiConstants.sharedPropTypes.sizeArgType
45
+ large: {
46
+ ..._uiConstants.sharedPropTypes.sizeArgType
49
47
  },
50
- valid: { ..._uiConstants.sharedPropTypes.statusArgType
48
+ valid: {
49
+ ..._uiConstants.sharedPropTypes.statusArgType
51
50
  },
52
- warning: { ..._uiConstants.sharedPropTypes.statusArgType
51
+ warning: {
52
+ ..._uiConstants.sharedPropTypes.statusArgType
53
53
  },
54
- error: { ..._uiConstants.sharedPropTypes.statusArgType
54
+ error: {
55
+ ..._uiConstants.sharedPropTypes.statusArgType
55
56
  }
56
57
  }
57
58
  };
58
- exports.default = _default;
59
-
60
59
  const Template = args => /*#__PURE__*/_react.default.createElement(_fileInputField.FileInputField, args);
61
-
62
- const Default = Template.bind({});
63
- exports.Default = Default;
60
+ const Default = exports.Default = Template.bind({});
64
61
  Default.args = {
65
62
  label: null
66
63
  };
67
- const WithLabel = Template.bind({});
68
- exports.WithLabel = WithLabel;
69
- const Required = Template.bind({});
70
- exports.Required = Required;
64
+ const WithLabel = exports.WithLabel = Template.bind({});
65
+ const Required = exports.Required = Template.bind({});
71
66
  Required.args = {
72
67
  required: true
73
68
  };
74
- const Multiple = Template.bind({});
75
- exports.Multiple = Multiple;
69
+ const Multiple = exports.Multiple = Template.bind({});
76
70
  Multiple.args = {
77
71
  multiple: true,
78
72
  label: 'Upload multiple things',
79
73
  buttonLabel: 'Upload files'
80
74
  };
81
- const Disabled = Template.bind({});
82
- exports.Disabled = Disabled;
75
+ const Disabled = exports.Disabled = Template.bind({});
83
76
  Disabled.args = {
84
77
  disabled: true
85
78
  };
86
-
87
79
  const Sizes = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_fileInputField.FileInputField, _extends({}, args, {
88
80
  buttonLabel: "Default size",
89
81
  name: "defaultName"
@@ -96,9 +88,7 @@ const Sizes = args => /*#__PURE__*/_react.default.createElement(_react.default.F
96
88
  large: true,
97
89
  name: "largeName"
98
90
  })));
99
-
100
91
  exports.Sizes = Sizes;
101
-
102
92
  const Statuses = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_fileInputField.FileInputField, _extends({}, args, {
103
93
  buttonLabel: "Default",
104
94
  name: "defaultName"
@@ -116,9 +106,7 @@ const Statuses = args => /*#__PURE__*/_react.default.createElement(_react.defaul
116
106
  error: true,
117
107
  validationText: "Something went wrong"
118
108
  })));
119
-
120
109
  exports.Statuses = Statuses;
121
-
122
110
  const FileList = args => /*#__PURE__*/_react.default.createElement("div", {
123
111
  style: {
124
112
  width: 250
@@ -147,19 +135,15 @@ const FileList = args => /*#__PURE__*/_react.default.createElement("div", {
147
135
  color: 'grey'
148
136
  }
149
137
  }, /*#__PURE__*/_react.default.createElement("em", null, "Bounding box is 250px wide")));
150
-
151
138
  exports.FileList = FileList;
152
- const PlaceholderText = Template.bind({});
153
- exports.PlaceholderText = PlaceholderText;
139
+ const PlaceholderText = exports.PlaceholderText = Template.bind({});
154
140
  PlaceholderText.args = {
155
141
  placeholder: 'No file(s) selected yet'
156
142
  };
157
- const HelpText = Template.bind({});
158
- exports.HelpText = HelpText;
143
+ const HelpText = exports.HelpText = Template.bind({});
159
144
  HelpText.args = {
160
145
  helpText: 'Please select any file type'
161
146
  };
162
-
163
147
  const DesignSystemStackingOrder = args => /*#__PURE__*/_react.default.createElement(_fileInputField.FileInputField, args, /*#__PURE__*/_react.default.createElement(_index.FileListItem, {
164
148
  label: "TestFile.txt",
165
149
  onRemove: onRemove,
@@ -172,7 +156,6 @@ const DesignSystemStackingOrder = args => /*#__PURE__*/_react.default.createElem
172
156
  removeText: "remove",
173
157
  loading: true
174
158
  }));
175
-
176
159
  exports.DesignSystemStackingOrder = DesignSystemStackingOrder;
177
160
  DesignSystemStackingOrder.args = {
178
161
  error: true,
@@ -180,13 +163,12 @@ DesignSystemStackingOrder.args = {
180
163
  placeholder: 'Select a file',
181
164
  helpText: 'Please upload something'
182
165
  };
183
- const DesignSystemStackingOrderEmptyFileList = Template.bind({});
184
- exports.DesignSystemStackingOrderEmptyFileList = DesignSystemStackingOrderEmptyFileList;
185
- DesignSystemStackingOrderEmptyFileList.args = { ...DesignSystemStackingOrder.args
166
+ const DesignSystemStackingOrderEmptyFileList = exports.DesignSystemStackingOrderEmptyFileList = Template.bind({});
167
+ DesignSystemStackingOrderEmptyFileList.args = {
168
+ ...DesignSystemStackingOrder.args
186
169
  };
187
170
  DesignSystemStackingOrderEmptyFileList.storyName = 'Design system stacking order - empty file list';
188
- const DefaultButtonLabelAndPlaceholder = Template.bind({});
189
- exports.DefaultButtonLabelAndPlaceholder = DefaultButtonLabelAndPlaceholder;
171
+ const DefaultButtonLabelAndPlaceholder = exports.DefaultButtonLabelAndPlaceholder = Template.bind({});
190
172
  DefaultButtonLabelAndPlaceholder.args = {
191
173
  label: null
192
174
  };
@@ -9,5 +9,4 @@ Object.defineProperty(exports, "FileInputField", {
9
9
  return _fileInputField.FileInputField;
10
10
  }
11
11
  });
12
-
13
12
  var _fileInputField = require("./file-input-field.js");
@@ -1,13 +1,9 @@
1
1
  "use strict";
2
2
 
3
3
  var _react = require("@testing-library/react");
4
-
5
4
  var _react2 = _interopRequireDefault(require("react"));
6
-
7
5
  var _fileInputFieldWithList = require("../file-input-field-with-list.js");
8
-
9
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
-
6
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
11
7
  describe('<FileInputFieldWithList />', () => {
12
8
  it('should call the onKeyDown callback when provided', () => {
13
9
  const onKeyDown = jest.fn();
@@ -19,13 +15,9 @@ describe('<FileInputFieldWithList />', () => {
19
15
  onKeyDown: onKeyDown,
20
16
  onChange: jest.fn()
21
17
  }));
22
-
23
18
  _react.fireEvent.keyDown(_react.screen.getByRole('button'), {});
24
-
25
19
  expect(onKeyDown).toHaveBeenCalledTimes(1);
26
-
27
20
  const input = _react.screen.getByTestId('dhis2-uicore-fileinput-input');
28
-
29
21
  expect(onKeyDown).toHaveBeenCalledWith({
30
22
  name: 'foo',
31
23
  files: input.files
@@ -1,7 +1,6 @@
1
1
  "use strict";
2
2
 
3
3
  var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
-
5
4
  (0, _cypressCucumberPreprocessor.Given)('a FileInputFieldWithList with multiple files is rendered', () => {
6
5
  cy.visitStory('FileInputFieldWithList', 'Multiple files - with files');
7
6
  });
@@ -1,7 +1,6 @@
1
1
  "use strict";
2
2
 
3
3
  var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
-
5
4
  (0, _cypressCucumberPreprocessor.Given)('the list contains the file duplicate.md', () => {
6
5
  cy.contains('duplicate.md').should('have.lengthOf', 1).should('have.class', 'label').closest('[data-test="dhis2-uicore-filelistitem"]').should('have.lengthOf', 1);
7
6
  });
@@ -1,7 +1,6 @@
1
1
  "use strict";
2
2
 
3
3
  var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
-
5
4
  (0, _cypressCucumberPreprocessor.Given)('a FileInputFieldWithList without multiple is rendered', () => {
6
5
  cy.visitStory('FileInputFieldWithList', 'Single file - with file');
7
6
  });
@@ -1,7 +1,6 @@
1
1
  "use strict";
2
2
 
3
3
  var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
-
5
4
  (0, _cypressCucumberPreprocessor.Then)('the files are displayed in a list', () => {
6
5
  cy.get('[data-test="dhis2-uicore-filelistitem"] .label').then($labels => $labels.map((_, el) => el.innerHTML).toArray()).should('deep.equal', ['test1.md', 'duplicate.md', 'test2.md']);
7
6
  });
@@ -1,7 +1,6 @@
1
1
  "use strict";
2
2
 
3
3
  var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
-
5
4
  (0, _cypressCucumberPreprocessor.When)('the remove handle behind a file is clicked', () => {
6
5
  cy.contains('test1.md').siblings('[data-test="dhis2-uicore-filelistitem-remove"]').click();
7
6
  });
@@ -1,7 +1,6 @@
1
1
  "use strict";
2
2
 
3
3
  var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
-
5
4
  (0, _cypressCucumberPreprocessor.Given)('a default FileInputFieldWithList is rendered', () => {
6
5
  cy.visitStory('FileInputFieldWithList', 'With default texts');
7
6
  });
@@ -1,7 +1,6 @@
1
1
  "use strict";
2
2
 
3
3
  var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
-
5
4
  (0, _cypressCucumberPreprocessor.Given)('a default FileInputFieldWithList is rendered', () => {
6
5
  cy.visitStory('FileInputFieldWithList', 'With default texts');
7
6
  });
@@ -1,7 +1,6 @@
1
1
  "use strict";
2
2
 
3
3
  var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
-
5
4
  (0, _cypressCucumberPreprocessor.Given)('a default FileInputFieldWithList is rendered', () => {
6
5
  cy.visitStory('FileInputFieldWithList', 'With file and default texts');
7
6
  });
@@ -0,0 +1,63 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = exports.WithFileAndDefaultTexts = exports.WithDefaultTexts = exports.SingleFileWithFile = exports.MultipleFilesWithFiles = exports.MultipleFilesEmpty = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _index = require("./index.js");
9
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
+ window.onChange = window.Cypress && window.Cypress.cy.stub();
11
+ const singleFileArray = [new File([], 'dummy.txt')];
12
+ window.duplicateFileConstructorArgs = [[], 'duplicate.md', {
13
+ lastModified: 1581348175357,
14
+ type: 'text/markdown'
15
+ }];
16
+ const multipleFileArray = [new File([], 'test1.md'), new File(...window.duplicateFileConstructorArgs), new File([], 'test2.md')];
17
+ const onChange = (payload, event) => {
18
+ // NOTE: if files is not transformed into an array,
19
+ // cypress will get an empty file list!
20
+ window.onChange({
21
+ ...payload,
22
+ files: [...payload.files]
23
+ }, event);
24
+ };
25
+ var _default = exports.default = {
26
+ title: 'FileInputFieldWithList'
27
+ };
28
+ const SingleFileWithFile = () => /*#__PURE__*/_react.default.createElement(_index.FileInputFieldWithList, {
29
+ buttonLabel: "Upload file",
30
+ name: "upload",
31
+ files: singleFileArray,
32
+ removeText: "remove",
33
+ onChange: onChange
34
+ });
35
+ exports.SingleFileWithFile = SingleFileWithFile;
36
+ const MultipleFilesEmpty = () => /*#__PURE__*/_react.default.createElement(_index.FileInputFieldWithList, {
37
+ buttonLabel: "Upload file",
38
+ multiple: true,
39
+ name: "upload",
40
+ removeText: "remove",
41
+ onChange: onChange
42
+ });
43
+ exports.MultipleFilesEmpty = MultipleFilesEmpty;
44
+ const MultipleFilesWithFiles = () => /*#__PURE__*/_react.default.createElement(_index.FileInputFieldWithList, {
45
+ buttonLabel: "Upload file",
46
+ multiple: true,
47
+ name: "upload",
48
+ files: multipleFileArray,
49
+ removeText: "remove",
50
+ onChange: onChange
51
+ });
52
+ exports.MultipleFilesWithFiles = MultipleFilesWithFiles;
53
+ const WithFileAndDefaultTexts = () => /*#__PURE__*/_react.default.createElement(_index.FileInputFieldWithList, {
54
+ name: "upload",
55
+ files: singleFileArray,
56
+ onChange: onChange
57
+ });
58
+ exports.WithFileAndDefaultTexts = WithFileAndDefaultTexts;
59
+ const WithDefaultTexts = () => /*#__PURE__*/_react.default.createElement(_index.FileInputFieldWithList, {
60
+ name: "upload",
61
+ onChange: onChange
62
+ });
63
+ exports.WithDefaultTexts = WithDefaultTexts;
@@ -4,40 +4,28 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.FileInputFieldWithList = void 0;
7
-
8
7
  var _uiConstants = require("@dhis2/ui-constants");
9
-
10
8
  var _propTypes = _interopRequireDefault(require("prop-types"));
11
-
12
9
  var _react = _interopRequireWildcard(require("react"));
13
-
14
- var _index = require("../index.js");
15
-
10
+ var _index = require("../file-input-field/index.js");
16
11
  var _index2 = _interopRequireDefault(require("../locales/index.js"));
17
-
18
12
  var _fileListItemWithRemove = require("./file-list-item-with-remove.js");
19
-
20
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
21
-
22
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
23
-
24
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
25
-
26
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
27
-
13
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
14
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
15
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
16
+ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
17
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
18
+ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
28
19
  // TODO: i18n
29
20
  const translate = (prop, interpolationObject) => {
30
21
  if (typeof prop === 'function') {
31
22
  return prop(interpolationObject);
32
23
  }
33
-
34
24
  return prop;
35
25
  };
36
-
37
26
  class FileInputFieldWithList extends _react.Component {
38
27
  constructor() {
39
28
  super(...arguments);
40
-
41
29
  _defineProperty(this, "handleChange", (_ref, event) => {
42
30
  let {
43
31
  files: fileList
@@ -51,7 +39,6 @@ class FileInputFieldWithList extends _react.Component {
51
39
  name: name
52
40
  }, event);
53
41
  });
54
-
55
42
  _defineProperty(this, "handleRemove", (_ref2, event) => {
56
43
  let {
57
44
  file: fileToRemove
@@ -67,7 +54,6 @@ class FileInputFieldWithList extends _react.Component {
67
54
  }, event);
68
55
  });
69
56
  }
70
-
71
57
  /**
72
58
  * @param {FileList} fileList
73
59
  * @returns {File[]}
@@ -76,17 +62,14 @@ class FileInputFieldWithList extends _react.Component {
76
62
  const {
77
63
  multiple,
78
64
  files
79
- } = this.props; // Spread immutable FileList instance onto array
80
-
65
+ } = this.props;
66
+ // Spread immutable FileList instance onto array
81
67
  const newFiles = [...fileList];
82
-
83
68
  if (!multiple) {
84
69
  return newFiles;
85
70
  }
86
-
87
71
  return files.filter(file => !newFiles.some(x => x.name === file.name && x.lastModified === file.lastModified && x.size === file.size && x.type === file.type)).concat(newFiles);
88
72
  }
89
-
90
73
  render() {
91
74
  const {
92
75
  accept,
@@ -146,9 +129,7 @@ class FileInputFieldWithList extends _react.Component {
146
129
  file: file
147
130
  })));
148
131
  }
149
-
150
132
  }
151
-
152
133
  exports.FileInputFieldWithList = FileInputFieldWithList;
153
134
  FileInputFieldWithList.defaultProps = {
154
135
  dataTest: 'dhis2-uiwidgets-fileinputfieldwithlist',
@@ -160,66 +141,47 @@ FileInputFieldWithList.defaultProps = {
160
141
  FileInputFieldWithList.propTypes = {
161
142
  /** Called with signature `({ name: string, files: [File] }, event)` */
162
143
  onChange: _propTypes.default.func.isRequired,
163
-
164
144
  /** The `accept` attribute of the [native file input](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#accept) */
165
145
  accept: _propTypes.default.string,
166
-
167
146
  /** Text on the button */
168
147
  buttonLabel: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.func]),
169
148
  className: _propTypes.default.string,
170
149
  dataTest: _propTypes.default.string,
171
-
172
150
  /** Disables the button */
173
151
  disabled: _propTypes.default.bool,
174
-
175
152
  /** Applies 'error' styling to the button and validation text. Mutually exclusive with `warning` and `valid` props */
176
153
  error: _uiConstants.sharedPropTypes.statusPropType,
177
154
  files: _propTypes.default.arrayOf(_propTypes.default.instanceOf(File)),
178
-
179
155
  /** Useful guiding text for the user */
180
156
  helpText: _propTypes.default.string,
181
157
  initialFocus: _propTypes.default.bool,
182
-
183
158
  /** A descriptive label above the button */
184
159
  label: _propTypes.default.string,
185
-
186
160
  /** Size of the button. Mutually exclusive with the `small` prop */
187
161
  large: _uiConstants.sharedPropTypes.sizePropType,
188
-
189
162
  /** The `multiple` attribute of the [native file input](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#multiple) */
190
163
  multiple: _propTypes.default.bool,
191
-
192
164
  /** Name associated with input. Passed to event handler callbacks */
193
165
  name: _propTypes.default.string,
194
-
195
166
  /** Placeholder below the button */
196
167
  placeholder: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.func]),
197
-
198
168
  /** Text used for the button that removes a file from the list */
199
169
  removeText: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.func]),
200
-
201
170
  /** Adds an asterisk to indicate this field is required */
202
171
  required: _propTypes.default.bool,
203
-
204
172
  /** Size of the button. Mutually exclusive with the `large` prop */
205
173
  small: _uiConstants.sharedPropTypes.sizePropType,
206
174
  tabIndex: _propTypes.default.string,
207
-
208
175
  /** Applies 'valid' styling to the button and validation text. Mutually exclusive with `warning` and `error` props */
209
176
  valid: _uiConstants.sharedPropTypes.statusPropType,
210
-
211
177
  /** Text below the button that provides validation feedback */
212
178
  validationText: _propTypes.default.string,
213
-
214
179
  /** Applies 'warning' styling to the button and validation text. Mutually exclusive with `valid` and `error` props */
215
180
  warning: _uiConstants.sharedPropTypes.statusPropType,
216
-
217
181
  /** Called with signature `({ name: string, files: [] }, event)` */
218
182
  onBlur: _propTypes.default.func,
219
-
220
183
  /** Called with signature `({ name: string, files: [] }, event)` */
221
184
  onFocus: _propTypes.default.func,
222
-
223
185
  /** Called with signature `({ name: string, files: [] }, event)` */
224
186
  onKeyDown: _propTypes.default.func
225
187
  };
@@ -4,26 +4,25 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = exports.RTL = exports.DefaultPlaceholder = exports.DefaultButtonLabelAndRemoveText = exports.Default = void 0;
7
-
8
7
  var _uiConstants = require("@dhis2/ui-constants");
9
-
10
8
  var _react = _interopRequireDefault(require("react"));
11
-
12
9
  var _fileInputFieldWithList = require("./file-input-field-with-list.js");
10
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
11
+ const description = `
12
+ A FileInputField with logic for creating a dynamic list of removable files from an array of \`File\` objects.
13
13
 
14
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
-
16
- const description = "\nA FileInputField with logic for creating a dynamic list of removable files from an array of `File` objects.\n\n```js\nimport { FileInputFieldWithList } from '@dhis2/ui'\n```\n";
17
- const files = new Array(10).fill('dummy-file-name').map((name, i) => new File([], "".concat(name, "-").concat(i + 1, ".txt")));
18
-
14
+ \`\`\`js
15
+ import { FileInputFieldWithList } from '@dhis2/ui'
16
+ \`\`\`
17
+ `;
18
+ const files = new Array(10).fill('dummy-file-name').map((name, i) => new File([], `${name}-${i + 1}.txt`));
19
19
  const onChange = _ref => {
20
20
  let {
21
21
  files
22
22
  } = _ref;
23
23
  console.log('files: ', files);
24
24
  };
25
-
26
- var _default = {
25
+ var _default = exports.default = {
27
26
  title: 'File Input Field With List',
28
27
  component: _fileInputFieldWithList.FileInputFieldWithList,
29
28
  parameters: {
@@ -33,50 +32,48 @@ var _default = {
33
32
  }
34
33
  }
35
34
  },
36
- args: { // Handle default props bug (see Transfer stories)
35
+ args: {
36
+ // Handle default props bug (see Transfer stories)
37
37
  ..._fileInputFieldWithList.FileInputFieldWithList.defaultProps,
38
38
  multiple: true,
39
39
  onChange: onChange,
40
40
  name: 'uploadName'
41
41
  },
42
42
  argTypes: {
43
- small: { ..._uiConstants.sharedPropTypes.sizeArgType
43
+ small: {
44
+ ..._uiConstants.sharedPropTypes.sizeArgType
44
45
  },
45
- large: { ..._uiConstants.sharedPropTypes.sizeArgType
46
+ large: {
47
+ ..._uiConstants.sharedPropTypes.sizeArgType
46
48
  },
47
- valid: { ..._uiConstants.sharedPropTypes.statusArgType
49
+ valid: {
50
+ ..._uiConstants.sharedPropTypes.statusArgType
48
51
  },
49
- warning: { ..._uiConstants.sharedPropTypes.statusArgType
52
+ warning: {
53
+ ..._uiConstants.sharedPropTypes.statusArgType
50
54
  },
51
- error: { ..._uiConstants.sharedPropTypes.statusArgType
55
+ error: {
56
+ ..._uiConstants.sharedPropTypes.statusArgType
52
57
  }
53
58
  }
54
59
  };
55
- exports.default = _default;
56
-
57
60
  const Template = args => /*#__PURE__*/_react.default.createElement(_fileInputFieldWithList.FileInputFieldWithList, args);
58
-
59
- const Default = Template.bind({});
60
- exports.Default = Default;
61
+ const Default = exports.Default = Template.bind({});
61
62
  Default.args = {
62
63
  buttonLabel: 'Upload file (custom label)',
63
64
  files: files,
64
65
  removeText: 'Custom remove text'
65
66
  };
66
- const DefaultButtonLabelAndRemoveText = Template.bind({});
67
- exports.DefaultButtonLabelAndRemoveText = DefaultButtonLabelAndRemoveText;
67
+ const DefaultButtonLabelAndRemoveText = exports.DefaultButtonLabelAndRemoveText = Template.bind({});
68
68
  DefaultButtonLabelAndRemoveText.args = {
69
69
  files: files
70
70
  };
71
71
  DefaultButtonLabelAndRemoveText.storyName = 'Default: buttonLabel and removeText';
72
- const DefaultPlaceholder = Template.bind({});
73
- exports.DefaultPlaceholder = DefaultPlaceholder;
72
+ const DefaultPlaceholder = exports.DefaultPlaceholder = Template.bind({});
74
73
  DefaultPlaceholder.storyName = 'Default: placeholder';
75
-
76
74
  const RTL = args => /*#__PURE__*/_react.default.createElement("div", {
77
75
  dir: "rtl"
78
76
  }, /*#__PURE__*/_react.default.createElement(Template, args));
79
-
80
77
  exports.RTL = RTL;
81
78
  RTL.args = {
82
79
  files: files