@selfcommunity/react-ui 0.11.0-alpha.99 → 0.11.0-mui7.13

package/lib/cjs/components/Editor/shared/useDecorators.d.ts

@@ -7,10 +7,10 @@
  */
 import type { LexicalEditor } from 'lexical';
 import * as React from 'react';
-declare type ErrorBoundaryProps = {
+type ErrorBoundaryProps = {
     children: JSX.Element;
     onError: (error: Error) => void;
 };
-export declare type ErrorBoundaryType = React.ComponentClass<ErrorBoundaryProps> | React.FC<ErrorBoundaryProps>;
+export type ErrorBoundaryType = React.ComponentClass<ErrorBoundaryProps> | React.FC<ErrorBoundaryProps>;
 export declare function useDecorators(editor: LexicalEditor, ErrorBoundary: ErrorBoundaryType): Array<JSX.Element>;
 export {};

package/lib/cjs/components/EventAutocomplete/EventAutocomplete.js

@@ -16,7 +16,7 @@ const classes = {
 const Root = (0, material_1.styled)(material_1.Autocomplete, {
     name: PREFIX,
     slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
+    overridesResolver: (_props, styles) => styles.root
 })(() => ({}));
 /**
  * > API documentation for the Community-JS Event Autocomplete component. Learn about the available props and the CSS API.
@@ -72,7 +72,7 @@ const EventAutocomplete = (inProps) => {
     const handleClose = () => {
         setOpen(false);
     };
-    const handleChange = (e, value) => {
+    const handleChange = (_e, value) => {
         setValue(value);
     };
     // Render
@@ -87,7 +87,9 @@ const EventAutocomplete = (inProps) => {
             const parts = (0, parse_1.default)(option.name, matches);
             return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ component: "li" }, props, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.name, src: option.image_small, sx: { marginRight: 1 } }), (0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: parts.map((part, index) => ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ sx: { fontWeight: part.highlight ? 700 : 400, marginRight: 0.2 } }, { children: part.text }), index))) })] })));
         }, renderInput: (params) => {
-            return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, TextFieldProps, { margin: "dense", InputProps: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'events', endAdornment: ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [isLoading ? (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: "inherit", size: 20 }) : null, params.InputProps.endAdornment] })) }) })));
+            return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, TextFieldProps, { margin: "dense", slotProps: {
+                    input: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'events', endAdornment: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isLoading && (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: "inherit", size: 20 }), params.InputProps.endAdornment] })) })
+                } })));
         } }, rest)));
 };
 exports.default = EventAutocomplete;

package/lib/cjs/components/EventForm/EventAddress.js

@@ -153,8 +153,12 @@ function EventAddress(inProps) {
     if (!isInPersonTabActive && !isOnlineTabActive && !isLiveTabActive) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Tabs, Object.assign({ className: classes.tabs, value: location, onChange: handleChange, indicatorColor: "secondary", textColor: "secondary", variant: "fullWidth" }, { children: [isInPersonTabActive && ((0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "add_location_alt" }), iconPosition: "start", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.label", defaultMessage: "ui.eventForm.address.live.label" }) })), isOnlineTabActive && ((0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "play_circle_outline" }), iconPosition: "start", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.online.label", defaultMessage: "ui.eventForm.address.online.label" }) })), isLiveTabActive && ((0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.LIVESTREAM, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "photo_camera" }), iconPosition: "start", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.liveStream.label", defaultMessage: "ui.eventForm.address.liveStream.label" }) }))] })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.tabContent }, { children: [isInPersonTabActive && location === types_1.SCEventLocationType.PERSON && ((0, jsx_runtime_1.jsx)(material_1.Autocomplete, { disabled: !geocodingApiKey, size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation.description, noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), isOptionEqualToValue: (option, value) => option.description === value.description, renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.placeholder", defaultMessage: "ui.eventForm.address.live.placeholder" }), variant: "outlined", fullWidth: true, InputProps: Object.assign(Object.assign({}, params.InputProps), { endAdornment: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) }) }))) })), isOnlineTabActive && location === types_1.SCEventLocationType.ONLINE && ((0, jsx_runtime_1.jsx)(UrlTextField_1.default, { size: "small", fullWidth: true, type: "url", placeholder: `${intl.formatMessage(messages.virtualPlaceholder)}`, helperText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.online.help", defaultMessage: "ui.eventForm.address.online.help" }), InputProps: {
-                            endAdornment: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "play_circle_outline" })
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Tabs, Object.assign({ className: classes.tabs, value: location, onChange: handleChange, indicatorColor: "secondary", textColor: "secondary", variant: "fullWidth" }, { children: [isInPersonTabActive && ((0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "add_location_alt" }), iconPosition: "start", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.label", defaultMessage: "ui.eventForm.address.live.label" }) })), isOnlineTabActive && ((0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "play_circle_outline" }), iconPosition: "start", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.online.label", defaultMessage: "ui.eventForm.address.online.label" }) })), isLiveTabActive && ((0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.LIVESTREAM, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "photo_camera" }), iconPosition: "start", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.liveStream.label", defaultMessage: "ui.eventForm.address.liveStream.label" }) }))] })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.tabContent }, { children: [isInPersonTabActive && location === types_1.SCEventLocationType.PERSON && ((0, jsx_runtime_1.jsx)(material_1.Autocomplete, { disabled: !geocodingApiKey, size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation.description, noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), isOptionEqualToValue: (option, value) => option.description === value.description, renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.placeholder", defaultMessage: "ui.eventForm.address.live.placeholder" }), variant: "outlined", fullWidth: true, slotProps: {
+                                input: Object.assign(Object.assign({}, params.InputProps), { endAdornment: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) })
+                            } }))) })), isOnlineTabActive && location === types_1.SCEventLocationType.ONLINE && ((0, jsx_runtime_1.jsx)(UrlTextField_1.default, { size: "small", fullWidth: true, type: "url", placeholder: `${intl.formatMessage(messages.virtualPlaceholder)}`, helperText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.online.help", defaultMessage: "ui.eventForm.address.online.help" }), slotProps: {
+                            input: {
+                                endAdornment: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "play_circle_outline" })
+                            }
                         }, value: event ? event.link : '', onChange: handleLinkChange })), isLiveTabActive && location === types_1.SCEventLocationType.LIVESTREAM && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(LiveStream_1.default, { template: liveStream_1.SCLiveStreamTemplateType.SNIPPET, liveStream: liveStream, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}) }), (0, jsx_runtime_1.jsx)(LiveStreamFormSettings_1.default, { settings: liveStream.settings || constants_2.LIVESTREAM_DEFAULT_SETTINGS, onChange: handleLiveStreamSettingsChange })] }))] }))] })));
 }
 exports.default = EventAddress;

package/lib/cjs/components/EventForm/EventForm.js

@@ -372,12 +372,16 @@ function EventForm(inProps) {
     /**
      * Renders root object
      */
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: (0, jsx_runtime_1.jsx)(UploadEventCover_1.default, { isCreationMode: true, onChange: handleChangeCover }) })), Boolean(error['coverError']) && (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ color: "error" }, { children: error['coverError'] })), (0, jsx_runtime_1.jsxs)(material_1.FormGroup, Object.assign({ className: classes.form }, { children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, InputProps: {
-                            endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: Event_1.EVENT_TITLE_MAX_LENGTH - field.name.length }))
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: (0, jsx_runtime_1.jsx)(UploadEventCover_1.default, { isCreationMode: true, onChange: handleChangeCover }) })), Boolean(error['coverError']) && (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ color: "error" }, { children: error['coverError'] })), (0, jsx_runtime_1.jsxs)(material_1.FormGroup, Object.assign({ className: classes.form }, { children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, slotProps: {
+                            input: {
+                                endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: Event_1.EVENT_TITLE_MAX_LENGTH - field.name.length }))
+                            }
                         }, 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.default : en_US_1.default, localeText: {
                                 cancelButtonLabel: `${intl.formatMessage(messages.pickerCancelAction)}`
                             } }, { 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: {
-                                        textField: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { 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" }) }) }))) }) })))
+                                        textField: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { slotProps: {
+                                                input: Object.assign(Object.assign({}, params.slotProps.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" }) }) }))) })
+                                            } })))
                                     }, slotProps: {
                                         toolbar: {
                                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
@@ -388,7 +392,9 @@ function EventForm(inProps) {
                                         handleChangeDateTime(value, 'startDate');
                                         handleChangeDateTime(value, 'startTime');
                                     } }), (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: {
-                                        textField: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { 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" }) }) }))) }) })))
+                                        textField: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { slotProps: {
+                                                input: Object.assign(Object.assign({}, params.slotProps.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" }) }) }))) })
+                                            } })))
                                     }, slotProps: {
                                         toolbar: {
                                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
@@ -406,7 +412,9 @@ function EventForm(inProps) {
                                 }, 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.default : en_US_1.default, localeText: {
                                 cancelButtonLabel: `${intl.formatMessage(messages.pickerCancelAction)}`
                             } }, { 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: {
-                                        textField: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { 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" }) }) }))) }) })))
+                                        textField: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { slotProps: {
+                                                input: Object.assign(Object.assign({}, params.slotProps.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" }) }) }))) })
+                                            } })))
                                     }, slotProps: {
                                         toolbar: {
                                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
@@ -417,7 +425,9 @@ function EventForm(inProps) {
                                         handleChangeDateTime(value, 'endDate');
                                         handleChangeDateTime(value, 'endTime');
                                     }, 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: {
-                                        textField: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { 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" }) }) }))) }) })))
+                                        textField: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { slotProps: {
+                                                input: Object.assign(Object.assign({}, params.slotProps.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" }) }) }))) })
+                                            } })))
                                     }, slotProps: {
                                         toolbar: {
                                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
@@ -434,15 +444,13 @@ function EventForm(inProps) {
                             geolocation: field.geolocation,
                             live_stream: Object.assign(Object.assign({ title: field.name || `${intl.formatMessage(messages.name)}` }, (event && ((_e = event.live_stream) === null || _e === void 0 ? void 0 : _e.created_at) && { created_at: field.startDate })), { settings: field.liveStreamSettings })
                         }) }, EventAddressComponentProps)), privateEnabled && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.privacySection }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center", justifyContent: "center" }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.switchLabel, { [classes.active]: !field.isPublic }) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.private", defaultMessage: "ui.eventForm.privacy.private" })] })), (0, jsx_runtime_1.jsx)(material_1.Switch, { className: classes.switch, checked: field.isPublic, onChange: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['isPublic']: !field.isPublic }))), disabled: (event === null || event === void 0 ? void 0 : event.privacy) === types_1.SCEventPrivacyType.PRIVATE }), (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.switchLabel, { [classes.active]: field.isPublic }) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.public", defaultMessage: "ui.eventForm.privacy.public" })] }))] })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", textAlign: "center", className: classes.privacySectionInfo }, { children: field.isPublic ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.public.info", defaultMessage: "ui.eventForm.privacy.public.info", values: {
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
-                                        // @ts-ignores
                                         b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
                                     } })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.private.info", defaultMessage: "ui.eventForm.private.public.info", values: {
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
-                                        // @ts-ignore
                                         b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
