@selfcommunity/react-ui 0.8.0-alpha.2 → 0.8.0-alpha.4

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

@@ -1,13 +1,8 @@
-import { SCEventLocationType, SCEventType } from '@selfcommunity/types';
+import { SCEventType } from '@selfcommunity/types';
+import { Geolocation } from './types';
 export interface EventAddressProps {
     event?: SCEventType;
-    forwardGeolocationData: (data: {
-        location: SCEventLocationType;
-        geolocation?: string;
-        lat?: number;
-        lng?: number;
-        link?: string;
-    }) => void;
+    forwardGeolocationData: (data: Geolocation) => void;
     className?: string;
 }
 export default function EventAddress(inProps: EventAddressProps): JSX.Element;

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

@@ -2,20 +2,20 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
 const Icon_1 = tslib_1.__importDefault(require("@mui/material/Icon"));
-const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const styles_1 = require("@mui/material/styles");
 const system_1 = require("@mui/system");
-const constants_1 = require("./constants");
-const react_intl_1 = require("react-intl");
-const UrlTextField_1 = tslib_1.__importDefault(require("../../shared/UrlTextField"));
-const axios_1 = tslib_1.__importDefault(require("axios"));
+const api_1 = require("@react-google-maps/api");
 const react_core_1 = require("@selfcommunity/react-core");
-const HiddenPlaceholder_1 = tslib_1.__importDefault(require("../../shared/HiddenPlaceholder"));
 const types_1 = require("@selfcommunity/types");
-const api_1 = require("@react-google-maps/api");
+const axios_1 = tslib_1.__importDefault(require("axios"));
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const react_1 = require("react");
+const react_intl_1 = require("react-intl");
+const HiddenPlaceholder_1 = tslib_1.__importDefault(require("../../shared/HiddenPlaceholder"));
+const UrlTextField_1 = tslib_1.__importDefault(require("../../shared/UrlTextField"));
+const constants_1 = require("./constants");
 const messages = (0, react_intl_1.defineMessages)({
     virtualPlaceholder: {
         id: 'ui.eventForm.address.online.placeholder',
@@ -43,8 +43,8 @@ function EventAddress(inProps) {
     // PROPS
     const { className, forwardGeolocationData, event } = props;
     // STATE
-    const [location, setLocation] = (0, react_1.useState)(event ? event.location : types_1.SCEventLocationType.PERSON);
-    const [geolocation, setGeoLocation] = (0, react_1.useState)(event ? event.geolocation : null);
+    const [location, setLocation] = (0, react_1.useState)((event === null || event === void 0 ? void 0 : event.location) || types_1.SCEventLocationType.PERSON);
+    const [geolocation, setGeoLocation] = (0, react_1.useState)(event ? { description: event.geolocation } : null);
     const [inputValue, setInputValue] = (0, react_1.useState)('');
     const [suggestions, setSuggestions] = (0, react_1.useState)([]);
     const [timeoutId, setTimeoutId] = (0, react_1.useState)(null);
@@ -56,22 +56,22 @@ function EventAddress(inProps) {
         libraries: ['places', 'geocoding']
     });
     // HANDLERS
-    const handleChange = (event, newValue) => {
+    const handleChange = (_event, newValue) => {
         setLocation(newValue);
     };
-    const handleSelection = (event, newValue) => tslib_1.__awaiter(this, void 0, void 0, function* () {
+    const handleSelection = (_event, newValue) => tslib_1.__awaiter(this, void 0, void 0, function* () {
         if (newValue) {
             try {
                 const response = yield axios_1.default.get(`https://maps.googleapis.com/maps/api/geocode/json`, {
                     params: {
-                        place_id: newValue.place_id,
+                        place_id: newValue.id,
                         key: geocodingApiKey
                     }
                 });
                 const place = response.data.results[0];
                 setGeoLocation(newValue);
                 forwardGeolocationData({
-                    location: location,
+                    location,
                     geolocation: place.formatted_address,
                     lat: place.geometry.location.lat,
                     lng: place.geometry.location.lng
@@ -82,11 +82,11 @@ function EventAddress(inProps) {
             }
         }
     });
-    const handleLocationChange = (event, newInputValue) => {
+    const handleLocationChange = (_event, newInputValue) => {
         setInputValue(newInputValue);
     };
     const handleLinkChange = (event) => {
-        forwardGeolocationData({ location: location, link: event.target.value });
+        forwardGeolocationData({ location, link: event.target.value });
     };
     (0, react_1.useEffect)(() => {
         if (timeoutId) {
@@ -97,13 +97,13 @@ function EventAddress(inProps) {
             return;
         }
         if (inputValue.length >= 3) {
-            const newTimeoutId = window.setTimeout(() => {
+            const newTimeoutId = setTimeout(() => {
                 const autocompleteService = new window.google.maps.places.AutocompleteService();
                 autocompleteService.getPlacePredictions({ input: inputValue }, (predictions, status) => {
                     if (status === window.google.maps.places.PlacesServiceStatus.OK && predictions) {
                         setSuggestions(predictions.map((prediction) => ({
                             description: prediction.description,
-                            place_id: prediction.place_id
+                            id: prediction.place_id
                         })));
                     }
                 });
@@ -114,7 +114,7 @@ function EventAddress(inProps) {
     if (!geocodingApiKey && !isLoaded) {
         return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
     }
-    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: [(0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(Icon_1.default, { 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" }) }), (0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(Icon_1.default, { 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" }) })] })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.tabContent }, { children: [location === types_1.SCEventLocationType.PERSON && ((0, jsx_runtime_1.jsx)(material_1.Autocomplete, { freeSolo: true, size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation, noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), 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)(Icon_1.default, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) }) }))) })), 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: {
+    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: [(0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(Icon_1.default, { 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" }) }), (0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(Icon_1.default, { 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" }) })] })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.tabContent }, { children: [location === types_1.SCEventLocationType.PERSON && ((0, jsx_runtime_1.jsx)(material_1.Autocomplete, { 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)(Icon_1.default, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) }) }))) })), 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)(Icon_1.default, { children: "play_circle_outline" })
                         }, onChange: handleLinkChange }))] }))] })));
 }

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

