@selfcommunity/react-ui 0.8.0-embeds.16 → 0.8.0-live.40

package/lib/cjs/components/EventMediaWidget/TriggerButton.js

@@ -0,0 +1,66 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const lab_1 = require("@mui/lab");
+const material_1 = require("@mui/material");
+const Icon_1 = tslib_1.__importDefault(require("@mui/material/Icon"));
+const styles_1 = require("@mui/material/styles");
+const chunked_uploady_1 = tslib_1.__importDefault(require("@rpldy/chunked-uploady"));
+const api_services_1 = require("@selfcommunity/api-services");
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const notistack_1 = require("notistack");
+const react_1 = require("react");
+const react_intl_1 = require("react-intl");
+const MediaChunkUploader_1 = tslib_1.__importDefault(require("../../shared/MediaChunkUploader"));
+const asUploadButton_1 = tslib_1.__importDefault(require("./asUploadButton"));
+const constants_1 = require("./constants");
+const classes = {
+    triggerRoot: `${constants_1.PREFIX}-trigger-root`,
+    triggerContent: `${constants_1.PREFIX}-trigger-content`,
+    triggerIcon: `${constants_1.PREFIX}-trigger-icon`
+};
+const Root = (0, styles_1.styled)(lab_1.LoadingButton, {
+    name: constants_1.PREFIX,
+    slot: 'TriggerRoot',
+    overridesResolver: (_props, styles) => styles.triggerRoot,
+    shouldForwardProp: (prop) => prop !== 'isSquare'
+})(() => ({}));
+const GalleryUploadStack = (0, asUploadButton_1.default)((0, react_1.forwardRef)((props, ref) => (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({}, props, { "aria-label": "upload", ref: ref }))), { accept: 'image/*' });
+function TriggerButton(props, ref) {
+    // PROPS
+    const { className, onAdd = null, isSquare = false } = props, rest = tslib_1.__rest(props, ["className", "onAdd", "isSquare"]);
+    // STATE
+    const [isUploading, setIsUploading] = (0, react_1.useState)(false);
+    // HOOKS
+    const { enqueueSnackbar, closeSnackbar } = (0, notistack_1.useSnackbar)();
+    const handleFilterByMime = (0, react_1.useCallback)((file) => {
+        return file.type.startsWith('image/');
+    }, []);
+    const handleSuccess = (0, react_1.useCallback)((media) => {
+        onAdd === null || onAdd === void 0 ? void 0 : onAdd(media);
+    }, []);
+    const handleProgress = (0, react_1.useCallback)((chunks) => {
+        setIsUploading(Object.keys(chunks).length > 0);
+    }, []);
+    const handleError = (0, react_1.useCallback)((chunk, error) => {
+        const _snackBar = enqueueSnackbar(`${chunk.name}: ${error}`, {
+            variant: 'error',
+            anchorOrigin: { horizontal: 'center', vertical: 'top' },
+            autoHideDuration: 2000,
+            SnackbarProps: {
+                onClick: () => {
+                    closeSnackbar(_snackBar);
+                }
+            }
+        });
+    }, [enqueueSnackbar]);
+    return ((0, jsx_runtime_1.jsxs)(chunked_uploady_1.default, { destination: {
+            url: api_services_1.Endpoints.ComposerChunkUploadMedia.url(),
+            method: api_services_1.Endpoints.ComposerChunkUploadMedia.method
+        }, fileFilter: handleFilterByMime, chunkSize: 204800, children: [(0, jsx_runtime_1.jsx)(MediaChunkUploader_1.default, { onSuccess: handleSuccess, onProgress: handleProgress, onError: handleError, type: "image" }), (0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.triggerRoot), ref: ref }, rest, { "aria-label": "add media", loading: isUploading, 
+                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                // @ts-ignore
+                isSquare: isSquare, children: (0, jsx_runtime_1.jsxs)(GalleryUploadStack, { className: classes.triggerContent, children: [!isSquare && ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "caption", component: "p", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMediaWidget.add", defaultMessage: "ui.eventMediaWidget.add" }) })), (0, jsx_runtime_1.jsx)(Icon_1.default, { className: classes.triggerIcon, children: "add" })] }) }))] }));
+}
+exports.default = (0, react_1.forwardRef)(TriggerButton);

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

@@ -0,0 +1,7 @@
+import { UploadButtonProps } from '@rpldy/upload-button';
+import type { ComponentType } from 'react';
+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>>;
+export default asUploadButton;

package/lib/cjs/components/EventMediaWidget/asUploadButton.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const shared_ui_1 = require("@rpldy/shared-ui");
+const react_1 = require("react");
+const asUploadButton = (Component, inputProps) => {
+    const AsUploadButton = (props, ref) => {
+        const { showFileUpload, getInternalFileInput } = (0, shared_ui_1.useUploadyContext)();
+        const { id, className, text, children, extraProps, onClick } = props, uploadOptions = tslib_1.__rest(props, ["id", "className", "text", "children", "extraProps", "onClick"]);
+        //using ref so onButtonClick can stay memoized
+        const uploadOptionsRef = (0, react_1.useRef)();
+        uploadOptionsRef.current = uploadOptions;
+        const onButtonClick = (0, react_1.useCallback)((e) => {
+            const input = getInternalFileInput();
+            input.current.accept = inputProps.accept;
+            showFileUpload(uploadOptionsRef.current);
+            onClick === null || onClick === void 0 ? void 0 : onClick(e);
+        }, [getInternalFileInput, showFileUpload, uploadOptionsRef, onClick]);
+        return (0, jsx_runtime_1.jsx)(Component, Object.assign({ ref: ref, onClick: onButtonClick, id: id, className: className, children: children || text || 'Upload' }, extraProps));
+    };
+    (0, shared_ui_1.markAsUploadOptionsComponent)(AsUploadButton);
+    return (0, react_1.forwardRef)(AsUploadButton);
+};
+exports.default = asUploadButton;

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

@@ -0,0 +1 @@
+export declare const PREFIX = "SCEventMediaWidget";

package/lib/cjs/components/EventMediaWidget/constants.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PREFIX = void 0;
+exports.PREFIX = 'SCEventMediaWidget';

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

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

package/lib/cjs/components/EventMediaWidget/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EventMediaWidgetSkeleton = void 0;
+const tslib_1 = require("tslib");
+const EventMediaWidget_1 = tslib_1.__importDefault(require("./EventMediaWidget"));
+const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
+exports.EventMediaWidgetSkeleton = Skeleton_1.default;
+exports.default = EventMediaWidget_1.default;

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

@@ -35,6 +35,9 @@ export interface EventMembersWidgetProps extends WidgetProps {
      * @default {}
      */
     dialogProps?: BaseDialogProps;
+    /**
+     * Limit items
+     */
     limit?: number;
     /**
      * Other props

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

@@ -13,7 +13,6 @@ const react_intl_1 = require("react-intl");
 require("swiper/css");
 const Errors_1 = require("../../constants/Errors");
 const Pagination_1 = require("../../constants/Pagination");
-const HiddenPlaceholder_1 = tslib_1.__importDefault(require("../../shared/HiddenPlaceholder"));
 const widget_1 = require("../../utils/widget");
 const Widget_1 = tslib_1.__importDefault(require("../Widget"));
 const constants_1 = require("./constants");
@@ -62,10 +61,10 @@ function EventMembersWidget(inProps) {
         cacheStrategy,
         visibleItems: limit
     }, widget_1.stateWidgetInitializer);
-    const [participantsCount, setParticipantsCount] = (0, react_1.useState)(0);
-    const [invitedCount, setInvitedCount] = (0, react_1.useState)(0);
-    const [requestsCount, setRequestsCount] = (0, react_1.useState)(0);
-    const [requestsUsers, setRequestsUsers] = (0, react_1.useState)([]);
+    const [participantsCount, setParticipantsCount] = (0, react_1.useState)(participants.count);
+    const [invitedCount, setInvitedCount] = (0, react_1.useState)(invited.count);
+    const [requestsCount, setRequestsCount] = (0, react_1.useState)(requests.count);
+    const [requestsUsers, setRequestsUsers] = (0, react_1.useState)(requests.results);
     const [tabValue, setTabValue] = (0, react_1.useState)(types_1.TabContentEnum.PARTICIPANTS);
     const [refresh, setRefresh] = (0, react_1.useState)(null);
     // CONTEXT
@@ -99,7 +98,7 @@ function EventMembersWidget(inProps) {
                 utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
             });
         }
-    }, [participants.isLoadingNext, participants.initialized, scEvent]);
+    }, [participants.isLoadingNext, participants.initialized, scEvent, dispatchParticipants, setParticipantsCount]);
     const _initInvited = (0, react_1.useCallback)(() => {
         if (!invited.initialized && !invited.isLoadingNext && hasAllow) {
             dispatchInvited({ type: widget_1.actionWidgetTypes.LOADING_NEXT });
@@ -113,7 +112,7 @@ function EventMembersWidget(inProps) {
                 utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
             });
         }
-    }, [invited.isLoadingNext, invited.initialized, scUserContext.user, scEvent]);
+    }, [invited.isLoadingNext, invited.initialized, scEvent, dispatchInvited, setInvitedCount]);
     const _initRequests = (0, react_1.useCallback)(() => {
         if (!requests.initialized && !requests.isLoadingNext && hasAllow) {
             dispatchRequests({ type: widget_1.actionWidgetTypes.LOADING_NEXT });
@@ -128,7 +127,7 @@ function EventMembersWidget(inProps) {
                 utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
             });
         }
-    }, [requests.isLoadingNext, requests.initialized, scUserContext.user, scEvent]);
+    }, [requests.isLoadingNext, requests.initialized, scEvent, dispatchRequests, setRequestsCount, setRequestsUsers]);
     // EFFECTS
     (0, react_1.useEffect)(() => {
         let _t;
@@ -153,6 +152,13 @@ function EventMembersWidget(inProps) {
             };
         }
     }, [scUserContext.user, scEvent, refresh]);
+    (0, react_1.useEffect)(() => {
+        if (participants.initialized && scEvent && Boolean((eventId !== undefined && scEvent.id !== eventId) || (event && scEvent.id !== event.id))) {
+            dispatchParticipants({ type: widget_1.actionWidgetTypes.RESET, payload: {} });
+            dispatchRequests({ type: widget_1.actionWidgetTypes.RESET, payload: {} });
+            dispatchInvited({ type: widget_1.actionWidgetTypes.RESET, payload: {} });
+        }
+    }, [participants.initialized, scEvent, eventId, event]);
     // HANDLERS
     const handleTabChange = (0, react_1.useCallback)((_evt, newTabValue) => {
         setTabValue(newTabValue);
@@ -166,22 +172,21 @@ function EventMembersWidget(inProps) {
         }
         setRefresh(_tabValue);
     }, []);
-    if (!scEvent && !participants.initialized) {
+    if (!scEvent ||
+        !participants.initialized ||
+        (scEvent && ((eventId !== undefined && scEvent.id !== eventId) || (event && scEvent.id !== event.id))) ||
+        (tabValue === types_1.TabContentEnum.PARTICIPANTS && participants.isLoadingNext && !participants.initialized)) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    // RENDER
-    if (!scEvent) {
-        return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_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.TabContentEnum.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.TabContentEnum.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.TabContentEnum.REQUESTS }))] })), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ value: types_1.TabContentEnum.PARTICIPANTS, className: classes.tabPanel }, { children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentEnum.PARTICIPANTS, state: participants, dispatch: dispatchParticipants, userProps: userProps, dialogProps: dialogProps, handleRefresh: handleRefresh }) })), hasAllow && ((0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ value: types_1.TabContentEnum.INVITED, className: classes.tabPanel }, { children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentEnum.INVITED, state: invited, dispatch: dispatchInvited, 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, { className: classes.content, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { 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, { value: tabValue, children: [(0, jsx_runtime_1.jsxs)(lab_1.TabList, { 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, { className: classes.tabLabelWrapper, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h3", children: participantsCount }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "subtitle2", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.participants", defaultMessage: "ui.eventMembersWidget.participants" }) })] }), value: types_1.TabContentEnum.PARTICIPANTS }), hasAllow && ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, { className: classes.tabLabelWrapper, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h3", children: invitedCount }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "subtitle2", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.invited", defaultMessage: "ui.eventMembersWidget.invited" }) })] }), value: types_1.TabContentEnum.INVITED })), hasAllow && ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, { className: classes.tabLabelWrapper, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h3", children: requestsCount }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "subtitle2", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.requests", defaultMessage: "ui.eventMembersWidget.requests" }) })] }), value: types_1.TabContentEnum.REQUESTS }))] }), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, { value: types_1.TabContentEnum.PARTICIPANTS, className: classes.tabPanel, children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentEnum.PARTICIPANTS, state: participants, dispatch: dispatchParticipants, userProps: userProps, dialogProps: dialogProps, handleRefresh: handleRefresh }) }), hasAllow && ((0, jsx_runtime_1.jsx)(lab_1.TabPanel, { value: types_1.TabContentEnum.INVITED, className: classes.tabPanel, children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentEnum.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.TabContentEnum.REQUESTS, className: classes.tabPanel }, { children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentEnum.REQUESTS, state: requests, dispatch: dispatchRequests, userProps: userProps, dialogProps: dialogProps, actionProps: {
+                                }, handleRefresh: handleRefresh }) })), hasAllow && ((0, jsx_runtime_1.jsx)(lab_1.TabPanel, { value: types_1.TabContentEnum.REQUESTS, className: classes.tabPanel, children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentEnum.REQUESTS, state: requests, dispatch: dispatchRequests, userProps: userProps, dialogProps: dialogProps, actionProps: {
                                     scEvent,
                                     count: requestsCount,
                                     setCount: setRequestsCount,
                                     users: requestsUsers,
                                     setUsers: setRequestsUsers
-                                }, handleRefresh: handleRefresh }) })))] }))] })) })));
+                                }, handleRefresh: handleRefresh }) }))] })] }) })));
 }
 exports.default = EventMembersWidget;

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, { className: classes.root, children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, { 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, { value: "1", children: [(0, jsx_runtime_1.jsx)(system_1.Box, { className: classes.tabsWrapper, children: (0, jsx_runtime_1.jsx)(lab_1.TabList, { 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, { 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, { 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 })] })] }) }));
 }
 exports.default = EventMembersWidgetSkeleton;

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

@@ -115,7 +115,7 @@ function TabContentComponent(props) {
         return undefined;
     }, [tabValue, actionProps]);
     if (tabValue === types_1.TabContentEnum.PARTICIPANTS && (actionProps === null || actionProps === void 0 ? void 0 : actionProps.count) === 0) {
-        return ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.noParticipants", defaultMessage: "ui.eventMembersWidget.noParticipants" }) })));
+        return ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.noParticipants", defaultMessage: "ui.eventMembersWidget.noParticipants" }) }));
     }
     else if (tabValue === types_1.TabContentEnum.INVITED && state.count === 0 && actionProps) {
         const date = actionProps.scEvent.end_date || actionProps.scEvent.start_date;
@@ -128,8 +128,8 @@ function TabContentComponent(props) {
         return ((0, jsx_runtime_1.jsx)(EventInviteButton_1.default, { event: actionProps.scEvent, className: classes.eventButton, handleInvitations: handleInvitations, disabled: disabled }));
     }
     else if (tabValue === types_1.TabContentEnum.REQUESTS && (actionProps === null || actionProps === void 0 ? void 0 : actionProps.count) === 0) {
-        return ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.noOtherRequests", defaultMessage: "ui.eventMembersWidget.noOtherRequests" }) })));
+        return ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.noOtherRequests", defaultMessage: "ui.eventMembersWidget.noOtherRequests" }) }));
     }
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.List, { children: users === null || users === void 0 ? void 0 : users.map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, userProps, { actions: getActionsComponent(user.id) })) }, user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ onClick: handleToggleDialogOpen, className: classes.actionButton }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "caption" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.showAll", defaultMessage: "ui.eventMembersWidget.showAll" }) })) }))), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.eventMembersWidget.title", id: "ui.eventMembersWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, dialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, userProps)), className: classes.infiniteScroll, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.noMoreResults", defaultMessage: "ui.eventMembersWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: state.results.map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, userProps)) }, user.id))) }) })) })))] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.List, { children: users === null || users === void 0 ? void 0 : users.map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, userProps, { actions: getActionsComponent(user.id) })) }, user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, { onClick: handleToggleDialogOpen, className: classes.actionButton, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "caption", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.showAll", defaultMessage: "ui.eventMembersWidget.showAll" }) }) })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.eventMembersWidget.title", id: "ui.eventMembersWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, dialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, userProps)), className: classes.infiniteScroll, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.endMessage, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.noMoreResults", defaultMessage: "ui.eventMembersWidget.noMoreResults" }) }), children: (0, jsx_runtime_1.jsx)(material_1.List, { children: state.results.map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, userProps)) }, user.id))) }) }) })))] }));
 }
 exports.default = TabContentComponent;

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

@@ -1,4 +1,4 @@
-export declare type TabContentType = '1' | '2' | '3';
+export type TabContentType = '1' | '2' | '3';
 export declare enum TabContentEnum {
     PARTICIPANTS = "1",
     INVITED = "2",

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

@@ -6,4 +6,4 @@ var TabContentEnum;
     TabContentEnum["PARTICIPANTS"] = "1";
     TabContentEnum["INVITED"] = "2";
     TabContentEnum["REQUESTS"] = "3";
-})(TabContentEnum = exports.TabContentEnum || (exports.TabContentEnum = {}));
+})(TabContentEnum || (exports.TabContentEnum = TabContentEnum = {}));

package/lib/cjs/components/EventParticipantsButton/EventParticipantsButton.js

@@ -131,6 +131,6 @@ function EventParticipantsButton(inProps) {
     const handleToggleDialogOpen = (0, react_1.useCallback)(() => {
         setOpen((prev) => !prev);
     }, [setOpen]);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), onClick: handleToggleDialogOpen, disabled: loading || !scEvent || scEvent.goings_counter === 0 }, rest, { children: [!hideCaption && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.participants, variant: "caption" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.eventParticipantsButton.participants", id: "ui.eventParticipantsButton.participants" }) }))), !followers.length && (loading || !scEvent) ? ((0, jsx_runtime_1.jsx)(AvatarGroupSkeleton_1.default, Object.assign({}, rest, (!participantsAvailable && { skeletonsAnimation: false })))) : ((0, jsx_runtime_1.jsx)(material_1.AvatarGroup, Object.assign({ total: followers.length }, { children: followers.map((c) => ((0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: c.username, src: c.avatar, className: classes.avatar }, c.id))) })))] })), open && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.eventParticipantsButton.dialogTitle", id: "ui.eventParticipantsButton.dialogTitle", values: { total: scEvent.goings_counter } }), onClose: handleToggleDialogOpen, open: open }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: followers.length, next: fetchFollowers, hasMoreNext: next !== null || loading, loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, { elevation: 0 }), className: classes.infiniteScroll, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventParticipantsButton.noOtherParticipants", defaultMessage: "ui.eventParticipantsButton.noOtherParticipants" }) })) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: followers.map((follower) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, { elevation: 0, user: follower }) }, follower.id))) }) })) })))] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), onClick: handleToggleDialogOpen, disabled: loading || !scEvent || scEvent.goings_counter === 0 }, rest, { children: [!hideCaption && ((0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.participants, variant: "caption", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.eventParticipantsButton.participants", id: "ui.eventParticipantsButton.participants" }) })), !followers.length && (loading || !scEvent) ? ((0, jsx_runtime_1.jsx)(AvatarGroupSkeleton_1.default, Object.assign({}, rest, (!participantsAvailable && { skeletonsAnimation: false })))) : ((0, jsx_runtime_1.jsx)(material_1.AvatarGroup, { total: followers.length, children: followers.map((c) => ((0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: c.username, src: c.avatar, className: classes.avatar }, c.id))) }))] })), open && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.eventParticipantsButton.dialogTitle", id: "ui.eventParticipantsButton.dialogTitle", values: { total: scEvent.goings_counter } }), onClose: handleToggleDialogOpen, open: open }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, { dataLength: followers.length, next: fetchFollowers, hasMoreNext: next !== null || loading, loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, { elevation: 0 }), className: classes.infiniteScroll, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.endMessage, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventParticipantsButton.noOtherParticipants", defaultMessage: "ui.eventParticipantsButton.noOtherParticipants" }) }), children: (0, jsx_runtime_1.jsx)(material_1.List, { children: followers.map((follower) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, { elevation: 0, user: follower }) }, follower.id))) }) }) })))] }));
 }
 exports.default = EventParticipantsButton;

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

@@ -145,7 +145,7 @@ function EventSubscribeButton(inProps) {
         }
     };
     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, { 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))) }));
     }
     /**
      * Get current translated status
@@ -177,6 +177,6 @@ function EventSubscribeButton(inProps) {
         return null;
     }
     return ((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 })), isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, PaperProps: { className: classes.paper }, open: open, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: renderMenuItems() }))) : ((0, jsx_runtime_1.jsx)(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: open, 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 })), isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, { className: classes.drawerRoot, PaperProps: { className: classes.paper }, open: open, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true, children: renderMenuItems() })) : ((0, jsx_runtime_1.jsx)(MenuRoot, { className: classes.menuRoot, anchorEl: anchorEl, open: open, onClose: handleClose, children: renderMenuItems() }))] })) }));
 }
 exports.default = EventSubscribeButton;

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

@@ -22,6 +22,7 @@ const constants_1 = require("./constants");
 const PastEventsFilter_1 = tslib_1.__importDefault(require("./PastEventsFilter"));
 const pubsub_js_1 = tslib_1.__importDefault(require("pubsub-js"));
 const PubSub_1 = require("../../constants/PubSub");
+const LocationEventsFilter_1 = tslib_1.__importDefault(require("./LocationEventsFilter"));
 const classes = {
     root: `${constants_1.PREFIX}-root`,
     filters: `${constants_1.PREFIX}-filters`,
@@ -89,6 +90,7 @@ function Events(inProps) {
     const [next, setNext] = (0, react_1.useState)(null);
     const [query, setQuery] = (0, react_1.useState)('');
     const [dateSearch, setDateSearch] = (0, react_1.useState)(options[0].value);
+    const [location, setLocation] = (0, react_1.useState)(types_1.SCEventLocationFilterType.ANY);
     const [showFollowed, setShowFollowed] = (0, react_1.useState)(false);
     const [showPastEvents, setShowPastEvents] = (0, react_1.useState)(false);
     const [showMyEvents, setShowMyEvents] = (0, react_1.useState)(false);
@@ -128,7 +130,7 @@ function Events(inProps) {
             url: endpoint.url({}),
             method: endpoint.method,
             params: Object.assign(Object.assign({}, endpointQueryParams), (general
-                ? Object.assign(Object.assign(Object.assign(Object.assign({}, (search && { search: query })), (dateSearch !== types_1.SCEventDateFilterType.ANY && { date_filter: dateSearch })), (showFollowed && { follows: showFollowed })), (showPastEvents && { date_filter: types_1.SCEventDateFilterType.PAST })) : Object.assign(Object.assign({ subscription_status: types_1.SCEventSubscriptionStatusType.GOING }, (showPastEvents && { past: showPastEvents })), (showMyEvents && { created_by: authUserId }))))
+                ? Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (search && { search: query })), (dateSearch !== types_1.SCEventDateFilterType.ANY && { date_filter: dateSearch })), (location !== types_1.SCEventLocationFilterType.ANY && { location })), (showFollowed && { follows: showFollowed })), (showPastEvents && { date_filter: types_1.SCEventDateFilterType.PAST })) : Object.assign(Object.assign(Object.assign({ subscription_status: types_1.SCEventSubscriptionStatusType.GOING }, (location !== types_1.SCEventLocationFilterType.ANY && { location })), (showPastEvents && { past: showPastEvents })), (showMyEvents && { created_by: authUserId }))))
         })
             .then((res) => {
             setEvents(res.data.results);
@@ -143,13 +145,13 @@ function Events(inProps) {
      * On mount, fetches events list
      */
     (0, react_1.useEffect)(() => {
-        if (!contentAvailability) {
+        if (!contentAvailability && !authUserId) {
             return;
         }
         else {
             query === '' && fetchEvents();
         }
-    }, [contentAvailability, dateSearch, showFollowed, showPastEvents, showMyEvents, query]);
+    }, [contentAvailability, authUserId, dateSearch, location, showFollowed, showPastEvents, showMyEvents, query]);
     /**
      * Subscriber for pubsub callback
      */
@@ -202,10 +204,17 @@ function Events(inProps) {
     const handleOnChangeTimeFrame = (event) => {
         setDateSearch(event.target.value);
     };
+    /**
+     * Handle change location
+     * @param event
+     */
+    const handleOnChangeLocation = (event) => {
+        setLocation(event.target.value);
+    };
     /**
      * Renders events list
      */
-    const c = ((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) : !general ? ((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)(PastEventsFilter_1.default, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, autoHide: !events.length && !showPastEvents, disabled: loading }) })), (events.length !== 0 || (events.length === 0 && showMyEvents)) && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(exports.EventsChipRoot
+    const c = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [showFilters && ((0, jsx_runtime_1.jsx)(material_1.Grid, { container: true, className: classes.filters, gap: 2, children: filters ? (filters) : !general ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(events.length !== 0 || (events.length === 0 && showMyEvents)) && ((0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, children: (0, jsx_runtime_1.jsx)(exports.EventsChipRoot
                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                             // @ts-ignore
                             , { 
@@ -217,14 +226,14 @@ function Events(inProps) {
                                 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), 
                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                 // @ts-ignore
-                                showFollowed: showMyEvents, deleteIcon: showMyEvents ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showMyEvents ? handleDeleteClick : null, disabled: loading }) })))] })) : ((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: 4 }, { 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 || (!events.length && !query), onKeyUp: (e) => {
+                                showFollowed: showMyEvents, deleteIcon: showMyEvents ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showMyEvents ? handleDeleteClick : null, autoHide: !loading && !events.length, disabled: loading }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, children: (0, jsx_runtime_1.jsx)(PastEventsFilter_1.default, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, autoHide: !loading && !events.length && !showPastEvents, disabled: loading }) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 12, md: 2, children: (0, jsx_runtime_1.jsx)(LocationEventsFilter_1.default, { value: location, autoHide: !loading && !events.length, disabled: loading || (!events.length && !location), handleOnChange: handleOnChangeLocation }) })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { 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 || (!events.length && !query), onKeyUp: (e) => {
                                     e.preventDefault();
                                     if (e.key === 'Enter') {
                                         fetchEvents(true);
                                     }
                                 }, 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(true), disabled: loading || (!events.length && !query) }, { 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(true), endIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }), disabled: loading || (!events.length && !query) })) })))