-                                    } })) }))] }))), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
-                            endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_f = field.description) === null || _f === void 0 ? void 0 : _f.length) ? Event_1.EVENT_DESCRIPTION_MAX_LENGTH - field.description.length : Event_1.EVENT_DESCRIPTION_MAX_LENGTH })))
+                                    } })) }))] }))), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, slotProps: {
+                            input: {
+                                endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_f = field.description) === null || _f === void 0 ? void 0 : _f.length) ? Event_1.EVENT_DESCRIPTION_MAX_LENGTH - field.description.length : Event_1.EVENT_DESCRIPTION_MAX_LENGTH })))
+                            }
                         }, error: Boolean(((_g = field.description) === null || _g === void 0 ? void 0 : _g.length) > Event_1.EVENT_DESCRIPTION_MAX_LENGTH), helperText: ((_h = field.description) === null || _h === void 0 ? void 0 : _h.length) > Event_1.EVENT_DESCRIPTION_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.description.error.maxLength", defaultMessage: "ui.eventForm.description.error.maxLength" })) : null }), isPaymentsEnabled && isStaff && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.paywallsConfiguratorWrap }, { children: (0, jsx_runtime_1.jsx)(PaywallsConfigurator_1.default, Object.assign({}, (event && { contentId: event.id }), { contentType: types_1.SCContentType.EVENT, onChangeContentAccessType: handleChangeContentAccessType, onChangePaymentProducts: handleChangePaymentsProducts })) }))), genericError && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.genericError }, { children: (0, jsx_runtime_1.jsx)(material_1.Alert, Object.assign({ variant: "filled", severity: "error" }, { children: genericError })) }))), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ loading: field.isSubmitting, disabled: !field.name ||
                                 !field.startDate ||
                                 !field.startTime ||

