@skbkontur/react-ui 4.15.0 → 4.15.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +15 -0
- package/cjs/components/Button/getInnerLinkTheme.js +0 -3
- package/cjs/components/Button/getInnerLinkTheme.js.map +1 -1
- package/cjs/components/Link/Link.js +4 -2
- package/cjs/components/Link/Link.js.map +1 -1
- package/cjs/components/Link/Link.mixins.d.ts +1 -2
- package/cjs/components/Link/Link.mixins.js +4 -16
- package/cjs/components/Link/Link.mixins.js.map +1 -1
- package/cjs/components/Link/Link.styles.d.ts +2 -0
- package/cjs/components/Link/Link.styles.js +56 -38
- package/cjs/components/Link/Link.styles.js.map +1 -1
- package/cjs/components/Modal/ModalFooter.js +1 -1
- package/cjs/components/Modal/ModalFooter.js.map +1 -1
- package/cjs/components/Modal/ModalHeader.js +1 -1
- package/cjs/components/Modal/ModalHeader.js.map +1 -1
- package/cjs/internal/CustomComboBox/CustomComboBox.js +14 -8
- package/cjs/internal/CustomComboBox/CustomComboBox.js.map +1 -1
- package/cjs/internal/ThemeShowcase/VariablesCollector.d.ts +1 -1
- package/cjs/internal/themes/DefaultTheme.d.ts +0 -15
- package/cjs/internal/themes/DefaultTheme.js +2 -47
- package/cjs/internal/themes/DefaultTheme.js.map +1 -1
- package/cjs/internal/themes/Theme2022.d.ts +0 -3
- package/cjs/internal/themes/Theme2022.js +2 -11
- package/cjs/internal/themes/Theme2022.js.map +1 -1
- package/cjs/typings/html.d.ts +0 -1
- package/components/Button/getInnerLinkTheme/getInnerLinkTheme.js +0 -3
- package/components/Button/getInnerLinkTheme/getInnerLinkTheme.js.map +1 -1
- package/components/Link/Link/Link.js +4 -4
- package/components/Link/Link/Link.js.map +1 -1
- package/components/Link/Link.mixins/Link.mixins.js +2 -5
- package/components/Link/Link.mixins/Link.mixins.js.map +1 -1
- package/components/Link/Link.mixins.d.ts +1 -2
- package/components/Link/Link.styles/Link.styles.js +28 -21
- package/components/Link/Link.styles/Link.styles.js.map +1 -1
- package/components/Link/Link.styles.d.ts +2 -0
- package/components/Modal/ModalFooter/ModalFooter.js +1 -1
- package/components/Modal/ModalFooter/ModalFooter.js.map +1 -1
- package/components/Modal/ModalHeader/ModalHeader.js +1 -1
- package/components/Modal/ModalHeader/ModalHeader.js.map +1 -1
- package/internal/CustomComboBox/CustomComboBox/CustomComboBox.js +20 -7
- package/internal/CustomComboBox/CustomComboBox/CustomComboBox.js.map +1 -1
- package/internal/ThemeShowcase/VariablesCollector.d.ts +1 -1
- package/internal/themes/DefaultTheme/DefaultTheme.js +4 -79
- package/internal/themes/DefaultTheme/DefaultTheme.js.map +1 -1
- package/internal/themes/DefaultTheme.d.ts +0 -15
- package/internal/themes/Theme2022/Theme2022.js +4 -19
- package/internal/themes/Theme2022/Theme2022.js.map +1 -1
- package/internal/themes/Theme2022.d.ts +0 -3
- package/package.json +2 -2
- package/typings/html.d.ts +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,21 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [4.15.1](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@4.15.0...@skbkontur/react-ui@4.15.1) (2023-07-04)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* allow use inherit as a linkColor ([#3185](https://github.com/skbkontur/retail-ui/issues/3185)) ([09218bb](https://github.com/skbkontur/retail-ui/commit/09218bb9bce9746e25b1894b9c3631e0a0b44785))
|
|
12
|
+
* **ComboBox:** flushSync throws an error into console ([#3189](https://github.com/skbkontur/retail-ui/issues/3189)) ([8e0d2d2](https://github.com/skbkontur/retail-ui/commit/8e0d2d20f2bd5e5f034841a8057ce4a06012d23b))
|
|
13
|
+
* **html:** get rid of type duplication ([#3188](https://github.com/skbkontur/retail-ui/issues/3188)) ([5de46a4](https://github.com/skbkontur/retail-ui/commit/5de46a4aef7728239f417c225235f9a97ec23cac))
|
|
14
|
+
* **Modal.Header, Modal.Footer:** passing common props ([#3187](https://github.com/skbkontur/retail-ui/issues/3187)) ([4aa327b](https://github.com/skbkontur/retail-ui/commit/4aa327b9b457912591c57b83342e722ae0802506))
|
|
15
|
+
* **theme:** add missing units to values ([#3184](https://github.com/skbkontur/retail-ui/issues/3184)) ([885a372](https://github.com/skbkontur/retail-ui/commit/885a372d8d6b5e3df3894cfee8f59ed685b0c056))
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
6
21
|
# [4.15.0](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@4.14.2...@skbkontur/react-ui@4.15.0) (2023-06-13)
|
|
7
22
|
|
|
8
23
|
|
|
@@ -4,11 +4,8 @@
|
|
|
4
4
|
var getInnerLinkTheme = function getInnerLinkTheme(theme) {
|
|
5
5
|
return _ThemeFactory.ThemeFactory.create(
|
|
6
6
|
{
|
|
7
|
-
linkLineBorderBottomColor: theme.btnLinkLineBorderBottomColor,
|
|
8
7
|
linkLineBorderBottomStyle: theme.btnLinkLineBorderBottomStyle,
|
|
9
8
|
linkLineBorderBottomWidth: theme.btnLinkLineBorderBottomWidth,
|
|
10
|
-
linkLineHoverBorderBottomColor: theme.btnLinkLineHoverBorderBottomColor,
|
|
11
|
-
linkLineActiveBorderBottomColor: theme.btnLinkLineActiveBorderBottomColor,
|
|
12
9
|
linkDisabledColor: theme.btnLinkDisabledColor },
|
|
13
10
|
|
|
14
11
|
theme);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["getInnerLinkTheme.ts"],"names":["getInnerLinkTheme","theme","ThemeFactory","create","
|
|
1
|
+
{"version":3,"sources":["getInnerLinkTheme.ts"],"names":["getInnerLinkTheme","theme","ThemeFactory","create","linkLineBorderBottomStyle","btnLinkLineBorderBottomStyle","linkLineBorderBottomWidth","btnLinkLineBorderBottomWidth","linkDisabledColor","btnLinkDisabledColor"],"mappings":"0EAAA;;;AAGO,IAAMA,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,KAAD,EAAyB;AACxD,SAAOC,2BAAaC,MAAb;AACL;AACEC,IAAAA,yBAAyB,EAAEH,KAAK,CAACI,4BADnC;AAEEC,IAAAA,yBAAyB,EAAEL,KAAK,CAACM,4BAFnC;AAGEC,IAAAA,iBAAiB,EAAEP,KAAK,CAACQ,oBAH3B,EADK;;AAMLR,EAAAA,KANK,CAAP;;AAQD,CATM,C","sourcesContent":["import { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const getInnerLinkTheme = (theme: Theme): Theme => {\n return ThemeFactory.create(\n {\n linkLineBorderBottomStyle: theme.btnLinkLineBorderBottomStyle,\n linkLineBorderBottomWidth: theme.btnLinkLineBorderBottomWidth,\n linkDisabledColor: theme.btnLinkDisabledColor,\n },\n theme,\n );\n};\n"]}
|
|
@@ -170,13 +170,14 @@ Link = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function
|
|
|
170
170
|
|
|
171
171
|
var linkProps = {
|
|
172
172
|
className: (0, _Emotion.cx)(
|
|
173
|
+
_Link.styles.useRoot(),
|
|
173
174
|
use === 'default' && _Link.styles.useDefault(_this.theme),
|
|
174
175
|
use === 'success' && _Link.styles.useSuccess(_this.theme),
|
|
175
176
|
use === 'danger' && _Link.styles.useDanger(_this.theme),
|
|
176
177
|
use === 'grayed' && _Link.styles.useGrayed(_this.theme),
|
|
177
178
|
!!_button && _Link.styles.button(_this.theme),
|
|
178
179
|
!!_buttonOpened && _Link.styles.buttonOpened(_this.theme),
|
|
179
|
-
_this.getLinkClassName(isFocused, Boolean(disabled || loading))),
|
|
180
|
+
_this.getLinkClassName(isFocused, Boolean(disabled || loading), _isTheme2022)),
|
|
180
181
|
|
|
181
182
|
href: href,
|
|
182
183
|
rel: rel,
|
|
@@ -227,7 +228,7 @@ Link = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function
|
|
|
227
228
|
}
|
|
228
229
|
};return _this;}var _proto = Link.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = _this2.props.theme ? _ThemeFactory.ThemeFactory.create(_this2.props.theme, theme) : theme;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this2.setRootNode }, _this2.getProps()), _this2.renderMain);});};_proto.
|
|
229
230
|
|
|
230
|
-
getLinkClassName = function getLinkClassName(focused, disabled) {
|
|
231
|
+
getLinkClassName = function getLinkClassName(focused, disabled, _isTheme2022) {
|
|
231
232
|
var _this$getProps = this.getProps(),use = _this$getProps.use;
|
|
232
233
|
var isBorderBottom = parseInt(this.theme.linkLineBorderBottomWidth) > 0;
|
|
233
234
|
var isFocused = focused && !disabled;
|
|
@@ -242,6 +243,7 @@ Link = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function
|
|
|
242
243
|
(0, _Emotion.cx)(
|
|
243
244
|
_Link.styles.lineRoot(),
|
|
244
245
|
disabled && _Link.styles.disabled(this.theme),
|
|
246
|
+
disabled && _isTheme2022 && (0, _ThemeHelpers.isDarkTheme)(this.theme) && _Link.styles.disabledDark22Theme(),
|
|
245
247
|
isFocused && use === 'default' && _Link.styles.lineFocus(this.theme),
|
|
246
248
|
isFocused && use === 'success' && _Link.styles.lineFocusSuccess(this.theme),
|
|
247
249
|
isFocused && use === 'danger' && _Link.styles.lineFocusDanger(this.theme),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Link.tsx"],"names":["LinkDataTids","root","Link","rootNode","getProps","defaultProps","state","focusedByTab","renderMain","props","disabled","href","icon","use","loading","_button","_buttonOpened","relOrigin","rel","Component","as","focused","rest","_isTheme2022","theme","iconElement","styles","arrow","isFocused","linkProps","className","useDefault","useSuccess","useDanger","useGrayed","button","buttonOpened","getLinkClassName","Boolean","onClick","handleClick","onFocus","handleFocus","onBlur","handleBlur","tabIndex","child","children","globalClasses","text","lineText","requestAnimationFrame","keyListener","isTabPressed","setState","event","preventDefault","render","ThemeFactory","create","setRootNode","isBorderBottom","parseInt","linkLineBorderBottomWidth","focus","useGrayedFocus","lineRoot","lineFocus","lineFocusSuccess","lineFocusDanger","lineFocusGrayed","React","__KONTUR_REACT_UI__","propTypes","PropTypes","bool","string","node","oneOf"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Override } from '../../typings/utility-types';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme, ThemeIn } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { isExternalLink } from '../../lib/utils';\nimport { Spinner } from '../Spinner';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter, DefaultizedProps } from '../../lib/createPropsGetter';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\n\nimport { globalClasses, styles } from './Link.styles';\n\nexport interface LinkProps\n extends CommonProps,\n Override<\n React.AnchorHTMLAttributes<HTMLAnchorElement>,\n {\n /**\n * Отключенное состояние.\n */\n disabled?: boolean;\n /**\n * HTML-атрибут `href`.\n */\n href?: string;\n /**\n * Добавляет ссылке иконку.\n */\n icon?: React.ReactElement<any>;\n /**\n * Тема ссылки.\n */\n use?: 'default' | 'success' | 'danger' | 'grayed';\n /**\n * @ignore\n */\n _button?: boolean;\n /**\n * @ignore\n */\n _buttonOpened?: boolean;\n /**\n * HTML-атрибут `tabindex`.\n */\n tabIndex?: number;\n /**\n * Переводит ссылку в состояние загрузки.\n */\n loading?: boolean;\n /**\n * HTML-событие `onclick`.\n */\n onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;\n\n /**\n * Обычный объект с переменными темы.\n * Он будет объединён с темой из контекста.\n */\n theme?: ThemeIn;\n /**\n * Компонент, используемый в качестве корневого узла.\n * @ignore\n */\n as?: React.ElementType | keyof React.ReactHTML;\n /**\n * @ignore\n */\n focused?: boolean;\n }\n > {}\n\nexport interface LinkState {\n focusedByTab: boolean;\n}\n\nexport const LinkDataTids = {\n root: 'Link__root',\n} as const;\n\ntype DefaultProps = Required<Pick<LinkProps, 'href' | 'use' | 'as'>>;\ntype DefaultizedLinkProps = DefaultizedProps<LinkProps, DefaultProps>;\n\n/**\n * Элемент ссылки из HTML.\n */\n@rootNode\nexport class Link extends React.Component<LinkProps, LinkState> {\n public static __KONTUR_REACT_UI__ = 'Link';\n\n public static propTypes = {\n disabled: PropTypes.bool,\n\n href: PropTypes.string,\n\n icon: PropTypes.node,\n\n use: PropTypes.oneOf(['default', 'success', 'danger', 'grayed']),\n };\n\n public static defaultProps: DefaultProps = {\n href: '',\n use: 'default',\n as: 'a',\n };\n\n private getProps = createPropsGetter(Link.defaultProps);\n\n public state: LinkState = {\n focusedByTab: false,\n };\n\n private theme!: Theme;\n private setRootNode!: TSetRootNode;\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = this.props.theme ? ThemeFactory.create(this.props.theme as Theme, theme) : theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n {this.renderMain}\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain = (props: CommonWrapperRestProps<DefaultizedLinkProps>) => {\n const {\n disabled,\n href,\n icon,\n use,\n loading,\n _button,\n _buttonOpened,\n rel: relOrigin,\n as: Component,\n focused = false,\n ...rest\n } = props;\n const _isTheme2022 = isTheme2022(this.theme);\n\n let iconElement = null;\n if (icon) {\n iconElement = (\n <span className={styles.icon(this.theme)}>{loading ? <Spinner caption={null} dimmed inline /> : icon}</span>\n );\n }\n\n let arrow = null;\n if (_button) {\n arrow = <span className={styles.arrow()} />;\n }\n\n let rel = relOrigin;\n if (typeof rel === 'undefined' && href) {\n rel = `noopener${isExternalLink(href) ? ' noreferrer' : ''}`;\n }\n\n const isFocused = !disabled && (this.state.focusedByTab || focused);\n\n const linkProps = {\n className: cx(\n use === 'default' && styles.useDefault(this.theme),\n use === 'success' && styles.useSuccess(this.theme),\n use === 'danger' && styles.useDanger(this.theme),\n use === 'grayed' && styles.useGrayed(this.theme),\n !!_button && styles.button(this.theme),\n !!_buttonOpened && styles.buttonOpened(this.theme),\n this.getLinkClassName(isFocused, Boolean(disabled || loading)),\n ),\n href,\n rel,\n onClick: this.handleClick,\n onFocus: this.handleFocus,\n onBlur: this.handleBlur,\n tabIndex: disabled || loading ? -1 : this.props.tabIndex,\n };\n\n let child = this.props.children;\n if (_isTheme2022) {\n child = <span className={cx(globalClasses.text, styles.lineText(this.theme))}>{this.props.children}</span>;\n }\n\n return (\n <Component data-tid={LinkDataTids.root} {...rest} {...linkProps}>\n {iconElement}\n {child}\n {arrow}\n </Component>\n );\n };\n\n private handleFocus = () => {\n if (!this.props.disabled) {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n }\n };\n\n private handleBlur = () => {\n this.setState({ focusedByTab: false });\n };\n\n private handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {\n const { onClick, disabled, loading } = this.props;\n const href = this.getProps().href;\n if (!href) {\n event.preventDefault();\n }\n if (onClick && !disabled && !loading) {\n onClick(event);\n }\n };\n\n private getLinkClassName(focused: boolean, disabled: boolean): string {\n const { use } = this.getProps();\n const isBorderBottom = parseInt(this.theme.linkLineBorderBottomWidth) > 0;\n const isFocused = focused && !disabled;\n\n return !isBorderBottom\n ? cx(\n styles.root(this.theme),\n isFocused && styles.focus(this.theme),\n disabled && styles.disabled(this.theme),\n use === 'grayed' && focused && styles.useGrayedFocus(this.theme),\n )\n : cx(\n styles.lineRoot(),\n disabled && styles.disabled(this.theme),\n isFocused && use === 'default' && styles.lineFocus(this.theme),\n isFocused && use === 'success' && styles.lineFocusSuccess(this.theme),\n isFocused && use === 'danger' && styles.lineFocusDanger(this.theme),\n isFocused && use === 'grayed' && styles.lineFocusGrayed(this.theme),\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["Link.tsx"],"names":["LinkDataTids","root","Link","rootNode","getProps","defaultProps","state","focusedByTab","renderMain","props","disabled","href","icon","use","loading","_button","_buttonOpened","relOrigin","rel","Component","as","focused","rest","_isTheme2022","theme","iconElement","styles","arrow","isFocused","linkProps","className","useRoot","useDefault","useSuccess","useDanger","useGrayed","button","buttonOpened","getLinkClassName","Boolean","onClick","handleClick","onFocus","handleFocus","onBlur","handleBlur","tabIndex","child","children","globalClasses","text","lineText","requestAnimationFrame","keyListener","isTabPressed","setState","event","preventDefault","render","ThemeFactory","create","setRootNode","isBorderBottom","parseInt","linkLineBorderBottomWidth","focus","useGrayedFocus","lineRoot","disabledDark22Theme","lineFocus","lineFocusSuccess","lineFocusDanger","lineFocusGrayed","React","__KONTUR_REACT_UI__","propTypes","PropTypes","bool","string","node","oneOf"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Override } from '../../typings/utility-types';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme, ThemeIn } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { isExternalLink } from '../../lib/utils';\nimport { Spinner } from '../Spinner';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter, DefaultizedProps } from '../../lib/createPropsGetter';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { isDarkTheme, isTheme2022 } from '../../lib/theming/ThemeHelpers';\n\nimport { globalClasses, styles } from './Link.styles';\n\nexport interface LinkProps\n extends CommonProps,\n Override<\n React.AnchorHTMLAttributes<HTMLAnchorElement>,\n {\n /**\n * Отключенное состояние.\n */\n disabled?: boolean;\n /**\n * HTML-атрибут `href`.\n */\n href?: string;\n /**\n * Добавляет ссылке иконку.\n */\n icon?: React.ReactElement<any>;\n /**\n * Тема ссылки.\n */\n use?: 'default' | 'success' | 'danger' | 'grayed';\n /**\n * @ignore\n */\n _button?: boolean;\n /**\n * @ignore\n */\n _buttonOpened?: boolean;\n /**\n * HTML-атрибут `tabindex`.\n */\n tabIndex?: number;\n /**\n * Переводит ссылку в состояние загрузки.\n */\n loading?: boolean;\n /**\n * HTML-событие `onclick`.\n */\n onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;\n\n /**\n * Обычный объект с переменными темы.\n * Он будет объединён с темой из контекста.\n */\n theme?: ThemeIn;\n /**\n * Компонент, используемый в качестве корневого узла.\n * @ignore\n */\n as?: React.ElementType | keyof React.ReactHTML;\n /**\n * @ignore\n */\n focused?: boolean;\n }\n > {}\n\nexport interface LinkState {\n focusedByTab: boolean;\n}\n\nexport const LinkDataTids = {\n root: 'Link__root',\n} as const;\n\ntype DefaultProps = Required<Pick<LinkProps, 'href' | 'use' | 'as'>>;\ntype DefaultizedLinkProps = DefaultizedProps<LinkProps, DefaultProps>;\n\n/**\n * Элемент ссылки из HTML.\n */\n@rootNode\nexport class Link extends React.Component<LinkProps, LinkState> {\n public static __KONTUR_REACT_UI__ = 'Link';\n\n public static propTypes = {\n disabled: PropTypes.bool,\n\n href: PropTypes.string,\n\n icon: PropTypes.node,\n\n use: PropTypes.oneOf(['default', 'success', 'danger', 'grayed']),\n };\n\n public static defaultProps: DefaultProps = {\n href: '',\n use: 'default',\n as: 'a',\n };\n\n private getProps = createPropsGetter(Link.defaultProps);\n\n public state: LinkState = {\n focusedByTab: false,\n };\n\n private theme!: Theme;\n private setRootNode!: TSetRootNode;\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = this.props.theme ? ThemeFactory.create(this.props.theme as Theme, theme) : theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n {this.renderMain}\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain = (props: CommonWrapperRestProps<DefaultizedLinkProps>) => {\n const {\n disabled,\n href,\n icon,\n use,\n loading,\n _button,\n _buttonOpened,\n rel: relOrigin,\n as: Component,\n focused = false,\n ...rest\n } = props;\n const _isTheme2022 = isTheme2022(this.theme);\n\n let iconElement = null;\n if (icon) {\n iconElement = (\n <span className={styles.icon(this.theme)}>{loading ? <Spinner caption={null} dimmed inline /> : icon}</span>\n );\n }\n\n let arrow = null;\n if (_button) {\n arrow = <span className={styles.arrow()} />;\n }\n\n let rel = relOrigin;\n if (typeof rel === 'undefined' && href) {\n rel = `noopener${isExternalLink(href) ? ' noreferrer' : ''}`;\n }\n\n const isFocused = !disabled && (this.state.focusedByTab || focused);\n\n const linkProps = {\n className: cx(\n styles.useRoot(),\n use === 'default' && styles.useDefault(this.theme),\n use === 'success' && styles.useSuccess(this.theme),\n use === 'danger' && styles.useDanger(this.theme),\n use === 'grayed' && styles.useGrayed(this.theme),\n !!_button && styles.button(this.theme),\n !!_buttonOpened && styles.buttonOpened(this.theme),\n this.getLinkClassName(isFocused, Boolean(disabled || loading), _isTheme2022),\n ),\n href,\n rel,\n onClick: this.handleClick,\n onFocus: this.handleFocus,\n onBlur: this.handleBlur,\n tabIndex: disabled || loading ? -1 : this.props.tabIndex,\n };\n\n let child = this.props.children;\n if (_isTheme2022) {\n child = <span className={cx(globalClasses.text, styles.lineText(this.theme))}>{this.props.children}</span>;\n }\n\n return (\n <Component data-tid={LinkDataTids.root} {...rest} {...linkProps}>\n {iconElement}\n {child}\n {arrow}\n </Component>\n );\n };\n\n private handleFocus = () => {\n if (!this.props.disabled) {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n }\n };\n\n private handleBlur = () => {\n this.setState({ focusedByTab: false });\n };\n\n private handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {\n const { onClick, disabled, loading } = this.props;\n const href = this.getProps().href;\n if (!href) {\n event.preventDefault();\n }\n if (onClick && !disabled && !loading) {\n onClick(event);\n }\n };\n\n private getLinkClassName(focused: boolean, disabled: boolean, _isTheme2022: boolean): string {\n const { use } = this.getProps();\n const isBorderBottom = parseInt(this.theme.linkLineBorderBottomWidth) > 0;\n const isFocused = focused && !disabled;\n\n return !isBorderBottom\n ? cx(\n styles.root(this.theme),\n isFocused && styles.focus(this.theme),\n disabled && styles.disabled(this.theme),\n use === 'grayed' && focused && styles.useGrayedFocus(this.theme),\n )\n : cx(\n styles.lineRoot(),\n disabled && styles.disabled(this.theme),\n disabled && _isTheme2022 && isDarkTheme(this.theme) && styles.disabledDark22Theme(),\n isFocused && use === 'default' && styles.lineFocus(this.theme),\n isFocused && use === 'success' && styles.lineFocusSuccess(this.theme),\n isFocused && use === 'danger' && styles.lineFocusDanger(this.theme),\n isFocused && use === 'grayed' && styles.lineFocusGrayed(this.theme),\n );\n }\n}\n"]}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
export declare const linkMixin: (hoverTextDecoration: string) => string;
|
|
2
2
|
export declare const linkDisabledMixin: () => string;
|
|
3
3
|
export declare const linkUseColorsMixin: (mainColor: string, hoverColor: string, activeColor: string) => string;
|
|
4
|
-
export declare const
|
|
5
|
-
export declare const linkUseLineColorsHoverMixin: (hoverColor: string, nestedSelector: string) => string;
|
|
4
|
+
export declare const linkUseLineWithoutOpacity: () => string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";exports.__esModule = true;exports.
|
|
1
|
+
"use strict";exports.__esModule = true;exports.linkUseLineWithoutOpacity = exports.linkUseColorsMixin = exports.linkMixin = exports.linkDisabledMixin = void 0;var linkMixin = function linkMixin(hoverTextDecoration) {
|
|
2
2
|
return "\n border-radius: 1px;\n outline: none;\n text-decoration: none;\n\n &:hover {\n text-decoration: " +
|
|
3
3
|
|
|
4
4
|
|
|
@@ -37,20 +37,8 @@ var linkUseColorsMixin = function linkUseColorsMixin(mainColor, hoverColor, acti
|
|
|
37
37
|
|
|
38
38
|
};exports.linkUseColorsMixin = linkUseColorsMixin;
|
|
39
39
|
|
|
40
|
-
var
|
|
41
|
-
return "\n
|
|
42
|
-
mainColor + ";\n\n &:active {\n border-bottom-color: " +
|
|
40
|
+
var linkUseLineWithoutOpacity = function linkUseLineWithoutOpacity() {
|
|
41
|
+
return "\n animation: none !important;\n ";
|
|
43
42
|
|
|
44
43
|
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
};exports.linkUseLineColorsMixin = linkUseLineColorsMixin;
|
|
49
|
-
|
|
50
|
-
var linkUseLineColorsHoverMixin = function linkUseLineColorsHoverMixin(hoverColor, nestedSelector) {
|
|
51
|
-
return "\n &:hover " +
|
|
52
|
-
nestedSelector + " {\n border-bottom-color: " +
|
|
53
|
-
hoverColor + ";\n }\n ";
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
};exports.linkUseLineColorsHoverMixin = linkUseLineColorsHoverMixin;
|
|
44
|
+
};exports.linkUseLineWithoutOpacity = linkUseLineWithoutOpacity;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Link.mixins.ts"],"names":["linkMixin","hoverTextDecoration","linkDisabledMixin","linkUseColorsMixin","mainColor","hoverColor","activeColor","
|
|
1
|
+
{"version":3,"sources":["Link.mixins.ts"],"names":["linkMixin","hoverTextDecoration","linkDisabledMixin","linkUseColorsMixin","mainColor","hoverColor","activeColor","linkUseLineWithoutOpacity"],"mappings":"+JAAO,IAAMA,SAAS,GAAG,SAAZA,SAAY,CAACC,mBAAD,EAAiC;AACxD;;;;;;AAMuBA,EAAAA,mBANvB;;;AASD,CAVM,C;;AAYA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,GAAM;AACrC;;;;;;;;;;AAUD,CAXM,C;;AAaA,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,SAAD,EAAoBC,UAApB,EAAwCC,WAAxC,EAAgE;AAChG;AACWF,EAAAA,SADX;;;AAIaC,EAAAA,UAJb;;;;AAQaC,EAAAA,WARb;;;AAWD,CAZM,C;;AAcA,IAAMC,yBAAyB,GAAG,SAA5BA,yBAA4B,GAAM;AAC7C;;;AAGD,CAJM,C","sourcesContent":["export const linkMixin = (hoverTextDecoration: string) => {\n return `\n border-radius: 1px;\n outline: none;\n text-decoration: none;\n\n &:hover {\n text-decoration: ${hoverTextDecoration};\n }\n `;\n};\n\nexport const linkDisabledMixin = () => {\n return `\n box-shadow: none;\n cursor: default;\n pointer-events: none;\n text-decoration: none;\n\n &:hover {\n text-decoration: none;\n }\n `;\n};\n\nexport const linkUseColorsMixin = (mainColor: string, hoverColor: string, activeColor: string) => {\n return `\n color: ${mainColor};\n\n &:hover {\n color: ${hoverColor};\n }\n\n &:active {\n color: ${activeColor};\n }\n `;\n};\n\nexport const linkUseLineWithoutOpacity = () => {\n return `\n animation: none !important;\n `;\n};\n"]}
|
|
@@ -13,6 +13,7 @@ export declare const styles: {
|
|
|
13
13
|
button(t: Theme): string;
|
|
14
14
|
buttonOpened(t: Theme): string;
|
|
15
15
|
arrow(): string;
|
|
16
|
+
useRoot(): string;
|
|
16
17
|
useDefault(t: Theme): string;
|
|
17
18
|
useSuccess(t: Theme): string;
|
|
18
19
|
useDanger(t: Theme): string;
|
|
@@ -20,5 +21,6 @@ export declare const styles: {
|
|
|
20
21
|
useGrayedFocus(t: Theme): string;
|
|
21
22
|
focus(t: Theme): string;
|
|
22
23
|
disabled(t: Theme): string;
|
|
24
|
+
disabledDark22Theme(): string;
|
|
23
25
|
icon(t: Theme): string;
|
|
24
26
|
};
|
|
@@ -1,28 +1,31 @@
|
|
|
1
1
|
"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = exports.globalClasses = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var _Link = require("./Link.mixins");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18;
|
|
4
|
+
var _Link = require("./Link.mixins");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
|
|
5
5
|
|
|
6
|
+
var globalClasses = (0, _Emotion.prefix)('link')({
|
|
7
|
+
text: 'text' });exports.globalClasses = globalClasses;
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
var line = (0, _Emotion.keyframes)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n 0% {\n border-bottom-color: inherit;\n }\n 100% {\n border-bottom-color: transparent;\n }\n"])));
|
|
6
11
|
|
|
7
12
|
|
|
8
13
|
|
|
9
14
|
|
|
10
15
|
|
|
11
16
|
|
|
12
|
-
var globalClasses = (0, _Emotion.prefix)('link')({
|
|
13
|
-
text: 'text' });exports.globalClasses = globalClasses;
|
|
14
17
|
|
|
15
18
|
|
|
16
19
|
var styles = (0, _Emotion.memoizeStyle)({
|
|
17
20
|
root: function root(t) {
|
|
18
|
-
return (0, _Emotion.css)(
|
|
21
|
+
return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n ", ";\n position: relative;\n "])),
|
|
19
22
|
(0, _Link.linkMixin)(t.linkHoverTextDecoration));
|
|
20
23
|
|
|
21
24
|
|
|
22
25
|
},
|
|
23
26
|
|
|
24
27
|
lineRoot: function lineRoot() {
|
|
25
|
-
return (0, _Emotion.css)(
|
|
28
|
+
return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n border-radius: 1px;\n outline: none;\n text-decoration: none;\n "])));
|
|
26
29
|
|
|
27
30
|
|
|
28
31
|
|
|
@@ -30,51 +33,53 @@ var styles = (0, _Emotion.memoizeStyle)({
|
|
|
30
33
|
},
|
|
31
34
|
|
|
32
35
|
lineText: function lineText(t) {
|
|
33
|
-
return (0, _Emotion.css)(
|
|
34
|
-
t.linkLineBorderBottomColor,
|
|
36
|
+
return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n border-bottom-style: ", ";\n border-bottom-width: ", ";\n animation: ", " 1s linear !important; // override creevey\n animation-play-state: paused !important;\n animation-delay: -0.5s !important;\n "])),
|
|
35
37
|
t.linkLineBorderBottomStyle,
|
|
36
|
-
t.linkLineBorderBottomWidth
|
|
38
|
+
t.linkLineBorderBottomWidth,
|
|
39
|
+
line);
|
|
40
|
+
|
|
41
|
+
|
|
37
42
|
|
|
38
43
|
},
|
|
39
44
|
|
|
40
45
|
lineFocus: function lineFocus(t) {
|
|
41
|
-
return (0, _Emotion.css)(
|
|
46
|
+
return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n color: ", ";\n .", " {\n ", "\n }\n "])),
|
|
42
47
|
t.linkHoverColor,
|
|
43
48
|
globalClasses.text,
|
|
44
|
-
|
|
49
|
+
(0, _Link.linkUseLineWithoutOpacity)());
|
|
45
50
|
|
|
46
51
|
|
|
47
52
|
},
|
|
48
53
|
|
|
49
54
|
lineFocusSuccess: function lineFocusSuccess(t) {
|
|
50
|
-
return (0, _Emotion.css)(
|
|
55
|
+
return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n color: ", " !important;\n .", " {\n ", "\n }\n "])),
|
|
51
56
|
t.linkSuccessHoverColor,
|
|
52
57
|
globalClasses.text,
|
|
53
|
-
|
|
58
|
+
(0, _Link.linkUseLineWithoutOpacity)());
|
|
54
59
|
|
|
55
60
|
|
|
56
61
|
},
|
|
57
62
|
|
|
58
63
|
lineFocusDanger: function lineFocusDanger(t) {
|
|
59
|
-
return (0, _Emotion.css)(
|
|
64
|
+
return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n color: ", " !important;\n .", " {\n ", "\n }\n "])),
|
|
60
65
|
t.linkDangerHoverColor,
|
|
61
66
|
globalClasses.text,
|
|
62
|
-
|
|
67
|
+
(0, _Link.linkUseLineWithoutOpacity)());
|
|
63
68
|
|
|
64
69
|
|
|
65
70
|
},
|
|
66
71
|
|
|
67
72
|
lineFocusGrayed: function lineFocusGrayed(t) {
|
|
68
|
-
return (0, _Emotion.css)(
|
|
73
|
+
return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n color: ", " !important;\n .", " {\n ", "\n }\n "])),
|
|
69
74
|
t.linkGrayedHoverColor,
|
|
70
75
|
globalClasses.text,
|
|
71
|
-
|
|
76
|
+
(0, _Link.linkUseLineWithoutOpacity)());
|
|
72
77
|
|
|
73
78
|
|
|
74
79
|
},
|
|
75
80
|
|
|
76
81
|
button: function button(t) {
|
|
77
|
-
return (0, _Emotion.css)(
|
|
82
|
+
return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n display: inline-block;\n line-height: ", ";\n padding-left: ", ";\n padding-right: ", ";\n "])),
|
|
78
83
|
|
|
79
84
|
t.linkButtonLineHeight,
|
|
80
85
|
t.linkButtonPaddingX,
|
|
@@ -83,13 +88,13 @@ var styles = (0, _Emotion.memoizeStyle)({
|
|
|
83
88
|
},
|
|
84
89
|
|
|
85
90
|
buttonOpened: function buttonOpened(t) {
|
|
86
|
-
return (0, _Emotion.css)(
|
|
91
|
+
return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n background: ", ";\n "])),
|
|
87
92
|
t.btnDefaultActiveBg);
|
|
88
93
|
|
|
89
94
|
},
|
|
90
95
|
|
|
91
96
|
arrow: function arrow() {
|
|
92
|
-
return (0, _Emotion.css)(
|
|
97
|
+
return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n border: 4px solid transparent;\n border-bottom-width: 0;\n border-top-color: #a0a0a0;\n display: inline-block;\n margin-bottom: 3px;\n margin-left: 3px;\n vertical-align: middle;\n "])));
|
|
93
98
|
|
|
94
99
|
|
|
95
100
|
|
|
@@ -100,76 +105,89 @@ var styles = (0, _Emotion.memoizeStyle)({
|
|
|
100
105
|
|
|
101
106
|
},
|
|
102
107
|
|
|
108
|
+
useRoot: function useRoot() {
|
|
109
|
+
return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n border-bottom-color: currentColor;\n "])));
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
},
|
|
103
113
|
useDefault: function useDefault(t) {
|
|
104
|
-
return (0, _Emotion.css)(
|
|
114
|
+
return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n ", ";\n .", " {\n :hover {\n ", "\n }\n }\n "])),
|
|
105
115
|
(0, _Link.linkUseColorsMixin)(t.linkColor, t.linkHoverColor, t.linkActiveColor),
|
|
106
|
-
(0, _Link.linkUseLineColorsHoverMixin)(t.linkLineHoverBorderBottomColor, "." + globalClasses.text),
|
|
107
116
|
globalClasses.text,
|
|
108
|
-
|
|
117
|
+
|
|
118
|
+
(0, _Link.linkUseLineWithoutOpacity)());
|
|
119
|
+
|
|
109
120
|
|
|
110
121
|
|
|
111
122
|
},
|
|
112
123
|
|
|
113
124
|
useSuccess: function useSuccess(t) {
|
|
114
|
-
return (0, _Emotion.css)(
|
|
125
|
+
return (0, _Emotion.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n ", ";\n .", " {\n :hover {\n ", "\n }\n }\n "])),
|
|
115
126
|
(0, _Link.linkUseColorsMixin)(t.linkSuccessColor, t.linkSuccessHoverColor, t.linkSuccessActiveColor),
|
|
116
|
-
(0, _Link.linkUseLineColorsHoverMixin)(t.linkLineHoverBorderBottomColorSuccess, "." + globalClasses.text),
|
|
117
127
|
globalClasses.text,
|
|
118
|
-
|
|
128
|
+
|
|
129
|
+
(0, _Link.linkUseLineWithoutOpacity)());
|
|
130
|
+
|
|
119
131
|
|
|
120
132
|
|
|
121
133
|
},
|
|
122
134
|
|
|
123
135
|
useDanger: function useDanger(t) {
|
|
124
|
-
return (0, _Emotion.css)(
|
|
136
|
+
return (0, _Emotion.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n ", ";\n .", " {\n :hover {\n ", "\n }\n }\n "])),
|
|
125
137
|
(0, _Link.linkUseColorsMixin)(t.linkDangerColor, t.linkDangerHoverColor, t.linkDangerActiveColor),
|
|
126
|
-
(0, _Link.linkUseLineColorsHoverMixin)(t.linkLineHoverBorderBottomColorDanger, "." + globalClasses.text),
|
|
127
138
|
globalClasses.text,
|
|
128
|
-
|
|
139
|
+
|
|
140
|
+
(0, _Link.linkUseLineWithoutOpacity)());
|
|
141
|
+
|
|
129
142
|
|
|
130
143
|
|
|
131
144
|
},
|
|
132
145
|
|
|
133
146
|
useGrayed: function useGrayed(t) {
|
|
134
|
-
return (0, _Emotion.css)(
|
|
147
|
+
return (0, _Emotion.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n ", ";\n .", " {\n :hover {\n ", "\n }\n }\n "])),
|
|
135
148
|
(0, _Link.linkUseColorsMixin)(t.linkGrayedColor, t.linkGrayedHoverColor, t.linkGrayedActiveColor),
|
|
136
|
-
(0, _Link.linkUseLineColorsHoverMixin)(t.linkLineHoverBorderBottomColorGrayed, "." + globalClasses.text),
|
|
137
149
|
globalClasses.text,
|
|
138
|
-
|
|
150
|
+
|
|
151
|
+
(0, _Link.linkUseLineWithoutOpacity)());
|
|
152
|
+
|
|
139
153
|
|
|
140
154
|
|
|
141
155
|
},
|
|
142
156
|
|
|
143
157
|
useGrayedFocus: function useGrayedFocus(t) {
|
|
144
|
-
return (0, _Emotion.css)(
|
|
158
|
+
return (0, _Emotion.css)(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteralLoose2.default)(["\n color: ", ";\n "])),
|
|
145
159
|
t.linkDisabledColor);
|
|
146
160
|
|
|
147
161
|
},
|
|
148
162
|
|
|
149
163
|
focus: function focus(t) {
|
|
150
|
-
return (0, _Emotion.css)(
|
|
164
|
+
return (0, _Emotion.css)(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteralLoose2.default)(["\n text-decoration: ", ";\n "])),
|
|
151
165
|
t.linkHoverTextDecoration);
|
|
152
166
|
|
|
153
167
|
},
|
|
154
168
|
|
|
155
169
|
disabled: function disabled(t) {
|
|
156
|
-
return (0, _Emotion.css)(
|
|
170
|
+
return (0, _Emotion.css)(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteralLoose2.default)(["\n ", ";\n\n color: ", " !important; // override root color\n\n &:hover {\n color: ", ";\n }\n "])),
|
|
157
171
|
(0, _Link.linkDisabledMixin)(),
|
|
158
172
|
|
|
159
173
|
t.linkDisabledColor,
|
|
160
174
|
|
|
161
|
-
globalClasses.text,
|
|
162
|
-
t.linkDisabledColor,
|
|
163
175
|
|
|
176
|
+
t.linkDisabledColor);
|
|
164
177
|
|
|
165
178
|
|
|
166
|
-
|
|
179
|
+
},
|
|
180
|
+
|
|
181
|
+
disabledDark22Theme: function disabledDark22Theme() {
|
|
182
|
+
return (0, _Emotion.css)(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteralLoose2.default)(["\n .", " {\n ", "\n }\n "])),
|
|
183
|
+
globalClasses.text,
|
|
184
|
+
(0, _Link.linkUseLineWithoutOpacity)());
|
|
167
185
|
|
|
168
186
|
|
|
169
187
|
},
|
|
170
188
|
|
|
171
189
|
icon: function icon(t) {
|
|
172
|
-
return (0, _Emotion.css)(
|
|
190
|
+
return (0, _Emotion.css)(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteralLoose2.default)(["\n display: inline-block;\n margin-right: ", ";\n "])),
|
|
173
191
|
|
|
174
192
|
t.linkIconMarginRight);
|
|
175
193
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Link.styles.ts"],"names":["globalClasses","text","styles","root","t","css","linkHoverTextDecoration","lineRoot","lineText","
|
|
1
|
+
{"version":3,"sources":["Link.styles.ts"],"names":["globalClasses","text","line","keyframes","styles","root","t","css","linkHoverTextDecoration","lineRoot","lineText","linkLineBorderBottomStyle","linkLineBorderBottomWidth","lineFocus","linkHoverColor","lineFocusSuccess","linkSuccessHoverColor","lineFocusDanger","linkDangerHoverColor","lineFocusGrayed","linkGrayedHoverColor","button","linkButtonLineHeight","linkButtonPaddingX","buttonOpened","btnDefaultActiveBg","arrow","useRoot","useDefault","linkColor","linkActiveColor","useSuccess","linkSuccessColor","linkSuccessActiveColor","useDanger","linkDangerColor","linkDangerActiveColor","useGrayed","linkGrayedColor","linkGrayedActiveColor","useGrayedFocus","linkDisabledColor","focus","disabled","disabledDark22Theme","icon","linkIconMarginRight"],"mappings":"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","sourcesContent":["import { css, keyframes, memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nimport { linkMixin, linkDisabledMixin, linkUseColorsMixin, linkUseLineWithoutOpacity } from './Link.mixins';\n\nexport const globalClasses = prefix('link')({\n text: 'text',\n});\n\nconst line = keyframes`\n 0% {\n border-bottom-color: inherit;\n }\n 100% {\n border-bottom-color: transparent;\n }\n`;\n\nexport const styles = memoizeStyle({\n root(t: Theme) {\n return css`\n ${linkMixin(t.linkHoverTextDecoration)};\n position: relative;\n `;\n },\n\n lineRoot() {\n return css`\n border-radius: 1px;\n outline: none;\n text-decoration: none;\n `;\n },\n\n lineText(t: Theme) {\n return css`\n border-bottom-style: ${t.linkLineBorderBottomStyle};\n border-bottom-width: ${t.linkLineBorderBottomWidth};\n animation: ${line} 1s linear !important; // override creevey\n animation-play-state: paused !important;\n animation-delay: -0.5s !important;\n `;\n },\n\n lineFocus(t: Theme) {\n return css`\n color: ${t.linkHoverColor};\n .${globalClasses.text} {\n ${linkUseLineWithoutOpacity()}\n }\n `;\n },\n\n lineFocusSuccess(t: Theme) {\n return css`\n color: ${t.linkSuccessHoverColor} !important;\n .${globalClasses.text} {\n ${linkUseLineWithoutOpacity()}\n }\n `;\n },\n\n lineFocusDanger(t: Theme) {\n return css`\n color: ${t.linkDangerHoverColor} !important;\n .${globalClasses.text} {\n ${linkUseLineWithoutOpacity()}\n }\n `;\n },\n\n lineFocusGrayed(t: Theme) {\n return css`\n color: ${t.linkGrayedHoverColor} !important;\n .${globalClasses.text} {\n ${linkUseLineWithoutOpacity()}\n }\n `;\n },\n\n button(t: Theme) {\n return css`\n display: inline-block;\n line-height: ${t.linkButtonLineHeight};\n padding-left: ${t.linkButtonPaddingX};\n padding-right: ${t.linkButtonPaddingX};\n `;\n },\n\n buttonOpened(t: Theme) {\n return css`\n background: ${t.btnDefaultActiveBg};\n `;\n },\n\n arrow() {\n return css`\n border: 4px solid transparent;\n border-bottom-width: 0;\n border-top-color: #a0a0a0;\n display: inline-block;\n margin-bottom: 3px;\n margin-left: 3px;\n vertical-align: middle;\n `;\n },\n\n useRoot() {\n return css`\n border-bottom-color: currentColor;\n `;\n },\n useDefault(t: Theme) {\n return css`\n ${linkUseColorsMixin(t.linkColor, t.linkHoverColor, t.linkActiveColor)};\n .${globalClasses.text} {\n :hover {\n ${linkUseLineWithoutOpacity()}\n }\n }\n `;\n },\n\n useSuccess(t: Theme) {\n return css`\n ${linkUseColorsMixin(t.linkSuccessColor, t.linkSuccessHoverColor, t.linkSuccessActiveColor)};\n .${globalClasses.text} {\n :hover {\n ${linkUseLineWithoutOpacity()}\n }\n }\n `;\n },\n\n useDanger(t: Theme) {\n return css`\n ${linkUseColorsMixin(t.linkDangerColor, t.linkDangerHoverColor, t.linkDangerActiveColor)};\n .${globalClasses.text} {\n :hover {\n ${linkUseLineWithoutOpacity()}\n }\n }\n `;\n },\n\n useGrayed(t: Theme) {\n return css`\n ${linkUseColorsMixin(t.linkGrayedColor, t.linkGrayedHoverColor, t.linkGrayedActiveColor)};\n .${globalClasses.text} {\n :hover {\n ${linkUseLineWithoutOpacity()}\n }\n }\n `;\n },\n\n useGrayedFocus(t: Theme) {\n return css`\n color: ${t.linkDisabledColor};\n `;\n },\n\n focus(t: Theme) {\n return css`\n text-decoration: ${t.linkHoverTextDecoration};\n `;\n },\n\n disabled(t: Theme) {\n return css`\n ${linkDisabledMixin()};\n\n color: ${t.linkDisabledColor} !important; // override root color\n\n &:hover {\n color: ${t.linkDisabledColor};\n }\n `;\n },\n\n disabledDark22Theme() {\n return css`\n .${globalClasses.text} {\n ${linkUseLineWithoutOpacity()}\n }\n `;\n },\n\n icon(t: Theme) {\n return css`\n display: inline-block;\n margin-right: ${t.linkIconMarginRight};\n `;\n },\n});\n"]}
|
|
@@ -63,7 +63,7 @@ function ModalFooter(props) {
|
|
|
63
63
|
|
|
64
64
|
var renderContent = function renderContent(fixed) {if (fixed === void 0) {fixed = false;}
|
|
65
65
|
return /*#__PURE__*/(
|
|
66
|
-
_react.default.createElement(
|
|
66
|
+
_react.default.createElement("div", null,
|
|
67
67
|
(panel || fixed) && /*#__PURE__*/_react.default.createElement(_ModalSeparator.ModalSeparator, { fixed: fixed }), /*#__PURE__*/
|
|
68
68
|
_react.default.createElement("div", {
|
|
69
69
|
"data-tid": ModalFooterDataTids.root,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["ModalFooter.tsx"],"names":["ModalFooterDataTids","root","ModalFooter","props","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","gap","panel","children","setHasFooter","setHasPanel","renderContent","fixed","styles","footer","fixedFooter","Boolean","fixedPanel","mobileFooter","horizontalScroll","__KONTUR_REACT_UI__","__MODAL_FOOTER__"],"mappings":"8GAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA,kD;;;;;;;;;;;;;;;;;;;;;;;;AAwBO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B;;;AAIP;AACA;AACA;AACA;AACA,G;AACA,SAASC,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAA4DL,KAA5D,CAAQM,MAAR,CAAQA,MAAR,8BAAiB,CAACD,MAAM,CAACE,QAAzB,iBAAmCC,GAAnC,GAA4DR,KAA5D,CAAmCQ,GAAnC,CAAwCC,KAAxC,GAA4DT,KAA5D,CAAwCS,KAAxC,CAA+CC,QAA/C,GAA4DV,KAA5D,CAA+CU,QAA/C;;AAEA,8BAAgB,YAAM;AACpBP,IAAAA,KAAK,CAACQ,YAAN,oBAAAR,KAAK,CAACQ,YAAN;AACAR,IAAAA,KAAK,CAACS,WAAN,oBAAAT,KAAK,CAACS,WAAN,CAAoBH,KAApB;;AAEA,WAAO,YAAM;AACXN,MAAAA,KAAK,CAACQ,YAAN,oBAAAR,KAAK,CAACQ,YAAN,CAAqB,KAArB;AACAR,MAAAA,KAAK,CAACS,WAAN,oBAAAT,KAAK,CAACS,WAAN,CAAoB,KAApB;AACD,KAHD;AAID,GARD,EAQG,CAACH,KAAD,CARH;;AAUA,MAAMI,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAmB,KAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACG,OAACL,KAAK,IAAIK,KAAV,kBAAoB,6BAAC,8BAAD,IAAgB,KAAK,EAAEA,KAAvB,GADvB;AAEE;AACE,oBAAUjB,mBAAmB,CAACC,IADhC;AAEE,QAAA,SAAS,EAAE;AACTiB,sBAAOC,MAAP,CAAcf,KAAd,CADS;AAETa,QAAAA,KAAK,IAAIC,cAAOE,WAAP,CAAmBhB,KAAnB,CAFA;AAGTiB,QAAAA,OAAO,CAACT,KAAD,CAAP,IAAkBM,cAAON,KAAP,CAAaR,KAAb,CAHT;AAITa,QAAAA,KAAK,IAAII,OAAO,CAACT,KAAD,CAAhB,IAA2BM,cAAOI,UAAP,CAAkBlB,KAAlB,CAJlB;AAKTI,QAAAA,MAAM,CAACE,QAAP,IAAmBQ,cAAOK,YAAP,CAAoBnB,KAApB,CALV,CAFb;;;AAUG,gCAAcO,GAAd;AACC,mCAAC,cAAD,IAAQ,QAAQ,EAAEH,MAAM,CAACE,QAAzB,EAAmC,GAAG,EAAEC,GAAxC;AACGE,MAAAA,QADH,CADD;;;AAKCA,MAAAA,QAfJ,CAFF,CADF;;;;;AAuBD,GAxBD;;AA0BA;AACE,iCAAC,4BAAD,EAAmBV,KAAnB;AACGM,IAAAA,MAAM;AACL,iCAAC,cAAD,IAAQ,IAAI,EAAC,QAAb,EAAsB,MAAM,EAAEH,KAAK,CAACkB,gBAAN,GAAyB,qCAAzB,GAA4C,CAA1E;AACGR,IAAAA,aADH,CADK;;;AAKLA,IAAAA,aAAa,EANjB,CADF;;;;AAWD;;AAEDd,WAAW,CAACuB,mBAAZ,GAAkC,aAAlC;AACAvB,WAAW,CAACwB,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext, useLayoutEffect } from 'react';\n\nimport { getScrollWidth } from '../../lib/dom/getScrollWidth';\nimport { Sticky } from '../Sticky';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { useResponsiveLayout } from '../ResponsiveLayout';\nimport { Gapped, GappedProps } from '../Gapped';\nimport { isNonNullable } from '../../lib/utils';\n\nimport { styles } from './Modal.styles';\nimport { ModalContext } from './ModalContext';\nimport { ModalSeparator } from './ModalSeparator';\n\nexport interface ModalFooterProps extends CommonProps {\n /**\n * Включает серый цвет в футере\n */\n panel?: boolean;\n /**\n * Закрепляет футер снизу модального окна\n *\n * На десктопе по умолчанию равен `true`\n * На мобильных по умолчанию равен `false`\n */\n sticky?: boolean;\n /**\n * Контент футера\n */\n children?: ReactNode;\n /**\n * Задаёт отступ между элементами футера\n */\n gap?: GappedProps['gap'];\n}\n\nexport const ModalFooterDataTids = {\n root: 'ModalFooter__root',\n} as const;\n\n/**\n * Футер модального окна.\n *\n * @visibleName Modal.Footer\n */\nfunction ModalFooter(props: ModalFooterProps) {\n const theme = useContext(ThemeContext);\n const modal = useContext(ModalContext);\n const layout = useResponsiveLayout();\n\n const { sticky = !layout.isMobile, gap, panel, children } = props;\n\n useLayoutEffect(() => {\n modal.setHasFooter?.();\n modal.setHasPanel?.(panel);\n\n return () => {\n modal.setHasFooter?.(false);\n modal.setHasPanel?.(false);\n };\n }, [panel]);\n\n const renderContent = (fixed = false) => {\n return (\n
|
|
1
|
+
{"version":3,"sources":["ModalFooter.tsx"],"names":["ModalFooterDataTids","root","ModalFooter","props","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","gap","panel","children","setHasFooter","setHasPanel","renderContent","fixed","styles","footer","fixedFooter","Boolean","fixedPanel","mobileFooter","horizontalScroll","__KONTUR_REACT_UI__","__MODAL_FOOTER__"],"mappings":"8GAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA,kD;;;;;;;;;;;;;;;;;;;;;;;;AAwBO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B;;;AAIP;AACA;AACA;AACA;AACA,G;AACA,SAASC,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAA4DL,KAA5D,CAAQM,MAAR,CAAQA,MAAR,8BAAiB,CAACD,MAAM,CAACE,QAAzB,iBAAmCC,GAAnC,GAA4DR,KAA5D,CAAmCQ,GAAnC,CAAwCC,KAAxC,GAA4DT,KAA5D,CAAwCS,KAAxC,CAA+CC,QAA/C,GAA4DV,KAA5D,CAA+CU,QAA/C;;AAEA,8BAAgB,YAAM;AACpBP,IAAAA,KAAK,CAACQ,YAAN,oBAAAR,KAAK,CAACQ,YAAN;AACAR,IAAAA,KAAK,CAACS,WAAN,oBAAAT,KAAK,CAACS,WAAN,CAAoBH,KAApB;;AAEA,WAAO,YAAM;AACXN,MAAAA,KAAK,CAACQ,YAAN,oBAAAR,KAAK,CAACQ,YAAN,CAAqB,KAArB;AACAR,MAAAA,KAAK,CAACS,WAAN,oBAAAT,KAAK,CAACS,WAAN,CAAoB,KAApB;AACD,KAHD;AAID,GARD,EAQG,CAACH,KAAD,CARH;;AAUA,MAAMI,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAmB,KAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACG,OAACL,KAAK,IAAIK,KAAV,kBAAoB,6BAAC,8BAAD,IAAgB,KAAK,EAAEA,KAAvB,GADvB;AAEE;AACE,oBAAUjB,mBAAmB,CAACC,IADhC;AAEE,QAAA,SAAS,EAAE;AACTiB,sBAAOC,MAAP,CAAcf,KAAd,CADS;AAETa,QAAAA,KAAK,IAAIC,cAAOE,WAAP,CAAmBhB,KAAnB,CAFA;AAGTiB,QAAAA,OAAO,CAACT,KAAD,CAAP,IAAkBM,cAAON,KAAP,CAAaR,KAAb,CAHT;AAITa,QAAAA,KAAK,IAAII,OAAO,CAACT,KAAD,CAAhB,IAA2BM,cAAOI,UAAP,CAAkBlB,KAAlB,CAJlB;AAKTI,QAAAA,MAAM,CAACE,QAAP,IAAmBQ,cAAOK,YAAP,CAAoBnB,KAApB,CALV,CAFb;;;AAUG,gCAAcO,GAAd;AACC,mCAAC,cAAD,IAAQ,QAAQ,EAAEH,MAAM,CAACE,QAAzB,EAAmC,GAAG,EAAEC,GAAxC;AACGE,MAAAA,QADH,CADD;;;AAKCA,MAAAA,QAfJ,CAFF,CADF;;;;;AAuBD,GAxBD;;AA0BA;AACE,iCAAC,4BAAD,EAAmBV,KAAnB;AACGM,IAAAA,MAAM;AACL,iCAAC,cAAD,IAAQ,IAAI,EAAC,QAAb,EAAsB,MAAM,EAAEH,KAAK,CAACkB,gBAAN,GAAyB,qCAAzB,GAA4C,CAA1E;AACGR,IAAAA,aADH,CADK;;;AAKLA,IAAAA,aAAa,EANjB,CADF;;;;AAWD;;AAEDd,WAAW,CAACuB,mBAAZ,GAAkC,aAAlC;AACAvB,WAAW,CAACwB,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext, useLayoutEffect } from 'react';\n\nimport { getScrollWidth } from '../../lib/dom/getScrollWidth';\nimport { Sticky } from '../Sticky';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { useResponsiveLayout } from '../ResponsiveLayout';\nimport { Gapped, GappedProps } from '../Gapped';\nimport { isNonNullable } from '../../lib/utils';\n\nimport { styles } from './Modal.styles';\nimport { ModalContext } from './ModalContext';\nimport { ModalSeparator } from './ModalSeparator';\n\nexport interface ModalFooterProps extends CommonProps {\n /**\n * Включает серый цвет в футере\n */\n panel?: boolean;\n /**\n * Закрепляет футер снизу модального окна\n *\n * На десктопе по умолчанию равен `true`\n * На мобильных по умолчанию равен `false`\n */\n sticky?: boolean;\n /**\n * Контент футера\n */\n children?: ReactNode;\n /**\n * Задаёт отступ между элементами футера\n */\n gap?: GappedProps['gap'];\n}\n\nexport const ModalFooterDataTids = {\n root: 'ModalFooter__root',\n} as const;\n\n/**\n * Футер модального окна.\n *\n * @visibleName Modal.Footer\n */\nfunction ModalFooter(props: ModalFooterProps) {\n const theme = useContext(ThemeContext);\n const modal = useContext(ModalContext);\n const layout = useResponsiveLayout();\n\n const { sticky = !layout.isMobile, gap, panel, children } = props;\n\n useLayoutEffect(() => {\n modal.setHasFooter?.();\n modal.setHasPanel?.(panel);\n\n return () => {\n modal.setHasFooter?.(false);\n modal.setHasPanel?.(false);\n };\n }, [panel]);\n\n const renderContent = (fixed = false) => {\n return (\n <div>\n {(panel || fixed) && <ModalSeparator fixed={fixed} />}\n <div\n data-tid={ModalFooterDataTids.root}\n className={cx(\n styles.footer(theme),\n fixed && styles.fixedFooter(theme),\n Boolean(panel) && styles.panel(theme),\n fixed && Boolean(panel) && styles.fixedPanel(theme),\n layout.isMobile && styles.mobileFooter(theme),\n )}\n >\n {isNonNullable(gap) ? (\n <Gapped vertical={layout.isMobile} gap={gap}>\n {children}\n </Gapped>\n ) : (\n children\n )}\n </div>\n </div>\n );\n };\n\n return (\n <CommonWrapper {...props}>\n {sticky ? (\n <Sticky side=\"bottom\" offset={modal.horizontalScroll ? getScrollWidth() : 0}>\n {renderContent}\n </Sticky>\n ) : (\n renderContent()\n )}\n </CommonWrapper>\n );\n}\n\nModalFooter.__KONTUR_REACT_UI__ = 'ModalFooter';\nModalFooter.__MODAL_FOOTER__ = true;\n\nexport { ModalFooter };\n"]}
|
|
@@ -40,7 +40,7 @@ function ModalHeader(props) {
|
|
|
40
40
|
|
|
41
41
|
var renderContent = function renderContent(fixed) {if (fixed === void 0) {fixed = false;}
|
|
42
42
|
return /*#__PURE__*/(
|
|
43
|
-
_react.default.createElement(
|
|
43
|
+
_react.default.createElement("div", null, /*#__PURE__*/
|
|
44
44
|
_react.default.createElement("div", {
|
|
45
45
|
"data-tid": ModalHeaderDataTids.root,
|
|
46
46
|
className: (0, _Emotion.cx)(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["ModalHeader.tsx"],"names":["ModalHeaderDataTids","root","ModalHeader","props","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","children","setHasHeader","renderContent","fixed","styles","header","mobileHeader","Boolean","additionalPadding","headerAddPadding","fixedHeader","mobileFixedHeader","close","headerWithClose","mobileHeaderWithClose","requestClose","disableClose","__KONTUR_REACT_UI__","__MODAL_HEADER__"],"mappings":"8GAAA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,kD;;;;;;;AAOO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B;;;AAIP;AACA;AACA;AACA;AACA,G;AACA,SAASC,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAAgDL,KAAhD,CAAQM,MAAR,CAAQA,MAAR,8BAAiB,CAACD,MAAM,CAACE,QAAzB,iBAAmCC,QAAnC,GAAgDR,KAAhD,CAAmCQ,QAAnC;;AAEA,8BAAgB,YAAM;AACpBL,IAAAA,KAAK,CAACM,YAAN,oBAAAN,KAAK,CAACM,YAAN;;AAEA,WAAO,oBAAMN,KAAK,CAACM,YAAZ,oBAAMN,KAAK,CAACM,YAAN,CAAqB,KAArB,CAAN,EAAP;AACD,GAJD,EAIG,EAJH;;AAMA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAmB,KAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACE;AACE,oBAAUd,mBAAmB,CAACC,IADhC;AAEE,QAAA,SAAS,EAAE;AACTc,sBAAOC,MAAP,CAAcZ,KAAd,CADS;AAETI,QAAAA,MAAM,CAACE,QAAP,IAAmBK,cAAOE,YAAP,CAAoBb,KAApB,CAFV;AAGTc,QAAAA,OAAO,CAACZ,KAAK,CAACa,iBAAP,CAAP,IAAoCJ,cAAOK,gBAAP,CAAwBhB,KAAxB,CAH3B;AAITU,QAAAA,KAAK,IAAIC,cAAOM,WAAP,CAAmBjB,KAAnB,CAJA;AAKTU,QAAAA,KAAK,IAAIN,MAAM,CAACE,QAAhB,IAA4BK,cAAOO,iBAAP,CAAyBlB,KAAzB,CALnB;AAMTc,QAAAA,OAAO,CAACZ,KAAK,CAACiB,KAAP,CAAP,IAAwBR,cAAOS,eAAP,CAAuBpB,KAAvB,CANf;AAOTI,QAAAA,MAAM,CAACE,QAAP,IAAmBK,cAAOU,qBAAP,CAA6BrB,KAA7B,CAPV,CAFb;;;AAYGE,MAAAA,KAAK,CAACiB,KAAN;AACC,mCAAC,sBAAD,IAAY,YAAY,EAAEjB,KAAK,CAACiB,KAAN,CAAYG,YAAtC,EAAoD,YAAY,EAAEpB,KAAK,CAACiB,KAAN,CAAYI,YAA9E,GAbJ;;AAeGhB,MAAAA,QAfH,CADF;;AAkBGG,MAAAA,KAAK,iBAAI,6BAAC,8BAAD,IAAgB,KAAK,EAAEA,KAAvB,GAlBZ,CADF;;;AAsBD,GAvBD;;AAyBA;AACE,iCAAC,4BAAD,EAAmBX,KAAnB,EAA2BM,MAAM,gBAAG,6BAAC,cAAD,IAAQ,IAAI,EAAC,KAAb,IAAoBI,aAApB,CAAH,GAAiDA,aAAa,EAA/F,CADF;;AAGD;;AAEDX,WAAW,CAAC0B,mBAAZ,GAAkC,aAAlC;AACA1B,WAAW,CAAC2B,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext, useLayoutEffect } from 'react';\n\nimport { Sticky } from '../Sticky';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { useResponsiveLayout } from '../ResponsiveLayout';\n\nimport { styles } from './Modal.styles';\nimport { ModalClose } from './ModalClose';\nimport { ModalContext } from './ModalContext';\nimport { ModalSeparator } from './ModalSeparator';\n\nexport interface ModalHeaderProps extends CommonProps {\n sticky?: boolean;\n children?: ReactNode;\n}\n\nexport const ModalHeaderDataTids = {\n root: 'ModalHeader__root',\n} as const;\n\n/**\n * Шапка модального окна\n *\n * @visibleName Modal.Header\n */\nfunction ModalHeader(props: ModalHeaderProps) {\n const theme = useContext(ThemeContext);\n const modal = useContext(ModalContext);\n const layout = useResponsiveLayout();\n\n const { sticky = !layout.isMobile, children } = props;\n\n useLayoutEffect(() => {\n modal.setHasHeader?.();\n\n return () => modal.setHasHeader?.(false);\n }, []);\n\n const renderContent = (fixed = false) => {\n return (\n
|
|
1
|
+
{"version":3,"sources":["ModalHeader.tsx"],"names":["ModalHeaderDataTids","root","ModalHeader","props","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","children","setHasHeader","renderContent","fixed","styles","header","mobileHeader","Boolean","additionalPadding","headerAddPadding","fixedHeader","mobileFixedHeader","close","headerWithClose","mobileHeaderWithClose","requestClose","disableClose","__KONTUR_REACT_UI__","__MODAL_HEADER__"],"mappings":"8GAAA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,kD;;;;;;;AAOO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B;;;AAIP;AACA;AACA;AACA;AACA,G;AACA,SAASC,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAAgDL,KAAhD,CAAQM,MAAR,CAAQA,MAAR,8BAAiB,CAACD,MAAM,CAACE,QAAzB,iBAAmCC,QAAnC,GAAgDR,KAAhD,CAAmCQ,QAAnC;;AAEA,8BAAgB,YAAM;AACpBL,IAAAA,KAAK,CAACM,YAAN,oBAAAN,KAAK,CAACM,YAAN;;AAEA,WAAO,oBAAMN,KAAK,CAACM,YAAZ,oBAAMN,KAAK,CAACM,YAAN,CAAqB,KAArB,CAAN,EAAP;AACD,GAJD,EAIG,EAJH;;AAMA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAmB,KAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACE;AACE,oBAAUd,mBAAmB,CAACC,IADhC;AAEE,QAAA,SAAS,EAAE;AACTc,sBAAOC,MAAP,CAAcZ,KAAd,CADS;AAETI,QAAAA,MAAM,CAACE,QAAP,IAAmBK,cAAOE,YAAP,CAAoBb,KAApB,CAFV;AAGTc,QAAAA,OAAO,CAACZ,KAAK,CAACa,iBAAP,CAAP,IAAoCJ,cAAOK,gBAAP,CAAwBhB,KAAxB,CAH3B;AAITU,QAAAA,KAAK,IAAIC,cAAOM,WAAP,CAAmBjB,KAAnB,CAJA;AAKTU,QAAAA,KAAK,IAAIN,MAAM,CAACE,QAAhB,IAA4BK,cAAOO,iBAAP,CAAyBlB,KAAzB,CALnB;AAMTc,QAAAA,OAAO,CAACZ,KAAK,CAACiB,KAAP,CAAP,IAAwBR,cAAOS,eAAP,CAAuBpB,KAAvB,CANf;AAOTI,QAAAA,MAAM,CAACE,QAAP,IAAmBK,cAAOU,qBAAP,CAA6BrB,KAA7B,CAPV,CAFb;;;AAYGE,MAAAA,KAAK,CAACiB,KAAN;AACC,mCAAC,sBAAD,IAAY,YAAY,EAAEjB,KAAK,CAACiB,KAAN,CAAYG,YAAtC,EAAoD,YAAY,EAAEpB,KAAK,CAACiB,KAAN,CAAYI,YAA9E,GAbJ;;AAeGhB,MAAAA,QAfH,CADF;;AAkBGG,MAAAA,KAAK,iBAAI,6BAAC,8BAAD,IAAgB,KAAK,EAAEA,KAAvB,GAlBZ,CADF;;;AAsBD,GAvBD;;AAyBA;AACE,iCAAC,4BAAD,EAAmBX,KAAnB,EAA2BM,MAAM,gBAAG,6BAAC,cAAD,IAAQ,IAAI,EAAC,KAAb,IAAoBI,aAApB,CAAH,GAAiDA,aAAa,EAA/F,CADF;;AAGD;;AAEDX,WAAW,CAAC0B,mBAAZ,GAAkC,aAAlC;AACA1B,WAAW,CAAC2B,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext, useLayoutEffect } from 'react';\n\nimport { Sticky } from '../Sticky';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { useResponsiveLayout } from '../ResponsiveLayout';\n\nimport { styles } from './Modal.styles';\nimport { ModalClose } from './ModalClose';\nimport { ModalContext } from './ModalContext';\nimport { ModalSeparator } from './ModalSeparator';\n\nexport interface ModalHeaderProps extends CommonProps {\n sticky?: boolean;\n children?: ReactNode;\n}\n\nexport const ModalHeaderDataTids = {\n root: 'ModalHeader__root',\n} as const;\n\n/**\n * Шапка модального окна\n *\n * @visibleName Modal.Header\n */\nfunction ModalHeader(props: ModalHeaderProps) {\n const theme = useContext(ThemeContext);\n const modal = useContext(ModalContext);\n const layout = useResponsiveLayout();\n\n const { sticky = !layout.isMobile, children } = props;\n\n useLayoutEffect(() => {\n modal.setHasHeader?.();\n\n return () => modal.setHasHeader?.(false);\n }, []);\n\n const renderContent = (fixed = false) => {\n return (\n <div>\n <div\n data-tid={ModalHeaderDataTids.root}\n className={cx(\n styles.header(theme),\n layout.isMobile && styles.mobileHeader(theme),\n Boolean(modal.additionalPadding) && styles.headerAddPadding(theme),\n fixed && styles.fixedHeader(theme),\n fixed && layout.isMobile && styles.mobileFixedHeader(theme),\n Boolean(modal.close) && styles.headerWithClose(theme),\n layout.isMobile && styles.mobileHeaderWithClose(theme),\n )}\n >\n {modal.close && (\n <ModalClose requestClose={modal.close.requestClose} disableClose={modal.close.disableClose} />\n )}\n {children}\n </div>\n {fixed && <ModalSeparator fixed={fixed} />}\n </div>\n );\n };\n\n return (\n <CommonWrapper {...props}>{sticky ? <Sticky side=\"top\">{renderContent}</Sticky> : renderContent()}</CommonWrapper>\n );\n}\n\nModalHeader.__KONTUR_REACT_UI__ = 'ModalHeader';\nModalHeader.__MODAL_HEADER__ = true;\n\nexport { ModalHeader };\n"]}
|