@selfcommunity/react-ui 0.11.0-mui7.21 → 0.11.0-mui7.23

package/lib/esm/components/OnBoardingWidget/Steps/App/App.js

@@ -35,36 +35,20 @@ export default function App(inProps) {
     // STATE
     const [tab, setTab] = useState(0);
     // HANDLERS
-    const handleChange = (event, newValue) => {
+    const handleChange = (_event, newValue) => {
         setTab(newValue);
     };
     return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsx(Typography, Object.assign({ variant: "h4", className: classes.title }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.app.title", defaultMessage: "ui.onBoardingWidget.step.app.title" }) })), _jsx(Typography, Object.assign({ className: classes.summary }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.app.summary", defaultMessage: "ui.onBoardingWidget.step.app.summary" }) })), _jsxs(Tabs, Object.assign({ className: classes.tabs, value: tab, onChange: handleChange, centered: true, variant: "fullWidth", indicatorColor: "primary" }, { children: [_jsx(Tab, { label: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.app.tab.android", defaultMessage: "ui.onBoardingWidget.step.app.tab.android" }) }), _jsx(Tab, { label: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.app.tab.ios", defaultMessage: "ui.onBoardingWidget.step.app.tab.ios" }) })] })), _jsxs(Box, Object.assign({ className: classes.tabContent }, { children: [tab === 0 && (_jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ className: classes.summary }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.app.android", defaultMessage: "ui.onBoardingWidget.step.app.android" }) })), _jsx(Typography, Object.assign({ className: classes.step }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.app.android.a", defaultMessage: "ui.onBoardingWidget.step.app.android.a", values: {
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                        // @ts-ignore
-                                        icon: (...chunks) => _jsx(Icon, Object.assign({ fontSize: "medium" }, { children: chunks })),
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                        // @ts-ignore
-                                        b: (...chunks) => _jsx("strong", { children: chunks })
+                                        icon: (chunks) => (_jsx(Icon, Object.assign({ fontSize: "medium" }, { children: chunks }), "ui.onBoardingWidget.step.app.android.a.icon")),
+                                        b: (chunks) => _jsx("strong", { children: chunks }, "ui.onBoardingWidget.step.app.android.a.b")
                                     } }) })), _jsx(Typography, Object.assign({ className: classes.step }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.app.android.b", defaultMessage: "ui.onBoardingWidget.step.app.android.b", values: {
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                        // @ts-ignore
-                                        icon: (...chunks) => _jsx(Icon, Object.assign({ fontSize: "medium" }, { children: chunks })),
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                        // @ts-ignore
-                                        b: (...chunks) => _jsx("strong", { children: chunks })
+                                        icon: (chunks) => (_jsx(Icon, Object.assign({ fontSize: "medium" }, { children: chunks }), "ui.onBoardingWidget.step.app.android.b.icon")),
+                                        b: (chunks) => _jsx("strong", { children: chunks }, "ui.onBoardingWidget.step.app.android.b.b")
                                     } }) })), _jsx(CardMedia, { className: classes.imageAndroid, component: "img", src: AndroidPlaceholder })] })), tab === 1 && (_jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ className: classes.summary }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.app.ios", defaultMessage: "ui.onBoardingWidget.step.app.ios" }) })), _jsx(Typography, Object.assign({ className: classes.step }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.app.ios.a", defaultMessage: "ui.onBoardingWidget.step.app.ios.a", values: {
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                        // @ts-ignore
-                                        icon: (...chunks) => _jsx(Icon, Object.assign({ fontSize: "medium" }, { children: chunks })),
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                        // @ts-ignore
-                                        b: (...chunks) => _jsx("strong", { children: chunks })
+                                        icon: (chunks) => (_jsx(Icon, Object.assign({ fontSize: "medium" }, { children: chunks }), "ui.onBoardingWidget.step.app.ios.a.icon")),
+                                        b: (chunks) => _jsx("strong", { children: chunks }, "ui.onBoardingWidget.step.app.ios.a.b")
                                     } }) })), _jsx(Typography, Object.assign({ className: classes.step }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.app.ios.b", defaultMessage: "ui.onBoardingWidget.step.app.ios.b", values: {
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                        // @ts-ignore
-                                        icon: (...chunks) => _jsx(Icon, Object.assign({ fontSize: "medium" }, { children: chunks })),
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                        // @ts-ignore
-                                        b: (...chunks) => _jsx("strong", { children: chunks })
+                                        icon: (chunks) => (_jsx(Icon, Object.assign({ fontSize: "medium" }, { children: chunks }), "ui.onBoardingWidget.step.app.ios.b.icon")),
+                                        b: (chunks) => _jsx("strong", { children: chunks }, "ui.onBoardingWidget.step.app.ios.b.b")
                                     } }) })), _jsx(CardMedia, { className: classes.image, component: "img", src: IosPlaceholder })] })), _jsx(Button, Object.assign({ className: classes.button, size: "small", variant: "outlined", color: "secondary", onClick: onCompleteAction, disabled: (step === null || step === void 0 ? void 0 : step.status) === SCOnBoardingStepStatusType.COMPLETED || (step === null || step === void 0 ? void 0 : step.status) === SCOnBoardingStepStatusType.IN_PROGRESS }, { children: "Ok!" }))] }))] })));
 }

package/lib/esm/components/OnBoardingWidget/Steps/Category/Category.js

@@ -87,14 +87,8 @@ export default function Category(inProps) {
         return message;
     }, [progress]);
     return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsx(Typography, Object.assign({ variant: "h4", className: classes.title }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.categories", defaultMessage: "ui.onBoardingWidget.categories" }) })), _jsx(Typography, Object.assign({ className: classes.summary }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.category.summary", defaultMessage: "ui.onBoardingWidget.step.category.summary" }) })), (step === null || step === void 0 ? void 0 : step.status) !== SCOnBoardingStepStatusType.IN_PROGRESS && (_jsxs(_Fragment, { children: [_jsx(Typography, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.category.generation.steps", defaultMessage: "ui.onBoardingWidget.step.category.generation.steps", values: {
-                                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                // @ts-ignore
-                                iconA: (...chunks) => _jsx(CircledLetter, { letter: "a", statement: chunks }),
-                                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                // @ts-ignore
-                                iconB: (...chunks) => _jsx(CircledLetter, { letter: "b", statement: chunks }),
-                                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                // @ts-ignore
-                                iconC: (...chunks) => _jsx(CircledLetter, { letter: "c", statement: chunks })
+                                iconA: (chunks) => _jsx(CircledLetter, { letter: "a", statement: chunks }, "ui.onBoardingWidget.step.category.generation.steps.iconA"),
+                                iconB: (chunks) => _jsx(CircledLetter, { letter: "b", statement: chunks }, "ui.onBoardingWidget.step.category.generation.steps.iconB"),
+                                iconC: (chunks) => _jsx(CircledLetter, { letter: "c", statement: chunks }, "ui.onBoardingWidget.step.category.generation.steps.iconC")
                             } }) }), _jsx(CardMedia, { className: classes.image, component: "img", src: CategoryAPlaceholder }), _jsx(CardMedia, { className: classes.image, component: "img", src: CategoryBPlaceholder })] })), _jsx(Box, Object.assign({ component: "span", className: classes.action }, { children: (step === null || step === void 0 ? void 0 : step.status) === SCOnBoardingStepStatusType.COMPLETED ? (_jsx(Alert, Object.assign({ severity: "success" }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.categories.success", defaultMessage: "ui.onBoardingWidget.step.categories.success" }) }))) : (step === null || step === void 0 ? void 0 : step.status) === SCOnBoardingStepStatusType.IN_PROGRESS ? (_jsxs(Box, Object.assign({ className: classes.progress }, { children: [_jsx(Player, { autoplay: true, loop: true, src: animatedProgress, className: classes.animationProgress, controls: false }), _jsx(ProgressBar, { value: progress, hideBar: true, loadingMessage: _jsx(Typography, Object.assign({ variant: "h4" }, { children: getLoadingMessage })) })] }))) : (_jsx(Button, Object.assign({ size: "small", variant: "contained", color: "secondary", onClick: handleCategoriesCreation, endIcon: _jsx(Icon, { children: hover ? 'ai_stars' : 'magic_wand' }), onMouseEnter: () => setHover(true), onMouseLeave: () => setHover(false) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.onBoardingWidget.step.category.button", id: "ui.onBoardingWidget.step.category.button" }) }))) }))] })));
 }

package/lib/esm/components/PaymentOrder/PaymentOrder.js

@@ -73,5 +73,5 @@ export default function PaymentOrder(inProps) {
                                     hour: 'numeric',
                                     minute: 'numeric'
                                 })
-                            } }) })), _jsx(Typography, Object.assign({ variant: "body2", color: "textSecondary" }, { children: _jsx(FormattedMessage, { id: "ui.paymentOrder.price", defaultMessage: "ui.paymentOrder.price", values: { price: getConvertedAmount(scPaymentOrder.payment_price) } }) })), _jsx(Typography, Object.assign({ variant: "body2", color: "textSecondary", component: "span" }, { children: _jsx(FormattedMessage, { id: "ui.paymentOrder.status", defaultMessage: "ui.paymentOrder.status" }) })), _jsx(Chip, { className: classes.status, variant: 'outlined', label: _jsx(FormattedMessage, { id: "ui.paymentOrder.status.paid", defaultMessage: "ui.paymentOrder.status.paid" }), color: "success", size: "small" }), _jsx("br", {}), scPaymentOrder && !hidePaymentOrderPdfButton && (_jsx(PaymentOrderPdfButton, Object.assign({ paymentOrder: scPaymentOrder, label: _jsx(FormattedMessage, { id: "ui.paymentOrder.ticket.view", defaultMessage: "ui.paymentOrder.ticket.view" }) }, PaymentOrderPdfButtonComponentProps)))] }))] })));
+                            } }) })), _jsx(Typography, Object.assign({ variant: "body2", color: "textSecondary" }, { children: _jsx(FormattedMessage, { id: "ui.paymentOrder.price", defaultMessage: "ui.paymentOrder.price", values: { price: getConvertedAmount(scPaymentOrder.payment_price) } }) })), _jsx(Typography, Object.assign({ variant: "body2", color: "textSecondary", component: "span" }, { children: _jsx(FormattedMessage, { id: "ui.paymentOrder.status", defaultMessage: "ui.paymentOrder.status" }) })), _jsx(Chip, { className: classes.status, variant: "outlined", label: _jsx(FormattedMessage, { id: "ui.paymentOrder.status.paid", defaultMessage: "ui.paymentOrder.status.paid" }), color: "success", size: "small" }), _jsx("br", {}), scPaymentOrder && !hidePaymentOrderPdfButton && (_jsx(PaymentOrderPdfButton, Object.assign({ paymentOrder: scPaymentOrder, label: _jsx(FormattedMessage, { id: "ui.paymentOrder.ticket.view", defaultMessage: "ui.paymentOrder.ticket.view" }) }, PaymentOrderPdfButtonComponentProps)))] }))] })));
 }