@@ -25,7 +25,7 @@ export interface EventFormProps extends BaseDialogProps {
      * On success callback function
      * @default null
      */
-    onSuccess?: (data: any) => void;
+    onSuccess?: (data: SCEventType) => void;
     /**
      * Any other properties
      */

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

@@ -113,7 +113,7 @@ const Root = (0, styles_1.styled)(BaseDialog_1.default, {
  * @param inProps
  */
 function EventForm(inProps) {
-    var _a, _b, _c, _d, _e, _f, _g;
+    var _a, _b, _c, _d, _e;
     //PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
@@ -125,23 +125,23 @@ function EventForm(inProps) {
     // INTL
     const intl = (0, react_intl_1.useIntl)();
     const initialFieldState = {
-        imageOriginal: event ? event.image_bigger : '',
+        imageOriginal: (event === null || event === void 0 ? void 0 : event.image_bigger) || '',
         imageOriginalFile: '',
         startDate: event ? new Date(event.start_date) : null,
         startTime: event ? new Date(event.start_date) : null,
-        endDate: event && event.end_date ? new Date(event.end_date) : null,
-        endTime: event && event.end_date ? new Date(event.end_date) : null,
-        location: event ? event.location : types_1.SCEventLocationType.PERSON,
-        geolocation: event ? event.geolocation : '',
-        lat: event ? event.geolocation_lat : null,
-        lng: event ? event.geolocation_lng : null,
-        link: event ? event.link : '',
-        recurring: event ? event.recurring : types_1.SCEventRecurrenceType.NEVER,
-        name: event ? event.name : '',
+        endDate: (event === null || event === void 0 ? void 0 : event.end_date) ? new Date(event.end_date) : null,
+        endTime: (event === null || event === void 0 ? void 0 : event.end_date) ? new Date(event.end_date) : null,
+        location: (event === null || event === void 0 ? void 0 : event.location) || types_1.SCEventLocationType.PERSON,
+        geolocation: (event === null || event === void 0 ? void 0 : event.geolocation) || '',
+        lat: (event === null || event === void 0 ? void 0 : event.geolocation_lat) || null,
+        lng: (event === null || event === void 0 ? void 0 : event.geolocation_lng) || null,
+        link: (event === null || event === void 0 ? void 0 : event.link) || '',
+        recurring: (event === null || event === void 0 ? void 0 : event.recurring) || types_1.SCEventRecurrenceType.NEVER,
+        name: (event === null || event === void 0 ? void 0 : event.name) || '',
         description: event ? event.description : '',
-        isPublic: (_a = (event && event.privacy === types_1.SCEventPrivacyType.PUBLIC)) !== null && _a !== void 0 ? _a : true,
+        isPublic: (_a = (event === null || event === void 0 ? void 0 : event.privacy) === types_1.SCEventPrivacyType.PUBLIC) !== null && _a !== void 0 ? _a : true,
         isSubmitting: false,
-        showEndDateTime: (_b = (event && event.end_date)) !== null && _b !== void 0 ? _b : false
+        showEndDateTime: (_b = !!(event === null || event === void 0 ? void 0 : event.end_date)) !== null && _b !== void 0 ? _b : false
     };
     // STATE
     const [field, setField] = (0, react_1.useState)(initialFieldState);
@@ -215,14 +215,14 @@ function EventForm(inProps) {
         }
         if (field.location === types_1.SCEventLocationType.PERSON) {
             formData.append('geolocation', field.geolocation);
-            formData.append('geolocation_lat', field.lat);
-            formData.append('geolocation_lng', field.lng);
+            formData.append('geolocation_lat', field.lat.toString());
+            formData.append('geolocation_lng', field.lng.toString());
         }
         if (privateEnabled) {
             formData.append('privacy', field.isPublic ? types_1.SCEventPrivacyType.PUBLIC : types_1.SCEventPrivacyType.PRIVATE);
         }
         if (visibilityEnabled) {
-            formData.append('visible', true);
+            formData.append('visible', 'true');
         }
         formData.append('description', field.description);
         let eventService;
@@ -234,9 +234,9 @@ function EventForm(inProps) {
         }
         eventService
             .then((data) => {
-            onSuccess && onSuccess(data);
+            onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(data);
             notifyChanges(data);
-            onClose && onClose();
+            onClose === null || onClose === void 0 ? void 0 : onClose();
             setField((prev) => (Object.assign(Object.assign({}, prev), { ['isSubmitting']: false })));
         })
             .catch((e) => {
@@ -281,7 +281,7 @@ function EventForm(inProps) {
                 field.name.length > Event_1.EVENT_TITLE_MAX_LENGTH ||
                 field.description.length > Event_1.EVENT_DESCRIPTION_MAX_LENGTH, variant: "contained", onClick: handleSubmit, color: "secondary" }, { children: event ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.button.edit", defaultMessage: "ui.eventForm.button.edit" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.button.create", defaultMessage: "ui.eventForm.button.create" })) })) }, rest, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { 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 }) })), (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 }))
