@panneau/field-upload 2.0.72 → 2.0.76

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 (3) hide show
  1. package/es/index.js +26 -10
  2. package/lib/index.js +26 -10
  3. package/package.json +9 -9
package/es/index.js CHANGED
@@ -14,6 +14,7 @@ import React, { useCallback, useMemo, useState } from 'react';
14
14
  import { FormattedMessage } from 'react-intl';
15
15
  import { PropTypes as PropTypes$1 } from '@panneau/core';
16
16
  import { useUppy } from '@panneau/core/contexts';
17
+ import { useResourceQuery } from '@panneau/core/hooks';
17
18
  import Button from '@panneau/element-button';
18
19
  import Label from '@panneau/element-label';
19
20
  import ResourceItemsList from '@panneau/list-resource-items';
@@ -35,7 +36,7 @@ var propTypes = {
35
36
  fileTypes: PropTypes.arrayOf(PropTypes.string),
36
37
  sources: PropTypes.arrayOf(PropTypes.oneOf(['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'])),
37
38
  withButton: PropTypes.bool,
38
- withResourceList: PropTypes.bool,
39
+ withFind: PropTypes.bool,
39
40
  addButtonLabel: PropTypes$1.label,
40
41
  searchButtonLabel: PropTypes$1.label,
41
42
  allowMultipleUploads: PropTypes.bool,
@@ -54,7 +55,7 @@ var defaultProps = {
54
55
  fileTypes: null,
55
56
  sources: ['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'],
56
57
  withButton: false,
57
- withResourceList: false,
58
+ withFind: false,
58
59
  addButtonLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
59
60
  id: "NI9440",
60
61
  defaultMessage: [{
@@ -63,10 +64,10 @@ var defaultProps = {
63
64
  }]
64
65
  }),
65
66
  searchButtonLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
66
- id: "NdhsZI",
67
+ id: "une5WQ",
67
68
  defaultMessage: [{
68
69
  "type": 0,
69
- "value": "Find media"
70
+ "value": "Find a file"
70
71
  }]
71
72
  }),
72
73
  allowMultipleUploads: false,
