@salutejs/plasma-new-hope 0.149.1-canary.1448.10989541108.0 → 0.150.0-canary.1428.10987052735.0

package/es/components/EmptyState/EmptyState.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.styles.js","sources":["../../../src/components/EmptyState/EmptyState.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\nimport { css } from '@linaria/core';\n\nimport { buttonConfig, buttonTokens } from '../Button';\nimport { component, mergeConfig } from '../../engines';\n\nimport { tokens } from './EmptyState.tokens';\n\nconst mergedButtonConfig = mergeConfig(buttonConfig);\nconst Button = component(mergedButtonConfig);\n\nexport const base = css`\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    background: var(--surface-solid-card);\n    box-shadow: 0 4px 14px -4px rgba(8, 8, 8, 0.08), 0 1px 4px -1px rgba(0, 0, 0, 0.04);\n    border-radius: var(${tokens.borderRadius});\n    padding: var(${tokens.padding});\n    text-align: center;\n`;\n\nexport const StyledButton = styled(Button)`\n    ${buttonTokens.buttonColor}: var(--text-primary);\n    ${buttonTokens.buttonColorActive}: var(--text-primary-active);\n    ${buttonTokens.buttonColorHover}: var(--text-primary-hover);\n    ${buttonTokens.buttonBackgroundColor}: none;\n    ${buttonTokens.buttonPadding}: 0;\n    ${buttonTokens.buttonHeight}: var(${tokens.buttonHeight});\n    ${buttonTokens.buttonRadius}: 0;\n    ${buttonTokens.buttonFontFamily}: var(${tokens.fontFamily});\n    ${buttonTokens.buttonFontSize}: var(${tokens.fontSize});\n    ${buttonTokens.buttonFontStyle}: var(${tokens.fontStyle});\n    ${buttonTokens.buttonFontWeight}: 600;\n    ${buttonTokens.buttonLetterSpacing}: var(${tokens.fontLetterSpacing});\n    ${buttonTokens.buttonLineHeight}: var(${tokens.fontLineHeight});\n    margin: var(${tokens.buttonMargin});\n`;\n\nexport const IconWrapper = styled.div`\n    margin: var(${tokens.iconMargin});\n    line-height: 0;\n`;\n\nexport const Description = styled.div`\n    margin: var(${tokens.descriptionMargin});\n    font-family: var(${tokens.fontFamily});\n    font-size: var(${tokens.fontSize});\n    font-style: var(${tokens.fontStyle});\n    font-weight: var(${tokens.fontWeight});\n    letter-spacing: var(${tokens.fontLetterSpacing});\n    line-height: var(${tokens.fontLineHeight});\n`;\n"],"names":["mergedButtonConfig","mergeConfig","buttonConfig","Button","component","base","_exp3","StyledButton","styled","name","class","propsAsIs","IconWrapper","Description"],"mappings":";;;;AAQA,IAAMA,kBAAkB,gBAAGC,WAAW,CAACC,YAAY,CAAC,CAAA;AACpD,IAAMC,MAAM,gBAAGC,SAAS,CAACJ,kBAAkB,CAAC,CAAA;AAErC,IAAMK,IAAI,GAShB,UAAA;AAAC,IAAAC,KAAA,GAnBgBA,SAmBhBA,KAAAA,GAAA;AAAA,EAAA,OAEiCH,MAAM,CAAA;AAAA,CAAA,CAAA;AAAlC,IAAMI,YAAY,gBAAGC,MAAM,CAAAF,KAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,cAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAejC,EAAA;AAEM,IAAMC,WAAW,gBAAGJ,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAGhC,EAAA;AAEM,IAAME,WAAW,gBAAGL,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAQhC;;;;"}
+{"version":3,"file":"EmptyState.styles.js","sources":["../../../src/components/EmptyState/EmptyState.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\nimport { css } from '@linaria/core';\n\nimport { buttonConfig, buttonTokens } from '../Button';\nimport { component, mergeConfig } from '../../engines';\n\nimport { tokens } from './EmptyState.tokens';\n\nconst mergedButtonConfig = mergeConfig(buttonConfig);\nconst Button = component(mergedButtonConfig);\n\nexport const base = css`\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    background: var(--surface-solid-card);\n    box-shadow: 0 4px 14px -4px rgba(8, 8, 8, 0.08), 0 1px 4px -1px rgba(0, 0, 0, 0.04);\n    border-radius: var(${tokens.borderRadius});\n    padding: var(${tokens.padding});\n    text-align: center;\n`;\n\nexport const StyledButton = styled(Button)`\n    ${buttonTokens.buttonColor}: var(--text-primary);\n    ${buttonTokens.buttonColorActive}: var(--text-primary-active);\n    ${buttonTokens.buttonColorHover}: var(--text-primary-hover);\n    ${buttonTokens.buttonBackgroundColor}: none;\n    ${buttonTokens.buttonPadding}: 0;\n    ${buttonTokens.buttonHeight}: var(${tokens.buttonHeight});\n    ${buttonTokens.buttonRadius}: 0;\n    ${buttonTokens.buttonFontFamily}: var(${tokens.fontFamily});\n    ${buttonTokens.buttonFontSize}: var(${tokens.fontSize});\n    ${buttonTokens.buttonFontStyle}: var(${tokens.fontStyle});\n    ${buttonTokens.buttonFontWeight}: 600;\n    ${buttonTokens.buttonLetterSpacing}: var(${tokens.fontLetterSpacing});\n    ${buttonTokens.buttonLineHeight}: var(${tokens.fontLineHeight});\n    margin: var(${tokens.buttonMargin});\n`;\n\nexport const IconWrapper = styled.div`\n    margin: var(${tokens.iconMargin});\n    line-height: 0;\n`;\n\nexport const Description = styled.div`\n    margin: var(${tokens.descriptionMargin});\n    font-family: var(${tokens.fontFamily});\n    font-size: var(${tokens.fontSize});\n    font-style: var(${tokens.fontStyle});\n    font-weight: var(${tokens.fontWeight});\n    letter-spacing: var(${tokens.fontLetterSpacing});\n    line-height: var(${tokens.fontLineHeight});\n`;\n"],"names":["mergedButtonConfig","mergeConfig","buttonConfig","Button","component","base","_exp3","StyledButton","styled","name","class","propsAsIs","IconWrapper","Description"],"mappings":";;;;;AAQA,IAAMA,kBAAkB,gBAAGC,WAAW,CAACC,YAAY,CAAC,CAAA;AACpD,IAAMC,MAAM,gBAAGC,SAAS,CAACJ,kBAAkB,CAAC,CAAA;AAErC,IAAMK,IAAI,GAShB,UAAA;AAAC,IAAAC,KAAA,GAnBgBA,SAmBhBA,KAAAA,GAAA;AAAA,EAAA,OAEiCH,MAAM,CAAA;AAAA,CAAA,CAAA;AAAlC,IAAMI,YAAY,gBAAGC,MAAM,CAAAF,KAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,cAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAejC,EAAA;AAEM,IAAMC,WAAW,gBAAGJ,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAGhC,EAAA;AAEM,IAAME,WAAW,gBAAGL,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAQhC;;;;"}

package/es/components/IconButton/IconButton.js

@@ -1,3 +1,4 @@
+import { buttonRoot } from '../Button/Button.js';
 import { base as base$1 } from '../Button/variations/_view/base.js';
 import { base as base$2 } from '../Button/variations/_size/base.js';
 import { base as base$3 } from '../Button/variations/_disabled/base.js';
@@ -5,7 +6,6 @@ import { base as base$4 } from '../Button/variations/_focused/base.js';
 import { base as base$5 } from '../Button/variations/_blurred/base.js';
 import { base as base$6 } from '../Button/variations/_stretching/base.js';
 import { base } from './IconButton.styles.js';