package/lib/cjs/components/EventForm/types.d.ts

@@ -1,10 +1,10 @@
 import { SCEventLocationType, SCEventRecurrenceType, SCLiveStreamSettingsType } from '@selfcommunity/types';
 import { ContentAccessType } from '../PaywallsConfigurator/constants';
-export declare type Place = {
+export type Place = {
     description: string;
     id?: string;
 };
-export declare type Geolocation = {
+export type Geolocation = {
     location: SCEventLocationType;
     geolocation?: string;
     lat?: number;
@@ -12,7 +12,7 @@ export declare type Geolocation = {
     link?: string;
     liveStreamSettings?: SCLiveStreamSettingsType;
 };
-export declare type InitialFieldState = Geolocation & {
+export type InitialFieldState = Geolocation & {
     imageOriginal: string | ArrayBuffer;
     imageOriginalFile: string | Blob;
     startDate: Date | null;
@@ -27,5 +27,5 @@ export declare type InitialFieldState = Geolocation & {
     products: number[];
     contentAccessType: ContentAccessType;
 };
-export declare type FieldStateKeys = keyof InitialFieldState;
-export declare type FieldStateValues = InitialFieldState[FieldStateKeys];
+export type FieldStateKeys = keyof InitialFieldState;
+export type FieldStateValues = InitialFieldState[FieldStateKeys];

package/lib/cjs/components/EventInfoWidget/EventInfoWidget.d.ts

@@ -21,4 +21,4 @@ export interface EventInfoWidgetProps extends WidgetProps {
      */
     [p: string]: any;
 }
-export default function EventInfoWidget(inProps: EventInfoWidgetProps): JSX.Element;
+export default function EventInfoWidget(inProps: EventInfoWidgetProps): import("react/jsx-runtime").JSX.Element;

package/lib/cjs/components/EventInfoWidget/Skeleton.d.ts

@@ -1 +1 @@
-export default function EventInfoWigetSkeleton(): JSX.Element;
+export default function EventInfoWigetSkeleton(): import("react/jsx-runtime").JSX.Element;

package/lib/cjs/components/EventInfoWidget/index.d.ts

@@ -1,4 +1,4 @@
 import EventInfoWidget, { EventInfoWidgetProps } from './EventInfoWidget';
 import EventInfoWidgetSkeleton from './Skeleton';
 export default EventInfoWidget;
-export { EventInfoWidgetSkeleton, type EventInfoWidgetProps };
+export { EventInfoWidgetSkeleton, EventInfoWidgetProps };

package/lib/cjs/components/EventInviteButton/EventInviteButton.js

@@ -244,7 +244,9 @@ function EventInviteButton(inProps) {
     /**
      * Renders root object
      */
-    return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), onClick: handleClose, variant: scEvent ? 'contained' : 'outlined', color: scEvent ? 'secondary' : 'inherit', startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "add" }) }, rest, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInviteButton", defaultMessage: "ui.eventInviteButton" }) })), open && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ DialogContentProps: { dividers: false }, open: true, className: classes.dialogRoot, title: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handleClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.dialogTitle }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInviteButton.dialog.title", defaultMessage: "ui.eventInviteButton.dialog.title" }) })), (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ size: "small", color: "secondary", variant: "contained", onClick: handleSendInvitations, loading: isSending, disabled: !invited.length }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInviteButton.dialog.button.end", defaultMessage: "ui.eventInviteButton.dialog.button.end" }) }))] }) }, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.dialogContent }, { children: [(0, jsx_runtime_1.jsx)(material_1.Autocomplete, { className: classes.autocomplete, loading: loading, size: "small", multiple: true, freeSolo: true, disableClearable: true, options: suggested, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, filterOptions: filterOptions, value: invited, getOptionLabel: (option) => (option ? option.username : '...'), isOptionEqualToValue: (option, value) => (option ? value.id === option.id : false), renderTags: () => null, renderOption: (props, option) => ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ component: "li" }, props, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.username, src: option.avatar }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ ml: 1 }, { children: option.username }))] }))), renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { variant: "outlined", placeholder: `${intl.formatMessage(messages.placeholder)}`, InputProps: Object.assign(Object.assign({}, params.InputProps), { className: classes.input, startAdornment: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ className: classes.icon }, { children: "search" })) })), params.InputProps.startAdornment] })) }) }))) }), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.invitedBox }, { children: invited.map((option, index) => ((0, jsx_runtime_1.jsx)(material_1.Chip, { avatar: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.username, src: option.avatar }), label: option.username, onDelete: () => {
+    return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), onClick: handleClose, variant: scEvent ? 'contained' : 'outlined', color: scEvent ? 'secondary' : 'inherit', startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "add" }) }, rest, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInviteButton", defaultMessage: "ui.eventInviteButton" }) })), open && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ DialogContentProps: { dividers: false }, open: true, className: classes.dialogRoot, title: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handleClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.dialogTitle }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInviteButton.dialog.title", defaultMessage: "ui.eventInviteButton.dialog.title" }) })), (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ size: "small", color: "secondary", variant: "contained", onClick: handleSendInvitations, loading: isSending, disabled: !invited.length }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInviteButton.dialog.button.end", defaultMessage: "ui.eventInviteButton.dialog.button.end" }) }))] }) }, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.dialogContent }, { children: [(0, jsx_runtime_1.jsx)(material_1.Autocomplete, { className: classes.autocomplete, loading: loading, size: "small", multiple: true, freeSolo: true, disableClearable: true, options: suggested, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, filterOptions: filterOptions, value: invited, getOptionLabel: (option) => (option ? option.username : '...'), isOptionEqualToValue: (option, value) => (option ? value.id === option.id : false), renderTags: () => null, renderOption: (props, option) => ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ component: "li" }, props, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.username, src: option.avatar }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ ml: 1 }, { children: option.username }))] }))), renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { variant: "outlined", placeholder: `${intl.formatMessage(messages.placeholder)}`, slotProps: {
+                                    input: Object.assign(Object.assign({}, params.InputProps), { className: classes.input, startAdornment: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ className: classes.icon }, { children: "search" })) })), params.InputProps.startAdornment] })) })
+                                } }))) }), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.invitedBox }, { children: invited.map((option, index) => ((0, jsx_runtime_1.jsx)(material_1.Chip, { avatar: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.username, src: option.avatar }), label: option.username, onDelete: () => {
                                     handleDelete(option);
                                 }, style: { marginRight: 8 } }, index))) })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.suggested }, { children: [list.length !== 0 && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4", fontWeight: "bold" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInviteButton.dialog.content.list", defaultMessage: "ui.eventInviteButton.dialog.content.list" }) }))), list.slice(0, 5).map((user, index) => ((0, jsx_runtime_1.jsx)(User_1.default, { elevation: 0, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}), user: user, userId: user.id, buttonProps: { onClick: () => handleUserInvite(user) } }, index)))] }))] })) })))] }));
 }