-                            }, error: Boolean(((_c = field === null || field === void 0 ? void 0 : field.name) === null || _c === void 0 ? void 0 : _c.length) > Event_1.EVENT_TITLE_MAX_LENGTH) || Boolean(error[`nameError`]), helperText: ((_d = field === null || field === void 0 ? void 0 : field.name) === null || _d === void 0 ? void 0 : _d.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 }, { children: [(0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, disablePast: true, 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: {
+                            }, 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 }, { children: [(0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, disablePast: true, 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" }) }) }))) }) })))
                                         }, slotProps: {
                                             toolbar: {
@@ -310,16 +310,12 @@ function EventForm(inProps) {
                                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                             // @ts-ignore
                                             b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
-                                        } })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: field.privacy === true ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.private.info.edit", defaultMessage: "ui.eventForm.private.public.info.edit", values: {
-                                                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                                // @ts-ignore
-                                                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
-                                                // @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: ((_e = field.description) === null || _e === void 0 ? void 0 : _e.length) ? Event_1.EVENT_DESCRIPTION_MAX_LENGTH - field.description.length : Event_1.EVENT_DESCRIPTION_MAX_LENGTH })))
-                            }, error: Boolean(((_f = field.description) === null || _f === void 0 ? void 0 : _f.length) > Event_1.EVENT_DESCRIPTION_MAX_LENGTH), helperText: ((_g = field.description) === null || _g === void 0 ? void 0 : _g.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 })] }))] }) })));
+                                        } })) : ((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
+                                            // @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: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) ? Event_1.EVENT_DESCRIPTION_MAX_LENGTH - field.description.length : Event_1.EVENT_DESCRIPTION_MAX_LENGTH })))
+                            }, error: Boolean(((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) > Event_1.EVENT_DESCRIPTION_MAX_LENGTH), helperText: ((_e = field.description) === null || _e === void 0 ? void 0 : _e.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 })] }))] }) })));
 }
 exports.default = EventForm;

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