-import { buttonRoot } from '../Button/Button.js';
 
 var iconButtonRoot = buttonRoot;
 var iconButtonConfig = {

package/es/components/IconButton/IconButton.styles.js

@@ -1,4 +1,12 @@
 import './IconButton.styles_sttslf.css';
+import 'react';
+import '../../utils/react.js';
+import '@linaria/react';
+import 'focus-visible';
+import 'styled-components';
+import '@linaria/core';
+import '@salutejs/plasma-core';
+
 var base = "b1ua728l";
 
 export { base };

package/es/components/IconButton/IconButton.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.styles.js","sources":["../../../src/components/IconButton/IconButton.styles.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { buttonTokens } from '../Button';\nimport { baseContent as buttonBase } from '../Button/Button.styles';\n\nimport { tokens } from './IconButton.tokens';\n\n// Переопределние токенов из Button\nexport const mappingOverride = `\n    ${buttonTokens.buttonPadding}: 0;\n\n    ${buttonTokens.buttonColor}: var(${tokens.iconButtonColor});\n    ${buttonTokens.buttonBackgroundColor}: var(${tokens.iconButtonBackgroundColor});\n\n    ${buttonTokens.buttonColorHover}: var(${tokens.iconButtonColorHover});\n    ${buttonTokens.buttonBackgroundColorHover}: var(${tokens.iconButtonBackgroundColorHover});\n\n    ${buttonTokens.buttonColorActive}: var(${tokens.iconButtonColorActive});\n    ${buttonTokens.buttonBackgroundColorActive}: var(${tokens.iconButtonBackgroundColorActive});\n\n    ${buttonTokens.buttonLoadingBackgroundColor}: var(${tokens.iconButtonLoadingBackgroundColor});\n\n    ${buttonTokens.buttonFontFamily}: var(${tokens.iconButtonFontFamily});\n    ${buttonTokens.buttonFontSize}: var(${tokens.iconButtonFontSize});\n    ${buttonTokens.buttonFontStyle}: var(${tokens.iconButtonFontStyle});\n    ${buttonTokens.buttonFontWeight}:var(${tokens.iconButtonFontWeight});\n    ${buttonTokens.buttonLetterSpacing}: var(${tokens.iconButtonLetterSpacing});\n    ${buttonTokens.buttonLineHeight}: var(${tokens.iconButtonLineHeight});\n\n    ${buttonTokens.buttonWidth}: var(${tokens.iconButtonWidth});\n    ${buttonTokens.buttonHeight}: var(${tokens.iconButtonHeight});\n    ${buttonTokens.buttonRadius}: var(${tokens.iconButtonRadius});\n\n    ${buttonTokens.buttonDisabledOpacity}: var(${tokens.iconButtonDisabledOpacity});\n    ${buttonTokens.buttonFocusColor}: var(${tokens.iconButtonFocusColor});\n\n    ${buttonTokens.buttonSpinnerSize}: var(${tokens.iconButtonSpinnerSize});\n    ${buttonTokens.buttonSpinnerColor}: var(${tokens.iconButtonSpinnerColor});\n`;\n\nexport const base = css`\n    ${buttonBase};\n    ${mappingOverride};\n`;\n"],"names":["base"],"mappings":"AAwCO,IAAMA,IAAI,GAGhB;;;;"}
+{"version":3,"file":"IconButton.styles.js","sources":["../../../src/components/IconButton/IconButton.styles.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { buttonTokens } from '../Button';\nimport { baseContent as buttonBase } from '../Button/Button.styles';\n\nimport { tokens } from './IconButton.tokens';\n\n// Переопределние токенов из Button\nexport const mappingOverride = `\n    ${buttonTokens.buttonPadding}: 0;\n\n    ${buttonTokens.buttonColor}: var(${tokens.iconButtonColor});\n    ${buttonTokens.buttonBackgroundColor}: var(${tokens.iconButtonBackgroundColor});\n\n    ${buttonTokens.buttonColorHover}: var(${tokens.iconButtonColorHover});\n    ${buttonTokens.buttonBackgroundColorHover}: var(${tokens.iconButtonBackgroundColorHover});\n\n    ${buttonTokens.buttonColorActive}: var(${tokens.iconButtonColorActive});\n    ${buttonTokens.buttonBackgroundColorActive}: var(${tokens.iconButtonBackgroundColorActive});\n\n    ${buttonTokens.buttonLoadingBackgroundColor}: var(${tokens.iconButtonLoadingBackgroundColor});\n\n    ${buttonTokens.buttonFontFamily}: var(${tokens.iconButtonFontFamily});\n    ${buttonTokens.buttonFontSize}: var(${tokens.iconButtonFontSize});\n    ${buttonTokens.buttonFontStyle}: var(${tokens.iconButtonFontStyle});\n    ${buttonTokens.buttonFontWeight}:var(${tokens.iconButtonFontWeight});\n    ${buttonTokens.buttonLetterSpacing}: var(${tokens.iconButtonLetterSpacing});\n    ${buttonTokens.buttonLineHeight}: var(${tokens.iconButtonLineHeight});\n\n    ${buttonTokens.buttonWidth}: var(${tokens.iconButtonWidth});\n    ${buttonTokens.buttonHeight}: var(${tokens.iconButtonHeight});\n    ${buttonTokens.buttonRadius}: var(${tokens.iconButtonRadius});\n\n    ${buttonTokens.buttonDisabledOpacity}: var(${tokens.iconButtonDisabledOpacity});\n    ${buttonTokens.buttonFocusColor}: var(${tokens.iconButtonFocusColor});\n\n    ${buttonTokens.buttonSpinnerSize}: var(${tokens.iconButtonSpinnerSize});\n    ${buttonTokens.buttonSpinnerColor}: var(${tokens.iconButtonSpinnerColor});\n`;\n\nexport const base = css`\n    ${buttonBase};\n    ${mappingOverride};\n`;\n"],"names":["base"],"mappings":";;;;;;;;AAwCO,IAAMA,IAAI,GAGhB;;;;"}

package/es/components/Modal/Modal.js

@@ -1,16 +1,18 @@
 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 '@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';
 import { getIdLastModal } from './ModalContext.js';
-import { useFocusTrap } from '../../hooks/useFocusTrap.js';
-import { usePopupContext } from '../Popup/PopupContext.js';
-import { useModal } from './hooks/useModal.js';
-import { component } from '../../engines/common.js';
-import { popupConfig } from '../Popup/Popup.js';
-import { Overlay } from '../Overlay/Overlay.js';
 
 var _excluded = ["id", "withAnimation", "onClose", "onOverlayClick", "onEscKeyDown", "closeOnEsc", "closeOnOverlayClick", "withBlur", "initialFocusRef", "focusAfterRef", "zIndex", "popupInfo", "children", "view", "opened", "isOpen"];
 

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                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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"}
+{"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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"}

package/es/components/Modal/hooks/useModal.js

@@ -2,6 +2,10 @@ import { objectSpread2 as _objectSpread2 } from '../../../_virtual/_rollupPlugin
 import { useCallback, useEffect } from 'react';
 import { getIdLastModal } from '../ModalContext.js';
 import { usePopupContext } from '../../Popup/PopupContext.js';
+import '@salutejs/plasma-core';
+import '../../../utils/react.js';
+import 'react-dom';
+import '@linaria/react';
 
 var ESCAPE_KEYCODE = 27;
 var useModal = function useModal(_ref) {

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

@@ -1 +1 @@
-{"version":3,"file":"useModal.js","sources":["../../../../src/components/Modal/hooks/useModal.ts"],"sourcesContent":["import { useCallback, useEffect } from 'react';\n\nimport { ModalInfo, getIdLastModal } from '../ModalContext';\nimport { ModalHookArgs } from '../Modal.types';\nimport { usePopupContext } from '../../Popup';\n\nconst ESCAPE_KEYCODE = 27;\n\nexport const useModal = ({ id, popupInfo, onEscKeyDown, onClose, closeOnEsc = true }: ModalHookArgs) => {\n    const popupController = usePopupContext();\n\n    // При ESC закрывает текущее окно, если это возможно\n    const onKeyDown = useCallback(\n        (event: KeyboardEvent) => {\n            if (!closeOnEsc) {\n                return;\n            }\n            if (event.keyCode === ESCAPE_KEYCODE && getIdLastModal(popupController.items) === id) {\n                if (onEscKeyDown) {\n                    onEscKeyDown(event);\n                    return;\n                }\n\n                if (onClose) {\n                    onClose();\n                }\n            }\n        },\n        [onClose, onEscKeyDown, popupController.items, closeOnEsc],\n    );\n\n    useEffect(() => {\n        window.addEventListener('keydown', onKeyDown);\n        return () => {\n            window.removeEventListener('keydown', onKeyDown);\n        };\n    }, [onClose, onEscKeyDown, popupController.items, closeOnEsc]);\n\n    const modalInfo: ModalInfo = {\n        id,\n        info: {\n            isModal: true,\n        },\n        ...popupInfo,\n    };\n\n    return { modalInfo };\n};\n"],"names":["ESCAPE_KEYCODE","useModal","_ref","id","popupInfo","onEscKeyDown","onClose","_ref$closeOnEsc","closeOnEsc","popupController","usePopupContext","onKeyDown","useCallback","event","keyCode","getIdLastModal","items","useEffect","window","addEventListener","removeEventListener","modalInfo","_objectSpread","info","isModal"],"mappings":";;;;;AAMA,IAAMA,cAAc,GAAG,EAAE,CAAA;IAEZC,QAAQ,GAAG,SAAXA,QAAQA,CAAAC,IAAA,EAAmF;AAAA,EAAA,IAA7EC,EAAE,GAAAD,IAAA,CAAFC,EAAE;IAAEC,SAAS,GAAAF,IAAA,CAATE,SAAS;IAAEC,YAAY,GAAAH,IAAA,CAAZG,YAAY;IAAEC,OAAO,GAAAJ,IAAA,CAAPI,OAAO;IAAAC,eAAA,GAAAL,IAAA,CAAEM,UAAU;AAAVA,IAAAA,UAAU,GAAAD,eAAA,KAAG,KAAA,CAAA,GAAA,IAAI,GAAAA,eAAA,CAAA;AAC9E,EAAA,IAAME,eAAe,GAAGC,eAAe,EAAE,CAAA;;AAEzC;AACA,EAAA,IAAMC,SAAS,GAAGC,WAAW,CACzB,UAACC,KAAoB,EAAK;IACtB,IAAI,CAACL,UAAU,EAAE;AACb,MAAA,OAAA;AACJ,KAAA;AACA,IAAA,IAAIK,KAAK,CAACC,OAAO,KAAKd,cAAc,IAAIe,cAAc,CAACN,eAAe,CAACO,KAAK,CAAC,KAAKb,EAAE,EAAE;AAClF,MAAA,IAAIE,YAAY,EAAE;QACdA,YAAY,CAACQ,KAAK,CAAC,CAAA;AACnB,QAAA,OAAA;AACJ,OAAA;AAEA,MAAA,IAAIP,OAAO,EAAE;AACTA,QAAAA,OAAO,EAAE,CAAA;AACb,OAAA;AACJ,KAAA;AACJ,GAAC,EACD,CAACA,OAAO,EAAED,YAAY,EAAEI,eAAe,CAACO,KAAK,EAAER,UAAU,CAC7D,CAAC,CAAA;AAEDS,EAAAA,SAAS,CAAC,YAAM;AACZC,IAAAA,MAAM,CAACC,gBAAgB,CAAC,SAAS,EAAER,SAAS,CAAC,CAAA;AAC7C,IAAA,OAAO,YAAM;AACTO,MAAAA,MAAM,CAACE,mBAAmB,CAAC,SAAS,EAAET,SAAS,CAAC,CAAA;KACnD,CAAA;AACL,GAAC,EAAE,CAACL,OAAO,EAAED,YAAY,EAAEI,eAAe,CAACO,KAAK,EAAER,UAAU,CAAC,CAAC,CAAA;EAE9D,IAAMa,SAAoB,GAAAC,cAAA,CAAA;AACtBnB,IAAAA,EAAE,EAAFA,EAAE;AACFoB,IAAAA,IAAI,EAAE;AACFC,MAAAA,OAAO,EAAE,IAAA;AACb,KAAA;AAAC,GAAA,EACEpB,SAAS,CACf,CAAA;EAED,OAAO;AAAEiB,IAAAA,SAAS,EAATA,SAAAA;GAAW,CAAA;AACxB;;;;"}
+{"version":3,"file":"useModal.js","sources":["../../../../src/components/Modal/hooks/useModal.ts"],"sourcesContent":["import { useCallback, useEffect } from 'react';\n\nimport { ModalInfo, getIdLastModal } from '../ModalContext';\nimport { ModalHookArgs } from '../Modal.types';\nimport { usePopupContext } from '../../Popup';\n\nconst ESCAPE_KEYCODE = 27;\n\nexport const useModal = ({ id, popupInfo, onEscKeyDown, onClose, closeOnEsc = true }: ModalHookArgs) => {\n    const popupController = usePopupContext();\n\n    // При ESC закрывает текущее окно, если это возможно\n    const onKeyDown = useCallback(\n        (event: KeyboardEvent) => {\n            if (!closeOnEsc) {\n                return;\n            }\n            if (event.keyCode === ESCAPE_KEYCODE && getIdLastModal(popupController.items) === id) {\n                if (onEscKeyDown) {\n                    onEscKeyDown(event);\n                    return;\n                }\n\n                if (onClose) {\n                    onClose();\n                }\n            }\n        },\n        [onClose, onEscKeyDown, popupController.items, closeOnEsc],\n    );\n\n    useEffect(() => {\n        window.addEventListener('keydown', onKeyDown);\n        return () => {\n            window.removeEventListener('keydown', onKeyDown);\n        };\n    }, [onClose, onEscKeyDown, popupController.items, closeOnEsc]);\n\n    const modalInfo: ModalInfo = {\n        id,\n        info: {\n            isModal: true,\n        },\n        ...popupInfo,\n    };\n\n    return { modalInfo };\n};\n"],"names":["ESCAPE_KEYCODE","useModal","_ref","id","popupInfo","onEscKeyDown","onClose","_ref$closeOnEsc","closeOnEsc","popupController","usePopupContext","onKeyDown","useCallback","event","keyCode","getIdLastModal","items","useEffect","window","addEventListener","removeEventListener","modalInfo","_objectSpread","info","isModal"],"mappings":";;;;;;;;;AAMA,IAAMA,cAAc,GAAG,EAAE,CAAA;IAEZC,QAAQ,GAAG,SAAXA,QAAQA,CAAAC,IAAA,EAAmF;AAAA,EAAA,IAA7EC,EAAE,GAAAD,IAAA,CAAFC,EAAE;IAAEC,SAAS,GAAAF,IAAA,CAATE,SAAS;IAAEC,YAAY,GAAAH,IAAA,CAAZG,YAAY;IAAEC,OAAO,GAAAJ,IAAA,CAAPI,OAAO;IAAAC,eAAA,GAAAL,IAAA,CAAEM,UAAU;AAAVA,IAAAA,UAAU,GAAAD,eAAA,KAAG,KAAA,CAAA,GAAA,IAAI,GAAAA,eAAA,CAAA;AAC9E,EAAA,IAAME,eAAe,GAAGC,eAAe,EAAE,CAAA;;AAEzC;AACA,EAAA,IAAMC,SAAS,GAAGC,WAAW,CACzB,UAACC,KAAoB,EAAK;IACtB,IAAI,CAACL,UAAU,EAAE;AACb,MAAA,OAAA;AACJ,KAAA;AACA,IAAA,IAAIK,KAAK,CAACC,OAAO,KAAKd,cAAc,IAAIe,cAAc,CAACN,eAAe,CAACO,KAAK,CAAC,KAAKb,EAAE,EAAE;AAClF,MAAA,IAAIE,YAAY,EAAE;QACdA,YAAY,CAACQ,KAAK,CAAC,CAAA;AACnB,QAAA,OAAA;AACJ,OAAA;AAEA,MAAA,IAAIP,OAAO,EAAE;AACTA,QAAAA,OAAO,EAAE,CAAA;AACb,OAAA;AACJ,KAAA;AACJ,GAAC,EACD,CAACA,OAAO,EAAED,YAAY,EAAEI,eAAe,CAACO,KAAK,EAAER,UAAU,CAC7D,CAAC,CAAA;AAEDS,EAAAA,SAAS,CAAC,YAAM;AACZC,IAAAA,MAAM,CAACC,gBAAgB,CAAC,SAAS,EAAER,SAAS,CAAC,CAAA;AAC7C,IAAA,OAAO,YAAM;AACTO,MAAAA,MAAM,CAACE,mBAAmB,CAAC,SAAS,EAAET,SAAS,CAAC,CAAA;KACnD,CAAA;AACL,GAAC,EAAE,CAACL,OAAO,EAAED,YAAY,EAAEI,eAAe,CAACO,KAAK,EAAER,UAAU,CAAC,CAAC,CAAA;EAE9D,IAAMa,SAAoB,GAAAC,cAAA,CAAA;AACtBnB,IAAAA,EAAE,EAAFA,EAAE;AACFoB,IAAAA,IAAI,EAAE;AACFC,MAAAA,OAAO,EAAE,IAAA;AACb,KAAA;AAAC,GAAA,EACEpB,SAAS,CACf,CAAA;EAED,OAAO;AAAEiB,IAAAA,SAAS,EAATA,SAAAA;GAAW,CAAA;AACxB;;;;"}

package/es/components/Notification/Notification.styles.js

@@ -1,9 +1,10 @@
 import './Notification.styles_7h8hp0.css';
 import { styled } from '@linaria/react';
+import { buttonConfig } from '../Button/Button.js';
+import '@linaria/core';
+import { component, mergeConfig } from '../../engines/common.js';
 import { tokens } from './Notification.tokens.js';
 import { placements } from './Notification.types.js';
-import { component, mergeConfig } from '../../engines/common.js';
-import { buttonConfig } from '../Button/Button.js';
 
 var StyledNotification = "sb12p";
 var mergedButtonConfig = /*#__PURE__*/mergeConfig(buttonConfig);

package/es/components/Notification/Notification.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notification.styles.js","sources":["../../../src/components/Notification/Notification.styles.ts"],"sourcesContent":["import { css } from '@linaria/core';\nimport { styled } from '@linaria/react';\n\nimport { applyHyphens } from '../../mixins';\nimport { buttonConfig } from '../Button';\nimport { component, mergeConfig } from '../../engines';\n\nimport { classes, tokens } from './Notification.tokens';\nimport { CloseIconType, IconPlacementType, placements } from './Notification.types';\n\nexport const StyledNotification = css`\n    width: fit-content;\n`;\n\nconst mergedButtonConfig = mergeConfig(buttonConfig);\nconst Button = component(mergedButtonConfig);\n\nexport const CloseIconWrapper = styled(Button)`\n    position: absolute;\n    width: 1.5rem;\n    height: 1.5rem;\n\n    color: var(${tokens.closeIconColor});\n\n    :hover {\n        color: var(${tokens.closeIconColorOnHover});\n    }\n\n    &.${classes.horizontal} {\n        position: relative;\n    }\n`;\n\nexport const Wrapper = styled.div`\n    position: relative;\n    box-sizing: border-box;\n\n    background: var(${tokens.background});\n    border-radius: var(${tokens.borderRadius});\n\n    &.${classes.horizontal} {\n        display: flex;\n        align-items: center;\n        gap: var(${tokens.horizontalLayoutGap});\n    }\n`;\n\nexport const ButtonsWrapper = styled.div<IconPlacementType>`\n    margin-top: var(${tokens.buttonsMarginTop});\n    margin-left: ${({ iconPlacement }) =>\n        iconPlacement === placements.left ? `var(${tokens.buttonsMarginLeft})` : 'unset'};\n\n    &.${classes.horizontal} {\n        margin-top: unset;\n        margin-left: unset;\n    }\n`;\n\nexport const IconWrapper = styled.div<IconPlacementType>`\n    width: var(${tokens.contentLeftIconSize});\n    height: var(${tokens.contentLeftIconSize});\n\n    margin-right: ${({ iconPlacement }) =>\n        iconPlacement === placements.left ? `var(${tokens.contentLeftIconMargin})` : 'unset'};\n    margin-bottom: ${({ iconPlacement }) =>\n        iconPlacement === placements.top ? `var(${tokens.contentTopIconMargin})` : 'unset'};\n\n    &.${classes.horizontal} {\n        margin-right: var(${tokens.horizontalLayoutLeftIconMargin});\n        margin-bottom: unset;\n    }\n`;\n\nexport const ContentBox = styled.div<IconPlacementType>`\n    // TODO: переделать, когда научимся работать с токенами при пересечнии свойств\n    // issue #909\n    display: ${({ iconPlacement }) => (iconPlacement === placements.left ? 'flex' : 'block')};\n\n    padding-top: ${({ iconPlacement }) =>\n        iconPlacement ? `var(${tokens.contentPaddingTop})` : `var(${tokens.contentPaddingTopWithoutIcon})`};\n\n    &.${classes.horizontal} {\n        padding: unset;\n        display: flex;\n        align-items: center;\n        flex-grow: 1;\n    }\n`;\n\nexport const TextBox = styled.div<CloseIconType & IconPlacementType>`\n    padding: var(${tokens.textboxPaddingTop}) var(${tokens.textboxPaddingRight}) var(${tokens.textboxPaddingBottom})\n        var(${tokens.textboxPaddingLeft});\n\n    padding-top: ${({ iconPlacement }) =>\n        !iconPlacement || iconPlacement === placements.top\n            ? `var(${tokens.textboxPaddingTopWithTopIcon})`\n            : `var(${tokens.textboxPaddingTop})`};\n    padding-right: ${({ showCloseIcon, iconPlacement }) =>\n        showCloseIcon && iconPlacement !== placements.top\n            ? `var(${tokens.textboxPaddingRightWithCloseIcon})`\n            : `var(${tokens.textboxPaddingRight})`};\n\n    display: flex;\n    flex-direction: column;\n    row-gap: var(${tokens.textboxGap});\n    word-break: break-word;\n\n    &.${classes.horizontal} {\n        padding: unset;\n    }\n`;\n\nexport const StyledTitle = styled.div`\n    font-family: var(${tokens.titleFontFamily});\n    font-size: var(${tokens.titleFontSize});\n    font-style: var(${tokens.titleFontStyle});\n    font-weight: var(${tokens.titleFontWeight});\n    letter-spacing: var(${tokens.titleFontLetterSpacing});\n    line-height: var(${tokens.titleFontLineHeight});\n    ${String(applyHyphens)};\n`;\n\nexport const StyledContent = styled.div`\n    font-family: var(${tokens.contentFontFamily});\n    font-size: var(${tokens.contentFontSize});\n    font-style: var(${tokens.contentFontStyle});\n    font-weight: var(${tokens.contentFontWeight});\n    letter-spacing: var(${tokens.contentFontLetterSpacing});\n    line-height: var(${tokens.contentFontLineHeight});\n    ${String(applyHyphens)};\n\n    color: var(${tokens.contentColor});\n`;\n\nexport const StyledItemWrapper = styled.div<{ isHidden: boolean }>`\n    margin-top: 1rem;\n    opacity: 1;\n\n    &&.${classes.notificationItemOpened} {\n        animation: 0.4s showAnimation ease-out;\n    }\n\n    &&.${classes.notificationItemHidden} {\n        animation: 0.4s hideAnimation ease-out;\n    }\n\n    @keyframes showAnimation {\n        0% {\n            transform: translateX(100%);\n            opacity: 0;\n        }\n\n        100% {\n            transform: translateX(0);\n            opacity: 1;\n        }\n    }\n\n    @keyframes hideAnimation {\n        0% {\n            transform: translateX(0);\n            opacity: 1;\n        }\n\n        100% {\n            transform: translateX(100%);\n            opacity: 0;\n        }\n    }\n`;\n\nexport const StyledRoot = styled.div`\n    display: flex;\n    flex-direction: column-reverse;\n    box-sizing: border-box;\n    padding: 0 1.5rem 1.5rem;\n    max-height: 100%;\n    align-items: flex-end;\n`;\n"],"names":["StyledNotification","mergedButtonConfig","mergeConfig","buttonConfig","Button","component","_exp","CloseIconWrapper","styled","name","class","propsAsIs","Wrapper","_exp10","_ref","iconPlacement","placements","left","concat","tokens","buttonsMarginLeft","ButtonsWrapper","vars","_exp14","_ref2","contentLeftIconMargin","_exp15","_ref3","top","contentTopIconMargin","IconWrapper","_exp18","_ref4","_exp19","_ref5","contentPaddingTop","contentPaddingTopWithoutIcon","ContentBox","_exp25","_ref6","textboxPaddingTopWithTopIcon","textboxPaddingTop","_exp26","_ref7","showCloseIcon","textboxPaddingRightWithCloseIcon","textboxPaddingRight","TextBox","StyledTitle","StyledContent","StyledItemWrapper","StyledRoot"],"mappings":"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"}
+{"version":3,"file":"Notification.styles.js","sources":["../../../src/components/Notification/Notification.styles.ts"],"sourcesContent":["import { css } from '@linaria/core';\nimport { styled } from '@linaria/react';\n\nimport { applyHyphens } from '../../mixins';\nimport { buttonConfig } from '../Button';\nimport { component, mergeConfig } from '../../engines';\n\nimport { classes, tokens } from './Notification.tokens';\nimport { CloseIconType, IconPlacementType, placements } from './Notification.types';\n\nexport const StyledNotification = css`\n    width: fit-content;\n`;\n\nconst mergedButtonConfig = mergeConfig(buttonConfig);\nconst Button = component(mergedButtonConfig);\n\nexport const CloseIconWrapper = styled(Button)`\n    position: absolute;\n    width: 1.5rem;\n    height: 1.5rem;\n\n    color: var(${tokens.closeIconColor});\n\n    :hover {\n        color: var(${tokens.closeIconColorOnHover});\n    }\n\n    &.${classes.horizontal} {\n        position: relative;\n    }\n`;\n\nexport const Wrapper = styled.div`\n    position: relative;\n    box-sizing: border-box;\n\n    background: var(${tokens.background});\n    border-radius: var(${tokens.borderRadius});\n\n    &.${classes.horizontal} {\n        display: flex;\n        align-items: center;\n        gap: var(${tokens.horizontalLayoutGap});\n    }\n`;\n\nexport const ButtonsWrapper = styled.div<IconPlacementType>`\n    margin-top: var(${tokens.buttonsMarginTop});\n    margin-left: ${({ iconPlacement }) =>\n        iconPlacement === placements.left ? `var(${tokens.buttonsMarginLeft})` : 'unset'};\n\n    &.${classes.horizontal} {\n        margin-top: unset;\n        margin-left: unset;\n    }\n`;\n\nexport const IconWrapper = styled.div<IconPlacementType>`\n    width: var(${tokens.contentLeftIconSize});\n    height: var(${tokens.contentLeftIconSize});\n\n    margin-right: ${({ iconPlacement }) =>\n        iconPlacement === placements.left ? `var(${tokens.contentLeftIconMargin})` : 'unset'};\n    margin-bottom: ${({ iconPlacement }) =>\n        iconPlacement === placements.top ? `var(${tokens.contentTopIconMargin})` : 'unset'};\n\n    &.${classes.horizontal} {\n        margin-right: var(${tokens.horizontalLayoutLeftIconMargin});\n        margin-bottom: unset;\n    }\n`;\n\nexport const ContentBox = styled.div<IconPlacementType>`\n    // TODO: переделать, когда научимся работать с токенами при пересечнии свойств\n    // issue #909\n    display: ${({ iconPlacement }) => (iconPlacement === placements.left ? 'flex' : 'block')};\n\n    padding-top: ${({ iconPlacement }) =>\n        iconPlacement ? `var(${tokens.contentPaddingTop})` : `var(${tokens.contentPaddingTopWithoutIcon})`};\n\n    &.${classes.horizontal} {\n        padding: unset;\n        display: flex;\n        align-items: center;\n        flex-grow: 1;\n    }\n`;\n\nexport const TextBox = styled.div<CloseIconType & IconPlacementType>`\n    padding: var(${tokens.textboxPaddingTop}) var(${tokens.textboxPaddingRight}) var(${tokens.textboxPaddingBottom})\n        var(${tokens.textboxPaddingLeft});\n\n    padding-top: ${({ iconPlacement }) =>\n        !iconPlacement || iconPlacement === placements.top\n            ? `var(${tokens.textboxPaddingTopWithTopIcon})`\n            : `var(${tokens.textboxPaddingTop})`};\n    padding-right: ${({ showCloseIcon, iconPlacement }) =>\n        showCloseIcon && iconPlacement !== placements.top\n            ? `var(${tokens.textboxPaddingRightWithCloseIcon})`\n            : `var(${tokens.textboxPaddingRight})`};\n\n    display: flex;\n    flex-direction: column;\n    row-gap: var(${tokens.textboxGap});\n    word-break: break-word;\n\n    &.${classes.horizontal} {\n        padding: unset;\n    }\n`;\n\nexport const StyledTitle = styled.div`\n    font-family: var(${tokens.titleFontFamily});\n    font-size: var(${tokens.titleFontSize});\n    font-style: var(${tokens.titleFontStyle});\n    font-weight: var(${tokens.titleFontWeight});\n    letter-spacing: var(${tokens.titleFontLetterSpacing});\n    line-height: var(${tokens.titleFontLineHeight});\n    ${String(applyHyphens)};\n`;\n\nexport const StyledContent = styled.div`\n    font-family: var(${tokens.contentFontFamily});\n    font-size: var(${tokens.contentFontSize});\n    font-style: var(${tokens.contentFontStyle});\n    font-weight: var(${tokens.contentFontWeight});\n    letter-spacing: var(${tokens.contentFontLetterSpacing});\n    line-height: var(${tokens.contentFontLineHeight});\n    ${String(applyHyphens)};\n\n    color: var(${tokens.contentColor});\n`;\n\nexport const StyledItemWrapper = styled.div<{ isHidden: boolean }>`\n    margin-top: 1rem;\n    opacity: 1;\n\n    &&.${classes.notificationItemOpened} {\n        animation: 0.4s showAnimation ease-out;\n    }\n\n    &&.${classes.notificationItemHidden} {\n        animation: 0.4s hideAnimation ease-out;\n    }\n\n    @keyframes showAnimation {\n        0% {\n            transform: translateX(100%);\n            opacity: 0;\n        }\n\n        100% {\n            transform: translateX(0);\n            opacity: 1;\n        }\n    }\n\n    @keyframes hideAnimation {\n        0% {\n            transform: translateX(0);\n            opacity: 1;\n        }\n\n        100% {\n            transform: translateX(100%);\n            opacity: 0;\n        }\n    }\n`;\n\nexport const StyledRoot = styled.div`\n    display: flex;\n    flex-direction: column-reverse;\n    box-sizing: border-box;\n    padding: 0 1.5rem 1.5rem;\n    max-height: 100%;\n    align-items: flex-end;\n`;\n"],"names":["StyledNotification","mergedButtonConfig","mergeConfig","buttonConfig","Button","component","_exp","CloseIconWrapper","styled","name","class","propsAsIs","Wrapper","_exp10","_ref","iconPlacement","placements","left","concat","tokens","buttonsMarginLeft","ButtonsWrapper","vars","_exp14","_ref2","contentLeftIconMargin","_exp15","_ref3","top","contentTopIconMargin","IconWrapper","_exp18","_ref4","_exp19","_ref5","contentPaddingTop","contentPaddingTopWithoutIcon","ContentBox","_exp25","_ref6","textboxPaddingTopWithTopIcon","textboxPaddingTop","_exp26","_ref7","showCloseIcon","textboxPaddingRightWithCloseIcon","textboxPaddingRight","TextBox","StyledTitle","StyledContent","StyledItemWrapper","StyledRoot"],"mappings":"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"}

package/es/components/Notification/NotificationsPortal.js

@@ -3,13 +3,14 @@ import { objectWithoutProperties as _objectWithoutProperties, extends as _extend
 import React, { useMemo } from 'react';
 import { useStoreon } from 'storeon/react';
 import { styled } from '@linaria/react';
+import { PopupProvider } from '../Popup/PopupContext.js';
+import { popupConfig } from '../Popup/Popup.js';
+import '@linaria/core';
+import { component } from '../../engines/common.js';
 import { cx } from '../../utils/index.js';
 import { closeNotification } from './NotificationsStore.js';
 import { StyledRoot, StyledItemWrapper } from './Notification.styles.js';
 import { classes } from './Notification.tokens.js';
-import { component } from '../../engines/common.js';
-import { PopupProvider } from '../Popup/PopupContext.js';
-import { popupConfig } from '../Popup/Popup.js';
 
 var _excluded = ["id", "isHidden"];
 

package/es/components/Notification/NotificationsPortal.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationsPortal.js","sources":["../../../src/components/Notification/NotificationsPortal.tsx"],"sourcesContent":["import React, { FC, ForwardRefExoticComponent, RefAttributes, useMemo } from 'react';\nimport { useStoreon } from 'storeon/react';\nimport { styled } from '@linaria/react';\nimport { popupBaseRootClass } from '@salutejs/plasma-core';\n\nimport { PopupProvider, popupConfig } from '../Popup';\nimport { component } from '../../engines';\nimport { cx } from '../../utils';\n\nimport { NotificationsState, NotificationsEvents, closeNotification } from './NotificationsStore';\nimport { NotificationPortalProps, NotificationProps } from './Notification.types';\nimport { StyledItemWrapper, StyledRoot } from './Notification.styles';\nimport { classes } from './Notification.tokens';\n\n// issue #823\nconst Popup = component(popupConfig);\n\nconst StyledPopup = styled(Popup)`\n    & > .${popupBaseRootClass} {\n        overflow: hidden;\n    }\n`;\n\n/**\n * Обертка для визуального представления уведомлений.\n */\nexport const NotificationsPortal: FC<NotificationPortalProps> = ({ config, frame }) => {\n    const { notifications } = useStoreon<NotificationsState, NotificationsEvents>('notifications');\n\n    const Notification = useMemo(\n        () => component(config) as ForwardRefExoticComponent<NotificationProps & RefAttributes<HTMLDivElement>>,\n        [],\n    );\n\n    return (\n        <PopupProvider>\n            {notifications.length > 0 && (\n                <StyledPopup opened frame={frame} placement=\"bottom-right\" zIndex=\"9100\">\n                    <StyledRoot>\n                        {notifications.map(({ id, isHidden, ...rest }) => (\n                            <StyledItemWrapper\n                                key={id}\n                                className={cx(\n                                    isHidden ? classes.notificationItemHidden : classes.notificationItemOpened,\n                                )}\n                                isHidden={isHidden || false}\n                            >\n                                <Notification\n                                    key={id}\n                                    id={id}\n                                    onCloseButtonClick={() => closeNotification(id)}\n                                    {...rest}\n                                />\n                            </StyledItemWrapper>\n                        ))}\n                    </StyledRoot>\n                </StyledPopup>\n            )}\n        </PopupProvider>\n    );\n};\n"],"names":["Popup","component","popupConfig","_exp","StyledPopup","styled","name","class","propsAsIs","NotificationsPortal","_ref","config","frame","_useStoreon","useStoreon","notifications","Notification","useMemo","React","createElement","PopupProvider","length","opened","placement","zIndex","StyledRoot","map","_ref2","id","isHidden","rest","StyledItemWrapper","key","className","cx","classes","notificationItemHidden","notificationItemOpened","_extends","onCloseButtonClick","closeNotification"],"mappings":";;;;;;;;;;;;;;AAcA;AACA,IAAMA,KAAK,gBAAGC,SAAS,CAACC,WAAW,CAAC,CAAA;AAAC,IAAAC,IAAA,GAdnBA,SAcmBA,IAAAA,GAAA;AAAA,EAAA,OAEVH,KAAK,CAAA;AAAA,CAAA,CAAA;AAAhC,IAAMI,WAAW,gBAAGC,MAAM,CAAAF,IAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAIzB,CAAA,CAAA;;AAED;AACA;AACA;IACaC,mBAAgD,GAAGA,SAAnDA,mBAAgDA,CAAAC,IAAA,EAA0B;AAAA,EAAA,IAApBC,MAAM,GAAAD,IAAA,CAANC,MAAM;IAAEC,KAAAA,GAAAA,IAAAA,CAAAA,KAAAA,CAAAA;AACvE,EAAA,IAAAC,WAAA,GAA0BC,UAAU,CAA0C,eAAe,CAAC;IAAtFC,aAAAA,GAAAA,WAAAA,CAAAA,aAAAA,CAAAA;EAER,IAAMC,YAAY,GAAGC,OAAO,CACxB,YAAA;IAAA,OAAMhB,SAAS,CAACU,MAAM,CAAC,CAAA;GACvB,EAAA,EACJ,CAAC,CAAA;AAED,EAAA,oBACIO,KAAA,CAAAC,aAAA,CAACC,aAAa,QACTL,aAAa,CAACM,MAAM,GAAG,CAAC,iBACrBH,KAAA,CAAAC,aAAA,CAACf,WAAW,EAAA;IAACkB,MAAM,EAAA,IAAA;AAACV,IAAAA,KAAK,EAAEA,KAAM;AAACW,IAAAA,SAAS,EAAC,cAAc;AAACC,IAAAA,MAAM,EAAC,MAAA;GAC9DN,eAAAA,KAAA,CAAAC,aAAA,CAACM,UAAU,EACNV,IAAAA,EAAAA,aAAa,CAACW,GAAG,CAAC,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGC,EAAE,GAAAD,KAAA,CAAFC,EAAE;MAAEC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;AAAKC,MAAAA,IAAAA,GAAAA,wBAAAA,CAAAA,KAAAA,EAAAA,SAAAA,CAAAA,CAAAA;AAAAA,IAAAA,oBACnCZ,KAAA,CAAAC,aAAA,CAACY,iBAAiB,EAAA;AACdC,MAAAA,GAAG,EAAEJ,EAAG;AACRK,MAAAA,SAAS,EAAEC,EAAE,CACTL,QAAQ,GAAGM,OAAO,CAACC,sBAAsB,GAAGD,OAAO,CAACE,sBACxD,CAAE;MACFR,QAAQ,EAAEA,QAAQ,IAAI,KAAA;AAAM,KAAA,eAE5BX,KAAA,CAAAC,aAAA,CAACH,YAAY,EAAAsB,QAAA,CAAA;AACTN,MAAAA,GAAG,EAAEJ,EAAG;AACRA,MAAAA,EAAE,EAAEA,EAAG;MACPW,kBAAkB,EAAE,SAAAA,kBAAA,GAAA;QAAA,OAAMC,iBAAiB,CAACZ,EAAE,CAAC,CAAA;AAAA,OAAA;KAC3CE,EAAAA,IAAI,CAAC,CAEE,CACtB,CAAA;GACO,CAAA,CACH,CAEN,CAAC,CAAA;AAExB;;;;"}
+{"version":3,"file":"NotificationsPortal.js","sources":["../../../src/components/Notification/NotificationsPortal.tsx"],"sourcesContent":["import React, { FC, ForwardRefExoticComponent, RefAttributes, useMemo } from 'react';\nimport { useStoreon } from 'storeon/react';\nimport { styled } from '@linaria/react';\nimport { popupBaseRootClass } from '@salutejs/plasma-core';\n\nimport { PopupProvider, popupConfig } from '../Popup';\nimport { component } from '../../engines';\nimport { cx } from '../../utils';\n\nimport { NotificationsState, NotificationsEvents, closeNotification } from './NotificationsStore';\nimport { NotificationPortalProps, NotificationProps } from './Notification.types';\nimport { StyledItemWrapper, StyledRoot } from './Notification.styles';\nimport { classes } from './Notification.tokens';\n\n// issue #823\nconst Popup = component(popupConfig);\n\nconst StyledPopup = styled(Popup)`\n    & > .${popupBaseRootClass} {\n        overflow: hidden;\n    }\n`;\n\n/**\n * Обертка для визуального представления уведомлений.\n */\nexport const NotificationsPortal: FC<NotificationPortalProps> = ({ config, frame }) => {\n    const { notifications } = useStoreon<NotificationsState, NotificationsEvents>('notifications');\n\n    const Notification = useMemo(\n        () => component(config) as ForwardRefExoticComponent<NotificationProps & RefAttributes<HTMLDivElement>>,\n        [],\n    );\n\n    return (\n        <PopupProvider>\n            {notifications.length > 0 && (\n                <StyledPopup opened frame={frame} placement=\"bottom-right\" zIndex=\"9100\">\n                    <StyledRoot>\n                        {notifications.map(({ id, isHidden, ...rest }) => (\n                            <StyledItemWrapper\n                                key={id}\n                                className={cx(\n                                    isHidden ? classes.notificationItemHidden : classes.notificationItemOpened,\n                                )}\n                                isHidden={isHidden || false}\n                            >\n                                <Notification\n                                    key={id}\n                                    id={id}\n                                    onCloseButtonClick={() => closeNotification(id)}\n                                    {...rest}\n                                />\n                            </StyledItemWrapper>\n                        ))}\n                    </StyledRoot>\n                </StyledPopup>\n            )}\n        </PopupProvider>\n    );\n};\n"],"names":["Popup","component","popupConfig","_exp","StyledPopup","styled","name","class","propsAsIs","NotificationsPortal","_ref","config","frame","_useStoreon","useStoreon","notifications","Notification","useMemo","React","createElement","PopupProvider","length","opened","placement","zIndex","StyledRoot","map","_ref2","id","isHidden","rest","StyledItemWrapper","key","className","cx","classes","notificationItemHidden","notificationItemOpened","_extends","onCloseButtonClick","closeNotification"],"mappings":";;;;;;;;;;;;;;;AAcA;AACA,IAAMA,KAAK,gBAAGC,SAAS,CAACC,WAAW,CAAC,CAAA;AAAC,IAAAC,IAAA,GAdnBA,SAcmBA,IAAAA,GAAA;AAAA,EAAA,OAEVH,KAAK,CAAA;AAAA,CAAA,CAAA;AAAhC,IAAMI,WAAW,gBAAGC,MAAM,CAAAF,IAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAIzB,CAAA,CAAA;;AAED;AACA;AACA;IACaC,mBAAgD,GAAGA,SAAnDA,mBAAgDA,CAAAC,IAAA,EAA0B;AAAA,EAAA,IAApBC,MAAM,GAAAD,IAAA,CAANC,MAAM;IAAEC,KAAAA,GAAAA,IAAAA,CAAAA,KAAAA,CAAAA;AACvE,EAAA,IAAAC,WAAA,GAA0BC,UAAU,CAA0C,eAAe,CAAC;IAAtFC,aAAAA,GAAAA,WAAAA,CAAAA,aAAAA,CAAAA;EAER,IAAMC,YAAY,GAAGC,OAAO,CACxB,YAAA;IAAA,OAAMhB,SAAS,CAACU,MAAM,CAAC,CAAA;GACvB,EAAA,EACJ,CAAC,CAAA;AAED,EAAA,oBACIO,KAAA,CAAAC,aAAA,CAACC,aAAa,QACTL,aAAa,CAACM,MAAM,GAAG,CAAC,iBACrBH,KAAA,CAAAC,aAAA,CAACf,WAAW,EAAA;IAACkB,MAAM,EAAA,IAAA;AAACV,IAAAA,KAAK,EAAEA,KAAM;AAACW,IAAAA,SAAS,EAAC,cAAc;AAACC,IAAAA,MAAM,EAAC,MAAA;GAC9DN,eAAAA,KAAA,CAAAC,aAAA,CAACM,UAAU,EACNV,IAAAA,EAAAA,aAAa,CAACW,GAAG,CAAC,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGC,EAAE,GAAAD,KAAA,CAAFC,EAAE;MAAEC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;AAAKC,MAAAA,IAAAA,GAAAA,wBAAAA,CAAAA,KAAAA,EAAAA,SAAAA,CAAAA,CAAAA;AAAAA,IAAAA,oBACnCZ,KAAA,CAAAC,aAAA,CAACY,iBAAiB,EAAA;AACdC,MAAAA,GAAG,EAAEJ,EAAG;AACRK,MAAAA,SAAS,EAAEC,EAAE,CACTL,QAAQ,GAAGM,OAAO,CAACC,sBAAsB,GAAGD,OAAO,CAACE,sBACxD,CAAE;MACFR,QAAQ,EAAEA,QAAQ,IAAI,KAAA;AAAM,KAAA,eAE5BX,KAAA,CAAAC,aAAA,CAACH,YAAY,EAAAsB,QAAA,CAAA;AACTN,MAAAA,GAAG,EAAEJ,EAAG;AACRA,MAAAA,EAAE,EAAEA,EAAG;MACPW,kBAAkB,EAAE,SAAAA,kBAAA,GAAA;QAAA,OAAMC,iBAAiB,CAACZ,EAAE,CAAC,CAAA;AAAA,OAAA;KAC3CE,EAAAA,IAAI,CAAC,CAEE,CACtB,CAAA;GACO,CAAA,CACH,CAEN,CAAC,CAAA;AAExB;;;;"}

package/es/components/Pagination/Pagination.styles.js

@@ -1,8 +1,9 @@
 import './Pagination.styles_y6gcva.css';
 import { styled } from '@linaria/react';
-import { component, mergeConfig } from '../../engines/common.js';
 import { buttonConfig } from '../Button/Button.js';
 import { buttonGroupConfig } from '../ButtonGroup/ButtonGroup.js';
+import '@linaria/core';
+import { component, mergeConfig } from '../../engines/common.js';
 
 var mergedButtonConfig = /*#__PURE__*/mergeConfig(buttonConfig);
 var Button = /*#__PURE__*/component(mergedButtonConfig);

package/es/components/Pagination/Pagination.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.styles.js","sources":["../../../src/components/Pagination/Pagination.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { buttonConfig, buttonTokens } from '../Button';\nimport { buttonGroupConfig, buttonGroupTokens } from '../ButtonGroup';\nimport { component, mergeConfig } from '../../engines';\nimport { addFocus } from '../../mixins';\n\nimport { classes, tokens } from './Pagination.tokens';\n\nconst mergedButtonConfig = mergeConfig(buttonConfig);\nconst Button = component(mergedButtonConfig);\n\nconst mergedButtonGroupConfig = mergeConfig(buttonGroupConfig);\nconst ButtonGroup = component(mergedButtonGroupConfig);\n\nexport const PaginationRoot = styled.div`\n    display: flex;\n    color: var(${tokens.paginationColor});\n\n    &.${classes.compactType} {\n        display: flex;\n        flex-direction: column;\n        gap: 0.5rem;\n    }\n    &.${classes.defaultType} {\n        display: flex;\n        justify-content: space-between;\n        flex: 0 0 100%;\n        gap: 1rem;\n        flex-wrap: wrap;\n    }\n`;\n\nexport const PaginationPages = styled.div`\n    display: flex;\n    align-items: center;\n    gap: 0.25rem;\n    margin: 0 auto;\n`;\n\nexport const PaginationActions = styled.div`\n    display: flex;\n    justify-content: space-between;\n    flex-grow: 1;\n    gap: 0.625rem;\n    &.${classes.compactType} {\n        flex-direction: row;\n    }\n\n    &.${classes.withHasPerPageSelect} {\n        flex-direction: row-reverse;\n    }\n\n    &.${classes.withHasQuickJump} {\n        flex-direction: row;\n    }\n`;\n\nexport const PaginationSection = styled.div`\n    display: flex;\n    gap: 0.125rem;\n`;\n\nexport const PaginationButtonGroup = styled(ButtonGroup)`\n    ${buttonGroupTokens.buttonColor}: var(${tokens.buttonColor});\n    ${buttonGroupTokens.buttonBackgroundColor}: var(${tokens.buttonBackgroundColor});\n\n    ${buttonGroupTokens.buttonColorHover}: var(${tokens.buttonHoverColor});\n    ${buttonGroupTokens.buttonBackgroundColorHover}: var(${tokens.buttonBackgroundColorHover});\n\n    ${buttonGroupTokens.buttonColorActive}: var(${tokens.buttonActiveColor});\n    ${buttonGroupTokens.buttonBackgroundColorActive}: var(${tokens.buttonBackgroundColorActive});\n\n    ${buttonGroupTokens.buttonFontFamily}: var(${tokens.paginationFontFamily});\n    ${buttonGroupTokens.buttonFontSize}: var(${tokens.paginationFontSize});\n    ${buttonGroupTokens.buttonFontStyle}: var(${tokens.paginationFontStyle});\n    ${buttonGroupTokens.buttonFontWeight}:var(${tokens.paginationFontWeight});\n    ${buttonGroupTokens.buttonLetterSpacing}: var(${tokens.paginationLetterSpacing});\n    ${buttonGroupTokens.buttonLineHeight}: var(${tokens.paginationLineHeight});\n\n    ${buttonGroupTokens.buttonWidth}: var(${tokens.buttonWidth});\n    ${buttonGroupTokens.buttonHeight}: var(${tokens.buttonHeight});\n\n    ${buttonGroupTokens.buttonDefaultRadius}: var(${tokens.buttonRadius});\n    ${buttonGroupTokens.buttonSideRadius}: var(${tokens.buttonRadius});\n    ${buttonGroupTokens.buttonSegmentedRadius}: var(${tokens.buttonRadius});\n    ${buttonGroupTokens.buttonRadiusCircle}: var(${tokens.buttonRadius});\n`;\n\nexport const PaginationButton = styled(Button)`\n    ${buttonTokens.buttonColor}: var(${tokens.buttonColor});\n    ${buttonTokens.buttonBackgroundColor}: var(${tokens.buttonBackgroundColor});\n\n    ${buttonTokens.buttonColorHover}: var(${tokens.buttonHoverColor});\n    ${buttonTokens.buttonBackgroundColorHover}: var(${tokens.buttonBackgroundColorHover});\n\n    ${buttonTokens.buttonColorActive}: var(${tokens.buttonActiveColor});\n    ${buttonTokens.buttonBackgroundColorActive}: var(${tokens.buttonBackgroundColorActive});\n\n\n    ${buttonTokens.buttonFontFamily}: var(${tokens.paginationFontFamily});\n    ${buttonTokens.buttonFontSize}: var(${tokens.paginationFontSize});\n    ${buttonTokens.buttonFontStyle}: var(${tokens.paginationFontStyle});\n    ${buttonTokens.buttonFontWeight}:var(${tokens.paginationFontWeight});\n    ${buttonTokens.buttonLetterSpacing}: var(${tokens.paginationLetterSpacing});\n    ${buttonTokens.buttonLineHeight}: var(${tokens.paginationLineHeight});\n\n    ${buttonTokens.buttonWidth}: var(${tokens.buttonWidth});\n    ${buttonTokens.buttonHeight}: var(${tokens.buttonHeight});\n    ${buttonTokens.buttonRadius}: var(${tokens.buttonRadius});\n\n    ${buttonTokens.buttonDisabledOpacity}: var(${tokens.buttonDisabledOpacity});\n    ${buttonTokens.buttonFocusColor}: var(${tokens.buttonFocusColor});\n\n    &.${classes.paginationPageButtonActive} {\n        ${buttonTokens.buttonColor}: var(${tokens.paginationCurrentButtonColor});\n        ${buttonTokens.buttonBackgroundColor}: var(${tokens.paginationCurrentButtonBackgroundColor});\n\n        ${buttonTokens.buttonColorHover}: var(${tokens.paginationCurrentButtonHoverColor});\n        ${buttonTokens.buttonBackgroundColorHover}: var(${tokens.paginationCurrentButtonHoverBackgroundColor});\n\n        ${buttonTokens.buttonColorActive}: var(${tokens.paginationCurrentButtonActiveColor});\n        ${buttonTokens.buttonBackgroundColorActive}: var(${tokens.paginationCurrentButtonActiveBackgroundColor});\n    }\n\n    :focus {\n        outline: none;\n    }\n\n    ${addFocus({\n        outlineOffset: 'calc(-1 * var(--plasma_private-btn-outline-size))',\n        outlineSize: 'var(--plasma_private-btn-outline-size)',\n        outlineRadius: 'var(--plasma_private-btn-br)',\n        outlineColor: `var(${tokens.buttonFocusColor})`,\n    })}\n`;\n\nexport const PaginationShorter = styled(PaginationButton)`\n    ${buttonTokens.buttonWidth}: var(${tokens.buttonWidthShorter});\n    ${buttonTokens.buttonPadding}: 0;\n`;\n"],"names":["mergedButtonConfig","mergeConfig","buttonConfig","Button","component","mergedButtonGroupConfig","buttonGroupConfig","ButtonGroup","PaginationRoot","styled","name","class","propsAsIs","PaginationPages","PaginationActions","PaginationSection","_exp7","PaginationButtonGroup","_exp44","PaginationButton","_exp93","PaginationShorter"],"mappings":";;;;;AASA,IAAMA,kBAAkB,gBAAGC,WAAW,CAACC,YAAY,CAAC,CAAA;AACpD,IAAMC,MAAM,gBAAGC,SAAS,CAACJ,kBAAkB,CAAC,CAAA;AAE5C,IAAMK,uBAAuB,gBAAGJ,WAAW,CAACK,iBAAiB,CAAC,CAAA;AAC9D,IAAMC,WAAW,gBAAGH,SAAS,CAACC,uBAAuB,CAAC,CAAA;AAE/C,IAAMG,cAAc,gBAAGC,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,gBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAgBnC,EAAA;AAEM,IAAMC,eAAe,gBAAGJ,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,iBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAKpC,EAAA;AAEM,IAAME,iBAAiB,gBAAGL,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAgBtC,EAAA;AAEM,IAAMG,iBAAiB,gBAAGN,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAGtC,EAAA;AAAC,IAAAI,KAAA,GA5DgBA,SA4DhBA,KAAAA,GAAA;AAAA,EAAA,OAE0CT,WAAW,CAAA;AAAA,CAAA,CAAA;AAAhD,IAAMU,qBAAqB,gBAAGR,MAAM,CAAAO,KAAA,EAAA,CAAA,CAAA;AAAAN,EAAAA,IAAA,EAAA,uBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAwB1C,EAAA;AAAC,IAAAM,MAAA,GAtFgBA,SAsFhBA,MAAAA,GAAA;AAAA,EAAA,OAEqCf,MAAM,CAAA;AAAA,CAAA,CAAA;AAAtC,IAAMgB,gBAAgB,gBAAGV,MAAM,CAAAS,MAAA,EAAA,CAAA,CAAA;AAAAR,EAAAA,IAAA,EAAA,kBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CA8CrC,EAAA;AAAC,IAAAQ,MAAA,GAtIgBA,SAsIhBA,MAAAA,GAAA;AAAA,EAAA,OAEsCD,gBAAgB,CAAA;AAAA,CAAA,CAAA;AAAjD,IAAME,iBAAiB,gBAAGZ,MAAM,CAAAW,MAAA,EAAA,CAAA,CAAA;AAAAV,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAGtC;;;;"}
+{"version":3,"file":"Pagination.styles.js","sources":["../../../src/components/Pagination/Pagination.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { buttonConfig, buttonTokens } from '../Button';\nimport { buttonGroupConfig, buttonGroupTokens } from '../ButtonGroup';\nimport { component, mergeConfig } from '../../engines';\nimport { addFocus } from '../../mixins';\n\nimport { classes, tokens } from './Pagination.tokens';\n\nconst mergedButtonConfig = mergeConfig(buttonConfig);\nconst Button = component(mergedButtonConfig);\n\nconst mergedButtonGroupConfig = mergeConfig(buttonGroupConfig);\nconst ButtonGroup = component(mergedButtonGroupConfig);\n\nexport const PaginationRoot = styled.div`\n    display: flex;\n    color: var(${tokens.paginationColor});\n\n    &.${classes.compactType} {\n        display: flex;\n        flex-direction: column;\n        gap: 0.5rem;\n    }\n    &.${classes.defaultType} {\n        display: flex;\n        justify-content: space-between;\n        flex: 0 0 100%;\n        gap: 1rem;\n        flex-wrap: wrap;\n    }\n`;\n\nexport const PaginationPages = styled.div`\n    display: flex;\n    align-items: center;\n    gap: 0.25rem;\n    margin: 0 auto;\n`;\n\nexport const PaginationActions = styled.div`\n    display: flex;\n    justify-content: space-between;\n    flex-grow: 1;\n    gap: 0.625rem;\n    &.${classes.compactType} {\n        flex-direction: row;\n    }\n\n    &.${classes.withHasPerPageSelect} {\n        flex-direction: row-reverse;\n    }\n\n    &.${classes.withHasQuickJump} {\n        flex-direction: row;\n    }\n`;\n\nexport const PaginationSection = styled.div`\n    display: flex;\n    gap: 0.125rem;\n`;\n\nexport const PaginationButtonGroup = styled(ButtonGroup)`\n    ${buttonGroupTokens.buttonColor}: var(${tokens.buttonColor});\n    ${buttonGroupTokens.buttonBackgroundColor}: var(${tokens.buttonBackgroundColor});\n\n    ${buttonGroupTokens.buttonColorHover}: var(${tokens.buttonHoverColor});\n    ${buttonGroupTokens.buttonBackgroundColorHover}: var(${tokens.buttonBackgroundColorHover});\n\n    ${buttonGroupTokens.buttonColorActive}: var(${tokens.buttonActiveColor});\n    ${buttonGroupTokens.buttonBackgroundColorActive}: var(${tokens.buttonBackgroundColorActive});\n\n    ${buttonGroupTokens.buttonFontFamily}: var(${tokens.paginationFontFamily});\n    ${buttonGroupTokens.buttonFontSize}: var(${tokens.paginationFontSize});\n    ${buttonGroupTokens.buttonFontStyle}: var(${tokens.paginationFontStyle});\n    ${buttonGroupTokens.buttonFontWeight}:var(${tokens.paginationFontWeight});\n    ${buttonGroupTokens.buttonLetterSpacing}: var(${tokens.paginationLetterSpacing});\n    ${buttonGroupTokens.buttonLineHeight}: var(${tokens.paginationLineHeight});\n\n    ${buttonGroupTokens.buttonWidth}: var(${tokens.buttonWidth});\n    ${buttonGroupTokens.buttonHeight}: var(${tokens.buttonHeight});\n\n    ${buttonGroupTokens.buttonDefaultRadius}: var(${tokens.buttonRadius});\n    ${buttonGroupTokens.buttonSideRadius}: var(${tokens.buttonRadius});\n    ${buttonGroupTokens.buttonSegmentedRadius}: var(${tokens.buttonRadius});\n    ${buttonGroupTokens.buttonRadiusCircle}: var(${tokens.buttonRadius});\n`;\n\nexport const PaginationButton = styled(Button)`\n    ${buttonTokens.buttonColor}: var(${tokens.buttonColor});\n    ${buttonTokens.buttonBackgroundColor}: var(${tokens.buttonBackgroundColor});\n\n    ${buttonTokens.buttonColorHover}: var(${tokens.buttonHoverColor});\n    ${buttonTokens.buttonBackgroundColorHover}: var(${tokens.buttonBackgroundColorHover});\n\n    ${buttonTokens.buttonColorActive}: var(${tokens.buttonActiveColor});\n    ${buttonTokens.buttonBackgroundColorActive}: var(${tokens.buttonBackgroundColorActive});\n\n\n    ${buttonTokens.buttonFontFamily}: var(${tokens.paginationFontFamily});\n    ${buttonTokens.buttonFontSize}: var(${tokens.paginationFontSize});\n    ${buttonTokens.buttonFontStyle}: var(${tokens.paginationFontStyle});\n    ${buttonTokens.buttonFontWeight}:var(${tokens.paginationFontWeight});\n    ${buttonTokens.buttonLetterSpacing}: var(${tokens.paginationLetterSpacing});\n    ${buttonTokens.buttonLineHeight}: var(${tokens.paginationLineHeight});\n\n    ${buttonTokens.buttonWidth}: var(${tokens.buttonWidth});\n    ${buttonTokens.buttonHeight}: var(${tokens.buttonHeight});\n    ${buttonTokens.buttonRadius}: var(${tokens.buttonRadius});\n\n    ${buttonTokens.buttonDisabledOpacity}: var(${tokens.buttonDisabledOpacity});\n    ${buttonTokens.buttonFocusColor}: var(${tokens.buttonFocusColor});\n\n    &.${classes.paginationPageButtonActive} {\n        ${buttonTokens.buttonColor}: var(${tokens.paginationCurrentButtonColor});\n        ${buttonTokens.buttonBackgroundColor}: var(${tokens.paginationCurrentButtonBackgroundColor});\n\n        ${buttonTokens.buttonColorHover}: var(${tokens.paginationCurrentButtonHoverColor});\n        ${buttonTokens.buttonBackgroundColorHover}: var(${tokens.paginationCurrentButtonHoverBackgroundColor});\n\n        ${buttonTokens.buttonColorActive}: var(${tokens.paginationCurrentButtonActiveColor});\n        ${buttonTokens.buttonBackgroundColorActive}: var(${tokens.paginationCurrentButtonActiveBackgroundColor});\n    }\n\n    :focus {\n        outline: none;\n    }\n\n    ${addFocus({\n        outlineOffset: 'calc(-1 * var(--plasma_private-btn-outline-size))',\n        outlineSize: 'var(--plasma_private-btn-outline-size)',\n        outlineRadius: 'var(--plasma_private-btn-br)',\n        outlineColor: `var(${tokens.buttonFocusColor})`,\n    })}\n`;\n\nexport const PaginationShorter = styled(PaginationButton)`\n    ${buttonTokens.buttonWidth}: var(${tokens.buttonWidthShorter});\n    ${buttonTokens.buttonPadding}: 0;\n`;\n"],"names":["mergedButtonConfig","mergeConfig","buttonConfig","Button","component","mergedButtonGroupConfig","buttonGroupConfig","ButtonGroup","PaginationRoot","styled","name","class","propsAsIs","PaginationPages","PaginationActions","PaginationSection","_exp7","PaginationButtonGroup","_exp44","PaginationButton","_exp93","PaginationShorter"],"mappings":";;;;;;AASA,IAAMA,kBAAkB,gBAAGC,WAAW,CAACC,YAAY,CAAC,CAAA;AACpD,IAAMC,MAAM,gBAAGC,SAAS,CAACJ,kBAAkB,CAAC,CAAA;AAE5C,IAAMK,uBAAuB,gBAAGJ,WAAW,CAACK,iBAAiB,CAAC,CAAA;AAC9D,IAAMC,WAAW,gBAAGH,SAAS,CAACC,uBAAuB,CAAC,CAAA;AAE/C,IAAMG,cAAc,gBAAGC,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,gBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAgBnC,EAAA;AAEM,IAAMC,eAAe,gBAAGJ,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,iBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAKpC,EAAA;AAEM,IAAME,iBAAiB,gBAAGL,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAgBtC,EAAA;AAEM,IAAMG,iBAAiB,gBAAGN,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAGtC,EAAA;AAAC,IAAAI,KAAA,GA5DgBA,SA4DhBA,KAAAA,GAAA;AAAA,EAAA,OAE0CT,WAAW,CAAA;AAAA,CAAA,CAAA;AAAhD,IAAMU,qBAAqB,gBAAGR,MAAM,CAAAO,KAAA,EAAA,CAAA,CAAA;AAAAN,EAAAA,IAAA,EAAA,uBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAwB1C,EAAA;AAAC,IAAAM,MAAA,GAtFgBA,SAsFhBA,MAAAA,GAAA;AAAA,EAAA,OAEqCf,MAAM,CAAA;AAAA,CAAA,CAAA;AAAtC,IAAMgB,gBAAgB,gBAAGV,MAAM,CAAAS,MAAA,EAAA,CAAA,CAAA;AAAAR,EAAAA,IAAA,EAAA,kBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CA8CrC,EAAA;AAAC,IAAAQ,MAAA,GAtIgBA,SAsIhBA,MAAAA,GAAA;AAAA,EAAA,OAEsCD,gBAAgB,CAAA;AAAA,CAAA,CAAA;AAAjD,IAAME,iBAAiB,gBAAGZ,MAAM,CAAAW,MAAA,EAAA,CAAA,CAAA;AAAAV,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAGtC;;;;"}

package/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.styles.js

@@ -1,7 +1,8 @@
 import './PaginationSelectPerPage.styles_187mk6b.css';
 import { styled } from '@linaria/react';
-import { component, mergeConfig } from '../../../../engines/common.js';
 import { selectConfig } from '../../../Select/Select.js';
+import '@linaria/core';
+import { component, mergeConfig } from '../../../../engines/common.js';
 
 var mergedSelectConfig = /*#__PURE__*/mergeConfig(selectConfig);
 var Select = /*#__PURE__*/component(mergedSelectConfig);

package/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaginationSelectPerPage.styles.js","sources":["../../../../../src/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { selectConfig, selectTokens } from '../../../Select';\nimport { component, mergeConfig } from '../../../../engines';\nimport { tokens } from '../../Pagination.tokens';\n\nconst mergedSelectConfig = mergeConfig(selectConfig);\nconst Select = component(mergedSelectConfig);\n\nexport const SelectPerPageRoot = styled.div`\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n`;\n\nexport const SelectPerPageSelect = styled(Select)`\n    ${selectTokens.targetButtonColor}: var(${tokens.buttonColor});\n    ${selectTokens.targetButtonColorHover}: var(${tokens.buttonColorHover});\n    ${selectTokens.targetButtonColorActive}: var(${tokens.buttonColorActive});\n    ${selectTokens.targetButtonBackgroundColor}: var(${tokens.buttonBackgroundColor});\n    ${selectTokens.targetButtonBackgroundColorHover}: var(${tokens.buttonBackgroundColorHover});\n    ${selectTokens.targetButtonBackgroundColorActive}: var(${tokens.buttonBackgroundColorActive});\n    ${selectTokens.targetHeight}: var(${tokens.buttonHeight});\n    ${selectTokens.targetButtonPadding}: var(${tokens.selectTargetPadding});\n    ${selectTokens.borderRadius}: var(${tokens.buttonRadius});\n    ${selectTokens.targetButtonArrowColor}: var(${tokens.buttonArrowColor});\n    ${selectTokens.targetButtonArrowColorHover}: var(${tokens.buttonArrowColorHover});\n    ${selectTokens.targetButtonArrowColorActive}: var(${tokens.buttonArrowColorActive});\n    ${selectTokens.targetButtonArrowMargin}: var(${tokens.buttonArrowMargin});\n\n    ${selectTokens.padding}: 0.125rem;\n    ${selectTokens.focusOffset}: 0.125rem;\n    ${selectTokens.itemPadding}: var(${tokens.selectItemPadding});\n    ${selectTokens.itemBorderRadius}: calc(var(${tokens.buttonRadius}) - 0.125rem);\n    ${selectTokens.itemIconMargin}: 0 0.375rem 0 0;\n    ${selectTokens.itemIconSize}: 1.5rem;\n    ${selectTokens.itemHeight}: var(${tokens.selectItemHeight});\n`;\n\nexport const SelectPerPageTypography = styled.div`\n    font-family: var(${tokens.paginationFontFamily});\n    font-size: var(${tokens.paginationFontSize});\n    font-style: var(${tokens.paginationFontStyle});\n    font-weight: var(${tokens.paginationFontWeight});\n    letter-spacing: var(${tokens.paginationLetterSpacing});\n    line-height: var(${tokens.paginationLineHeight});\n`;\n"],"names":["mergedSelectConfig","mergeConfig","selectConfig","Select","component","SelectPerPageRoot","styled","name","class","propsAsIs","_exp","SelectPerPageSelect","SelectPerPageTypography"],"mappings":";;;;AAMA,IAAMA,kBAAkB,gBAAGC,WAAW,CAACC,YAAY,CAAC,CAAA;AACpD,IAAMC,MAAM,gBAAGC,SAAS,CAACJ,kBAAkB,CAAC,CAAA;AAErC,IAAMK,iBAAiB,gBAAGC,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAItC,EAAA;AAAC,IAAAC,IAAA,GAZgBA,SAYhBA,IAAAA,GAAA;AAAA,EAAA,OAEwCP,MAAM,CAAA;AAAA,CAAA,CAAA;AAAzC,IAAMQ,mBAAmB,gBAAGL,MAAM,CAAAI,IAAA,EAAA,CAAA,CAAA;AAAAH,EAAAA,IAAA,EAAA,qBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAsBxC,EAAA;AAEM,IAAMG,uBAAuB,gBAAGN,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,yBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAO5C;;;;"}
+{"version":3,"file":"PaginationSelectPerPage.styles.js","sources":["../../../../../src/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { selectConfig, selectTokens } from '../../../Select';\nimport { component, mergeConfig } from '../../../../engines';\nimport { tokens } from '../../Pagination.tokens';\n\nconst mergedSelectConfig = mergeConfig(selectConfig);\nconst Select = component(mergedSelectConfig);\n\nexport const SelectPerPageRoot = styled.div`\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n`;\n\nexport const SelectPerPageSelect = styled(Select)`\n    ${selectTokens.targetButtonColor}: var(${tokens.buttonColor});\n    ${selectTokens.targetButtonColorHover}: var(${tokens.buttonColorHover});\n    ${selectTokens.targetButtonColorActive}: var(${tokens.buttonColorActive});\n    ${selectTokens.targetButtonBackgroundColor}: var(${tokens.buttonBackgroundColor});\n    ${selectTokens.targetButtonBackgroundColorHover}: var(${tokens.buttonBackgroundColorHover});\n    ${selectTokens.targetButtonBackgroundColorActive}: var(${tokens.buttonBackgroundColorActive});\n    ${selectTokens.targetHeight}: var(${tokens.buttonHeight});\n    ${selectTokens.targetButtonPadding}: var(${tokens.selectTargetPadding});\n    ${selectTokens.borderRadius}: var(${tokens.buttonRadius});\n    ${selectTokens.targetButtonArrowColor}: var(${tokens.buttonArrowColor});\n    ${selectTokens.targetButtonArrowColorHover}: var(${tokens.buttonArrowColorHover});\n    ${selectTokens.targetButtonArrowColorActive}: var(${tokens.buttonArrowColorActive});\n    ${selectTokens.targetButtonArrowMargin}: var(${tokens.buttonArrowMargin});\n\n    ${selectTokens.padding}: 0.125rem;\n    ${selectTokens.focusOffset}: 0.125rem;\n    ${selectTokens.itemPadding}: var(${tokens.selectItemPadding});\n    ${selectTokens.itemBorderRadius}: calc(var(${tokens.buttonRadius}) - 0.125rem);\n    ${selectTokens.itemIconMargin}: 0 0.375rem 0 0;\n    ${selectTokens.itemIconSize}: 1.5rem;\n    ${selectTokens.itemHeight}: var(${tokens.selectItemHeight});\n`;\n\nexport const SelectPerPageTypography = styled.div`\n    font-family: var(${tokens.paginationFontFamily});\n    font-size: var(${tokens.paginationFontSize});\n    font-style: var(${tokens.paginationFontStyle});\n    font-weight: var(${tokens.paginationFontWeight});\n    letter-spacing: var(${tokens.paginationLetterSpacing});\n    line-height: var(${tokens.paginationLineHeight});\n`;\n"],"names":["mergedSelectConfig","mergeConfig","selectConfig","Select","component","SelectPerPageRoot","styled","name","class","propsAsIs","_exp","SelectPerPageSelect","SelectPerPageTypography"],"mappings":";;;;;AAMA,IAAMA,kBAAkB,gBAAGC,WAAW,CAACC,YAAY,CAAC,CAAA;AACpD,IAAMC,MAAM,gBAAGC,SAAS,CAACJ,kBAAkB,CAAC,CAAA;AAErC,IAAMK,iBAAiB,gBAAGC,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAItC,EAAA;AAAC,IAAAC,IAAA,GAZgBA,SAYhBA,IAAAA,GAAA;AAAA,EAAA,OAEwCP,MAAM,CAAA;AAAA,CAAA,CAAA;AAAzC,IAAMQ,mBAAmB,gBAAGL,MAAM,CAAAI,IAAA,EAAA,CAAA,CAAA;AAAAH,EAAAA,IAAA,EAAA,qBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAsBxC,EAAA;AAEM,IAAMG,uBAAuB,gBAAGN,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,yBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAO5C;;;;"}

package/es/components/Panel/ui/PanelHeader/PanelHeader.js

@@ -1,11 +1,12 @@
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
 import React, { forwardRef } from 'react';
 import { cx } from '../../../../utils/index.js';
+import '@linaria/react';
+import { IconClose } from '../../../_Icon/Icons/IconClose.js';
 import { classes } from '../../Panel.tokens.js';
 import { placements } from './PanelHeader.types.js';
 import { StyledHeader, ButtonWrapper, CloseIconWrapper } from './PanelHeader.styles.js';
 import { base } from './variations/_view/base.js';
-import { IconClose } from '../../../_Icon/Icons/IconClose.js';
 
 var _IconClose;
 var _excluded = ["children", "actions", "view", "className", "onClose", "hasClose", "closePlacement"];

package/es/components/Panel/ui/PanelHeader/PanelHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"PanelHeader.js","sources":["../../../../../src/components/Panel/ui/PanelHeader/PanelHeader.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { cx } from '../../../../utils';\nimport { RootProps } from '../../../../engines';\nimport { IconClose } from '../../../_Icon';\nimport { classes } from '../../Panel.tokens';\n\nimport { PanelHeaderProps, placements } from './PanelHeader.types';\nimport { StyledHeader, ButtonWrapper, CloseIconWrapper } from './PanelHeader.styles';\nimport { base as viewCSS } from './variations/_view/base';\n\nexport const panelHeaderRoot = (Root: RootProps<HTMLDivElement, PanelHeaderProps>) =>\n    forwardRef<HTMLDivElement, PanelHeaderProps>(\n        (\n            { children, actions, view, className, onClose, hasClose = 'true', closePlacement = 'right', ...rest },\n            outerRef,\n        ) => {\n            const hasHeaderClass = children ? undefined : classes.hasHeader;\n            const isRightCloseClass = closePlacement === placements.right ? classes.isRightClose : undefined;\n\n            return (\n                <Root ref={outerRef} view={view} className={cx(className, hasHeaderClass, isRightCloseClass)} {...rest}>\n                    {children && <StyledHeader>{children}</StyledHeader>}\n                    {actions && <ButtonWrapper>{actions}</ButtonWrapper>}\n                    {hasClose && (\n                        <ButtonWrapper placement={closePlacement}>\n                            <CloseIconWrapper view=\"clear\" size=\"s\" onClick={onClose}>\n                                <IconClose size=\"s\" color=\"inherit\" />\n                            </CloseIconWrapper>\n                        </ButtonWrapper>\n                    )}\n                </Root>\n            );\n        },\n    );\n\nexport const panelHeaderConfig = {\n    name: 'PanelHeader',\n    tag: 'div',\n    layout: panelHeaderRoot,\n    base: '',\n    variations: {\n        view: {\n            css: viewCSS,\n        },\n    },\n    defaults: {\n        view: 'default',\n    },\n};\n"],"names":["panelHeaderRoot","Root","forwardRef","_ref","outerRef","children","actions","view","className","onClose","_ref$hasClose","hasClose","_ref$closePlacement","closePlacement","rest","_objectWithoutProperties","_excluded","hasHeaderClass","undefined","classes","hasHeader","isRightCloseClass","placements","right","isRightClose","React","createElement","_extends","ref","cx","StyledHeader","ButtonWrapper","placement","CloseIconWrapper","size","onClick","_IconClose","IconClose","color","panelHeaderConfig","name","tag","layout","base","variations","css","viewCSS","defaults"],"mappings":";;;;;;;;;;;IAWaA,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,IAAiD,EAAA;AAAA,EAAA,oBAC7EC,UAAU,CACN,UAAAC,IAAA,EAEIC,QAAQ,EACP;AAAA,IAAA,IAFCC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;MAAEC,OAAO,GAAAH,IAAA,CAAPG,OAAO;MAAEC,IAAI,GAAAJ,IAAA,CAAJI,IAAI;MAAEC,SAAS,GAAAL,IAAA,CAATK,SAAS;MAAEC,OAAO,GAAAN,IAAA,CAAPM,OAAO;MAAAC,aAAA,GAAAP,IAAA,CAAEQ,QAAQ;AAARA,MAAAA,QAAQ,GAAAD,aAAA,KAAG,KAAA,CAAA,GAAA,MAAM,GAAAA,aAAA;MAAAE,mBAAA,GAAAT,IAAA,CAAEU,cAAc;AAAdA,MAAAA,cAAc,GAAAD,mBAAA,KAAG,KAAA,CAAA,GAAA,OAAO,GAAAA,mBAAA;AAAKE,MAAAA,IAAI,GAAAC,wBAAA,CAAAZ,IAAA,EAAAa,SAAA,CAAA,CAAA;IAGnG,IAAMC,cAAc,GAAGZ,QAAQ,GAAGa,SAAS,GAAGC,OAAO,CAACC,SAAS,CAAA;AAC/D,IAAA,IAAMC,iBAAiB,GAAGR,cAAc,KAAKS,UAAU,CAACC,KAAK,GAAGJ,OAAO,CAACK,YAAY,GAAGN,SAAS,CAAA;AAEhG,IAAA,oBACIO,KAAA,CAAAC,aAAA,CAACzB,IAAI,EAAA0B,QAAA,CAAA;AAACC,MAAAA,GAAG,EAAExB,QAAS;AAACG,MAAAA,IAAI,EAAEA,IAAK;AAACC,MAAAA,SAAS,EAAEqB,EAAE,CAACrB,SAAS,EAAES,cAAc,EAAEI,iBAAiB,CAAA;AAAE,KAAA,EAAKP,IAAI,CAAA,EACjGT,QAAQ,iBAAIoB,KAAA,CAAAC,aAAA,CAACI,YAAY,EAAA,IAAA,EAAEzB,QAAuB,CAAC,EACnDC,OAAO,iBAAImB,KAAA,CAAAC,aAAA,CAACK,aAAa,EAAA,IAAA,EAAEzB,OAAuB,CAAC,EACnDK,QAAQ,iBACLc,KAAA,CAAAC,aAAA,CAACK,aAAa,EAAA;AAACC,MAAAA,SAAS,EAAEnB,cAAAA;AAAe,KAAA,eACrCY,KAAA,CAAAC,aAAA,CAACO,gBAAgB,EAAA;AAAC1B,MAAAA,IAAI,EAAC,OAAO;AAAC2B,MAAAA,IAAI,EAAC,GAAG;AAACC,MAAAA,OAAO,EAAE1B,OAAAA;KAAQ2B,EAAAA,UAAA,KAAAA,UAAA,gBACrDX,KAAA,CAAAC,aAAA,CAACW,SAAS,EAAA;AAACH,MAAAA,IAAI,EAAC,GAAG;AAACI,MAAAA,KAAK,EAAC,SAAA;AAAS,KAAE,CAAC,CACxB,CACP,CAEjB,CAAC,CAAA;AAEf,GACJ,CAAC,CAAA;AAAA,EAAA;AAEE,IAAMC,iBAAiB,GAAG;AAC7BC,EAAAA,IAAI,EAAE,aAAa;AACnBC,EAAAA,GAAG,EAAE,KAAK;AACVC,EAAAA,MAAM,EAAE1C,eAAe;AACvB2C,EAAAA,IAAI,EAAE,EAAE;AACRC,EAAAA,UAAU,EAAE;AACRrC,IAAAA,IAAI,EAAE;AACFsC,MAAAA,GAAG,EAAEC,IAAAA;AACT,KAAA;GACH;AACDC,EAAAA,QAAQ,EAAE;AACNxC,IAAAA,IAAI,EAAE,SAAA;AACV,GAAA;AACJ;;;;"}
+{"version":3,"file":"PanelHeader.js","sources":["../../../../../src/components/Panel/ui/PanelHeader/PanelHeader.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { cx } from '../../../../utils';\nimport { RootProps } from '../../../../engines';\nimport { IconClose } from '../../../_Icon';\nimport { classes } from '../../Panel.tokens';\n\nimport { PanelHeaderProps, placements } from './PanelHeader.types';\nimport { StyledHeader, ButtonWrapper, CloseIconWrapper } from './PanelHeader.styles';\nimport { base as viewCSS } from './variations/_view/base';\n\nexport const panelHeaderRoot = (Root: RootProps<HTMLDivElement, PanelHeaderProps>) =>\n    forwardRef<HTMLDivElement, PanelHeaderProps>(\n        (\n            { children, actions, view, className, onClose, hasClose = 'true', closePlacement = 'right', ...rest },\n            outerRef,\n        ) => {\n            const hasHeaderClass = children ? undefined : classes.hasHeader;\n            const isRightCloseClass = closePlacement === placements.right ? classes.isRightClose : undefined;\n\n            return (\n                <Root ref={outerRef} view={view} className={cx(className, hasHeaderClass, isRightCloseClass)} {...rest}>\n                    {children && <StyledHeader>{children}</StyledHeader>}\n                    {actions && <ButtonWrapper>{actions}</ButtonWrapper>}\n                    {hasClose && (\n                        <ButtonWrapper placement={closePlacement}>\n                            <CloseIconWrapper view=\"clear\" size=\"s\" onClick={onClose}>\n                                <IconClose size=\"s\" color=\"inherit\" />\n                            </CloseIconWrapper>\n                        </ButtonWrapper>\n                    )}\n                </Root>\n            );\n        },\n    );\n\nexport const panelHeaderConfig = {\n    name: 'PanelHeader',\n    tag: 'div',\n    layout: panelHeaderRoot,\n    base: '',\n    variations: {\n        view: {\n            css: viewCSS,\n        },\n    },\n    defaults: {\n        view: 'default',\n    },\n};\n"],"names":["panelHeaderRoot","Root","forwardRef","_ref","outerRef","children","actions","view","className","onClose","_ref$hasClose","hasClose","_ref$closePlacement","closePlacement","rest","_objectWithoutProperties","_excluded","hasHeaderClass","undefined","classes","hasHeader","isRightCloseClass","placements","right","isRightClose","React","createElement","_extends","ref","cx","StyledHeader","ButtonWrapper","placement","CloseIconWrapper","size","onClick","_IconClose","IconClose","color","panelHeaderConfig","name","tag","layout","base","variations","css","viewCSS","defaults"],"mappings":";;;;;;;;;;;;IAWaA,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,IAAiD,EAAA;AAAA,EAAA,oBAC7EC,UAAU,CACN,UAAAC,IAAA,EAEIC,QAAQ,EACP;AAAA,IAAA,IAFCC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;MAAEC,OAAO,GAAAH,IAAA,CAAPG,OAAO;MAAEC,IAAI,GAAAJ,IAAA,CAAJI,IAAI;MAAEC,SAAS,GAAAL,IAAA,CAATK,SAAS;MAAEC,OAAO,GAAAN,IAAA,CAAPM,OAAO;MAAAC,aAAA,GAAAP,IAAA,CAAEQ,QAAQ;AAARA,MAAAA,QAAQ,GAAAD,aAAA,KAAG,KAAA,CAAA,GAAA,MAAM,GAAAA,aAAA;MAAAE,mBAAA,GAAAT,IAAA,CAAEU,cAAc;AAAdA,MAAAA,cAAc,GAAAD,mBAAA,KAAG,KAAA,CAAA,GAAA,OAAO,GAAAA,mBAAA;AAAKE,MAAAA,IAAI,GAAAC,wBAAA,CAAAZ,IAAA,EAAAa,SAAA,CAAA,CAAA;IAGnG,IAAMC,cAAc,GAAGZ,QAAQ,GAAGa,SAAS,GAAGC,OAAO,CAACC,SAAS,CAAA;AAC/D,IAAA,IAAMC,iBAAiB,GAAGR,cAAc,KAAKS,UAAU,CAACC,KAAK,GAAGJ,OAAO,CAACK,YAAY,GAAGN,SAAS,CAAA;AAEhG,IAAA,oBACIO,KAAA,CAAAC,aAAA,CAACzB,IAAI,EAAA0B,QAAA,CAAA;AAACC,MAAAA,GAAG,EAAExB,QAAS;AAACG,MAAAA,IAAI,EAAEA,IAAK;AAACC,MAAAA,SAAS,EAAEqB,EAAE,CAACrB,SAAS,EAAES,cAAc,EAAEI,iBAAiB,CAAA;AAAE,KAAA,EAAKP,IAAI,CAAA,EACjGT,QAAQ,iBAAIoB,KAAA,CAAAC,aAAA,CAACI,YAAY,EAAA,IAAA,EAAEzB,QAAuB,CAAC,EACnDC,OAAO,iBAAImB,KAAA,CAAAC,aAAA,CAACK,aAAa,EAAA,IAAA,EAAEzB,OAAuB,CAAC,EACnDK,QAAQ,iBACLc,KAAA,CAAAC,aAAA,CAACK,aAAa,EAAA;AAACC,MAAAA,SAAS,EAAEnB,cAAAA;AAAe,KAAA,eACrCY,KAAA,CAAAC,aAAA,CAACO,gBAAgB,EAAA;AAAC1B,MAAAA,IAAI,EAAC,OAAO;AAAC2B,MAAAA,IAAI,EAAC,GAAG;AAACC,MAAAA,OAAO,EAAE1B,OAAAA;KAAQ2B,EAAAA,UAAA,KAAAA,UAAA,gBACrDX,KAAA,CAAAC,aAAA,CAACW,SAAS,EAAA;AAACH,MAAAA,IAAI,EAAC,GAAG;AAACI,MAAAA,KAAK,EAAC,SAAA;AAAS,KAAE,CAAC,CACxB,CACP,CAEjB,CAAC,CAAA;AAEf,GACJ,CAAC,CAAA;AAAA,EAAA;AAEE,IAAMC,iBAAiB,GAAG;AAC7BC,EAAAA,IAAI,EAAE,aAAa;AACnBC,EAAAA,GAAG,EAAE,KAAK;AACVC,EAAAA,MAAM,EAAE1C,eAAe;AACvB2C,EAAAA,IAAI,EAAE,EAAE;AACRC,EAAAA,UAAU,EAAE;AACRrC,IAAAA,IAAI,EAAE;AACFsC,MAAAA,GAAG,EAAEC,IAAAA;AACT,KAAA;GACH;AACDC,EAAAA,QAAQ,EAAE;AACNxC,IAAAA,IAAI,EAAE,SAAA;AACV,GAAA;AACJ;;;;"}

package/es/components/Panel/ui/PanelHeader/PanelHeader.styles.js

@@ -1,8 +1,9 @@
 import './PanelHeader.styles_1cid6t7.css';
 import { styled } from '@linaria/react';
-import { placements } from './PanelHeader.types.js';
+import '@linaria/core';
 import { component, mergeConfig } from '../../../../engines/common.js';
 import { buttonConfig } from '../../../Button/Button.js';
+import { placements } from './PanelHeader.types.js';
 
 var mergedButtonConfig = /*#__PURE__*/mergeConfig(buttonConfig);
 var Button = /*#__PURE__*/component(mergedButtonConfig);

package/es/components/Panel/ui/PanelHeader/PanelHeader.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"PanelHeader.styles.js","sources":["../../../../../src/components/Panel/ui/PanelHeader/PanelHeader.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { mergeConfig, component } from '../../../../engines';\nimport { buttonConfig } from '../../../Button';\nimport { tokens } from '../../Panel.tokens';\n\nimport { ClosePlacementType, placements } from './PanelHeader.types';\n\nconst mergedButtonConfig = mergeConfig(buttonConfig);\nconst Button = component(mergedButtonConfig);\n\nexport const ButtonWrapper = styled.div<{ placement?: ClosePlacementType }>`\n    background: var(${tokens.background});\n\n    order: ${({ placement }) => (placement === placements.left ? -1 : 0)};\n    padding-left: ${({ placement }) => (!placement || placement === placements.right ? '0.5rem' : '')};\n    padding-right: ${({ placement }) => (placement === placements.left ? '0.5rem' : '')};\n`;\n\nexport const StyledHeader = styled.div`\n    height: fit-content;\n    flex-grow: 1;\n`;\n\nexport const CloseIconWrapper = styled(Button)`\n    position: relative;\n    width: 1.5rem;\n    min-height: 1.5rem;\n`;\n"],"names":["mergedButtonConfig","mergeConfig","buttonConfig","Button","component","_exp2","_ref","placement","placements","left","_exp3","_ref2","right","_exp4","_ref3","ButtonWrapper","styled","name","class","propsAsIs","vars","StyledHeader","_exp5","CloseIconWrapper"],"mappings":";;;;;AAQA,IAAMA,kBAAkB,gBAAGC,WAAW,CAACC,YAAY,CAAC,CAAA;AACpD,IAAMC,MAAM,gBAAGC,SAAS,CAACJ,kBAAkB,CAAC,CAAA;AAAC,IAAAK,KAAA,GAR3BA,SAQ2BA,KAAAA,GAAA;AAAA,EAAA,OAKhC,UAAAC,IAAA,EAAA;AAAA,IAAA,IAAGC,SAAAA,GAAAA,IAAAA,CAAAA,SAAAA,CAAAA;IAAAA,OAAiBA,SAAS,KAAKC,UAAU,CAACC,IAAI,GAAG,CAAC,CAAC,GAAG,CAAE,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAAA,IAAAC,KAAA,GAbtDA,SAasDA,KAAAA,GAAA;AAAA,EAAA,OACpD,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGJ,SAAAA,GAAAA,KAAAA,CAAAA,SAAAA,CAAAA;IAAAA,OAAiB,CAACA,SAAS,IAAIA,SAAS,KAAKC,UAAU,CAACI,KAAK,GAAG,QAAQ,GAAG,EAAG,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAAA,IAAAC,KAAA,GAdnFA,SAcmFA,KAAAA,GAAA;AAAA,EAAA,OAChF,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGP,SAAAA,GAAAA,KAAAA,CAAAA,SAAAA,CAAAA;IAAAA,OAAiBA,SAAS,KAAKC,UAAU,CAACC,IAAI,GAAG,QAAQ,GAAG,EAAG,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AALhF,IAAMM,aAAa,gBAAGC,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,eAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAAC,EAAAA,IAAA,EAAA;AAAA,IAAA,WAAA,EAAA,cAGtBf,KAA2D,EAAA,CAAA;AAAA,IAAA,WAAA,EAAA,cACpDK,KAAiF,EAAA,CAAA;AAAA,IAAA,WAAA,EAAA,cAChFG,KAAkE,EAAA,CAAA;AAAA,GAAA;AAAA,CACtF,EAAA;AAEM,IAAMQ,YAAY,gBAAGL,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,cAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAGjC,EAAA;AAAC,IAAAG,KAAA,GArBgBA,SAqBhBA,KAAAA,GAAA;AAAA,EAAA,OAEqCnB,MAAM,CAAA;AAAA,CAAA,CAAA;AAAtC,IAAMoB,gBAAgB,gBAAGP,MAAM,CAAAM,KAAA,EAAA,CAAA,CAAA;AAAAL,EAAAA,IAAA,EAAA,kBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAIrC;;;;"}
+{"version":3,"file":"PanelHeader.styles.js","sources":["../../../../../src/components/Panel/ui/PanelHeader/PanelHeader.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { mergeConfig, component } from '../../../../engines';\nimport { buttonConfig } from '../../../Button';\nimport { tokens } from '../../Panel.tokens';\n\nimport { ClosePlacementType, placements } from './PanelHeader.types';\n\nconst mergedButtonConfig = mergeConfig(buttonConfig);\nconst Button = component(mergedButtonConfig);\n\nexport const ButtonWrapper = styled.div<{ placement?: ClosePlacementType }>`\n    background: var(${tokens.background});\n\n    order: ${({ placement }) => (placement === placements.left ? -1 : 0)};\n    padding-left: ${({ placement }) => (!placement || placement === placements.right ? '0.5rem' : '')};\n    padding-right: ${({ placement }) => (placement === placements.left ? '0.5rem' : '')};\n`;\n\nexport const StyledHeader = styled.div`\n    height: fit-content;\n    flex-grow: 1;\n`;\n\nexport const CloseIconWrapper = styled(Button)`\n    position: relative;\n    width: 1.5rem;\n    min-height: 1.5rem;\n`;\n"],"names":["mergedButtonConfig","mergeConfig","buttonConfig","Button","component","_exp2","_ref","placement","placements","left","_exp3","_ref2","right","_exp4","_ref3","ButtonWrapper","styled","name","class","propsAsIs","vars","StyledHeader","_exp5","CloseIconWrapper"],"mappings":";;;;;;AAQA,IAAMA,kBAAkB,gBAAGC,WAAW,CAACC,YAAY,CAAC,CAAA;AACpD,IAAMC,MAAM,gBAAGC,SAAS,CAACJ,kBAAkB,CAAC,CAAA;AAAC,IAAAK,KAAA,GAR3BA,SAQ2BA,KAAAA,GAAA;AAAA,EAAA,OAKhC,UAAAC,IAAA,EAAA;AAAA,IAAA,IAAGC,SAAAA,GAAAA,IAAAA,CAAAA,SAAAA,CAAAA;IAAAA,OAAiBA,SAAS,KAAKC,UAAU,CAACC,IAAI,GAAG,CAAC,CAAC,GAAG,CAAE,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAAA,IAAAC,KAAA,GAbtDA,SAasDA,KAAAA,GAAA;AAAA,EAAA,OACpD,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGJ,SAAAA,GAAAA,KAAAA,CAAAA,SAAAA,CAAAA;IAAAA,OAAiB,CAACA,SAAS,IAAIA,SAAS,KAAKC,UAAU,CAACI,KAAK,GAAG,QAAQ,GAAG,EAAG,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAAA,IAAAC,KAAA,GAdnFA,SAcmFA,KAAAA,GAAA;AAAA,EAAA,OAChF,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGP,SAAAA,GAAAA,KAAAA,CAAAA,SAAAA,CAAAA;IAAAA,OAAiBA,SAAS,KAAKC,UAAU,CAACC,IAAI,GAAG,QAAQ,GAAG,EAAG,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AALhF,IAAMM,aAAa,gBAAGC,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,eAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAAC,EAAAA,IAAA,EAAA;AAAA,IAAA,WAAA,EAAA,cAGtBf,KAA2D,EAAA,CAAA;AAAA,IAAA,WAAA,EAAA,cACpDK,KAAiF,EAAA,CAAA;AAAA,IAAA,WAAA,EAAA,cAChFG,KAAkE,EAAA,CAAA;AAAA,GAAA;AAAA,CACtF,EAAA;AAEM,IAAMQ,YAAY,gBAAGL,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,cAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAGjC,EAAA;AAAC,IAAAG,KAAA,GArBgBA,SAqBhBA,KAAAA,GAAA;AAAA,EAAA,OAEqCnB,MAAM,CAAA;AAAA,CAAA,CAAA;AAAtC,IAAMoB,gBAAgB,gBAAGP,MAAM,CAAAM,KAAA,EAAA,CAAA,CAAA;AAAAL,EAAAA,IAAA,EAAA,kBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAIrC;;;;"}

package/es/components/Popover/Popover.js

@@ -3,10 +3,10 @@ import React, { forwardRef, useRef, useState, useCallback, useEffect } from 'rea
 import { usePopper } from 'react-popper';
 import { useForkRef, useFocusTrap } from '@salutejs/plasma-core';
 import { cx } from '../../utils/index.js';
+import { Portal } from '../Portal/Portal.js';
 import { base } from './variations/_view/base.js';
 import { StyledWrapper, StyledRoot, StyledPopover, StyledArrow } from './Popover.styles.js';
 import { classes } from './Popover.tokens.js';
-import { Portal } from '../Portal/Portal.js';
 
 var _excluded = ["target", "children", "isOpen", "opened", "trigger", "hasArrow", "frame", "className", "placement", "offset", "zIndex", "isFocusTrapped", "closeOnEsc", "preventOverflow", "usePortal", "view", "onToggle", "closeOnOverlayClick"];
 var ESCAPE_KEYCODE = 27;

package/es/components/Popup/Popup.js

@@ -2,11 +2,11 @@ import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _
 import React, { forwardRef, useRef, useState, useEffect } from 'react';
 import { safeUseId, useForkRef } from '@salutejs/plasma-core';
 import { cx } from '../../utils/index.js';
+import { Portal } from '../Portal/Portal.js';
 import { POPUP_PORTAL_ID } from './PopupContext.js';
 import { PopupRoot } from './PopupRoot.js';
-import { classes } from './Popup.tokens.js';
 import { usePopup } from './hooks/usePopup.js';
-import { Portal } from '../Portal/Portal.js';
+import { classes } from './Popup.tokens.js';
 
 var _excluded = ["id", "isOpen", "opened", "placement", "offset", "frame", "children", "overlay", "role", "zIndex", "popupInfo", "withAnimation", "className"];
 var handlePosition = function handlePosition(placement, offset) {

package/es/components/Range/Range.styles.js

@@ -1,5 +1,6 @@
 import './Range.styles_dmydia.css';
 import { styled } from '@linaria/react';
+import '@linaria/core';
 import { component, mergeConfig } from '../../engines/common.js';
 import { textFieldConfig } from '../TextField/TextField.js';
 

package/es/components/Range/Range.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Range.styles.js","sources":["../../../src/components/Range/Range.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\nimport { css } from '@linaria/core';\n\nimport { component, mergeConfig } from '../../engines';\nimport { textFieldConfig, textFieldTokens } from '../TextField';\n\nimport { classes, tokens } from './Range.tokens';\n\nconst mergedConfig = mergeConfig(textFieldConfig);\nconst TextField = component(mergedConfig);\n\n// NOTE: переопределение токенов TextField\nexport const StyledInput = styled(TextField)`\n    width: 100%;\n    \n    ${textFieldTokens.color}: var(${tokens.textFieldColor});\n    ${textFieldTokens.placeholderColor}: var(${tokens.textFieldPlaceholderColor});\n    ${textFieldTokens.caretColor}: var(${tokens.textFieldCaretColor});\n    ${textFieldTokens.focusColor}: var(${tokens.textFieldFocusColor});\n\n    ${textFieldTokens.backgroundColor}: var(${tokens.textFieldBackgroundColor});\n    ${textFieldTokens.backgroundColorHover}: var(${tokens.textFieldBackgroundColorHover});\n    ${textFieldTokens.backgroundColorFocus}: var(${tokens.textFieldBackgroundColorFocus});\n\n    ${textFieldTokens.borderColor}: var(${tokens.textFieldBorderColor});\n    ${textFieldTokens.borderColorHover}: var(${tokens.textFieldBorderColorHover});\n    ${textFieldTokens.borderColorFocus}: var(${tokens.textFieldBorderColorFocus});\n\n    ${textFieldTokens.colorReadOnly}: var(${tokens.textFieldColorReadOnly});\n    ${textFieldTokens.backgroundColorReadOnly}: var(${tokens.textFieldBackgroundColorReadOnly});\n    ${textFieldTokens.borderColorReadOnly}: var(${tokens.textFieldBorderColorReadOnly});\n    ${textFieldTokens.placeholderColorReadOnly}: var(${tokens.textFieldPlaceholderColorReadOnly});\n\n    ${textFieldTokens.height}: var(${tokens.textFieldHeight});\n    ${textFieldTokens.borderWidth}: var(${tokens.textFieldBorderWidth});\n    ${textFieldTokens.borderRadius}: var(${tokens.textFieldBorderRadius});\n\n    ${textFieldTokens.padding}: var(${tokens.textFieldPadding});\n\n    ${textFieldTokens.leftContentMargin}: var(${tokens.textFieldLeftContentMargin});\n    ${textFieldTokens.rightContentMargin}: var(${tokens.textFieldRightContentMargin});\n\n    ${textFieldTokens.fontFamily}: var(${tokens.textFieldFontFamily});\n    ${textFieldTokens.fontSize}: var(${tokens.textFieldFontSize});\n    ${textFieldTokens.fontStyle}: var(${tokens.textFieldFontStyle});\n    ${textFieldTokens.fontWeight}: var(${tokens.textFieldFontWeight});\n    ${textFieldTokens.letterSpacing}: var(${tokens.textFieldLetterSpacing});\n    ${textFieldTokens.lineHeight}: var(${tokens.textFieldLineHeight});\n\n    ${textFieldTokens.disabledOpacity}: var(${tokens.disabledOpacity});\n    \n    ${textFieldTokens.textBeforeColor}: var(${tokens.textFieldTextBeforeColor});\n    ${textFieldTokens.textAfterColor}: var(${tokens.textFieldTextAfterColor});\n    ${textFieldTokens.textBeforeMargin}: var(${tokens.textFieldTextBeforeMargin});\n    ${textFieldTokens.textAfterMargin}: var(${tokens.textFieldTextAfterMargin});\n\n    &.${classes.rangeValueError} {\n        ${textFieldTokens.backgroundColor}: var(${tokens.textFieldBackgroundErrorColor});\n        ${textFieldTokens.backgroundColorHover}: var(${tokens.textFieldBackgroundErrorColorHover});\n        ${textFieldTokens.backgroundColorFocus}: var(${tokens.textFieldBackgroundErrorColorFocus});\n        \n        ${textFieldTokens.borderColor}: var(${tokens.textFieldBorderColorError});\n        ${textFieldTokens.borderColorHover}: var(${tokens.textFieldBorderColorErrorHover});\n        ${textFieldTokens.borderColorFocus}: var(${tokens.textFieldBorderColorErrorFocus});\n    }\n\n    &.${classes.rangeValueSuccess} {\n        ${textFieldTokens.backgroundColor}: var(${tokens.textFieldBackgroundSuccessColor});\n        ${textFieldTokens.backgroundColorHover}: var(${tokens.textFieldBackgroundSuccessColorHover});\n        ${textFieldTokens.backgroundColorFocus}: var(${tokens.textFieldBackgroundSuccessColorFocus});\n        \n        ${textFieldTokens.borderColor}: var(${tokens.textFieldBorderColorSuccess});\n        ${textFieldTokens.borderColorHover}: var(${tokens.textFieldBorderColorSuccessHover});\n        ${textFieldTokens.borderColorFocus}: var(${tokens.textFieldBorderColorSuccessFocus});\n    }\n`;\n\nexport const base = css`\n    width: fit-content;\n`;\n\nexport const StyledLabel = styled.label``;\n\nexport const LeftHelper = styled.div``;\n\nexport const ContentWrapper = styled.div`\n    display: flex;\n    align-items: center;\n`;\n\nexport const StyledDivider = styled.div``;\n\nexport const StyledContentLeft = styled.div`\n    line-height: 0;\n`;\n\nexport const StyledContentRight = styled.div``;\n"],"names":["mergedConfig","mergeConfig","textFieldConfig","TextField","component","_exp","StyledInput","styled","name","class","propsAsIs","base","StyledLabel","LeftHelper","ContentWrapper","StyledDivider","StyledContentLeft","StyledContentRight"],"mappings":";;;;AAQA,IAAMA,YAAY,gBAAGC,WAAW,CAACC,eAAe,CAAC,CAAA;AACjD,IAAMC,SAAS,gBAAGC,SAAS,CAACJ,YAAY,CAAC,CAAA;;AAEzC;AAAA,IAAAK,IAAA,GAVkBA,SAUlBA,IAAAA,GAAA;AAAA,EAAA,OACkCF,SAAS,CAAA;AAAA,CAAA,CAAA;AAApC,IAAMG,WAAW,gBAAGC,MAAM,CAAAF,IAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CA+DhC,EAAA;AAEM,IAAMC,IAAI,GAEhB,WAAA;AAEM,IAAMC,WAAW,gBAAGL,MAAM,CAAA,OAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAAQ,EAAA;AAElC,IAAMG,UAAU,gBAAGN,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAAM,EAAA;AAE/B,IAAMI,cAAc,gBAAGP,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,gBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAGnC,EAAA;AAEM,IAAMK,aAAa,gBAAGR,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,eAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAAM,EAAA;AAElC,IAAMM,iBAAiB,gBAAGT,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAEtC,EAAA;AAEM,IAAMO,kBAAkB,gBAAGV,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,oBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAAM;;;;"}
+{"version":3,"file":"Range.styles.js","sources":["../../../src/components/Range/Range.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\nimport { css } from '@linaria/core';\n\nimport { component, mergeConfig } from '../../engines';\nimport { textFieldConfig, textFieldTokens } from '../TextField';\n\nimport { classes, tokens } from './Range.tokens';\n\nconst mergedConfig = mergeConfig(textFieldConfig);\nconst TextField = component(mergedConfig);\n\n// NOTE: переопределение токенов TextField\nexport const StyledInput = styled(TextField)`\n    width: 100%;\n    \n    ${textFieldTokens.color}: var(${tokens.textFieldColor});\n    ${textFieldTokens.placeholderColor}: var(${tokens.textFieldPlaceholderColor});\n    ${textFieldTokens.caretColor}: var(${tokens.textFieldCaretColor});\n    ${textFieldTokens.focusColor}: var(${tokens.textFieldFocusColor});\n\n    ${textFieldTokens.backgroundColor}: var(${tokens.textFieldBackgroundColor});\n    ${textFieldTokens.backgroundColorHover}: var(${tokens.textFieldBackgroundColorHover});\n    ${textFieldTokens.backgroundColorFocus}: var(${tokens.textFieldBackgroundColorFocus});\n\n    ${textFieldTokens.borderColor}: var(${tokens.textFieldBorderColor});\n    ${textFieldTokens.borderColorHover}: var(${tokens.textFieldBorderColorHover});\n    ${textFieldTokens.borderColorFocus}: var(${tokens.textFieldBorderColorFocus});\n\n    ${textFieldTokens.colorReadOnly}: var(${tokens.textFieldColorReadOnly});\n    ${textFieldTokens.backgroundColorReadOnly}: var(${tokens.textFieldBackgroundColorReadOnly});\n    ${textFieldTokens.borderColorReadOnly}: var(${tokens.textFieldBorderColorReadOnly});\n    ${textFieldTokens.placeholderColorReadOnly}: var(${tokens.textFieldPlaceholderColorReadOnly});\n\n    ${textFieldTokens.height}: var(${tokens.textFieldHeight});\n    ${textFieldTokens.borderWidth}: var(${tokens.textFieldBorderWidth});\n    ${textFieldTokens.borderRadius}: var(${tokens.textFieldBorderRadius});\n\n    ${textFieldTokens.padding}: var(${tokens.textFieldPadding});\n\n    ${textFieldTokens.leftContentMargin}: var(${tokens.textFieldLeftContentMargin});\n    ${textFieldTokens.rightContentMargin}: var(${tokens.textFieldRightContentMargin});\n\n    ${textFieldTokens.fontFamily}: var(${tokens.textFieldFontFamily});\n    ${textFieldTokens.fontSize}: var(${tokens.textFieldFontSize});\n    ${textFieldTokens.fontStyle}: var(${tokens.textFieldFontStyle});\n    ${textFieldTokens.fontWeight}: var(${tokens.textFieldFontWeight});\n    ${textFieldTokens.letterSpacing}: var(${tokens.textFieldLetterSpacing});\n    ${textFieldTokens.lineHeight}: var(${tokens.textFieldLineHeight});\n\n    ${textFieldTokens.disabledOpacity}: var(${tokens.disabledOpacity});\n    \n    ${textFieldTokens.textBeforeColor}: var(${tokens.textFieldTextBeforeColor});\n    ${textFieldTokens.textAfterColor}: var(${tokens.textFieldTextAfterColor});\n    ${textFieldTokens.textBeforeMargin}: var(${tokens.textFieldTextBeforeMargin});\n    ${textFieldTokens.textAfterMargin}: var(${tokens.textFieldTextAfterMargin});\n\n    &.${classes.rangeValueError} {\n        ${textFieldTokens.backgroundColor}: var(${tokens.textFieldBackgroundErrorColor});\n        ${textFieldTokens.backgroundColorHover}: var(${tokens.textFieldBackgroundErrorColorHover});\n        ${textFieldTokens.backgroundColorFocus}: var(${tokens.textFieldBackgroundErrorColorFocus});\n        \n        ${textFieldTokens.borderColor}: var(${tokens.textFieldBorderColorError});\n        ${textFieldTokens.borderColorHover}: var(${tokens.textFieldBorderColorErrorHover});\n        ${textFieldTokens.borderColorFocus}: var(${tokens.textFieldBorderColorErrorFocus});\n    }\n\n    &.${classes.rangeValueSuccess} {\n        ${textFieldTokens.backgroundColor}: var(${tokens.textFieldBackgroundSuccessColor});\n        ${textFieldTokens.backgroundColorHover}: var(${tokens.textFieldBackgroundSuccessColorHover});\n        ${textFieldTokens.backgroundColorFocus}: var(${tokens.textFieldBackgroundSuccessColorFocus});\n        \n        ${textFieldTokens.borderColor}: var(${tokens.textFieldBorderColorSuccess});\n        ${textFieldTokens.borderColorHover}: var(${tokens.textFieldBorderColorSuccessHover});\n        ${textFieldTokens.borderColorFocus}: var(${tokens.textFieldBorderColorSuccessFocus});\n    }\n`;\n\nexport const base = css`\n    width: fit-content;\n`;\n\nexport const StyledLabel = styled.label``;\n\nexport const LeftHelper = styled.div``;\n\nexport const ContentWrapper = styled.div`\n    display: flex;\n    align-items: center;\n`;\n\nexport const StyledDivider = styled.div``;\n\nexport const StyledContentLeft = styled.div`\n    line-height: 0;\n`;\n\nexport const StyledContentRight = styled.div``;\n"],"names":["mergedConfig","mergeConfig","textFieldConfig","TextField","component","_exp","StyledInput","styled","name","class","propsAsIs","base","StyledLabel","LeftHelper","ContentWrapper","StyledDivider","StyledContentLeft","StyledContentRight"],"mappings":";;;;;AAQA,IAAMA,YAAY,gBAAGC,WAAW,CAACC,eAAe,CAAC,CAAA;AACjD,IAAMC,SAAS,gBAAGC,SAAS,CAACJ,YAAY,CAAC,CAAA;;AAEzC;AAAA,IAAAK,IAAA,GAVkBA,SAUlBA,IAAAA,GAAA;AAAA,EAAA,OACkCF,SAAS,CAAA;AAAA,CAAA,CAAA;AAApC,IAAMG,WAAW,gBAAGC,MAAM,CAAAF,IAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CA+DhC,EAAA;AAEM,IAAMC,IAAI,GAEhB,WAAA;AAEM,IAAMC,WAAW,gBAAGL,MAAM,CAAA,OAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAAQ,EAAA;AAElC,IAAMG,UAAU,gBAAGN,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAAM,EAAA;AAE/B,IAAMI,cAAc,gBAAGP,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,gBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAGnC,EAAA;AAEM,IAAMK,aAAa,gBAAGR,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,eAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAAM,EAAA;AAElC,IAAMM,iBAAiB,gBAAGT,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAEtC,EAAA;AAEM,IAAMO,kBAAkB,gBAAGV,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,oBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAAM;;;;"}

package/es/components/Segment/ui/SegmentGroup/SegmentGroup.js

@@ -1,6 +1,9 @@
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
 import React, { forwardRef, useState, Children, useCallback, useMemo, useEffect } from 'react';
 import { safeUseId, useCarousel } from '@salutejs/plasma-core';
+import { IconDisclosureLeft } from '../../../_Icon/Icons/IconDisclosureLeft.js';
+import { IconDisclosureRight } from '../../../_Icon/Icons/IconDisclosureRight.js';
+import '@linaria/react';
 import { tokens, classes } from '../../tokens.js';
 import { cx } from '../../../../utils/index.js';
 import { useSegmentInner } from '../../SegmentProvider/SegmentProvider.js';
@@ -11,8 +14,6 @@ import { base as base$4 } from './variations/_pilled/base.js';
 import { base as base$6 } from './variations/_filledBackgound/base.js';
 import { base as base$5 } from './variations/_stretch/base.js';
 import { StyledArrow, StyledContentWrapper, StyledContent, base } from './SegmentGroup.styles.js';
-import { IconDisclosureLeft } from '../../../_Icon/Icons/IconDisclosureLeft.js';
-import { IconDisclosureRight } from '../../../_Icon/Icons/IconDisclosureRight.js';
 
 var _excluded = ["id", "selectionMode", "pilled", "stretch", "filledBackground", "disabled", "size", "view", "children"];
 var segmentGroupRoot = function segmentGroupRoot(Root) {