package/lib/esm/components/PaymentOrders/PaymentOrders.js

@@ -268,5 +268,5 @@ export default function PaymentOrders(inProps) {
                                                         hour: 'numeric',
                                                         minute: 'numeric'
                                                     })
-                                                    : '-' })), _jsx(TableCell, Object.assign({ scope: "row" }, { children: _jsx(Chip, { variant: 'outlined', label: _jsx(FormattedMessage, { id: "ui.paymentOrders.status.paid", defaultMessage: "ui.paymentOrders.status.paid" }), color: "success", size: "small" }) })), _jsx(TableCell, Object.assign({ scope: "row" }, { children: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "left", alignItems: "center", spacing: 2 }, { children: [order.content_type === SCContentType.EVENT && _jsx(PaymentOrderPdfButton, { paymentOrder: order }), Boolean(!order.paid && order.billing_reason === 'subscription_create') && (_jsx(Button, Object.assign({ size: "small", variant: "contained", disabled: true }, { children: _jsx(FormattedMessage, { id: "ui.paymentOrders.pay", defaultMessage: "ui.paymentOrders.pay" }) })))] })) }))] }, index))), orders.length < 1 && (_jsx(TableRow, { children: _jsx(TableCell, Object.assign({ align: "left", colSpan: 6 }, { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.paymentOrders.noOrders", defaultMessage: "ui.paymentOrders.noOrders" }) })) })) })), hasMore && _jsx(_Fragment, { children: skeleton() })] })] })) }))) : (_jsx(CircularProgress, {})) }))] })));
+                                                    : '-' })), _jsx(TableCell, Object.assign({ scope: "row" }, { children: _jsx(Chip, { variant: "outlined", label: _jsx(FormattedMessage, { id: "ui.paymentOrders.status.paid", defaultMessage: "ui.paymentOrders.status.paid" }), color: "success", size: "small" }) })), _jsx(TableCell, Object.assign({ scope: "row" }, { children: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "left", alignItems: "center", spacing: 2 }, { children: [order.content_type === SCContentType.EVENT && _jsx(PaymentOrderPdfButton, { paymentOrder: order }), Boolean(!order.paid && order.billing_reason === 'subscription_create') && (_jsx(Button, Object.assign({ size: "small", variant: "contained", disabled: true }, { children: _jsx(FormattedMessage, { id: "ui.paymentOrders.pay", defaultMessage: "ui.paymentOrders.pay" }) })))] })) }))] }, index))), orders.length < 1 && (_jsx(TableRow, { children: _jsx(TableCell, Object.assign({ align: "left", colSpan: 6 }, { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.paymentOrders.noOrders", defaultMessage: "ui.paymentOrders.noOrders" }) })) })) })), hasMore && _jsx(_Fragment, { children: skeleton() })] })] })) }))) : (_jsx(CircularProgress, {})) }))] })));
 }

package/lib/esm/components/PaywallsDialog/PaywallsDialog.js

@@ -36,7 +36,7 @@ export default function PaywallsDialog(inProps) {
         return null;
     }
     return (_jsx(Root, Object.assign({ maxWidth: "sm", fullWidth: true, title: (PaywallsComponentProps && ((_a = PaywallsComponentProps.prefetchedPaymentContentStatus) === null || _a === void 0 ? void 0 : _a.payment_order)) ||
-            (PaywallsComponentProps.content && PaywallsComponentProps.content.payment_order) ? (_jsx(FormattedMessage, { id: "ui.paywallsDialog.title.purchased", defaultMessage: "ui.paywallsDialog.title.purchased" })) : (_jsx(FormattedMessage, { id: "ui.paywallsDialog.title", defaultMessage: "ui.paywallsDialog.title" })), scroll: 'paper', open: true }, (disableInitialTransition ? { TransitionComponent: NoTransition } : { TransitionComponent: Transition }), { className: classNames(classes.root, className), slots: {
+            (PaywallsComponentProps.content && PaywallsComponentProps.content.payment_order) ? (_jsx(FormattedMessage, { id: "ui.paywallsDialog.title.purchased", defaultMessage: "ui.paywallsDialog.title.purchased" })) : (_jsx(FormattedMessage, { id: "ui.paywallsDialog.title", defaultMessage: "ui.paywallsDialog.title" })), scroll: "paper", open: true }, (disableInitialTransition ? { TransitionComponent: NoTransition } : { TransitionComponent: Transition }), { className: classNames(classes.root, className), slots: {
             transition: Transition
         }, DialogContentProps: { dividers: false } }, rest, { children: _jsx(Paywalls, Object.assign({}, PaywallsComponentProps)) })));
 }

package/lib/esm/components/PlatformWidget/PlatformWidget.js

@@ -291,7 +291,7 @@ export default function PlatformWidget(inProps) {
     /**
      * Render tutorial
      */
-    const tutorial = (_jsxs(Grid, Object.assign({ container: true, width: "100%", spacing: isAdmin ? 1 : 3, justifyContent: "center", className: classes.tutorial }, { children: [!isTutorialOpen && (_jsx(Grid, Object.assign({ size: "auto", alignItems: "center", justifyContent: "center" }, { children: _jsx(IconButton, Object.assign({ size: "medium", onClick: handleOpenTutorial }, { children: _jsx(Icon, { children: "info" }) })) }))), _jsx(Collapse, Object.assign({ in: isTutorialOpen, className: classes.tutorialContent }, { children: isTutorialOpen && (_jsxs(Grid, Object.assign({ size: "auto" }, { children: [_jsxs(Typography, Object.assign({ variant: 'body2', className: classes.tutorialTitle, component: 'div' }, { children: [_jsx(Grow, Object.assign({ in: true, timeout: 1000 }, { children: _jsx("span", { children: actions[tutorialIndex].title }) })), _jsx(IconButton, Object.assign({ size: 'small', className: classes.tutorialTitleClose, onClick: handleCloseTutorial }, { children: _jsx(Icon, { children: "close" }) }))] })), _jsx(Grow, Object.assign({ in: true, timeout: 1200 }, { children: _jsx(Typography, Object.assign({ variant: 'body2', className: classes.tutorialDesc }, { children: actions[tutorialIndex].content })) })), _jsx(Divider, { className: classes.divider }), _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2, className: classes.tutorialControls }, { children: [_jsx(Button, Object.assign({ variant: "text", size: "small", onClick: handlePrevious, className: classNames(classes.btnStep, classes.btnPreviousStep) }, { children: tutorialIndex === 0 ? (_jsx(FormattedMessage, { id: "ui.platformWidget.tutorial.skip", defaultMessage: "ui.platformWidget.tutorial.skip" })) : (_jsx(FormattedMessage, { id: "ui.platformWidget.tutorial.previous", defaultMessage: "ui.platformWidget.tutorial.previous" })) })), _jsxs(Typography, Object.assign({ component: 'div' }, { children: [tutorialIndex + 1, "/", actions.length] })), _jsx(Button, Object.assign({ variant: "contained", size: "small", color: "primary", onClick: handleNext, className: classNames(classes.btnStep, classes.btnNextStep) }, { children: tutorialIndex === actions.length - 1 ? (_jsx(FormattedMessage, { id: "ui.platformWidget.tutorial.close", defaultMessage: "ui.platformWidget.tutorial.close" })) : (_jsx(FormattedMessage, { id: "ui.platformWidget.tutorial.next", defaultMessage: "ui.platformWidget.tutorial.next" })) }))] }))] }))) }))] })));
+    const tutorial = (_jsxs(Grid, Object.assign({ container: true, width: "100%", spacing: isAdmin ? 1 : 3, justifyContent: "center", className: classes.tutorial }, { children: [!isTutorialOpen && (_jsx(Grid, Object.assign({ size: "auto", alignItems: "center", justifyContent: "center" }, { children: _jsx(IconButton, Object.assign({ size: "medium", onClick: handleOpenTutorial }, { children: _jsx(Icon, { children: "info" }) })) }))), _jsx(Collapse, Object.assign({ in: isTutorialOpen, className: classes.tutorialContent }, { children: isTutorialOpen && (_jsxs(Grid, Object.assign({ size: "auto" }, { children: [_jsxs(Typography, Object.assign({ variant: "body2", className: classes.tutorialTitle, component: "div" }, { children: [_jsx(Grow, Object.assign({ in: true, timeout: 1000 }, { children: _jsx("span", { children: actions[tutorialIndex].title }) })), _jsx(IconButton, Object.assign({ size: "small", className: classes.tutorialTitleClose, onClick: handleCloseTutorial }, { children: _jsx(Icon, { children: "close" }) }))] })), _jsx(Grow, Object.assign({ in: true, timeout: 1200 }, { children: _jsx(Typography, Object.assign({ variant: "body2", className: classes.tutorialDesc }, { children: actions[tutorialIndex].content })) })), _jsx(Divider, { className: classes.divider }), _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2, className: classes.tutorialControls }, { children: [_jsx(Button, Object.assign({ variant: "text", size: "small", onClick: handlePrevious, className: classNames(classes.btnStep, classes.btnPreviousStep) }, { children: tutorialIndex === 0 ? (_jsx(FormattedMessage, { id: "ui.platformWidget.tutorial.skip", defaultMessage: "ui.platformWidget.tutorial.skip" })) : (_jsx(FormattedMessage, { id: "ui.platformWidget.tutorial.previous", defaultMessage: "ui.platformWidget.tutorial.previous" })) })), _jsxs(Typography, Object.assign({ component: "div" }, { children: [tutorialIndex + 1, "/", actions.length] })), _jsx(Button, Object.assign({ variant: "contained", size: "small", color: "primary", onClick: handleNext, className: classNames(classes.btnStep, classes.btnNextStep) }, { children: tutorialIndex === actions.length - 1 ? (_jsx(FormattedMessage, { id: "ui.platformWidget.tutorial.close", defaultMessage: "ui.platformWidget.tutorial.close" })) : (_jsx(FormattedMessage, { id: "ui.platformWidget.tutorial.next", defaultMessage: "ui.platformWidget.tutorial.next" })) }))] }))] }))) }))] })));
     /**
      * Renders platform card
      */

package/lib/esm/components/PrivateMessageEditor/MessageMediaUploader/index.js

