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

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

@@ -7,6 +7,6 @@ function UserBillingInfoSkeleton(props) {
     if (props.mode === Billing_1.UserBillingInfoMode.READ) {
         return ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 15, width: 200, sx: { mb: 2 } }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 15, width: 250, sx: { mb: 2 } }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 15, width: 220, sx: { mb: 2 } }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 15, width: 190, sx: { mb: 2 } })] }));
     }
-    return ((0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, spacing: 3 }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 50 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 50 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 50 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 50 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 50 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 50 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 6, justifyContent: 'center' }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rounded", height: 30, width: 100 }) }))] })));
+    return ((0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: 3 }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 50 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 50 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 50 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 50 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 50 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", height: 50 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: 6 }, justifyContent: "center" }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rounded", height: 30, width: 100 }) }))] })));
 }
 exports.default = UserBillingInfoSkeleton;

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

@@ -26,10 +26,10 @@ export interface UserBillingInfoProps {
 /**
  * BillingInfo component interface reference
  */
-export declare type UserBillingInfoRef = {
+export type UserBillingInfoRef = {
     isBillingInfoCompleted: () => boolean;
     showError: (e: string) => void;
     billingMode: () => UserBillingInfoMode;
 };
-declare const _default: React.ForwardRefExoticComponent<Pick<UserBillingInfoProps, keyof UserBillingInfoProps> & React.RefAttributes<UserBillingInfoRef>>;
+declare const _default: React.ForwardRefExoticComponent<Omit<UserBillingInfoProps, "ref"> & React.RefAttributes<UserBillingInfoRef>>;
 export default _default;

package/lib/cjs/components/UserBillingInfo/UserBillingInfo.js

@@ -71,7 +71,7 @@ const UserBillingInfo = (inProps, ref) => {
     const scUserContext = (0, react_core_1.useSCUser)();
     // STATE
     const [state, dispatch] = (0, react_1.useReducer)(reducer_1.reducer, (0, reducer_1.getInitialState)({ mode }));
-    const [customer, setCustomer] = (0, react_1.useState)();
+    const [customer] = (0, react_1.useState)();
     // HOOKS
     const { isPaymentsEnabled } = (0, react_core_1.useSCPaymentsEnabled)();
     const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
@@ -446,47 +446,56 @@ const UserBillingInfo = (inProps, ref) => {
     if (!isPaymentsEnabled || !scUserContext.user) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), id: id }, rest, { ref: componentRef }, { children: (0, jsx_runtime_1.jsx)(react_1.Fragment, { children: state.isLoading ? ((0, jsx_runtime_1.jsx)(Skeleton_1.default, { mode: mode })) : ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: state.mode === Billing_1.UserBillingInfoMode.READ ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [state.name ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: state.name })), (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: [state.address_line1, (0, jsx_runtime_1.jsx)("br", {}), state.address_line2] })), (0, jsx_runtime_1.jsxs)(material_1.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) && (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: state.tax_code })), state.isBusiness && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [state.tax_id_data && (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: ["VAT: ", state.tax_id_data.value] })), state.sdi && (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: ["SDI: ", state.sdi] })), state.pec && (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: ["PEC: ", state.pec] }))] }))] })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.noInfo", defaultMessage: "ui.userBillingInfo.noInfo" }) }))), state.initialDataCompleted && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ sx: { mt: 1 }, variant: 'contained', size: 'small', disabled: Boolean(disableButtons), onClick: handleChangeViewMode }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "component.CheckoutForm.billingInfoChangeButton", defaultMessage: "component.CheckoutForm.billingInfoChangeButton" }) })))] })) : ((0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, spacing: 3 }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: inlineDisplay ? 12 : 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "name", name: "name", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.name", defaultMessage: "ui.userBillingInfo.name" }), onChange: handleChange('name'), value: state.name, error: Boolean(state.nameError), helperText: state.nameError, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: inlineDisplay ? 12 : 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "address_line1", name: "address_line1", label: (0, jsx_runtime_1.jsx)(react_intl_1.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 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: inlineDisplay ? 12 : 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "address_line2", name: "address_line2", label: (0, jsx_runtime_1.jsx)(react_intl_1.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 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: inlineDisplay ? 12 : 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.Autocomplete, { id: "country-select-demo", options: Country_1.countries, value: state.address_country, fullWidth: true, onChange: handleChange('address_country'), getOptionLabel: (option) => option.label, renderOption: (props, option) => {
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                                        // @ts-ignore
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), id: id }, rest, { ref: componentRef }, { children: (0, jsx_runtime_1.jsx)(react_1.Fragment, { children: state.isLoading ? ((0, jsx_runtime_1.jsx)(Skeleton_1.default, { mode: mode })) : ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: state.mode === Billing_1.UserBillingInfoMode.READ ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [state.name ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: state.name })), (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: [state.address_line1, (0, jsx_runtime_1.jsx)("br", {}), state.address_line2] })), (0, jsx_runtime_1.jsxs)(material_1.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) && (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: state.tax_code })), state.isBusiness && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [state.tax_id_data && (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: ["VAT: ", state.tax_id_data.value] })), state.sdi && (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: ["SDI: ", state.sdi] })), state.pec && (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: ["PEC: ", state.pec] }))] }))] })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: 'body1' }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.noInfo", defaultMessage: "ui.userBillingInfo.noInfo" }) }))), state.initialDataCompleted && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ sx: { mt: 1 }, variant: 'contained', size: 'small', disabled: Boolean(disableButtons), onClick: handleChangeViewMode }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "component.CheckoutForm.billingInfoChangeButton", defaultMessage: "component.CheckoutForm.billingInfoChangeButton" }) })))] })) : ((0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: 3 }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: inlineDisplay ? 12 : 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "name", name: "name", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.name", defaultMessage: "ui.userBillingInfo.name" }), onChange: handleChange('name'), value: state.name, error: Boolean(state.nameError), helperText: state.nameError, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: inlineDisplay ? 12 : 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "address_line1", name: "address_line1", label: (0, jsx_runtime_1.jsx)(react_intl_1.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 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: inlineDisplay ? 12 : 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "address_line2", name: "address_line2", label: (0, jsx_runtime_1.jsx)(react_intl_1.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 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: inlineDisplay ? 12 : 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Autocomplete, { id: "country-select-demo", options: Country_1.countries, value: state.address_country, fullWidth: true, onChange: handleChange('address_country'), getOptionLabel: (option) => option.label, renderOption: (props, option) => {
                                         const { key } = props, rest = tslib_1.__rest(props, ["key"]);
                                         return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ component: "li", sx: { '& > img': { mr: 2, flexShrink: 0 } } }, rest, { children: [(0, jsx_runtime_1.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) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.country", defaultMessage: "ui.userBillingInfo.country" }), fullWidth: true, id: "address_country", name: "address_country", error: Boolean(state.addressCountryError), InputProps: Object.assign(Object.assign({}, params.InputProps), (state.address_country && {
-                                            startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)("img", { loading: "lazy", width: "20", srcSet: `https://flagcdn.com/w40/${state.address_country.code.toLowerCase()}.png 2x`, src: `https://flagcdn.com/w20/${state.address_country.code.toLowerCase()}.png`, alt: "" }) })))
-                                        })), inputProps: Object.assign(Object.assign({}, params.inputProps), { autoComplete: 'new-password' // disable autocomplete and autofill
-                                         }) }))) }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: inlineDisplay ? 12 : 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "address_state", name: "address_state", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.state", defaultMessage: "ui.userBillingInfo.state" }), onChange: handleChange('address_state'), value: state.address_state, error: Boolean(state.addressStateError), helperText: state.addressStateError, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: inlineDisplay ? 12 : 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "address_postal_code", name: "address_postal_code", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.postalCode", defaultMessage: "ui.userBillingInfo.postalCode" }), onChange: handleChange('address_postal_code'), value: state.address_postal_code, error: Boolean(state.addressPostalCodeError), helperText: state.addressPostalCodeError, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: inlineDisplay ? 12 : 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "address_city", name: "address_city", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.city", defaultMessage: "ui.userBillingInfo.city" }), onChange: handleChange('address_city'), value: state.address_city, error: Boolean(state.addressCityError), helperText: state.addressCityError, InputProps: {
-                                        startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }) })))
-                                    }, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: inlineDisplay ? 12 : 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "phone", name: "phone", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.phone", defaultMessage: "ui.userBillingInfo.phone" }), onChange: handleChange('phone'), value: state.phone, error: Boolean(state.phoneError), helperText: state.phoneError, InputProps: {
-                                        startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "person" }) })))
-                                    }, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: inlineDisplay ? 12 : 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "tax_code", name: "tax_code", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.taxCode", defaultMessage: "ui.userBillingInfo.taxCode" }), onChange: handleChange('tax_code'), value: state.tax_code, error: Boolean(state.taxCodeError), helperText: state.taxCodeError, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12 }, { children: (0, jsx_runtime_1.jsx)(material_1.FormGroup, { children: (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { disabled: Boolean(disableButtons), control: (0, jsx_runtime_1.jsx)(material_1.Checkbox, Object.assign({ checked: state.isBusiness }, ((state.taxIdDataError || state.sdiError || state.pecError) && { color: 'secondary' }), { className: (0, classnames_1.default)({
+                                    }, renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.country", defaultMessage: "ui.userBillingInfo.country" }), fullWidth: true, id: "address_country", name: "address_country", error: Boolean(state.addressCountryError), slotProps: {
+                                            input: Object.assign(Object.assign({}, params.InputProps), (state.address_country && {
+                                                startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)("img", { loading: "lazy", width: "20", srcSet: `https://flagcdn.com/w40/${state.address_country.code.toLowerCase()}.png 2x`, src: `https://flagcdn.com/w20/${state.address_country.code.toLowerCase()}.png`, alt: "" }) })))
+                                            })),
+                                            htmlInput: Object.assign(Object.assign({}, params.inputProps), { autoComplete: 'new-password' // disable autocomplete and autofill
+                                             })
+                                        } }))) }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: inlineDisplay ? 12 : 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "address_state", name: "address_state", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.state", defaultMessage: "ui.userBillingInfo.state" }), onChange: handleChange('address_state'), value: state.address_state, error: Boolean(state.addressStateError), helperText: state.addressStateError, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: inlineDisplay ? 12 : 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "address_postal_code", name: "address_postal_code", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.postalCode", defaultMessage: "ui.userBillingInfo.postalCode" }), onChange: handleChange('address_postal_code'), value: state.address_postal_code, error: Boolean(state.addressPostalCodeError), helperText: state.addressPostalCodeError, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: inlineDisplay ? 12 : 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "address_city", name: "address_city", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.city", defaultMessage: "ui.userBillingInfo.city" }), onChange: handleChange('address_city'), value: state.address_city, error: Boolean(state.addressCityError), helperText: state.addressCityError, slotProps: {
+                                        input: {
+                                            startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }) })))
+                                        }
+                                    }, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: inlineDisplay ? 12 : 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "phone", name: "phone", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.phone", defaultMessage: "ui.userBillingInfo.phone" }), onChange: handleChange('phone'), value: state.phone, error: Boolean(state.phoneError), helperText: state.phoneError, slotProps: {
+                                        input: {
+                                            startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "person" }) })))
+                                        }
+                                    }, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: inlineDisplay ? 12 : 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "tax_code", name: "tax_code", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.taxCode", defaultMessage: "ui.userBillingInfo.taxCode" }), onChange: handleChange('tax_code'), value: state.tax_code, error: Boolean(state.taxCodeError), helperText: state.taxCodeError, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: "grow" }, { children: (0, jsx_runtime_1.jsx)(material_1.FormGroup, { children: (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { disabled: Boolean(disableButtons), control: (0, jsx_runtime_1.jsx)(material_1.Checkbox, Object.assign({ checked: state.isBusiness }, ((state.taxIdDataError || state.sdiError || state.pecError) && { color: 'secondary' }), { className: (0, classnames_1.default)({
                                                 [classes.error]: state.taxIdDataError || state.sdiError || state.pecError
                                             }), onChange: handleSetBusiness })), label: (0, jsx_runtime_1.jsx)("span", Object.assign({ className: (0, classnames_1.default)({
                                                 [classes.error]: state.taxIdDataError || state.sdiError || state.pecError
                                             }) }, { children: intl.formatMessage({
                                                 id: 'component.billingInfo.accountBusiness',
                                                 defaultMessage: 'component.billingInfo.accountBusiness'
-                                            }) })) }) }) })), state.isBusiness && ((0, jsx_runtime_1.jsx)(Grow_1.default, Object.assign({ in: state.isBusiness }, { children: (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12 }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, spacing: 3 }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: inlineDisplay ? 12 : 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "tax_id_data", name: "tax_id_data", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.taxId", defaultMessage: "ui.userBillingInfo.taxId" }), onChange: handleChange('tax_id_data'), value: state.tax_id_data ? state.tax_id_data.value : null, error: Boolean(state.taxIdDataError), helperText: `${state.taxIdDataError ? state.taxIdDataError : ''} ${state.address_country && state.address_country.code && Billing_1.VAT_EXAMPLE[state.address_country.code]
+                                            }) })) }) }) })), state.isBusiness && ((0, jsx_runtime_1.jsx)(Grow_1.default, Object.assign({ in: state.isBusiness }, { children: (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: "grow" }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: 3 }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: inlineDisplay ? 12 : 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "tax_id_data", name: "tax_id_data", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.taxId", defaultMessage: "ui.userBillingInfo.taxId" }), onChange: handleChange('tax_id_data'), value: state.tax_id_data ? state.tax_id_data.value : null, error: Boolean(state.taxIdDataError), helperText: `${state.taxIdDataError ? state.taxIdDataError : ''} ${state.address_country && state.address_country.code && Billing_1.VAT_EXAMPLE[state.address_country.code]
                                                         ? intl.formatMessage({
                                                             id: 'component.billingInfo.requiredFormat',
                                                             defaultMessage: 'component.billingInfo.requiredFormat'
                                                         }) + Billing_1.VAT_EXAMPLE[state.address_country.code]
                                                         : ''}`, placeholder: state.address_country && state.address_country.code && Billing_1.VAT_EXAMPLE[state.address_country.code]
                                                         ? Billing_1.VAT_EXAMPLE[state.address_country.code]
-                                                        : '', InputProps: {
-                                                        endAdornment: state.taxIdVerificationStatus !== null && ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: state.taxIdVerificationStatus === 'verified' ? ((0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "primary" }, { children: "done" }))) : state.taxIdVerificationStatus === 'pending' ? ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ id: "tooltip-warning", title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.taxCheckPending", defaultMessage: "ui.userBillingInfo.taxCheckPending" }), enterDelay: 300, leaveDelay: 300, placement: "top" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "warning" }, { children: "help" })) }))) : ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ id: "tooltip-warning", title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.taxCheckWarning", defaultMessage: "ui.userBillingInfo.taxCheckWarning" }), enterDelay: 300, leaveDelay: 300, placement: "top" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "warning" }, { children: "help" })) }))) })))
-                                                    }, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: inlineDisplay ? 12 : 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "sdi", name: "sdi", label: `${intl.formatMessage({ id: 'component.billingInfo.sdi', defaultMessage: 'component.billingInfo.sdi' })} ${((_a = state.address_country) === null || _a === void 0 ? void 0 : _a.code) === Country_1.COUNTRY_CODES.IT
+                                                        : '', slotProps: {
+                                                        input: {
+                                                            endAdornment: state.taxIdVerificationStatus !== null && ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: state.taxIdVerificationStatus === 'verified' ? ((0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "primary" }, { children: "done" }))) : state.taxIdVerificationStatus === 'pending' ? ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ id: "tooltip-warning", title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.taxCheckPending", defaultMessage: "ui.userBillingInfo.taxCheckPending" }), enterDelay: 300, leaveDelay: 300, placement: "top" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "warning" }, { children: "help" })) }))) : ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ id: "tooltip-warning", title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.taxCheckWarning", defaultMessage: "ui.userBillingInfo.taxCheckWarning" }), enterDelay: 300, leaveDelay: 300, placement: "top" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "warning" }, { children: "help" })) }))) })))
+                                                        }
+                                                    }, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: inlineDisplay ? 12 : 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "sdi", name: "sdi", label: `${intl.formatMessage({ id: 'component.billingInfo.sdi', defaultMessage: 'component.billingInfo.sdi' })} ${((_a = state.address_country) === null || _a === void 0 ? void 0 : _a.code) === Country_1.COUNTRY_CODES.IT
                                                         ? intl.formatMessage({
                                                             id: 'component.billingInfo.field.optional',
                                                             defaultMessage: 'component.billingInfo.field.optional'
                                                         })
-                                                        : ''}`, onChange: handleChange('sdi'), value: state.sdi, error: Boolean(state.sdiError), helperText: state.sdiError, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: inlineDisplay ? 12 : 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "pec", name: "pec", label: `${intl.formatMessage({ id: 'component.billingInfo.pec', defaultMessage: 'component.billingInfo.pec' })} ${((_b = state.address_country) === null || _b === void 0 ? void 0 : _b.code) === Country_1.COUNTRY_CODES.IT
+                                                        : ''}`, onChange: handleChange('sdi'), value: state.sdi, error: Boolean(state.sdiError), helperText: state.sdiError, fullWidth: true }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { sm: inlineDisplay ? 12 : 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", id: "pec", name: "pec", label: `${intl.formatMessage({ id: 'component.billingInfo.pec', defaultMessage: 'component.billingInfo.pec' })} ${((_b = state.address_country) === null || _b === void 0 ? void 0 : _b.code) === Country_1.COUNTRY_CODES.IT
                                                         ? intl.formatMessage({
                                                             id: 'component.billingInfo.field.optional',
                                                             defaultMessage: 'component.billingInfo.field.optional'
                                                         })
-                                                        : ''}`, onChange: handleChange('pec'), value: state.pec, error: Boolean(state.pecError), helperText: state.pecError, InputProps: {
-                                                        type: 'email',
-                                                        startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "email" }) })))
-                                                    }, fullWidth: true }) }))] })) })) }))), state.error && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12 }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ align: "left", color: "secondary" }, { children: state.error })) }))), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12 }, { children: (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ align: "left" }, { children: [(0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ variant: "contained", size: "small", color: "primary", disabled: state.isProcessing || Boolean(disableButtons), loading: state.isProcessing, onClick: handleSubmit }, { children: buttonLabel })), onBack && state.initialDataCompleted && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "text", size: "small", onClick: handleBack, disabled: Boolean(disableButtons) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.back", defaultMessage: "ui.userBillingInfo.back" }) })))] })) }))] })) })) })) }) })));
+                                                        : ''}`, onChange: handleChange('pec'), value: state.pec, error: Boolean(state.pecError), helperText: state.pecError, slotProps: {
+                                                        input: {
+                                                            type: 'email',
+                                                            startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "email" }) })))
+                                                        }
+                                                    }, fullWidth: true }) }))] })) })) }))), state.error && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: "grow" }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ align: "left", color: "secondary" }, { children: state.error })) }))), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: "grow" }, { children: (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ align: "left" }, { children: [(0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ variant: "contained", size: "small", color: "primary", disabled: state.isProcessing || Boolean(disableButtons), loading: state.isProcessing, onClick: handleSubmit }, { children: buttonLabel })), onBack && state.initialDataCompleted && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "text", size: "small", onClick: handleBack, disabled: Boolean(disableButtons) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userBillingInfo.back", defaultMessage: "ui.userBillingInfo.back" }) })))] })) }))] })) })) })) }) })));
 };
 exports.default = (0, react_1.forwardRef)(UserBillingInfo);

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