package/lib/cjs/components/EventMediaWidget/EventMediaWidget.d.ts

@@ -38,4 +38,4 @@ export interface EventMediaWidgetProps extends WidgetProps {
      */
     [p: string]: any;
 }
-export default function EventMediaWidget(inProps: EventMediaWidgetProps): JSX.Element;
+export default function EventMediaWidget(inProps: EventMediaWidgetProps): import("react/jsx-runtime").JSX.Element;

package/lib/cjs/components/EventMediaWidget/Skeleton.d.ts

@@ -1,2 +1,2 @@
-export default function EventMediaWidgetSkeleton(): JSX.Element;
-export declare function EventMediaSkeleton(): JSX.Element;
+export default function EventMediaWidgetSkeleton(): import("react/jsx-runtime").JSX.Element;
+export declare function EventMediaSkeleton(): import("react/jsx-runtime").JSX.Element;

package/lib/cjs/components/EventMediaWidget/TriggerButton.d.ts

@@ -13,5 +13,5 @@ export interface TriggerIconButtonProps extends LoadingButtonProps {
      */
     isSquare?: boolean;
 }
-declare const _default: import("react").ForwardRefExoticComponent<Pick<TriggerIconButtonProps, "id" | "role" | "className" | "style" | "classes" | "form" | "slot" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "sx" | "variant" | "name" | "type" | "href" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value" | "action" | "loading" | "size" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon" | "loadingIndicator" | "loadingPosition" | "onAdd" | "isSquare"> & import("react").RefAttributes<HTMLButtonElement>>;
+declare const _default: import("react").ForwardRefExoticComponent<Omit<TriggerIconButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
 export default _default;

package/lib/cjs/components/EventMediaWidget/asUploadButton.d.ts

@@ -1,7 +1,7 @@
 import { UploadButtonProps } from '@rpldy/upload-button';
 import type { ComponentType } from 'react';