@@ -85,7 +86,7 @@ var UploadField = function UploadField(_ref) {
85
86
  fileTypes = _ref.fileTypes,
86
87
  sources = _ref.sources,
87
88
  withButton = _ref.withButton,
88
- withResourceList = _ref.withResourceList,
89
+ withFind = _ref.withFind,
89
90
  addButtonLabel = _ref.addButtonLabel,
90
91
  searchButtonLabel = _ref.searchButtonLabel,
91
92
  allowMultipleUploads = _ref.allowMultipleUploads,
@@ -172,7 +173,7 @@ var UploadField = function UploadField(_ref) {
172
173
  _useState4 = _slicedToArray(_useState3, 2),
173
174
  resourceModalOpen = _useState4[0],
174
175
  setResourceModalOpen = _useState4[1];
175
- var showResourceModal = withResourceList && resourceModalOpen;
176
+ var showResourceModal = withFind && resourceModalOpen;
176
177
  var toggleResourceModal = useCallback(function () {
177
178
  setResourceModalOpen(!resourceModalOpen);
178
179
  }, [resourceModalOpen, setResourceModalOpen]);
@@ -181,11 +182,20 @@ var UploadField = function UploadField(_ref) {
181
182
  }, [resourceModalOpen, setResourceModalOpen]);
182
183
  var onClickSelect = useCallback(function (newValue) {
183
184
  if (onChange !== null) {
184
- console.log(newValue, onChange);
185
185
  onChange(newValue);
186
186
  setResourceModalOpen(false);
187
187
  }
188
188
  }, [onChange, setResourceModalOpen]);
189
+ var initialQuery = useMemo(function () {
190
+ return {
191
+ types: types
192
+ };
193
+ }, [types]);
194
+ var _useResourceQuery = useResourceQuery(initialQuery),
195
+ listQuery = _useResourceQuery.query,
196
+ onListPageChange = _useResourceQuery.onPageChange,
197
+ onListQueryChange = _useResourceQuery.onQueryChange,
198
+ onListQueryReset = _useResourceQuery.onQueryReset;
189
199
  return /*#__PURE__*/React.createElement("div", {
190
200
  className: classNames([styles.container, _defineProperty({}, className, className !== null)])
191
201
  // ref={containerRef}
@@ -283,14 +293,16 @@ var UploadField = function UploadField(_ref) {
283
293
  type: "button",
284
294
  theme: "primary",
285
295
  onClick: openModal,
286
- disabled: disabled
287
- }, /*#__PURE__*/React.createElement(Label, null, addButtonLabel))), withResourceList ? /*#__PURE__*/React.createElement("div", {
296
+ disabled: disabled,
297
+ outline: true
298
+ }, /*#__PURE__*/React.createElement(Label, null, addButtonLabel))), withFind ? /*#__PURE__*/React.createElement("div", {
288
299
  className: "col-auto ps-0"
289
300
  }, /*#__PURE__*/React.createElement(Button, {
290
301
  type: "button",
291
302
  theme: "primary",
292
303
  onClick: toggleResourceModal,
293
- disabled: disabled
304
+ disabled: disabled,
305
+ outline: true
294
306
  }, /*#__PURE__*/React.createElement(Label, null, searchButtonLabel))) : null) : null, !showResourceModal && !disabled && !hasMedia && !withButton && uppy !== null ? /*#__PURE__*/React.createElement("div", {
295
307
  className: styles.dashboard
296
308
  }, /*#__PURE__*/React.createElement(Dashboard, Object.assign({
@@ -320,6 +332,10 @@ var UploadField = function UploadField(_ref) {
320
332
  onClickClose: closeResourceModal
321
333
  }, /*#__PURE__*/React.createElement(ResourceItemsList, {
322
334
  resource: "medias",
335
+ query: listQuery,
336
+ onPageChange: onListPageChange,
337
+ onQueryChange: onListQueryChange,
338
+ onQueryReset: onListQueryReset,
323
339
  listProps: {
324
340
  actions: ['select'],
325
341
  actionsProps: {
package/lib/index.js CHANGED
@@ -18,6 +18,7 @@ var React = require('react');
18
18
  var reactIntl = require('react-intl');
19
19
  var core = require('@panneau/core');
20
20
  var contexts = require('@panneau/core/contexts');
21
+ var hooks = require('@panneau/core/hooks');
21
22
  var Button = require('@panneau/element-button');
22
23
  var Label = require('@panneau/element-label');
23
24
  var ResourceItemsList = require('@panneau/list-resource-items');
@@ -56,7 +57,7 @@ var propTypes = {
56
57
  fileTypes: PropTypes__default["default"].arrayOf(PropTypes__default["default"].string),
57
58
  sources: PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOf(['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'])),
58
59
  withButton: PropTypes__default["default"].bool,
59
- withResourceList: PropTypes__default["default"].bool,
60
+ withFind: PropTypes__default["default"].bool,
60
61
  addButtonLabel: core.PropTypes.label,
61
62
  searchButtonLabel: core.PropTypes.label,
62
63
  allowMultipleUploads: PropTypes__default["default"].bool,
@@ -75,7 +76,7 @@ var defaultProps = {
75
76
  fileTypes: null,
76
77
  sources: ['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'],
77
78
  withButton: false,
78
- withResourceList: false,
79
+ withFind: false,
79
80
  addButtonLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
80
81
  id: "NI9440",
81
82
  defaultMessage: [{
@@ -84,10 +85,10 @@ var defaultProps = {
84
85
  }]
85
86
  }),
86
87
  searchButtonLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
87
- id: "NdhsZI",
88
+ id: "une5WQ",
88
89
  defaultMessage: [{
89
90
  "type": 0,
90
- "value": "Find media"
91
+ "value": "Find a file"
91
92
  }]
92
93
  }),
93
94
  allowMultipleUploads: false,
@@ -106,7 +107,7 @@ var UploadField = function UploadField(_ref) {
106
107
  fileTypes = _ref.fileTypes,
107
108
  sources = _ref.sources,
108
109
  withButton = _ref.withButton,
109
- withResourceList = _ref.withResourceList,
110
+ withFind = _ref.withFind,
110
111
  addButtonLabel = _ref.addButtonLabel,
111
112
  searchButtonLabel = _ref.searchButtonLabel,
112
113
  allowMultipleUploads = _ref.allowMultipleUploads,
@@ -193,7 +194,7 @@ var UploadField = function UploadField(_ref) {
193
194
  _useState4 = _slicedToArray__default["default"](_useState3, 2),
194
195
  resourceModalOpen = _useState4[0],
195
196
  setResourceModalOpen = _useState4[1];
196
- var showResourceModal = withResourceList && resourceModalOpen;
197
+ var showResourceModal = withFind && resourceModalOpen;
197
198
  var toggleResourceModal = React.useCallback(function () {
198
199
  setResourceModalOpen(!resourceModalOpen);
199
200
  }, [resourceModalOpen, setResourceModalOpen]);
@@ -202,11 +203,20 @@ var UploadField = function UploadField(_ref) {
202
203
  }, [resourceModalOpen, setResourceModalOpen]);
203
204
  var onClickSelect = React.useCallback(function (newValue) {
204
205
  if (onChange !== null) {
205
- console.log(newValue, onChange);
206
206
  onChange(newValue);
207
207
  setResourceModalOpen(false);
208
208
  }
209
209
  }, [onChange, setResourceModalOpen]);
210
+ var initialQuery = React.useMemo(function () {
211
+ return {
212
+ types: types
213
+ };
214
+ }, [types]);
215
+ var _useResourceQuery = hooks.useResourceQuery(initialQuery),
216
+ listQuery = _useResourceQuery.query,
217
+ onListPageChange = _useResourceQuery.onPageChange,
218
+ onListQueryChange = _useResourceQuery.onQueryChange,
219
+ onListQueryReset = _useResourceQuery.onQueryReset;
210
220
  return /*#__PURE__*/React__default["default"].createElement("div", {
211
221
  className: classNames__default["default"]([styles.container, _defineProperty__default["default"]({}, className, className !== null)])
212
222
  // ref={containerRef}
@@ -304,14 +314,16 @@ var UploadField = function UploadField(_ref) {
304
314
  type: "button",
305
315
  theme: "primary",
306
316
  onClick: openModal,
307
- disabled: disabled
308
- }, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, addButtonLabel))), withResourceList ? /*#__PURE__*/React__default["default"].createElement("div", {
317
+ disabled: disabled,
318
+ outline: true
319
+ }, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, addButtonLabel))), withFind ? /*#__PURE__*/React__default["default"].createElement("div", {
309
320
  className: "col-auto ps-0"
310
321
  }, /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
311
322
  type: "button",
312
323
  theme: "primary",
313
324
  onClick: toggleResourceModal,
314
- disabled: disabled
325
+ disabled: disabled,
326
+ outline: true
315
327
  }, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, searchButtonLabel))) : null) : null, !showResourceModal && !disabled && !hasMedia && !withButton && uppy !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