@@ -18,4 +18,4 @@ export interface UserInfoDialogProps extends Pick<BaseDialogProps, Exclude<keyof
      */
     [p: string]: any;
 }
-export default function UserInfoDialog(inProps: UserInfoDialogProps): JSX.Element;
+export default function UserInfoDialog(inProps: UserInfoDialogProps): import("react/jsx-runtime").JSX.Element;

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

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

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

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

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

@@ -1,4 +1,4 @@
 import UserLiveStreamWidget, { UserLiveStreamWidgetProps } from './UserLiveStreamWidget';
 import UserLiveStreamWidgetSkeleton from './Skeleton';
 export default UserLiveStreamWidget;
-export { UserLiveStreamWidgetSkeleton, type UserLiveStreamWidgetProps };
+export { UserLiveStreamWidgetSkeleton, UserLiveStreamWidgetProps };

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

@@ -10,6 +10,6 @@ export interface UserPaymentMethodsSkeletonProps {
      */
     showBillingAddress?: boolean;
 }
-export declare type UserPaymentMethodsSkeletonRef = {};
+export type UserPaymentMethodsSkeletonRef = {};
 declare const _default: React.ForwardRefExoticComponent<UserPaymentMethodsSkeletonProps & React.RefAttributes<UserPaymentMethodsSkeletonRef>>;
 export default _default;

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