-declare type FileInputProps = {
+type FileInputProps = {
     accept: string;
 };
-declare const asUploadButton: (Component: ComponentType<any>, inputProps: FileInputProps) => import("react").ForwardRefExoticComponent<Pick<UploadButtonProps<Element>, "id" | "className" | "text" | "children" | "onClick" | "method" | "headers" | "paramName" | "params" | "forceJsonResponse" | "withCredentials" | "formatGroupParamName" | "sendWithFormData" | "formDataAllowUndefined" | "formatServerResponse" | "isSuccessfulCall" | "destination" | "fileFilter" | "autoUpload" | "clearPendingOnAdd" | "grouped" | "maxGroupSize" | "inputFieldName" | "fastAbortThreshold" | "userData" | "extraProps"> & import("react").RefAttributes<any>>;
+declare const asUploadButton: (Component: ComponentType<any>, inputProps: FileInputProps) => import("react").ForwardRefExoticComponent<Omit<UploadButtonProps<Element>, "ref"> & import("react").RefAttributes<any>>;
 export default asUploadButton;

package/lib/cjs/components/EventMediaWidget/index.d.ts

@@ -1,4 +1,5 @@
 import EventMediaWidget, { EventMediaWidgetProps } from './EventMediaWidget';
 import EventMediaWidgetSkeleton from './Skeleton';
 export default EventMediaWidget;
-export { EventMediaWidgetSkeleton, type EventMediaWidgetProps };
+export { EventMediaWidgetSkeleton };
+export { EventMediaWidgetProps };

package/lib/cjs/components/EventMembersWidget/EventMembersWidget.d.ts

@@ -44,4 +44,4 @@ export interface EventMembersWidgetProps extends WidgetProps {
      */
     [p: string]: any;
 }
-export default function EventMembersWidget(inProps: EventMembersWidgetProps): JSX.Element;
+export default function EventMembersWidget(inProps: EventMembersWidgetProps): import("react/jsx-runtime").JSX.Element;

package/lib/cjs/components/EventMembersWidget/EventMembersWidget.js

@@ -189,12 +189,12 @@ function EventMembersWidget(inProps) {
         (tabValue === types_1.TabContentType.PARTICIPANTS && participants.isLoadingNext && !participants.initialized)) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.title }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: title, defaultMessage: title }) })), (0, jsx_runtime_1.jsxs)(lab_1.TabContext, Object.assign({ value: tabValue }, { children: [(0, jsx_runtime_1.jsxs)(lab_1.TabList, Object.assign({ className: classes.tabsWrapper, onChange: handleTabChange, textColor: "primary", indicatorColor: "primary", variant: "fullWidth" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3" }, { children: participantsCount })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.participants", defaultMessage: "ui.eventMembersWidget.participants" }) }))] })), value: types_1.TabContentType.PARTICIPANTS }), hasAllow && ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3" }, { children: invitedCount })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.invited", defaultMessage: "ui.eventMembersWidget.invited" }) }))] })), value: types_1.TabContentType.INVITED })), hasAllow && ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3" }, { children: requestsCount })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.requests", defaultMessage: "ui.eventMembersWidget.requests" }) }))] })), value: types_1.TabContentType.REQUESTS }))] })), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ value: types_1.TabContentType.PARTICIPANTS, className: classes.tabPanel }, { children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentType.PARTICIPANTS, state: participants, dispatch: dispatchParticipants, userProps: userProps, dialogProps: dialogProps, actionProps: {
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.title }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: title, defaultMessage: title }) })), (0, jsx_runtime_1.jsxs)(lab_1.TabContext, Object.assign({ value: tabValue }, { children: [(0, jsx_runtime_1.jsxs)(lab_1.TabList, Object.assign({ className: classes.tabsWrapper, onChange: handleTabChange, textColor: "primary", indicatorColor: "primary", variant: "fullWidth" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3" }, { children: participantsCount })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.participants", defaultMessage: "ui.eventMembersWidget.participants" }) }))] })), value: types_1.TabContentType.PARTICIPANTS }), hasAllow && ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3" }, { children: invitedCount })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.invited", defaultMessage: "ui.eventMembersWidget.invited" }) }))] })), value: types_1.TabContentType.INVITED })), hasAllow && ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3" }, { children: requestsCount })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.requests", defaultMessage: "ui.eventMembersWidget.requests" }) }))] })), value: types_1.TabContentType.REQUESTS }))] })), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ value: types_1.TabContentType.PARTICIPANTS, sx: { className: classes.tabPanel } }, { children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentType.PARTICIPANTS, state: participants, dispatch: dispatchParticipants, userProps: userProps, dialogProps: dialogProps, actionProps: {
                                     scEvent
-                                }, handleRefresh: handleRefresh }) })), hasAllow && ((0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ value: types_1.TabContentType.INVITED, className: classes.tabPanel }, { children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentType.INVITED, state: invited, dispatch: dispatchInvited, userProps: userProps, dialogProps: dialogProps, actionProps: {
+                                }, handleRefresh: handleRefresh }) })), hasAllow && ((0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ value: types_1.TabContentType.INVITED, sx: { className: classes.tabPanel } }, { children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentType.INVITED, state: invited, dispatch: dispatchInvited, userProps: userProps, dialogProps: dialogProps, actionProps: {
                                     scEvent,
                                     setCount: setInvitedCount
-                                }, handleRefresh: handleRefresh }) }))), hasAllow && ((0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ value: types_1.TabContentType.REQUESTS, className: classes.tabPanel }, { children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentType.REQUESTS, state: requests, dispatch: dispatchRequests, userProps: userProps, dialogProps: dialogProps, actionProps: {
+                                }, handleRefresh: handleRefresh }) }))), hasAllow && ((0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ value: types_1.TabContentType.REQUESTS, sx: { className: classes.tabPanel } }, { children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentType.REQUESTS, state: requests, dispatch: dispatchRequests, userProps: userProps, dialogProps: dialogProps, actionProps: {
                                     scEvent,
                                     count: requestsCount,
                                     setCount: setRequestsCount,

package/lib/cjs/components/EventMembersWidget/Skeleton.d.ts

@@ -1,2 +1,2 @@
 import 'swiper/css';
-export default function EventMembersWidgetSkeleton(): JSX.Element;
+export default function EventMembersWidgetSkeleton(): import("react/jsx-runtime").JSX.Element;

package/lib/cjs/components/EventMembersWidget/Skeleton.js

@@ -24,6 +24,6 @@ const Root = (0, system_1.styled)(Widget_1.default, {
     overridesResolver: (_props, styles) => styles.skeletonRoot
 })(() => ({}));
 function EventMembersWidgetSkeleton() {
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", width: "53px", height: "25px", className: classes.title }), (0, jsx_runtime_1.jsxs)(lab_1.TabContext, Object.assign({ value: "1" }, { children: [(0, jsx_runtime_1.jsx)(system_1.Box, Object.assign({ className: classes.tabsWrapper }, { children: (0, jsx_runtime_1.jsx)(lab_1.TabList, Object.assign({ variant: "fullWidth" }, { children: [1, 2, 3].map((_element, i) => ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", width: "26px", height: "24px" }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", width: "106px", height: "19px" })] })), value: `${i + 1}` }, i))) })) })), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ value: "1", className: classes.tabPanel }, { children: (0, jsx_runtime_1.jsxs)(material_1.List, { children: [[1, 2, 3, 4].map((_element, i) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, {}) }, i))), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { className: classes.actionButton, animation: "wave", width: "52px", height: "20px" })] }) })), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, { value: "2", className: classes.tabPanel }), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, { value: "3", className: classes.tabPanel })] }))] })) })));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", width: "53px", height: "25px", className: classes.title }), (0, jsx_runtime_1.jsxs)(lab_1.TabContext, Object.assign({ value: "1" }, { children: [(0, jsx_runtime_1.jsx)(system_1.Box, Object.assign({ className: classes.tabsWrapper }, { children: (0, jsx_runtime_1.jsx)(lab_1.TabList, Object.assign({ variant: "fullWidth" }, { children: [1, 2, 3].map((_element, i) => ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", width: "26px", height: "24px" }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", width: "106px", height: "19px" })] })), value: `${i + 1}` }, i))) })) })), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ value: "1", sx: { className: classes.tabPanel } }, { children: (0, jsx_runtime_1.jsxs)(material_1.List, { children: [[1, 2, 3, 4].map((_element, i) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, {}) }, i))), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { className: classes.actionButton, animation: "wave", width: "52px", height: "20px" })] }) })), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, { value: "2", sx: { className: classes.tabPanel } }), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, { value: "3", sx: { className: classes.tabPanel } })] }))] })) })));
 }
 exports.default = EventMembersWidgetSkeleton;

package/lib/cjs/components/EventMembersWidget/TabContentComponent.d.ts

@@ -26,5 +26,5 @@ interface TabComponentProps {
     };
     handleRefresh?: (tabValue: TabContentType) => void;
 }