316
328
  className: styles.dashboard
317
329
  }, /*#__PURE__*/React__default["default"].createElement(react.Dashboard, Object.assign({
@@ -341,6 +353,10 @@ var UploadField = function UploadField(_ref) {
341
353
  onClickClose: closeResourceModal
342
354
  }, /*#__PURE__*/React__default["default"].createElement(ResourceItemsList__default["default"], {
343
355
  resource: "medias",
356
+ query: listQuery,
357
+ onPageChange: onListPageChange,
358
+ onQueryChange: onListQueryChange,
359
+ onQueryReset: onListQueryReset,
344
360
  listProps: {
345
361
  actions: ['select'],
346
362
  actionsProps: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@panneau/field-upload",
3
- "version": "2.0.72",
3
+ "version": "2.0.76",
4
4
  "description": "An Upload field",
5
5
  "keywords": [
6
6
  "javascript"
@@ -56,13 +56,13 @@
56
56
  "@fortawesome/fontawesome-svg-core": "^1.2.35",
57
57
  "@fortawesome/free-solid-svg-icons": "^5.15.3",
58
58
  "@fortawesome/react-fontawesome": "^0.1.14",
59
- "@panneau/core": "^2.0.71",
60
- "@panneau/element-button": "^2.0.71",
61
- "@panneau/element-card": "^2.0.71",
62
- "@panneau/element-label": "^2.0.71",
63
- "@panneau/list-resource-items": "^2.0.71",
64
- "@panneau/modal-dialog": "^2.0.72",
65
- "@panneau/themes": "^2.0.71",
59
+ "@panneau/core": "^2.0.75",
60
+ "@panneau/element-button": "^2.0.75",
61
+ "@panneau/element-card": "^2.0.75",
62
+ "@panneau/element-label": "^2.0.75",
63
+ "@panneau/list-resource-items": "^2.0.76",
64
+ "@panneau/modal-dialog": "^2.0.75",
65
+ "@panneau/themes": "^2.0.75",
66
66
  "@uppy/core": "^3.2.0",
67
67
  "@uppy/dashboard": "^3.4.0",
68
68
  "@uppy/drag-drop": "^3.0.2",
@@ -80,5 +80,5 @@
80
80
  "publishConfig": {
81
81
  "access": "public"
82
82
  },
83
- "gitHead": "dec3ab57e02e99a81625bf5c2f7d8589fd222e57"
83
+ "gitHead": "433bfadcf173270c85df5ff0d46a107287c1f513"
84
84
  }