@@ -14,6 +14,6 @@ export interface UserPaymentMethodsProps {
      */
     [p: string]: any;
 }
-export declare type UserPaymentMethodsRef = {};
-declare const _default: React.ForwardRefExoticComponent<Pick<UserPaymentMethodsProps, keyof UserPaymentMethodsProps> & React.RefAttributes<UserPaymentMethodsRef>>;
+export type UserPaymentMethodsRef = {};
+declare const _default: React.ForwardRefExoticComponent<Omit<UserPaymentMethodsProps, "ref"> & React.RefAttributes<UserPaymentMethodsRef>>;
 export default _default;

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

@@ -131,7 +131,7 @@ function AccountCredentials(props) {
         e.stopPropagation();
         setIsSubmitting(true);
         api_services_1.UserService.changeUserMail(user === null || user === void 0 ? void 0 : user.id, field.email, !skipEmailValidation, !skipEmailValidation)
-            .then((res) => {
+            .then(() => {
             setIsEditing(false);
             setIsSubmitting(false);
             if (skipEmailValidation) {
@@ -156,10 +156,14 @@ function AccountCredentials(props) {
     if (!user) {
         return;
     }
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.email }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditAccountCredentials.email", defaultMessage: "ui.userProfileEditAccountCredentials.email" }) })), (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isSubmitting ? ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, {})) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(EmailTextField_1.default, { name: "email", disabled: !isEditing || isSubmitting, size: "small", value: field.email, onChange: handleChange, onBlur: handleEmailBlur, error: Boolean(error.email), helperText: error.email && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.userProfileEditAccountCredentials.email.error.${error.email}`, defaultMessage: `ui.userProfileEditAccountCredentials.email.error.${error.email}` })), InputProps: {
-                                    endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: !isEditing ? ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => setIsEditing(true), edge: "end" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "edit" }) }))) : error.email ? ((0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "error" }, { children: "error" }))) : ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handleSubmitEmail, edge: "end", color: "primary", disabled: !field.email || error.email }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "check" }) }))) })))
-                                } }) })) }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.password }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditAccountCredentials.passwordLabel", defaultMessage: "ui.userProfileEditAccountCredentials.passwordLabel" }) })), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", onClick: () => setOpenChangePasswordDialog(true), sx: { mb: 1 } }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditAccountCredentials.changePassword", defaultMessage: "ui.userProfileEditAccountCredentials.changePassword" }) }))] }), openChangePasswordDialog && ((0, jsx_runtime_1.jsxs)(PasswordDialogRoot, Object.assign({ className: classes.dialogRoot, title: intl.formatMessage(messages.changePasswordTitle), open: openChangePasswordDialog, onClose: handleCloseDialog }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.FormGroup, Object.assign({ className: classes.form }, { children: [(0, jsx_runtime_1.jsx)(PasswordTextField_1.default, { className: classes.formField, name: "password", disabled: isSubmittingPassword, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditAccountCredentials.password", defaultMessage: "ui.userProfileEditAccountCredentials.password" }), size: "medium", value: field.password, onChange: handleChange, error: Boolean(error.password), helperText: error.password && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.userProfileEditAccountCredentials.password.error.${error.password}`, defaultMessage: `ui.userProfileEditAccountCredentials.password.error.${error.password}` })) }), (0, jsx_runtime_1.jsx)(PasswordTextField_1.default, { name: "newPassword", className: classes.formField, disabled: isSubmittingPassword, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditAccountCredentials.newPassword", defaultMessage: "ui.userProfileEditAccountCredentials.newPassword" }), size: "medium", value: field.newPassword, onChange: handleChange, error: Boolean(error.newPassword), helperText: error.newPassword && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.userProfileEditAccountCredentials.newPassword.error.${error.newPassword}`, defaultMessage: `ui.userProfileEditAccountCredentials.newPassword.error.${error.newPassword}` })), InputProps: {
-                                    endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ "aria-label": "info", onClick: handlePopoverOpen, edge: "end" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "info" }) })) })))
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.email }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditAccountCredentials.email", defaultMessage: "ui.userProfileEditAccountCredentials.email" }) })), (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isSubmitting ? ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, {})) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(EmailTextField_1.default, { name: "email", disabled: !isEditing || isSubmitting, size: "small", value: field.email, onChange: handleChange, onBlur: handleEmailBlur, error: Boolean(error.email), helperText: error.email && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.userProfileEditAccountCredentials.email.error.${error.email}`, defaultMessage: `ui.userProfileEditAccountCredentials.email.error.${error.email}` })), slotProps: {
+                                    input: {
+                                        endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: !isEditing ? ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => setIsEditing(true), edge: "end" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "edit" }) }))) : error.email ? ((0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "error" }, { children: "error" }))) : ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handleSubmitEmail, edge: "end", color: "primary", disabled: !field.email || error.email }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "check" }) }))) })))
+                                    }
+                                } }) })) }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.password }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditAccountCredentials.passwordLabel", defaultMessage: "ui.userProfileEditAccountCredentials.passwordLabel" }) })), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", onClick: () => setOpenChangePasswordDialog(true), sx: { mb: 1 } }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditAccountCredentials.changePassword", defaultMessage: "ui.userProfileEditAccountCredentials.changePassword" }) }))] }), openChangePasswordDialog && ((0, jsx_runtime_1.jsxs)(PasswordDialogRoot, Object.assign({ className: classes.dialogRoot, title: intl.formatMessage(messages.changePasswordTitle), open: openChangePasswordDialog, onClose: handleCloseDialog }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.FormGroup, Object.assign({ className: classes.form }, { children: [(0, jsx_runtime_1.jsx)(PasswordTextField_1.default, { className: classes.formField, name: "password", disabled: isSubmittingPassword, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditAccountCredentials.password", defaultMessage: "ui.userProfileEditAccountCredentials.password" }), size: "medium", value: field.password, onChange: handleChange, error: Boolean(error.password), helperText: error.password && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.userProfileEditAccountCredentials.password.error.${error.password}`, defaultMessage: `ui.userProfileEditAccountCredentials.password.error.${error.password}` })) }), (0, jsx_runtime_1.jsx)(PasswordTextField_1.default, { name: "newPassword", className: classes.formField, disabled: isSubmittingPassword, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditAccountCredentials.newPassword", defaultMessage: "ui.userProfileEditAccountCredentials.newPassword" }), size: "medium", value: field.newPassword, onChange: handleChange, error: Boolean(error.newPassword), helperText: error.newPassword && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.userProfileEditAccountCredentials.newPassword.error.${error.newPassword}`, defaultMessage: `ui.userProfileEditAccountCredentials.newPassword.error.${error.newPassword}` })), slotProps: {
+                                    input: {
+                                        endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ "aria-label": "info", onClick: handlePopoverOpen, edge: "end" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "info" }) })) })))
+                                    }
                                 } }), (0, jsx_runtime_1.jsx)(material_1.Popover, Object.assign({ open: open, anchorEl: anchorEl, anchorOrigin: {
                                     vertical: 'center',
                                     horizontal: 'left'

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

@@ -31,6 +31,6 @@ const Root = (0, material_1.styled)(material_1.Box, {
  *
  */
 function UserProfileEditSkeleton() {
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, { children: (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ item: true, md: 12, sm: 12 }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", sx: { height: 20, width: '100%' } }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", sx: { height: 20, width: '100%' } })] })) })) })));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, { children: (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true, width: "100%" }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ size: "grow" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", sx: { height: 20, width: '100%' } }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", sx: { height: 20, width: '100%' } })] })) })) })));
 }
 exports.default = UserProfileEditSkeleton;

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

