@panneau/medias 3.0.142 → 3.0.144
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/es/index.js +167 -111
- package/lib/index.js +167 -111
- package/package.json +13 -12
package/es/index.js
CHANGED
@@ -220,7 +220,7 @@ function MediaFrame(_ref) {
|
|
220
220
|
width: "100%"
|
221
221
|
}), /*#__PURE__*/React.createElement("div", {
|
222
222
|
className: styles.playButton
|
223
|
-
}, !showPlayer && (type === 'video' || type === 'embed') ? /*#__PURE__*/React.createElement(Button, {
|
223
|
+
}, !showPlayer && (type === 'video' || type === 'embed' || type === 'audio') ? /*#__PURE__*/React.createElement(Button, {
|
224
224
|
className: "rounded-circle",
|
225
225
|
theme: "secondary",
|
226
226
|
onClick: onClick,
|
@@ -230,97 +230,6 @@ function MediaFrame(_ref) {
|
|
230
230
|
MediaFrame.propTypes = propTypes$7;
|
231
231
|
MediaFrame.defaultProps = defaultProps$7;
|
232
232
|
|
233
|
-
var defaultMetadata = [{
|
234
|
-
title: /*#__PURE__*/React.createElement(FormattedMessage, {
|
235
|
-
id: "3RT69u",
|
236
|
-
defaultMessage: [{
|
237
|
-
"type": 0,
|
238
|
-
"value": "Informations"
|
239
|
-
}]
|
240
|
-
}),
|
241
|
-
items: [{
|
242
|
-
id: 'user',
|
243
|
-
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
244
|
-
id: "yByaBh",
|
245
|
-
defaultMessage: [{
|
246
|
-
"type": 0,
|
247
|
-
"value": "Added by"
|
248
|
-
}]
|
249
|
-
}),
|
250
|
-
component: 'avatar',
|
251
|
-
path: 'user'
|
252
|
-
}, {
|
253
|
-
id: 'created_at',
|
254
|
-
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
255
|
-
id: "PN+75e",
|
256
|
-
defaultMessage: [{
|
257
|
-
"type": 0,
|
258
|
-
"value": "Created at"
|
259
|
-
}]
|
260
|
-
}),
|
261
|
-
component: 'date',
|
262
|
-
path: 'created_at',
|
263
|
-
format: 'yyyy-MM-dd hh:ss'
|
264
|
-
}]
|
265
|
-
}, {
|
266
|
-
title: /*#__PURE__*/React.createElement(FormattedMessage, {
|
267
|
-
id: "xKUOLG",
|
268
|
-
defaultMessage: [{
|
269
|
-
"type": 0,
|
270
|
-
"value": "Technical details"
|
271
|
-
}]
|
272
|
-
}),
|
273
|
-
items: [{
|
274
|
-
id: 'format',
|
275
|
-
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
276
|
-
id: "JuxiUN",
|
277
|
-
defaultMessage: [{
|
278
|
-
"type": 0,
|
279
|
-
"value": "Format"
|
280
|
-
}]
|
281
|
-
}),
|
282
|
-
component: 'unit',
|
283
|
-
format: 'format',
|
284
|
-
path: 'format'
|
285
|
-
}, {
|
286
|
-
id: 'dimensions',
|
287
|
-
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
288
|
-
id: "rmJBin",
|
289
|
-
defaultMessage: [{
|
290
|
-
"type": 0,
|
291
|
-
"value": "Dimensions"
|
292
|
-
}]
|
293
|
-
}),
|
294
|
-
component: 'unit',
|
295
|
-
format: 'dimensions',
|
296
|
-
path: 'metadata'
|
297
|
-
}, {
|
298
|
-
id: 'size',
|
299
|
-
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
300
|
-
id: "g2CRt5",
|
301
|
-
defaultMessage: [{
|
302
|
-
"type": 0,
|
303
|
-
"value": "Size"
|
304
|
-
}]
|
305
|
-
}),
|
306
|
-
component: 'unit',
|
307
|
-
format: 'bytes',
|
308
|
-
path: 'metadata.size'
|
309
|
-
}, {
|
310
|
-
id: 'duration',
|
311
|
-
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
312
|
-
id: "wU++NJ",
|
313
|
-
defaultMessage: [{
|
314
|
-
"type": 0,
|
315
|
-
"value": "Duration"
|
316
|
-
}]
|
317
|
-
}),
|
318
|
-
component: 'unit',
|
319
|
-
format: 'duration',
|
320
|
-
path: 'metadata.duration'
|
321
|
-
}]
|
322
|
-
}];
|
323
|
-
|
324
233
|
var _excluded$5 = ["label", "path", "component"];
|
325
234
|
var propTypes$6 = {
|
326
235
|
value: PropTypes.shape({
|
@@ -332,36 +241,68 @@ var propTypes$6 = {
|
|
332
241
|
title: PropTypes.node,
|
333
242
|
items: PropTypes.arrayOf(PropTypes.shape({})) // displays
|
334
243
|
})),
|
244
|
+
displays: PropTypes.arrayOf(PropTypes.shape({
|
245
|
+
section: PropTypes.string
|
246
|
+
})),
|
335
247
|
className: PropTypes.string
|
336
248
|
};
|
337
249
|
var defaultProps$6 = {
|
338
250
|
value: null,
|
339
|
-
sections:
|
251
|
+
sections: null,
|
252
|
+
displays: null,
|
340
253
|
className: null
|
341
254
|
};
|
342
255
|
function MediaMetadata(_ref) {
|
343
256
|
var sections = _ref.sections,
|
257
|
+
displays = _ref.displays,
|
344
258
|
value = _ref.value,
|
345
259
|
className = _ref.className;
|
346
260
|
var displayComponents = useDisplaysComponentsManager();
|
261
|
+
var finalSections = useMemo(function () {
|
262
|
+
var displaysWithoutSection = (displays || []).filter(function (_ref2) {
|
263
|
+
var _ref2$section = _ref2.section,
|
264
|
+
section = _ref2$section === void 0 ? null : _ref2$section;
|
265
|
+
return section === null;
|
266
|
+
});
|
267
|
+
return (sections || []).map(function (_ref3) {
|
268
|
+
var _ref3$id = _ref3.id,
|
269
|
+
id = _ref3$id === void 0 ? null : _ref3$id,
|
270
|
+
_ref3$title = _ref3.title,
|
271
|
+
title = _ref3$title === void 0 ? null : _ref3$title;
|
272
|
+
return {
|
273
|
+
id: id,
|
274
|
+
title: title,
|
275
|
+
items: (displays || []).filter(function (_ref4) {
|
276
|
+
var _ref4$section = _ref4.section,
|
277
|
+
section = _ref4$section === void 0 ? null : _ref4$section;
|
278
|
+
return section === id;
|
279
|
+
})
|
280
|
+
};
|
281
|
+
}).concat({
|
282
|
+
title: null,
|
283
|
+
items: displaysWithoutSection
|
284
|
+
});
|
285
|
+
}, [sections, displays]);
|
347
286
|
return /*#__PURE__*/React.createElement("div", {
|
348
287
|
className: classNames(['px-2', _defineProperty({}, className, className !== null)])
|
349
|
-
}, (
|
350
|
-
var title =
|
351
|
-
|
288
|
+
}, (finalSections || []).map(function (_ref6, i) {
|
289
|
+
var _ref6$title = _ref6.title,
|
290
|
+
title = _ref6$title === void 0 ? null : _ref6$title,
|
291
|
+
_ref6$items = _ref6.items,
|
292
|
+
items = _ref6$items === void 0 ? [] : _ref6$items;
|
352
293
|
return /*#__PURE__*/React.createElement("div", {
|
353
294
|
className: "mb-5",
|
354
295
|
key: "section-".concat(i + 1)
|
355
|
-
}, /*#__PURE__*/React.createElement("h6", {
|
296
|
+
}, title !== null ? /*#__PURE__*/React.createElement("h6", {
|
356
297
|
className: "px-1"
|
357
|
-
}, title), /*#__PURE__*/React.createElement("ul", {
|
298
|
+
}, title) : null, /*#__PURE__*/React.createElement("ul", {
|
358
299
|
className: "list-group list-group-flush"
|
359
|
-
}, (items || []).map(function (
|
360
|
-
var label =
|
361
|
-
path =
|
362
|
-
|
363
|
-
component =
|
364
|
-
props = _objectWithoutProperties(
|
300
|
+
}, (items || []).map(function (_ref7, index) {
|
301
|
+
var label = _ref7.label,
|
302
|
+
path = _ref7.path,
|
303
|
+
_ref7$component = _ref7.component,
|
304
|
+
component = _ref7$component === void 0 ? null : _ref7$component,
|
305
|
+
props = _objectWithoutProperties(_ref7, _excluded$5);
|
365
306
|
var Component = displayComponents.getComponent(component || 'text');
|
366
307
|
var itemValue = get(value, path, null);
|
367
308
|
return Component !== null && itemValue !== null ? /*#__PURE__*/React.createElement("li", {
|
@@ -421,6 +362,105 @@ var defaultFields = [
|
|
421
362
|
// },
|
422
363
|
];
|
423
364
|
|
365
|
+
var defaultDisplays = [{
|
366
|
+
id: 'user',
|
367
|
+
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
368
|
+
id: "yByaBh",
|
369
|
+
defaultMessage: [{
|
370
|
+
"type": 0,
|
371
|
+
"value": "Added by"
|
372
|
+
}]
|
373
|
+
}),
|
374
|
+
component: 'avatar',
|
375
|
+
path: 'user',
|
376
|
+
section: 'info'
|
377
|
+
}, {
|
378
|
+
id: 'created_at',
|
379
|
+
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
380
|
+
id: "PN+75e",
|
381
|
+
defaultMessage: [{
|
382
|
+
"type": 0,
|
383
|
+
"value": "Created at"
|
384
|
+
}]
|
385
|
+
}),
|
386
|
+
component: 'date',
|
387
|
+
path: 'created_at',
|
388
|
+
format: 'yyyy-MM-dd hh:ss',
|
389
|
+
section: 'info'
|
390
|
+
}, {
|
391
|
+
id: 'format',
|
392
|
+
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
393
|
+
id: "JuxiUN",
|
394
|
+
defaultMessage: [{
|
395
|
+
"type": 0,
|
396
|
+
"value": "Format"
|
397
|
+
}]
|
398
|
+
}),
|
399
|
+
component: 'unit',
|
400
|
+
format: 'format',
|
401
|
+
path: 'format',
|
402
|
+
section: 'technical'
|
403
|
+
}, {
|
404
|
+
id: 'dimensions',
|
405
|
+
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
406
|
+
id: "rmJBin",
|
407
|
+
defaultMessage: [{
|
408
|
+
"type": 0,
|
409
|
+
"value": "Dimensions"
|
410
|
+
}]
|
411
|
+
}),
|
412
|
+
component: 'unit',
|
413
|
+
format: 'dimensions',
|
414
|
+
path: 'metadata',
|
415
|
+
section: 'technical'
|
416
|
+
}, {
|
417
|
+
id: 'size',
|
418
|
+
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
419
|
+
id: "g2CRt5",
|
420
|
+
defaultMessage: [{
|
421
|
+
"type": 0,
|
422
|
+
"value": "Size"
|
423
|
+
}]
|
424
|
+
}),
|
425
|
+
component: 'unit',
|
426
|
+
format: 'bytes',
|
427
|
+
path: 'metadata.size',
|
428
|
+
section: 'technical'
|
429
|
+
}, {
|
430
|
+
id: 'duration',
|
431
|
+
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
432
|
+
id: "wU++NJ",
|
433
|
+
defaultMessage: [{
|
434
|
+
"type": 0,
|
435
|
+
"value": "Duration"
|
436
|
+
}]
|
437
|
+
}),
|
438
|
+
component: 'unit',
|
439
|
+
format: 'duration',
|
440
|
+
path: 'metadata.duration',
|
441
|
+
section: 'technical'
|
442
|
+
}];
|
443
|
+
|
444
|
+
var defaultSections = [{
|
445
|
+
id: 'info',
|
446
|
+
title: /*#__PURE__*/React.createElement(FormattedMessage, {
|
447
|
+
id: "3RT69u",
|
448
|
+
defaultMessage: [{
|
449
|
+
"type": 0,
|
450
|
+
"value": "Informations"
|
451
|
+
}]
|
452
|
+
})
|
453
|
+
}, {
|
454
|
+
id: 'technical',
|
455
|
+
title: /*#__PURE__*/React.createElement(FormattedMessage, {
|
456
|
+
id: "xKUOLG",
|
457
|
+
defaultMessage: [{
|
458
|
+
"type": 0,
|
459
|
+
"value": "Technical details"
|
460
|
+
}]
|
461
|
+
})
|
462
|
+
}];
|
463
|
+
|
424
464
|
var propTypes$5 = {
|
425
465
|
value: PropTypes.shape({
|
426
466
|
id: PropTypes.string
|
@@ -428,6 +468,10 @@ var propTypes$5 = {
|
|
428
468
|
fields: PropTypes.arrayOf(PropTypes.shape({
|
429
469
|
name: PropTypes.string
|
430
470
|
})),
|
471
|
+
sections: PropTypes.arrayOf(PropTypes.shape({
|
472
|
+
id: PropTypes.string,
|
473
|
+
title: PropTypes.string
|
474
|
+
})),
|
431
475
|
displays: PropTypes.arrayOf(PropTypes.shape({
|
432
476
|
name: PropTypes.string
|
433
477
|
})),
|
@@ -440,7 +484,8 @@ var propTypes$5 = {
|
|
440
484
|
var defaultProps$5 = {
|
441
485
|
value: null,
|
442
486
|
fields: defaultFields,
|
443
|
-
|
487
|
+
sections: defaultSections,
|
488
|
+
displays: defaultDisplays,
|
444
489
|
onClose: null,
|
445
490
|
onDelete: null,
|
446
491
|
className: null
|
@@ -448,11 +493,12 @@ var defaultProps$5 = {
|
|
448
493
|
function MediaForm(_ref) {
|
449
494
|
var initialValue = _ref.value,
|
450
495
|
initialFields = _ref.fields,
|
496
|
+
sections = _ref.sections,
|
451
497
|
displays = _ref.displays,
|
452
498
|
onChange = _ref.onChange,
|
453
|
-
onConfirm = _ref.onConfirm
|
454
|
-
_ref.onDelete
|
455
|
-
|
499
|
+
onConfirm = _ref.onConfirm,
|
500
|
+
onDelete = _ref.onDelete,
|
501
|
+
onClose = _ref.onClose,
|
456
502
|
className = _ref.className;
|
457
503
|
var FieldsComponent = useFieldComponent('fields');
|
458
504
|
var _useMediaUpdate = useMediaUpdate$1(),
|
@@ -488,6 +534,9 @@ function MediaForm(_ref) {
|
|
488
534
|
if (onClose !== null) {
|
489
535
|
onClose();
|
490
536
|
}
|
537
|
+
if (onDelete !== null) {
|
538
|
+
onDelete();
|
539
|
+
}
|
491
540
|
setChanged(false);
|
492
541
|
}, [destroy, setChanged]);
|
493
542
|
var postForm = useCallback(function (action, data) {
|
@@ -508,7 +557,7 @@ function MediaForm(_ref) {
|
|
508
557
|
_useForm.generalError;
|
509
558
|
_useForm.errors;
|
510
559
|
return /*#__PURE__*/React.createElement("div", {
|
511
|
-
className: classNames([
|
560
|
+
className: classNames(['text-body', _defineProperty({}, className, className !== null)])
|
512
561
|
}, /*#__PURE__*/React.createElement("div", {
|
513
562
|
className: "d-flex w-100 justify-content-between mb-2 pb-2 border-bottom"
|
514
563
|
}, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h4", {
|
@@ -560,6 +609,7 @@ function MediaForm(_ref) {
|
|
560
609
|
})), /*#__PURE__*/React.createElement(MediaMetadata, {
|
561
610
|
className: "mt-5",
|
562
611
|
value: value,
|
612
|
+
sections: sections,
|
563
613
|
displays: displays
|
564
614
|
}))));
|
565
615
|
}
|
@@ -766,6 +816,7 @@ var defaultFilters = [{
|
|
766
816
|
var _excluded$4 = ["page", "count"];
|
767
817
|
var propTypes$4 = {
|
768
818
|
items: PropTypes$1.medias,
|
819
|
+
buttons: PropTypes$1.buttons,
|
769
820
|
filters: PropTypes$1.filters,
|
770
821
|
columns: PropTypes$1.tableColumns,
|
771
822
|
query: PropTypes.shape({}),
|
@@ -783,6 +834,7 @@ var propTypes$4 = {
|
|
783
834
|
};
|
784
835
|
var defaultProps$4 = {
|
785
836
|
items: null,
|
837
|
+
buttons: null,
|
786
838
|
filters: defaultFilters,
|
787
839
|
columns: defaultColumns,
|
788
840
|
fields: defaultFields,
|
@@ -811,6 +863,7 @@ var defaultProps$4 = {
|
|
811
863
|
function MediasBrowser(_ref) {
|
812
864
|
var initialItems = _ref.items,
|
813
865
|
baseUrl = _ref.baseUrl,
|
866
|
+
buttons = _ref.buttons,
|
814
867
|
filters = _ref.filters,
|
815
868
|
columns = _ref.columns,
|
816
869
|
initialQuery = _ref.query,
|
@@ -914,13 +967,16 @@ function MediasBrowser(_ref) {
|
|
914
967
|
}))), /*#__PURE__*/React.createElement(MediaForm, {
|
915
968
|
value: media,
|
916
969
|
onClose: onCloseMedia
|
917
|
-
})) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(
|
970
|
+
})) : /*#__PURE__*/React.createElement(React.Fragment, null, buttons !== null ? /*#__PURE__*/React.createElement(Buttons, {
|
971
|
+
items: buttons,
|
972
|
+
className: "mb-2"
|
973
|
+
}) : null, filters !== null ? /*#__PURE__*/React.createElement(Filters, {
|
918
974
|
value: query,
|
919
975
|
filters: filters,
|
920
976
|
onChange: onQueryChange,
|
921
977
|
onReset: onQueryReset,
|
922
978
|
theme: theme
|
923
|
-
}), /*#__PURE__*/React.createElement("div", {
|
979
|
+
}) : null, /*#__PURE__*/React.createElement("div", {
|
924
980
|
className: classNames(['d-flex', 'mt-1', 'mb-3', {
|
925
981
|
'justify-content-between': hasLayouts,
|
926
982
|
'justify-content-end': !hasLayouts
|
package/lib/index.js
CHANGED
@@ -224,7 +224,7 @@ function MediaFrame(_ref) {
|
|
224
224
|
width: "100%"
|
225
225
|
}), /*#__PURE__*/React.createElement("div", {
|
226
226
|
className: styles.playButton
|
227
|
-
}, !showPlayer && (type === 'video' || type === 'embed') ? /*#__PURE__*/React.createElement(Button, {
|
227
|
+
}, !showPlayer && (type === 'video' || type === 'embed' || type === 'audio') ? /*#__PURE__*/React.createElement(Button, {
|
228
228
|
className: "rounded-circle",
|
229
229
|
theme: "secondary",
|
230
230
|
onClick: onClick,
|
@@ -234,97 +234,6 @@ function MediaFrame(_ref) {
|
|
234
234
|
MediaFrame.propTypes = propTypes$7;
|
235
235
|
MediaFrame.defaultProps = defaultProps$7;
|
236
236
|
|
237
|
-
var defaultMetadata = [{
|
238
|
-
title: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
239
|
-
id: "3RT69u",
|
240
|
-
defaultMessage: [{
|
241
|
-
"type": 0,
|
242
|
-
"value": "Informations"
|
243
|
-
}]
|
244
|
-
}),
|
245
|
-
items: [{
|
246
|
-
id: 'user',
|
247
|
-
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
248
|
-
id: "yByaBh",
|
249
|
-
defaultMessage: [{
|
250
|
-
"type": 0,
|
251
|
-
"value": "Added by"
|
252
|
-
}]
|
253
|
-
}),
|
254
|
-
component: 'avatar',
|
255
|
-
path: 'user'
|
256
|
-
}, {
|
257
|
-
id: 'created_at',
|
258
|
-
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
259
|
-
id: "PN+75e",
|
260
|
-
defaultMessage: [{
|
261
|
-
"type": 0,
|
262
|
-
"value": "Created at"
|
263
|
-
}]
|
264
|
-
}),
|
265
|
-
component: 'date',
|
266
|
-
path: 'created_at',
|
267
|
-
format: 'yyyy-MM-dd hh:ss'
|
268
|
-
}]
|
269
|
-
}, {
|
270
|
-
title: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
271
|
-
id: "xKUOLG",
|
272
|
-
defaultMessage: [{
|
273
|
-
"type": 0,
|
274
|
-
"value": "Technical details"
|
275
|
-
}]
|
276
|
-
}),
|
277
|
-
items: [{
|
278
|
-
id: 'format',
|
279
|
-
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
280
|
-
id: "JuxiUN",
|
281
|
-
defaultMessage: [{
|
282
|
-
"type": 0,
|
283
|
-
"value": "Format"
|
284
|
-
}]
|
285
|
-
}),
|
286
|
-
component: 'unit',
|
287
|
-
format: 'format',
|
288
|
-
path: 'format'
|
289
|
-
}, {
|
290
|
-
id: 'dimensions',
|
291
|
-
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
292
|
-
id: "rmJBin",
|
293
|
-
defaultMessage: [{
|
294
|
-
"type": 0,
|
295
|
-
"value": "Dimensions"
|
296
|
-
}]
|
297
|
-
}),
|
298
|
-
component: 'unit',
|
299
|
-
format: 'dimensions',
|
300
|
-
path: 'metadata'
|
301
|
-
}, {
|
302
|
-
id: 'size',
|
303
|
-
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
304
|
-
id: "g2CRt5",
|
305
|
-
defaultMessage: [{
|
306
|
-
"type": 0,
|
307
|
-
"value": "Size"
|
308
|
-
}]
|
309
|
-
}),
|
310
|
-
component: 'unit',
|
311
|
-
format: 'bytes',
|
312
|
-
path: 'metadata.size'
|
313
|
-
}, {
|
314
|
-
id: 'duration',
|
315
|
-
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
316
|
-
id: "wU++NJ",
|
317
|
-
defaultMessage: [{
|
318
|
-
"type": 0,
|
319
|
-
"value": "Duration"
|
320
|
-
}]
|
321
|
-
}),
|
322
|
-
component: 'unit',
|
323
|
-
format: 'duration',
|
324
|
-
path: 'metadata.duration'
|
325
|
-
}]
|
326
|
-
}];
|
327
|
-
|
328
237
|
var _excluded$5 = ["label", "path", "component"];
|
329
238
|
var propTypes$6 = {
|
330
239
|
value: PropTypes.shape({
|
@@ -336,36 +245,68 @@ var propTypes$6 = {
|
|
336
245
|
title: PropTypes.node,
|
337
246
|
items: PropTypes.arrayOf(PropTypes.shape({})) // displays
|
338
247
|
})),
|
248
|
+
displays: PropTypes.arrayOf(PropTypes.shape({
|
249
|
+
section: PropTypes.string
|
250
|
+
})),
|
339
251
|
className: PropTypes.string
|
340
252
|
};
|
341
253
|
var defaultProps$6 = {
|
342
254
|
value: null,
|
343
|
-
sections:
|
255
|
+
sections: null,
|
256
|
+
displays: null,
|
344
257
|
className: null
|
345
258
|
};
|
346
259
|
function MediaMetadata(_ref) {
|
347
260
|
var sections = _ref.sections,
|
261
|
+
displays = _ref.displays,
|
348
262
|
value = _ref.value,
|
349
263
|
className = _ref.className;
|
350
264
|
var displayComponents = contexts.useDisplaysComponentsManager();
|
265
|
+
var finalSections = React.useMemo(function () {
|
266
|
+
var displaysWithoutSection = (displays || []).filter(function (_ref2) {
|
267
|
+
var _ref2$section = _ref2.section,
|
268
|
+
section = _ref2$section === void 0 ? null : _ref2$section;
|
269
|
+
return section === null;
|
270
|
+
});
|
271
|
+
return (sections || []).map(function (_ref3) {
|
272
|
+
var _ref3$id = _ref3.id,
|
273
|
+
id = _ref3$id === void 0 ? null : _ref3$id,
|
274
|
+
_ref3$title = _ref3.title,
|
275
|
+
title = _ref3$title === void 0 ? null : _ref3$title;
|
276
|
+
return {
|
277
|
+
id: id,
|
278
|
+
title: title,
|
279
|
+
items: (displays || []).filter(function (_ref4) {
|
280
|
+
var _ref4$section = _ref4.section,
|
281
|
+
section = _ref4$section === void 0 ? null : _ref4$section;
|
282
|
+
return section === id;
|
283
|
+
})
|
284
|
+
};
|
285
|
+
}).concat({
|
286
|
+
title: null,
|
287
|
+
items: displaysWithoutSection
|
288
|
+
});
|
289
|
+
}, [sections, displays]);
|
351
290
|
return /*#__PURE__*/React.createElement("div", {
|
352
291
|
className: classNames(['px-2', _defineProperty({}, className, className !== null)])
|
353
|
-
}, (
|
354
|
-
var title =
|
355
|
-
|
292
|
+
}, (finalSections || []).map(function (_ref6, i) {
|
293
|
+
var _ref6$title = _ref6.title,
|
294
|
+
title = _ref6$title === void 0 ? null : _ref6$title,
|
295
|
+
_ref6$items = _ref6.items,
|
296
|
+
items = _ref6$items === void 0 ? [] : _ref6$items;
|
356
297
|
return /*#__PURE__*/React.createElement("div", {
|
357
298
|
className: "mb-5",
|
358
299
|
key: "section-".concat(i + 1)
|
359
|
-
}, /*#__PURE__*/React.createElement("h6", {
|
300
|
+
}, title !== null ? /*#__PURE__*/React.createElement("h6", {
|
360
301
|
className: "px-1"
|
361
|
-
}, title), /*#__PURE__*/React.createElement("ul", {
|
302
|
+
}, title) : null, /*#__PURE__*/React.createElement("ul", {
|
362
303
|
className: "list-group list-group-flush"
|
363
|
-
}, (items || []).map(function (
|
364
|
-
var label =
|
365
|
-
path =
|
366
|
-
|
367
|
-
component =
|
368
|
-
props = _objectWithoutProperties(
|
304
|
+
}, (items || []).map(function (_ref7, index) {
|
305
|
+
var label = _ref7.label,
|
306
|
+
path = _ref7.path,
|
307
|
+
_ref7$component = _ref7.component,
|
308
|
+
component = _ref7$component === void 0 ? null : _ref7$component,
|
309
|
+
props = _objectWithoutProperties(_ref7, _excluded$5);
|
369
310
|
var Component = displayComponents.getComponent(component || 'text');
|
370
311
|
var itemValue = lodash.get(value, path, null);
|
371
312
|
return Component !== null && itemValue !== null ? /*#__PURE__*/React.createElement("li", {
|
@@ -425,6 +366,105 @@ var defaultFields = [
|
|
425
366
|
// },
|
426
367
|
];
|
427
368
|
|
369
|
+
var defaultDisplays = [{
|
370
|
+
id: 'user',
|
371
|
+
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
372
|
+
id: "yByaBh",
|
373
|
+
defaultMessage: [{
|
374
|
+
"type": 0,
|
375
|
+
"value": "Added by"
|
376
|
+
}]
|
377
|
+
}),
|
378
|
+
component: 'avatar',
|
379
|
+
path: 'user',
|
380
|
+
section: 'info'
|
381
|
+
}, {
|
382
|
+
id: 'created_at',
|
383
|
+
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
384
|
+
id: "PN+75e",
|
385
|
+
defaultMessage: [{
|
386
|
+
"type": 0,
|
387
|
+
"value": "Created at"
|
388
|
+
}]
|
389
|
+
}),
|
390
|
+
component: 'date',
|
391
|
+
path: 'created_at',
|
392
|
+
format: 'yyyy-MM-dd hh:ss',
|
393
|
+
section: 'info'
|
394
|
+
}, {
|
395
|
+
id: 'format',
|
396
|
+
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
397
|
+
id: "JuxiUN",
|
398
|
+
defaultMessage: [{
|
399
|
+
"type": 0,
|
400
|
+
"value": "Format"
|
401
|
+
}]
|
402
|
+
}),
|
403
|
+
component: 'unit',
|
404
|
+
format: 'format',
|
405
|
+
path: 'format',
|
406
|
+
section: 'technical'
|
407
|
+
}, {
|
408
|
+
id: 'dimensions',
|
409
|
+
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
410
|
+
id: "rmJBin",
|
411
|
+
defaultMessage: [{
|
412
|
+
"type": 0,
|
413
|
+
"value": "Dimensions"
|
414
|
+
}]
|
415
|
+
}),
|
416
|
+
component: 'unit',
|
417
|
+
format: 'dimensions',
|
418
|
+
path: 'metadata',
|
419
|
+
section: 'technical'
|
420
|
+
}, {
|
421
|
+
id: 'size',
|
422
|
+
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
423
|
+
id: "g2CRt5",
|
424
|
+
defaultMessage: [{
|
425
|
+
"type": 0,
|
426
|
+
"value": "Size"
|
427
|
+
}]
|
428
|
+
}),
|
429
|
+
component: 'unit',
|
430
|
+
format: 'bytes',
|
431
|
+
path: 'metadata.size',
|
432
|
+
section: 'technical'
|
433
|
+
}, {
|
434
|
+
id: 'duration',
|
435
|
+
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
436
|
+
id: "wU++NJ",
|
437
|
+
defaultMessage: [{
|
438
|
+
"type": 0,
|
439
|
+
"value": "Duration"
|
440
|
+
}]
|
441
|
+
}),
|
442
|
+
component: 'unit',
|
443
|
+
format: 'duration',
|
444
|
+
path: 'metadata.duration',
|
445
|
+
section: 'technical'
|
446
|
+
}];
|
447
|
+
|
448
|
+
var defaultSections = [{
|
449
|
+
id: 'info',
|
450
|
+
title: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
451
|
+
id: "3RT69u",
|
452
|
+
defaultMessage: [{
|
453
|
+
"type": 0,
|
454
|
+
"value": "Informations"
|
455
|
+
}]
|
456
|
+
})
|
457
|
+
}, {
|
458
|
+
id: 'technical',
|
459
|
+
title: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
460
|
+
id: "xKUOLG",
|
461
|
+
defaultMessage: [{
|
462
|
+
"type": 0,
|
463
|
+
"value": "Technical details"
|
464
|
+
}]
|
465
|
+
})
|
466
|
+
}];
|
467
|
+
|
428
468
|
var propTypes$5 = {
|
429
469
|
value: PropTypes.shape({
|
430
470
|
id: PropTypes.string
|
@@ -432,6 +472,10 @@ var propTypes$5 = {
|
|
432
472
|
fields: PropTypes.arrayOf(PropTypes.shape({
|
433
473
|
name: PropTypes.string
|
434
474
|
})),
|
475
|
+
sections: PropTypes.arrayOf(PropTypes.shape({
|
476
|
+
id: PropTypes.string,
|
477
|
+
title: PropTypes.string
|
478
|
+
})),
|
435
479
|
displays: PropTypes.arrayOf(PropTypes.shape({
|
436
480
|
name: PropTypes.string
|
437
481
|
})),
|
@@ -444,7 +488,8 @@ var propTypes$5 = {
|
|
444
488
|
var defaultProps$5 = {
|
445
489
|
value: null,
|
446
490
|
fields: defaultFields,
|
447
|
-
|
491
|
+
sections: defaultSections,
|
492
|
+
displays: defaultDisplays,
|
448
493
|
onClose: null,
|
449
494
|
onDelete: null,
|
450
495
|
className: null
|
@@ -452,11 +497,12 @@ var defaultProps$5 = {
|
|
452
497
|
function MediaForm(_ref) {
|
453
498
|
var initialValue = _ref.value,
|
454
499
|
initialFields = _ref.fields,
|
500
|
+
sections = _ref.sections,
|
455
501
|
displays = _ref.displays,
|
456
502
|
onChange = _ref.onChange,
|
457
|
-
onConfirm = _ref.onConfirm
|
458
|
-
_ref.onDelete
|
459
|
-
|
503
|
+
onConfirm = _ref.onConfirm,
|
504
|
+
onDelete = _ref.onDelete,
|
505
|
+
onClose = _ref.onClose,
|
460
506
|
className = _ref.className;
|
461
507
|
var FieldsComponent = contexts.useFieldComponent('fields');
|
462
508
|
var _useMediaUpdate = useMediaUpdate$1(),
|
@@ -492,6 +538,9 @@ function MediaForm(_ref) {
|
|
492
538
|
if (onClose !== null) {
|
493
539
|
onClose();
|
494
540
|
}
|
541
|
+
if (onDelete !== null) {
|
542
|
+
onDelete();
|
543
|
+
}
|
495
544
|
setChanged(false);
|
496
545
|
}, [destroy, setChanged]);
|
497
546
|
var postForm = React.useCallback(function (action, data) {
|
@@ -512,7 +561,7 @@ function MediaForm(_ref) {
|
|
512
561
|
_useForm.generalError;
|
513
562
|
_useForm.errors;
|
514
563
|
return /*#__PURE__*/React.createElement("div", {
|
515
|
-
className: classNames([
|
564
|
+
className: classNames(['text-body', _defineProperty({}, className, className !== null)])
|
516
565
|
}, /*#__PURE__*/React.createElement("div", {
|
517
566
|
className: "d-flex w-100 justify-content-between mb-2 pb-2 border-bottom"
|
518
567
|
}, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h4", {
|
@@ -564,6 +613,7 @@ function MediaForm(_ref) {
|
|
564
613
|
})), /*#__PURE__*/React.createElement(MediaMetadata, {
|
565
614
|
className: "mt-5",
|
566
615
|
value: value,
|
616
|
+
sections: sections,
|
567
617
|
displays: displays
|
568
618
|
}))));
|
569
619
|
}
|
@@ -770,6 +820,7 @@ var defaultFilters = [{
|
|
770
820
|
var _excluded$4 = ["page", "count"];
|
771
821
|
var propTypes$4 = {
|
772
822
|
items: core.PropTypes.medias,
|
823
|
+
buttons: core.PropTypes.buttons,
|
773
824
|
filters: core.PropTypes.filters,
|
774
825
|
columns: core.PropTypes.tableColumns,
|
775
826
|
query: PropTypes.shape({}),
|
@@ -787,6 +838,7 @@ var propTypes$4 = {
|
|
787
838
|
};
|
788
839
|
var defaultProps$4 = {
|
789
840
|
items: null,
|
841
|
+
buttons: null,
|
790
842
|
filters: defaultFilters,
|
791
843
|
columns: defaultColumns,
|
792
844
|
fields: defaultFields,
|
@@ -815,6 +867,7 @@ var defaultProps$4 = {
|
|
815
867
|
function MediasBrowser(_ref) {
|
816
868
|
var initialItems = _ref.items,
|
817
869
|
baseUrl = _ref.baseUrl,
|
870
|
+
buttons = _ref.buttons,
|
818
871
|
filters = _ref.filters,
|
819
872
|
columns = _ref.columns,
|
820
873
|
initialQuery = _ref.query,
|
@@ -918,13 +971,16 @@ function MediasBrowser(_ref) {
|
|
918
971
|
}))), /*#__PURE__*/React.createElement(MediaForm, {
|
919
972
|
value: media,
|
920
973
|
onClose: onCloseMedia
|
921
|
-
})) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(
|
974
|
+
})) : /*#__PURE__*/React.createElement(React.Fragment, null, buttons !== null ? /*#__PURE__*/React.createElement(Buttons, {
|
975
|
+
items: buttons,
|
976
|
+
className: "mb-2"
|
977
|
+
}) : null, filters !== null ? /*#__PURE__*/React.createElement(Filters, {
|
922
978
|
value: query,
|
923
979
|
filters: filters,
|
924
980
|
onChange: onQueryChange,
|
925
981
|
onReset: onQueryReset,
|
926
982
|
theme: theme
|
927
|
-
}), /*#__PURE__*/React.createElement("div", {
|
983
|
+
}) : null, /*#__PURE__*/React.createElement("div", {
|
928
984
|
className: classNames(['d-flex', 'mt-1', 'mb-3', {
|
929
985
|
'justify-content-between': hasLayouts,
|
930
986
|
'justify-content-end': !hasLayouts
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@panneau/medias",
|
3
|
-
"version": "3.0.
|
3
|
+
"version": "3.0.144",
|
4
4
|
"description": "",
|
5
5
|
"keywords": [
|
6
6
|
"javascript"
|
@@ -48,16 +48,17 @@
|
|
48
48
|
"@babel/runtime": "^7.12.5",
|
49
49
|
"@panneau/core": "^3.0.142",
|
50
50
|
"@panneau/data": "^3.0.142",
|
51
|
-
"@panneau/element-button": "^3.0.
|
52
|
-
"@panneau/element-buttons": "^3.0.
|
53
|
-
"@panneau/element-
|
54
|
-
"@panneau/element-
|
55
|
-
"@panneau/element-
|
56
|
-
"@panneau/element-media-
|
57
|
-
"@panneau/element-media-
|
58
|
-
"@panneau/element-
|
59
|
-
"@panneau/element-
|
60
|
-
"@panneau/
|
51
|
+
"@panneau/element-button": "^3.0.144",
|
52
|
+
"@panneau/element-buttons": "^3.0.144",
|
53
|
+
"@panneau/element-form": "^3.0.144",
|
54
|
+
"@panneau/element-grid": "^3.0.144",
|
55
|
+
"@panneau/element-icon": "^3.0.144",
|
56
|
+
"@panneau/element-media-card": "^3.0.144",
|
57
|
+
"@panneau/element-media-player": "^3.0.143",
|
58
|
+
"@panneau/element-media-preview": "^3.0.144",
|
59
|
+
"@panneau/element-pagination": "^3.0.144",
|
60
|
+
"@panneau/element-table": "^3.0.144",
|
61
|
+
"@panneau/filter-filters": "^3.0.144",
|
61
62
|
"classnames": "^2.5.1",
|
62
63
|
"lodash": "^4.17.21",
|
63
64
|
"prop-types": "^15.7.2",
|
@@ -66,5 +67,5 @@
|
|
66
67
|
"publishConfig": {
|
67
68
|
"access": "public"
|
68
69
|
},
|
69
|
-
"gitHead": "
|
70
|
+
"gitHead": "7e808b4380825a4669092203eae4deaf4e39e74b"
|
70
71
|
}
|