@@ -106,7 +106,7 @@ export default function MessageMediaUploader(props) {
                         url: `${scContext.settings.portal}${Endpoints.PrivateMessageUploadMediaInChunks.url()}`,
                         headers: { Authorization: `Bearer ${scContext.settings.session.authToken.accessToken}` },
                         method: Endpoints.PrivateMessageUploadMediaInChunks.method
-                    }, chunkSize: 204800, multiple: true, chunked: true, maxConcurrent: 2, fileFilter: filterBySizeAndType }, { children: [_jsx(MessageChunkUploader, { onSuccess: handleSuccess, onProgress: handleProgress, onError: handleError }), !files.length && Object.keys(uploading).length === 0 && Object.keys(errors).length === 0 && (_jsxs(UploadDropZone, Object.assign({ className: classes.uploadSection }, { children: [_jsx(UploadButton, { inputFieldName: "file", className: classes.uploadButton }), _jsx(Typography, Object.assign({ textAlign: 'center', fontWeight: 'medium' }, { children: _jsx(FormattedMessage, { id: "ui.privateMessage.editor.media.uploader.msg", defaultMessage: "ui.privateMessage.editor.media.uploader.msg" }) }))] }))), _jsxs(List, Object.assign({ className: classes.previewContent }, { children: [previews.length !== 0 &&
+                    }, chunkSize: 204800, multiple: true, chunked: true, maxConcurrent: 2, fileFilter: filterBySizeAndType }, { children: [_jsx(MessageChunkUploader, { onSuccess: handleSuccess, onProgress: handleProgress, onError: handleError }), !files.length && Object.keys(uploading).length === 0 && Object.keys(errors).length === 0 && (_jsxs(UploadDropZone, Object.assign({ className: classes.uploadSection }, { children: [_jsx(UploadButton, { inputFieldName: "file", className: classes.uploadButton }), _jsx(Typography, Object.assign({ textAlign: "center", fontWeight: "medium" }, { children: _jsx(FormattedMessage, { id: "ui.privateMessage.editor.media.uploader.msg", defaultMessage: "ui.privateMessage.editor.media.uploader.msg" }) }))] }))), _jsxs(List, Object.assign({ className: classes.previewContent }, { children: [previews.length !== 0 &&
                                     previews.map((item, index) => {
                                         var _a;
                                         return (_jsx(React.Fragment, { children: 'file' in item && (_jsxs(ListItem, Object.assign({ className: classes.previewItem }, getMouseEvents(() => handleMouseEnter(item.file_uuid), () => handleMouseLeave(item.file_uuid)), { children: ['video_url' in item ? (_jsx("video", { src: item.video_url })) : (_jsx("img", { src: item.file.type.startsWith(SCMessageFileType.PDF) && !item.file_url
@@ -114,6 +114,6 @@ export default function MessageMediaUploader(props) {
                                                             : !item.file_url
                                                                 ? documentPlaceholder
                                                                 : item.file_url })), _jsx(ImageListItemBar, { className: classNames(classes.previewActions, { [classes.progress]: item.completed }), title: typeof item.completed !== 'undefined' &&
-                                                            item.completed !== 0 && _jsx(Typography, Object.assign({ textAlign: "center" }, { children: `${Math.round(item.completed)}%` })), actionIcon: _jsx(_Fragment, { children: isHovered[item.file_uuid] && Object.keys(uploading).length === 0 && (_jsx(IconButton, Object.assign({ onClick: () => handleClear(item.file_uuid), size: "small" }, { children: _jsx(Icon, { children: "delete" }) }))) }) }), isHovered[item.file_uuid] && (_jsxs(Box, Object.assign({ component: 'span', className: classes.previewInfo }, { children: [_jsx(Typography, Object.assign({ noWrap: true, textAlign: 'center' }, { children: item.file.name })), _jsx(Typography, Object.assign({ textAlign: 'center', fontWeight: 'light' }, { children: bytesToSize(item.file.size) }))] })))] }), (_a = item.id) !== null && _a !== void 0 ? _a : item.file_uuid)) }, index));
+                                                            item.completed !== 0 && _jsx(Typography, Object.assign({ textAlign: "center" }, { children: `${Math.round(item.completed)}%` })), actionIcon: _jsx(_Fragment, { children: isHovered[item.file_uuid] && Object.keys(uploading).length === 0 && (_jsx(IconButton, Object.assign({ onClick: () => handleClear(item.file_uuid), size: "small" }, { children: _jsx(Icon, { children: "delete" }) }))) }) }), isHovered[item.file_uuid] && (_jsxs(Box, Object.assign({ component: "span", className: classes.previewInfo }, { children: [_jsx(Typography, Object.assign({ noWrap: true, textAlign: "center" }, { children: item.file.name })), _jsx(Typography, Object.assign({ textAlign: "center", fontWeight: "light" }, { children: bytesToSize(item.file.size) }))] })))] }), (_a = item.id) !== null && _a !== void 0 ? _a : item.file_uuid)) }, index));
                                     }), previews.length !== 0 && action] }))] })) })] })));
 }

package/lib/esm/components/PrivateMessageSnippets/Skeleton.js

@@ -36,5 +36,5 @@ const Root = styled(Card, {
  *
  */
 export default function PrivateMessageSnippetsSkeleton(props) {
-    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsxs(CardContent, { children: [_jsxs(Stack, Object.assign({ direction: "column", justifyContent: "center", spacing: 1, alignItems: "center" }, { children: [_jsx(Button, Object.assign({ variant: "outlined", size: "medium", disabled: true, className: classes.button }, { children: _jsx(Skeleton, { height: 20, width: 100, variant: 'rectangular' }) })), _jsx(Skeleton, { height: 25, width: '100%', variant: 'rounded', className: classes.searchBar })] })), _jsx(List, Object.assign({ className: classes.list }, { children: [...Array(6)].map((category, index) => (_jsx(PrivateMessageSnippetItemSkeleton, { elevation: 0 }, index))) }))] }) })));
+    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsxs(CardContent, { children: [_jsxs(Stack, Object.assign({ direction: "column", justifyContent: "center", spacing: 1, alignItems: "center" }, { children: [_jsx(Button, Object.assign({ variant: "outlined", size: "medium", disabled: true, className: classes.button }, { children: _jsx(Skeleton, { height: 20, width: 100, variant: "rectangular" }) })), _jsx(Skeleton, { height: 25, width: "100%", variant: "rounded", className: classes.searchBar })] })), _jsx(List, Object.assign({ className: classes.list }, { children: [...Array(6)].map((category, index) => (_jsx(PrivateMessageSnippetItemSkeleton, { elevation: 0 }, index))) }))] }) })));
 }

package/lib/esm/components/PrivateMessageThread/PrivateMessageThread.js