-export default function TabContentComponent(props: TabComponentProps): JSX.Element;
+export default function TabContentComponent(props: TabComponentProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/cjs/components/EventMembersWidget/index.d.ts

@@ -1,4 +1,4 @@
 import EventMembersWidget, { EventMembersWidgetProps } from './EventMembersWidget';
 import EventMembersWidgetSkeleton from './Skeleton';
 export default EventMembersWidget;
-export { EventMembersWidgetSkeleton, type EventMembersWidgetProps };
+export { EventMembersWidgetSkeleton, EventMembersWidgetProps };

package/lib/cjs/components/EventParticipantsButton/EventParticipantsButton.d.ts

@@ -48,4 +48,4 @@ export interface EventParticipantsButtonProps extends Pick<ButtonProps, Exclude<
 
  * @param inProps
  */
-export default function EventParticipantsButton(inProps: EventParticipantsButtonProps): JSX.Element;
+export default function EventParticipantsButton(inProps: EventParticipantsButtonProps): import("react/jsx-runtime").JSX.Element;

package/lib/cjs/components/EventSubscribeButton/EventSubscribeButton.js

@@ -150,7 +150,11 @@ function EventSubscribeButton(inProps) {
         }
     }, [scUserContext.user, status, scContext.settings]);
     function renderMenuItems() {
-        return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: options.map((option) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ className: classes.item, disabled: loading }, { children: (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { label: option.label, control: loading ? ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: "primary", size: 20 })) : ((0, jsx_runtime_1.jsx)(material_1.Checkbox, { size: "small", checked: status === option.value, value: option.value, onChange: handleToggleAction, name: `${option.value}-option`, inputProps: { 'aria-label': `${option.label}` } })), labelPlacement: "start" }) }), option.value))) }));
+        return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: options.map((option) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ className: classes.item, disabled: loading }, { children: (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { label: option.label, control: loading ? ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: "primary", size: 20 })) : ((0, jsx_runtime_1.jsx)(material_1.Checkbox, { size: "small", checked: status === option.value, value: option.value, onChange: handleToggleAction, name: `${option.value}-option`, slotProps: {
+                            input: {
+                                'aria-label': `${option.label}`
+                            }
+                        } })), labelPlacement: "start" }) }), option.value))) }));
     }
     /**
      * Get current translated status
@@ -185,6 +189,10 @@ function EventSubscribeButton(inProps) {
             ((_b = scEvent.paywalls) === null || _b === void 0 ? void 0 : _b.length) > 0 &&
             (scEvent.privacy === types_1.SCEventPrivacyType.PUBLIC ||
                 (scEvent.privacy === types_1.SCEventPrivacyType.PRIVATE && status && status !== types_1.SCEventSubscriptionStatusType.REQUESTED)) ? ((0, jsx_runtime_1.jsx)(BuyButtonRoot, { contentType: types_1.SCContentType.EVENT, content: scEvent, showTicket: true })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (scEvent === null || scEvent === void 0 ? void 0 : scEvent.privacy) === types_1.SCEventPrivacyType.PRIVATE && (!status || status === types_1.SCEventSubscriptionStatusType.REQUESTED) ? ((0, jsx_runtime_1.jsx)(RequestRoot, Object.assign({ className: (0, classnames_1.default)(classes.requestRoot, className), variant: "outlined", size: "small", loading: scUserContext.user ? scEventsManager.isLoading(scEvent) : null, onClick: handleToggleAction }, rest, { children: getStatus }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(SelectRoot, Object.assign({ className: (0, classnames_1.default)(classes.selectRoot, className, { [classes.going]: status && status === types_1.SCEventSubscriptionStatusType.GOING }, { [classes.notGoing]: status && status === types_1.SCEventSubscriptionStatusType.NOT_GOING }), onClick: handleOpen, endIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: open ? 'expand_less' : 'expand_more' }), startIcon: status &&
-                            status !== types_1.SCEventSubscriptionStatusType.SUBSCRIBED && ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: status === types_1.SCEventSubscriptionStatusType.GOING ? 'circle_checked' : 'circle_closed' })) }, rest, { children: getStatus })), open && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, PaperProps: { className: classes.paper }, open: true, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: renderMenuItems() }))) : ((0, jsx_runtime_1.jsx)(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: true, onClose: handleClose }, { children: renderMenuItems() }))) }))] })) })) }));
+                            status !== types_1.SCEventSubscriptionStatusType.SUBSCRIBED && ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: status === types_1.SCEventSubscriptionStatusType.GOING ? 'circle_checked' : 'circle_closed' })) }, rest, { children: getStatus })), open && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, slotProps: {
+                                paper: {
+                                    className: classes.paper
+                                }
+                            }, open: true, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: renderMenuItems() }))) : ((0, jsx_runtime_1.jsx)(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: true, onClose: handleClose }, { children: renderMenuItems() }))) }))] })) })) }));
 }
 exports.default = EventSubscribeButton;

package/lib/cjs/components/Events/Events.d.ts

@@ -1,12 +1,8 @@
 import { GridProps } from '@mui/material';
 import { EndpointType } from '@selfcommunity/api-services';
-import React from 'react';
 import { CreateEventButtonProps } from '../CreateEventButton';
 import { EventProps, EventSkeletonProps } from '../Event';
 import { EventsSkeletonProps } from '../Events/Skeleton';
-export declare const EventsChipRoot: import("@emotion/styled").StyledComponent<import("@mui/material").ChipOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-    ref?: React.Ref<HTMLDivElement>;
-}, "avatar" | "className" | "style" | "classes" | "label" | "tabIndex" | "color" | "children" | "sx" | "variant" | "disabled" | "size" | "icon" | "clickable" | "deleteIcon" | "onDelete" | "skipFocusWhenDisabled"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export interface EventsProps {
     /**
      * Overrides or extends the styles applied to the component.

package/lib/cjs/components/Events/Events.js

@@ -1,6 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.EventsChipRoot = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const material_1 = require("@mui/material");
@@ -46,10 +45,10 @@ const Root = (0, material_1.styled)(material_1.Box, {
     name: constants_1.PREFIX,
     slot: 'Root'
 })(() => ({}));
-exports.EventsChipRoot = (0, material_1.styled)(material_1.Chip, {
+const EventsChipRoot = (0, material_1.styled)(material_1.Chip, {
     name: constants_1.PREFIX,
     slot: 'EventsChipRoot',
-    shouldForwardProp: (prop) => prop !== 'showFollowed' && prop !== 'showPastEvents' && prop !== 'showOngoingEvents'
+    shouldForwardProp: (prop) => prop !== 'showFollowed'
 })(() => ({}));
 /**
  * > API documentation for the Community-JS Events component. Learn about the available props and the CSS API.
@@ -223,18 +222,24 @@ function Events(inProps) {
     /**
      * Renders events list
      */
