@panneau/field-resource-item 3.0.119 → 3.0.126
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.
- package/lib/index.js +61 -79
- package/package.json +14 -13
package/lib/index.js
CHANGED
@@ -24,61 +24,43 @@ var intl = require('@panneau/intl');
|
|
24
24
|
var Dialog = require('@panneau/modal-dialog');
|
25
25
|
var ResourceItemsModal = require('@panneau/modal-resource-items');
|
26
26
|
|
27
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
28
|
-
|
29
|
-
var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
|
30
|
-
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
31
|
-
var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
|
32
|
-
var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
|
33
|
-
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
34
|
-
var isArray__default = /*#__PURE__*/_interopDefaultLegacy(isArray);
|
35
|
-
var isEmpty__default = /*#__PURE__*/_interopDefaultLegacy(isEmpty);
|
36
|
-
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
37
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
38
|
-
var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
|
39
|
-
var ResourceCard__default = /*#__PURE__*/_interopDefaultLegacy(ResourceCard);
|
40
|
-
var Select__default = /*#__PURE__*/_interopDefaultLegacy(Select);
|
41
|
-
var ResourceForm__default = /*#__PURE__*/_interopDefaultLegacy(ResourceForm);
|
42
|
-
var Dialog__default = /*#__PURE__*/_interopDefaultLegacy(Dialog);
|
43
|
-
var ResourceItemsModal__default = /*#__PURE__*/_interopDefaultLegacy(ResourceItemsModal);
|
44
|
-
|
45
27
|
var propTypes = {
|
46
|
-
name:
|
47
|
-
value:
|
28
|
+
name: PropTypes.string,
|
29
|
+
value: PropTypes.object,
|
48
30
|
// eslint-disable-line react/forbid-prop-types
|
49
31
|
errors: core.PropTypes.formErrors,
|
50
|
-
resource:
|
51
|
-
resourceType:
|
52
|
-
paginated:
|
53
|
-
query:
|
32
|
+
resource: PropTypes.string,
|
33
|
+
resourceType: PropTypes.string,
|
34
|
+
paginated: PropTypes.bool,
|
35
|
+
query: PropTypes.object,
|
54
36
|
// eslint-disable-line react/forbid-prop-types
|
55
|
-
page:
|
37
|
+
page: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
56
38
|
// eslint-disable-line react/forbid-prop-types
|
57
|
-
count:
|
39
|
+
count: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
58
40
|
// eslint-disable-line react/forbid-prop-types
|
59
|
-
options:
|
41
|
+
options: PropTypes.object,
|
60
42
|
// eslint-disable-line react/forbid-prop-types
|
61
|
-
searchParamName:
|
62
|
-
getItemLabel:
|
63
|
-
getItemDescription:
|
64
|
-
getItemImage:
|
65
|
-
itemLabelPath:
|
66
|
-
itemDescriptionPath:
|
67
|
-
itemImagePath:
|
68
|
-
itemLabelWithId:
|
69
|
-
placeholder:
|
70
|
-
canCreate:
|
71
|
-
canEdit:
|
72
|
-
canFind:
|
73
|
-
withoutModal:
|
43
|
+
searchParamName: PropTypes.string,
|
44
|
+
getItemLabel: PropTypes.func,
|
45
|
+
getItemDescription: PropTypes.func,
|
46
|
+
getItemImage: PropTypes.func,
|
47
|
+
itemLabelPath: PropTypes.string,
|
48
|
+
itemDescriptionPath: PropTypes.string,
|
49
|
+
itemImagePath: PropTypes.string,
|
50
|
+
itemLabelWithId: PropTypes.bool,
|
51
|
+
placeholder: PropTypes.string,
|
52
|
+
canCreate: PropTypes.bool,
|
53
|
+
canEdit: PropTypes.bool,
|
54
|
+
canFind: PropTypes.bool,
|
55
|
+
withoutModal: PropTypes.bool,
|
74
56
|
createButtonLabel: core.PropTypes.message,
|
75
57
|
editButtonLabel: core.PropTypes.message,
|
76
58
|
findButtonLabel: core.PropTypes.message,
|
77
|
-
multiple:
|
78
|
-
disabled:
|
79
|
-
className:
|
80
|
-
inputClassName:
|
81
|
-
onChange:
|
59
|
+
multiple: PropTypes.bool,
|
60
|
+
disabled: PropTypes.bool,
|
61
|
+
className: PropTypes.string,
|
62
|
+
inputClassName: PropTypes.string,
|
63
|
+
onChange: PropTypes.func
|
82
64
|
};
|
83
65
|
var defaultProps = {
|
84
66
|
name: null,
|
@@ -150,22 +132,22 @@ var ResourceItemField = function ResourceItemField(_ref) {
|
|
150
132
|
var resourceValues = intl.useResourceValues(resource);
|
151
133
|
var defaultPage = initialPage || (paginated ? 1 : null);
|
152
134
|
var defaultCount = initialCount || (paginated ? 10 : null);
|
153
|
-
var hasValue = value !== null && !
|
135
|
+
var hasValue = value !== null && !isEmpty(value);
|
154
136
|
|
155
137
|
// const [initialValue] = useState(value);
|
156
138
|
|
157
139
|
var _useState = React.useState(false),
|
158
|
-
_useState2 =
|
140
|
+
_useState2 = _slicedToArray(_useState, 2),
|
159
141
|
formOpen = _useState2[0],
|
160
142
|
setFormOpen = _useState2[1];
|
161
143
|
var _useState3 = React.useState(false),
|
162
|
-
_useState4 =
|
144
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
163
145
|
listOpen = _useState4[0],
|
164
146
|
setListOpen = _useState4[1];
|
165
147
|
|
166
148
|
// The text input search query
|
167
149
|
var _useState5 = React.useState(''),
|
168
|
-
_useState6 =
|
150
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
169
151
|
inputTextValue = _useState6[0],
|
170
152
|
setInputTextValue = _useState6[1];
|
171
153
|
var onInputChange = React.useCallback(function (textValue) {
|
@@ -174,19 +156,19 @@ var ResourceItemField = function ResourceItemField(_ref) {
|
|
174
156
|
|
175
157
|
// TODO: list state controls?
|
176
158
|
var _useState7 = React.useState(initialQuery),
|
177
|
-
_useState8 =
|
159
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
178
160
|
query = _useState8[0];
|
179
161
|
_useState8[1];
|
180
162
|
var _useState9 = React.useState(defaultPage),
|
181
|
-
_useState10 =
|
163
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
182
164
|
page = _useState10[0],
|
183
165
|
setPage = _useState10[1];
|
184
166
|
var _useState11 = React.useState(defaultCount),
|
185
|
-
_useState12 =
|
167
|
+
_useState12 = _slicedToArray(_useState11, 2),
|
186
168
|
count = _useState12[0];
|
187
169
|
_useState12[1];
|
188
170
|
var _useState13 = React.useState(initialOptions),
|
189
|
-
_useState14 =
|
171
|
+
_useState14 = _slicedToArray(_useState13, 2),
|
190
172
|
resourceOptions = _useState14[0];
|
191
173
|
_useState14[1];
|
192
174
|
var queryResource = React.useMemo(function () {
|
@@ -195,7 +177,7 @@ var ResourceItemField = function ResourceItemField(_ref) {
|
|
195
177
|
};
|
196
178
|
}, [resourceId]);
|
197
179
|
var finalQuery = React.useMemo(function () {
|
198
|
-
return
|
180
|
+
return _objectSpread(_objectSpread(_objectSpread({}, query), !isEmpty(inputTextValue) ? _defineProperty({}, searchParamName, inputTextValue) : null), {}, {
|
199
181
|
paginated: paginated
|
200
182
|
});
|
201
183
|
}, [inputTextValue, paginated]);
|
@@ -211,7 +193,7 @@ var ResourceItemField = function ResourceItemField(_ref) {
|
|
211
193
|
reset = _ref3$reset === void 0 ? null : _ref3$reset,
|
212
194
|
_ref3$lastPage = _ref3.lastPage,
|
213
195
|
lastPage = _ref3$lastPage === void 0 ? null : _ref3$lastPage;
|
214
|
-
var items = (partialItems || []).concat(multiple &&
|
196
|
+
var items = (partialItems || []).concat(multiple && isArray(value) ? value : [value]).filter(function (it) {
|
215
197
|
return it !== null;
|
216
198
|
}).filter(function (v, i, a) {
|
217
199
|
return a.findIndex(function (v2) {
|
@@ -248,7 +230,7 @@ var ResourceItemField = function ResourceItemField(_ref) {
|
|
248
230
|
label: finalLabel
|
249
231
|
};
|
250
232
|
}, [getItemLabel, getItemDescription, itemLabelPath, itemDescriptionPath]);
|
251
|
-
var finalValue = multiple &&
|
233
|
+
var finalValue = multiple && isArray(value) ? value.map(function (_ref5) {
|
252
234
|
var _ref5$id = _ref5.id,
|
253
235
|
id = _ref5$id === void 0 ? null : _ref5$id;
|
254
236
|
return id;
|
@@ -291,11 +273,11 @@ var ResourceItemField = function ResourceItemField(_ref) {
|
|
291
273
|
}, [setFormOpen]);
|
292
274
|
var onFormSuccess = React.useCallback(function (newValue) {
|
293
275
|
if (onChange === null) return;
|
294
|
-
var finalNewValue = resourceType !== null ?
|
276
|
+
var finalNewValue = resourceType !== null ? _objectSpread({
|
295
277
|
type: resourceType
|
296
278
|
}, newValue) : newValue;
|
297
279
|
if (multiple) {
|
298
|
-
onChange(
|
280
|
+
onChange(isArray(value) ? [].concat(_toConsumableArray(value), [finalNewValue]) : [finalNewValue]);
|
299
281
|
} else {
|
300
282
|
onChange(finalNewValue);
|
301
283
|
}
|
@@ -336,19 +318,19 @@ var ResourceItemField = function ResourceItemField(_ref) {
|
|
336
318
|
reset();
|
337
319
|
}
|
338
320
|
}, [onChange, paginated, defaultPage, reload, reloadPage, reset]);
|
339
|
-
var form = formOpen ? /*#__PURE__*/
|
321
|
+
var form = formOpen ? /*#__PURE__*/React.createElement(ResourceForm, {
|
340
322
|
resource: resource,
|
341
323
|
type: finalType,
|
342
324
|
item: !multiple ? value : null,
|
343
325
|
onSuccess: onFormSuccess
|
344
326
|
}) : null;
|
345
|
-
return /*#__PURE__*/
|
346
|
-
className:
|
347
|
-
}, hasValue && !multiple ? /*#__PURE__*/
|
327
|
+
return /*#__PURE__*/React.createElement("div", {
|
328
|
+
className: classNames(['position-relative', _defineProperty({}, className, className != null)])
|
329
|
+
}, hasValue && !multiple ? /*#__PURE__*/React.createElement("div", {
|
348
330
|
className: "row"
|
349
|
-
}, /*#__PURE__*/
|
331
|
+
}, /*#__PURE__*/React.createElement("div", {
|
350
332
|
className: "col-10 flex-grow-1"
|
351
|
-
}, /*#__PURE__*/
|
333
|
+
}, /*#__PURE__*/React.createElement(ResourceCard, {
|
352
334
|
className: "flex-grow-1",
|
353
335
|
item: value,
|
354
336
|
getItemLabel: initialGetItemLabel,
|
@@ -362,19 +344,19 @@ var ResourceItemField = function ResourceItemField(_ref) {
|
|
362
344
|
onClickEdit: canEdit && !multiple ? formOpen ? onCloseForm : onOpenForm : null,
|
363
345
|
onClickRemove: onClickRemove,
|
364
346
|
editButtonLabel: editButtonLabel
|
365
|
-
}))) : /*#__PURE__*/
|
347
|
+
}))) : /*#__PURE__*/React.createElement("div", {
|
366
348
|
className: "row align-items-center"
|
367
|
-
}, /*#__PURE__*/
|
349
|
+
}, /*#__PURE__*/React.createElement("div", {
|
368
350
|
className: "col-8 flex-grow-1"
|
369
|
-
}, /*#__PURE__*/
|
370
|
-
className:
|
351
|
+
}, /*#__PURE__*/React.createElement(Select, {
|
352
|
+
className: classNames(['py-1', 'shadow-none', _defineProperty(_defineProperty(_defineProperty({}, disabled, disabled), 'is-invalid', errors !== null), inputClassName, inputClassName !== null)]),
|
371
353
|
disabled: disabled,
|
372
354
|
name: name,
|
373
355
|
value: finalValue,
|
374
356
|
options: options,
|
375
357
|
isClearable: true,
|
376
358
|
isSearchable: true,
|
377
|
-
placeholder: utils.isMessage(placeholder) ? intl$1.formatMessage(placeholder) : /*#__PURE__*/
|
359
|
+
placeholder: utils.isMessage(placeholder) ? intl$1.formatMessage(placeholder) : /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
378
360
|
id: "oc3YLT",
|
379
361
|
defaultMessage: [{
|
380
362
|
"type": 0,
|
@@ -386,24 +368,24 @@ var ResourceItemField = function ResourceItemField(_ref) {
|
|
386
368
|
onFocus: onFocus,
|
387
369
|
onMenuScrollToBottom: onScrollEnd,
|
388
370
|
multiple: multiple
|
389
|
-
})), canFind ? /*#__PURE__*/
|
371
|
+
})), canFind ? /*#__PURE__*/React.createElement("div", {
|
390
372
|
className: "col-auto"
|
391
|
-
}, /*#__PURE__*/
|
373
|
+
}, /*#__PURE__*/React.createElement(Button, {
|
392
374
|
theme: "primary",
|
393
375
|
icon: findButtonLabel === null ? 'search' : null,
|
394
376
|
onClick: listOpen ? onCloseList : onOpenList,
|
395
377
|
outline: true
|
396
|
-
}, findButtonLabel)) : null, canCreate ? /*#__PURE__*/
|
378
|
+
}, findButtonLabel)) : null, canCreate ? /*#__PURE__*/React.createElement("div", {
|
397
379
|
className: "col-auto"
|
398
|
-
}, /*#__PURE__*/
|
380
|
+
}, /*#__PURE__*/React.createElement(Button, {
|
399
381
|
theme: "primary",
|
400
382
|
icon: createButtonLabel === null ? 'plus-lg' : null,
|
401
383
|
onClick: formOpen ? onCloseForm : onOpenForm,
|
402
384
|
outline: true
|
403
|
-
}, createButtonLabel)) : null), formOpen ? withoutModal ? /*#__PURE__*/
|
385
|
+
}, createButtonLabel)) : null), formOpen ? withoutModal ? /*#__PURE__*/React.createElement("div", {
|
404
386
|
className: "card mt-4 p-4"
|
405
|
-
}, form) : /*#__PURE__*/
|
406
|
-
title: hasValue && !multiple ? /*#__PURE__*/
|
387
|
+
}, form) : /*#__PURE__*/React.createElement(Dialog, {
|
388
|
+
title: hasValue && !multiple ? /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
407
389
|
values: resourceValues,
|
408
390
|
id: "mCfzkJ",
|
409
391
|
defaultMessage: [{
|
@@ -413,7 +395,7 @@ var ResourceItemField = function ResourceItemField(_ref) {
|
|
413
395
|
"type": 1,
|
414
396
|
"value": "a_singular"
|
415
397
|
}]
|
416
|
-
}) : /*#__PURE__*/
|
398
|
+
}) : /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
417
399
|
values: resourceValues,
|
418
400
|
id: "6viUpq",
|
419
401
|
defaultMessage: [{
|
@@ -426,7 +408,7 @@ var ResourceItemField = function ResourceItemField(_ref) {
|
|
426
408
|
}),
|
427
409
|
size: "lg",
|
428
410
|
onClose: onCloseForm
|
429
|
-
}, form) : null, listOpen ? /*#__PURE__*/
|
411
|
+
}, form) : null, listOpen ? /*#__PURE__*/React.createElement(ResourceItemsModal, {
|
430
412
|
resource: resourceId,
|
431
413
|
onClose: onCloseList,
|
432
414
|
listProps: {
|
@@ -446,5 +428,5 @@ var definition = {
|
|
446
428
|
component: 'ResourceItem'
|
447
429
|
};
|
448
430
|
|
449
|
-
exports
|
431
|
+
exports.default = ResourceItemField$1;
|
450
432
|
exports.definition = definition;
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@panneau/field-resource-item",
|
3
|
-
"version": "3.0.
|
3
|
+
"version": "3.0.126",
|
4
4
|
"description": "An item mapping a resource",
|
5
5
|
"keywords": [
|
6
6
|
"javascript"
|
@@ -33,7 +33,8 @@
|
|
33
33
|
"assets"
|
34
34
|
],
|
35
35
|
"scripts": {
|
36
|
-
"
|
36
|
+
"prepublishOnly": "npm run build",
|
37
|
+
"build": "../../scripts/prepare-package.sh"
|
37
38
|
},
|
38
39
|
"devDependencies": {
|
39
40
|
"react": "^16.8.0 || ^17.0.0 || ^18.0.0",
|
@@ -45,16 +46,16 @@
|
|
45
46
|
},
|
46
47
|
"dependencies": {
|
47
48
|
"@babel/runtime": "^7.12.5",
|
48
|
-
"@panneau/core": "^3.0.
|
49
|
-
"@panneau/data": "^3.0.
|
50
|
-
"@panneau/element-button": "^3.0.
|
51
|
-
"@panneau/element-resource-card": "^3.0.
|
52
|
-
"@panneau/element-select": "^3.0.
|
53
|
-
"@panneau/form-resource": "^3.0.
|
54
|
-
"@panneau/intl": "^3.0.
|
55
|
-
"@panneau/modal-dialog": "^3.0.
|
56
|
-
"@panneau/modal-resource-form": "^3.0.
|
57
|
-
"@panneau/modal-resource-items": "^3.0.
|
49
|
+
"@panneau/core": "^3.0.126",
|
50
|
+
"@panneau/data": "^3.0.126",
|
51
|
+
"@panneau/element-button": "^3.0.126",
|
52
|
+
"@panneau/element-resource-card": "^3.0.126",
|
53
|
+
"@panneau/element-select": "^3.0.126",
|
54
|
+
"@panneau/form-resource": "^3.0.126",
|
55
|
+
"@panneau/intl": "^3.0.126",
|
56
|
+
"@panneau/modal-dialog": "^3.0.126",
|
57
|
+
"@panneau/modal-resource-form": "^3.0.126",
|
58
|
+
"@panneau/modal-resource-items": "^3.0.126",
|
58
59
|
"classnames": "^2.2.6",
|
59
60
|
"lodash": "^4.17.21",
|
60
61
|
"prop-types": "^15.7.2",
|
@@ -63,5 +64,5 @@
|
|
63
64
|
"publishConfig": {
|
64
65
|
"access": "public"
|
65
66
|
},
|
66
|
-
"gitHead": "
|
67
|
+
"gitHead": "fa69ddff3f8cf22b00504093087608d5701e6f6a"
|
67
68
|
}
|