@@ -0,0 +1,28 @@
+import { SCEventLocationType, SCEventRecurrenceType } from '@selfcommunity/types';
+export declare type Place = {
+    description: string;
+    id?: string;
+};
+export declare type Geolocation = {
+    location: SCEventLocationType;
+    geolocation?: string;
+    lat?: number;
+    lng?: number;
+    link?: string;
+};
+export declare type InitialFieldState = Geolocation & {
+    imageOriginal: string | ArrayBuffer;
+    imageOriginalFile: string | Blob;
+    startDate: Date | null;
+    startTime: Date | null;
+    endDate: Date | null;
+    endTime: Date | null;
+    recurring: SCEventRecurrenceType;
+    name: string;
+    description: string;
+    isPublic: boolean;
+    isSubmitting: boolean;
+    showEndDateTime: boolean;
+};
+export declare type FieldStateKeys = keyof InitialFieldState;
+export declare type FieldStateValues = InitialFieldState[FieldStateKeys];

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

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/cjs/components/EventHeader/EventHeader.js

@@ -176,6 +176,6 @@ function EventHeader(inProps) {
                                     month: 'long'
                                 }),
                                 hour: intl.formatDate(scEvent.start_date, { hour: 'numeric', minute: 'numeric' })
-                            } })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.name }, { children: scEvent.name })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.visibility }, { children: [(0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: scEvent.privacy === types_1.SCEventPrivacyType.PUBLIC ? ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.visibility.public", defaultMessage: "ui.eventHeader.visibility.public" })] }))) : ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.visibility.private", defaultMessage: "ui.eventHeader.visibility.private" })] }))) }), (0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: scEvent.location === types_1.SCEventLocationType.PERSON ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.location.live", defaultMessage: "ui.eventHeader.location.live" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.location.online", defaultMessage: "ui.eventHeader.location.online" })) }))] })), (0, jsx_runtime_1.jsx)(User_1.default, { className: classes.planner, userId: scEvent.managed_by.id, secondary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.user.manager", defaultMessage: "ui.eventHeader.user.manager" }), elevation: 0, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isEventAdmin ? ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.multiActions }, { children: [(0, jsx_runtime_1.jsx)(EventInviteButton_1.default, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, disabled: isEventFinished }), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(EditEventButton_1.default, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, onEditSuccess: (data) => setSCEvent(data), disabled: isEventFinished }), (0, jsx_runtime_1.jsx)(EventActionsMenu_1.default, Object.assign({ event: scEvent }, EventActionsProps))] })] }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(EventSubscribeButton_1.default, Object.assign({ event: scEvent, onSubscribe: handleSubscribe }, EventSubscribeButtonProps, { disabled: isEventFinished })), (0, jsx_runtime_1.jsx)(EventActionsMenu_1.default, Object.assign({ event: scEvent }, EventActionsProps))] })) }) })] }))] })));
+                            } })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.name }, { children: scEvent.name })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.visibility }, { children: [(0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: scEvent.privacy === types_1.SCEventPrivacyType.PUBLIC ? ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.visibility.public", defaultMessage: "ui.eventHeader.visibility.public" })] }))) : ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.visibility.private", defaultMessage: "ui.eventHeader.visibility.private" })] }))) }), (0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: scEvent.location === types_1.SCEventLocationType.PERSON ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.location.live", defaultMessage: "ui.eventHeader.location.live" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.location.online", defaultMessage: "ui.eventHeader.location.online" })) }))] })), (0, jsx_runtime_1.jsx)(User_1.default, { className: classes.planner, userId: scEvent.managed_by.id, secondary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.user.manager", defaultMessage: "ui.eventHeader.user.manager" }), elevation: 0, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isEventAdmin ? ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.multiActions }, { children: [(0, jsx_runtime_1.jsx)(EventInviteButton_1.default, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, disabled: isEventFinished }), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [!isMobile && ((0, jsx_runtime_1.jsx)(EditEventButton_1.default, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, onEditSuccess: (data) => setSCEvent(data), disabled: isEventFinished })), (0, jsx_runtime_1.jsx)(EventActionsMenu_1.default, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })] }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(EventSubscribeButton_1.default, Object.assign({ event: scEvent, onSubscribe: handleSubscribe }, EventSubscribeButtonProps, { disabled: isEventFinished })), (0, jsx_runtime_1.jsx)(EventActionsMenu_1.default, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })) }) })] }))] })));
 }
 exports.default = EventHeader;

package/lib/cjs/shared/EventActionsMenu/index.d.ts

@@ -18,6 +18,10 @@ export interface EventActionsMenuProps extends IconButtonProps {
      * Handles callback on delete confirm
      */
     onDeleteConfirm?: () => void;
+    /**
+     * Handles on edit success
+     */
+    onEditSuccess?: (data: SCEventType) => any;
     /**
      * Any other properties
      */

package/lib/cjs/shared/EventActionsMenu/index.js

@@ -17,6 +17,7 @@ const utils_1 = require("@selfcommunity/utils");
 const notistack_1 = require("notistack");
 const pubsub_js_1 = tslib_1.__importDefault(require("pubsub-js"));
 const PubSub_1 = require("../../constants/PubSub");
+const EventForm_1 = tslib_1.__importDefault(require("../../components/EventForm"));
 const PREFIX = 'SCEventActionsMenu';
 const classes = {
     root: `${PREFIX}-root`,
@@ -71,16 +72,17 @@ function EventActionsMenu(inProps) {
         props: inProps,
         name: PREFIX
     });
-    const { className, event, eventId, onDeleteConfirm } = props, rest = tslib_1.__rest(props, ["className", "event", "eventId", "onDeleteConfirm"]);
+    const { className, event, eventId, onDeleteConfirm, onEditSuccess } = props, rest = tslib_1.__rest(props, ["className", "event", "eventId", "onDeleteConfirm", "onEditSuccess"]);
     // STATE
     const [anchorEl, setAnchorEl] = (0, react_1.useState)(null);
     const [openConfirmDialog, setOpenConfirmDialog] = (0, react_1.useState)(false);
+    const [openEdit, setOpenEdit] = (0, react_1.useState)(false);
     // HOOKS
     const theme = (0, material_1.useTheme)();
     const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
     const scRoutingContext = (0, react_core_1.useSCRouting)();
     const scUserContext = (0, react_core_1.useSCUser)();
-    const { scEvent } = (0, react_core_1.useSCFetchEvent)({ id: eventId, event });
+    const { scEvent, setSCEvent } = (0, react_core_1.useSCFetchEvent)({ id: eventId, event });
     const isEventAdmin = (0, react_1.useMemo)(() => { var _a; return scUserContext.user && ((_a = scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by) === null || _a === void 0 ? void 0 : _a.id) === scUserContext.user.id; }, [scUserContext.user, (_a = scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by) === null || _a === void 0 ? void 0 : _a.id]);
     const isEventFinished = (0, react_1.useMemo)(() => {
         if (scEvent && !scEvent.running) {
@@ -95,10 +97,17 @@ function EventActionsMenu(inProps) {
     const handleClose = () => {
         setAnchorEl(null);
     };
+    const handleEditClick = () => {
+        setOpenEdit((o) => !o);
+    };
     const handleCloseDialog = () => {
         setOpenConfirmDialog(false);
         setAnchorEl(null);
     };
+    const handleEditSuccess = (data) => {
+        setSCEvent(data);
+        onEditSuccess && onEditSuccess(data);
+    };
     /**
      * Handles thread deletion
      */
@@ -150,6 +159,7 @@ function EventActionsMenu(inProps) {
             isEventAdmin &&
                 !isEventFinished && [
                 (0, jsx_runtime_1.jsx)(material_1.Divider, {}, "divider"),
+                isMobile && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.item, onClick: handleEditClick }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "edit" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.item.edit", defaultMessage: "ui.shared.eventActionsMenu.item.edit" })] }), "edit")),
                 (0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.item, onClick: () => handleAction(EventActionsMenu_1.CANCEL_EVENT) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "close" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.item.cancel", defaultMessage: "ui.shared.eventActionsMenu.item.cancel" })] }), "cancel")
             ]
         ];
@@ -157,6 +167,6 @@ function EventActionsMenu(inProps) {
     if (!scEvent) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { onClick: handleOpen }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "more_vert" }) })), isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, PaperProps: { className: classes.paper }, disableSwipeToOpen: true }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: renderList() }) }))) : ((0, jsx_runtime_1.jsx)(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, PaperProps: { className: classes.paper } }, { children: renderList() }))), openConfirmDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: openConfirmDialog, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.msg", defaultMessage: "ui.shared.eventActionsMenu.dialog.msg" }), btnConfirm: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.confirm", defaultMessage: "ui.shared.eventActionsMenu.dialog.confirm" }), onConfirm: handleDeleteThread, onClose: handleCloseDialog }))] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { onClick: handleOpen }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "more_vert" }) })), isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, PaperProps: { className: classes.paper }, disableSwipeToOpen: true }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: renderList() }) }))) : ((0, jsx_runtime_1.jsx)(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, PaperProps: { className: classes.paper } }, { children: renderList() }))), openConfirmDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: openConfirmDialog, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.msg", defaultMessage: "ui.shared.eventActionsMenu.dialog.msg" }), btnConfirm: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.confirm", defaultMessage: "ui.shared.eventActionsMenu.dialog.confirm" }), onConfirm: handleDeleteThread, onClose: handleCloseDialog })), openEdit && (0, jsx_runtime_1.jsx)(EventForm_1.default, { onClose: handleEditClick, event: scEvent, onSuccess: handleEditSuccess })] }));
 }
 exports.default = EventActionsMenu;