@@ -32,5 +32,5 @@ export interface WidgetProps extends CardProps {
      */
     [p: string]: any;
 }
-declare const _default: React.ForwardRefExoticComponent<Pick<WidgetProps, keyof WidgetProps> & React.RefAttributes<HTMLDivElement>>;
+declare const _default: React.ForwardRefExoticComponent<Omit<WidgetProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export default _default;

package/lib/cjs/shared/AccordionLessons/AccordionLessons.d.ts

@@ -5,4 +5,4 @@ export interface AccordionLessonsProps {
     viewerJoinStatus?: SCCourseJoinStatusType;
     className?: HTMLAttributes<HTMLDivElement>['className'];
 }
-export default function AccordionLessons(inProps: AccordionLessonsProps): JSX.Element;
+export default function AccordionLessons(inProps: AccordionLessonsProps): import("react/jsx-runtime").JSX.Element;

package/lib/cjs/shared/AccordionLessons/Skeleton.d.ts

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

package/lib/cjs/shared/AddUsersButton/AddUsersButton.d.ts

@@ -24,6 +24,6 @@ export interface AddUsersButtonProps extends ButtonProps {
      */
     [p: string]: any;
 }
-declare function AddUsersButton(inProps: AddUsersButtonProps): JSX.Element;
+declare function AddUsersButton(inProps: AddUsersButtonProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof AddUsersButton>;
 export default _default;

package/lib/cjs/shared/AddUsersButton/AddUsersButton.js

@@ -129,7 +129,9 @@ function AddUsersButton(inProps) {
     const handleDelete = (0, react_1.useCallback)((userToDelete) => {
         setInvited((prev) => prev.filter((user) => user.id !== userToDelete.id));
     }, [setInvited]);
-    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ onClick: handleToggleDialogOpen, variant: variant, color: color, size: size, className: (0, classnames_1.default)(classes.root, classes.contrastColor, className) }, rest, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: label, defaultMessage: label }) })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ DialogContentProps: { dividers: false }, open: true, onClose: handleToggleDialogOpen, title: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.dialog.title", defaultMessage: "ui.addUserButton.dialog.title" }) })), actions: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ onClick: handleConfirm, size: "medium", variant: "contained", autoFocus: true, disabled: !invited.length }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.dialog.confirm", defaultMessage: "ui.addUserButton.dialog.confirm" }) })) })), className: classes.dialogRoot }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.dialogAutocompleteWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Autocomplete, { loading: loading, size: "small", multiple: true, options: suggested, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, filterOptions: filterOptions, value: invited, getOptionLabel: (option) => (option === null || option === void 0 ? void 0 : option.username) || '...', isOptionEqualToValue: (option, value) => (option === null || option === void 0 ? void 0 : option.id) === value.id, loadingText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.autocomplete.loading", defaultMessage: "ui.addUserButton.autocomplete.loading" }), noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.autocomplete.noResults", defaultMessage: "ui.addUserButton.autocomplete.noResults" }), renderTags: () => null, popupIcon: null, disableClearable: true, renderOption: (props, option) => ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ component: "li", flexDirection: "row", gap: "5px" }, props, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.username, src: option.avatar }), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: option.username })] }))), renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { variant: "outlined", placeholder: `${intl.formatMessage(messages.placeholder)}`, InputProps: Object.assign({}, params.InputProps) }))) }), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.dialogChipWrapper }, { children: invited.map((option, index) => ((0, jsx_runtime_1.jsx)(material_1.Chip, { avatar: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.username, src: option.avatar }), label: option.username, onDelete: () => {
+    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ onClick: handleToggleDialogOpen, variant: variant, color: color, size: size, className: (0, classnames_1.default)(classes.root, classes.contrastColor, className) }, rest, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: label, defaultMessage: label }) })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ DialogContentProps: { dividers: false }, open: true, onClose: handleToggleDialogOpen, title: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.dialog.title", defaultMessage: "ui.addUserButton.dialog.title" }) })), actions: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ onClick: handleConfirm, size: "medium", variant: "contained", autoFocus: true, disabled: !invited.length }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.dialog.confirm", defaultMessage: "ui.addUserButton.dialog.confirm" }) })) })), className: classes.dialogRoot }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.dialogAutocompleteWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Autocomplete, { loading: loading, size: "small", multiple: true, options: suggested, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, filterOptions: filterOptions, value: invited, getOptionLabel: (option) => (option === null || option === void 0 ? void 0 : option.username) || '...', isOptionEqualToValue: (option, value) => (option === null || option === void 0 ? void 0 : option.id) === value.id, loadingText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.autocomplete.loading", defaultMessage: "ui.addUserButton.autocomplete.loading" }), noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.autocomplete.noResults", defaultMessage: "ui.addUserButton.autocomplete.noResults" }), renderTags: () => null, popupIcon: null, disableClearable: true, renderOption: (props, option) => ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ component: "li", flexDirection: "row", gap: "5px" }, props, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.username, src: option.avatar }), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: option.username })] }))), renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { variant: "outlined", placeholder: `${intl.formatMessage(messages.placeholder)}`, slotProps: {
+                                    input: Object.assign({}, params.InputProps)
+                                } }))) }), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.dialogChipWrapper }, { children: invited.map((option, index) => ((0, jsx_runtime_1.jsx)(material_1.Chip, { avatar: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.username, src: option.avatar }), label: option.username, onDelete: () => {
                                     handleDelete(option);
                                 } }, index))) }))] })) })))] }));
 }

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

