@salutejs/plasma-new-hope 0.116.1-canary.1345.10274146329.0 → 0.116.1-canary.1346.10269858402.0

package/emotion/es/hooks/index.js

@@ -1,5 +1,4 @@
 export { useUniqId } from './useUniqId';
-export { useFocusTrap } from './useFocusTrap';
 export { usePreviousValue } from './usePreviousValue';
 export { useForceUpdate } from './useForceUpdate';
 export { useDidMountEffect } from './useDidMountEffect';

package/es/components/Modal/Modal.js

@@ -1,14 +1,12 @@
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React, { forwardRef, useMemo, useCallback } from 'react';
-import { useForkRef, safeUseId } from '@salutejs/plasma-core';
+import { useFocusTrap, useForkRef, safeUseId } from '@salutejs/plasma-core';
 import '@linaria/core';
 import { component } from '../../engines/common.js';
 import { usePopupContext } from '../Popup/PopupContext.js';
 import { popupConfig } from '../Popup/Popup.js';
 import { Overlay } from '../Overlay/Overlay.js';
 import { DEFAULT_Z_INDEX } from '../Popup/utils/index.js';
-import { useFocusTrap } from '../../hooks/useFocusTrap.js';
-import '../../utils/react.js';
 import { classes, tokens } from './Modal.tokens.js';
 import { useModal } from './hooks/useModal.js';
 import { base } from './variations/_view/base.js';
