@selfcommunity/react-ui 0.10.4-alpha.0 → 0.10.4-alpha.1

package/lib/cjs/components/Composer/Composer.js

@@ -30,6 +30,7 @@ const Attributes_1 = tslib_1.__importDefault(require("./Attributes"));
 const constants_1 = require("./constants");
 const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
 const CloseLayer_1 = tslib_1.__importDefault(require("./Layer/CloseLayer"));
+const BackdropScrollDisabled_1 = tslib_1.__importDefault(require("../../shared/BackdropScrollDisabled"));
 const DialogTransition = (0, react_1.forwardRef)(function Transition(props, ref) {
     return (0, jsx_runtime_1.jsx)(material_1.Fade, Object.assign({ ref: ref }, props));
 });
@@ -566,7 +567,7 @@ function Composer(inProps) {
     if (!scUserContext.user && !(scUserContext.loading && open)) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ ref: dialogRef, TransitionComponent: DialogTransition, keepMounted: true, onClose: handleClose }, rest, { className: (0, classnames_1.default)(classes.root, { [classes.ios]: isIOS }), scroll: "body", fullScreen: fullScreen, tabIndex: -1 }, { children: [(0, jsx_runtime_1.jsxs)("form", Object.assign({ onSubmit: handleSubmit, method: "post" }, { children: [(0, jsx_runtime_1.jsxs)(material_1.DialogTitle, Object.assign({ className: classes.title }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handleClosePrompt }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "close" }) })), (0, jsx_runtime_1.jsx)(LoadingButton_1.default, Object.assign({ size: "small", type: "submit", color: "secondary", variant: "contained", disabled: !canSubmit, loading: isSubmitting }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.submit", defaultMessage: "ui.composer.submit" }) }))] })), (0, jsx_runtime_1.jsxs)(material_1.DialogContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(Attributes_1.default, { value: { categories, event, group, addressing, location }, className: classes.attributes, onChange: handleChangeAttributes, onClick: handleClickAttributes }), content, medias && medias.length > 0 && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.medias }, { children: mediaObjectTypes.map((mediaObjectType) => {
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ ref: dialogRef, TransitionComponent: DialogTransition, BackdropComponent: BackdropScrollDisabled_1.default, keepMounted: true, onClose: handleClose }, rest, { className: (0, classnames_1.default)(classes.root, { [classes.ios]: isIOS }), scroll: "body", fullScreen: fullScreen, tabIndex: -1 }, { children: [(0, jsx_runtime_1.jsxs)("form", Object.assign({ onSubmit: handleSubmit, method: "post" }, { children: [(0, jsx_runtime_1.jsxs)(material_1.DialogTitle, Object.assign({ className: classes.title }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handleClosePrompt }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "close" }) })), (0, jsx_runtime_1.jsx)(LoadingButton_1.default, Object.assign({ size: "small", type: "submit", color: "secondary", variant: "contained", disabled: !canSubmit, loading: isSubmitting }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.submit", defaultMessage: "ui.composer.submit" }) }))] })), (0, jsx_runtime_1.jsxs)(material_1.DialogContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(Attributes_1.default, { value: { categories, event, group, addressing, location }, className: classes.attributes, onChange: handleChangeAttributes, onClick: handleClickAttributes }), content, medias && medias.length > 0 && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.medias }, { children: mediaObjectTypes.map((mediaObjectType) => {
                                     if (mediaObjectType.previewComponent) {
                                         return (0, jsx_runtime_1.jsx)(mediaObjectType.previewComponent, { value: medias, onChange: handleChangeMedias }, mediaObjectType.name);
                                     }

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

@@ -0,0 +1,5 @@
+import { BackdropProps } from '@mui/material';
+/**
+ * Prevents scrolling of content behind the backdrop
+ */
+export default function BackdropScrollDisabled(props: BackdropProps): JSX.Element;

package/lib/cjs/shared/BackdropScrollDisabled/BackdropScrollDisabled.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+/**
+ * Prevents scrolling of content behind the backdrop
+ */
+function BackdropScrollDisabled(props) {
+    const onTouchMove = (event) => {
+        event.preventDefault();
+    };
+    return (0, jsx_runtime_1.jsx)(material_1.Backdrop, Object.assign({}, props, { onTouchMove: onTouchMove }));
+}
+exports.default = BackdropScrollDisabled;

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

@@ -0,0 +1,2 @@
+import BackdropScrollDisabled from './BackdropScrollDisabled';
+export default BackdropScrollDisabled;

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

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const BackdropScrollDisabled_1 = tslib_1.__importDefault(require("./BackdropScrollDisabled"));
+exports.default = BackdropScrollDisabled_1.default;

package/lib/esm/components/Composer/Composer.js

@@ -28,6 +28,7 @@ import Attributes from './Attributes';
 import { PREFIX } from './constants';
 import ComposerSkeleton from './Skeleton';
 import CloseLayer from './Layer/CloseLayer';
+import BackdropScrollDisabled from '../../shared/BackdropScrollDisabled';
 const DialogTransition = forwardRef(function Transition(props, ref) {
     return _jsx(Fade, Object.assign({ ref: ref }, props));
 });
@@ -564,7 +565,7 @@ export default function Composer(inProps) {
     if (!scUserContext.user && !(scUserContext.loading && open)) {
         return null;
     }
-    return (_jsxs(Root, Object.assign({ ref: dialogRef, TransitionComponent: DialogTransition, keepMounted: true, onClose: handleClose }, rest, { className: classNames(classes.root, { [classes.ios]: isIOS }), scroll: "body", fullScreen: fullScreen, tabIndex: -1 }, { children: [_jsxs("form", Object.assign({ onSubmit: handleSubmit, method: "post" }, { children: [_jsxs(DialogTitle, Object.assign({ className: classes.title }, { children: [_jsx(IconButton, Object.assign({ onClick: handleClosePrompt }, { children: _jsx(Icon, { children: "close" }) })), _jsx(LoadingButton, Object.assign({ size: "small", type: "submit", color: "secondary", variant: "contained", disabled: !canSubmit, loading: isSubmitting }, { children: _jsx(FormattedMessage, { id: "ui.composer.submit", defaultMessage: "ui.composer.submit" }) }))] })), _jsxs(DialogContent, Object.assign({ className: classes.content }, { children: [_jsx(Attributes, { value: { categories, event, group, addressing, location }, className: classes.attributes, onChange: handleChangeAttributes, onClick: handleClickAttributes }), content, medias && medias.length > 0 && (_jsx(Box, Object.assign({ className: classes.medias }, { children: mediaObjectTypes.map((mediaObjectType) => {
+    return (_jsxs(Root, Object.assign({ ref: dialogRef, TransitionComponent: DialogTransition, BackdropComponent: BackdropScrollDisabled, keepMounted: true, onClose: handleClose }, rest, { className: classNames(classes.root, { [classes.ios]: isIOS }), scroll: "body", fullScreen: fullScreen, tabIndex: -1 }, { children: [_jsxs("form", Object.assign({ onSubmit: handleSubmit, method: "post" }, { children: [_jsxs(DialogTitle, Object.assign({ className: classes.title }, { children: [_jsx(IconButton, Object.assign({ onClick: handleClosePrompt }, { children: _jsx(Icon, { children: "close" }) })), _jsx(LoadingButton, Object.assign({ size: "small", type: "submit", color: "secondary", variant: "contained", disabled: !canSubmit, loading: isSubmitting }, { children: _jsx(FormattedMessage, { id: "ui.composer.submit", defaultMessage: "ui.composer.submit" }) }))] })), _jsxs(DialogContent, Object.assign({ className: classes.content }, { children: [_jsx(Attributes, { value: { categories, event, group, addressing, location }, className: classes.attributes, onChange: handleChangeAttributes, onClick: handleClickAttributes }), content, medias && medias.length > 0 && (_jsx(Box, Object.assign({ className: classes.medias }, { children: mediaObjectTypes.map((mediaObjectType) => {
                                     if (mediaObjectType.previewComponent) {
                                         return _jsx(mediaObjectType.previewComponent, { value: medias, onChange: handleChangeMedias }, mediaObjectType.name);
                                     }

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

@@ -0,0 +1,5 @@
+import { BackdropProps } from '@mui/material';
+/**
+ * Prevents scrolling of content behind the backdrop
+ */
+export default function BackdropScrollDisabled(props: BackdropProps): JSX.Element;

package/lib/esm/shared/BackdropScrollDisabled/BackdropScrollDisabled.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Backdrop } from '@mui/material';
+/**
+ * Prevents scrolling of content behind the backdrop
+ */
+export default function BackdropScrollDisabled(props) {
+    const onTouchMove = (event) => {
+        event.preventDefault();
+    };
+    return _jsx(Backdrop, Object.assign({}, props, { onTouchMove: onTouchMove }));
+}

package/lib/esm/shared/BackdropScrollDisabled/index.d.ts

@@ -0,0 +1,2 @@
+import BackdropScrollDisabled from './BackdropScrollDisabled';
+export default BackdropScrollDisabled;

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

@@ -0,0 +1,2 @@
+import BackdropScrollDisabled from './BackdropScrollDisabled';
+export default BackdropScrollDisabled;