-                                } }) })), (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: showPastEvents || loading || (!events.length && dateSearch === types_1.SCEventDateFilterType.ANY), 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))) }))] })) })), authUserId && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(exports.EventsChipRoot
+                                    endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, { position: "end", children: isMobile ? ((0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: () => fetchEvents(true), disabled: loading || (!events.length && !query), 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(true), endIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }), disabled: loading || (!events.length && !query) })) }))
+                                } }) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 12, md: 2, children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, { 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, { disabled: showPastEvents || loading || (!events.length && dateSearch === types_1.SCEventDateFilterType.ANY), 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, { 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, { item: true, xs: 12, md: 2, children: (0, jsx_runtime_1.jsx)(LocationEventsFilter_1.default, { value: location, disabled: loading || (!events.length && !location), handleOnChange: handleOnChangeLocation }) }), authUserId && ((0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, children: (0, jsx_runtime_1.jsx)(exports.EventsChipRoot
                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                             // @ts-ignore
                             , { 
@@ -236,8 +245,8 @@ function Events(inProps) {
                                 variant: showFollowed ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByFollowedInterest", defaultMessage: "ui.events.filterByFollowedInterest" }), onClick: handleChipClick, 
                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                 // @ts-ignore
-                                showFollowed: showFollowed, deleteIcon: showFollowed ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showFollowed ? handleDeleteClick : null, disabled: loading || (!events.length && !showFollowed) }) }))), (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: dateSearch !== types_1.SCEventDateFilterType.ANY || loading || (!events.length && !showPastEvents) }) }))] })) }))), (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: (onlyStaffEnabled && !react_core_1.UserUtils.isStaff(scUserContext.user)) ||
-                            (onlyStaffEnabled && react_core_1.UserUtils.isStaff(scUserContext.user) && general) ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({}, EventSkeletonComponentProps)), (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" }) }))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: (0, jsx_runtime_1.jsx)(CreateEventButton_1.default, {}) })), (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.onlyStaff", defaultMessage: "ui.events.noEvents.title.onlyStaff" }) }))] })) }))) : ((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" }, { 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 || (!events.length && !showFollowed) }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, children: (0, jsx_runtime_1.jsx)(PastEventsFilter_1.default, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, disabled: dateSearch !== types_1.SCEventDateFilterType.ANY || loading || (!events.length && !showPastEvents) }) })] })) })), (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, { className: classes.noResults, children: (onlyStaffEnabled && !react_core_1.UserUtils.isStaff(scUserContext.user)) ||
+                            (onlyStaffEnabled && react_core_1.UserUtils.isStaff(scUserContext.user) && general) ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({}, EventSkeletonComponentProps)), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.noEvents.title", defaultMessage: "ui.events.noEvents.title" }) })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: (0, jsx_runtime_1.jsx)(CreateEventButton_1.default, {}) })), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.noEvents.title.onlyStaff", defaultMessage: "ui.events.noEvents.title.onlyStaff" }) })] })) })) : ((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, { variant: "outlined", color: "primary", size: "small", 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, { 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.d.ts

@@ -0,0 +1,14 @@
+import { ChipProps } from '@mui/material';
+import { SCEventLocationFilterType } from '@selfcommunity/types';
+export interface LocationEventsFilterProps extends ChipProps {
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    value: SCEventLocationFilterType;
+    disabled?: boolean;
+    autoHide?: boolean;
+    handleOnChange: (event: any) => void;
+}
+export default function LocationEventsFilter(inProps: LocationEventsFilterProps): JSX.Element;

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

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const react_intl_1 = require("react-intl");
+const system_1 = require("@mui/system");
+const constants_1 = require("./constants");
+const styles_1 = require("@mui/material/styles");
+const types_1 = require("@selfcommunity/types");
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const classes = {
+    root: `${constants_1.PREFIX}-root`
+};
+const Root = (0, styles_1.styled)(material_1.FormControl, {
+    name: constants_1.PREFIX,
+    slot: 'Root'
+})(() => ({}));
+const locationOptions = [
+    {
+        value: types_1.SCEventLocationFilterType.ANY,
+        label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.location.select.any", defaultMessage: "ui.events.location.select.any" })
+    },
+    {
+        value: types_1.SCEventLocationFilterType.PERSON,
+        label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInfoDetails.location.inPerson", defaultMessage: "ui.eventInfoDetails.location.inPerson" })
+    },
+    {
+        value: types_1.SCEventLocationFilterType.ONLINE,
+        label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInfoDetails.location.virtual", defaultMessage: "ui.eventInfoDetails.location.virtual" })
+    }
+];
+function LocationEventsFilter(inProps) {
+    // PROPS
+    const props = (0, system_1.useThemeProps)({
+        props: inProps,
+        name: constants_1.PREFIX
+    });
+    const { className, value, disabled = false, autoHide = false, handleOnChange } = props;
+    if (autoHide) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsxs)(Root, { 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, { 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, { 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))) })] }));
+}
+exports.default = LocationEventsFilter;

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