package/lib/esm/components/EventForm/EventAddress.d.ts

@@ -1,13 +1,8 @@
-import { SCEventLocationType, SCEventType } from '@selfcommunity/types';
+import { SCEventType } from '@selfcommunity/types';
+import { Geolocation } from './types';
 export interface EventAddressProps {
     event?: SCEventType;
-    forwardGeolocationData: (data: {
-        location: SCEventLocationType;
-        geolocation?: string;
-        lat?: number;
-        lng?: number;
-        link?: string;
-    }) => void;
+    forwardGeolocationData: (data: Geolocation) => void;
     className?: string;
 }
 export default function EventAddress(inProps: EventAddressProps): JSX.Element;

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

@@ -1,19 +1,19 @@
 import { __awaiter } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useEffect, useMemo, useState } from 'react';
-import { styled } from '@mui/material/styles';
 import { Autocomplete, Box, InputAdornment, Tab, Tabs, TextField } from '@mui/material';
 import Icon from '@mui/material/Icon';
-import classNames from 'classnames';
+import { styled } from '@mui/material/styles';
 import { useThemeProps } from '@mui/system';
-import { PREFIX } from './constants';
-import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
-import UrlTextField from '../../shared/UrlTextField';
-import axios from 'axios';
+import { useLoadScript } from '@react-google-maps/api';
 import { useSCContext } from '@selfcommunity/react-core';