@@ -38,4 +38,4 @@ export interface AutoPlayerProps {
      */
     [p: string]: any;
 }
-export default function AutoPlayer(props: AutoPlayerProps): JSX.Element;
+export default function AutoPlayer(props: AutoPlayerProps): import("react/jsx-runtime").JSX.Element;

package/lib/cjs/shared/BaseDialog/BaseDialog.d.ts

@@ -40,4 +40,4 @@ export interface BaseDialogProps {
      */
     [p: string]: any;
 }
-export default function BaseDialog(props: BaseDialogProps): JSX.Element;
+export default function BaseDialog(props: BaseDialogProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,4 +1,4 @@
 export interface CalendarProps {
     day: number;
 }
-export default function Calendar(props: CalendarProps): JSX.Element;
+export default function Calendar(props: CalendarProps): import("react/jsx-runtime").JSX.Element;

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

@@ -15,7 +15,7 @@ const classes = {
 const Root = (0, material_1.styled)(material_1.TextField, {
     name: PREFIX,
     slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
+    overridesResolver: (_props, styles) => styles.root
 })(({ theme }) => ({
     [`& .${classes.btnCopy}`]: {
         color: theme.palette.secondary.main
@@ -66,11 +66,18 @@ function CopyTextField(inProps) {
     };
     const button = ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ "aria-label": "Copy text", edge: "end", onClick: () => handleCopy(value), className: classes.btnCopy }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "insert_link" }) })));
     // RENDER
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), label: label ? label : (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.copyTextField.textToCopy", defaultMessage: "ui.shared.copyTextField.textToCopy" }), margin: "normal", variant: "outlined", disabled: true, fullWidth: true, value: value, multiline: true, onChange: handleChange, InputProps: {
-            disableUnderline: true,
-            endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: openConfirm ? ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ open: openConfirm, PopperProps: { open: true }, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.copyTextField.textCopied", defaultMessage: "ui.shared.copyTextField.textCopied" }) }, { children: button }))) : ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.copyTextField.textToCopy", defaultMessage: "ui.shared.copyTextField.textToCopy" }) }, { children: button }))) })))
-        }, InputLabelProps: {
-            shrink: true
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), label: label ? label : (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.copyTextField.textToCopy", defaultMessage: "ui.shared.copyTextField.textToCopy" }), margin: "normal", variant: "outlined", disabled: true, fullWidth: true, value: value, multiline: true, onChange: handleChange, slotProps: {
+            input: {
+                disableUnderline: true,
+                endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: openConfirm ? ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ open: openConfirm, slotProps: {
+                            popper: {
+                                open: true
+                            }
+                        }, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.copyTextField.textCopied", defaultMessage: "ui.shared.copyTextField.textCopied" }) }, { children: button }))) : ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.copyTextField.textToCopy", defaultMessage: "ui.shared.copyTextField.textToCopy" }) }, { children: button }))) })))
+            },
+            inputLabel: {
+                shrink: true
+            }
         } }, rest)));
 }
 exports.default = CopyTextField;

