@alfalab/core-components-universal-modal 3.2.1-alfasans → 3.2.2-alfasans
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/base-content/index.css +2 -3
- package/components/base-content/index.module.css.js +1 -1
- package/components/base-footer/index.css +5 -7
- package/components/base-footer/index.module.css.js +1 -1
- package/components/base-header/index.css +4 -4
- package/components/base-header/index.module.css.js +1 -1
- package/cssm/components/base-content/index.module.css +1 -2
- package/cssm/components/base-footer/index.module.css +2 -4
- package/cssm/desktop/components/center-modal/center-modal.js +2 -1
- package/cssm/desktop/components/center-modal/center-modal.js.map +1 -1
- package/cssm/desktop/components/center-modal/index.module.css +1 -2
- package/cssm/desktop/components/footer/layout.module.css +3 -6
- package/cssm/desktop/components/header/desktop.module.css +3 -6
- package/cssm/desktop/components/side-modal/index.module.css +1 -2
- package/cssm/desktop/components/side-modal/side-modal.js +2 -1
- package/cssm/desktop/components/side-modal/side-modal.js.map +1 -1
- package/cssm/desktop/utils/get-hug-content-styles.d.ts +8 -0
- package/cssm/desktop/utils/get-hug-content-styles.js +19 -0
- package/cssm/desktop/utils/get-hug-content-styles.js.map +1 -0
- package/cssm/desktop/utils/get-margin-styles.d.ts +0 -1
- package/cssm/desktop/utils/get-margin-styles.js +8 -14
- package/cssm/desktop/utils/get-margin-styles.js.map +1 -1
- package/cssm/mobile/components/content/index.module.css +1 -2
- package/cssm/mobile/components/footer/index.module.css +1 -2
- package/cssm/mobile/components/footer/layout.mobile.module.css +1 -2
- package/cssm/mobile/components/header/index.module.css +4 -8
- package/desktop/components/center-modal/center-modal.js +2 -1
- package/desktop/components/center-modal/center-modal.js.map +1 -1
- package/desktop/components/center-modal/index.css +784 -785
- package/desktop/components/center-modal/index.module.css.js +1 -1
- package/desktop/components/center-modal/transitions/safari-transitions.css +7 -7
- package/desktop/components/center-modal/transitions/safari-transitions.module.css.js +1 -1
- package/desktop/components/center-modal/transitions/transitions.css +7 -7
- package/desktop/components/center-modal/transitions/transitions.module.css.js +1 -1
- package/desktop/components/footer/desktop.css +1 -1
- package/desktop/components/footer/desktop.module.css.js +1 -1
- package/desktop/components/footer/layout.css +12 -15
- package/desktop/components/footer/layout.module.css.js +1 -1
- package/desktop/components/header/desktop.css +8 -11
- package/desktop/components/header/desktop.module.css.js +1 -1
- package/desktop/components/modal-content/modal-content.css +4 -4
- package/desktop/components/modal-content/modal-content.module.css.js +1 -1
- package/desktop/components/side-modal/index.css +786 -787
- package/desktop/components/side-modal/index.module.css.js +1 -1
- package/desktop/components/side-modal/side-modal.js +2 -1
- package/desktop/components/side-modal/side-modal.js.map +1 -1
- package/desktop/components/side-modal/transitions/transitions.css +71 -71
- package/desktop/components/side-modal/transitions/transitions.module.css.js +1 -1
- package/desktop/styles/transitions/full-size-backdrop-transitions.css +13 -13
- package/desktop/styles/transitions/full-size-backdrop-transitions.module.css.js +1 -1
- package/desktop/styles/transitions/full-size-vertical-bottom-transitions.css +7 -7
- package/desktop/styles/transitions/full-size-vertical-bottom-transitions.module.css.js +1 -1
- package/desktop/styles/transitions/full-size-vertical-center-transitions.css +7 -7
- package/desktop/styles/transitions/full-size-vertical-center-transitions.module.css.js +1 -1
- package/desktop/styles/transitions/full-size-vertical-top-transitions.css +7 -7
- package/desktop/styles/transitions/full-size-vertical-top-transitions.module.css.js +1 -1
- package/desktop/utils/get-hug-content-styles.d.ts +8 -0
- package/desktop/utils/get-hug-content-styles.js +19 -0
- package/desktop/utils/get-hug-content-styles.js.map +1 -0
- package/desktop/utils/get-margin-styles.d.ts +0 -1
- package/desktop/utils/get-margin-styles.js +8 -14
- package/desktop/utils/get-margin-styles.js.map +1 -1
- package/esm/components/base-content/index.css +2 -3
- package/esm/components/base-content/index.module.css.js +1 -1
- package/esm/components/base-footer/index.css +5 -7
- package/esm/components/base-footer/index.module.css.js +1 -1
- package/esm/components/base-header/index.css +4 -4
- package/esm/components/base-header/index.module.css.js +1 -1
- package/esm/desktop/components/center-modal/center-modal.js +2 -1
- package/esm/desktop/components/center-modal/center-modal.js.map +1 -1
- package/esm/desktop/components/center-modal/index.css +784 -785
- package/esm/desktop/components/center-modal/index.module.css.js +1 -1
- package/esm/desktop/components/center-modal/transitions/safari-transitions.css +7 -7
- package/esm/desktop/components/center-modal/transitions/safari-transitions.module.css.js +1 -1
- package/esm/desktop/components/center-modal/transitions/transitions.css +7 -7
- package/esm/desktop/components/center-modal/transitions/transitions.module.css.js +1 -1
- package/esm/desktop/components/footer/desktop.css +1 -1
- package/esm/desktop/components/footer/desktop.module.css.js +1 -1
- package/esm/desktop/components/footer/layout.css +12 -15
- package/esm/desktop/components/footer/layout.module.css.js +1 -1
- package/esm/desktop/components/header/desktop.css +8 -11
- package/esm/desktop/components/header/desktop.module.css.js +1 -1
- package/esm/desktop/components/modal-content/modal-content.css +4 -4
- package/esm/desktop/components/modal-content/modal-content.module.css.js +1 -1
- package/esm/desktop/components/side-modal/index.css +786 -787
- package/esm/desktop/components/side-modal/index.module.css.js +1 -1
- package/esm/desktop/components/side-modal/side-modal.js +2 -1
- package/esm/desktop/components/side-modal/side-modal.js.map +1 -1
- package/esm/desktop/components/side-modal/transitions/transitions.css +71 -71
- package/esm/desktop/components/side-modal/transitions/transitions.module.css.js +1 -1
- package/esm/desktop/styles/transitions/full-size-backdrop-transitions.css +13 -13
- package/esm/desktop/styles/transitions/full-size-backdrop-transitions.module.css.js +1 -1
- package/esm/desktop/styles/transitions/full-size-vertical-bottom-transitions.css +7 -7
- package/esm/desktop/styles/transitions/full-size-vertical-bottom-transitions.module.css.js +1 -1
- package/esm/desktop/styles/transitions/full-size-vertical-center-transitions.css +7 -7
- package/esm/desktop/styles/transitions/full-size-vertical-center-transitions.module.css.js +1 -1
- package/esm/desktop/styles/transitions/full-size-vertical-top-transitions.css +7 -7
- package/esm/desktop/styles/transitions/full-size-vertical-top-transitions.module.css.js +1 -1
- package/esm/desktop/utils/get-hug-content-styles.d.ts +8 -0
- package/esm/desktop/utils/get-hug-content-styles.js +15 -0
- package/esm/desktop/utils/get-hug-content-styles.js.map +1 -0
- package/esm/desktop/utils/get-margin-styles.d.ts +0 -1
- package/esm/desktop/utils/get-margin-styles.js +8 -14
- package/esm/desktop/utils/get-margin-styles.js.map +1 -1
- package/esm/mobile/components/content/index.css +4 -5
- package/esm/mobile/components/content/index.module.css.js +1 -1
- package/esm/mobile/components/footer/index.css +3 -4
- package/esm/mobile/components/footer/index.module.css.js +1 -1
- package/esm/mobile/components/footer/layout.mobile.css +10 -11
- package/esm/mobile/components/footer/layout.mobile.module.css.js +1 -1
- package/esm/mobile/components/header/index.css +7 -11
- package/esm/mobile/components/header/index.module.css.js +1 -1
- package/esm/mobile/mobile.css +3 -3
- package/esm/mobile/mobile.module.css.js +1 -1
- package/esm/mobile/transitions/right-side-transitions.mobile.css +7 -7
- package/esm/mobile/transitions/right-side-transitions.mobile.module.css.js +1 -1
- package/esm/mobile/transitions/transitions.mobile.css +7 -7
- package/esm/mobile/transitions/transitions.mobile.module.css.js +1 -1
- package/mobile/components/content/index.css +4 -5
- package/mobile/components/content/index.module.css.js +1 -1
- package/mobile/components/footer/index.css +3 -4
- package/mobile/components/footer/index.module.css.js +1 -1
- package/mobile/components/footer/layout.mobile.css +10 -11
- package/mobile/components/footer/layout.mobile.module.css.js +1 -1
- package/mobile/components/header/index.css +7 -11
- package/mobile/components/header/index.module.css.js +1 -1
- package/mobile/mobile.css +3 -3
- package/mobile/mobile.module.css.js +1 -1
- package/mobile/transitions/right-side-transitions.mobile.css +7 -7
- package/mobile/transitions/right-side-transitions.mobile.module.css.js +1 -1
- package/mobile/transitions/transitions.mobile.css +7 -7
- package/mobile/transitions/transitions.mobile.module.css.js +1 -1
- package/modern/components/base-content/index.css +2 -3
- package/modern/components/base-content/index.module.css.js +1 -1
- package/modern/components/base-footer/index.css +5 -7
- package/modern/components/base-footer/index.module.css.js +1 -1
- package/modern/components/base-header/index.css +4 -4
- package/modern/components/base-header/index.module.css.js +1 -1
- package/modern/desktop/components/center-modal/center-modal.js +3 -1
- package/modern/desktop/components/center-modal/center-modal.js.map +1 -1
- package/modern/desktop/components/center-modal/index.css +784 -785
- package/modern/desktop/components/center-modal/index.module.css.js +1 -1
- package/modern/desktop/components/center-modal/transitions/safari-transitions.css +7 -7
- package/modern/desktop/components/center-modal/transitions/safari-transitions.module.css.js +1 -1
- package/modern/desktop/components/center-modal/transitions/transitions.css +7 -7
- package/modern/desktop/components/center-modal/transitions/transitions.module.css.js +1 -1
- package/modern/desktop/components/footer/desktop.css +1 -1
- package/modern/desktop/components/footer/desktop.module.css.js +1 -1
- package/modern/desktop/components/footer/layout.css +12 -15
- package/modern/desktop/components/footer/layout.module.css.js +1 -1
- package/modern/desktop/components/header/desktop.css +8 -11
- package/modern/desktop/components/header/desktop.module.css.js +1 -1
- package/modern/desktop/components/modal-content/modal-content.css +4 -4
- package/modern/desktop/components/modal-content/modal-content.module.css.js +1 -1
- package/modern/desktop/components/side-modal/index.css +786 -787
- package/modern/desktop/components/side-modal/index.module.css.js +1 -1
- package/modern/desktop/components/side-modal/side-modal.js +3 -1
- package/modern/desktop/components/side-modal/side-modal.js.map +1 -1
- package/modern/desktop/components/side-modal/transitions/transitions.css +71 -71
- package/modern/desktop/components/side-modal/transitions/transitions.module.css.js +1 -1
- package/modern/desktop/styles/transitions/full-size-backdrop-transitions.css +13 -13
- package/modern/desktop/styles/transitions/full-size-backdrop-transitions.module.css.js +1 -1
- package/modern/desktop/styles/transitions/full-size-vertical-bottom-transitions.css +7 -7
- package/modern/desktop/styles/transitions/full-size-vertical-bottom-transitions.module.css.js +1 -1
- package/modern/desktop/styles/transitions/full-size-vertical-center-transitions.css +7 -7
- package/modern/desktop/styles/transitions/full-size-vertical-center-transitions.module.css.js +1 -1
- package/modern/desktop/styles/transitions/full-size-vertical-top-transitions.css +7 -7
- package/modern/desktop/styles/transitions/full-size-vertical-top-transitions.module.css.js +1 -1
- package/modern/desktop/utils/get-hug-content-styles.d.ts +8 -0
- package/modern/desktop/utils/get-hug-content-styles.js +17 -0
- package/modern/desktop/utils/get-hug-content-styles.js.map +1 -0
- package/modern/desktop/utils/get-margin-styles.d.ts +0 -1
- package/modern/desktop/utils/get-margin-styles.js +11 -13
- package/modern/desktop/utils/get-margin-styles.js.map +1 -1
- package/modern/mobile/components/content/index.css +4 -5
- package/modern/mobile/components/content/index.module.css.js +1 -1
- package/modern/mobile/components/footer/index.css +3 -4
- package/modern/mobile/components/footer/index.module.css.js +1 -1
- package/modern/mobile/components/footer/layout.mobile.css +10 -11
- package/modern/mobile/components/footer/layout.mobile.module.css.js +1 -1
- package/modern/mobile/components/header/index.css +7 -11
- package/modern/mobile/components/header/index.module.css.js +1 -1
- package/modern/mobile/mobile.css +3 -3
- package/modern/mobile/mobile.module.css.js +1 -1
- package/modern/mobile/transitions/right-side-transitions.mobile.css +7 -7
- package/modern/mobile/transitions/right-side-transitions.mobile.module.css.js +1 -1
- package/modern/mobile/transitions/transitions.mobile.css +7 -7
- package/modern/mobile/transitions/transitions.mobile.module.css.js +1 -1
- package/moderncssm/desktop/components/center-modal/center-modal.js +3 -1
- package/moderncssm/desktop/components/center-modal/center-modal.js.map +1 -1
- package/moderncssm/desktop/components/side-modal/side-modal.js +3 -1
- package/moderncssm/desktop/components/side-modal/side-modal.js.map +1 -1
- package/moderncssm/desktop/utils/get-hug-content-styles.d.ts +8 -0
- package/moderncssm/desktop/utils/get-hug-content-styles.js +17 -0
- package/moderncssm/desktop/utils/get-hug-content-styles.js.map +1 -0
- package/moderncssm/desktop/utils/get-margin-styles.d.ts +0 -1
- package/moderncssm/desktop/utils/get-margin-styles.js +11 -13
- package/moderncssm/desktop/utils/get-margin-styles.js.map +1 -1
- package/package.json +8 -8
- package/src/desktop/components/center-modal/center-modal.tsx +3 -1
- package/src/desktop/components/side-modal/side-modal.tsx +3 -1
- package/src/desktop/utils/get-hug-content-styles.ts +24 -0
- package/src/desktop/utils/get-margin-styles.ts +11 -16
|
@@ -3,17 +3,15 @@
|
|
|
3
3
|
--color-light-neutral-300: #e7e8eb;
|
|
4
4
|
}
|
|
5
5
|
:root {
|
|
6
|
-
--gap-
|
|
7
|
-
--gap-
|
|
8
|
-
--gap-16: var(--gap-m);
|
|
9
|
-
--gap-32: var(--gap-2xl);
|
|
6
|
+
--gap-16: 16px;
|
|
7
|
+
--gap-32: 32px;
|
|
10
8
|
}
|
|
11
9
|
:root {
|
|
12
10
|
--universal-modal-footer-background: var(--color-light-modal-bg-primary);
|
|
13
11
|
--universal-modal-footer-highlight-background: var(--color-light-modal-bg-primary);
|
|
14
12
|
--universal-modal-footer-highlight-box-shadow: 0 -1px 0 0 var(--color-light-neutral-300);
|
|
15
13
|
}
|
|
16
|
-
.universal-
|
|
14
|
+
.universal-modal__footer_46wrl {
|
|
17
15
|
width: 100%;
|
|
18
16
|
box-sizing: border-box;
|
|
19
17
|
transition:
|
|
@@ -21,12 +19,12 @@
|
|
|
21
19
|
background 0.2s ease;
|
|
22
20
|
padding: var(--gap-16) var(--gap-32) var(--gap-32);
|
|
23
21
|
}
|
|
24
|
-
.universal-
|
|
22
|
+
.universal-modal__sticky_46wrl {
|
|
25
23
|
background: var(--universal-modal-footer-background);
|
|
26
24
|
position: sticky;
|
|
27
25
|
z-index: 1;
|
|
28
26
|
}
|
|
29
|
-
.universal-
|
|
27
|
+
.universal-modal__highlighted_46wrl {
|
|
30
28
|
background: var(--universal-modal-footer-highlight-background);
|
|
31
29
|
box-shadow: var(--universal-modal-footer-highlight-box-shadow);
|
|
32
30
|
}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
require('./index.css');
|
|
4
4
|
|
|
5
|
-
var styles = {"footer":"universal-
|
|
5
|
+
var styles = {"footer":"universal-modal__footer_46wrl","sticky":"universal-modal__sticky_46wrl","highlighted":"universal-modal__highlighted_46wrl"};
|
|
6
6
|
|
|
7
7
|
module.exports = styles;
|
|
8
8
|
//# sourceMappingURL=index.module.css.js.map
|
|
@@ -10,22 +10,22 @@
|
|
|
10
10
|
--universal-modal-header-highlight-background: var(--color-light-modal-bg-primary);
|
|
11
11
|
--universal-modal-header-highlight-box-shadow: 0 1px 0 0 var(--color-light-neutral-300);
|
|
12
12
|
}
|
|
13
|
-
.universal-
|
|
13
|
+
.universal-modal__header_19f9y {
|
|
14
14
|
width: 100%;
|
|
15
15
|
box-sizing: border-box;
|
|
16
16
|
transition:
|
|
17
17
|
box-shadow 0.2s ease,
|
|
18
18
|
background 0.2s ease;
|
|
19
19
|
}
|
|
20
|
-
.universal-
|
|
20
|
+
.universal-modal__header_19f9y.universal-modal__highlighted_19f9y {
|
|
21
21
|
background: var(--universal-modal-header-highlight-background);
|
|
22
22
|
box-shadow: var(--universal-modal-header-highlight-box-shadow);
|
|
23
23
|
}
|
|
24
|
-
.universal-
|
|
24
|
+
.universal-modal__header_19f9y.universal-modal__sticky_19f9y {
|
|
25
25
|
position: sticky;
|
|
26
26
|
top: var(--gap-0);
|
|
27
27
|
z-index: 1;
|
|
28
28
|
}
|
|
29
|
-
.universal-
|
|
29
|
+
.universal-modal__header_19f9y.universal-modal__sticky_19f9y.universal-modal__hasContent_19f9y {
|
|
30
30
|
background: var(--universal-modal-header-background);
|
|
31
31
|
}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
require('./index.css');
|
|
4
4
|
|
|
5
|
-
var styles = {"header":"universal-
|
|
5
|
+
var styles = {"header":"universal-modal__header_19f9y","highlighted":"universal-modal__highlighted_19f9y","sticky":"universal-modal__sticky_19f9y","hasContent":"universal-modal__hasContent_19f9y"};
|
|
6
6
|
|
|
7
7
|
module.exports = styles;
|
|
8
8
|
//# sourceMappingURL=index.module.css.js.map
|
|
@@ -3,10 +3,8 @@
|
|
|
3
3
|
--color-light-neutral-300: #e7e8eb;
|
|
4
4
|
}
|
|
5
5
|
:root {
|
|
6
|
-
--gap-
|
|
7
|
-
--gap-
|
|
8
|
-
--gap-16: var(--gap-m);
|
|
9
|
-
--gap-32: var(--gap-2xl);
|
|
6
|
+
--gap-16: 16px;
|
|
7
|
+
--gap-32: 32px;
|
|
10
8
|
}
|
|
11
9
|
:root {
|
|
12
10
|
--universal-modal-footer-background: var(--color-light-modal-bg-primary);
|
|
@@ -10,6 +10,7 @@ var cssm = require('@alfalab/core-components-shared/cssm');
|
|
|
10
10
|
var useScrollableContainerRef = require('../../hooks/use-scrollable-container-ref.js');
|
|
11
11
|
var getFullSizeModalTransitions = require('../../utils/get-full-size-modal-transitions.js');
|
|
12
12
|
var getHeightStyle = require('../../utils/get-height-style.js');
|
|
13
|
+
var getHugContentStyles = require('../../utils/get-hug-content-styles.js');
|
|
13
14
|
var getMarginStyles = require('../../utils/get-margin-styles.js');
|
|
14
15
|
var getWidthStyle = require('../../utils/get-width-style.js');
|
|
15
16
|
var modalContent = require('../modal-content/modal-content.js');
|
|
@@ -42,7 +43,7 @@ var CenterModal = React.forwardRef(function (props, ref) {
|
|
|
42
43
|
_a[styles__default.default.wrapperJustifyCenter] = verticalAlign === 'center',
|
|
43
44
|
_a[styles__default.default.wrapperJustifyEnd] = verticalAlign === 'bottom',
|
|
44
45
|
_a[styles__default.default.withoutOverlay] = withoutOverlay,
|
|
45
|
-
_a)), className: cn__default.default(styles__default.default.component, className, styles__default.default.baseModalComponent, tslib.__assign({}, getMarginStyles.getMarginStyles({ styles: styles__default.default, margin: margin, height: height }))), transitionProps: tslib.__assign(tslib.__assign({ classNames: transitionProps }, (isFullSizeModal && fullSizeModalContentTransitions)), restProps.transitionProps), backdropProps: tslib.__assign(tslib.__assign({ shouldRender: overlay }, (isFullSizeModal && fullSizeModalBackdropTransitions)), restProps.backdropProps), componentDivProps: {
|
|
46
|
+
_a)), className: cn__default.default(styles__default.default.component, className, styles__default.default.baseModalComponent, tslib.__assign(tslib.__assign({}, getMarginStyles.getMarginStyles({ styles: styles__default.default, margin: margin })), getHugContentStyles.getHugContentStyles({ styles: styles__default.default, margin: margin, height: height }))), transitionProps: tslib.__assign(tslib.__assign({ classNames: transitionProps }, (isFullSizeModal && fullSizeModalContentTransitions)), restProps.transitionProps), backdropProps: tslib.__assign(tslib.__assign({ shouldRender: overlay }, (isFullSizeModal && fullSizeModalBackdropTransitions)), restProps.backdropProps), componentDivProps: {
|
|
46
47
|
style: tslib.__assign({ width: getWidthStyle.getWidthStyle(width, margin) }, getHeightStyle.getHeightStyle(height, margin)),
|
|
47
48
|
}, onWheel: handleWheel, onClose: onClose }),
|
|
48
49
|
React__default.default.createElement(modalContent.ModalContent, { height: height, scrollableContainerRef: scrollableContainerRef }, children)));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"center-modal.js","sources":["../../../../src/desktop/components/center-modal/center-modal.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from 'react';\nimport cn from 'classnames';\n\nimport { BaseModal } from '@alfalab/core-components-base-modal';\nimport { isMacOS, isSafari } from '@alfalab/core-components-shared';\n\nimport { useScrollableContainerRef } from '../../hooks/use-scrollable-container-ref';\nimport { type UniversalModalDesktopProps } from '../../types/props';\nimport { getFullSizeModalTransitions } from '../../utils/get-full-size-modal-transitions';\nimport { getHeightStyle } from '../../utils/get-height-style';\nimport { getMarginStyles } from '../../utils/get-margin-styles';\nimport { getWidthStyle } from '../../utils/get-width-style';\nimport { ModalContent } from '../modal-content/modal-content';\n\nimport styles from './index.module.css';\nimport safariTransitions from './transitions/safari-transitions.module.css';\nimport transitions from './transitions/transitions.module.css';\n\n// в safari некорректно отрабатывает transform:scale (???), поэтому применяем немного другую анимацию\nconst transitionProps = isMacOS() && isSafari() ? safariTransitions : transitions;\n\nexport const CenterModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps>((props, ref) => {\n const {\n dataTestId,\n className,\n open,\n children,\n width = 500,\n height = 'hugContent',\n verticalAlign = 'center',\n overlay = true,\n margin,\n scrollableContainerRef: scrollableContainerRefProp,\n onClose,\n ...restProps\n } = props;\n\n const componentRef = useRef<HTMLDivElement>(null);\n const { handleWheel, scrollableContainerRef } = useScrollableContainerRef({\n overlay,\n refObject: scrollableContainerRefProp,\n });\n\n const {\n isFullSizeModal,\n componentTransitions: fullSizeModalContentTransitions,\n backdropTransitions: fullSizeModalBackdropTransitions,\n } = getFullSizeModalTransitions({ verticalAlign, width, height });\n\n const withoutOverlay = !overlay;\n\n return (\n <BaseModal\n {...restProps}\n open={open}\n dataTestId={dataTestId}\n ref={ref}\n componentRef={componentRef}\n scrollHandler='content'\n scrollLock={overlay}\n wrapperClassName={cn(styles.baseModalContainer, {\n [styles.wrapperJustifyStart]: verticalAlign === 'top',\n [styles.wrapperJustifyCenter]: verticalAlign === 'center',\n [styles.wrapperJustifyEnd]: verticalAlign === 'bottom',\n [styles.withoutOverlay]: withoutOverlay,\n })}\n className={cn(styles.component, className, styles.baseModalComponent, {\n ...getMarginStyles({ styles, margin, height }),\n })}\n transitionProps={{\n classNames: transitionProps,\n ...(isFullSizeModal && fullSizeModalContentTransitions),\n ...restProps.transitionProps,\n }}\n backdropProps={{\n shouldRender: overlay,\n ...(isFullSizeModal && fullSizeModalBackdropTransitions),\n ...restProps.backdropProps,\n }}\n componentDivProps={{\n style: {\n width: getWidthStyle(width, margin),\n ...getHeightStyle(height, margin),\n },\n }}\n onWheel={handleWheel}\n onClose={onClose}\n >\n <ModalContent height={height} scrollableContainerRef={scrollableContainerRef}>\n {children}\n </ModalContent>\n </BaseModal>\n );\n});\n"],"names":["isMacOS","isSafari","safariTransitions","transitions","forwardRef","__rest","useRef","useScrollableContainerRef","getFullSizeModalTransitions","React","BaseModal","__assign","cn","styles","getMarginStyles","getWidthStyle","getHeightStyle","ModalContent"],"mappings":"
|
|
1
|
+
{"version":3,"file":"center-modal.js","sources":["../../../../src/desktop/components/center-modal/center-modal.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from 'react';\nimport cn from 'classnames';\n\nimport { BaseModal } from '@alfalab/core-components-base-modal';\nimport { isMacOS, isSafari } from '@alfalab/core-components-shared';\n\nimport { useScrollableContainerRef } from '../../hooks/use-scrollable-container-ref';\nimport { type UniversalModalDesktopProps } from '../../types/props';\nimport { getFullSizeModalTransitions } from '../../utils/get-full-size-modal-transitions';\nimport { getHeightStyle } from '../../utils/get-height-style';\nimport { getHugContentStyles } from '../../utils/get-hug-content-styles';\nimport { getMarginStyles } from '../../utils/get-margin-styles';\nimport { getWidthStyle } from '../../utils/get-width-style';\nimport { ModalContent } from '../modal-content/modal-content';\n\nimport styles from './index.module.css';\nimport safariTransitions from './transitions/safari-transitions.module.css';\nimport transitions from './transitions/transitions.module.css';\n\n// в safari некорректно отрабатывает transform:scale (???), поэтому применяем немного другую анимацию\nconst transitionProps = isMacOS() && isSafari() ? safariTransitions : transitions;\n\nexport const CenterModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps>((props, ref) => {\n const {\n dataTestId,\n className,\n open,\n children,\n width = 500,\n height = 'hugContent',\n verticalAlign = 'center',\n overlay = true,\n margin,\n scrollableContainerRef: scrollableContainerRefProp,\n onClose,\n ...restProps\n } = props;\n\n const componentRef = useRef<HTMLDivElement>(null);\n const { handleWheel, scrollableContainerRef } = useScrollableContainerRef({\n overlay,\n refObject: scrollableContainerRefProp,\n });\n\n const {\n isFullSizeModal,\n componentTransitions: fullSizeModalContentTransitions,\n backdropTransitions: fullSizeModalBackdropTransitions,\n } = getFullSizeModalTransitions({ verticalAlign, width, height });\n\n const withoutOverlay = !overlay;\n\n return (\n <BaseModal\n {...restProps}\n open={open}\n dataTestId={dataTestId}\n ref={ref}\n componentRef={componentRef}\n scrollHandler='content'\n scrollLock={overlay}\n wrapperClassName={cn(styles.baseModalContainer, {\n [styles.wrapperJustifyStart]: verticalAlign === 'top',\n [styles.wrapperJustifyCenter]: verticalAlign === 'center',\n [styles.wrapperJustifyEnd]: verticalAlign === 'bottom',\n [styles.withoutOverlay]: withoutOverlay,\n })}\n className={cn(styles.component, className, styles.baseModalComponent, {\n ...getMarginStyles({ styles, margin }),\n ...getHugContentStyles({ styles, margin, height }),\n })}\n transitionProps={{\n classNames: transitionProps,\n ...(isFullSizeModal && fullSizeModalContentTransitions),\n ...restProps.transitionProps,\n }}\n backdropProps={{\n shouldRender: overlay,\n ...(isFullSizeModal && fullSizeModalBackdropTransitions),\n ...restProps.backdropProps,\n }}\n componentDivProps={{\n style: {\n width: getWidthStyle(width, margin),\n ...getHeightStyle(height, margin),\n },\n }}\n onWheel={handleWheel}\n onClose={onClose}\n >\n <ModalContent height={height} scrollableContainerRef={scrollableContainerRef}>\n {children}\n </ModalContent>\n </BaseModal>\n );\n});\n"],"names":["isMacOS","isSafari","safariTransitions","transitions","forwardRef","__rest","useRef","useScrollableContainerRef","getFullSizeModalTransitions","React","BaseModal","__assign","cn","styles","getMarginStyles","getHugContentStyles","getWidthStyle","getHeightStyle","ModalContent"],"mappings":"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"}
|
|
@@ -9,6 +9,7 @@ var cssm = require('@alfalab/core-components-base-modal/cssm');
|
|
|
9
9
|
var useScrollableContainerRef = require('../../hooks/use-scrollable-container-ref.js');
|
|
10
10
|
var getFullSizeModalTransitions = require('../../utils/get-full-size-modal-transitions.js');
|
|
11
11
|
var getHeightStyle = require('../../utils/get-height-style.js');
|
|
12
|
+
var getHugContentStyles = require('../../utils/get-hug-content-styles.js');
|
|
12
13
|
var getMarginStyles = require('../../utils/get-margin-styles.js');
|
|
13
14
|
var getWidthStyle = require('../../utils/get-width-style.js');
|
|
14
15
|
var modalContent = require('../modal-content/modal-content.js');
|
|
@@ -38,7 +39,7 @@ var SideModal = React.forwardRef(function (props, ref) {
|
|
|
38
39
|
_a[styles__default.default.wrapperJustifyCenter] = verticalAlign === 'center',
|
|
39
40
|
_a[styles__default.default.wrapperJustifyEnd] = verticalAlign === 'bottom',
|
|
40
41
|
_a[styles__default.default.withoutOverlay] = withoutOverlay,
|
|
41
|
-
_a)), className: cn__default.default(styles__default.default.component, className, styles__default.default.baseModalComponent, tslib.__assign({}, getMarginStyles.getMarginStyles({ styles: styles__default.default, margin: margin, height: height }))), contentClassName: styles__default.default.content, transitionProps: tslib.__assign(tslib.__assign(tslib.__assign({}, getDefaultTransitionProps.getDefaultTransitionProps({
|
|
42
|
+
_a)), className: cn__default.default(styles__default.default.component, className, styles__default.default.baseModalComponent, tslib.__assign(tslib.__assign({}, getMarginStyles.getMarginStyles({ styles: styles__default.default, margin: margin })), getHugContentStyles.getHugContentStyles({ styles: styles__default.default, margin: margin, height: height }))), contentClassName: styles__default.default.content, transitionProps: tslib.__assign(tslib.__assign(tslib.__assign({}, getDefaultTransitionProps.getDefaultTransitionProps({
|
|
42
43
|
horizontalAlign: horizontalAlign,
|
|
43
44
|
margin: margin,
|
|
44
45
|
})), (isFullSizeModal && fullSizeModalContentTransitions)), restProps.transitionProps), backdropProps: tslib.__assign(tslib.__assign({ shouldRender: overlay }, (isFullSizeModal && fullSizeModalBackdropTransitions)), restProps.backdropProps), componentDivProps: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"side-modal.js","sources":["../../../../src/desktop/components/side-modal/side-modal.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from 'react';\nimport cn from 'classnames';\n\nimport { BaseModal } from '@alfalab/core-components-base-modal';\n\nimport { useScrollableContainerRef } from '../../hooks/use-scrollable-container-ref';\nimport { type UniversalModalDesktopProps } from '../../types/props';\nimport { getFullSizeModalTransitions } from '../../utils/get-full-size-modal-transitions';\nimport { getHeightStyle } from '../../utils/get-height-style';\nimport { getMarginStyles } from '../../utils/get-margin-styles';\nimport { getWidthStyle } from '../../utils/get-width-style';\nimport { ModalContent } from '../modal-content/modal-content';\n\nimport { getDefaultTransitionProps } from './get-default-transition-props';\n\nimport styles from './index.module.css';\n\nexport const SideModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps>((props, ref) => {\n const {\n width = 500,\n height = 'fullHeight',\n horizontalAlign = 'center',\n verticalAlign = 'center',\n overlay = true,\n open,\n dataTestId,\n className,\n children,\n margin,\n scrollableContainerRef: scrollableContainerRefProp,\n onClose,\n ...restProps\n } = props;\n const componentRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const { handleWheel, scrollableContainerRef } = useScrollableContainerRef({\n overlay,\n refObject: scrollableContainerRefProp,\n });\n\n const {\n isFullSizeModal,\n componentTransitions: fullSizeModalContentTransitions,\n backdropTransitions: fullSizeModalBackdropTransitions,\n } = getFullSizeModalTransitions({ verticalAlign, width, height });\n\n const withoutOverlay = !overlay;\n\n return (\n <BaseModal\n {...restProps}\n open={open}\n dataTestId={dataTestId}\n ref={ref}\n componentRef={componentRef}\n contentElementRef={contentRef}\n scrollHandler='content'\n scrollLock={overlay}\n wrapperClassName={cn(styles.wrapper, styles.baseModalContainer, {\n [styles.wrapperAlignStart]: horizontalAlign === 'start',\n [styles.wrapperAlignEnd]: horizontalAlign === 'end',\n [styles.wrapperJustifyCenter]: verticalAlign === 'center',\n [styles.wrapperJustifyEnd]: verticalAlign === 'bottom',\n [styles.withoutOverlay]: withoutOverlay,\n })}\n className={cn(styles.component, className, styles.baseModalComponent, {\n ...getMarginStyles({ styles, margin, height }),\n })}\n contentClassName={styles.content}\n transitionProps={{\n ...getDefaultTransitionProps({\n horizontalAlign,\n margin,\n }),\n ...(isFullSizeModal && fullSizeModalContentTransitions),\n ...restProps.transitionProps,\n }}\n backdropProps={{\n shouldRender: overlay,\n ...(isFullSizeModal && fullSizeModalBackdropTransitions),\n ...restProps.backdropProps,\n }}\n componentDivProps={{\n style: {\n width: getWidthStyle(width, margin),\n ...getHeightStyle(height, margin),\n },\n }}\n onWheel={handleWheel}\n onClose={onClose}\n >\n <ModalContent height={height} scrollableContainerRef={scrollableContainerRef}>\n {children}\n </ModalContent>\n </BaseModal>\n );\n});\n"],"names":["forwardRef","__rest","useRef","useScrollableContainerRef","getFullSizeModalTransitions","React","BaseModal","__assign","cn","styles","getMarginStyles","getDefaultTransitionProps","getWidthStyle","getHeightStyle","ModalContent"],"mappings":"
|
|
1
|
+
{"version":3,"file":"side-modal.js","sources":["../../../../src/desktop/components/side-modal/side-modal.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from 'react';\nimport cn from 'classnames';\n\nimport { BaseModal } from '@alfalab/core-components-base-modal';\n\nimport { useScrollableContainerRef } from '../../hooks/use-scrollable-container-ref';\nimport { type UniversalModalDesktopProps } from '../../types/props';\nimport { getFullSizeModalTransitions } from '../../utils/get-full-size-modal-transitions';\nimport { getHeightStyle } from '../../utils/get-height-style';\nimport { getHugContentStyles } from '../../utils/get-hug-content-styles';\nimport { getMarginStyles } from '../../utils/get-margin-styles';\nimport { getWidthStyle } from '../../utils/get-width-style';\nimport { ModalContent } from '../modal-content/modal-content';\n\nimport { getDefaultTransitionProps } from './get-default-transition-props';\n\nimport styles from './index.module.css';\n\nexport const SideModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps>((props, ref) => {\n const {\n width = 500,\n height = 'fullHeight',\n horizontalAlign = 'center',\n verticalAlign = 'center',\n overlay = true,\n open,\n dataTestId,\n className,\n children,\n margin,\n scrollableContainerRef: scrollableContainerRefProp,\n onClose,\n ...restProps\n } = props;\n const componentRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const { handleWheel, scrollableContainerRef } = useScrollableContainerRef({\n overlay,\n refObject: scrollableContainerRefProp,\n });\n\n const {\n isFullSizeModal,\n componentTransitions: fullSizeModalContentTransitions,\n backdropTransitions: fullSizeModalBackdropTransitions,\n } = getFullSizeModalTransitions({ verticalAlign, width, height });\n\n const withoutOverlay = !overlay;\n\n return (\n <BaseModal\n {...restProps}\n open={open}\n dataTestId={dataTestId}\n ref={ref}\n componentRef={componentRef}\n contentElementRef={contentRef}\n scrollHandler='content'\n scrollLock={overlay}\n wrapperClassName={cn(styles.wrapper, styles.baseModalContainer, {\n [styles.wrapperAlignStart]: horizontalAlign === 'start',\n [styles.wrapperAlignEnd]: horizontalAlign === 'end',\n [styles.wrapperJustifyCenter]: verticalAlign === 'center',\n [styles.wrapperJustifyEnd]: verticalAlign === 'bottom',\n [styles.withoutOverlay]: withoutOverlay,\n })}\n className={cn(styles.component, className, styles.baseModalComponent, {\n ...getMarginStyles({ styles, margin }),\n ...getHugContentStyles({ styles, margin, height }),\n })}\n contentClassName={styles.content}\n transitionProps={{\n ...getDefaultTransitionProps({\n horizontalAlign,\n margin,\n }),\n ...(isFullSizeModal && fullSizeModalContentTransitions),\n ...restProps.transitionProps,\n }}\n backdropProps={{\n shouldRender: overlay,\n ...(isFullSizeModal && fullSizeModalBackdropTransitions),\n ...restProps.backdropProps,\n }}\n componentDivProps={{\n style: {\n width: getWidthStyle(width, margin),\n ...getHeightStyle(height, margin),\n },\n }}\n onWheel={handleWheel}\n onClose={onClose}\n >\n <ModalContent height={height} scrollableContainerRef={scrollableContainerRef}>\n {children}\n </ModalContent>\n </BaseModal>\n );\n});\n"],"names":["forwardRef","__rest","useRef","useScrollableContainerRef","getFullSizeModalTransitions","React","BaseModal","__assign","cn","styles","getMarginStyles","getHugContentStyles","getDefaultTransitionProps","getWidthStyle","getHeightStyle","ModalContent"],"mappings":"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"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { type UniversalModalDesktopProps } from '../types/props';
|
|
2
|
+
interface Params {
|
|
3
|
+
styles: Record<string, string>;
|
|
4
|
+
margin: UniversalModalDesktopProps['margin'];
|
|
5
|
+
height: NonNullable<UniversalModalDesktopProps['height']>;
|
|
6
|
+
}
|
|
7
|
+
export declare const getHugContentStyles: (params: Params) => Record<string, boolean>;
|
|
8
|
+
export {};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var tslib = require('tslib');
|
|
6
|
+
var cssm = require('@alfalab/core-components-shared/cssm');
|
|
7
|
+
|
|
8
|
+
var getHugContentStyles = function (params) {
|
|
9
|
+
var _a, _b, _c;
|
|
10
|
+
var margin = params.margin, styles = params.styles, height = params.height;
|
|
11
|
+
if (height !== 'hugContent') {
|
|
12
|
+
return {};
|
|
13
|
+
}
|
|
14
|
+
return tslib.__assign(tslib.__assign((_a = {}, _a[styles.hugContent] = true, _a), (margin && cssm.hasOwnProperty(margin, 'top') && (_b = {}, _b[styles["topGap-".concat(margin.top)]] = true, _b))), (margin &&
|
|
15
|
+
cssm.hasOwnProperty(margin, 'bottom') && (_c = {}, _c[styles["bottomGap-".concat(margin.bottom)]] = true, _c)));
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
exports.getHugContentStyles = getHugContentStyles;
|
|
19
|
+
//# sourceMappingURL=get-hug-content-styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"get-hug-content-styles.js","sources":["../../../src/desktop/utils/get-hug-content-styles.ts"],"sourcesContent":["import { hasOwnProperty } from '@alfalab/core-components-shared';\n\nimport { type UniversalModalDesktopProps } from '../types/props';\n\ninterface Params {\n styles: Record<string, string>;\n margin: UniversalModalDesktopProps['margin'];\n height: NonNullable<UniversalModalDesktopProps['height']>;\n}\n\nexport const getHugContentStyles = (params: Params): Record<string, boolean> => {\n const { margin, styles, height } = params;\n\n if (height !== 'hugContent') {\n return {};\n }\n\n return {\n [styles.hugContent]: true,\n ...(margin && hasOwnProperty(margin, 'top') && { [styles[`topGap-${margin.top}`]]: true }),\n ...(margin &&\n hasOwnProperty(margin, 'bottom') && { [styles[`bottomGap-${margin.bottom}`]]: true }),\n };\n};\n"],"names":["__assign","hasOwnProperty"],"mappings":";;;;;;;AAUO,IAAM,mBAAmB,GAAG,UAAC,MAAc,EAAA;;AACtC,IAAA,IAAA,MAAM,GAAqB,MAAM,CAAA,MAA3B,EAAE,MAAM,GAAa,MAAM,CAAA,MAAnB,EAAE,MAAM,GAAK,MAAM,OAAX;AAE9B,IAAA,IAAI,MAAM,KAAK,YAAY,EAAE;AACzB,QAAA,OAAO,EAAE;;AAGb,IAAA,OAAAA,cAAA,CAAAA,cAAA,EAAA,EAAA,GAAA,EAAA,EAAA,EAAA,CACK,MAAM,CAAC,UAAU,CAAA,GAAG,IAAI,EAAA,EAAA,IACrB,MAAM,IAAIC,mBAAc,CAAC,MAAM,EAAE,KAAK,CAAC,KAAM,EAAA,GAAA,EAAA,EAAA,EAAA,CAAC,MAAM,CAAC,SAAU,CAAA,MAAA,CAAA,MAAM,CAAC,GAAG,CAAE,CAAC,CAAA,GAAG,IAAI,EAAA,EAAA,CAAE,EAAC,GACtF,MAAM;AACN,QAAAA,mBAAc,CAAC,MAAM,EAAE,QAAQ,CAAC,KAAA,EAAA,GAAA,EAAA,EAAM,GAAC,MAAM,CAAC,oBAAa,MAAM,CAAC,MAAM,CAAE,CAAC,IAAG,IAAI,EAAA,EAAA,CAAE,EAC1F;AACN;;;;"}
|
|
@@ -2,7 +2,6 @@ import { type UniversalModalDesktopProps } from '../types/props';
|
|
|
2
2
|
interface Params {
|
|
3
3
|
styles: Record<string, string>;
|
|
4
4
|
margin: UniversalModalDesktopProps['margin'];
|
|
5
|
-
height: NonNullable<UniversalModalDesktopProps['height']>;
|
|
6
5
|
}
|
|
7
6
|
export declare const getMarginStyles: (params: Params) => Record<string, boolean>;
|
|
8
7
|
export {};
|
|
@@ -2,24 +2,18 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
var tslib = require('tslib');
|
|
5
6
|
var cssm = require('@alfalab/core-components-shared/cssm');
|
|
6
7
|
|
|
7
8
|
var getMarginStyles = function (params) {
|
|
8
|
-
var _a;
|
|
9
|
-
var margin = params.margin, styles = params.styles
|
|
10
|
-
if (margin) {
|
|
11
|
-
|
|
12
|
-
return _a = {},
|
|
13
|
-
_a[styles["marginTop-".concat(margin.top)]] = cssm.hasOwnProperty(margin, 'top'),
|
|
14
|
-
_a[styles["marginRight-".concat(margin.right)]] = cssm.hasOwnProperty(margin, 'right'),
|
|
15
|
-
_a[styles["marginBottom-".concat(margin.bottom)]] = cssm.hasOwnProperty(margin, 'bottom'),
|
|
16
|
-
_a[styles["marginLeft-".concat(margin.left)]] = cssm.hasOwnProperty(margin, 'left'),
|
|
17
|
-
_a[styles.hugContent] = isHugContent,
|
|
18
|
-
_a[styles["topGap-".concat(margin.top)]] = isHugContent && cssm.hasOwnProperty(margin, 'top'),
|
|
19
|
-
_a[styles["bottomGap-".concat(margin.bottom)]] = isHugContent && cssm.hasOwnProperty(margin, 'bottom'),
|
|
20
|
-
_a;
|
|
9
|
+
var _a, _b, _c, _d;
|
|
10
|
+
var margin = params.margin, styles = params.styles;
|
|
11
|
+
if (!margin) {
|
|
12
|
+
return {};
|
|
21
13
|
}
|
|
22
|
-
return {}
|
|
14
|
+
return tslib.__assign(tslib.__assign(tslib.__assign(tslib.__assign({}, (cssm.hasOwnProperty(margin, 'top') && (_a = {}, _a[styles["marginTop-".concat(margin.top)]] = true, _a))), (cssm.hasOwnProperty(margin, 'right') && (_b = {}, _b[styles["marginRight-".concat(margin.right)]] = true, _b))), (cssm.hasOwnProperty(margin, 'bottom') && (_c = {},
|
|
15
|
+
_c[styles["marginBottom-".concat(margin.bottom)]] = true,
|
|
16
|
+
_c))), (cssm.hasOwnProperty(margin, 'left') && (_d = {}, _d[styles["marginLeft-".concat(margin.left)]] = true, _d)));
|
|
23
17
|
};
|
|
24
18
|
|
|
25
19
|
exports.getMarginStyles = getMarginStyles;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-margin-styles.js","sources":["../../../src/desktop/utils/get-margin-styles.ts"],"sourcesContent":["import { hasOwnProperty } from '@alfalab/core-components-shared';\n\nimport { type UniversalModalDesktopProps } from '../types/props';\n\ninterface Params {\n styles: Record<string, string>;\n margin: UniversalModalDesktopProps['margin'];\n
|
|
1
|
+
{"version":3,"file":"get-margin-styles.js","sources":["../../../src/desktop/utils/get-margin-styles.ts"],"sourcesContent":["import { hasOwnProperty } from '@alfalab/core-components-shared';\n\nimport { type UniversalModalDesktopProps } from '../types/props';\n\ninterface Params {\n styles: Record<string, string>;\n margin: UniversalModalDesktopProps['margin'];\n}\n\nexport const getMarginStyles = (params: Params): Record<string, boolean> => {\n const { margin, styles } = params;\n\n if (!margin) {\n return {};\n }\n\n return {\n ...(hasOwnProperty(margin, 'top') && { [styles[`marginTop-${margin.top}`]]: true }),\n ...(hasOwnProperty(margin, 'right') && { [styles[`marginRight-${margin.right}`]]: true }),\n ...(hasOwnProperty(margin, 'bottom') && {\n [styles[`marginBottom-${margin.bottom}`]]: true,\n }),\n ...(hasOwnProperty(margin, 'left') && { [styles[`marginLeft-${margin.left}`]]: true }),\n };\n};\n"],"names":["__assign","hasOwnProperty"],"mappings":";;;;;;;AASO,IAAM,eAAe,GAAG,UAAC,MAAc,EAAA;;IAClC,IAAA,MAAM,GAAa,MAAM,CAAA,MAAnB,EAAE,MAAM,GAAK,MAAM,CAAA,MAAX;IAEtB,IAAI,CAAC,MAAM,EAAE;AACT,QAAA,OAAO,EAAE;;IAGb,OACOA,cAAA,CAAAA,cAAA,CAAAA,cAAA,CAAAA,cAAA,CAAA,EAAA,GAACC,mBAAc,CAAC,MAAM,EAAE,KAAK,CAAC,KAAM,EAAA,GAAA,EAAA,EAAA,EAAA,CAAC,MAAM,CAAC,oBAAa,MAAM,CAAC,GAAG,CAAE,CAAC,CAAA,GAAG,IAAI,EAAE,EAAA,CAAA,EAC/E,GAACA,mBAAc,CAAC,MAAM,EAAE,OAAO,CAAC,KAAM,EAAA,GAAA,EAAA,EAAA,EAAA,CAAC,MAAM,CAAC,cAAA,CAAA,MAAA,CAAe,MAAM,CAAC,KAAK,CAAE,CAAC,CAAG,GAAA,IAAI,EAAE,EAAA,CAAA,EACrF,GAACA,mBAAc,CAAC,MAAM,EAAE,QAAQ,CAAC,KAAA,EAAA,GAAA,EAAA;QAChC,EAAC,CAAA,MAAM,CAAC,eAAgB,CAAA,MAAA,CAAA,MAAM,CAAC,MAAM,CAAE,CAAC,CAAA,GAAG,IAAI;WAClD,EAAC,GACEA,mBAAc,CAAC,MAAM,EAAE,MAAM,CAAC,KAAA,EAAA,GAAA,EAAA,EAAM,EAAC,CAAA,MAAM,CAAC,aAAc,CAAA,MAAA,CAAA,MAAM,CAAC,IAAI,CAAE,CAAC,CAAG,GAAA,IAAI,EAAE,EAAA,CAAA,EACvF;AACN;;;;"}
|
|
@@ -1,13 +1,9 @@
|
|
|
1
1
|
:root {
|
|
2
|
-
--gap-
|
|
3
|
-
--gap-xs: 8px;
|
|
4
|
-
--gap-s: 12px;
|
|
5
|
-
--gap-m: 16px;
|
|
6
|
-
--gap-4: var(--gap-2xs);
|
|
2
|
+
--gap-4: 4px;
|
|
7
3
|
--gap-6: 6px;
|
|
8
|
-
--gap-8:
|
|
9
|
-
--gap-12:
|
|
10
|
-
--gap-16:
|
|
4
|
+
--gap-8: 8px;
|
|
5
|
+
--gap-12: 12px;
|
|
6
|
+
--gap-16: 16px;
|
|
11
7
|
}
|
|
12
8
|
:root {
|
|
13
9
|
--font-family-alfasans:
|
|
@@ -10,6 +10,7 @@ var coreComponentsShared = require('@alfalab/core-components-shared');
|
|
|
10
10
|
var useScrollableContainerRef = require('../../hooks/use-scrollable-container-ref.js');
|
|
11
11
|
var getFullSizeModalTransitions = require('../../utils/get-full-size-modal-transitions.js');
|
|
12
12
|
var getHeightStyle = require('../../utils/get-height-style.js');
|
|
13
|
+
var getHugContentStyles = require('../../utils/get-hug-content-styles.js');
|
|
13
14
|
var getMarginStyles = require('../../utils/get-margin-styles.js');
|
|
14
15
|
var getWidthStyle = require('../../utils/get-width-style.js');
|
|
15
16
|
var modalContent = require('../modal-content/modal-content.js');
|
|
@@ -39,7 +40,7 @@ var CenterModal = React.forwardRef(function (props, ref) {
|
|
|
39
40
|
_a[index_module.wrapperJustifyCenter] = verticalAlign === 'center',
|
|
40
41
|
_a[index_module.wrapperJustifyEnd] = verticalAlign === 'bottom',
|
|
41
42
|
_a[index_module.withoutOverlay] = withoutOverlay,
|
|
42
|
-
_a)), className: cn__default.default(index_module.component, className, index_module.baseModalComponent, tslib.__assign({}, getMarginStyles.getMarginStyles({ styles: index_module, margin: margin, height: height }))), transitionProps: tslib.__assign(tslib.__assign({ classNames: transitionProps }, (isFullSizeModal && fullSizeModalContentTransitions)), restProps.transitionProps), backdropProps: tslib.__assign(tslib.__assign({ shouldRender: overlay }, (isFullSizeModal && fullSizeModalBackdropTransitions)), restProps.backdropProps), componentDivProps: {
|
|
43
|
+
_a)), className: cn__default.default(index_module.component, className, index_module.baseModalComponent, tslib.__assign(tslib.__assign({}, getMarginStyles.getMarginStyles({ styles: index_module, margin: margin })), getHugContentStyles.getHugContentStyles({ styles: index_module, margin: margin, height: height }))), transitionProps: tslib.__assign(tslib.__assign({ classNames: transitionProps }, (isFullSizeModal && fullSizeModalContentTransitions)), restProps.transitionProps), backdropProps: tslib.__assign(tslib.__assign({ shouldRender: overlay }, (isFullSizeModal && fullSizeModalBackdropTransitions)), restProps.backdropProps), componentDivProps: {
|
|
43
44
|
style: tslib.__assign({ width: getWidthStyle.getWidthStyle(width, margin) }, getHeightStyle.getHeightStyle(height, margin)),
|
|
44
45
|
}, onWheel: handleWheel, onClose: onClose }),
|
|
45
46
|
React__default.default.createElement(modalContent.ModalContent, { height: height, scrollableContainerRef: scrollableContainerRef }, children)));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"center-modal.js","sources":["../../../src/desktop/components/center-modal/center-modal.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from 'react';\nimport cn from 'classnames';\n\nimport { BaseModal } from '@alfalab/core-components-base-modal';\nimport { isMacOS, isSafari } from '@alfalab/core-components-shared';\n\nimport { useScrollableContainerRef } from '../../hooks/use-scrollable-container-ref';\nimport { type UniversalModalDesktopProps } from '../../types/props';\nimport { getFullSizeModalTransitions } from '../../utils/get-full-size-modal-transitions';\nimport { getHeightStyle } from '../../utils/get-height-style';\nimport { getMarginStyles } from '../../utils/get-margin-styles';\nimport { getWidthStyle } from '../../utils/get-width-style';\nimport { ModalContent } from '../modal-content/modal-content';\n\nimport styles from './index.module.css';\nimport safariTransitions from './transitions/safari-transitions.module.css';\nimport transitions from './transitions/transitions.module.css';\n\n// в safari некорректно отрабатывает transform:scale (???), поэтому применяем немного другую анимацию\nconst transitionProps = isMacOS() && isSafari() ? safariTransitions : transitions;\n\nexport const CenterModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps>((props, ref) => {\n const {\n dataTestId,\n className,\n open,\n children,\n width = 500,\n height = 'hugContent',\n verticalAlign = 'center',\n overlay = true,\n margin,\n scrollableContainerRef: scrollableContainerRefProp,\n onClose,\n ...restProps\n } = props;\n\n const componentRef = useRef<HTMLDivElement>(null);\n const { handleWheel, scrollableContainerRef } = useScrollableContainerRef({\n overlay,\n refObject: scrollableContainerRefProp,\n });\n\n const {\n isFullSizeModal,\n componentTransitions: fullSizeModalContentTransitions,\n backdropTransitions: fullSizeModalBackdropTransitions,\n } = getFullSizeModalTransitions({ verticalAlign, width, height });\n\n const withoutOverlay = !overlay;\n\n return (\n <BaseModal\n {...restProps}\n open={open}\n dataTestId={dataTestId}\n ref={ref}\n componentRef={componentRef}\n scrollHandler='content'\n scrollLock={overlay}\n wrapperClassName={cn(styles.baseModalContainer, {\n [styles.wrapperJustifyStart]: verticalAlign === 'top',\n [styles.wrapperJustifyCenter]: verticalAlign === 'center',\n [styles.wrapperJustifyEnd]: verticalAlign === 'bottom',\n [styles.withoutOverlay]: withoutOverlay,\n })}\n className={cn(styles.component, className, styles.baseModalComponent, {\n ...getMarginStyles({ styles, margin, height }),\n })}\n transitionProps={{\n classNames: transitionProps,\n ...(isFullSizeModal && fullSizeModalContentTransitions),\n ...restProps.transitionProps,\n }}\n backdropProps={{\n shouldRender: overlay,\n ...(isFullSizeModal && fullSizeModalBackdropTransitions),\n ...restProps.backdropProps,\n }}\n componentDivProps={{\n style: {\n width: getWidthStyle(width, margin),\n ...getHeightStyle(height, margin),\n },\n }}\n onWheel={handleWheel}\n onClose={onClose}\n >\n <ModalContent height={height} scrollableContainerRef={scrollableContainerRef}>\n {children}\n </ModalContent>\n </BaseModal>\n );\n});\n"],"names":["isMacOS","isSafari","safariTransitions","transitions","forwardRef","__rest","useRef","useScrollableContainerRef","getFullSizeModalTransitions","React","BaseModal","__assign","cn","styles","getMarginStyles","getWidthStyle","getHeightStyle","ModalContent"],"mappings":"
|
|
1
|
+
{"version":3,"file":"center-modal.js","sources":["../../../src/desktop/components/center-modal/center-modal.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from 'react';\nimport cn from 'classnames';\n\nimport { BaseModal } from '@alfalab/core-components-base-modal';\nimport { isMacOS, isSafari } from '@alfalab/core-components-shared';\n\nimport { useScrollableContainerRef } from '../../hooks/use-scrollable-container-ref';\nimport { type UniversalModalDesktopProps } from '../../types/props';\nimport { getFullSizeModalTransitions } from '../../utils/get-full-size-modal-transitions';\nimport { getHeightStyle } from '../../utils/get-height-style';\nimport { getHugContentStyles } from '../../utils/get-hug-content-styles';\nimport { getMarginStyles } from '../../utils/get-margin-styles';\nimport { getWidthStyle } from '../../utils/get-width-style';\nimport { ModalContent } from '../modal-content/modal-content';\n\nimport styles from './index.module.css';\nimport safariTransitions from './transitions/safari-transitions.module.css';\nimport transitions from './transitions/transitions.module.css';\n\n// в safari некорректно отрабатывает transform:scale (???), поэтому применяем немного другую анимацию\nconst transitionProps = isMacOS() && isSafari() ? safariTransitions : transitions;\n\nexport const CenterModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps>((props, ref) => {\n const {\n dataTestId,\n className,\n open,\n children,\n width = 500,\n height = 'hugContent',\n verticalAlign = 'center',\n overlay = true,\n margin,\n scrollableContainerRef: scrollableContainerRefProp,\n onClose,\n ...restProps\n } = props;\n\n const componentRef = useRef<HTMLDivElement>(null);\n const { handleWheel, scrollableContainerRef } = useScrollableContainerRef({\n overlay,\n refObject: scrollableContainerRefProp,\n });\n\n const {\n isFullSizeModal,\n componentTransitions: fullSizeModalContentTransitions,\n backdropTransitions: fullSizeModalBackdropTransitions,\n } = getFullSizeModalTransitions({ verticalAlign, width, height });\n\n const withoutOverlay = !overlay;\n\n return (\n <BaseModal\n {...restProps}\n open={open}\n dataTestId={dataTestId}\n ref={ref}\n componentRef={componentRef}\n scrollHandler='content'\n scrollLock={overlay}\n wrapperClassName={cn(styles.baseModalContainer, {\n [styles.wrapperJustifyStart]: verticalAlign === 'top',\n [styles.wrapperJustifyCenter]: verticalAlign === 'center',\n [styles.wrapperJustifyEnd]: verticalAlign === 'bottom',\n [styles.withoutOverlay]: withoutOverlay,\n })}\n className={cn(styles.component, className, styles.baseModalComponent, {\n ...getMarginStyles({ styles, margin }),\n ...getHugContentStyles({ styles, margin, height }),\n })}\n transitionProps={{\n classNames: transitionProps,\n ...(isFullSizeModal && fullSizeModalContentTransitions),\n ...restProps.transitionProps,\n }}\n backdropProps={{\n shouldRender: overlay,\n ...(isFullSizeModal && fullSizeModalBackdropTransitions),\n ...restProps.backdropProps,\n }}\n componentDivProps={{\n style: {\n width: getWidthStyle(width, margin),\n ...getHeightStyle(height, margin),\n },\n }}\n onWheel={handleWheel}\n onClose={onClose}\n >\n <ModalContent height={height} scrollableContainerRef={scrollableContainerRef}>\n {children}\n </ModalContent>\n </BaseModal>\n );\n});\n"],"names":["isMacOS","isSafari","safariTransitions","transitions","forwardRef","__rest","useRef","useScrollableContainerRef","getFullSizeModalTransitions","React","BaseModal","__assign","cn","styles","getMarginStyles","getHugContentStyles","getWidthStyle","getHeightStyle","ModalContent"],"mappings":"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"}
|