-import HiddenPlaceholder from '../../shared/HiddenPlaceholder';
 import { SCEventLocationType } from '@selfcommunity/types';
-import { useLoadScript } from '@react-google-maps/api';
+import axios from 'axios';
+import classNames from 'classnames';
+import { useEffect, useMemo, useState } from 'react';
+import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
+import HiddenPlaceholder from '../../shared/HiddenPlaceholder';
+import UrlTextField from '../../shared/UrlTextField';
+import { PREFIX } from './constants';
 const messages = defineMessages({
     virtualPlaceholder: {
         id: 'ui.eventForm.address.online.placeholder',
@@ -41,8 +41,8 @@ export default function EventAddress(inProps) {
     // PROPS
     const { className, forwardGeolocationData, event } = props;
     // STATE
-    const [location, setLocation] = useState(event ? event.location : SCEventLocationType.PERSON);
-    const [geolocation, setGeoLocation] = useState(event ? event.geolocation : null);
+    const [location, setLocation] = useState((event === null || event === void 0 ? void 0 : event.location) || SCEventLocationType.PERSON);
+    const [geolocation, setGeoLocation] = useState(event ? { description: event.geolocation } : null);
     const [inputValue, setInputValue] = useState('');
     const [suggestions, setSuggestions] = useState([]);
     const [timeoutId, setTimeoutId] = useState(null);
@@ -54,22 +54,22 @@ export default function EventAddress(inProps) {
         libraries: ['places', 'geocoding']
     });
     // HANDLERS
-    const handleChange = (event, newValue) => {
+    const handleChange = (_event, newValue) => {
         setLocation(newValue);
     };
-    const handleSelection = (event, newValue) => __awaiter(this, void 0, void 0, function* () {
+    const handleSelection = (_event, newValue) => __awaiter(this, void 0, void 0, function* () {
         if (newValue) {
             try {
                 const response = yield axios.get(`https://maps.googleapis.com/maps/api/geocode/json`, {
                     params: {
-                        place_id: newValue.place_id,
+                        place_id: newValue.id,
                         key: geocodingApiKey
                     }
                 });
                 const place = response.data.results[0];
                 setGeoLocation(newValue);
                 forwardGeolocationData({
-                    location: location,
+                    location,
                     geolocation: place.formatted_address,
                     lat: place.geometry.location.lat,
                     lng: place.geometry.location.lng
@@ -80,11 +80,11 @@ export default function EventAddress(inProps) {
             }
         }
     });
-    const handleLocationChange = (event, newInputValue) => {
+    const handleLocationChange = (_event, newInputValue) => {
         setInputValue(newInputValue);
     };
     const handleLinkChange = (event) => {
-        forwardGeolocationData({ location: location, link: event.target.value });
+        forwardGeolocationData({ location, link: event.target.value });
     };
     useEffect(() => {
         if (timeoutId) {
@@ -95,13 +95,13 @@ export default function EventAddress(inProps) {
             return;
         }
         if (inputValue.length >= 3) {
-            const newTimeoutId = window.setTimeout(() => {
+            const newTimeoutId = setTimeout(() => {
                 const autocompleteService = new window.google.maps.places.AutocompleteService();
                 autocompleteService.getPlacePredictions({ input: inputValue }, (predictions, status) => {
                     if (status === window.google.maps.places.PlacesServiceStatus.OK && predictions) {
                         setSuggestions(predictions.map((prediction) => ({
                             description: prediction.description,
-                            place_id: prediction.place_id
+                            id: prediction.place_id
                         })));
                     }
                 });
@@ -112,7 +112,7 @@ export default function EventAddress(inProps) {
     if (!geocodingApiKey && !isLoaded) {
         return _jsx(HiddenPlaceholder, {});
     }
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsxs(Tabs, Object.assign({ className: classes.tabs, value: location, onChange: handleChange, indicatorColor: "secondary", textColor: "secondary", variant: "fullWidth" }, { children: [_jsx(Tab, { value: SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "add_location_alt" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.label", defaultMessage: "ui.eventForm.address.live.label" }) }), _jsx(Tab, { value: SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "play_circle_outline" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.label", defaultMessage: "ui.eventForm.address.online.label" }) })] })), _jsxs(Box, Object.assign({ className: classes.tabContent }, { children: [location === SCEventLocationType.PERSON && (_jsx(Autocomplete, { freeSolo: true, size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation, noOptionsText: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { label: _jsx(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: (_jsxs(_Fragment, { children: [_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(Icon, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) }) }))) })), location === SCEventLocationType.ONLINE && (_jsx(UrlTextField, { size: "small", fullWidth: true, type: "url", placeholder: `${intl.formatMessage(messages.virtualPlaceholder)}`, helperText: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.help", defaultMessage: "ui.eventForm.address.online.help" }), InputProps: {
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsxs(Tabs, Object.assign({ className: classes.tabs, value: location, onChange: handleChange, indicatorColor: "secondary", textColor: "secondary", variant: "fullWidth" }, { children: [_jsx(Tab, { value: SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "add_location_alt" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.label", defaultMessage: "ui.eventForm.address.live.label" }) }), _jsx(Tab, { value: SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "play_circle_outline" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.label", defaultMessage: "ui.eventForm.address.online.label" }) })] })), _jsxs(Box, Object.assign({ className: classes.tabContent }, { children: [location === SCEventLocationType.PERSON && (_jsx(Autocomplete, { size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation.description, noOptionsText: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), isOptionEqualToValue: (option, value) => option.description === value.description, renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { label: _jsx(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: (_jsxs(_Fragment, { children: [_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(Icon, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) }) }))) })), location === SCEventLocationType.ONLINE && (_jsx(UrlTextField, { size: "small", fullWidth: true, type: "url", placeholder: `${intl.formatMessage(messages.virtualPlaceholder)}`, helperText: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.help", defaultMessage: "ui.eventForm.address.online.help" }), InputProps: {
                             endAdornment: _jsx(Icon, { children: "play_circle_outline" })
                         }, onChange: handleLinkChange }))] }))] })));
 }

package/lib/esm/components/EventForm/EventForm.d.ts

@@ -25,7 +25,7 @@ export interface EventFormProps extends BaseDialogProps {
      * On success callback function
      * @default null
      */
-    onSuccess?: (data: any) => void;
+    onSuccess?: (data: SCEventType) => void;
     /**
      * Any other properties
      */