package/lib/cjs/shared/CourseTypePopover/CourseTypePopover.d.ts

@@ -4,6 +4,6 @@ export interface CourseTypePopoverProps {
     course: SCCourseType;
     className?: HTMLAttributes<HTMLDivElement>['className'];
 }
-declare function CourseTypePopover(props: CourseTypePopoverProps): JSX.Element;
+declare function CourseTypePopover(props: CourseTypePopoverProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof CourseTypePopover>;
 export default _default;

package/lib/cjs/shared/CourseUsersTable/ChangeUsersStatus.d.ts

@@ -4,6 +4,6 @@ interface ChangeUserStatusProps {
     course: SCCourseType;
     user: SCUserType;
 }
-declare function ChangeUserStatus(props: ChangeUserStatusProps): JSX.Element;
+declare function ChangeUserStatus(props: ChangeUserStatusProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof ChangeUserStatus>;
 export default _default;

package/lib/cjs/shared/CourseUsersTable/CourseUsersTable.d.ts

@@ -2,7 +2,7 @@ import { Dispatch } from 'react';
 import { SCCourseType } from '@selfcommunity/types';
 import { EndpointType } from '@selfcommunity/api-services';
 import { SCCourseUsersTableModeType } from '../../types/course';
-declare type HeaderCellsType = {
+type HeaderCellsType = {
     id?: string;
 };
 export interface CourseUsersTableProps {
@@ -16,6 +16,6 @@ export interface CourseUsersTableProps {
     emptyStatusTitle: string;
     emptyStatusDescription?: string;
 }
-declare function CourseUsersTable(inProps: CourseUsersTableProps): JSX.Element;
+declare function CourseUsersTable(inProps: CourseUsersTableProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof CourseUsersTable>;
 export default _default;

package/lib/cjs/shared/CourseUsersTable/CourseUsersTable.js

@@ -139,9 +139,11 @@ function CourseUsersTable(inProps) {
     return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, { children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { ref: inputRef, placeholder: intl.formatMessage({
                     id: 'ui.courseUsersTable.searchBar.placeholder',
                     defaultMessage: 'ui.courseUsersTable.searchBar.placeholder'
-                }), InputProps: {
-                    startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }) }))),
-                    endAdornment: value.length > 0 ? ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.endAdornmentWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ color: "inherit", onClick: handleSearchClear }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) })) })), (0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ color: "primary", variant: "contained", onClick: handleSearchStart, loading: loadingSearch, disabled: loadingSearch, className: classes.searchButton }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }) })) }))] }))) : undefined
+                }), slotProps: {
+                    input: {
+                        startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }) }))),
+                        endAdornment: value.length > 0 ? ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.endAdornmentWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ color: "inherit", onClick: handleSearchClear }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) })) })), (0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ color: "primary", variant: "contained", onClick: handleSearchStart, loading: loadingSearch, disabled: loadingSearch, className: classes.searchButton }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }) })) }))] }))) : undefined
+                    }
                 }, value: value, onChange: handleChange, disabled: users.length === 0 && value.length === 0, fullWidth: true, className: classes.search }), (0, jsx_runtime_1.jsx)(material_1.TableContainer, { children: (0, jsx_runtime_1.jsxs)(material_1.Table, { children: [(0, jsx_runtime_1.jsx)(material_1.TableHead, { children: (0, jsx_runtime_1.jsx)(material_1.TableRow, { children: headerCells.map((cell, i, array) => {
                                     if (i === array.length - 1) {
                                         return (0, jsx_runtime_1.jsx)(material_1.TableCell, { width: "14%" }, i);

package/lib/cjs/shared/CourseUsersTable/RowSkeleton.d.ts

@@ -4,5 +4,5 @@ interface CourseUsersTableRowSkeletonProps {
     animation?: SkeletonOwnProps['animation'];
     editMode?: boolean;
 }
-export default function CourseUsersTableRowSkeleton(props: CourseUsersTableRowSkeletonProps): JSX.Element;
+export default function CourseUsersTableRowSkeleton(props: CourseUsersTableRowSkeletonProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/cjs/shared/CourseUsersTable/SeeProgressButton.d.ts

@@ -4,6 +4,6 @@ interface SeeProgressButtonProps {
     course: SCCourseType;
     user: SCUserType;
 }
-declare function SeeProgressButton(props: SeeProgressButtonProps): JSX.Element;
+declare function SeeProgressButton(props: SeeProgressButtonProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof SeeProgressButton>;
 export default _default;

package/lib/cjs/shared/CourseUsersTable/Skeleton.d.ts

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

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

@@ -13,7 +13,7 @@ const classes = {
 const Root = (0, material_1.styled)(material_1.Box, {
     name: PREFIX,
     slot: 'Root',
-    overridesResolver: (props, styles) => [styles.root]
+    overridesResolver: (_props, styles) => [styles.root]
 })(() => ({
     width: 'auto',
     display: 'inline-flex',
@@ -37,7 +37,7 @@ function DateTimeAgo(props) {
      */
     if (date) {
         const formattedDate = (0, formatRelativeTime_1.getRelativeTime)(date);
-        return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ component: "span", className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [showStartIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "access_time" }), (0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: `${intl.formatDate(date, { year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric' })}`, enterTouchDelay: 0 }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: 'body2', component: 'span' }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedRelativeTime, { value: -formattedDate.value, unit: formattedDate.unit, numeric: "auto" }) })) }))] })));
+        return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ as: "span", className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [showStartIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "access_time" }), (0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: `${intl.formatDate(date, { year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric' })}`, enterTouchDelay: 0 }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: 'body2', component: 'span' }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedRelativeTime, { value: -formattedDate.value, unit: formattedDate.unit, numeric: "auto" }) })) }))] })));
     }
     return null;
 }