@@ -7,7 +7,6 @@ const react_intl_1 = require("react-intl");
 const system_1 = require("@mui/system");
 const constants_1 = require("./constants");
 const Events_1 = require("./Events");
-const HiddenPlaceholder_1 = tslib_1.__importDefault(require("../../shared/HiddenPlaceholder"));
 function PastEventsFilter(inProps) {
     // PROPS
     const props = (0, system_1.useThemeProps)({
@@ -16,7 +15,7 @@ function PastEventsFilter(inProps) {
     });
     const { autoHide = false, showPastEvents, handleClick, handleDeleteClick } = props, rest = tslib_1.__rest(props, ["autoHide", "showPastEvents", "handleClick", "handleDeleteClick"]);
     if (autoHide) {
-        return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
+        return null;
     }
     return ((0, jsx_runtime_1.jsx)(Events_1.EventsChipRoot
     // eslint-disable-next-line @typescript-eslint/ban-ts-ignore

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

@@ -39,6 +39,6 @@ const Root = (0, styles_1.styled)(material_1.Box, {
  */
 function EventsSkeleton(inProps) {
     const { className, EventSkeletonProps = {}, eventsNumber = 8, GridContainerComponentProps = {}, GridItemComponentProps = {} } = inProps, rest = tslib_1.__rest(inProps, ["className", "EventSkeletonProps", "eventsNumber", "GridContainerComponentProps", "GridItemComponentProps"]);
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true, spacing: { xs: 3 }, className: classes.events }, GridContainerComponentProps, { children: [...Array(eventsNumber)].map((event, index) => ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6 }, GridItemComponentProps, { className: classes.item }, { children: (0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({}, EventSkeletonProps)) }), index))) })) })));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true, spacing: { xs: 3 }, className: classes.events }, GridContainerComponentProps, { children: [...Array(eventsNumber)].map((event, index) => ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6 }, GridItemComponentProps, { className: classes.item, children: (0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({}, EventSkeletonProps)) }), index))) })) })));
 }
 exports.default = EventsSkeleton;

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

@@ -9,11 +9,11 @@ import { StickyBoxProps } from '../../shared/StickyBox';
 /**
  * FeedSidebarProps has the same props as StickyBoxProps type
  */
-export declare type FeedSidebarProps = StickyBoxProps;
+export type FeedSidebarProps = StickyBoxProps;
 /**
  * FeedRef props
  */
-export declare type FeedRef = {
+export type FeedRef = {
     addFeedData: (obj: any, syncPagination?: boolean) => void;
     refresh: () => void;
     getCurrentFeedObjectIds: () => number[];