@salutejs/plasma-new-hope 0.194.0-canary.1558.11852073996.0 → 0.194.0-canary.1560.11855728487.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/Modal/Modal.css +0 -6
- package/cjs/components/Modal/Modal.js +13 -27
- package/cjs/components/Modal/Modal.js.map +1 -1
- package/cjs/components/Modal/Modal.tokens.js +1 -7
- package/cjs/components/Modal/Modal.tokens.js.map +1 -1
- package/cjs/components/Switch/Switch.css +2 -2
- package/cjs/components/Switch/Switch.tokens.js +7 -1
- package/cjs/components/Switch/Switch.tokens.js.map +1 -1
- package/cjs/components/Switch/_toggleSize/base.js +1 -1
- package/cjs/components/Switch/_toggleSize/base.js.map +1 -1
- package/cjs/components/Switch/_toggleSize/base_38anc0.css +1 -0
- package/cjs/components/Switch/_view/base.js +1 -1
- package/cjs/components/Switch/_view/base.js.map +1 -1
- package/cjs/components/Switch/_view/base_15atbyp.css +1 -0
- package/cjs/index.css +2 -6
- package/emotion/cjs/components/Modal/Modal.js +12 -26
- package/emotion/cjs/components/Modal/Modal.template-doc.mdx +0 -47
- package/emotion/cjs/components/Modal/Modal.tokens.js +1 -7
- package/emotion/cjs/components/Switch/Switch.tokens.js +7 -1
- package/emotion/cjs/components/Switch/_toggleSize/base.js +1 -1
- package/emotion/cjs/components/Switch/_view/base.js +1 -1
- package/emotion/cjs/examples/plasma_b2c/components/Modal/Modal.config.js +1 -1
- package/emotion/cjs/examples/plasma_b2c/components/Modal/Modal.stories.tsx +1 -90
- package/emotion/cjs/examples/plasma_b2c/components/Switch/Switch.config.js +8 -8
- package/emotion/cjs/examples/plasma_b2c/components/Switch/Switch.js +5 -2
- package/emotion/cjs/examples/plasma_b2c/components/Switch/Switch.outline.config.js +37 -0
- package/emotion/cjs/examples/plasma_b2c/components/Switch/Switch.stories.tsx +33 -1
- package/emotion/cjs/examples/plasma_web/components/Modal/Modal.config.js +1 -1
- package/emotion/cjs/examples/plasma_web/components/Modal/Modal.stories.tsx +1 -90
- package/emotion/cjs/examples/plasma_web/components/Switch/Switch.config.js +8 -8
- package/emotion/cjs/examples/plasma_web/components/Switch/Switch.js +5 -2
- package/emotion/cjs/examples/plasma_web/components/Switch/Switch.outline.config.js +37 -0
- package/emotion/cjs/examples/plasma_web/components/Switch/Switch.stories.tsx +33 -1
- package/emotion/es/components/Modal/Modal.js +12 -26
- package/emotion/es/components/Modal/Modal.template-doc.mdx +0 -47
- package/emotion/es/components/Modal/Modal.tokens.js +1 -7
- package/emotion/es/components/Switch/Switch.tokens.js +7 -1
- package/emotion/es/components/Switch/_toggleSize/base.js +1 -1
- package/emotion/es/components/Switch/_view/base.js +1 -1
- package/emotion/es/examples/plasma_b2c/components/Modal/Modal.config.js +1 -1
- package/emotion/es/examples/plasma_b2c/components/Modal/Modal.stories.tsx +1 -90
- package/emotion/es/examples/plasma_b2c/components/Switch/Switch.config.js +8 -8
- package/emotion/es/examples/plasma_b2c/components/Switch/Switch.js +4 -1
- package/emotion/es/examples/plasma_b2c/components/Switch/Switch.outline.config.js +31 -0
- package/emotion/es/examples/plasma_b2c/components/Switch/Switch.stories.tsx +33 -1
- package/emotion/es/examples/plasma_web/components/Modal/Modal.config.js +1 -1
- package/emotion/es/examples/plasma_web/components/Modal/Modal.stories.tsx +1 -90
- package/emotion/es/examples/plasma_web/components/Switch/Switch.config.js +8 -8
- package/emotion/es/examples/plasma_web/components/Switch/Switch.js +4 -1
- package/emotion/es/examples/plasma_web/components/Switch/Switch.outline.config.js +31 -0
- package/emotion/es/examples/plasma_web/components/Switch/Switch.stories.tsx +33 -1
- package/es/components/Modal/Modal.css +0 -6
- package/es/components/Modal/Modal.js +13 -27
- package/es/components/Modal/Modal.js.map +1 -1
- package/es/components/Modal/Modal.tokens.js +1 -7
- package/es/components/Modal/Modal.tokens.js.map +1 -1
- package/es/components/Switch/Switch.css +2 -2
- package/es/components/Switch/Switch.tokens.js +7 -1
- package/es/components/Switch/Switch.tokens.js.map +1 -1
- package/es/components/Switch/_toggleSize/base.js +1 -1
- package/es/components/Switch/_toggleSize/base.js.map +1 -1
- package/es/components/Switch/_toggleSize/base_38anc0.css +1 -0
- package/es/components/Switch/_view/base.js +1 -1
- package/es/components/Switch/_view/base.js.map +1 -1
- package/es/components/Switch/_view/base_15atbyp.css +1 -0
- package/es/index.css +2 -6
- package/package.json +2 -2
- package/styled-components/cjs/components/Modal/Modal.js +12 -26
- package/styled-components/cjs/components/Modal/Modal.template-doc.mdx +0 -47
- package/styled-components/cjs/components/Modal/Modal.tokens.js +1 -7
- package/styled-components/cjs/components/Switch/Switch.tokens.js +7 -1
- package/styled-components/cjs/components/Switch/_toggleSize/base.js +1 -1
- package/styled-components/cjs/components/Switch/_view/base.js +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/Modal/Modal.config.js +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/Modal/Modal.stories.tsx +1 -90
- package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.config.js +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.js +5 -2
- package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.outline.config.js +37 -0
- package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.stories.tsx +33 -1
- package/styled-components/cjs/examples/plasma_web/components/Modal/Modal.config.js +1 -1
- package/styled-components/cjs/examples/plasma_web/components/Modal/Modal.stories.tsx +1 -90
- package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.config.js +1 -1
- package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.js +5 -2
- package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.outline.config.js +37 -0
- package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.stories.tsx +33 -1
- package/styled-components/es/components/Modal/Modal.js +12 -26
- package/styled-components/es/components/Modal/Modal.template-doc.mdx +0 -47
- package/styled-components/es/components/Modal/Modal.tokens.js +1 -7
- package/styled-components/es/components/Switch/Switch.tokens.js +7 -1
- package/styled-components/es/components/Switch/_toggleSize/base.js +1 -1
- package/styled-components/es/components/Switch/_view/base.js +1 -1
- package/styled-components/es/examples/plasma_b2c/components/Modal/Modal.config.js +1 -1
- package/styled-components/es/examples/plasma_b2c/components/Modal/Modal.stories.tsx +1 -90
- package/styled-components/es/examples/plasma_b2c/components/Switch/Switch.config.js +1 -1
- package/styled-components/es/examples/plasma_b2c/components/Switch/Switch.js +4 -1
- package/styled-components/es/examples/plasma_b2c/components/Switch/Switch.outline.config.js +31 -0
- package/styled-components/es/examples/plasma_b2c/components/Switch/Switch.stories.tsx +33 -1
- package/styled-components/es/examples/plasma_web/components/Modal/Modal.config.js +1 -1
- package/styled-components/es/examples/plasma_web/components/Modal/Modal.stories.tsx +1 -90
- package/styled-components/es/examples/plasma_web/components/Switch/Switch.config.js +1 -1
- package/styled-components/es/examples/plasma_web/components/Switch/Switch.js +4 -1
- package/styled-components/es/examples/plasma_web/components/Switch/Switch.outline.config.js +31 -0
- package/styled-components/es/examples/plasma_web/components/Switch/Switch.stories.tsx +33 -1
- package/types/components/Modal/Modal.d.ts.map +1 -1
- package/types/components/Modal/Modal.tokens.d.ts +0 -6
- package/types/components/Modal/Modal.tokens.d.ts.map +1 -1
- package/types/components/Modal/Modal.types.d.ts +1 -21
- package/types/components/Modal/Modal.types.d.ts.map +1 -1
- package/types/components/Modal/index.d.ts +1 -1
- package/types/components/Modal/index.d.ts.map +1 -1
- package/types/components/Switch/Switch.tokens.d.ts +7 -1
- package/types/components/Switch/Switch.tokens.d.ts.map +1 -1
- package/types/components/Switch/_toggleSize/base.d.ts.map +1 -1
- package/types/components/Switch/_view/base.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Modal/Modal.config.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Modal/Modal.d.ts +1 -7
- package/types/examples/plasma_b2c/components/Modal/Modal.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Switch/Switch.config.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Switch/Switch.d.ts +20 -0
- package/types/examples/plasma_b2c/components/Switch/Switch.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Switch/Switch.outline.config.d.ts +30 -0
- package/types/examples/plasma_b2c/components/Switch/Switch.outline.config.d.ts.map +1 -0
- package/types/examples/plasma_web/components/Modal/Modal.config.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Modal/Modal.d.ts +1 -7
- package/types/examples/plasma_web/components/Modal/Modal.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Switch/Switch.config.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Switch/Switch.d.ts +20 -0
- package/types/examples/plasma_web/components/Switch/Switch.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Switch/Switch.outline.config.d.ts +30 -0
- package/types/examples/plasma_web/components/Switch/Switch.outline.config.d.ts.map +1 -0
- package/cjs/components/Modal/Modal.styles.js +0 -27
- package/cjs/components/Modal/Modal.styles.js.map +0 -1
- package/cjs/components/Modal/Modal.styles_tqsxxy.css +0 -3
- package/cjs/components/Switch/_toggleSize/base_6i0904.css +0 -1
- package/cjs/components/Switch/_view/base_yxkf3s.css +0 -1
- package/emotion/cjs/components/Modal/Modal.styles.js +0 -27
- package/emotion/es/components/Modal/Modal.styles.js +0 -20
- package/es/components/Modal/Modal.styles.js +0 -21
- package/es/components/Modal/Modal.styles.js.map +0 -1
- package/es/components/Modal/Modal.styles_tqsxxy.css +0 -3
- package/es/components/Switch/_toggleSize/base_6i0904.css +0 -1
- package/es/components/Switch/_view/base_yxkf3s.css +0 -1
- package/styled-components/cjs/components/Modal/Modal.styles.js +0 -24
- package/styled-components/es/components/Modal/Modal.styles.js +0 -17
- package/types/components/Modal/Modal.styles.d.ts +0 -5
- package/types/components/Modal/Modal.styles.d.ts.map +0 -1
@@ -4,9 +4,3 @@
|
|
4
4
|
.Popup_styles_gq4luz_p1f40oul__bb610b96{position:var(--p1f40oul-0);z-index:var(--p1f40oul-1);left:var(--p1f40oul-2);right:var(--p1f40oul-3);top:var(--p1f40oul-4);bottom:var(--p1f40oul-5);-webkit-transform:var(--p1f40oul-6);-ms-transform:var(--p1f40oul-6);transform:var(--p1f40oul-6);}
|
5
5
|
|
6
6
|
.Overlay_styles_cxej3y_s1afr8la__70d4dd9a{position:fixed;inset:0;z-index:var(--s1afr8la-0);--plasma_private-overlay-background-color:var(--s1afr8la-1);--plasma_private-overlay-backdrop-filter:var(--s1afr8la-2);background:var(--s1afr8la-3);-webkit-backdrop-filter:var(--s1afr8la-4);backdrop-filter:var(--s1afr8la-4);cursor:var(--s1afr8la-5);}
|
7
|
-
|
8
|
-
.IconRoot_7pl7ig_svvlqhf__32c458a1{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:var(--svvlqhf-0);height:var(--svvlqhf-0);-webkit-flex:0 0 var(--svvlqhf-0);-ms-flex:0 0 var(--svvlqhf-0);flex:0 0 var(--svvlqhf-0);}
|
9
|
-
|
10
|
-
.Modal_styles_tqsxxy_m7npn1w__53552e6a{border-radius:var(--plasma-modal-body-border-radius);padding:var(--plasma-modal-body-padding);background:var(--plasma-modal-body-background);box-shadow:var(--shadow-down-soft-l);}
|
11
|
-
.Modal_styles_tqsxxy_m16phoaz__53552e6a{position:relative;padding:var(--plasma-modal-content-padding);}
|
12
|
-
.Modal_styles_tqsxxy_c5bx5hr__53552e6a{top:0;right:0;width:1.5rem;height:1.5rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;border:none;border-radius:var(--plasma-modal-close-button-radius);padding:0;margin:0;outline:none;cursor:pointer;background:transparent;position:relative;position:absolute;}.Modal_styles_tqsxxy_c5bx5hr__53552e6a::before{content:'';position:absolute;top:-0.125rem;left:-0.125rem;right:-0.125rem;bottom:-0.125rem;z-index:1;display:block;box-sizing:content-box;border:0.063rem solid transparent;border-radius:calc(var(--plasma-modal-close-button-radius) + 0.063rem);-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.Modal_styles_tqsxxy_c5bx5hr__53552e6a.Modal_styles_tqsxxy_focusVisible__53552e6a:focus::before,.Modal_styles_tqsxxy_c5bx5hr__53552e6a[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.063rem var(--plasma-modal-outline-focus-color);}
|
@@ -6,20 +6,17 @@ var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelper
|
|
6
6
|
var React = require('react');
|
7
7
|
var plasmaCore = require('@salutejs/plasma-core');
|
8
8
|
var index = require('../Popup/utils/index.js');
|
9
|
-
var IconClose = require('../_Icon/Icons/IconClose.js');
|
10
9
|
var Modal_tokens = require('./Modal.tokens.js');
|
11
10
|
var base = require('./variations/_view/base.js');
|
12
11
|
var ModalContext = require('./ModalContext.js');
|
13
|
-
var Modal_styles = require('./Modal.styles.js');
|
14
12
|
var useFocusTrap = require('../../hooks/useFocusTrap.js');
|
15
13
|
var PopupContext = require('../Popup/PopupContext.js');
|
16
14
|
var useModal = require('./hooks/useModal.js');
|
15
|
+
var Overlay = require('../Overlay/Overlay.js');
|
17
16
|
var common = require('../../engines/common.js');
|
18
17
|
var Popup$1 = require('../Popup/Popup.js');
|
19
|
-
var Overlay = require('../Overlay/Overlay.js');
|
20
18
|
|
21
|
-
var
|
22
|
-
var _excluded = ["id", "withAnimation", "onClose", "onOverlayClick", "onEscKeyDown", "closeOnEsc", "closeOnOverlayClick", "withBlur", "initialFocusRef", "focusAfterRef", "zIndex", "popupInfo", "children", "view", "opened", "isOpen", "hasBody", "hasClose"];
|
19
|
+
var _excluded = ["id", "withAnimation", "onClose", "onOverlayClick", "onEscKeyDown", "closeOnEsc", "closeOnOverlayClick", "withBlur", "initialFocusRef", "focusAfterRef", "zIndex", "popupInfo", "children", "view", "opened", "isOpen"];
|
23
20
|
|
24
21
|
// issue #823
|
25
22
|
var Popup = /*#__PURE__*/common.component(Popup$1.popupConfig);
|
@@ -48,11 +45,8 @@ var modalRoot = function modalRoot(Root) {
|
|
48
45
|
view = _ref.view,
|
49
46
|
opened = _ref.opened,
|
50
47
|
isOpen = _ref.isOpen,
|
51
|
-
hasBody = _ref.hasBody,
|
52
|
-
hasClose = _ref.hasClose,
|
53
48
|
rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
|
54
49
|
var innerIsOpen = Boolean(isOpen || opened);
|
55
|
-
var innerHasClose = hasClose === undefined && hasBody || hasClose;
|
56
50
|
var trapRef = useFocusTrap.useFocusTrap(true, initialFocusRef, focusAfterRef, true);
|
57
51
|
var popupController = PopupContext.usePopupContext();
|
58
52
|
var innerRef = plasmaCore.useForkRef(trapRef, outerRootRef);
|
@@ -80,15 +74,6 @@ var modalRoot = function modalRoot(Root) {
|
|
80
74
|
onClose();
|
81
75
|
}
|
82
76
|
}, [closeOnOverlayClick, onOverlayClick, onClose]);
|
83
|
-
var overlayNode = /*#__PURE__*/React.createElement(Overlay.Overlay, {
|
84
|
-
className: Modal_tokens.classes.overlay,
|
85
|
-
zIndex: zIndex || index.DEFAULT_Z_INDEX,
|
86
|
-
backgroundColorProperty: overlayBackgroundToken,
|
87
|
-
withBlur: withBlur,
|
88
|
-
transparent: transparent,
|
89
|
-
isClickable: closeOnOverlayClick,
|
90
|
-
onOverlayClick: onModalOverlayKeyDown
|
91
|
-
});
|
92
77
|
return /*#__PURE__*/React.createElement(Popup, _rollupPluginBabelHelpers.extends({
|
93
78
|
id: innerId,
|
94
79
|
opened: innerIsOpen,
|
@@ -96,17 +81,18 @@ var modalRoot = function modalRoot(Root) {
|
|
96
81
|
popupInfo: modalInfo,
|
97
82
|
withAnimation: withAnimation,
|
98
83
|
zIndex: zIndex,
|
99
|
-
overlay:
|
84
|
+
overlay: /*#__PURE__*/React.createElement(Root, {
|
100
85
|
view: view
|
101
|
-
},
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
86
|
+
}, /*#__PURE__*/React.createElement(Overlay.Overlay, {
|
87
|
+
className: Modal_tokens.classes.overlay,
|
88
|
+
zIndex: zIndex || index.DEFAULT_Z_INDEX,
|
89
|
+
backgroundColorProperty: overlayBackgroundToken,
|
90
|
+
withBlur: withBlur,
|
91
|
+
transparent: transparent,
|
92
|
+
isClickable: closeOnOverlayClick,
|
93
|
+
onOverlayClick: onModalOverlayKeyDown
|
94
|
+
}))
|
95
|
+
}, rest), children);
|
110
96
|
});
|
111
97
|
};
|
112
98
|
var modalConfig = {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from 'react';\nimport { useForkRef, safeUseId } from '@salutejs/plasma-core';\n\nimport { RootProps, component } from '../../engines';\nimport { popupConfig, usePopupContext } from '../Popup';\nimport { Overlay } from '../Overlay';\nimport { DEFAULT_Z_INDEX } from '../Popup/utils';\nimport { useFocusTrap } from '../../hooks';\nimport { IconClose } from '../_Icon/Icons/IconClose';\n\nimport { classes, tokens } from './Modal.tokens';\nimport { ModalProps } from './Modal.types';\nimport { useModal } from './hooks';\nimport { base as viewCSS } from './variations/_view/base';\nimport { getIdLastModal } from './ModalContext';\nimport { CloseButton, ModalBody, ModalContent } from './Modal.styles';\n\n// issue #823\nconst Popup = component(popupConfig);\n\n/**\n * Modal.\n * Управляет показом/скрытием, подложкой и анимацией визуальной части модального окна.\n */\nexport const modalRoot = (Root: RootProps<HTMLDivElement, ModalProps>) =>\n forwardRef<HTMLDivElement, ModalProps>(\n (\n {\n id,\n withAnimation,\n onClose,\n onOverlayClick,\n onEscKeyDown,\n closeOnEsc = true,\n closeOnOverlayClick = true,\n withBlur,\n initialFocusRef,\n focusAfterRef,\n zIndex,\n popupInfo,\n children,\n view,\n opened,\n isOpen,\n hasBody,\n hasClose,\n ...rest\n },\n outerRootRef,\n ) => {\n const innerIsOpen = Boolean(isOpen || opened);\n const innerHasClose = (hasClose === undefined && hasBody) || hasClose;\n const trapRef = useFocusTrap(true, initialFocusRef, focusAfterRef, true);\n const popupController = usePopupContext();\n\n const innerRef = useForkRef<HTMLDivElement>(trapRef, outerRootRef);\n\n const uniqId = safeUseId();\n const innerId = id || uniqId;\n const overlayBackgroundToken = withBlur\n ? `var(${tokens.modalOverlayWithBlurColor})`\n : `var(${tokens.modalOverlayColor})`;\n\n const { modalInfo } = useModal({\n id: innerId,\n isOpen: innerIsOpen,\n closeOnEsc,\n onEscKeyDown,\n onClose,\n popupInfo,\n });\n\n const transparent = useMemo(() => getIdLastModal(popupController.items) !== innerId, [\n innerId,\n popupController.items,\n ]);\n\n const onModalOverlayKeyDown = useCallback(\n (event: React.MouseEvent<HTMLDivElement>) => {\n if (onOverlayClick) {\n onOverlayClick(event);\n return;\n }\n\n if (onClose) {\n onClose();\n }\n },\n [closeOnOverlayClick, onOverlayClick, onClose],\n );\n\n const overlayNode = (\n <Overlay\n className={classes.overlay}\n zIndex={zIndex || DEFAULT_Z_INDEX}\n backgroundColorProperty={overlayBackgroundToken}\n withBlur={withBlur}\n transparent={transparent}\n isClickable={closeOnOverlayClick}\n onOverlayClick={onModalOverlayKeyDown}\n />\n );\n\n return (\n <Popup\n id={innerId}\n opened={innerIsOpen}\n ref={innerRef}\n popupInfo={modalInfo}\n withAnimation={withAnimation}\n zIndex={zIndex}\n overlay={hasBody ? overlayNode : <Root view={view}>{overlayNode}</Root>}\n {...rest}\n >\n {hasBody ? (\n <Root view={view}>\n <ModalBody>\n <ModalContent>\n {innerHasClose && (\n <CloseButton onClick={onClose} data-test=\"modal-close\">\n <IconClose size=\"s\" />\n </CloseButton>\n )}\n {children}\n </ModalContent>\n </ModalBody>\n </Root>\n ) : (\n <>{children}</>\n )}\n </Popup>\n );\n },\n );\n\nexport const modalConfig = {\n name: 'Modal',\n tag: 'div',\n layout: modalRoot,\n base: '',\n variations: {\n view: {\n css: viewCSS,\n },\n },\n defaults: {\n view: 'default',\n },\n};\n"],"names":["Popup","component","popupConfig","modalRoot","Root","forwardRef","_ref","outerRootRef","id","withAnimation","onClose","onOverlayClick","onEscKeyDown","_ref$closeOnEsc","closeOnEsc","_ref$closeOnOverlayCl","closeOnOverlayClick","withBlur","initialFocusRef","focusAfterRef","zIndex","popupInfo","children","view","opened","isOpen","hasBody","hasClose","rest","_objectWithoutProperties","_excluded","innerIsOpen","Boolean","innerHasClose","undefined","trapRef","useFocusTrap","popupController","usePopupContext","innerRef","useForkRef","uniqId","safeUseId","innerId","overlayBackgroundToken","concat","tokens","modalOverlayWithBlurColor","modalOverlayColor","_useModal","useModal","modalInfo","transparent","useMemo","getIdLastModal","items","onModalOverlayKeyDown","useCallback","event","overlayNode","React","createElement","Overlay","className","classes","overlay","DEFAULT_Z_INDEX","backgroundColorProperty","isClickable","_extends","ref","ModalBody","ModalContent","CloseButton","onClick","_IconClose","IconClose","size","Fragment","modalConfig","name","tag","layout","base","variations","css","viewCSS","defaults"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from 'react';\nimport { useForkRef, safeUseId } from '@salutejs/plasma-core';\n\nimport { RootProps, component } from '../../engines';\nimport { popupConfig, usePopupContext } from '../Popup';\nimport { Overlay } from '../Overlay';\nimport { DEFAULT_Z_INDEX } from '../Popup/utils';\nimport { useFocusTrap } from '../../hooks';\n\nimport { classes, tokens } from './Modal.tokens';\nimport { ModalProps } from './Modal.types';\nimport { useModal } from './hooks';\nimport { base as viewCSS } from './variations/_view/base';\nimport { getIdLastModal } from './ModalContext';\n\n// issue #823\nconst Popup = component(popupConfig);\n\n/**\n * Modal.\n * Управляет показом/скрытием, подложкой и анимацией визуальной части модального окна.\n */\nexport const modalRoot = (Root: RootProps<HTMLDivElement, ModalProps>) =>\n forwardRef<HTMLDivElement, ModalProps>(\n (\n {\n id,\n withAnimation,\n onClose,\n onOverlayClick,\n onEscKeyDown,\n closeOnEsc = true,\n closeOnOverlayClick = true,\n withBlur,\n initialFocusRef,\n focusAfterRef,\n zIndex,\n popupInfo,\n children,\n view,\n opened,\n isOpen,\n ...rest\n },\n outerRootRef,\n ) => {\n const innerIsOpen = Boolean(isOpen || opened);\n const trapRef = useFocusTrap(true, initialFocusRef, focusAfterRef, true);\n const popupController = usePopupContext();\n\n const innerRef = useForkRef<HTMLDivElement>(trapRef, outerRootRef);\n\n const uniqId = safeUseId();\n const innerId = id || uniqId;\n const overlayBackgroundToken = withBlur\n ? `var(${tokens.modalOverlayWithBlurColor})`\n : `var(${tokens.modalOverlayColor})`;\n\n const { modalInfo } = useModal({\n id: innerId,\n isOpen: innerIsOpen,\n closeOnEsc,\n onEscKeyDown,\n onClose,\n popupInfo,\n });\n\n const transparent = useMemo(() => getIdLastModal(popupController.items) !== innerId, [\n innerId,\n popupController.items,\n ]);\n\n const onModalOverlayKeyDown = useCallback(\n (event: React.MouseEvent<HTMLDivElement>) => {\n if (onOverlayClick) {\n onOverlayClick(event);\n return;\n }\n\n if (onClose) {\n onClose();\n }\n },\n [closeOnOverlayClick, onOverlayClick, onClose],\n );\n\n return (\n <Popup\n id={innerId}\n opened={innerIsOpen}\n ref={innerRef}\n popupInfo={modalInfo}\n withAnimation={withAnimation}\n zIndex={zIndex}\n overlay={\n <Root view={view}>\n <Overlay\n className={classes.overlay}\n zIndex={zIndex || DEFAULT_Z_INDEX}\n backgroundColorProperty={overlayBackgroundToken}\n withBlur={withBlur}\n transparent={transparent}\n isClickable={closeOnOverlayClick}\n onOverlayClick={onModalOverlayKeyDown}\n />\n </Root>\n }\n {...rest}\n >\n {children}\n </Popup>\n );\n },\n );\n\nexport const modalConfig = {\n name: 'Modal',\n tag: 'div',\n layout: modalRoot,\n base: '',\n variations: {\n view: {\n css: viewCSS,\n },\n },\n defaults: {\n view: 'default',\n },\n};\n"],"names":["Popup","component","popupConfig","modalRoot","Root","forwardRef","_ref","outerRootRef","id","withAnimation","onClose","onOverlayClick","onEscKeyDown","_ref$closeOnEsc","closeOnEsc","_ref$closeOnOverlayCl","closeOnOverlayClick","withBlur","initialFocusRef","focusAfterRef","zIndex","popupInfo","children","view","opened","isOpen","rest","_objectWithoutProperties","_excluded","innerIsOpen","Boolean","trapRef","useFocusTrap","popupController","usePopupContext","innerRef","useForkRef","uniqId","safeUseId","innerId","overlayBackgroundToken","concat","tokens","modalOverlayWithBlurColor","modalOverlayColor","_useModal","useModal","modalInfo","transparent","useMemo","getIdLastModal","items","onModalOverlayKeyDown","useCallback","event","React","createElement","_extends","ref","overlay","Overlay","className","classes","DEFAULT_Z_INDEX","backgroundColorProperty","isClickable","modalConfig","name","tag","layout","base","variations","css","viewCSS","defaults"],"mappings":"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"}
|
@@ -10,13 +10,7 @@ var classes = {
|
|
10
10
|
};
|
11
11
|
var tokens = {
|
12
12
|
modalOverlayWithBlurColor: '--plasma-modal-overlay-with-blur-color',
|
13
|
-
modalOverlayColor: '--plasma-modal-overlay-color'
|
14
|
-
modalBodyBackground: '--plasma-modal-body-background',
|
15
|
-
modalBodyBorderRadius: '--plasma-modal-body-border-radius',
|
16
|
-
modalBodyPadding: '--plasma-modal-body-padding',
|
17
|
-
modalContentPadding: '--plasma-modal-content-padding',
|
18
|
-
modalOutlineFocusColor: '--plasma-modal-outline-focus-color',
|
19
|
-
modalCloseButtonRadius: '--plasma-modal-close-button-radius'
|
13
|
+
modalOverlayColor: '--plasma-modal-overlay-color'
|
20
14
|
};
|
21
15
|
|
22
16
|
exports.classes = classes;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Modal.tokens.js","sources":["../../../src/components/Modal/Modal.tokens.ts"],"sourcesContent":["export const classes = {\n /*\n * Класс компонента ModalOverlay\n */\n overlay: 'modal-overlay',\n};\n\nexport const tokens = {\n modalOverlayWithBlurColor: '--plasma-modal-overlay-with-blur-color',\n modalOverlayColor: '--plasma-modal-overlay-color',\n
|
1
|
+
{"version":3,"file":"Modal.tokens.js","sources":["../../../src/components/Modal/Modal.tokens.ts"],"sourcesContent":["export const classes = {\n /*\n * Класс компонента ModalOverlay\n */\n overlay: 'modal-overlay',\n};\n\nexport const tokens = {\n modalOverlayWithBlurColor: '--plasma-modal-overlay-with-blur-color',\n modalOverlayColor: '--plasma-modal-overlay-color',\n};\n"],"names":["classes","overlay","tokens","modalOverlayWithBlurColor","modalOverlayColor"],"mappings":";;;;AAAO,IAAMA,OAAO,GAAG;AACnB;AACJ;AACA;AACIC,EAAAA,OAAO,EAAE,eAAA;AACb,EAAC;AAEM,IAAMC,MAAM,GAAG;AAClBC,EAAAA,yBAAyB,EAAE,wCAAwC;AACnEC,EAAAA,iBAAiB,EAAE,8BAAA;AACvB;;;;;"}
|
@@ -1,8 +1,8 @@
|
|
1
1
|
.base_1tcl212_bm1v11h__e2c572a3 .base_1tcl212_s10fscgc__e2c572a3{font-family:var(--plasma-switch-font-family);font-style:var(--plasma-switch-font-style);font-weight:var(--plasma-switch-font-weight);-webkit-letter-spacing:var(--plasma-switch-letter-spacing);-moz-letter-spacing:var(--plasma-switch-letter-spacing);-ms-letter-spacing:var(--plasma-switch-letter-spacing);letter-spacing:var(--plasma-switch-letter-spacing);line-height:var(--plasma-switch-line-height);font-size:var(--plasma-switch-font-size);}.base_1tcl212_bm1v11h__e2c572a3 .base_1tcl212_sdjnckq__e2c572a3{font-family:var(--plasma-switch-description-font-family);font-style:var(--plasma-switch-description-font-style);font-weight:var(--plasma-switch-description-font-weight);-webkit-letter-spacing:var(--plasma-switch-description-letter-spacing);-moz-letter-spacing:var(--plasma-switch-description-letter-spacing);-ms-letter-spacing:var(--plasma-switch-description-letter-spacing);letter-spacing:var(--plasma-switch-description-letter-spacing);line-height:var(--plasma-switch-description-line-height);font-size:var(--plasma-switch-description-font-size);}.base_1tcl212_bm1v11h__e2c572a3 .base_1tcl212_s1ilr5eq__e2c572a3{margin:var(--plasma_private-switch__label-offset,0);}
|
2
2
|
|
3
|
-
.
|
3
|
+
.base_38anc0_b1wld3h3__c7ee3abe .base_38anc0_s2cs3kf__c7ee3abe{--plasma_private-thumbSize:calc(var(--plasma-switch__thumb-size) - (2 * var(--plasma-switch__track-border)));box-sizing:border-box;-webkit-flex:0 0 var(--plasma-switch__track-width);-ms-flex:0 0 var(--plasma-switch__track-width);flex:0 0 var(--plasma-switch__track-width);border-style:solid;border-width:var(--plasma-switch__track-border);border-radius:var(--plasma-switch__track-border-radius);width:var(--plasma-switch__track-width);height:var(--plasma-switch__track-height);}.base_38anc0_b1wld3h3__c7ee3abe .base_38anc0_s2cs3kf__c7ee3abe::after{width:var(--plasma_private-thumbSize);height:var(--plasma_private-thumbSize);border-radius:var(--plasma-switch__thumb-border-radius);margin:auto var(--plasma-switch__thumb-offset);}.base_38anc0_b1wld3h3__c7ee3abe:active:not([disabled]) .base_38anc0_s2cs3kf__c7ee3abe::after{width:calc(var(--plasma-switch__thumb-size) * var(--plasma-switch__thumb-scale,1));}
|
4
4
|
|
5
|
-
.
|
5
|
+
.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_s2cs3kf__64acd499{background-color:var(--plasma-switch__track_checked_false-bg-color);border-color:var(--plasma-switch__track-checked_false-border-color);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:not([disabled]) ~ .base_15atbyp_s2cs3kf__64acd499:hover{background-color:var(--plasma-switch__track_checked_false_hovered_true-bg-color,var(--plasma-switch__track_checked_false-bg-color));border-color:var(--plasma-switch__track-checked_false_hovered_true-border-color,var(--plasma-switch__track-checked_false-border-color));}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:checked ~ .base_15atbyp_s2cs3kf__64acd499{background-color:var(--plasma-switch__track_checked_true-bg-color);border-color:var(--plasma-switch__track-checked_true-border-color);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:checked:not([disabled]) ~ .base_15atbyp_s2cs3kf__64acd499:hover{background-color:var(--plasma-switch__track_checked_true_hovered_true-bg-color,var(--plasma-switch__track_checked_true-bg-color));border-color:var(--plasma-switch__track-checked_true_hovered_true-border-color,var(--plasma-switch__track-checked_true-border-color));}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_s2cs3kf__64acd499::after{background-color:var(--plasma-switch__thumb-checked_false-bg-color);box-shadow:var(--plasma-switch__thumb-box-shadow);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:checked ~ .base_15atbyp_s2cs3kf__64acd499::after{background-color:var(--plasma-switch__thumb_checked_true-bg-color);box-shadow:var(--plasma-switch__thumb-box-shadow_checked_true,var(--plasma-switch__thumb-box-shadow));}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_s1ilr5eq__64acd499{color:var(--plasma-switch__label-color);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_sdjnckq__64acd499{color:var(--plasma-switch__description-color);}
|
6
6
|
|
7
7
|
.base_sz3n0x_bvwxj2r__a36bed54 .base_sz3n0x_s2cs3kf__a36bed54::before{content:'';position:absolute;inset:-0.125rem;display:block;box-sizing:content-box;border-radius:calc(0.125rem + var(--plasma-switch__track-border-radius));border:0.125rem solid transparent;pointer-events:none;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;}.base_sz3n0x_bvwxj2r__a36bed54 .base_sz3n0x_ssthlx1__a36bed54.base_sz3n0x_focusVisible__a36bed54 ~ .base_sz3n0x_s2cs3kf__a36bed54::before{box-shadow:0 0 0 0.125rem var(--plasma-switch__track-focus-color);}
|
8
8
|
|
@@ -27,6 +27,11 @@ var tokens = {
|
|
27
27
|
verticalGap: '--plasma-switch-vertical-gap',
|
28
28
|
trackWidth: '--plasma-switch__track-width',
|
29
29
|
trackHeight: '--plasma-switch__track-height',
|
30
|
+
trackBorderWidth: '--plasma-switch__track-border',
|
31
|
+
trackBorderColorOn: '--plasma-switch__track-checked_true-border-color',
|
32
|
+
trackBorderColorOnHover: '--plasma-switch__track-checked_true_hovered_true-border-color',
|
33
|
+
trackBorderColorOff: '--plasma-switch__track-checked_false-border-color',
|
34
|
+
trackBorderColorOffHover: '--plasma-switch__track-checked_false_hovered_true-border-color',
|
30
35
|
trackBorderRadius: '--plasma-switch__track-border-radius',
|
31
36
|
// NOTE: could be intersection with checked
|
32
37
|
trackBackgroundColorOn: '--plasma-switch__track_checked_true-bg-color',
|
@@ -38,7 +43,8 @@ var tokens = {
|
|
38
43
|
thumbOffset: '--plasma-switch__thumb-offset',
|
39
44
|
thumbBorderRadius: '--plasma-switch__thumb-border-radius',
|
40
45
|
thumbPressScale: '--plasma-switch__thumb-scale',
|
41
|
-
|
46
|
+
thumbBackgroundColorOn: '--plasma-switch__thumb_checked_true-bg-color',
|
47
|
+
thumbBackgroundColorOff: '--plasma-switch__thumb-checked_false-bg-color',
|
42
48
|
thumbBoxShadow: '--plasma-switch__thumb-box-shadow',
|
43
49
|
thumbBoxShadowOn: '--plasma-switch__thumb-box-shadow_checked_true',
|
44
50
|
labelOffsetPrivate: '--plasma_private-switch__label-offset'
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Switch.tokens.js","sources":["../../../src/components/Switch/Switch.tokens.ts"],"sourcesContent":["export const tokens = {\n fontFamily: '--plasma-switch-font-family',\n fontStyle: '--plasma-switch-font-style',\n fontSize: '--plasma-switch-font-size',\n fontWeight: '--plasma-switch-font-weight',\n letterSpacing: '--plasma-switch-letter-spacing',\n lineHeight: '--plasma-switch-line-height',\n\n /* Токены description */\n descriptionFontFamily: '--plasma-switch-description-font-family',\n descriptionFontStyle: '--plasma-switch-description-font-style',\n descriptionFontSize: '--plasma-switch-description-font-size',\n descriptionFontWeight: '--plasma-switch-description-font-weight',\n descriptionLetterSpacing: '--plasma-switch-description-letter-spacing',\n descriptionLineHeight: '--plasma-switch-description-line-height',\n\n /* Цвет подписи */\n labelColor: '--plasma-switch__label-color',\n labelOffset: '--plasma-switch__label-offset',\n\n /* Цвет описания */\n descriptionColor: '--plasma-switch__description-color',\n descriptionOffset: '--plasma-switch__description-offset',\n\n /** Прозрачность для всего компонента в состоянии disabled */\n disabledOpacity: '--plasma-switch-disabled-opacity',\n\n verticalGap: '--plasma-switch-vertical-gap',\n trackWidth: '--plasma-switch__track-width',\n trackHeight: '--plasma-switch__track-height',\n trackBorderRadius: '--plasma-switch__track-border-radius',\n // NOTE: could be intersection with checked\n trackBackgroundColorOn: '--plasma-switch__track_checked_true-bg-color',\n trackBackgroundColorOnHover: '--plasma-switch__track_checked_true_hovered_true-bg-color',\n trackBackgroundColorOff: '--plasma-switch__track_checked_false-bg-color',\n trackBackgroundColorOffHover: '--plasma-switch__track_checked_false_hovered_true-bg-color',\n\n trackFocusColor: '--plasma-switch__track-focus-color',\n\n thumbSize: '--plasma-switch__thumb-size',\n thumbOffset: '--plasma-switch__thumb-offset',\n thumbBorderRadius: '--plasma-switch__thumb-border-radius',\n\n thumbPressScale: '--plasma-switch__thumb-scale',\n\n
|
1
|
+
{"version":3,"file":"Switch.tokens.js","sources":["../../../src/components/Switch/Switch.tokens.ts"],"sourcesContent":["export const tokens = {\n fontFamily: '--plasma-switch-font-family',\n fontStyle: '--plasma-switch-font-style',\n fontSize: '--plasma-switch-font-size',\n fontWeight: '--plasma-switch-font-weight',\n letterSpacing: '--plasma-switch-letter-spacing',\n lineHeight: '--plasma-switch-line-height',\n\n /* Токены description */\n descriptionFontFamily: '--plasma-switch-description-font-family',\n descriptionFontStyle: '--plasma-switch-description-font-style',\n descriptionFontSize: '--plasma-switch-description-font-size',\n descriptionFontWeight: '--plasma-switch-description-font-weight',\n descriptionLetterSpacing: '--plasma-switch-description-letter-spacing',\n descriptionLineHeight: '--plasma-switch-description-line-height',\n\n /* Цвет подписи */\n labelColor: '--plasma-switch__label-color',\n labelOffset: '--plasma-switch__label-offset',\n\n /* Цвет описания */\n descriptionColor: '--plasma-switch__description-color',\n descriptionOffset: '--plasma-switch__description-offset',\n\n /** Прозрачность для всего компонента в состоянии disabled */\n disabledOpacity: '--plasma-switch-disabled-opacity',\n\n verticalGap: '--plasma-switch-vertical-gap',\n trackWidth: '--plasma-switch__track-width',\n trackHeight: '--plasma-switch__track-height',\n trackBorderWidth: '--plasma-switch__track-border',\n trackBorderColorOn: '--plasma-switch__track-checked_true-border-color',\n trackBorderColorOnHover: '--plasma-switch__track-checked_true_hovered_true-border-color',\n trackBorderColorOff: '--plasma-switch__track-checked_false-border-color',\n trackBorderColorOffHover: '--plasma-switch__track-checked_false_hovered_true-border-color',\n\n trackBorderRadius: '--plasma-switch__track-border-radius',\n // NOTE: could be intersection with checked\n trackBackgroundColorOn: '--plasma-switch__track_checked_true-bg-color',\n trackBackgroundColorOnHover: '--plasma-switch__track_checked_true_hovered_true-bg-color',\n trackBackgroundColorOff: '--plasma-switch__track_checked_false-bg-color',\n trackBackgroundColorOffHover: '--plasma-switch__track_checked_false_hovered_true-bg-color',\n\n trackFocusColor: '--plasma-switch__track-focus-color',\n\n thumbSize: '--plasma-switch__thumb-size',\n thumbOffset: '--plasma-switch__thumb-offset',\n thumbBorderRadius: '--plasma-switch__thumb-border-radius',\n\n thumbPressScale: '--plasma-switch__thumb-scale',\n\n thumbBackgroundColorOn: '--plasma-switch__thumb_checked_true-bg-color',\n thumbBackgroundColorOff: '--plasma-switch__thumb-checked_false-bg-color',\n thumbBoxShadow: '--plasma-switch__thumb-box-shadow',\n thumbBoxShadowOn: '--plasma-switch__thumb-box-shadow_checked_true',\n\n labelOffsetPrivate: '--plasma_private-switch__label-offset',\n};\n\nexport const classes = {\n beforeSwitchLabelPosition: 'switch-label-position-before',\n afterSwitchLabelPosition: 'switch-label-position-after',\n};\n"],"names":["tokens","fontFamily","fontStyle","fontSize","fontWeight","letterSpacing","lineHeight","descriptionFontFamily","descriptionFontStyle","descriptionFontSize","descriptionFontWeight","descriptionLetterSpacing","descriptionLineHeight","labelColor","labelOffset","descriptionColor","descriptionOffset","disabledOpacity","verticalGap","trackWidth","trackHeight","trackBorderWidth","trackBorderColorOn","trackBorderColorOnHover","trackBorderColorOff","trackBorderColorOffHover","trackBorderRadius","trackBackgroundColorOn","trackBackgroundColorOnHover","trackBackgroundColorOff","trackBackgroundColorOffHover","trackFocusColor","thumbSize","thumbOffset","thumbBorderRadius","thumbPressScale","thumbBackgroundColorOn","thumbBackgroundColorOff","thumbBoxShadow","thumbBoxShadowOn","labelOffsetPrivate","classes","beforeSwitchLabelPosition","afterSwitchLabelPosition"],"mappings":";;;;AAAO,IAAMA,MAAM,GAAG;AAClBC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,SAAS,EAAE,4BAA4B;AACvCC,EAAAA,QAAQ,EAAE,2BAA2B;AACrCC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,aAAa,EAAE,gCAAgC;AAC/CC,EAAAA,UAAU,EAAE,6BAA6B;AAEzC;AACAC,EAAAA,qBAAqB,EAAE,yCAAyC;AAChEC,EAAAA,oBAAoB,EAAE,wCAAwC;AAC9DC,EAAAA,mBAAmB,EAAE,uCAAuC;AAC5DC,EAAAA,qBAAqB,EAAE,yCAAyC;AAChEC,EAAAA,wBAAwB,EAAE,4CAA4C;AACtEC,EAAAA,qBAAqB,EAAE,yCAAyC;AAEhE;AACAC,EAAAA,UAAU,EAAE,8BAA8B;AAC1CC,EAAAA,WAAW,EAAE,+BAA+B;AAE5C;AACAC,EAAAA,gBAAgB,EAAE,oCAAoC;AACtDC,EAAAA,iBAAiB,EAAE,qCAAqC;AAExD;AACAC,EAAAA,eAAe,EAAE,kCAAkC;AAEnDC,EAAAA,WAAW,EAAE,8BAA8B;AAC3CC,EAAAA,UAAU,EAAE,8BAA8B;AAC1CC,EAAAA,WAAW,EAAE,+BAA+B;AAC5CC,EAAAA,gBAAgB,EAAE,+BAA+B;AACjDC,EAAAA,kBAAkB,EAAE,kDAAkD;AACtEC,EAAAA,uBAAuB,EAAE,+DAA+D;AACxFC,EAAAA,mBAAmB,EAAE,mDAAmD;AACxEC,EAAAA,wBAAwB,EAAE,gEAAgE;AAE1FC,EAAAA,iBAAiB,EAAE,sCAAsC;AACzD;AACAC,EAAAA,sBAAsB,EAAE,8CAA8C;AACtEC,EAAAA,2BAA2B,EAAE,2DAA2D;AACxFC,EAAAA,uBAAuB,EAAE,+CAA+C;AACxEC,EAAAA,4BAA4B,EAAE,4DAA4D;AAE1FC,EAAAA,eAAe,EAAE,oCAAoC;AAErDC,EAAAA,SAAS,EAAE,6BAA6B;AACxCC,EAAAA,WAAW,EAAE,+BAA+B;AAC5CC,EAAAA,iBAAiB,EAAE,sCAAsC;AAEzDC,EAAAA,eAAe,EAAE,8BAA8B;AAE/CC,EAAAA,sBAAsB,EAAE,8CAA8C;AACtEC,EAAAA,uBAAuB,EAAE,+CAA+C;AACxEC,EAAAA,cAAc,EAAE,mCAAmC;AACnDC,EAAAA,gBAAgB,EAAE,gDAAgD;AAElEC,EAAAA,kBAAkB,EAAE,uCAAA;AACxB,EAAC;AAEM,IAAMC,OAAO,GAAG;AACnBC,EAAAA,yBAAyB,EAAE,8BAA8B;AACzDC,EAAAA,wBAAwB,EAAE,6BAAA;AAC9B;;;;;"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"base.js","sources":["../../../../src/components/Switch/_toggleSize/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../Switch.tokens';\nimport { StyledTrigger } from '../Switch.styles';\n\nexport const base = css`\n ${StyledTrigger} {\n
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../src/components/Switch/_toggleSize/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../Switch.tokens';\nimport { StyledTrigger } from '../Switch.styles';\n\nexport const base = css`\n ${StyledTrigger} {\n --plasma_private-thumbSize: calc(var(${tokens.thumbSize}) - (2 * var(${tokens.trackBorderWidth})));\n\n box-sizing: border-box;\n flex: 0 0 var(${tokens.trackWidth});\n\n border-style: solid;\n border-width: var(${tokens.trackBorderWidth});\n border-radius: var(${tokens.trackBorderRadius});\n\n width: var(${tokens.trackWidth});\n height: var(${tokens.trackHeight});\n\n &::after {\n width: var(--plasma_private-thumbSize);\n height: var(--plasma_private-thumbSize);\n border-radius: var(${tokens.thumbBorderRadius});\n margin: auto var(${tokens.thumbOffset});\n }\n }\n\n :active:not([disabled]) ${StyledTrigger}::after {\n width: calc(var(${tokens.thumbSize}) * var(${tokens.thumbPressScale}, 1));\n }\n`;\n"],"names":["base"],"mappings":";;;;AAKO,IAAMA,IAAI,GAyBhB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.b1wld3h3 .s2cs3kf{--plasma_private-thumbSize:calc(var(--plasma-switch__thumb-size) - (2 * var(--plasma-switch__track-border)));box-sizing:border-box;-webkit-flex:0 0 var(--plasma-switch__track-width);-ms-flex:0 0 var(--plasma-switch__track-width);flex:0 0 var(--plasma-switch__track-width);border-style:solid;border-width:var(--plasma-switch__track-border);border-radius:var(--plasma-switch__track-border-radius);width:var(--plasma-switch__track-width);height:var(--plasma-switch__track-height);}.b1wld3h3 .s2cs3kf::after{width:var(--plasma_private-thumbSize);height:var(--plasma_private-thumbSize);border-radius:var(--plasma-switch__thumb-border-radius);margin:auto var(--plasma-switch__thumb-offset);}.b1wld3h3:active:not([disabled]) .s2cs3kf::after{width:calc(var(--plasma-switch__thumb-size) * var(--plasma-switch__thumb-scale,1));}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"base.js","sources":["../../../../src/components/Switch/_view/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../Switch.tokens';\nimport { StyledTrigger, StyledInput, StyledLabel, StyledDescription } from '../Switch.styles';\n\nexport const base = css`\n ${StyledTrigger} {\n background-color: var(${tokens.trackBackgroundColorOff});\n }\n\n ${StyledInput}:not([disabled]) ~ ${StyledTrigger}:hover {\n background-color: var(${tokens.trackBackgroundColorOffHover}, var(${tokens.trackBackgroundColorOff}));\n }\n\n ${StyledInput}:checked ~ ${StyledTrigger} {\n background-color: var(${tokens.trackBackgroundColorOn});\n }\n\n ${StyledInput}:checked:not([disabled]) ~ ${StyledTrigger}:hover {\n background-color: var(${tokens.trackBackgroundColorOnHover}, var(${tokens.trackBackgroundColorOn}));\n }\n\n ${StyledTrigger}::after {\n background-color: var(${tokens.
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../src/components/Switch/_view/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../Switch.tokens';\nimport { StyledTrigger, StyledInput, StyledLabel, StyledDescription } from '../Switch.styles';\n\nexport const base = css`\n ${StyledTrigger} {\n background-color: var(${tokens.trackBackgroundColorOff});\n border-color: var(${tokens.trackBorderColorOff});\n }\n\n ${StyledInput}:not([disabled]) ~ ${StyledTrigger}:hover {\n background-color: var(${tokens.trackBackgroundColorOffHover}, var(${tokens.trackBackgroundColorOff}));\n border-color: var(${tokens.trackBorderColorOffHover}, var(${tokens.trackBorderColorOff}));\n }\n\n ${StyledInput}:checked ~ ${StyledTrigger} {\n background-color: var(${tokens.trackBackgroundColorOn});\n border-color: var(${tokens.trackBorderColorOn});\n }\n\n ${StyledInput}:checked:not([disabled]) ~ ${StyledTrigger}:hover {\n background-color: var(${tokens.trackBackgroundColorOnHover}, var(${tokens.trackBackgroundColorOn}));\n border-color: var(${tokens.trackBorderColorOnHover}, var(${tokens.trackBorderColorOn}));\n }\n\n ${StyledTrigger}::after {\n background-color: var(${tokens.thumbBackgroundColorOff});\n box-shadow: var(${tokens.thumbBoxShadow});\n }\n\n ${StyledInput}:checked ~ ${StyledTrigger}::after {\n background-color: var(${tokens.thumbBackgroundColorOn});\n box-shadow: var(${tokens.thumbBoxShadowOn}, var(${tokens.thumbBoxShadow}));\n }\n\n ${StyledLabel} {\n color: var(${tokens.labelColor});\n }\n\n ${StyledDescription} {\n color: var(${tokens.descriptionColor});\n }\n`;\n"],"names":["base"],"mappings":";;;;AAKO,IAAMA,IAAI,GAsChB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.b1g0jmh3 .s2cs3kf{background-color:var(--plasma-switch__track_checked_false-bg-color);border-color:var(--plasma-switch__track-checked_false-border-color);}.b1g0jmh3 .ssthlx1:not([disabled]) ~ .s2cs3kf:hover{background-color:var(--plasma-switch__track_checked_false_hovered_true-bg-color,var(--plasma-switch__track_checked_false-bg-color));border-color:var(--plasma-switch__track-checked_false_hovered_true-border-color,var(--plasma-switch__track-checked_false-border-color));}.b1g0jmh3 .ssthlx1:checked ~ .s2cs3kf{background-color:var(--plasma-switch__track_checked_true-bg-color);border-color:var(--plasma-switch__track-checked_true-border-color);}.b1g0jmh3 .ssthlx1:checked:not([disabled]) ~ .s2cs3kf:hover{background-color:var(--plasma-switch__track_checked_true_hovered_true-bg-color,var(--plasma-switch__track_checked_true-bg-color));border-color:var(--plasma-switch__track-checked_true_hovered_true-border-color,var(--plasma-switch__track-checked_true-border-color));}.b1g0jmh3 .s2cs3kf::after{background-color:var(--plasma-switch__thumb-checked_false-bg-color);box-shadow:var(--plasma-switch__thumb-box-shadow);}.b1g0jmh3 .ssthlx1:checked ~ .s2cs3kf::after{background-color:var(--plasma-switch__thumb_checked_true-bg-color);box-shadow:var(--plasma-switch__thumb-box-shadow_checked_true,var(--plasma-switch__thumb-box-shadow));}.b1g0jmh3 .s1ilr5eq{color:var(--plasma-switch__label-color);}.b1g0jmh3 .sdjnckq{color:var(--plasma-switch__description-color);}
|
package/cjs/index.css
CHANGED
@@ -215,9 +215,9 @@
|
|
215
215
|
|
216
216
|
.base_1tcl212_bm1v11h__e2c572a3 .base_1tcl212_s10fscgc__e2c572a3{font-family:var(--plasma-switch-font-family);font-style:var(--plasma-switch-font-style);font-weight:var(--plasma-switch-font-weight);-webkit-letter-spacing:var(--plasma-switch-letter-spacing);-moz-letter-spacing:var(--plasma-switch-letter-spacing);-ms-letter-spacing:var(--plasma-switch-letter-spacing);letter-spacing:var(--plasma-switch-letter-spacing);line-height:var(--plasma-switch-line-height);font-size:var(--plasma-switch-font-size);}.base_1tcl212_bm1v11h__e2c572a3 .base_1tcl212_sdjnckq__e2c572a3{font-family:var(--plasma-switch-description-font-family);font-style:var(--plasma-switch-description-font-style);font-weight:var(--plasma-switch-description-font-weight);-webkit-letter-spacing:var(--plasma-switch-description-letter-spacing);-moz-letter-spacing:var(--plasma-switch-description-letter-spacing);-ms-letter-spacing:var(--plasma-switch-description-letter-spacing);letter-spacing:var(--plasma-switch-description-letter-spacing);line-height:var(--plasma-switch-description-line-height);font-size:var(--plasma-switch-description-font-size);}.base_1tcl212_bm1v11h__e2c572a3 .base_1tcl212_s1ilr5eq__e2c572a3{margin:var(--plasma_private-switch__label-offset,0);}
|
217
217
|
|
218
|
-
.
|
218
|
+
.base_38anc0_b1wld3h3__c7ee3abe .base_38anc0_s2cs3kf__c7ee3abe{--plasma_private-thumbSize:calc(var(--plasma-switch__thumb-size) - (2 * var(--plasma-switch__track-border)));box-sizing:border-box;-webkit-flex:0 0 var(--plasma-switch__track-width);-ms-flex:0 0 var(--plasma-switch__track-width);flex:0 0 var(--plasma-switch__track-width);border-style:solid;border-width:var(--plasma-switch__track-border);border-radius:var(--plasma-switch__track-border-radius);width:var(--plasma-switch__track-width);height:var(--plasma-switch__track-height);}.base_38anc0_b1wld3h3__c7ee3abe .base_38anc0_s2cs3kf__c7ee3abe::after{width:var(--plasma_private-thumbSize);height:var(--plasma_private-thumbSize);border-radius:var(--plasma-switch__thumb-border-radius);margin:auto var(--plasma-switch__thumb-offset);}.base_38anc0_b1wld3h3__c7ee3abe:active:not([disabled]) .base_38anc0_s2cs3kf__c7ee3abe::after{width:calc(var(--plasma-switch__thumb-size) * var(--plasma-switch__thumb-scale,1));}
|
219
219
|
|
220
|
-
.
|
220
|
+
.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_s2cs3kf__64acd499{background-color:var(--plasma-switch__track_checked_false-bg-color);border-color:var(--plasma-switch__track-checked_false-border-color);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:not([disabled]) ~ .base_15atbyp_s2cs3kf__64acd499:hover{background-color:var(--plasma-switch__track_checked_false_hovered_true-bg-color,var(--plasma-switch__track_checked_false-bg-color));border-color:var(--plasma-switch__track-checked_false_hovered_true-border-color,var(--plasma-switch__track-checked_false-border-color));}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:checked ~ .base_15atbyp_s2cs3kf__64acd499{background-color:var(--plasma-switch__track_checked_true-bg-color);border-color:var(--plasma-switch__track-checked_true-border-color);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:checked:not([disabled]) ~ .base_15atbyp_s2cs3kf__64acd499:hover{background-color:var(--plasma-switch__track_checked_true_hovered_true-bg-color,var(--plasma-switch__track_checked_true-bg-color));border-color:var(--plasma-switch__track-checked_true_hovered_true-border-color,var(--plasma-switch__track-checked_true-border-color));}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_s2cs3kf__64acd499::after{background-color:var(--plasma-switch__thumb-checked_false-bg-color);box-shadow:var(--plasma-switch__thumb-box-shadow);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:checked ~ .base_15atbyp_s2cs3kf__64acd499::after{background-color:var(--plasma-switch__thumb_checked_true-bg-color);box-shadow:var(--plasma-switch__thumb-box-shadow_checked_true,var(--plasma-switch__thumb-box-shadow));}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_s1ilr5eq__64acd499{color:var(--plasma-switch__label-color);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_sdjnckq__64acd499{color:var(--plasma-switch__description-color);}
|
221
221
|
|
222
222
|
.base_sz3n0x_bvwxj2r__a36bed54 .base_sz3n0x_s2cs3kf__a36bed54::before{content:'';position:absolute;inset:-0.125rem;display:block;box-sizing:content-box;border-radius:calc(0.125rem + var(--plasma-switch__track-border-radius));border:0.125rem solid transparent;pointer-events:none;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;}.base_sz3n0x_bvwxj2r__a36bed54 .base_sz3n0x_ssthlx1__a36bed54.base_sz3n0x_focusVisible__a36bed54 ~ .base_sz3n0x_s2cs3kf__a36bed54::before{box-shadow:0 0 0 0.125rem var(--plasma-switch__track-focus-color);}
|
223
223
|
|
@@ -336,10 +336,6 @@
|
|
336
336
|
.Popup_styles_gq4luz_p5u7tqa__bb610b96{position:relative;max-width:100%;pointer-events:all;}
|
337
337
|
.Popup_styles_gq4luz_p1f40oul__bb610b96{position:var(--p1f40oul-0);z-index:var(--p1f40oul-1);left:var(--p1f40oul-2);right:var(--p1f40oul-3);top:var(--p1f40oul-4);bottom:var(--p1f40oul-5);-webkit-transform:var(--p1f40oul-6);-ms-transform:var(--p1f40oul-6);transform:var(--p1f40oul-6);}
|
338
338
|
|
339
|
-
.Modal_styles_tqsxxy_m7npn1w__53552e6a{border-radius:var(--plasma-modal-body-border-radius);padding:var(--plasma-modal-body-padding);background:var(--plasma-modal-body-background);box-shadow:var(--shadow-down-soft-l);}
|
340
|
-
.Modal_styles_tqsxxy_m16phoaz__53552e6a{position:relative;padding:var(--plasma-modal-content-padding);}
|
341
|
-
.Modal_styles_tqsxxy_c5bx5hr__53552e6a{top:0;right:0;width:1.5rem;height:1.5rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;border:none;border-radius:var(--plasma-modal-close-button-radius);padding:0;margin:0;outline:none;cursor:pointer;background:transparent;position:relative;position:absolute;}.Modal_styles_tqsxxy_c5bx5hr__53552e6a::before{content:'';position:absolute;top:-0.125rem;left:-0.125rem;right:-0.125rem;bottom:-0.125rem;z-index:1;display:block;box-sizing:content-box;border:0.063rem solid transparent;border-radius:calc(var(--plasma-modal-close-button-radius) + 0.063rem);-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.Modal_styles_tqsxxy_c5bx5hr__53552e6a.Modal_styles_tqsxxy_focusVisible__53552e6a:focus::before,.Modal_styles_tqsxxy_c5bx5hr__53552e6a[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.063rem var(--plasma-modal-outline-focus-color);}
|
342
|
-
|
343
339
|
.NotificationsPortal_6417q6_s19gbs9t__4166aeb6 > .NotificationsPortal_6417q6_popupBaseRoot__4166aeb6{overflow:hidden;}
|
344
340
|
|
345
341
|
.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea{width:var(--plasma-notification-width);padding:var(--plasma-notification-padding);}.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea.base_qkc3i4_notificationLayoutHorizontal__4791b7ea{padding:var(--plasma-notification-horizontal-layout-padding);}.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea.base_qkc3i4_notificationLayoutHorizontal__4791b7ea.base_qkc3i4_notificationWithoutCloseIcon__4791b7ea{padding-right:var(--plasma-notification-horizontal-layout-right-padding-without-close-icon);}.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea.base_qkc3i4_notificationLayoutHorizontal__4791b7ea.base_qkc3i4_notificationOneLineTextbox__4791b7ea{padding:var(--plasma-notification-padding-one-line-textbox);}
|
@@ -12,14 +12,11 @@ var _Popup = /*#__PURE__*/require("../Popup");
|
|
12
12
|
var _Overlay = /*#__PURE__*/require("../Overlay");
|
13
13
|
var _utils = /*#__PURE__*/require("../Popup/utils");
|
14
14
|
var _hooks = /*#__PURE__*/require("../../hooks");
|
15
|
-
var _IconClose2 = /*#__PURE__*/require("../_Icon/Icons/IconClose");
|
16
15
|
var _Modal = /*#__PURE__*/require("./Modal.tokens");
|
17
16
|
var _hooks2 = /*#__PURE__*/require("./hooks");
|
18
17
|
var _base = /*#__PURE__*/require("./variations/_view/base");
|
19
18
|
var _ModalContext = /*#__PURE__*/require("./ModalContext");
|
20
|
-
var
|
21
|
-
var _IconClose;
|
22
|
-
var _excluded = ["id", "withAnimation", "onClose", "onOverlayClick", "onEscKeyDown", "closeOnEsc", "closeOnOverlayClick", "withBlur", "initialFocusRef", "focusAfterRef", "zIndex", "popupInfo", "children", "view", "opened", "isOpen", "hasBody", "hasClose"];
|
19
|
+
var _excluded = ["id", "withAnimation", "onClose", "onOverlayClick", "onEscKeyDown", "closeOnEsc", "closeOnOverlayClick", "withBlur", "initialFocusRef", "focusAfterRef", "zIndex", "popupInfo", "children", "view", "opened", "isOpen"];
|
23
20
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
24
21
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
25
22
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
@@ -52,11 +49,8 @@ var modalRoot = exports.modalRoot = function modalRoot(Root) {
|
|
52
49
|
view = _ref.view,
|
53
50
|
opened = _ref.opened,
|
54
51
|
isOpen = _ref.isOpen,
|
55
|
-
hasBody = _ref.hasBody,
|
56
|
-
hasClose = _ref.hasClose,
|
57
52
|
rest = _objectWithoutProperties(_ref, _excluded);
|
58
53
|
var innerIsOpen = Boolean(isOpen || opened);
|
59
|
-
var innerHasClose = hasClose === undefined && hasBody || hasClose;
|
60
54
|
var trapRef = (0, _hooks.useFocusTrap)(true, initialFocusRef, focusAfterRef, true);
|
61
55
|
var popupController = (0, _Popup.usePopupContext)();
|
62
56
|
var innerRef = (0, _plasmaCore.useForkRef)(trapRef, outerRootRef);
|
@@ -84,15 +78,6 @@ var modalRoot = exports.modalRoot = function modalRoot(Root) {
|
|
84
78
|
onClose();
|
85
79
|
}
|
86
80
|
}, [closeOnOverlayClick, onOverlayClick, onClose]);
|
87
|
-
var overlayNode = /*#__PURE__*/_react["default"].createElement(_Overlay.Overlay, {
|
88
|
-
className: _Modal.classes.overlay,
|
89
|
-
zIndex: zIndex || _utils.DEFAULT_Z_INDEX,
|
90
|
-
backgroundColorProperty: overlayBackgroundToken,
|
91
|
-
withBlur: withBlur,
|
92
|
-
transparent: transparent,
|
93
|
-
isClickable: closeOnOverlayClick,
|
94
|
-
onOverlayClick: onModalOverlayKeyDown
|
95
|
-
});
|
96
81
|
return /*#__PURE__*/_react["default"].createElement(Popup, _extends({
|
97
82
|
id: innerId,
|
98
83
|
opened: innerIsOpen,
|
@@ -100,17 +85,18 @@ var modalRoot = exports.modalRoot = function modalRoot(Root) {
|
|
100
85
|
popupInfo: modalInfo,
|
101
86
|
withAnimation: withAnimation,
|
102
87
|
zIndex: zIndex,
|
103
|
-
overlay:
|
88
|
+
overlay: /*#__PURE__*/_react["default"].createElement(Root, {
|
104
89
|
view: view
|
105
|
-
},
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
90
|
+
}, /*#__PURE__*/_react["default"].createElement(_Overlay.Overlay, {
|
91
|
+
className: _Modal.classes.overlay,
|
92
|
+
zIndex: zIndex || _utils.DEFAULT_Z_INDEX,
|
93
|
+
backgroundColorProperty: overlayBackgroundToken,
|
94
|
+
withBlur: withBlur,
|
95
|
+
transparent: transparent,
|
96
|
+
isClickable: closeOnOverlayClick,
|
97
|
+
onOverlayClick: onModalOverlayKeyDown
|
98
|
+
}))
|
99
|
+
}, rest), children);
|
114
100
|
});
|
115
101
|
};
|
116
102
|
var modalConfig = exports.modalConfig = {
|
@@ -62,53 +62,6 @@ export function App() {
|
|
62
62
|
}
|
63
63
|
```
|
64
64
|
|
65
|
-
## Использование стилизованной обертки
|
66
|
-
|
67
|
-
Для использования стилизованного мобального окна с отступами и крестиком для закрытия, добавьте свойство `hasBody`.
|
68
|
-
```tsx live
|
69
|
-
import React, { useState } from 'react';
|
70
|
-
import { SSRProvider, Button, Modal, PopupProvider } from '@salutejs/{{ package }}';
|
71
|
-
|
72
|
-
export function App() {
|
73
|
-
const [isOpenA, setIsOpenA] = useState(false);
|
74
|
-
const [isOpenB, setIsOpenB] = useState(false);
|
75
|
-
|
76
|
-
return (
|
77
|
-
<SSRProvider>
|
78
|
-
<PopupProvider>
|
79
|
-
<div style=\{{ height: "300px" }}>
|
80
|
-
<div style=\{{ display: 'flex', flexDirection: 'column' }}>
|
81
|
-
<Button text="Открыть A" onClick={() => setIsOpenA(true)} />
|
82
|
-
</div>
|
83
|
-
<Modal
|
84
|
-
id="modalA"
|
85
|
-
onClose={() => setIsOpenA(false)}
|
86
|
-
opened={isOpenA}
|
87
|
-
placement="center"
|
88
|
-
offset={[0, 0]}
|
89
|
-
hasBody
|
90
|
-
>
|
91
|
-
<Button onClick={() => setIsOpenA(false)}>Close</Button>
|
92
|
-
<Button text="Открыть B" onClick={() => setIsOpenB(true)} />
|
93
|
-
Content
|
94
|
-
<Modal
|
95
|
-
id="modalB"
|
96
|
-
onClose={() => setIsOpenB(false)}
|
97
|
-
opened={isOpenB}
|
98
|
-
placement="right"
|
99
|
-
offset={[0, 0]}
|
100
|
-
>
|
101
|
-
<Button onClick={() => setIsOpenB(false)}>Close</Button>
|
102
|
-
Content
|
103
|
-
</Modal>
|
104
|
-
</Modal>
|
105
|
-
</div>
|
106
|
-
</PopupProvider>
|
107
|
-
</SSRProvider>
|
108
|
-
);
|
109
|
-
}
|
110
|
-
```
|
111
|
-
|
112
65
|
## Подключение анимации
|
113
66
|
Подключение анимации аналогично тому, как это происходит в `Popup` - через свойство `withAnimation`(управление через `popupClasses`, `modalClasses`).
|
114
67
|
Для добавления анимации в оверлей необходимо использовать класс `.modal-overlay` через переменную `modalClasses.overlay` из пакета.
|
@@ -12,11 +12,5 @@ var classes = exports.classes = {
|
|
12
12
|
};
|
13
13
|
var tokens = exports.tokens = {
|
14
14
|
modalOverlayWithBlurColor: '--plasma-modal-overlay-with-blur-color',
|
15
|
-
modalOverlayColor: '--plasma-modal-overlay-color'
|
16
|
-
modalBodyBackground: '--plasma-modal-body-background',
|
17
|
-
modalBodyBorderRadius: '--plasma-modal-body-border-radius',
|
18
|
-
modalBodyPadding: '--plasma-modal-body-padding',
|
19
|
-
modalContentPadding: '--plasma-modal-content-padding',
|
20
|
-
modalOutlineFocusColor: '--plasma-modal-outline-focus-color',
|
21
|
-
modalCloseButtonRadius: '--plasma-modal-close-button-radius'
|
15
|
+
modalOverlayColor: '--plasma-modal-overlay-color'
|
22
16
|
};
|
@@ -29,6 +29,11 @@ var tokens = exports.tokens = {
|
|
29
29
|
verticalGap: '--plasma-switch-vertical-gap',
|
30
30
|
trackWidth: '--plasma-switch__track-width',
|
31
31
|
trackHeight: '--plasma-switch__track-height',
|
32
|
+
trackBorderWidth: '--plasma-switch__track-border',
|
33
|
+
trackBorderColorOn: '--plasma-switch__track-checked_true-border-color',
|
34
|
+
trackBorderColorOnHover: '--plasma-switch__track-checked_true_hovered_true-border-color',
|
35
|
+
trackBorderColorOff: '--plasma-switch__track-checked_false-border-color',
|
36
|
+
trackBorderColorOffHover: '--plasma-switch__track-checked_false_hovered_true-border-color',
|
32
37
|
trackBorderRadius: '--plasma-switch__track-border-radius',
|
33
38
|
// NOTE: could be intersection with checked
|
34
39
|
trackBackgroundColorOn: '--plasma-switch__track_checked_true-bg-color',
|
@@ -40,7 +45,8 @@ var tokens = exports.tokens = {
|
|
40
45
|
thumbOffset: '--plasma-switch__thumb-offset',
|
41
46
|
thumbBorderRadius: '--plasma-switch__thumb-border-radius',
|
42
47
|
thumbPressScale: '--plasma-switch__thumb-scale',
|
43
|
-
|
48
|
+
thumbBackgroundColorOn: '--plasma-switch__thumb_checked_true-bg-color',
|
49
|
+
thumbBackgroundColorOff: '--plasma-switch__thumb-checked_false-bg-color',
|
44
50
|
thumbBoxShadow: '--plasma-switch__thumb-box-shadow',
|
45
51
|
thumbBoxShadowOn: '--plasma-switch__thumb-box-shadow_checked_true',
|
46
52
|
labelOffsetPrivate: '--plasma_private-switch__label-offset'
|
@@ -7,4 +7,4 @@ exports.base = void 0;
|
|
7
7
|
var _react = /*#__PURE__*/require("@emotion/react");
|
8
8
|
var _Switch = /*#__PURE__*/require("../Switch.tokens");
|
9
9
|
var _Switch2 = /*#__PURE__*/require("../Switch.styles");
|
10
|
-
var base = exports.base = /*#__PURE__*/(0, _react.css)(_Switch2.StyledTrigger, "{
|
10
|
+
var base = exports.base = /*#__PURE__*/(0, _react.css)(_Switch2.StyledTrigger, "{--plasma_private-thumbSize:calc(var(", _Switch.tokens.thumbSize, ") - (2 * var(", _Switch.tokens.trackBorderWidth, ")));box-sizing:border-box;flex:0 0 var(", _Switch.tokens.trackWidth, ");border-style:solid;border-width:var(", _Switch.tokens.trackBorderWidth, ");border-radius:var(", _Switch.tokens.trackBorderRadius, ");width:var(", _Switch.tokens.trackWidth, ");height:var(", _Switch.tokens.trackHeight, ");&::after{width:var(--plasma_private-thumbSize);height:var(--plasma_private-thumbSize);border-radius:var(", _Switch.tokens.thumbBorderRadius, ");margin:auto var(", _Switch.tokens.thumbOffset, ");}}:active:not([disabled]) ", _Switch2.StyledTrigger, "::after{width:calc(var(", _Switch.tokens.thumbSize, ") * var(", _Switch.tokens.thumbPressScale, ", 1));};label:plasma-new-hope__base;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3dpdGNoL190b2dnbGVTaXplL2Jhc2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS3VCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3dpdGNoL190b2dnbGVTaXplL2Jhc2UudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmltcG9ydCB7IHRva2VucyB9IGZyb20gJy4uL1N3aXRjaC50b2tlbnMnO1xuaW1wb3J0IHsgU3R5bGVkVHJpZ2dlciB9IGZyb20gJy4uL1N3aXRjaC5zdHlsZXMnO1xuXG5leHBvcnQgY29uc3QgYmFzZSA9IGNzc2BcbiAgICAke1N0eWxlZFRyaWdnZXJ9IHtcbiAgICAgICAgLS1wbGFzbWFfcHJpdmF0ZS10aHVtYlNpemU6IGNhbGModmFyKCR7dG9rZW5zLnRodW1iU2l6ZX0pIC0gKDIgKiB2YXIoJHt0b2tlbnMudHJhY2tCb3JkZXJXaWR0aH0pKSk7XG5cbiAgICAgICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgICAgICAgZmxleDogMCAwIHZhcigke3Rva2Vucy50cmFja1dpZHRofSk7XG5cbiAgICAgICAgYm9yZGVyLXN0eWxlOiBzb2xpZDtcbiAgICAgICAgYm9yZGVyLXdpZHRoOiB2YXIoJHt0b2tlbnMudHJhY2tCb3JkZXJXaWR0aH0pO1xuICAgICAgICBib3JkZXItcmFkaXVzOiB2YXIoJHt0b2tlbnMudHJhY2tCb3JkZXJSYWRpdXN9KTtcblxuICAgICAgICB3aWR0aDogdmFyKCR7dG9rZW5zLnRyYWNrV2lkdGh9KTtcbiAgICAgICAgaGVpZ2h0OiB2YXIoJHt0b2tlbnMudHJhY2tIZWlnaHR9KTtcblxuICAgICAgICAmOjphZnRlciB7XG4gICAgICAgICAgICB3aWR0aDogdmFyKC0tcGxhc21hX3ByaXZhdGUtdGh1bWJTaXplKTtcbiAgICAgICAgICAgIGhlaWdodDogdmFyKC0tcGxhc21hX3ByaXZhdGUtdGh1bWJTaXplKTtcbiAgICAgICAgICAgIGJvcmRlci1yYWRpdXM6IHZhcigke3Rva2Vucy50aHVtYkJvcmRlclJhZGl1c30pO1xuICAgICAgICAgICAgbWFyZ2luOiBhdXRvIHZhcigke3Rva2Vucy50aHVtYk9mZnNldH0pO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgOmFjdGl2ZTpub3QoW2Rpc2FibGVkXSkgJHtTdHlsZWRUcmlnZ2VyfTo6YWZ0ZXIge1xuICAgICAgICB3aWR0aDogY2FsYyh2YXIoJHt0b2tlbnMudGh1bWJTaXplfSkgKiB2YXIoJHt0b2tlbnMudGh1bWJQcmVzc1NjYWxlfSwgMSkpO1xuICAgIH1cbmA7XG4iXX0= */"));
|
@@ -7,4 +7,4 @@ exports.base = void 0;
|
|
7
7
|
var _react = /*#__PURE__*/require("@emotion/react");
|
8
8
|
var _Switch = /*#__PURE__*/require("../Switch.tokens");
|
9
9
|
var _Switch2 = /*#__PURE__*/require("../Switch.styles");
|
10
|
-
var base = exports.base = /*#__PURE__*/(0, _react.css)(_Switch2.StyledTrigger, "{background-color:var(", _Switch.tokens.trackBackgroundColorOff, ");}", _Switch2.StyledInput, ":not([disabled])~", _Switch2.StyledTrigger, ":hover{background-color:var(", _Switch.tokens.trackBackgroundColorOffHover, ", var(", _Switch.tokens.trackBackgroundColorOff, "));}", _Switch2.StyledInput, ":checked~", _Switch2.StyledTrigger, "{background-color:var(", _Switch.tokens.trackBackgroundColorOn, ");}", _Switch2.StyledInput, ":checked:not([disabled])~", _Switch2.StyledTrigger, ":hover{background-color:var(", _Switch.tokens.trackBackgroundColorOnHover, ", var(", _Switch.tokens.trackBackgroundColorOn, "));}", _Switch2.StyledTrigger, "::after{background-color:var(", _Switch.tokens.
|
10
|
+
var base = exports.base = /*#__PURE__*/(0, _react.css)(_Switch2.StyledTrigger, "{background-color:var(", _Switch.tokens.trackBackgroundColorOff, ");border-color:var(", _Switch.tokens.trackBorderColorOff, ");}", _Switch2.StyledInput, ":not([disabled])~", _Switch2.StyledTrigger, ":hover{background-color:var(", _Switch.tokens.trackBackgroundColorOffHover, ", var(", _Switch.tokens.trackBackgroundColorOff, "));border-color:var(", _Switch.tokens.trackBorderColorOffHover, ", var(", _Switch.tokens.trackBorderColorOff, "));}", _Switch2.StyledInput, ":checked~", _Switch2.StyledTrigger, "{background-color:var(", _Switch.tokens.trackBackgroundColorOn, ");border-color:var(", _Switch.tokens.trackBorderColorOn, ");}", _Switch2.StyledInput, ":checked:not([disabled])~", _Switch2.StyledTrigger, ":hover{background-color:var(", _Switch.tokens.trackBackgroundColorOnHover, ", var(", _Switch.tokens.trackBackgroundColorOn, "));border-color:var(", _Switch.tokens.trackBorderColorOnHover, ", var(", _Switch.tokens.trackBorderColorOn, "));}", _Switch2.StyledTrigger, "::after{background-color:var(", _Switch.tokens.thumbBackgroundColorOff, ");box-shadow:var(", _Switch.tokens.thumbBoxShadow, ");}", _Switch2.StyledInput, ":checked~", _Switch2.StyledTrigger, "::after{background-color:var(", _Switch.tokens.thumbBackgroundColorOn, ");box-shadow:var(", _Switch.tokens.thumbBoxShadowOn, ", var(", _Switch.tokens.thumbBoxShadow, "));}", _Switch2.StyledLabel, "{color:var(", _Switch.tokens.labelColor, ");}", _Switch2.StyledDescription, "{color:var(", _Switch.tokens.descriptionColor, ");};label:plasma-new-hope__base;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3dpdGNoL192aWV3L2Jhc2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS3VCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3dpdGNoL192aWV3L2Jhc2UudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmltcG9ydCB7IHRva2VucyB9IGZyb20gJy4uL1N3aXRjaC50b2tlbnMnO1xuaW1wb3J0IHsgU3R5bGVkVHJpZ2dlciwgU3R5bGVkSW5wdXQsIFN0eWxlZExhYmVsLCBTdHlsZWREZXNjcmlwdGlvbiB9IGZyb20gJy4uL1N3aXRjaC5zdHlsZXMnO1xuXG5leHBvcnQgY29uc3QgYmFzZSA9IGNzc2BcbiAgICAke1N0eWxlZFRyaWdnZXJ9IHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQmFja2dyb3VuZENvbG9yT2ZmfSk7XG4gICAgICAgIGJvcmRlci1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQm9yZGVyQ29sb3JPZmZ9KTtcbiAgICB9XG5cbiAgICAke1N0eWxlZElucHV0fTpub3QoW2Rpc2FibGVkXSkgfiAke1N0eWxlZFRyaWdnZXJ9OmhvdmVyIHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQmFja2dyb3VuZENvbG9yT2ZmSG92ZXJ9LCB2YXIoJHt0b2tlbnMudHJhY2tCYWNrZ3JvdW5kQ29sb3JPZmZ9KSk7XG4gICAgICAgIGJvcmRlci1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQm9yZGVyQ29sb3JPZmZIb3Zlcn0sIHZhcigke3Rva2Vucy50cmFja0JvcmRlckNvbG9yT2ZmfSkpO1xuICAgIH1cblxuICAgICR7U3R5bGVkSW5wdXR9OmNoZWNrZWQgfiAke1N0eWxlZFRyaWdnZXJ9IHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQmFja2dyb3VuZENvbG9yT259KTtcbiAgICAgICAgYm9yZGVyLWNvbG9yOiB2YXIoJHt0b2tlbnMudHJhY2tCb3JkZXJDb2xvck9ufSk7XG4gICAgfVxuXG4gICAgJHtTdHlsZWRJbnB1dH06Y2hlY2tlZDpub3QoW2Rpc2FibGVkXSkgfiAke1N0eWxlZFRyaWdnZXJ9OmhvdmVyICB7XG4gICAgICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigke3Rva2Vucy50cmFja0JhY2tncm91bmRDb2xvck9uSG92ZXJ9LCB2YXIoJHt0b2tlbnMudHJhY2tCYWNrZ3JvdW5kQ29sb3JPbn0pKTtcbiAgICAgICAgYm9yZGVyLWNvbG9yOiB2YXIoJHt0b2tlbnMudHJhY2tCb3JkZXJDb2xvck9uSG92ZXJ9LCB2YXIoJHt0b2tlbnMudHJhY2tCb3JkZXJDb2xvck9ufSkpO1xuICAgIH1cblxuICAgICR7U3R5bGVkVHJpZ2dlcn06OmFmdGVyIHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKCR7dG9rZW5zLnRodW1iQmFja2dyb3VuZENvbG9yT2ZmfSk7XG4gICAgICAgIGJveC1zaGFkb3c6IHZhcigke3Rva2Vucy50aHVtYkJveFNoYWRvd30pO1xuICAgIH1cblxuICAgICR7U3R5bGVkSW5wdXR9OmNoZWNrZWQgfiAke1N0eWxlZFRyaWdnZXJ9OjphZnRlciB7XG4gICAgICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigke3Rva2Vucy50aHVtYkJhY2tncm91bmRDb2xvck9ufSk7XG4gICAgICAgIGJveC1zaGFkb3c6IHZhcigke3Rva2Vucy50aHVtYkJveFNoYWRvd09ufSwgdmFyKCR7dG9rZW5zLnRodW1iQm94U2hhZG93fSkpO1xuICAgIH1cblxuICAgICR7U3R5bGVkTGFiZWx9IHtcbiAgICAgICAgY29sb3I6IHZhcigke3Rva2Vucy5sYWJlbENvbG9yfSk7XG4gICAgfVxuXG4gICAgJHtTdHlsZWREZXNjcmlwdGlvbn0ge1xuICAgICAgICBjb2xvcjogdmFyKCR7dG9rZW5zLmRlc2NyaXB0aW9uQ29sb3J9KTtcbiAgICB9XG5gO1xuIl19 */"));
|
@@ -12,7 +12,7 @@ var config = exports.config = {
|
|
12
12
|
},
|
13
13
|
variations: {
|
14
14
|
view: {
|
15
|
-
"default": /*#__PURE__*/(0, _react.css)(_Modal.modalTokens.modalOverlayWithBlurColor, ":var(--overlay-blur);", _Modal.modalTokens.modalOverlayColor, ":var(--overlay-soft)
|
15
|
+
"default": /*#__PURE__*/(0, _react.css)(_Modal.modalTokens.modalOverlayWithBlurColor, ":var(--overlay-blur);", _Modal.modalTokens.modalOverlayColor, ":var(--overlay-soft);;label:plasma-new-hope__default;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2V4YW1wbGVzL3BsYXNtYV9iMmMvY29tcG9uZW50cy9Nb2RhbC9Nb2RhbC5jb25maWcudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBVXdCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2V4YW1wbGVzL3BsYXNtYV9iMmMvY29tcG9uZW50cy9Nb2RhbC9Nb2RhbC5jb25maWcudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmltcG9ydCB7IG1vZGFsVG9rZW5zIH0gZnJvbSAnLi4vLi4vLi4vLi4vY29tcG9uZW50cy9Nb2RhbCc7XG5cbmV4cG9ydCBjb25zdCBjb25maWcgPSB7XG4gICAgZGVmYXVsdHM6IHtcbiAgICAgICAgdmlldzogJ2RlZmF1bHQnLFxuICAgIH0sXG4gICAgdmFyaWF0aW9uczoge1xuICAgICAgICB2aWV3OiB7XG4gICAgICAgICAgICBkZWZhdWx0OiBjc3NgXG4gICAgICAgICAgICAgICAgJHttb2RhbFRva2Vucy5tb2RhbE92ZXJsYXlXaXRoQmx1ckNvbG9yfTogdmFyKC0tb3ZlcmxheS1ibHVyKTtcbiAgICAgICAgICAgICAgICAke21vZGFsVG9rZW5zLm1vZGFsT3ZlcmxheUNvbG9yfTogdmFyKC0tb3ZlcmxheS1zb2Z0KTtcbiAgICAgICAgICAgIGAsXG4gICAgICAgIH0sXG4gICAgfSxcbn07XG4iXX0= */"))
|
16
16
|
}
|
17
17
|
}
|
18
18
|
};
|