package/lib/cjs/shared/EmptyStatus/EmptyStatus.d.ts

@@ -6,6 +6,6 @@ export interface EmptyStatusProps {
     actions?: ReactNode;
     className?: HTMLAttributes<HTMLDivElement>['className'];
 }
-declare function EmptyStatus(props: EmptyStatusProps): JSX.Element;
+declare function EmptyStatus(props: EmptyStatusProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof EmptyStatus>;
 export default _default;

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

@@ -165,6 +165,14 @@ function EventActionsMenu(inProps) {
     if (!scEvent) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { onClick: handleOpen }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "more_vert" }) })), isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, PaperProps: { className: classes.paper }, disableSwipeToOpen: true }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: renderList() }) }))) : ((0, jsx_runtime_1.jsx)(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, PaperProps: { className: classes.paper } }, { children: renderList() }))), openConfirmDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: openConfirmDialog, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.msg", defaultMessage: "ui.shared.eventActionsMenu.dialog.msg" }), btnConfirm: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.confirm", defaultMessage: "ui.shared.eventActionsMenu.dialog.confirm" }), onConfirm: handleDeleteThread, onClose: handleCloseDialog })), openEdit && (0, jsx_runtime_1.jsx)(EventForm_1.default, { onClose: handleEditClick, event: scEvent, onSuccess: handleEditSuccess })] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { onClick: handleOpen }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "more_vert" }) })), isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, slotProps: {
+                    paper: {
+                        className: classes.paper
+                    }
+                }, disableSwipeToOpen: true }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: renderList() }) }))) : ((0, jsx_runtime_1.jsx)(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, slotProps: {
+                    paper: {
+                        className: classes.paper
+                    }
+                } }, { children: renderList() }))), openConfirmDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: openConfirmDialog, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.msg", defaultMessage: "ui.shared.eventActionsMenu.dialog.msg" }), btnConfirm: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.confirm", defaultMessage: "ui.shared.eventActionsMenu.dialog.confirm" }), onConfirm: handleDeleteThread, onClose: handleCloseDialog })), openEdit && (0, jsx_runtime_1.jsx)(EventForm_1.default, { onClose: handleEditClick, event: scEvent, onSuccess: handleEditSuccess })] }));
 }
 exports.default = EventActionsMenu;

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