@@ -458,7 +458,7 @@ export default function PrivateMessageThread(inProps) {
         if (loadingMessageObjs) {
             return _jsx(PrivateMessageThreadSkeleton, {});
         }
-        return (_jsxs(CardContent, { children: [_jsx(InfiniteScroll, Object.assign({ height: '100%', dataLength: messageObjs.length, previous: handlePrevious, inverse: true, hasMorePrevious: Boolean(previous), loaderPrevious: _jsx(PrivateMessageThreadItemSkeleton, {}) }, { children: _jsx(List, Object.assign({ ref: messagesEndRef }, { children: Object.keys(formattedMessages).map((key) => (_jsx("li", Object.assign({ className: classes.section }, { children: _jsxs("ul", { children: [_jsx(ListSubheader, { children: _jsx(Typography, Object.assign({ align: "center", className: classes.subHeader }, { children: key })) }), formattedMessages[key].map((msg) => {
+        return (_jsxs(CardContent, { children: [_jsx(InfiniteScroll, Object.assign({ height: "100%", dataLength: messageObjs.length, previous: handlePrevious, inverse: true, hasMorePrevious: Boolean(previous), loaderPrevious: _jsx(PrivateMessageThreadItemSkeleton, {}) }, { children: _jsx(List, Object.assign({ ref: messagesEndRef }, { children: Object.keys(formattedMessages).map((key) => (_jsx("li", Object.assign({ className: classes.section }, { children: _jsxs("ul", { children: [_jsx(ListSubheader, { children: _jsx(Typography, Object.assign({ align: "center", className: classes.subHeader }, { children: key })) }), formattedMessages[key].map((msg) => {
                                         var _a;
                                         return (_jsxs(Box, Object.assign({ className: classes.item }, { children: [msg.group && ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) !== msg.sender.username && (_jsx(ListItemAvatar, { children: _jsx(Avatar, { alt: msg.sender.username, src: msg.sender.avatar, className: classes.avatar }) })), _jsx(PrivateMessageThreadItem, { className: authUserId === msg.sender.id ? classes.sender : classes.receiver, message: msg, mouseEvents: {
                                                         onMouseEnter: () => handleMouseEnter(msg.id),

package/lib/esm/components/PrivateMessageThread/Skeleton.js

@@ -35,5 +35,5 @@ const Root = styled(Card, {
 export default function PrivateMessageThreadSkeleton(props) {
     const theme = useTheme();
     const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
-    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsxs(CardContent, { children: [_jsxs(List, Object.assign({ className: classes.list }, { children: [_jsx(ListSubheader, Object.assign({ sx: { display: 'flex', justifyContent: 'center' } }, { children: _jsx(Skeleton, { animation: "wave", height: 30, width: 120, style: { borderRadius: 20 } }) })), [...Array(isMobile ? 6 : 8)].map((item, index) => (_jsx(PrivateMessageThreadItemSkeleton, { index: index }, index)))] })), _jsx(Box, Object.assign({ className: classes.editor }, { children: _jsx(Skeleton, { animation: "wave", height: 55, width: '100%', variant: 'rectangular' }) }))] }) })));
+    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsxs(CardContent, { children: [_jsxs(List, Object.assign({ className: classes.list }, { children: [_jsx(ListSubheader, Object.assign({ sx: { display: 'flex', justifyContent: 'center' } }, { children: _jsx(Skeleton, { animation: "wave", height: 30, width: 120, style: { borderRadius: 20 } }) })), [...Array(isMobile ? 6 : 8)].map((item, index) => (_jsx(PrivateMessageThreadItemSkeleton, { index: index }, index)))] })), _jsx(Box, Object.assign({ className: classes.editor }, { children: _jsx(Skeleton, { animation: "wave", height: 55, width: "100%", variant: "rectangular" }) }))] }) })));
 }

package/lib/esm/components/SnippetNotifications/SnippetNotifications.js

@@ -154,10 +154,10 @@ export default function SnippetNotifications(inProps) {
     }, [scUserContext.user, initialized]);
     /**
      * Notification subscriber
-     * @param msg
+     * @param _msg
      * @param data
      */
-    const notificationSubscriber = (msg, data) => {
+    const notificationSubscriber = (_msg, data) => {
         /**
          * Ignore notifications of type: notification_banner
          * (data.data.activity_type === SCNotificationTypologyType.NOTIFICATION_BANNER)
@@ -288,9 +288,9 @@ export default function SnippetNotifications(inProps) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { children: _jsx(Box, Object.assign({ className: classes.notificationsWrap }, { children: !initialized || loading ? (_jsx(Skeleton, { elevation: 0 })) : (_jsx(ScrollContainer, Object.assign({}, ScrollContainerProps, { children: _jsxs(MenuList, Object.assign({ className: classes.list, disabledItemsFocusable: true, disableListWrap: true }, { children: [scUserContext.user.unseen_notification_banners_counter ? (_jsx(MenuItem, Object.assign({ className: classNames(classes.item, classes.broadcastMessagesBanner), component: Link, to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}) }, { children: _jsx(NotificationItem, { template: SCNotificationObjectTemplateType.SNIPPET, isNew: true, disableTypography: true, image: _jsx(Avatar, { alt: preferences[SCPreferences.TEXT_APPLICATION_NAME], src: preferences[SCPreferences.LOGO_NAVBAR_LOGO_MOBILE] }), primary: _jsx(Typography, Object.assign({ component: 'div' }, { children: intl.formatMessage({ id: 'ui.snippetNotifications.broadcastMessages', defaultMessage: 'ui.snippetNotifications.broadcastMessages' }, {
+    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { children: _jsx(Box, Object.assign({ className: classes.notificationsWrap }, { children: !initialized || loading ? (_jsx(Skeleton, { elevation: 0 })) : (_jsx(ScrollContainer, Object.assign({}, ScrollContainerProps, { children: _jsxs(MenuList, Object.assign({ className: classes.list, disabledItemsFocusable: true, disableListWrap: true }, { children: [scUserContext.user.unseen_notification_banners_counter ? (_jsx(MenuItem, Object.assign({ className: classNames(classes.item, classes.broadcastMessagesBanner), component: Link, to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}) }, { children: _jsx(NotificationItem, { template: SCNotificationObjectTemplateType.SNIPPET, isNew: true, disableTypography: true, image: _jsx(Avatar, { alt: preferences[SCPreferences.TEXT_APPLICATION_NAME], src: preferences[SCPreferences.LOGO_NAVBAR_LOGO_MOBILE] }), primary: _jsx(Typography, Object.assign({ component: "div" }, { children: intl.formatMessage({ id: 'ui.snippetNotifications.broadcastMessages', defaultMessage: 'ui.snippetNotifications.broadcastMessages' }, {
                                         count: scUserContext.user.unseen_notification_banners_counter,
-                                        b: (...chunks) => _jsx("strong", { children: chunks }),
-                                        link: (...chunks) => _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}) }, { children: chunks }))
+                                        b: (chunks) => _jsx("strong", { children: chunks }, "ui.snippetNotifications.broadcastMessages.b"),
+                                        link: (chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}) }, { children: chunks }), "ui.snippetNotifications.broadcastMessages.link"))
                                     }) })) }) }), "banner")) : null, notifications.length === 0 ? (_jsx(MenuItem, Object.assign({ className: classes.emptyBoxNotifications }, { children: _jsx(FormattedMessage, { id: "ui.snippetNotifications.noNotifications", defaultMessage: "ui.snippetNotifications.noNotifications" }) }))) : (notifications.slice(0, showMax).map((notificationObject, i) => notificationObject.aggregated.map((n, k) => (_jsx(MenuItem, Object.assign({ className: classes.item, onClick: (e) => handleSingleNotificationClick(e, n), disableRipple: true, disableTouchRipple: true }, { children: renderAggregatedItem(n, i) }), k)))))] })) }))) })) })));
 }

package/lib/esm/components/UserAddPaymentMethodForm/UserAddPaymentMethodForm.js

@@ -1,4 +1,4 @@
-import { __awaiter, __rest } from "tslib";
+import { __awaiter } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React, { useState } from 'react';
 import { useSCPaymentsEnabled, useSCUser } from '@selfcommunity/react-core';
@@ -53,7 +53,7 @@ export default function UserAddPaymentMethodForm(inProps) {
         props: inProps,
         name: PREFIX
     });
-    const { className = null, customer, collectBillingAddress = false, handleSuccess, handleClose } = props, rest = __rest(props, ["className", "customer", "collectBillingAddress", "handleSuccess", "handleClose"]);
+    const { className = null, customer, collectBillingAddress = false, handleSuccess, handleClose } = props;
     // CONTEXT
     const scUserContext = useSCUser();
     // STATE
@@ -129,10 +129,10 @@ export default function UserAddPaymentMethodForm(inProps) {
     if (!isPaymentsEnabled || !scUserContext.user) {
         return null;
     }
-    return (_jsx(Root, Object.assign({ className: classes.root }, { children: _jsxs("form", Object.assign({ onSubmit: handleSubmit }, { children: [_jsx(PaymentElement, { id: "payment-element", options: paymentElementOptions, onReady: () => setReady(true) }), collectBillingAddress && (_jsx(Paper, Object.assign({ variant: "outlined", className: classes.address }, { children: Object.keys(addressState).length && !isEditingBillingAddress ? (_jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ variant: 'body1' }, { children: addressState.name })), _jsxs(Typography, Object.assign({ variant: 'body1' }, { children: [addressState.address.line1, _jsx("br", {}), addressState.address.line2] })), _jsxs(Typography, Object.assign({ variant: 'body1' }, { children: [addressState.address.postal_code, " - ", addressState.address.city, " - ", addressState.address.country] })), _jsx(Button, Object.assign({ sx: { mt: 1 }, variant: 'contained', disabled: !elements, onClick: () => setIsEditingBillingAddress(!isEditingBillingAddress) }, { children: "Change" }))] })) : (_jsxs(_Fragment, { children: [_jsx(AddressElement, { onChange: (event) => {
+    return (_jsx(Root, Object.assign({ className: classes.root }, { children: _jsxs("form", Object.assign({ onSubmit: handleSubmit }, { children: [_jsx(PaymentElement, { id: "payment-element", options: paymentElementOptions, onReady: () => setReady(true) }), collectBillingAddress && (_jsx(Paper, Object.assign({ variant: "outlined", className: classes.address }, { children: Object.keys(addressState).length && !isEditingBillingAddress ? (_jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ variant: "body1" }, { children: addressState.name })), _jsxs(Typography, Object.assign({ variant: "body1" }, { children: [addressState.address.line1, _jsx("br", {}), addressState.address.line2] })), _jsxs(Typography, Object.assign({ variant: "body1" }, { children: [addressState.address.postal_code, " - ", addressState.address.city, " - ", addressState.address.country] })), _jsx(Button, Object.assign({ sx: { mt: 1 }, variant: "contained", disabled: !elements, onClick: () => setIsEditingBillingAddress(!isEditingBillingAddress) }, { children: "Change" }))] })) : (_jsxs(_Fragment, { children: [_jsx(AddressElement, { onChange: (event) => {
                                     setAddressState(event.value);
                                 }, options: {
                                     mode: 'billing',
                                     defaultValues: addressState
-                                } }), _jsx(Button, Object.assign({ sx: { mt: 1 }, variant: 'contained', disabled: !elements || loading || !ready, onClick: () => setIsEditingBillingAddress(!isEditingBillingAddress) }, { children: _jsx(FormattedMessage, { id: 'ui.userAddPaymentMethodForm.useDefaultMethod', defaultMessage: 'ui.userAddPaymentMethodForm.useDefaultMethod' }) }))] })) }))), _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "flex-end", alignItems: "center", spacing: 2, mt: 3 }, { children: [_jsx(Button, Object.assign({ onClick: onHandleClose, variant: "outlined" }, { children: _jsx(FormattedMessage, { id: "ui.userAddPaymentMethodForm.cancelButton", defaultMessage: "ui.userAddPaymentMethodForm.cancelButton" }) })), _jsx(Button, Object.assign({ disabled: !ready, loading: loading, type: "submit", variant: "contained" }, { children: _jsx(FormattedMessage, { id: "ui.userAddPaymentMethodForm.addButton", defaultMessage: "ui.userAddPaymentMethodForm.addButton" }) }))] })), errorMessage && _jsx("div", { children: errorMessage })] })) })));
+                                } }), _jsx(Button, Object.assign({ sx: { mt: 1 }, variant: "contained", disabled: !elements || loading || !ready, onClick: () => setIsEditingBillingAddress(!isEditingBillingAddress) }, { children: _jsx(FormattedMessage, { id: "ui.userAddPaymentMethodForm.useDefaultMethod", defaultMessage: "ui.userAddPaymentMethodForm.useDefaultMethod" }) }))] })) }))), _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "flex-end", alignItems: "center", spacing: 2, mt: 3 }, { children: [_jsx(Button, Object.assign({ onClick: onHandleClose, variant: "outlined" }, { children: _jsx(FormattedMessage, { id: "ui.userAddPaymentMethodForm.cancelButton", defaultMessage: "ui.userAddPaymentMethodForm.cancelButton" }) })), _jsx(Button, Object.assign({ disabled: !ready, loading: loading, type: "submit", variant: "contained" }, { children: _jsx(FormattedMessage, { id: "ui.userAddPaymentMethodForm.addButton", defaultMessage: "ui.userAddPaymentMethodForm.addButton" }) }))] })), errorMessage && _jsx("div", { children: errorMessage })] })) })));
 }

package/lib/esm/components/UserAutocomplete/UserAutocomplete.js

@@ -109,7 +109,7 @@ const UserAutocomplete = (inProps) => {
                 }, renderInput: (params) => (_jsx(TextField, Object.assign({}, params, TextFieldProps, { margin: "dense", slotProps: {
                         input: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'off', endAdornment: filteredUsers.length > 0 ? (_jsxs(_Fragment, { children: [isLoading && _jsx(CircularProgress, { color: "inherit", size: 20 }), params.InputProps.endAdornment] })) : null })
                     } }))) }, rest)), _jsx(Typography, Object.assign({ variant: "body2", color: "primary", className: classes.info }, { children: _jsx(FormattedMessage, { id: "ui.userAutocomplete.textarea.info", defaultMessage: "ui.userAutocomplete.textarea.info", values: {
-                        icon: (...chunks) => _jsx(Icon, { children: chunks })
+                        icon: (chunks) => _jsx(Icon, { children: chunks }, "ui.userAutocomplete.textarea.info.icon")
                     } }) })), _jsx(TextField, { label: _jsx(FormattedMessage, { id: "ui.userAutocomplete.textarea.label", defaultMessage: "ui.userAutocomplete.textarea.label" }), multiline: true, minRows: 4, fullWidth: true, margin: "normal", value: textAreaValue, onChange: handleTextAreaChange })] })));
 };
 export default UserAutocomplete;

package/lib/esm/components/UserBillingInfo/UserBillingInfo.js

@@ -443,7 +443,7 @@ const UserBillingInfo = (inProps, ref) => {
     if (!isPaymentsEnabled || !scUserContext.user) {
         return null;
     }
-    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className), id: id }, rest, { ref: componentRef }, { children: _jsx(Fragment, { children: state.isLoading ? (_jsx(UserBillingInfoSkeleton, { mode: mode })) : (_jsx(Fragment, { children: state.mode === UserBillingInfoMode.READ ? (_jsxs(_Fragment, { children: [state.name ? (_jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ variant: 'body1' }, { children: state.name })), _jsxs(Typography, Object.assign({ variant: 'body1' }, { children: [state.address_line1, _jsx("br", {}), state.address_line2] })), _jsxs(Typography, Object.assign({ variant: 'body1' }, { children: [state.address_postal_code, " - ", state.address_city, " - ", state.address_country && state.address_country.label] })), Boolean(state.tax_code && !state.isBusiness) && _jsx(Typography, Object.assign({ variant: 'body1' }, { children: state.tax_code })), state.isBusiness && (_jsxs(_Fragment, { children: [state.tax_id_data && _jsxs(Typography, Object.assign({ variant: 'body1' }, { children: ["VAT: ", state.tax_id_data.value] })), state.sdi && _jsxs(Typography, Object.assign({ variant: 'body1' }, { children: ["SDI: ", state.sdi] })), state.pec && _jsxs(Typography, Object.assign({ variant: 'body1' }, { children: ["PEC: ", state.pec] }))] }))] })) : (_jsx(Typography, Object.assign({ variant: 'body1' }, { children: _jsx(FormattedMessage, { id: "ui.userBillingInfo.noInfo", defaultMessage: "ui.userBillingInfo.noInfo" }) }))), state.initialDataCompleted && (_jsx(Button, Object.assign({ sx: { mt: 1 }, variant: 'contained', size: 'small', disabled: Boolean(disableButtons), onClick: handleChangeViewMode }, { children: _jsx(FormattedMessage, { id: "component.CheckoutForm.billingInfoChangeButton", defaultMessage: "component.CheckoutForm.billingInfoChangeButton" }) })))] })) : (_jsx(Box, { children: _jsxs(Grid, Object.assign({ container: true, width: "100%", spacing: 3 }, { children: [_jsx(Grid, Object.assign({ size: { xs: 12, sm: inlineDisplay ? 12 : 6 } }, { children: _jsx(TextField, { variant: "outlined", id: "name", name: "name", label: _jsx(FormattedMessage, { id: "ui.userBillingInfo.name", defaultMessage: "ui.userBillingInfo.name" }), onChange: handleChange('name'), value: state.name, error: Boolean(state.nameError), helperText: state.nameError, fullWidth: true }) })), _jsx(Grid, Object.assign({ size: { xs: 12, sm: inlineDisplay ? 12 : 6 } }, { children: _jsx(TextField, { variant: "outlined", id: "address_line1", name: "address_line1", label: _jsx(FormattedMessage, { id: "ui.userBillingInfo.address1", defaultMessage: "ui.userBillingInfo.address1" }), onChange: handleChange('address_line1'), value: state.address_line1, error: Boolean(state.addressLine1Error), helperText: state.addressLine1Error, fullWidth: true }) })), _jsx(Grid, Object.assign({ size: { xs: 12, sm: inlineDisplay ? 12 : 6 } }, { children: _jsx(TextField, { variant: "outlined", id: "address_line2", name: "address_line2", label: _jsx(FormattedMessage, { id: "ui.userBillingInfo.address2", defaultMessage: "ui.userBillingInfo.address2" }), onChange: handleChange('address_line2'), value: state.address_line2, error: Boolean(state.addressLine2Error), helperText: state.addressLine2Error, fullWidth: true }) })), _jsx(Grid, Object.assign({ size: { xs: 12, sm: inlineDisplay ? 12 : 6 } }, { children: _jsx(Autocomplete, { id: "country-select-demo", options: countries, value: state.address_country, fullWidth: true, onChange: handleChange('address_country'), getOptionLabel: (option) => option.label, renderOption: (props, option) => {
+    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className), id: id }, rest, { ref: componentRef }, { children: _jsx(Fragment, { children: state.isLoading ? (_jsx(UserBillingInfoSkeleton, { mode: mode })) : (_jsx(Fragment, { children: state.mode === UserBillingInfoMode.READ ? (_jsxs(_Fragment, { children: [state.name ? (_jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ variant: "body1" }, { children: state.name })), _jsxs(Typography, Object.assign({ variant: "body1" }, { children: [state.address_line1, _jsx("br", {}), state.address_line2] })), _jsxs(Typography, Object.assign({ variant: "body1" }, { children: [state.address_postal_code, " - ", state.address_city, " - ", state.address_country && state.address_country.label] })), Boolean(state.tax_code && !state.isBusiness) && _jsx(Typography, Object.assign({ variant: "body1" }, { children: state.tax_code })), state.isBusiness && (_jsxs(_Fragment, { children: [state.tax_id_data && _jsxs(Typography, Object.assign({ variant: "body1" }, { children: ["VAT: ", state.tax_id_data.value] })), state.sdi && _jsxs(Typography, Object.assign({ variant: "body1" }, { children: ["SDI: ", state.sdi] })), state.pec && _jsxs(Typography, Object.assign({ variant: "body1" }, { children: ["PEC: ", state.pec] }))] }))] })) : (_jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.userBillingInfo.noInfo", defaultMessage: "ui.userBillingInfo.noInfo" }) }))), state.initialDataCompleted && (_jsx(Button, Object.assign({ sx: { mt: 1 }, variant: "contained", size: "small", disabled: Boolean(disableButtons), onClick: handleChangeViewMode }, { children: _jsx(FormattedMessage, { id: "component.CheckoutForm.billingInfoChangeButton", defaultMessage: "component.CheckoutForm.billingInfoChangeButton" }) })))] })) : (_jsx(Box, { children: _jsxs(Grid, Object.assign({ container: true, width: "100%", spacing: 3 }, { children: [_jsx(Grid, Object.assign({ size: { xs: 12, sm: inlineDisplay ? 12 : 6 } }, { children: _jsx(TextField, { variant: "outlined", id: "name", name: "name", label: _jsx(FormattedMessage, { id: "ui.userBillingInfo.name", defaultMessage: "ui.userBillingInfo.name" }), onChange: handleChange('name'), value: state.name, error: Boolean(state.nameError), helperText: state.nameError, fullWidth: true }) })), _jsx(Grid, Object.assign({ size: { xs: 12, sm: inlineDisplay ? 12 : 6 } }, { children: _jsx(TextField, { variant: "outlined", id: "address_line1", name: "address_line1", label: _jsx(FormattedMessage, { id: "ui.userBillingInfo.address1", defaultMessage: "ui.userBillingInfo.address1" }), onChange: handleChange('address_line1'), value: state.address_line1, error: Boolean(state.addressLine1Error), helperText: state.addressLine1Error, fullWidth: true }) })), _jsx(Grid, Object.assign({ size: { xs: 12, sm: inlineDisplay ? 12 : 6 } }, { children: _jsx(TextField, { variant: "outlined", id: "address_line2", name: "address_line2", label: _jsx(FormattedMessage, { id: "ui.userBillingInfo.address2", defaultMessage: "ui.userBillingInfo.address2" }), onChange: handleChange('address_line2'), value: state.address_line2, error: Boolean(state.addressLine2Error), helperText: state.addressLine2Error, fullWidth: true }) })), _jsx(Grid, Object.assign({ size: { xs: 12, sm: inlineDisplay ? 12 : 6 } }, { children: _jsx(Autocomplete, { id: "country-select-demo", options: countries, value: state.address_country, fullWidth: true, onChange: handleChange('address_country'), getOptionLabel: (option) => option.label, renderOption: (props, option) => {
                                         const { key } = props, rest = __rest(props, ["key"]);
                                         return (_jsxs(Box, Object.assign({ component: "li", sx: { '& > img': { mr: 2, flexShrink: 0 } } }, rest, { children: [_jsx("img", { loading: "lazy", width: "20", srcSet: `https://flagcdn.com/w40/${option.code.toLowerCase()}.png 2x`, src: `https://flagcdn.com/w20/${option.code.toLowerCase()}.png`, alt: "" }), option.label, " (", option.code, ")"] }), key));
                                     }, renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { label: _jsx(FormattedMessage, { id: "ui.userBillingInfo.country", defaultMessage: "ui.userBillingInfo.country" }), fullWidth: true, id: "address_country", name: "address_country", error: Boolean(state.addressCountryError), slotProps: {

package/lib/esm/components/UserChangeAddressDialog/UserChangeAddressDialog.js

@@ -74,7 +74,7 @@ export default function UserChangeAddressDialog(inProps) {
     if (!isPaymentsEnabled || !scUserContext.user) {
         return null;
     }
-    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className), title: _jsx(FormattedMessage, { defaultMessage: "ui.userChangeAddressDialog.title", id: "component.userChangeAddressDialog.title" }), open: open, actions: _jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ variant: 'outlined', onClick: handleClose }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.userChangeAddressDialog.btnClose", id: "component.userChangeAddressDialog.btnClose" }) })), _jsx(Button, Object.assign({ loading: loading, disabled: loading, variant: 'contained', onClick: handleSave }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.userChangeAddressDialog.btnSave", id: "component.userChangeAddressDialog.btnSave" }) }))] }) }, rest, { children: _jsx(Elements, Object.assign({ stripe: stripePromise, options: elementsOptions }, { children: _jsx(AddressElement, { onChange: handleChangeAddress, options: {
+    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className), title: _jsx(FormattedMessage, { defaultMessage: "ui.userChangeAddressDialog.title", id: "component.userChangeAddressDialog.title" }), open: open, actions: _jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ variant: "outlined", onClick: handleClose }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.userChangeAddressDialog.btnClose", id: "component.userChangeAddressDialog.btnClose" }) })), _jsx(Button, Object.assign({ loading: loading, disabled: loading, variant: "contained", onClick: handleSave }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.userChangeAddressDialog.btnSave", id: "component.userChangeAddressDialog.btnSave" }) }))] }) }, rest, { children: _jsx(Elements, Object.assign({ stripe: stripePromise, options: elementsOptions }, { children: _jsx(AddressElement, { onChange: handleChangeAddress, options: {
                     mode: 'billing',
                     defaultValues: addressState
                 } }) })) })));

package/lib/esm/components/UserCounters/UserCounters.js

@@ -16,7 +16,7 @@ const classes = {
 const Root = styled(Box, {
     name: PREFIX,
     slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
+    overridesResolver: (_props, styles) => styles.root
 })(() => ({}));
 /**
  * > API documentation for the Community-JS User Counters component. Learn about the available props and the CSS API.
@@ -91,23 +91,15 @@ export default function UserCounters(inProps) {
     return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(_Fragment, { children: (followEnabled || connectionEnabled) &&
                     (followEnabled ? (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ className: classes.button, variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWINGS_ROUTE_NAME, scUser) }, { children: _jsx(FormattedMessage, { id: "ui.userCounters.followings", defaultMessage: "ui.userCounters.followings", values: {
                                         count: scUser === null || scUser === void 0 ? void 0 : scUser.followings_counter,
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                        // @ts-ignore
-                                        b: (chunks) => _jsx("strong", { children: chunks })
+                                        b: (chunks) => _jsx("strong", { children: chunks }, "ui.userCounters.followings.b")
                                     } }) })), _jsx(Bullet, {}), _jsx(Button, Object.assign({ className: classes.button, variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWERS_ROUTE_NAME, scUser) }, { children: _jsx(FormattedMessage, { id: "ui.userCounters.followers", defaultMessage: "ui.userCounters.followers", values: {
                                         count: scUser === null || scUser === void 0 ? void 0 : scUser.followers_counter,
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                        // @ts-ignore
-                                        b: (chunks) => _jsx("strong", { children: chunks })
+                                        b: (chunks) => _jsx("strong", { children: chunks }, "ui.userCounters.followers.b")
                                     } }) }))] })) : (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ className: classes.button, variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_CONNECTIONS_ROUTE_NAME, scUser) }, { children: _jsx(FormattedMessage, { id: "ui.userCounters.connections", defaultMessage: "ui.userCounters.connections", values: {
                                         count: scUser === null || scUser === void 0 ? void 0 : scUser.connections_counter,
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                        // @ts-ignore
-                                        b: (chunks) => _jsx("strong", { children: chunks })
+                                        b: (chunks) => _jsx("strong", { children: chunks }, "ui.userCounters.connections.b")
                                     } }) })), _jsx(Bullet, {})] }))) }), categoryFollowEnabled && (_jsx(Button, Object.assign({ className: classes.button, variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_CATEGORIES_ROUTE_NAME, scUser) }, { children: _jsx(FormattedMessage, { id: "ui.userCounters.categories", defaultMessage: "ui.userCounters.categories", values: {
                         count: scUser === null || scUser === void 0 ? void 0 : scUser.categories_counter,
-                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                        // @ts-ignore
-                        b: (chunks) => _jsx("strong", { children: chunks })
+                        b: (chunks) => _jsx("strong", { children: chunks }, "ui.userCounters.categories.b")
                     } }) })))] })));
 }

package/lib/esm/components/UserInfo/UserInfo.js

@@ -120,7 +120,7 @@ export default function UserInfo(inProps) {
             case SCUserProfileFields.DATE_OF_BIRTH:
                 return `${intl.formatDate(user[field], { year: 'numeric', month: 'numeric', day: 'numeric' })}`;
             case SCUserProfileFields.TAGS:
-                return (_jsx(Tags, { tags: user.tags.filter((t) => t.visible), type: TagsComponentType.LIST, direction: 'row', TagChipProps: { clickable: false, disposable: false } }));
+                return (_jsx(Tags, { tags: user.tags.filter((t) => t.visible), type: TagsComponentType.LIST, direction: "row", TagChipProps: { clickable: false, disposable: false } }));
             case SCUserProfileFields.WEBSITE:
                 return (_jsx("a", Object.assign({ href: user[field], target: '_blank' }, { children: user[field] })));
             default:

package/lib/esm/components/UserPaymentMethods/UserPaymentMethods.js

@@ -1,4 +1,4 @@
-import { __awaiter, __rest } from "tslib";
+import { __awaiter } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { Box, Button, Checkbox, CircularProgress, Icon, IconButton, Paper, Stack, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Typography, styled } from '@mui/material';
@@ -7,7 +7,7 @@ import { useSCPaymentsEnabled, useSCUser } from '@selfcommunity/react-core';
 import { useThemeProps } from '@mui/system';
 import { PREFIX } from './constants';
 import UserPaymentMethodsSkeleton from './Skeleton';
-import { FormattedMessage, useIntl } from 'react-intl';
+import { FormattedMessage } from 'react-intl';
 import { useInView } from 'react-intersection-observer';
 import { useSnackbar } from 'notistack';
 import ConfirmDialog from '../../shared/ConfirmDialog/ConfirmDialog';
@@ -51,7 +51,7 @@ const UserPaymentMethods = (inProps) => {
         props: inProps,
         name: PREFIX
     });
-    const { className = null, showBillingAddress = false } = props, rest = __rest(props, ["className", "showBillingAddress"]);
+    const { className = null, showBillingAddress = false } = props;
     // CONTEXT
     const scUserContext = useSCUser();
     // STATE
@@ -70,7 +70,6 @@ const UserPaymentMethods = (inProps) => {
     const [addPaymentMethodDialogOpen, setAddPaymentMethodDialogOpen] = useState(false);
     // HOOKS
     const { isPaymentsEnabled } = useSCPaymentsEnabled();
-    const intl = useIntl();
     const { inView } = useInView({ triggerOnce: false });
     const { enqueueSnackbar } = useSnackbar();
     /**
@@ -79,8 +78,8 @@ const UserPaymentMethods = (inProps) => {
     const loadMore = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
         // eslint-disable-next-line @typescript-eslint/require-await
         const loadItems = () => __awaiter(void 0, void 0, void 0, function* () {
-            const startingAfterId = paymentMethods.length ? paymentMethods[paymentMethods.length - 1].id : null;
-            /* getAccountCustomerPaymentMethod(startingAfterId).then((res) => {
+            /* const startingAfterId = paymentMethods.length ? paymentMethods[paymentMethods.length - 1].id : null;
+            getAccountCustomerPaymentMethod(startingAfterId).then((res) => {
               setHasMore(res.paymentMethods.has_more);
               setPaymentMethods(paymentMethods.concat(res.paymentMethods.data));
               setIsLoadingPage(false);
@@ -328,9 +327,9 @@ const UserPaymentMethods = (inProps) => {
     if (!isPaymentsEnabled || !scUserContext.user) {
         return null;
     }
-    return (_jsx(Root, Object.assign({ className: classes.root }, { children: isLoading ? (_jsx(UserPaymentMethodsSkeleton, {})) : (_jsxs(_Fragment, { children: [_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "baseline" }, { children: [_jsx(Typography, Object.assign({ variant: "h3", className: classes.headline }, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.myPaymentMethods", defaultMessage: "ui.userPaymentMethods.myPaymentMethods" }) })), paymentMethods.length > 0 && (_jsx(Button, Object.assign({ size: "small", variant: 'outlined', onClick: handleOpenAddPaymentMethodDialog }, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.btnAdd", defaultMessage: "ui.userPaymentMethods.btnAdd" }) })))] })), paymentMethods.length > 0 ? (_jsx(TableContainer, Object.assign({ style: { margin: 'auto', borderRadius: 0 }, component: Paper }, { children: _jsxs(Table, Object.assign({ sx: { minWidth: 650 }, "aria-label": "simple table", stickyHeader: true }, { children: [_jsx(TableHead, { children: _jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.typeMethod", defaultMessage: "ui.userPaymentMethods.typeMethod" }) }), _jsx(TableCell, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.brand", defaultMessage: "ui.userPaymentMethods.brand" }) }), _jsx(TableCell, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.expiration", defaultMessage: "ui.userPaymentMethods.expiration" }) }), showBillingAddress && (_jsx(TableCell, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.billingDetails", defaultMessage: "ui.userPaymentMethods.billingDetails" }) })), _jsx(TableCell, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.default", defaultMessage: "ui.userPaymentMethods.default" }) }), _jsx(TableCell, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.actions", defaultMessage: "ui.userPaymentMethods.actions" }) })] }) }), _jsxs(TableBody, { children: [paymentMethods.map((method, index) => {
+    return (_jsx(Root, Object.assign({ className: classes.root }, { children: isLoading ? (_jsx(UserPaymentMethodsSkeleton, {})) : (_jsxs(_Fragment, { children: [_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "baseline" }, { children: [_jsx(Typography, Object.assign({ variant: "h3", className: classes.headline }, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.myPaymentMethods", defaultMessage: "ui.userPaymentMethods.myPaymentMethods" }) })), paymentMethods.length > 0 && (_jsx(Button, Object.assign({ size: "small", variant: "outlined", onClick: handleOpenAddPaymentMethodDialog }, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.btnAdd", defaultMessage: "ui.userPaymentMethods.btnAdd" }) })))] })), paymentMethods.length > 0 ? (_jsx(TableContainer, Object.assign({ style: { margin: 'auto', borderRadius: 0 }, component: Paper }, { children: _jsxs(Table, Object.assign({ sx: { minWidth: 650 }, "aria-label": "simple table", stickyHeader: true }, { children: [_jsx(TableHead, { children: _jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.typeMethod", defaultMessage: "ui.userPaymentMethods.typeMethod" }) }), _jsx(TableCell, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.brand", defaultMessage: "ui.userPaymentMethods.brand" }) }), _jsx(TableCell, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.expiration", defaultMessage: "ui.userPaymentMethods.expiration" }) }), showBillingAddress && (_jsx(TableCell, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.billingDetails", defaultMessage: "ui.userPaymentMethods.billingDetails" }) })), _jsx(TableCell, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.default", defaultMessage: "ui.userPaymentMethods.default" }) }), _jsx(TableCell, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.actions", defaultMessage: "ui.userPaymentMethods.actions" }) })] }) }), _jsxs(TableBody, { children: [paymentMethods.map((method, index) => {
                                         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
-                                        return (_jsxs(TableRow, { children: [_jsx(TableCell, Object.assign({ scope: "row" }, { children: method.type.toUpperCase() })), _jsx(TableCell, Object.assign({ scope: "row" }, { children: method.type === 'card' && (_jsxs(_Fragment, { children: [_jsx(PaymentIcon, { type: ((_a = method.card) === null || _a === void 0 ? void 0 : _a.brand) || 'Generic', format: "flatRounded", width: 50 }), _jsxs(Typography, Object.assign({ className: classes.paymentNumber }, { children: ["**** **** **** ", (_b = method.card) === null || _b === void 0 ? void 0 : _b.last4] }))] })) })), _jsxs(TableCell, Object.assign({ scope: "row" }, { children: [(_c = method.card) === null || _c === void 0 ? void 0 : _c.exp_month, "/", (_d = method.card) === null || _d === void 0 ? void 0 : _d.exp_year] })), showBillingAddress && (_jsx(TableCell, Object.assign({ scope: "row" }, { children: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "left", alignItems: "center", spacing: 2 }, { children: [_jsxs(Box, { children: [_jsx(Typography, Object.assign({ variant: 'body1' }, { children: method.billing_details.name })), _jsxs(Typography, Object.assign({ variant: 'body1' }, { children: [(_f = (_e = method.billing_details) === null || _e === void 0 ? void 0 : _e.address) === null || _f === void 0 ? void 0 : _f.line1, _jsx("br", {}), (_h = (_g = method.billing_details) === null || _g === void 0 ? void 0 : _g.address) === null || _h === void 0 ? void 0 : _h.line2] })), _jsxs(Typography, Object.assign({ variant: 'body1' }, { children: [(_k = (_j = method.billing_details) === null || _j === void 0 ? void 0 : _j.address) === null || _k === void 0 ? void 0 : _k.postal_code, " - ", (_m = (_l = method.billing_details) === null || _l === void 0 ? void 0 : _l.address) === null || _m === void 0 ? void 0 : _m.city, " -", ' ', (_p = (_o = method.billing_details) === null || _o === void 0 ? void 0 : _o.address) === null || _p === void 0 ? void 0 : _p.country] }))] }), _jsx(IconButton, Object.assign({ "aria-label": "edit", color: "primary", onClick: () => handleOpenEditAddressDialog(method) }, { children: _jsx(Icon, { children: "edit" }) }))] })) }))), _jsx(TableCell, Object.assign({ scope: "row" }, { children: defaultPaymentMethodLoading === method.id ? (_jsx(CircularProgress, { size: 20 })) : (_jsxs(_Fragment, { children: [method.id === defaultPaymentMethodId, _jsx(Checkbox, { checked: method.id === defaultPaymentMethodId, onClick: () => handleSetDefaultPaymentMethodId(method.id) })] })) })), _jsx(TableCell, Object.assign({ scope: "row" }, { children: _jsx(Button, Object.assign({ variant: 'contained', onClick: () => handleDelete(method.id) }, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.btnRemove", defaultMessage: "ui.userPaymentMethods.btnRemove" }) })) }))] }, index));
-                                    }), hasMore && _jsx(UserPaymentMethodsSkeleton, {})] })] })) }))) : (_jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ variant: "body2", mb: 2 }, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.noPaymentMethods", defaultMessage: "ui.userPaymentMethods.noPaymentMethods" }) })), _jsx(Button, Object.assign({ size: "small", variant: 'contained', onClick: handleOpenAddPaymentMethodDialog }, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.btnAdd", defaultMessage: "ui.userPaymentMethods.btnAdd" }) }))] })), openDeleteDialog && (_jsx(ConfirmDialog, { open: openDeleteDialog, title: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.dialog.confirmDeleteTitle", defaultMessage: "ui.userPaymentMethods.dialog.confirmDeleteTitle" }), btnConfirm: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.dialog.confirmDeleteDescription", defaultMessage: "ui.userPaymentMethods.dialog.confirmDeleteDescription" }), onConfirm: handleConfirmDelete, onClose: handleConfirmClose, isUpdating: isDeletingPaymentMethod })), editPaymentMethodDialogOpen && editPaymentMethod !== null && (_jsx(UserChangeAddressDialog, { open: true, defaultAddress: editPaymentMethod, handleAddress: handleAddress })), addPaymentMethodDialogOpen && _jsx(UserAddPaymentMethodDialog, { open: true, handlePaymentMethod: handlePaymentMethodSuccess })] })) })));
+                                        return (_jsxs(TableRow, { children: [_jsx(TableCell, Object.assign({ scope: "row" }, { children: method.type.toUpperCase() })), _jsx(TableCell, Object.assign({ scope: "row" }, { children: method.type === 'card' && (_jsxs(_Fragment, { children: [_jsx(PaymentIcon, { type: ((_a = method.card) === null || _a === void 0 ? void 0 : _a.brand) || 'Generic', format: "flatRounded", width: 50 }), _jsxs(Typography, Object.assign({ className: classes.paymentNumber }, { children: ["**** **** **** ", (_b = method.card) === null || _b === void 0 ? void 0 : _b.last4] }))] })) })), _jsxs(TableCell, Object.assign({ scope: "row" }, { children: [(_c = method.card) === null || _c === void 0 ? void 0 : _c.exp_month, "/", (_d = method.card) === null || _d === void 0 ? void 0 : _d.exp_year] })), showBillingAddress && (_jsx(TableCell, Object.assign({ scope: "row" }, { children: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "left", alignItems: "center", spacing: 2 }, { children: [_jsxs(Box, { children: [_jsx(Typography, Object.assign({ variant: "body1" }, { children: method.billing_details.name })), _jsxs(Typography, Object.assign({ variant: "body1" }, { children: [(_f = (_e = method.billing_details) === null || _e === void 0 ? void 0 : _e.address) === null || _f === void 0 ? void 0 : _f.line1, _jsx("br", {}), (_h = (_g = method.billing_details) === null || _g === void 0 ? void 0 : _g.address) === null || _h === void 0 ? void 0 : _h.line2] })), _jsxs(Typography, Object.assign({ variant: "body1" }, { children: [(_k = (_j = method.billing_details) === null || _j === void 0 ? void 0 : _j.address) === null || _k === void 0 ? void 0 : _k.postal_code, " - ", (_m = (_l = method.billing_details) === null || _l === void 0 ? void 0 : _l.address) === null || _m === void 0 ? void 0 : _m.city, " -", ' ', (_p = (_o = method.billing_details) === null || _o === void 0 ? void 0 : _o.address) === null || _p === void 0 ? void 0 : _p.country] }))] }), _jsx(IconButton, Object.assign({ "aria-label": "edit", color: "primary", onClick: () => handleOpenEditAddressDialog(method) }, { children: _jsx(Icon, { children: "edit" }) }))] })) }))), _jsx(TableCell, Object.assign({ scope: "row" }, { children: defaultPaymentMethodLoading === method.id ? (_jsx(CircularProgress, { size: 20 })) : (_jsxs(_Fragment, { children: [method.id === defaultPaymentMethodId, _jsx(Checkbox, { checked: method.id === defaultPaymentMethodId, onClick: () => handleSetDefaultPaymentMethodId(method.id) })] })) })), _jsx(TableCell, Object.assign({ scope: "row" }, { children: _jsx(Button, Object.assign({ variant: "contained", onClick: () => handleDelete(method.id) }, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.btnRemove", defaultMessage: "ui.userPaymentMethods.btnRemove" }) })) }))] }, index));
+                                    }), hasMore && _jsx(UserPaymentMethodsSkeleton, {})] })] })) }))) : (_jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ variant: "body2", mb: 2 }, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.noPaymentMethods", defaultMessage: "ui.userPaymentMethods.noPaymentMethods" }) })), _jsx(Button, Object.assign({ size: "small", variant: "contained", onClick: handleOpenAddPaymentMethodDialog }, { children: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.btnAdd", defaultMessage: "ui.userPaymentMethods.btnAdd" }) }))] })), openDeleteDialog && (_jsx(ConfirmDialog, { open: openDeleteDialog, title: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.dialog.confirmDeleteTitle", defaultMessage: "ui.userPaymentMethods.dialog.confirmDeleteTitle" }), btnConfirm: _jsx(FormattedMessage, { id: "ui.userPaymentMethods.dialog.confirmDeleteDescription", defaultMessage: "ui.userPaymentMethods.dialog.confirmDeleteDescription" }), onConfirm: handleConfirmDelete, onClose: handleConfirmClose, isUpdating: isDeletingPaymentMethod })), editPaymentMethodDialogOpen && editPaymentMethod !== null && (_jsx(UserChangeAddressDialog, { open: true, defaultAddress: editPaymentMethod, handleAddress: handleAddress })), addPaymentMethodDialogOpen && _jsx(UserAddPaymentMethodDialog, { open: true, handlePaymentMethod: handlePaymentMethodSuccess })] })) })));
 };
 export default UserPaymentMethods;

package/lib/esm/components/UserProfileEdit/Section/AccountCredentials.js

@@ -167,5 +167,5 @@ export default function AccountCredentials(props) {
                                 }, transformOrigin: {
                                     vertical: 'center',
                                     horizontal: 'right'
-                                }, onClose: handlePopoverClose }, { children: _jsx(Box, Object.assign({ sx: { p: '10px' } }, { children: _jsx(Typography, Object.assign({ component: 'span', sx: { whiteSpace: 'pre-line' } }, { children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.newPassword.info", defaultMessage: "ui.userProfileEditAccountCredentials.newPassword.info" }) })) })) })), _jsx(PasswordTextField, { name: "confirmPassword", className: classes.formField, disabled: isSubmittingPassword, label: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.confirmPassword", defaultMessage: "ui.userProfileEditAccountCredentials.confirmPassword" }), size: "medium", value: field.confirmPassword, onChange: handleChange, onBlur: validateInput, error: Boolean(error.confirmPassword), helperText: error.confirmPassword })] })), _jsx(Button, Object.assign({ className: classes.confirmChangeButton, loading: isSubmittingPassword, disabled: !field.confirmPassword || Boolean(error.confirmPassword) || Boolean(error.password) || Boolean(error.newPassword), variant: "contained", onClick: handleSubmitPassword }, { children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.changePassword", defaultMessage: "ui.userProfileEditAccountCredentials.changePassword" }) }))] })))] })));
+                                }, onClose: handlePopoverClose }, { children: _jsx(Box, Object.assign({ sx: { p: '10px' } }, { children: _jsx(Typography, Object.assign({ component: "span", sx: { whiteSpace: 'pre-line' } }, { children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.newPassword.info", defaultMessage: "ui.userProfileEditAccountCredentials.newPassword.info" }) })) })) })), _jsx(PasswordTextField, { name: "confirmPassword", className: classes.formField, disabled: isSubmittingPassword, label: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.confirmPassword", defaultMessage: "ui.userProfileEditAccountCredentials.confirmPassword" }), size: "medium", value: field.confirmPassword, onChange: handleChange, onBlur: validateInput, error: Boolean(error.confirmPassword), helperText: error.confirmPassword })] })), _jsx(Button, Object.assign({ className: classes.confirmChangeButton, loading: isSubmittingPassword, disabled: !field.confirmPassword || Boolean(error.confirmPassword) || Boolean(error.password) || Boolean(error.newPassword), variant: "contained", onClick: handleSubmitPassword }, { children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.changePassword", defaultMessage: "ui.userProfileEditAccountCredentials.changePassword" }) }))] })))] })));
 }

package/lib/esm/components/UserProfileEdit/Section/PublicInfo.js

@@ -186,7 +186,7 @@ export default function PublicInfo(props) {
                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
                                 // @ts-ignore
                                 const _a = params.children.props, { children } = _a, rest = __rest(_a, ["children"]);
-                                return (_jsxs(InputAdornment, Object.assign({ position: 'end' }, { children: [_jsx(IconButton, Object.assign({}, rest, { children: children })), isSaving && _jsx(CircularProgress, { size: 10 })] })));
+                                return (_jsxs(InputAdornment, Object.assign({ position: "end" }, { children: [_jsx(IconButton, Object.assign({}, rest, { children: children })), isSaving && _jsx(CircularProgress, { size: 10 })] })));
                             }
                         }, 
                         // onAccept={isMobile ? handleSave(SCUserProfileFields.DATE_OF_BIRTH) : null}
@@ -230,5 +230,5 @@ export default function PublicInfo(props) {
     }
     return (_jsxs(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { children: [startActions, _fields.map((field) => {
                 return renderField(field);
-            }), _jsx(Button, Object.assign({ className: classes.btnSave, fullWidth: true, variant: "contained", color: "secondary", onClick: handleSave, loading: saving.length > 0, disabled: saving.length > 0 || !editing.length || Object.keys(error).length > 0 }, { children: _jsx(FormattedMessage, { id: 'ui.userInfo.button.save', defaultMessage: 'ui.userInfo.button.save' }) })), endActions] })));
+            }), _jsx(Button, Object.assign({ className: classes.btnSave, fullWidth: true, variant: "contained", color: "secondary", onClick: handleSave, loading: saving.length > 0, disabled: saving.length > 0 || !editing.length || Object.keys(error).length > 0 }, { children: _jsx(FormattedMessage, { id: "ui.userInfo.button.save", defaultMessage: "ui.userInfo.button.save" }) })), endActions] })));
 }

package/lib/esm/shared/ContributionActionsMenu/index.js

@@ -726,7 +726,7 @@ export default function ContributionActionsMenu(props) {
      */
     function renderFlagContributionSection() {
         const open = openSection === FLAG_CONTRIBUTION_SECTION;
-        return (_jsx(Box, { children: !contributionObj.deleted && !contributionObj.collapsed && (_jsxs(Box, { children: [_jsxs(MenuItem, Object.assign({ className: classes.subItem, disabled: isFlagging, onClick: () => handleOpenSection(FLAG_CONTRIBUTION_SECTION) }, { children: [_jsx(ListItemIcon, { children: flagType !== undefined && flagType !== null ? (_jsx(Badge, Object.assign({ classes: { badge: classes.sectionBadge }, badgeContent: _jsx(Icon, Object.assign({ className: classes.sectionWithSelectionIcon }, { children: "check" })), color: "primary" }, { children: _jsx(Icon, { children: "outlined_flag" }) }))) : (_jsx(Icon, { children: "outlined_flag" })) }), _jsx(ListItemText, { primary: _jsx(FormattedMessage, { id: "ui.contributionActionMenu.flagContributionWithMotivation", defaultMessage: "ui.contributionActionMenu.flagContributionWithMotivation" }) }), open ? _jsx(Icon, { children: "expand_less" }) : _jsx(Icon, { children: "expand_more" })] })), _jsxs(Collapse, Object.assign({ in: open, timeout: "auto", unmountOnExit: true }, { children: [renderReports(FLAG_CONTRIBUTION_SECTION), _jsx(Typography, Object.assign({ variant: 'caption', component: "div", className: classes.footerSubItems }, { children: intl.formatMessage(messages.footer) }))] }))] })) }));
+        return (_jsx(Box, { children: !contributionObj.deleted && !contributionObj.collapsed && (_jsxs(Box, { children: [_jsxs(MenuItem, Object.assign({ className: classes.subItem, disabled: isFlagging, onClick: () => handleOpenSection(FLAG_CONTRIBUTION_SECTION) }, { children: [_jsx(ListItemIcon, { children: flagType !== undefined && flagType !== null ? (_jsx(Badge, Object.assign({ classes: { badge: classes.sectionBadge }, badgeContent: _jsx(Icon, Object.assign({ className: classes.sectionWithSelectionIcon }, { children: "check" })), color: "primary" }, { children: _jsx(Icon, { children: "outlined_flag" }) }))) : (_jsx(Icon, { children: "outlined_flag" })) }), _jsx(ListItemText, { primary: _jsx(FormattedMessage, { id: "ui.contributionActionMenu.flagContributionWithMotivation", defaultMessage: "ui.contributionActionMenu.flagContributionWithMotivation" }) }), open ? _jsx(Icon, { children: "expand_less" }) : _jsx(Icon, { children: "expand_more" })] })), _jsxs(Collapse, Object.assign({ in: open, timeout: "auto", unmountOnExit: true }, { children: [renderReports(FLAG_CONTRIBUTION_SECTION), _jsx(Typography, Object.assign({ variant: "caption", component: "div", className: classes.footerSubItems }, { children: intl.formatMessage(messages.footer) }))] }))] })) }));
     }
     /**
      * Renders section hide actions
@@ -806,15 +806,9 @@ export default function ContributionActionsMenu(props) {
     /**
      * Renders component
      */
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsx(IconButton
-            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-            // @ts-ignore
-            , Object.assign({ 
-                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                // @ts-ignore
-                ref: (ref) => {
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsx(IconButton, Object.assign({ ref: (ref) => {
                     popperRef.current = ref;
-                }, "aria-haspopup": "true", onClick: handleOpen, className: classes.button, size: "small" }, { children: contributionObj && (contributionObj.collapsed || contributionObj.deleted) ? (_jsxs("span", Object.assign({ className: classes.visibilityIcons }, { children: [contributionObj.collapsed ? _jsx(Icon, { children: "visibility_off" }) : _jsx(Icon, { children: "delete" }), _jsx(Icon, { children: "expand_more" })] }))) : (_jsx(Icon, { children: "more_vert" })) })), open && (_jsx(_Fragment, { children: isMobile ? (_jsx(SwipeableDrawer, Object.assign({ open: true, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: renderContent() }))) : (_jsx(PopperRoot, Object.assign({ open: true, anchorEl: popperRef.current, role: undefined, transition: true, className: classes.popperRoot }, PopperProps, { placement: "bottom-end" }, { children: ({ TransitionProps, placement }) => (_jsx(Grow, Object.assign({}, TransitionProps, { style: { transformOrigin: placement === 'bottom' ? 'center top' : 'center bottom' } }, { children: _jsx(Paper, Object.assign({ variant: 'outlined', className: classes.paper }, { children: _jsx(ClickAwayListener, Object.assign({ onClickAway: handleClose }, { children: renderContent() })) })) }))) }))) })), openConfirmDialog && (_jsx(ConfirmDialog, Object.assign({ open: openConfirmDialog }, (currentAction === DELETE_CONTRIBUTION
+                }, "aria-haspopup": "true", onClick: handleOpen, className: classes.button, size: "small" }, { children: contributionObj && (contributionObj.collapsed || contributionObj.deleted) ? (_jsxs("span", Object.assign({ className: classes.visibilityIcons }, { children: [contributionObj.collapsed ? _jsx(Icon, { children: "visibility_off" }) : _jsx(Icon, { children: "delete" }), _jsx(Icon, { children: "expand_more" })] }))) : (_jsx(Icon, { children: "more_vert" })) })), open && (_jsx(_Fragment, { children: isMobile ? (_jsx(SwipeableDrawer, Object.assign({ open: true, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: renderContent() }))) : (_jsx(PopperRoot, Object.assign({ open: true, anchorEl: popperRef.current, role: undefined, transition: true, className: classes.popperRoot }, PopperProps, { placement: "bottom-end" }, { children: ({ TransitionProps, placement }) => (_jsx(Grow, Object.assign({}, TransitionProps, { style: { transformOrigin: placement === 'bottom' ? 'center top' : 'center bottom' } }, { children: _jsx(Paper, Object.assign({ variant: "outlined", className: classes.paper }, { children: _jsx(ClickAwayListener, Object.assign({ onClickAway: handleClose }, { children: renderContent() })) })) }))) }))) })), openConfirmDialog && (_jsx(ConfirmDialog, Object.assign({ open: openConfirmDialog }, (currentAction === DELETE_CONTRIBUTION
                 ? {
                     content: (_jsx(FormattedMessage, { id: "ui.contributionActionMenu.deleteContributionInfo", defaultMessage: "ui.contributionActionMenu.deleteContributionInfo" }))
                 }

package/lib/esm/shared/DateTimeAgo/index.js

@@ -35,7 +35,7 @@ export default function DateTimeAgo(props) {
      */
     if (date) {
         const formattedDate = getRelativeTime(date);
-        return (_jsxs(Root, Object.assign({ as: "span", className: classNames(classes.root, className) }, rest, { children: [showStartIcon && _jsx(Icon, { children: "access_time" }), _jsx(Tooltip, Object.assign({ title: `${intl.formatDate(date, { year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric' })}`, enterTouchDelay: 0 }, { children: _jsx(Typography, Object.assign({ variant: 'body2', component: 'span' }, { children: _jsx(FormattedRelativeTime, { value: -formattedDate.value, unit: formattedDate.unit, numeric: "auto" }) })) }))] })));
+        return (_jsxs(Root, Object.assign({ as: "span", className: classNames(classes.root, className) }, rest, { children: [showStartIcon && _jsx(Icon, { children: "access_time" }), _jsx(Tooltip, Object.assign({ title: `${intl.formatDate(date, { year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric' })}`, enterTouchDelay: 0 }, { children: _jsx(Typography, Object.assign({ variant: "body2", component: "span" }, { children: _jsx(FormattedRelativeTime, { value: -formattedDate.value, unit: formattedDate.unit, numeric: "auto" }) })) }))] })));
     }
     return null;
 }

package/lib/esm/shared/EmojiPicker/EmojiPicker.d.ts

@@ -1,6 +1,5 @@
 import { PickerProps } from 'emoji-picker-react';
-interface EmojiPickerProps extends PickerProps {
+export interface EmojiPickerProps extends PickerProps {
     className?: string;
 }
 export default function EmojiPicker(inProps: EmojiPickerProps): JSX.Element;
-export {};

package/lib/esm/shared/InfiniteScroll/stories/ScrolleableTop.js

@@ -19,5 +19,5 @@ export default function ScrolleableTop() {
     return (_jsxs("div", { children: [_jsx("h1", { children: "demo: Infinite Scroll on top" }), _jsx("hr", {}), _jsx("div", Object.assign({ id: "scrollableDiv", style: {
                     height: 300,
                     overflow: 'auto'
-                } }, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: items.length, previous: fetchMoreData, hasMorePrevious: true, loaderPrevious: _jsx("h4", { children: "Loading prev..." }), scrollableTarget: "scrollableDiv", scrollThreshold: '0px' }, { children: items.map((_, index) => (_jsxs("div", Object.assign({ style: style }, { children: ["div - #", index] }), index))) })) }))] }));
+                } }, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: items.length, previous: fetchMoreData, hasMorePrevious: true, loaderPrevious: _jsx("h4", { children: "Loading prev..." }), scrollableTarget: "scrollableDiv", scrollThreshold: "0px" }, { children: items.map((_, index) => (_jsxs("div", Object.assign({ style: style }, { children: ["div - #", index] }), index))) })) }))] }));
 }