@@ -43,7 +41,7 @@ var modalRoot = function modalRoot(Root) {
       view = _ref.view,
       isOpen = _ref.isOpen,
       rest = _objectWithoutProperties(_ref, _excluded);
-    var trapRef = useFocusTrap(true, initialFocusRef, focusAfterRef, true);
+    var trapRef = useFocusTrap(true, initialFocusRef, focusAfterRef);
     var popupController = usePopupContext();
     var innerRef = useForkRef(trapRef, outerRootRef);
     var uniqId = safeUseId();

package/es/components/Modal/Modal.js.map

@@ -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';\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                isOpen,\n                ...rest\n            },\n            outerRootRef,\n        ) => {\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({ id: innerId, isOpen, closeOnEsc, onEscKeyDown, onClose, popupInfo });\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                    isOpen={isOpen}\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","isOpen","rest","_objectWithoutProperties","_excluded","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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"}
+{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from 'react';\nimport { useFocusTrap, 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';\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                isOpen,\n                ...rest\n            },\n            outerRootRef,\n        ) => {\n            const trapRef = useFocusTrap(true, initialFocusRef, focusAfterRef);\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({ id: innerId, isOpen, closeOnEsc, onEscKeyDown, onClose, popupInfo });\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                    isOpen={isOpen}\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","isOpen","rest","_objectWithoutProperties","_excluded","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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"}

package/es/index.js

@@ -11,7 +11,6 @@ export { applySkeletonGradient, getSkeletonColor } from './mixins/applySkeletonG
 export { applyDisabled } from './mixins/applyDisabled.js';
 export { css } from './engines/index.js';
 export { useUniqId } from './hooks/useUniqId.js';
-export { useFocusTrap } from './hooks/useFocusTrap.js';
 export { usePreviousValue } from './hooks/usePreviousValue.js';
 export { useForceUpdate } from './hooks/useForceUpdate.js';
 export { useDidMountEffect } from './hooks/useDidMountEffect.js';

package/es/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salutejs/plasma-new-hope",
-  "version": "0.116.1-canary.1345.10274146329.0",
+  "version": "0.116.1-canary.1346.10269858402.0",
   "description": "Salute Design System blueprint",
   "main": "cjs/index.js",
   "module": "es/index.js",
@@ -80,7 +80,7 @@
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^25.0.4",
     "@rollup/plugin-node-resolve": "^15.1.0",
-    "@salutejs/plasma-sb-utils": "0.163.1-canary.1345.10274146329.0",
+    "@salutejs/plasma-sb-utils": "0.163.0-dev.0",
     "@storybook/addon-docs": "^7.6.17",
     "@storybook/addon-essentials": "^7.6.17",
     "@storybook/addons": "^7.6.17",
@@ -110,7 +110,7 @@
     "@linaria/core": "5.0.2",
     "@linaria/react": "5.0.3",
     "@popperjs/core": "2.11.8",
-    "@salutejs/plasma-core": "1.165.1-canary.1345.10274146329.0",
+    "@salutejs/plasma-core": "1.165.0-dev.0",
     "dayjs": "1.11.11",
     "focus-visible": "5.2.0",
     "lodash.throttle": "4.1.1",
@@ -118,5 +118,5 @@
     "react-popper": "2.3.0",
     "storeon": "3.1.5"
   },
-  "gitHead": "059a9063b97443f993187f5b024016cd8cb93f87"
+  "gitHead": "5c413a0b41cb4914490896193a912a679669cb40"
 }

package/styled-components/cjs/components/Modal/Modal.js

@@ -11,9 +11,8 @@ var _engines = /*#__PURE__*/require("../../engines");
 var _Popup = /*#__PURE__*/require("../Popup");
 var _Overlay = /*#__PURE__*/require("../Overlay");
 var _utils = /*#__PURE__*/require("../Popup/utils");
-var _hooks = /*#__PURE__*/require("../../hooks");
 var _Modal = /*#__PURE__*/require("./Modal.tokens");
-var _hooks2 = /*#__PURE__*/require("./hooks");
+var _hooks = /*#__PURE__*/require("./hooks");
 var _base = /*#__PURE__*/require("./variations/_view/base");
 var _ModalContext = /*#__PURE__*/require("./ModalContext");
 var _excluded = ["id", "withAnimation", "onClose", "onOverlayClick", "onEscKeyDown", "closeOnEsc", "closeOnOverlayClick", "withBlur", "initialFocusRef", "focusAfterRef", "zIndex", "popupInfo", "children", "view", "isOpen"];
@@ -49,13 +48,13 @@ var modalRoot = exports.modalRoot = function modalRoot(Root) {
       view = _ref.view,
       isOpen = _ref.isOpen,
       rest = _objectWithoutProperties(_ref, _excluded);
-    var trapRef = (0, _hooks.useFocusTrap)(true, initialFocusRef, focusAfterRef, true);
+    var trapRef = (0, _plasmaCore.useFocusTrap)(true, initialFocusRef, focusAfterRef);
     var popupController = (0, _Popup.usePopupContext)();
     var innerRef = (0, _plasmaCore.useForkRef)(trapRef, outerRootRef);
     var uniqId = (0, _plasmaCore.safeUseId)();
     var innerId = id || uniqId;
     var overlayBackgroundToken = withBlur ? "var(".concat(_Modal.tokens.modalOverlayWithBlurColor, ")") : "var(".concat(_Modal.tokens.modalOverlayColor, ")");
-    var _useModal = (0, _hooks2.useModal)({
+    var _useModal = (0, _hooks.useModal)({
         id: innerId,
         isOpen: isOpen,
         closeOnEsc: closeOnEsc,

package/styled-components/cjs/examples/plasma_b2c/components/Modal/Modal.stories.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useRef, useState } from 'react';
+import React, { useState } from 'react';
 import styled from 'styled-components';
 import type { ComponentProps } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
@@ -6,7 +6,6 @@ import { SSRProvider } from '@salutejs/plasma-core';
 
 import { PopupProvider, popupClasses } from '../Popup/Popup';
 import { Button } from '../Button/Button';
-import { TextField } from '../TextField/TextField';
 import { WithTheme } from '../../../_helpers';
 
 import { Modal, modalClasses } from './Modal';
@@ -207,116 +206,3 @@ export const ModalDemo: StoryObj<StoryModalProps> = {
     },
     render: (args) => <StoryModalDemo {...args} />,
 };
-
-const StyledModalAnimation = styled(Modal)`
-    /* stylelint-disable */
-    && .${popupClasses.root} {
-        animation: fadeIn 1s forwards;
-    }
-
-    &&.${popupClasses.endAnimation} .${popupClasses.root} {
-        animation: fadeOut 1s forwards;
-    }
-
-    && .${modalClasses.overlay} {
-        animation: overlayFadeIn 1s forwards;
-    }
-
-    &&.${popupClasses.endAnimation} .${modalClasses.overlay} {
-        animation: overlayFadeOut 1s forwards;
-    }
-    /* stylelint-enable */
-
-    @keyframes overlayFadeIn {
-        from {
-            opacity: 0;
-        }
-
-        to {
-            opacity: 1;
-        }
-    }
-
-    @keyframes overlayFadeOut {
-        from {
-            opacity: 1;
-        }
-
-        to {
-            opacity: 0;
-        }
-    }
-
-    @keyframes fadeIn {
-        from {
-            opacity: 0;
-            transform: translate(-50%, 100%);
-        }
-
-        to {
-            opacity: 1;
-            transform: translate(-50%, -50%);
-        }
-    }
-
-    @keyframes fadeOut {
-        from {
-            opacity: 1;
-            transform: translate(-50%, -50%);
-        }
-
-        to {
-            opacity: 0;
-            transform: translate(-50%, 100%);
-        }
-    }
-`;
-
-const StoryModalAnimationDemo = ({ placement, offsetX, offsetY, ...rest }: StoryModalProps) => {
-    const ref = useRef(null);
-    const [isOpen, setIsOpen] = useState(false);
-
-    const close = useCallback(() => {
-        setIsOpen(false);
-    }, []);
-
-    return (
-        <SSRProvider>
-            {/* <StyledWrapper> */}
-            <PopupProvider>
-                <Button view="default" text="Открыть новое модальное окно" onClick={() => setIsOpen(!isOpen)} />
-                <StyledModalAnimation
-                    id="modal"
-                    frame="theme-root"
-                    withAnimation
-                    onClose={() => setIsOpen(false)}
-                    isOpen={isOpen}
-                    placement={placement}
-                    offset={[offsetX, offsetY]}
-                    initialFocusRef={ref}
-                    {...rest}
-                >
-                    <Content>
-                        <TextField value="Text" onChange={() => {}} />
-                        <TextField ref={ref} value="Text2" onChange={() => {}} />
-                        <Button text="Закрыть" onClick={close} />
-                    </Content>
-                </StyledModalAnimation>
-            </PopupProvider>
-            {/* </StyledWrapper> */}
-        </SSRProvider>
-    );
-};
-
-export const ModalBottomAnimation: StoryObj<StoryModalProps> = {
-    args: {
-        placement: 'bottom',
-        withAnimation: true,
-        withBlur: false,
-        closeOnEsc: true,
-        closeOnOverlayClick: true,
-        offsetX: 0,
-        offsetY: 0,
-    },
-    render: (args) => <StoryModalAnimationDemo {...args} />,
-};

package/styled-components/cjs/examples/plasma_web/components/Modal/Modal.stories.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useRef, useState } from 'react';
+import React, { useState } from 'react';
 import styled from 'styled-components';
 import type { ComponentProps } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
@@ -6,7 +6,6 @@ import { SSRProvider } from '@salutejs/plasma-core';
 
 import { PopupProvider, popupClasses } from '../Popup/Popup';
 import { Button } from '../Button/Button';
-import { TextField } from '../TextField/TextField';
 import { WithTheme } from '../../../_helpers';
 
 import { Modal, modalClasses } from './Modal';
@@ -207,116 +206,3 @@ export const ModalDemo: StoryObj<StoryModalProps> = {
     },
     render: (args) => <StoryModalDemo {...args} />,
 };
-
-const StyledModalAnimation = styled(Modal)`
-    /* stylelint-disable */
-    && .${popupClasses.root} {
-        animation: fadeIn 1s forwards;
-    }
-
-    &&.${popupClasses.endAnimation} .${popupClasses.root} {
-        animation: fadeOut 1s forwards;
-    }
-
-    && .${modalClasses.overlay} {
-        animation: overlayFadeIn 1s forwards;
-    }
-
-    &&.${popupClasses.endAnimation} .${modalClasses.overlay} {
-        animation: overlayFadeOut 1s forwards;
-    }
-    /* stylelint-enable */
-
-    @keyframes overlayFadeIn {
-        from {
-            opacity: 0;
-        }
-
-        to {
-            opacity: 1;
-        }
-    }
-
-    @keyframes overlayFadeOut {
-        from {
-            opacity: 1;
-        }
-
-        to {
-            opacity: 0;
-        }
-    }
-
-    @keyframes fadeIn {
-        from {
-            opacity: 0;
-            transform: translate(-50%, 100%);
-        }
-
-        to {
-            opacity: 1;
-            transform: translate(-50%, -50%);
-        }
-    }
-
-    @keyframes fadeOut {
-        from {
-            opacity: 1;
-            transform: translate(-50%, -50%);
-        }
-
-        to {
-            opacity: 0;
-            transform: translate(-50%, 100%);
-        }
-    }
-`;
-
-const StoryModalAnimationDemo = ({ placement, offsetX, offsetY, ...rest }: StoryModalProps) => {
-    const ref = useRef(null);
-    const [isOpen, setIsOpen] = useState(false);
-
-    const close = useCallback(() => {
-        setIsOpen(false);
-    }, []);
-
-    return (
-        <SSRProvider>
-            {/* <StyledWrapper> */}
-            <PopupProvider>
-                <Button view="default" text="Открыть новое модальное окно" onClick={() => setIsOpen(!isOpen)} />
-                <StyledModalAnimation
-                    id="modal"
-                    frame="theme-root"
-                    withAnimation
-                    onClose={() => setIsOpen(false)}
-                    isOpen={isOpen}
-                    placement={placement}
-                    offset={[offsetX, offsetY]}
-                    initialFocusRef={ref}
-                    {...rest}
-                >
-                    <Content>
-                        <TextField value="Text" onChange={() => {}} />
-                        <TextField ref={ref} value="Text2" onChange={() => {}} />
-                        <Button text="Закрыть" onClick={close} />
-                    </Content>
-                </StyledModalAnimation>
-            </PopupProvider>
-            {/* </StyledWrapper> */}
-        </SSRProvider>
-    );
-};
-
-export const ModalBottomAnimation: StoryObj<StoryModalProps> = {
-    args: {
-        placement: 'bottom',
-        withAnimation: true,
-        withBlur: false,
-        closeOnEsc: true,
-        closeOnOverlayClick: true,
-        offsetX: 0,
-        offsetY: 0,
-    },
-    render: (args) => <StoryModalAnimationDemo {...args} />,
-};

package/styled-components/cjs/hooks/index.js

@@ -9,12 +9,6 @@ Object.defineProperty(exports, "useDidMountEffect", {
     return _useDidMountEffect.useDidMountEffect;
   }
 });
-Object.defineProperty(exports, "useFocusTrap", {
-  enumerable: true,
-  get: function get() {
-    return _useFocusTrap.useFocusTrap;
-  }
-});
 Object.defineProperty(exports, "useForceUpdate", {
   enumerable: true,
   get: function get() {
@@ -46,7 +40,6 @@ Object.defineProperty(exports, "useUniqId", {
   }
 });
 var _useUniqId = /*#__PURE__*/require("./useUniqId");
-var _useFocusTrap = /*#__PURE__*/require("./useFocusTrap");
 var _usePreviousValue = /*#__PURE__*/require("./usePreviousValue");
 var _useForceUpdate = /*#__PURE__*/require("./useForceUpdate");
 var _useDidMountEffect = /*#__PURE__*/require("./useDidMountEffect");

package/styled-components/es/components/Modal/Modal.js

@@ -3,12 +3,11 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import React, { forwardRef, useCallback, useMemo } from 'react';
-import { useForkRef, safeUseId } from '@salutejs/plasma-core';
+import { useFocusTrap, useForkRef, safeUseId } from '@salutejs/plasma-core';
 import { component } from '../../engines';
 import { popupConfig, usePopupContext } from '../Popup';
 import { Overlay } from '../Overlay';
 import { DEFAULT_Z_INDEX } from '../Popup/utils';
-import { useFocusTrap } from '../../hooks';
 import { classes, tokens } from './Modal.tokens';
 import { useModal } from './hooks';
 import { base as viewCSS } from './variations/_view/base';
@@ -41,7 +40,7 @@ export var modalRoot = function modalRoot(Root) {
       view = _ref.view,
       isOpen = _ref.isOpen,
       rest = _objectWithoutProperties(_ref, _excluded);
-    var trapRef = useFocusTrap(true, initialFocusRef, focusAfterRef, true);
+    var trapRef = useFocusTrap(true, initialFocusRef, focusAfterRef);
     var popupController = usePopupContext();
     var innerRef = useForkRef(trapRef, outerRootRef);
     var uniqId = safeUseId();

package/styled-components/es/examples/plasma_b2c/components/Modal/Modal.stories.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useRef, useState } from 'react';
+import React, { useState } from 'react';
 import styled from 'styled-components';
 import type { ComponentProps } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
@@ -6,7 +6,6 @@ import { SSRProvider } from '@salutejs/plasma-core';
 
 import { PopupProvider, popupClasses } from '../Popup/Popup';
 import { Button } from '../Button/Button';
-import { TextField } from '../TextField/TextField';
 import { WithTheme } from '../../../_helpers';
 
 import { Modal, modalClasses } from './Modal';
@@ -207,116 +206,3 @@ export const ModalDemo: StoryObj<StoryModalProps> = {
     },
     render: (args) => <StoryModalDemo {...args} />,
 };
-
-const StyledModalAnimation = styled(Modal)`
-    /* stylelint-disable */
-    && .${popupClasses.root} {
-        animation: fadeIn 1s forwards;
-    }
-
-    &&.${popupClasses.endAnimation} .${popupClasses.root} {
-        animation: fadeOut 1s forwards;
-    }
-
-    && .${modalClasses.overlay} {
-        animation: overlayFadeIn 1s forwards;
-    }
-
-    &&.${popupClasses.endAnimation} .${modalClasses.overlay} {
-        animation: overlayFadeOut 1s forwards;
-    }
-    /* stylelint-enable */
-
-    @keyframes overlayFadeIn {
-        from {
-            opacity: 0;
-        }
-
-        to {
-            opacity: 1;
-        }
-    }
-
-    @keyframes overlayFadeOut {
-        from {
-            opacity: 1;
-        }
-
-        to {
-            opacity: 0;
-        }
-    }
-
-    @keyframes fadeIn {
-        from {
-            opacity: 0;
-            transform: translate(-50%, 100%);
-        }
-
-        to {
-            opacity: 1;
-            transform: translate(-50%, -50%);
-        }
-    }
-
-    @keyframes fadeOut {
-        from {
-            opacity: 1;
-            transform: translate(-50%, -50%);
-        }
-
-        to {
-            opacity: 0;
-            transform: translate(-50%, 100%);
-        }
-    }
-`;
-
-const StoryModalAnimationDemo = ({ placement, offsetX, offsetY, ...rest }: StoryModalProps) => {
-    const ref = useRef(null);
-    const [isOpen, setIsOpen] = useState(false);
-
-    const close = useCallback(() => {
-        setIsOpen(false);
-    }, []);
-
-    return (
-        <SSRProvider>
-            {/* <StyledWrapper> */}
-            <PopupProvider>
-                <Button view="default" text="Открыть новое модальное окно" onClick={() => setIsOpen(!isOpen)} />
-                <StyledModalAnimation
-                    id="modal"
-                    frame="theme-root"
-                    withAnimation
-                    onClose={() => setIsOpen(false)}
-                    isOpen={isOpen}
-                    placement={placement}
-                    offset={[offsetX, offsetY]}
-                    initialFocusRef={ref}
-                    {...rest}
-                >
-                    <Content>
-                        <TextField value="Text" onChange={() => {}} />
-                        <TextField ref={ref} value="Text2" onChange={() => {}} />
-                        <Button text="Закрыть" onClick={close} />
-                    </Content>
-                </StyledModalAnimation>
-            </PopupProvider>
-            {/* </StyledWrapper> */}
-        </SSRProvider>
-    );
-};
-
-export const ModalBottomAnimation: StoryObj<StoryModalProps> = {
-    args: {
-        placement: 'bottom',
-        withAnimation: true,
-        withBlur: false,
-        closeOnEsc: true,
-        closeOnOverlayClick: true,
-        offsetX: 0,
-        offsetY: 0,
-    },
-    render: (args) => <StoryModalAnimationDemo {...args} />,
-};