@@ -20,4 +20,4 @@ export interface EventInfoDetailsProps {
     beforeLocationInfo?: ReactNode | null;
     beforeCreatedInfo?: ReactNode | null;
 }
-export default function EventInfoDetails(inProps: EventInfoDetailsProps): JSX.Element;
+export default function EventInfoDetails(inProps: EventInfoDetailsProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,5 +1,5 @@
 import { Component, ReactNode, CSSProperties } from 'react';
-declare type Fn = () => any;
+type Fn = () => any;
 export interface InfiniteScrollProps {
     next?: Fn;
     hasMoreNext?: boolean;
@@ -62,6 +62,6 @@ declare class InfiniteScroll extends Component<InfiniteScrollProps, State> {
     isElementAtTop(target: HTMLElement, scrollThreshold?: string | number): boolean;
     isElementAtBottom(target: HTMLElement, scrollThreshold?: string | number): boolean;
     onScrollListener: (event: MouseEvent) => void;
-    render(): JSX.Element;
+    render(): import("react/jsx-runtime").JSX.Element;
 }
 export default InfiniteScroll;

package/lib/cjs/shared/InfiniteScroll/stories/InfiniteScrollWithHeight.d.ts

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

package/lib/cjs/shared/InfiniteScroll/stories/PullDownToRefreshInfScroll.d.ts

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

package/lib/cjs/shared/InfiniteScroll/stories/ScrollableTargetFixedInfScroll.d.ts

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

package/lib/cjs/shared/InfiniteScroll/stories/ScrollableTargetInfScroll.d.ts

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

package/lib/cjs/shared/InfiniteScroll/stories/ScrolleableTop.d.ts

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

package/lib/cjs/shared/InfiniteScroll/stories/WindowInfiniteScrollComponent.d.ts

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