-    const content = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [showFilters && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true, className: classes.filters, gap: 2 }, { children: filters ? (filters) : showUserEvents ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(exports.EventsChipRoot, { color: showMyEvents ? 'secondary' : 'default', variant: showMyEvents ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByCreatedByMe", defaultMessage: "ui.events.filterByCreatedByMe" }), onClick: () => setShowMyEvents(!showMyEvents), 
+    const content = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [showFilters && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true, width: "100%", className: classes.filters, gap: 2 }, { children: filters ? (filters) : showUserEvents ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: "grow" }, { children: (0, jsx_runtime_1.jsx)(EventsChipRoot, { color: showMyEvents ? 'secondary' : 'default', variant: showMyEvents ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByCreatedByMe", defaultMessage: "ui.events.filterByCreatedByMe" }), onClick: () => setShowMyEvents(!showMyEvents), 
                                 // @ts-expect-error this is needed to use showFollowed into SCEvents
-                                showFollowed: showMyEvents, deleteIcon: showMyEvents ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showMyEvents ? () => setShowMyEvents(false) : null, disabled: loading }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(PastEventsFilter_1.default, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, disabled: loading }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: (0, jsx_runtime_1.jsx)(LocationEventsFilter_1.default, { value: location, disabled: loading, handleOnChange: handleOnChangeLocation }) }))] })) : general ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, md: 3 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { className: classes.search, size: 'small', fullWidth: true, value: query, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByName", defaultMessage: "ui.events.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading, onKeyUp: (e) => {
+                                showFollowed: showMyEvents, deleteIcon: showMyEvents ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showMyEvents ? () => setShowMyEvents(false) : null, disabled: loading }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: "grow" }, { children: (0, jsx_runtime_1.jsx)(PastEventsFilter_1.default, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, disabled: loading }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: "grow" }, { children: (0, jsx_runtime_1.jsx)(LocationEventsFilter_1.default, { value: location, disabled: loading, handleOnChange: handleOnChangeLocation }) }))] })) : general ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { md: 3 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { className: classes.search, size: "small", fullWidth: true, value: query, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByName", defaultMessage: "ui.events.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading, onKeyUp: (e) => {
                                     e.preventDefault();
                                     if (e.key === 'Enter') {
                                         fetchEvents();
                                     }
-                                }, InputProps: {
-                                    endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: isMobile ? ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => fetchEvents(), disabled: loading }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }) }))) : ((0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", variant: "contained", color: "secondary", onClick: () => fetchEvents(), endIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }), disabled: loading })) })))
-                                } }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, Object.assign({ fullWidth: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }) }), (0, jsx_runtime_1.jsx)(material_1.Select, Object.assign({ disabled: showOngoingEvents || loading, size: 'small', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }), value: dateSearch, onChange: handleOnChangeTimeFrame, renderValue: (selected) => options.find((option) => option.value === selected).label }, { children: options.map((option) => ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ value: option.value }, { children: [(0, jsx_runtime_1.jsx)(material_1.Radio, { checked: dateSearch === option.value, value: option.value, name: "radio-button-select", inputProps: { 'aria-label': option.label } }), option.label] }), option.value))) }))] })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: (0, jsx_runtime_1.jsx)(LocationEventsFilter_1.default, { value: location, disabled: loading, handleOnChange: handleOnChangeLocation }) })), authUserId && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(exports.EventsChipRoot, { color: showFollowed ? 'secondary' : 'default', variant: showFollowed ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByFollowedInterest", defaultMessage: "ui.events.filterByFollowedInterest" }), onClick: handleChipClick, 
+                                }, slotProps: {
+                                    input: {
+                                        endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: isMobile ? ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => fetchEvents(), disabled: loading }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }) }))) : ((0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", variant: "contained", color: "secondary", onClick: () => fetchEvents(), endIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }), disabled: loading })) })))
+                                    }
+                                } }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { md: 2 } }, { children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, Object.assign({ fullWidth: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }) }), (0, jsx_runtime_1.jsx)(material_1.Select, Object.assign({ disabled: showOngoingEvents || loading, size: "small", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }), value: dateSearch, onChange: handleOnChangeTimeFrame, renderValue: (selected) => options.find((option) => option.value === selected).label }, { children: options.map((option) => ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ value: option.value }, { children: [(0, jsx_runtime_1.jsx)(material_1.Radio, { checked: dateSearch === option.value, value: option.value, name: "radio-button-select", slotProps: {
+                                                        input: {
+                                                            'aria-label': `${option.label}`
+                                                        }
+                                                    } }), option.label] }), option.value))) }))] })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { md: 2 } }, { children: (0, jsx_runtime_1.jsx)(LocationEventsFilter_1.default, { value: location, disabled: loading, handleOnChange: handleOnChangeLocation }) })), authUserId && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: "grow" }, { children: (0, jsx_runtime_1.jsx)(EventsChipRoot, { color: showFollowed ? 'secondary' : 'default', variant: showFollowed ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByFollowedInterest", defaultMessage: "ui.events.filterByFollowedInterest" }), onClick: handleChipClick, 
                                 // @ts-expect-error this is needed to use showFollowed into SCEvents
-                                showFollowed: showFollowed, deleteIcon: showFollowed ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showFollowed ? handleDeleteClick : null, disabled: loading }) }))), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(OngoingEventsFilter_1.default, { showOngoingEvents: showOngoingEvents, handleClick: handleChipOngoingClick, handleDeleteClick: handleDeleteOngoingClick, disabled: dateSearch !== types_1.SCEventDateFilterType.ALL || loading }) }))] })) : null }))), (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: loading ? ((0, jsx_runtime_1.jsx)(Skeleton_1.default, Object.assign({}, EventsSkeletonComponentProps, { EventSkeletonProps: EventSkeletonComponentProps }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: !events.length ? ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.noResults }, { children: general ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: (onlyStaffEnabled && react_core_1.UserUtils.isStaff(scUserContext.user)) || !onlyStaffEnabled ? ((0, jsx_runtime_1.jsx)(CreateEventButton_1.default, Object.assign({}, CreateEventButtonProps))) : null })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.noEvents.title", defaultMessage: "ui.events.noEvents.title" }) }))] })) : showUserEvents ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.noEvents.title.personal", defaultMessage: "ui.events.noEvents.title.personal" }) })) })) : null }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true, spacing: { xs: 2 }, className: classes.events }, GridContainerComponentProps, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [events.map((event) => ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, className: classes.item }, GridItemComponentProps, { children: (0, jsx_runtime_1.jsx)(Event_1.default, Object.assign({ event: event, eventId: event.id }, EventComponentProps)) }), event.id))), authUserId && events.length % 2 !== 0 && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, className: classes.itemSkeleton }, GridItemComponentProps, { children: (0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: (0, jsx_runtime_1.jsx)(CreateEventButton_1.default, Object.assign({ variant: "outlined", color: "primary", size: "small" }, CreateEventButtonProps, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.skeleton.action.add", defaultMessage: "ui.events.skeleton.action.add" }) })) })) }), 'skeleton-item'))] }) })), Boolean(next) && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ color: "secondary", variant: "text", onClick: handleNext, className: classes.showMore }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.button.seeMore", defaultMessage: "ui.events.button.seeMore" }) })))] })) })) })] }));
+                                showFollowed: showFollowed, deleteIcon: showFollowed ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showFollowed ? handleDeleteClick : null, disabled: loading }) }))), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: "grow" }, { children: (0, jsx_runtime_1.jsx)(OngoingEventsFilter_1.default, { showOngoingEvents: showOngoingEvents, handleClick: handleChipOngoingClick, handleDeleteClick: handleDeleteOngoingClick, disabled: dateSearch !== types_1.SCEventDateFilterType.ALL || loading }) }))] })) : null }))), (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: loading ? ((0, jsx_runtime_1.jsx)(Skeleton_1.default, Object.assign({}, EventsSkeletonComponentProps, { EventSkeletonProps: EventSkeletonComponentProps }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: !events.length ? ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.noResults }, { children: general ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: (onlyStaffEnabled && react_core_1.UserUtils.isStaff(scUserContext.user)) || !onlyStaffEnabled ? ((0, jsx_runtime_1.jsx)(CreateEventButton_1.default, Object.assign({}, CreateEventButtonProps))) : null })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.noEvents.title", defaultMessage: "ui.events.noEvents.title" }) }))] })) : showUserEvents ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.noEvents.title.personal", defaultMessage: "ui.events.noEvents.title.personal" }) })) })) : null }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: { xs: 2 }, className: classes.events }, GridContainerComponentProps, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [events.map((event) => ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { md: 6 }, className: classes.item }, GridItemComponentProps, { children: (0, jsx_runtime_1.jsx)(Event_1.default, Object.assign({ event: event, eventId: event.id }, EventComponentProps)) }), event.id))), authUserId && events.length % 2 !== 0 && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { md: 6 }, className: classes.itemSkeleton }, GridItemComponentProps, { children: (0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: (0, jsx_runtime_1.jsx)(CreateEventButton_1.default, Object.assign({ variant: "outlined", color: "primary", size: "small" }, CreateEventButtonProps, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.skeleton.action.add", defaultMessage: "ui.events.skeleton.action.add" }) })) })) }), "skeleton-item"))] }) })), Boolean(next) && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ color: "secondary", variant: "text", onClick: handleNext, className: classes.showMore }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.button.seeMore", defaultMessage: "ui.events.button.seeMore" }) })))] })) })) })] }));
     /**
      * Renders root object (if content availability community option is false and user is anonymous, component is hidden)
      */

