@selfcommunity/react-ui 0.11.0-mui7.19 → 0.11.0-mui7.21
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/cjs/components/EventForm/EventForm.js +28 -16
- package/lib/cjs/components/FeedObjectMediaPreview/FeedObjectMediaPreview.js +1 -1
- package/lib/cjs/components/LessonReleaseMenu/LessonReleaseMenu.js +7 -4
- package/lib/cjs/components/PaymentOrders/PaymentOrders.js +14 -8
- package/lib/cjs/components/PlatformWidget/PlatformWidget.js +2 -2
- package/lib/cjs/shared/Media/File/DisplayComponent.js +1 -1
- package/lib/cjs/shared/Media/Link/DisplayComponent.js +4 -12
- package/lib/cjs/shared/PasswordTextField/index.js +2 -2
- package/lib/esm/components/EventForm/EventForm.js +28 -16
- package/lib/esm/components/FeedObjectMediaPreview/FeedObjectMediaPreview.js +1 -1
- package/lib/esm/components/LessonReleaseMenu/LessonReleaseMenu.js +7 -4
- package/lib/esm/components/PaymentOrders/PaymentOrders.js +14 -8
- package/lib/esm/components/PlatformWidget/PlatformWidget.js +2 -2
- package/lib/esm/shared/Media/File/DisplayComponent.js +1 -1
- package/lib/esm/shared/Media/Link/DisplayComponent.js +5 -13
- package/lib/esm/shared/PasswordTextField/index.js +2 -2
- package/lib/umd/react-ui.js +1 -1
- package/package.json +8 -8
|
@@ -377,10 +377,13 @@ function EventForm(inProps) {
|
|
|
377
377
|
}
|
|
378
378
|
}, error: Boolean(field.name.length > Event_1.EVENT_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: field.name.length > Event_1.EVENT_TITLE_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.name.error.maxLength", defaultMessage: "ui.eventForm.name.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.dateTime }, { children: (0, jsx_runtime_1.jsxs)(x_date_pickers_1.LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns_1.AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? it_1.it : en_US_1.enUS, localeText: {
|
|
379
379
|
cancelButtonLabel: `${intl.formatMessage(messages.pickerCancelAction)}`
|
|
380
|
-
} }, { children: [(0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, disablePast: !event, minDate: minStartDate, label: field.startDate && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.date.placeholder", defaultMessage: "ui.eventForm.date.placeholder" }), value: field.startDate, slots: {
|
|
381
|
-
textField: (params) =>
|
|
382
|
-
|
|
383
|
-
}
|
|
380
|
+
} }, { children: [(0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, disablePast: !event, minDate: minStartDate, label: field.startDate && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.date.placeholder", defaultMessage: "ui.eventForm.date.placeholder" }), value: field.startDate, enableAccessibleFieldDOMStructure: false, slots: {
|
|
381
|
+
textField: (params) => {
|
|
382
|
+
var _a;
|
|
383
|
+
return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { slotProps: {
|
|
384
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.startDate)}`, startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) }) }))) })
|
|
385
|
+
} })));
|
|
386
|
+
}
|
|
384
387
|
}, slotProps: {
|
|
385
388
|
toolbar: {
|
|
386
389
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
|
|
@@ -390,10 +393,13 @@ function EventForm(inProps) {
|
|
|
390
393
|
}, onChange: (value) => {
|
|
391
394
|
handleChangeDateTime(value, 'startDate');
|
|
392
395
|
handleChangeDateTime(value, 'startTime');
|
|
393
|
-
} }), (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileTimePicker, { className: classes.picker, disablePast: disablePastStartTime, minTime: minStartTime, label: field.startTime && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.time.placeholder", defaultMessage: "ui.eventForm.time.placeholder" }), value: field.startTime, slots: {
|
|
394
|
-
textField: (params) =>
|
|
395
|
-
|
|
396
|
-
}
|
|
396
|
+
} }), (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileTimePicker, { className: classes.picker, disablePast: disablePastStartTime, minTime: minStartTime, label: field.startTime && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.time.placeholder", defaultMessage: "ui.eventForm.time.placeholder" }), value: field.startTime, enableAccessibleFieldDOMStructure: false, slots: {
|
|
397
|
+
textField: (params) => {
|
|
398
|
+
var _a;
|
|
399
|
+
return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { slotProps: {
|
|
400
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.startTime)}`, startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "access_time" }) }) }))) })
|
|
401
|
+
} })));
|
|
402
|
+
}
|
|
397
403
|
}, slotProps: {
|
|
398
404
|
toolbar: {
|
|
399
405
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
|
|
@@ -410,10 +416,13 @@ function EventForm(inProps) {
|
|
|
410
416
|
return ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.eventForm.frequency.${selected}.placeholder`, defaultMessage: `ui.eventForm.frequency.${selected}.placeholder` }));
|
|
411
417
|
}, startAdornment: (0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "frequency" }) }) })) }, { children: Object.values(types_1.SCEventRecurrenceType).map((f) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ value: f }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.eventForm.frequency.${f}.placeholder`, defaultMessage: `ui.eventForm.frequency.${f}.placeholder` }) }), f))) }))] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.dateTime }, { children: (0, jsx_runtime_1.jsxs)(x_date_pickers_1.LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns_1.AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? it_1.it : en_US_1.enUS, localeText: {
|
|
412
418
|
cancelButtonLabel: `${intl.formatMessage(messages.pickerCancelAction)}`
|
|
413
|
-
} }, { children: [(0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, minDate: field.startDate, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.date.end.placeholder", defaultMessage: "ui.eventForm.date.end.placeholder" }), value: field.endDate, slots: {
|
|
414
|
-
textField: (params) =>
|
|
415
|
-
|
|
416
|
-
}
|
|
419
|
+
} }, { children: [(0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, minDate: field.startDate, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.date.end.placeholder", defaultMessage: "ui.eventForm.date.end.placeholder" }), value: field.endDate, enableAccessibleFieldDOMStructure: false, slots: {
|
|
420
|
+
textField: (params) => {
|
|
421
|
+
var _a;
|
|
422
|
+
return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { slotProps: {
|
|
423
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.endDate)}`, startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "calendar_off" }) }) }))) })
|
|
424
|
+
} })));
|
|
425
|
+
}
|
|
417
426
|
}, slotProps: {
|
|
418
427
|
toolbar: {
|
|
419
428
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
|
|
@@ -423,10 +432,13 @@ function EventForm(inProps) {
|
|
|
423
432
|
}, onChange: (value) => {
|
|
424
433
|
handleChangeDateTime(value, 'endDate');
|
|
425
434
|
handleChangeDateTime(value, 'endTime');
|
|
426
|
-
}, shouldDisableDate: shouldDisableDate }), (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileTimePicker, { className: classes.picker, disablePast: disablePastEndTime, label: field.endTime && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.time.end.placeholder", defaultMessage: "ui.eventForm.time.end.placeholder" }), value: field.endTime, slots: {
|
|
427
|
-
textField: (params) =>
|
|
428
|
-
|
|
429
|
-
}
|
|
435
|
+
}, shouldDisableDate: shouldDisableDate }), (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileTimePicker, { className: classes.picker, disablePast: disablePastEndTime, label: field.endTime && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.time.end.placeholder", defaultMessage: "ui.eventForm.time.end.placeholder" }), value: field.endTime, enableAccessibleFieldDOMStructure: false, slots: {
|
|
436
|
+
textField: (params) => {
|
|
437
|
+
var _a;
|
|
438
|
+
return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { slotProps: {
|
|
439
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.endTime)}`, startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "access_time" }) }) }))) })
|
|
440
|
+
} })));
|
|
441
|
+
}
|
|
430
442
|
}, slotProps: {
|
|
431
443
|
toolbar: {
|
|
432
444
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
|
|
@@ -59,6 +59,6 @@ exports.default = (inProps) => {
|
|
|
59
59
|
*/
|
|
60
60
|
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.root) }, rest, { children: mediaObjectTypes.map((mediaObject) => {
|
|
61
61
|
const { displayProps = {} } = mediaObject;
|
|
62
|
-
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(mediaObject.displayComponent, Object.assign({ medias: medias }, displayProps, { onMediaClick: handleMediaClick })) }, mediaObject.name));
|
|
62
|
+
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(mediaObject.displayComponent, Object.assign({ medias: medias }, displayProps, (mediaObject.name !== 'share' && { onMediaClick: handleMediaClick }))) }, mediaObject.name));
|
|
63
63
|
}) })));
|
|
64
64
|
};
|
|
@@ -139,12 +139,15 @@ function LessonReleaseMenu(inProps) {
|
|
|
139
139
|
okButtonLabel: `${intl.formatMessage(messages.pickerOkMessage)}`,
|
|
140
140
|
cancelButtonLabel: `${intl.formatMessage(messages.pickerCancelMessage)}`,
|
|
141
141
|
clearButtonLabel: `${intl.formatMessage(messages.pickerClearMessage)}`
|
|
142
|
-
} }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDateTimePicker, { className: classes.picker, disablePast: true, label: drippedAt && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.lessonReleaseMenu.scheduled.picker.placeholder", defaultMessage: "ui.lessonReleaseMenu.scheduled.picker.placeholder" })), value: drippedAt, slots: {
|
|
142
|
+
} }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDateTimePicker, { className: classes.picker, disablePast: true, label: drippedAt && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.lessonReleaseMenu.scheduled.picker.placeholder", defaultMessage: "ui.lessonReleaseMenu.scheduled.picker.placeholder" })), value: drippedAt, enableAccessibleFieldDOMStructure: false, slots: {
|
|
143
143
|
//actionBar: PickerActionBar,
|
|
144
144
|
tabs: (props) => (0, jsx_runtime_1.jsx)(x_date_pickers_1.DateTimePickerTabs, Object.assign({}, props)),
|
|
145
|
-
textField: (params) =>
|
|
146
|
-
|
|
147
|
-
}
|
|
145
|
+
textField: (params) => {
|
|
146
|
+
var _a;
|
|
147
|
+
return ((0, jsx_runtime_1.jsx)(material_2.TextField, Object.assign({}, params, { error: false, slotProps: {
|
|
148
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.pickerPlaceholder)}`, endAdornment: ((0, jsx_runtime_1.jsx)(material_2.InputAdornment, Object.assign({ position: "end" }, { children: (0, jsx_runtime_1.jsx)(material_2.IconButton, Object.assign({ disabled: isDisabled }, { children: (0, jsx_runtime_1.jsx)(material_2.Icon, { children: "expand_more" }) })) }))) })
|
|
149
|
+
} })));
|
|
150
|
+
}
|
|
148
151
|
}, slotProps: {
|
|
149
152
|
tabs: {
|
|
150
153
|
hidden: false
|
|
@@ -223,10 +223,13 @@ function PaymentOrders(inProps) {
|
|
|
223
223
|
} }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { xs: 12, md: 3 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({ select: true, fullWidth: true, disabled: isLoading, size: "small", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.contentTypeFilter", defaultMessage: "ui.paymentOrders.contentTypeFilter" }), value: contentTypeFilter, onChange: handleContentTypeChange }, { children: options.map((option) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ value: option.value }, { children: option.label }), option.value))) })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { xs: 12, sm: 8, md: 4 } }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns_1.AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? it_1.it : en_US_1.enUS, localeText: {
|
|
224
224
|
cancelButtonLabel: `${intl.formatMessage(messages.pickerCancelAction)}`,
|
|
225
225
|
clearButtonLabel: `${intl.formatMessage(messages.pickerClearAction)}`
|
|
226
|
-
} }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: 2 }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: 6 }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.dateFrom", defaultMessage: "ui.paymentOrders.dateFrom" }), value: startDate, slots: {
|
|
227
|
-
textField: (params) =>
|
|
228
|
-
|
|
229
|
-
}
|
|
226
|
+
} }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: 2 }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: 6 }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.dateFrom", defaultMessage: "ui.paymentOrders.dateFrom" }), value: startDate, enableAccessibleFieldDOMStructure: false, slots: {
|
|
227
|
+
textField: (params) => {
|
|
228
|
+
var _a;
|
|
229
|
+
return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { size: "small", slotProps: {
|
|
230
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.dateFrom)}`, endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) }) }))) })
|
|
231
|
+
} })));
|
|
232
|
+
}
|
|
230
233
|
}, slotProps: {
|
|
231
234
|
actionBar: {
|
|
232
235
|
actions: ['cancel', 'clear', 'accept']
|
|
@@ -236,10 +239,13 @@ function PaymentOrders(inProps) {
|
|
|
236
239
|
// @ts-ignore
|
|
237
240
|
toolbarTitle: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.picker.date", defaultMessage: "ui.paymentOrders.picker.date" })
|
|
238
241
|
}
|
|
239
|
-
}, onChange: (newValue) => setStartDate(newValue) }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: 6 }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.dateTo", defaultMessage: "ui.paymentOrders.dateTo" }), value: endDate, slots: {
|
|
240
|
-
textField: (params) =>
|
|
241
|
-
|
|
242
|
-
}
|
|
242
|
+
}, onChange: (newValue) => setStartDate(newValue) }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: 6 }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.dateTo", defaultMessage: "ui.paymentOrders.dateTo" }), value: endDate, enableAccessibleFieldDOMStructure: false, slots: {
|
|
243
|
+
textField: (params) => {
|
|
244
|
+
var _a;
|
|
245
|
+
return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { size: "small", slotProps: {
|
|
246
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.dateTo)}`, endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) }) }))) })
|
|
247
|
+
} })));
|
|
248
|
+
}
|
|
243
249
|
}, slotProps: {
|
|
244
250
|
actionBar: {
|
|
245
251
|
actions: ['cancel', 'clear', 'accept']
|
|
@@ -57,11 +57,11 @@ const Root = (0, material_1.styled)(Widget_1.default, {
|
|
|
57
57
|
display: 'flex',
|
|
58
58
|
paddingBottom: 0,
|
|
59
59
|
boxShadow: 'inset -1px -3px 7px -4px #CECECE',
|
|
60
|
-
|
|
60
|
+
WebkitOverflowScrolling: 'touch',
|
|
61
61
|
overflowX: 'auto',
|
|
62
62
|
overflowY: 'hidden',
|
|
63
63
|
scrollbarWidth: 'none' /* Firefox */,
|
|
64
|
-
|
|
64
|
+
MsOverflowStyle: 'none' /* IE and Edge */,
|
|
65
65
|
'&::-webkit-scrollbar': {
|
|
66
66
|
display: 'none'
|
|
67
67
|
}
|
|
@@ -63,7 +63,7 @@ exports.default = (props) => {
|
|
|
63
63
|
return;
|
|
64
64
|
}
|
|
65
65
|
setPreview(index);
|
|
66
|
-
onMediaClick(images[index]);
|
|
66
|
+
onMediaClick === null || onMediaClick === void 0 ? void 0 : onMediaClick(images[index]);
|
|
67
67
|
}, [gallery, setPreview, images, onMediaClick]);
|
|
68
68
|
// RENDERING
|
|
69
69
|
const renderTitle = (o) => {
|
|
@@ -27,13 +27,13 @@ const classes = {
|
|
|
27
27
|
const Root = (0, material_1.styled)(material_1.Box, {
|
|
28
28
|
name: constants_1.PREFIX,
|
|
29
29
|
slot: 'DisplayRoot'
|
|
30
|
-
})(
|
|
30
|
+
})();
|
|
31
31
|
exports.default = (props) => {
|
|
32
32
|
// PROPS
|
|
33
33
|
const { className = '', medias, fullWidth = false, onMediaClick = null } = props, rest = tslib_1.__rest(props, ["className", "medias", "fullWidth", "onMediaClick"]);
|
|
34
34
|
// HANDLERS
|
|
35
35
|
const handleLinkClick = (link) => {
|
|
36
|
-
onMediaClick
|
|
36
|
+
onMediaClick === null || onMediaClick === void 0 ? void 0 : onMediaClick(link);
|
|
37
37
|
};
|
|
38
38
|
// MEMO
|
|
39
39
|
const _medias = (0, react_1.useMemo)(() => medias.filter(filter_1.default), [medias]);
|
|
@@ -48,15 +48,7 @@ exports.default = (props) => {
|
|
|
48
48
|
// return renderHtml(media, key);
|
|
49
49
|
// }
|
|
50
50
|
const domain = new URL(media.embed.metadata.url).hostname.replace('www.', '');
|
|
51
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.displayLink }, { children: [media.embed.metadata.images && media.embed.metadata.images.length > 0 && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: fullWidth ? ((0, jsx_runtime_1.jsx)(material_1.Box, { className: (0, classnames_1.default)(classes.thumbnailFullWidth, classes.image), style: { background: `url(${media.image})`, paddingBottom: `${100 / media.image_width / media.image_height}%` } })) : ((0, jsx_runtime_1.jsx)(material_1.Box, { className: (0, classnames_1.default)(classes.thumbnail, classes.image), style: { background: `url(${media.image})` } })) })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.snippet }, { children: [(0, jsx_runtime_1.jsx)("b", Object.assign({ className: classes.snippetTitle }, { children: media.embed.metadata.title })), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("p", Object.assign({ className: classes.snippetDescription }, { children: media.embed.metadata.description })), (0, jsx_runtime_1.jsx)("a", Object.assign({ href: media.embed.metadata.url, target:
|
|
52
|
-
};
|
|
53
|
-
/**
|
|
54
|
-
* Render html embed
|
|
55
|
-
* @param media
|
|
56
|
-
* @param key
|
|
57
|
-
*/
|
|
58
|
-
const renderHtml = (media, key) => {
|
|
59
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.displayHtmlWrap }, { children: [(0, jsx_runtime_1.jsx)("div", { dangerouslySetInnerHTML: { __html: media.embed.metadata.html }, className: classes.displayHtml }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes.displayHtmlPlaceholder, style: { paddingTop: `${(100 * media.embed.metadata.height) / media.embed.metadata.width}%`, maxHeight: media.embed.metadata.height } }, { children: (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 20, className: classes.displayHtmlLoading }) }))] }), key));
|
|
51
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.displayLink }, { children: [media.embed.metadata.images && media.embed.metadata.images.length > 0 && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: fullWidth ? ((0, jsx_runtime_1.jsx)(material_1.Box, { className: (0, classnames_1.default)(classes.thumbnailFullWidth, classes.image), style: { background: `url(${media.image})`, paddingBottom: `${100 / media.image_width / media.image_height}%` } })) : ((0, jsx_runtime_1.jsx)(material_1.Box, { className: (0, classnames_1.default)(classes.thumbnail, classes.image), style: { background: `url(${media.image})` } })) })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.snippet }, { children: [(0, jsx_runtime_1.jsx)("b", Object.assign({ className: classes.snippetTitle }, { children: media.embed.metadata.title })), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("p", Object.assign({ className: classes.snippetDescription }, { children: media.embed.metadata.description })), (0, jsx_runtime_1.jsx)("a", Object.assign({ href: media.embed.metadata.url, target: "_blank", onClick: () => handleLinkClick(media) }, { children: domain }))] })), (0, jsx_runtime_1.jsx)("div", { style: { clear: 'both' } })] }), key));
|
|
60
52
|
};
|
|
61
53
|
/**
|
|
62
54
|
* Renders component
|
|
@@ -66,7 +58,7 @@ exports.default = (props) => {
|
|
|
66
58
|
}
|
|
67
59
|
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.displayRoot) }, rest, { children: _medias.map((l, i) => {
|
|
68
60
|
if (l.embed.metadata && l.embed.metadata.type === Media_1.MEDIA_TYPE_VIDEO) {
|
|
69
|
-
return (0, jsx_runtime_1.jsx)(AutoPlayer_1.default, { url: l.url, width:
|
|
61
|
+
return (0, jsx_runtime_1.jsx)(AutoPlayer_1.default, { url: l.url, width: "100%", height: 360, onVideoWatch: () => handleLinkClick(l) }, i);
|
|
70
62
|
}
|
|
71
63
|
return (0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: renderPreview(l, i) }, i);
|
|
72
64
|
}) })));
|
|
@@ -10,7 +10,7 @@ const Root = (0, material_1.styled)(material_1.TextField, {
|
|
|
10
10
|
overridesResolver: (_props, styles) => styles.root
|
|
11
11
|
})(() => ({}));
|
|
12
12
|
function PasswordTextField(props) {
|
|
13
|
-
var _a;
|
|
13
|
+
var _a, _b;
|
|
14
14
|
// STATE
|
|
15
15
|
const [showPassword, setShowPassword] = (0, react_1.useState)(false);
|
|
16
16
|
// HANDLERS
|
|
@@ -20,7 +20,7 @@ function PasswordTextField(props) {
|
|
|
20
20
|
// RENDER
|
|
21
21
|
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ type: showPassword ? 'text' : 'password' }, props, { slotProps: {
|
|
22
22
|
input: {
|
|
23
|
-
endAdornment: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(_a = props === null || props === void 0 ? void 0 : props.slotProps.input) === null ||
|
|
23
|
+
endAdornment: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(_b = (_a = props === null || props === void 0 ? void 0 : props.slotProps) === null || _a === void 0 ? void 0 : _a.input) === null || _b === void 0 ? void 0 : _b['endAdornment'], (0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ "aria-label": "toggle password visibility", onClick: handleClick, edge: "end" }, { children: showPassword ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "visibility_off" }) : (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "visibility" }) })) }))] }))
|
|
24
24
|
}
|
|
25
25
|
} })));
|
|
26
26
|
}
|
|
@@ -375,10 +375,13 @@ export default function EventForm(inProps) {
|
|
|
375
375
|
}
|
|
376
376
|
}, error: Boolean(field.name.length > EVENT_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: field.name.length > EVENT_TITLE_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.eventForm.name.error.maxLength", defaultMessage: "ui.eventForm.name.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), _jsx(Box, Object.assign({ className: classes.dateTime }, { children: _jsxs(LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? it : enUS, localeText: {
|
|
377
377
|
cancelButtonLabel: `${intl.formatMessage(messages.pickerCancelAction)}`
|
|
378
|
-
} }, { children: [_jsx(MobileDatePicker, { className: classes.picker, disablePast: !event, minDate: minStartDate, label: field.startDate && _jsx(FormattedMessage, { id: "ui.eventForm.date.placeholder", defaultMessage: "ui.eventForm.date.placeholder" }), value: field.startDate, slots: {
|
|
379
|
-
textField: (params) =>
|
|
380
|
-
|
|
381
|
-
}
|
|
378
|
+
} }, { children: [_jsx(MobileDatePicker, { className: classes.picker, disablePast: !event, minDate: minStartDate, label: field.startDate && _jsx(FormattedMessage, { id: "ui.eventForm.date.placeholder", defaultMessage: "ui.eventForm.date.placeholder" }), value: field.startDate, enableAccessibleFieldDOMStructure: false, slots: {
|
|
379
|
+
textField: (params) => {
|
|
380
|
+
var _a;
|
|
381
|
+
return (_jsx(TextField, Object.assign({}, params, { slotProps: {
|
|
382
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.startDate)}`, startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "CalendarIcon" }) }) }))) })
|
|
383
|
+
} })));
|
|
384
|
+
}
|
|
382
385
|
}, slotProps: {
|
|
383
386
|
toolbar: {
|
|
384
387
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
|
|
@@ -388,10 +391,13 @@ export default function EventForm(inProps) {
|
|
|
388
391
|
}, onChange: (value) => {
|
|
389
392
|
handleChangeDateTime(value, 'startDate');
|
|
390
393
|
handleChangeDateTime(value, 'startTime');
|
|
391
|
-
} }), _jsx(MobileTimePicker, { className: classes.picker, disablePast: disablePastStartTime, minTime: minStartTime, label: field.startTime && _jsx(FormattedMessage, { id: "ui.eventForm.time.placeholder", defaultMessage: "ui.eventForm.time.placeholder" }), value: field.startTime, slots: {
|
|
392
|
-
textField: (params) =>
|
|
393
|
-
|
|
394
|
-
}
|
|
394
|
+
} }), _jsx(MobileTimePicker, { className: classes.picker, disablePast: disablePastStartTime, minTime: minStartTime, label: field.startTime && _jsx(FormattedMessage, { id: "ui.eventForm.time.placeholder", defaultMessage: "ui.eventForm.time.placeholder" }), value: field.startTime, enableAccessibleFieldDOMStructure: false, slots: {
|
|
395
|
+
textField: (params) => {
|
|
396
|
+
var _a;
|
|
397
|
+
return (_jsx(TextField, Object.assign({}, params, { slotProps: {
|
|
398
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.startTime)}`, startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "access_time" }) }) }))) })
|
|
399
|
+
} })));
|
|
400
|
+
}
|
|
395
401
|
}, slotProps: {
|
|
396
402
|
toolbar: {
|
|
397
403
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
|
|
@@ -408,10 +414,13 @@ export default function EventForm(inProps) {
|
|
|
408
414
|
return (_jsx(FormattedMessage, { id: `ui.eventForm.frequency.${selected}.placeholder`, defaultMessage: `ui.eventForm.frequency.${selected}.placeholder` }));
|
|
409
415
|
}, startAdornment: _jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "frequency" }) }) })) }, { children: Object.values(SCEventRecurrenceType).map((f) => (_jsx(MenuItem, Object.assign({ value: f }, { children: _jsx(FormattedMessage, { id: `ui.eventForm.frequency.${f}.placeholder`, defaultMessage: `ui.eventForm.frequency.${f}.placeholder` }) }), f))) }))] })), _jsx(Box, Object.assign({ className: classes.dateTime }, { children: _jsxs(LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? it : enUS, localeText: {
|
|
410
416
|
cancelButtonLabel: `${intl.formatMessage(messages.pickerCancelAction)}`
|
|
411
|
-
} }, { children: [_jsx(MobileDatePicker, { className: classes.picker, minDate: field.startDate, label: _jsx(FormattedMessage, { id: "ui.eventForm.date.end.placeholder", defaultMessage: "ui.eventForm.date.end.placeholder" }), value: field.endDate, slots: {
|
|
412
|
-
textField: (params) =>
|
|
413
|
-
|
|
414
|
-
}
|
|
417
|
+
} }, { children: [_jsx(MobileDatePicker, { className: classes.picker, minDate: field.startDate, label: _jsx(FormattedMessage, { id: "ui.eventForm.date.end.placeholder", defaultMessage: "ui.eventForm.date.end.placeholder" }), value: field.endDate, enableAccessibleFieldDOMStructure: false, slots: {
|
|
418
|
+
textField: (params) => {
|
|
419
|
+
var _a;
|
|
420
|
+
return (_jsx(TextField, Object.assign({}, params, { slotProps: {
|
|
421
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.endDate)}`, startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "calendar_off" }) }) }))) })
|
|
422
|
+
} })));
|
|
423
|
+
}
|
|
415
424
|
}, slotProps: {
|
|
416
425
|
toolbar: {
|
|
417
426
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
|
|
@@ -421,10 +430,13 @@ export default function EventForm(inProps) {
|
|
|
421
430
|
}, onChange: (value) => {
|
|
422
431
|
handleChangeDateTime(value, 'endDate');
|
|
423
432
|
handleChangeDateTime(value, 'endTime');
|
|
424
|
-
}, shouldDisableDate: shouldDisableDate }), _jsx(MobileTimePicker, { className: classes.picker, disablePast: disablePastEndTime, label: field.endTime && _jsx(FormattedMessage, { id: "ui.eventForm.time.end.placeholder", defaultMessage: "ui.eventForm.time.end.placeholder" }), value: field.endTime, slots: {
|
|
425
|
-
textField: (params) =>
|
|
426
|
-
|
|
427
|
-
}
|
|
433
|
+
}, shouldDisableDate: shouldDisableDate }), _jsx(MobileTimePicker, { className: classes.picker, disablePast: disablePastEndTime, label: field.endTime && _jsx(FormattedMessage, { id: "ui.eventForm.time.end.placeholder", defaultMessage: "ui.eventForm.time.end.placeholder" }), value: field.endTime, enableAccessibleFieldDOMStructure: false, slots: {
|
|
434
|
+
textField: (params) => {
|
|
435
|
+
var _a;
|
|
436
|
+
return (_jsx(TextField, Object.assign({}, params, { slotProps: {
|
|
437
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.endTime)}`, startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "access_time" }) }) }))) })
|
|
438
|
+
} })));
|
|
439
|
+
}
|
|
428
440
|
}, slotProps: {
|
|
429
441
|
toolbar: {
|
|
430
442
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
|
|
@@ -57,6 +57,6 @@ export default (inProps) => {
|
|
|
57
57
|
*/
|
|
58
58
|
return (_jsx(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: mediaObjectTypes.map((mediaObject) => {
|
|
59
59
|
const { displayProps = {} } = mediaObject;
|
|
60
|
-
return (_jsx("div", { children: _jsx(mediaObject.displayComponent, Object.assign({ medias: medias }, displayProps, { onMediaClick: handleMediaClick })) }, mediaObject.name));
|
|
60
|
+
return (_jsx("div", { children: _jsx(mediaObject.displayComponent, Object.assign({ medias: medias }, displayProps, (mediaObject.name !== 'share' && { onMediaClick: handleMediaClick }))) }, mediaObject.name));
|
|
61
61
|
}) })));
|
|
62
62
|
};
|
|
@@ -137,12 +137,15 @@ export default function LessonReleaseMenu(inProps) {
|
|
|
137
137
|
okButtonLabel: `${intl.formatMessage(messages.pickerOkMessage)}`,
|
|
138
138
|
cancelButtonLabel: `${intl.formatMessage(messages.pickerCancelMessage)}`,
|
|
139
139
|
clearButtonLabel: `${intl.formatMessage(messages.pickerClearMessage)}`
|
|
140
|
-
} }, { children: _jsx(MobileDateTimePicker, { className: classes.picker, disablePast: true, label: drippedAt && (_jsx(FormattedMessage, { id: "ui.lessonReleaseMenu.scheduled.picker.placeholder", defaultMessage: "ui.lessonReleaseMenu.scheduled.picker.placeholder" })), value: drippedAt, slots: {
|
|
140
|
+
} }, { children: _jsx(MobileDateTimePicker, { className: classes.picker, disablePast: true, label: drippedAt && (_jsx(FormattedMessage, { id: "ui.lessonReleaseMenu.scheduled.picker.placeholder", defaultMessage: "ui.lessonReleaseMenu.scheduled.picker.placeholder" })), value: drippedAt, enableAccessibleFieldDOMStructure: false, slots: {
|
|
141
141
|
//actionBar: PickerActionBar,
|
|
142
142
|
tabs: (props) => _jsx(DateTimePickerTabs, Object.assign({}, props)),
|
|
143
|
-
textField: (params) =>
|
|
144
|
-
|
|
145
|
-
}
|
|
143
|
+
textField: (params) => {
|
|
144
|
+
var _a;
|
|
145
|
+
return (_jsx(TextField, Object.assign({}, params, { error: false, slotProps: {
|
|
146
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.pickerPlaceholder)}`, endAdornment: (_jsx(InputAdornment, Object.assign({ position: "end" }, { children: _jsx(IconButton, Object.assign({ disabled: isDisabled }, { children: _jsx(Icon, { children: "expand_more" }) })) }))) })
|
|
147
|
+
} })));
|
|
148
|
+
}
|
|
146
149
|
}, slotProps: {
|
|
147
150
|
tabs: {
|
|
148
151
|
hidden: false
|
|
@@ -221,10 +221,13 @@ export default function PaymentOrders(inProps) {
|
|
|
221
221
|
} }) })), _jsx(Grid, Object.assign({ size: { xs: 12, md: 3 } }, { children: _jsx(TextField, Object.assign({ select: true, fullWidth: true, disabled: isLoading, size: "small", label: _jsx(FormattedMessage, { id: "ui.paymentOrders.contentTypeFilter", defaultMessage: "ui.paymentOrders.contentTypeFilter" }), value: contentTypeFilter, onChange: handleContentTypeChange }, { children: options.map((option) => (_jsx(MenuItem, Object.assign({ value: option.value }, { children: option.label }), option.value))) })) })), _jsx(Grid, Object.assign({ size: { xs: 12, sm: 8, md: 4 } }, { children: _jsx(LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? it : enUS, localeText: {
|
|
222
222
|
cancelButtonLabel: `${intl.formatMessage(messages.pickerCancelAction)}`,
|
|
223
223
|
clearButtonLabel: `${intl.formatMessage(messages.pickerClearAction)}`
|
|
224
|
-
} }, { children: _jsxs(Grid, Object.assign({ container: true, width: "100%", spacing: 2 }, { children: [_jsx(Grid, Object.assign({ size: 6 }, { children: _jsx(MobileDatePicker, { className: classes.picker, label: _jsx(FormattedMessage, { id: "ui.paymentOrders.dateFrom", defaultMessage: "ui.paymentOrders.dateFrom" }), value: startDate, slots: {
|
|
225
|
-
textField: (params) =>
|
|
226
|
-
|
|
227
|
-
}
|
|
224
|
+
} }, { children: _jsxs(Grid, Object.assign({ container: true, width: "100%", spacing: 2 }, { children: [_jsx(Grid, Object.assign({ size: 6 }, { children: _jsx(MobileDatePicker, { className: classes.picker, label: _jsx(FormattedMessage, { id: "ui.paymentOrders.dateFrom", defaultMessage: "ui.paymentOrders.dateFrom" }), value: startDate, enableAccessibleFieldDOMStructure: false, slots: {
|
|
225
|
+
textField: (params) => {
|
|
226
|
+
var _a;
|
|
227
|
+
return (_jsx(TextField, Object.assign({}, params, { size: "small", slotProps: {
|
|
228
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.dateFrom)}`, endAdornment: (_jsx(InputAdornment, Object.assign({ position: "end" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "CalendarIcon" }) }) }))) })
|
|
229
|
+
} })));
|
|
230
|
+
}
|
|
228
231
|
}, slotProps: {
|
|
229
232
|
actionBar: {
|
|
230
233
|
actions: ['cancel', 'clear', 'accept']
|
|
@@ -234,10 +237,13 @@ export default function PaymentOrders(inProps) {
|
|
|
234
237
|
// @ts-ignore
|
|
235
238
|
toolbarTitle: _jsx(FormattedMessage, { id: "ui.paymentOrders.picker.date", defaultMessage: "ui.paymentOrders.picker.date" })
|
|
236
239
|
}
|
|
237
|
-
}, onChange: (newValue) => setStartDate(newValue) }) })), _jsx(Grid, Object.assign({ size: 6 }, { children: _jsx(MobileDatePicker, { className: classes.picker, label: _jsx(FormattedMessage, { id: "ui.paymentOrders.dateTo", defaultMessage: "ui.paymentOrders.dateTo" }), value: endDate, slots: {
|
|
238
|
-
textField: (params) =>
|
|
239
|
-
|
|
240
|
-
}
|
|
240
|
+
}, onChange: (newValue) => setStartDate(newValue) }) })), _jsx(Grid, Object.assign({ size: 6 }, { children: _jsx(MobileDatePicker, { className: classes.picker, label: _jsx(FormattedMessage, { id: "ui.paymentOrders.dateTo", defaultMessage: "ui.paymentOrders.dateTo" }), value: endDate, enableAccessibleFieldDOMStructure: false, slots: {
|
|
241
|
+
textField: (params) => {
|
|
242
|
+
var _a;
|
|
243
|
+
return (_jsx(TextField, Object.assign({}, params, { size: "small", slotProps: {
|
|
244
|
+
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.dateTo)}`, endAdornment: (_jsx(InputAdornment, Object.assign({ position: "end" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "CalendarIcon" }) }) }))) })
|
|
245
|
+
} })));
|
|
246
|
+
}
|
|
241
247
|
}, slotProps: {
|
|
242
248
|
actionBar: {
|
|
243
249
|
actions: ['cancel', 'clear', 'accept']
|
|
@@ -55,11 +55,11 @@ const Root = styled(Widget, {
|
|
|
55
55
|
display: 'flex',
|
|
56
56
|
paddingBottom: 0,
|
|
57
57
|
boxShadow: 'inset -1px -3px 7px -4px #CECECE',
|
|
58
|
-
|
|
58
|
+
WebkitOverflowScrolling: 'touch',
|
|
59
59
|
overflowX: 'auto',
|
|
60
60
|
overflowY: 'hidden',
|
|
61
61
|
scrollbarWidth: 'none' /* Firefox */,
|
|
62
|
-
|
|
62
|
+
MsOverflowStyle: 'none' /* IE and Edge */,
|
|
63
63
|
'&::-webkit-scrollbar': {
|
|
64
64
|
display: 'none'
|
|
65
65
|
}
|
|
@@ -61,7 +61,7 @@ export default (props) => {
|
|
|
61
61
|
return;
|
|
62
62
|
}
|
|
63
63
|
setPreview(index);
|
|
64
|
-
onMediaClick(images[index]);
|
|
64
|
+
onMediaClick === null || onMediaClick === void 0 ? void 0 : onMediaClick(images[index]);
|
|
65
65
|
}, [gallery, setPreview, images, onMediaClick]);
|
|
66
66
|
// RENDERING
|
|
67
67
|
const renderTitle = (o) => {
|
|
@@ -5,7 +5,7 @@ import { MEDIA_TYPE_VIDEO } from '../../../constants/Media';
|
|
|
5
5
|
import AutoPlayer from '../../AutoPlayer';
|
|
6
6
|
import classNames from 'classnames';
|
|
7
7
|
import { PREFIX } from './constants';
|
|
8
|
-
import { styled,
|
|
8
|
+
import { styled, Box } from '@mui/material';
|
|
9
9
|
import filter from './filter';
|
|
10
10
|
const classes = {
|
|
11
11
|
displayRoot: `${PREFIX}-display-root`,
|
|
@@ -25,13 +25,13 @@ const classes = {
|
|
|
25
25
|
const Root = styled(Box, {
|
|
26
26
|
name: PREFIX,
|
|
27
27
|
slot: 'DisplayRoot'
|
|
28
|
-
})(
|
|
28
|
+
})();
|
|
29
29
|
export default (props) => {
|
|
30
30
|
// PROPS
|
|
31
31
|
const { className = '', medias, fullWidth = false, onMediaClick = null } = props, rest = __rest(props, ["className", "medias", "fullWidth", "onMediaClick"]);
|
|
32
32
|
// HANDLERS
|
|
33
33
|
const handleLinkClick = (link) => {
|
|
34
|
-
onMediaClick
|
|
34
|
+
onMediaClick === null || onMediaClick === void 0 ? void 0 : onMediaClick(link);
|
|
35
35
|
};
|
|
36
36
|
// MEMO
|
|
37
37
|
const _medias = useMemo(() => medias.filter(filter), [medias]);
|
|
@@ -46,15 +46,7 @@ export default (props) => {
|
|
|
46
46
|
// return renderHtml(media, key);
|
|
47
47
|
// }
|
|
48
48
|
const domain = new URL(media.embed.metadata.url).hostname.replace('www.', '');
|
|
49
|
-
return (_jsxs(Box, Object.assign({ className: classes.displayLink }, { children: [media.embed.metadata.images && media.embed.metadata.images.length > 0 && (_jsx(_Fragment, { children: fullWidth ? (_jsx(Box, { className: classNames(classes.thumbnailFullWidth, classes.image), style: { background: `url(${media.image})`, paddingBottom: `${100 / media.image_width / media.image_height}%` } })) : (_jsx(Box, { className: classNames(classes.thumbnail, classes.image), style: { background: `url(${media.image})` } })) })), _jsxs(Box, Object.assign({ className: classes.snippet }, { children: [_jsx("b", Object.assign({ className: classes.snippetTitle }, { children: media.embed.metadata.title })), _jsx("br", {}), _jsx("p", Object.assign({ className: classes.snippetDescription }, { children: media.embed.metadata.description })), _jsx("a", Object.assign({ href: media.embed.metadata.url, target:
|
|
50
|
-
};
|
|
51
|
-
/**
|
|
52
|
-
* Render html embed
|
|
53
|
-
* @param media
|
|
54
|
-
* @param key
|
|
55
|
-
*/
|
|
56
|
-
const renderHtml = (media, key) => {
|
|
57
|
-
return (_jsxs(Box, Object.assign({ className: classes.displayHtmlWrap }, { children: [_jsx("div", { dangerouslySetInnerHTML: { __html: media.embed.metadata.html }, className: classes.displayHtml }), _jsx("div", Object.assign({ className: classes.displayHtmlPlaceholder, style: { paddingTop: `${(100 * media.embed.metadata.height) / media.embed.metadata.width}%`, maxHeight: media.embed.metadata.height } }, { children: _jsx(CircularProgress, { size: 20, className: classes.displayHtmlLoading }) }))] }), key));
|
|
49
|
+
return (_jsxs(Box, Object.assign({ className: classes.displayLink }, { children: [media.embed.metadata.images && media.embed.metadata.images.length > 0 && (_jsx(_Fragment, { children: fullWidth ? (_jsx(Box, { className: classNames(classes.thumbnailFullWidth, classes.image), style: { background: `url(${media.image})`, paddingBottom: `${100 / media.image_width / media.image_height}%` } })) : (_jsx(Box, { className: classNames(classes.thumbnail, classes.image), style: { background: `url(${media.image})` } })) })), _jsxs(Box, Object.assign({ className: classes.snippet }, { children: [_jsx("b", Object.assign({ className: classes.snippetTitle }, { children: media.embed.metadata.title })), _jsx("br", {}), _jsx("p", Object.assign({ className: classes.snippetDescription }, { children: media.embed.metadata.description })), _jsx("a", Object.assign({ href: media.embed.metadata.url, target: "_blank", onClick: () => handleLinkClick(media) }, { children: domain }))] })), _jsx("div", { style: { clear: 'both' } })] }), key));
|
|
58
50
|
};
|
|
59
51
|
/**
|
|
60
52
|
* Renders component
|
|
@@ -64,7 +56,7 @@ export default (props) => {
|
|
|
64
56
|
}
|
|
65
57
|
return (_jsx(Root, Object.assign({ className: classNames(className, classes.displayRoot) }, rest, { children: _medias.map((l, i) => {
|
|
66
58
|
if (l.embed.metadata && l.embed.metadata.type === MEDIA_TYPE_VIDEO) {
|
|
67
|
-
return _jsx(AutoPlayer, { url: l.url, width:
|
|
59
|
+
return _jsx(AutoPlayer, { url: l.url, width: "100%", height: 360, onVideoWatch: () => handleLinkClick(l) }, i);
|
|
68
60
|
}
|
|
69
61
|
return _jsx(React.Fragment, { children: renderPreview(l, i) }, i);
|
|
70
62
|
}) })));
|
|
@@ -8,7 +8,7 @@ const Root = styled(TextField, {
|
|
|
8
8
|
overridesResolver: (_props, styles) => styles.root
|
|
9
9
|
})(() => ({}));
|
|
10
10
|
export default function PasswordTextField(props) {
|
|
11
|
-
var _a;
|
|
11
|
+
var _a, _b;
|
|
12
12
|
// STATE
|
|
13
13
|
const [showPassword, setShowPassword] = useState(false);
|
|
14
14
|
// HANDLERS
|
|
@@ -18,7 +18,7 @@ export default function PasswordTextField(props) {
|
|
|
18
18
|
// RENDER
|
|
19
19
|
return (_jsx(Root, Object.assign({ type: showPassword ? 'text' : 'password' }, props, { slotProps: {
|
|
20
20
|
input: {
|
|
21
|
-
endAdornment: (_jsxs(_Fragment, { children: [(_a = props === null || props === void 0 ? void 0 : props.slotProps.input) === null ||
|
|
21
|
+
endAdornment: (_jsxs(_Fragment, { children: [(_b = (_a = props === null || props === void 0 ? void 0 : props.slotProps) === null || _a === void 0 ? void 0 : _a.input) === null || _b === void 0 ? void 0 : _b['endAdornment'], _jsx(InputAdornment, Object.assign({ position: "end" }, { children: _jsx(IconButton, Object.assign({ "aria-label": "toggle password visibility", onClick: handleClick, edge: "end" }, { children: showPassword ? _jsx(Icon, { children: "visibility_off" }) : _jsx(Icon, { children: "visibility" }) })) }))] }))
|
|
22
22
|
}
|
|
23
23
|
} })));
|
|
24
24
|
}
|