package/lib/cjs/components/Events/LocationEventsFilter.js

@@ -39,6 +39,10 @@ function LocationEventsFilter(inProps) {
     if (autoHide) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), fullWidth: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByLocation", defaultMessage: "ui.events.filterByLocation" }) }), (0, jsx_runtime_1.jsx)(material_1.Select, Object.assign({ disabled: disabled, size: 'small', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.location", defaultMessage: "ui.events.location" }), value: value, onChange: handleOnChange, renderValue: (selected) => locationOptions.find((option) => option.value === selected).label }, { children: locationOptions.map((option) => ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ value: option.value }, { children: [(0, jsx_runtime_1.jsx)(material_1.Radio, { checked: value === option.value, value: option.value, name: "radio-button-select", inputProps: { 'aria-label': option.label } }), option.label] }), option.value))) }))] })));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), fullWidth: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByLocation", defaultMessage: "ui.events.filterByLocation" }) }), (0, jsx_runtime_1.jsx)(material_1.Select, Object.assign({ disabled: disabled, size: 'small', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.location", defaultMessage: "ui.events.location" }), value: value, onChange: handleOnChange, renderValue: (selected) => locationOptions.find((option) => option.value === selected).label }, { children: locationOptions.map((option) => ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ value: option.value }, { children: [(0, jsx_runtime_1.jsx)(material_1.Radio, { checked: value === option.value, value: option.value, name: "radio-button-select", slotProps: {
+                                input: {
+                                    'aria-label': `${option.label}`
+                                }
+                            } }), option.label] }), option.value))) }))] })));
 }
 exports.default = LocationEventsFilter;

package/lib/cjs/components/Events/OngoingEventsFilter.js

@@ -5,7 +5,11 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const material_1 = require("@mui/material");
 const react_intl_1 = require("react-intl");
 const constants_1 = require("./constants");
-const Events_1 = require("./Events");
+const EventsChipRoot = (0, material_1.styled)(material_1.Chip, {
+    name: constants_1.PREFIX,
+    slot: 'EventsChipRoot',
+    shouldForwardProp: (prop) => prop !== 'showOngoingEvents'
+})(() => ({}));
 function OngoingEventsFilter(inProps) {
     // PROPS
     const props = (0, material_1.useThemeProps)({
@@ -16,7 +20,7 @@ function OngoingEventsFilter(inProps) {
     if (autoHide) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsx)(Events_1.EventsChipRoot, Object.assign({ color: showOngoingEvents ? 'secondary' : 'default', variant: showOngoingEvents ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByOngoingEvents", defaultMessage: "ui.events.filterByOngoingEvents" }), onClick: handleClick, 
+    return ((0, jsx_runtime_1.jsx)(EventsChipRoot, Object.assign({ color: showOngoingEvents ? 'secondary' : 'default', variant: showOngoingEvents ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByOngoingEvents", defaultMessage: "ui.events.filterByOngoingEvents" }), onClick: handleClick, 
         // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
         // @ts-ignore
         showOngoingEvents: showOngoingEvents, deleteIcon: showOngoingEvents ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showOngoingEvents ? handleDeleteClick : undefined }, rest)));