@skbkontur/react-ui 4.22.4 → 4.22.6-next.0
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 +11 -0
- package/cjs/components/Autocomplete/Autocomplete.js +2 -0
- package/cjs/components/Autocomplete/Autocomplete.js.map +1 -1
- package/cjs/components/Hint/Hint.d.ts +4 -3
- package/cjs/components/Hint/Hint.js +9 -8
- package/cjs/components/Hint/Hint.js.map +1 -1
- package/cjs/components/Tooltip/Tooltip.d.ts +10 -5
- package/cjs/components/Tooltip/Tooltip.js +59 -20
- package/cjs/components/Tooltip/Tooltip.js.map +1 -1
- package/cjs/internal/CustomComboBox/ComboBoxView.js +3 -1
- package/cjs/internal/CustomComboBox/ComboBoxView.js.map +1 -1
- package/cjs/internal/Popup/Popup.d.ts +15 -4
- package/cjs/internal/Popup/Popup.js +67 -4
- package/cjs/internal/Popup/Popup.js.map +1 -1
- package/cjs/lib/featureFlagsContext/FEATUREFLAGSCONTEXT.md +24 -0
- package/cjs/lib/featureFlagsContext/FeatureFlagsHelpers.d.ts +1 -0
- package/cjs/lib/featureFlagsContext/ReactUIFeatureFlagsContext.d.ts +1 -0
- package/cjs/lib/featureFlagsContext/ReactUIFeatureFlagsContext.js +3 -1
- package/cjs/lib/featureFlagsContext/ReactUIFeatureFlagsContext.js.map +1 -1
- package/components/Autocomplete/Autocomplete/Autocomplete.js +2 -0
- package/components/Autocomplete/Autocomplete/Autocomplete.js.map +1 -1
- package/components/Hint/Hint/Hint.js +50 -45
- package/components/Hint/Hint/Hint.js.map +1 -1
- package/components/Hint/Hint.d.ts +4 -3
- package/components/Tooltip/Tooltip/Tooltip.js +64 -43
- package/components/Tooltip/Tooltip/Tooltip.js.map +1 -1
- package/components/Tooltip/Tooltip.d.ts +10 -5
- package/internal/CustomComboBox/ComboBoxView/ComboBoxView.js +2 -0
- package/internal/CustomComboBox/ComboBoxView/ComboBoxView.js.map +1 -1
- package/internal/Popup/Popup/Popup.js +50 -7
- package/internal/Popup/Popup/Popup.js.map +1 -1
- package/internal/Popup/Popup.d.ts +15 -4
- package/lib/featureFlagsContext/FEATUREFLAGSCONTEXT.md +24 -0
- package/lib/featureFlagsContext/FeatureFlagsHelpers.d.ts +1 -0
- package/lib/featureFlagsContext/ReactUIFeatureFlagsContext/ReactUIFeatureFlagsContext.js +2 -1
- package/lib/featureFlagsContext/ReactUIFeatureFlagsContext/ReactUIFeatureFlagsContext.js.map +1 -1
- package/lib/featureFlagsContext/ReactUIFeatureFlagsContext.d.ts +1 -0
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,17 @@
|
|
|
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.22.5](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@4.22.4...@skbkontur/react-ui@4.22.5) (2024-05-14)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* **Autocomplete, ComboBox:** disable browser autofill ([#3419](https://github.com/skbkontur/retail-ui/issues/3419)) ([f805126](https://github.com/skbkontur/retail-ui/commit/f8051261304878b9cfffa744dc82a7296a7448b9))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
6
17
|
## [4.22.4](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@4.22.3...@skbkontur/react-ui@4.22.4) (2024-05-07)
|
|
7
18
|
|
|
8
19
|
|
|
@@ -237,6 +237,7 @@ Autocomplete = (_dec = (0, _decorators.locale)('Autocomplete', _locale.Autocompl
|
|
|
237
237
|
var inputProps = (0, _extends2.default)({},
|
|
238
238
|
rest, {
|
|
239
239
|
width: '100%',
|
|
240
|
+
autoComplete: 'off',
|
|
240
241
|
onValueChange: _this.handleValueChange,
|
|
241
242
|
onKeyDown: _this.handleKeyDown,
|
|
242
243
|
onFocus: _this.handleFocus,
|
|
@@ -307,6 +308,7 @@ Autocomplete = (_dec = (0, _decorators.locale)('Autocomplete', _locale.Autocompl
|
|
|
307
308
|
|
|
308
309
|
renderMobileMenu = function () {var _this$mobilePopup;
|
|
309
310
|
var inputProps = {
|
|
311
|
+
autoComplete: 'off',
|
|
310
312
|
autoFocus: true,
|
|
311
313
|
width: '100%',
|
|
312
314
|
onValueChange: _this.handleValueChange,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Autocomplete.tsx"],"names":["match","pattern","items","Promise","resolve","lowerCasedPattern","toLowerCase","itemsMatchingPattern","filter","item","includes","renderItem","AutocompleteDataTids","root","menu","AutocompleteIds","Autocomplete","AutocompleteLocaleHelper","responsiveLayout","rootNode","state","selected","focused","isMobileOpened","opened","input","menuId","requestId","getProps","defaultProps","renderMain","props","isMobile","isMobileLayout","onValueChange","onKeyDown","onFocus","onBlur","_renderItem","disablePortal","hasShadow","menuAlign","menuMaxHeight","preventWindowScroll","source","width","theme","inputWidth","mobileMenuHeaderText","ariaLabel","rest","inputProps","handleValueChange","handleKeyDown","handleFocus","ref","refInput","handleBlur","handleClickOutside","styles","refRootSpan","renderMobileMenu","renderMenu","autoFocus","onKeyPress","handleKeyPressMobile","value","placeholder","locale","enterValue","handleCloseMobile","refMobilePopup","refMenu","mobilePopup","close","length","getItems","renderHints","map","i","handleMenuItemClick","size","fireChange","setState","e","key","event","blur","preventDefault","up","down","enter","getAnchor","el","span","rootSpan","focus","componentDidUpdate","prevProps","updateItems","render","setRootNode","notFound","updateValue","menuWidth","menuPos","menuProps","maxHeight","handleItemClick","index","button","choose","trim","promise","expectingId","then","React","Component","__KONTUR_REACT_UI__","displayName","propTypes","PropTypes","func","oneOfType","array"],"mappings":"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","sourcesContent":["// TODO: Enable this rule in functional components.\n/* eslint-disable @typescript-eslint/no-unused-vars */\nimport React, { AriaAttributes, KeyboardEvent } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { MenuMessage } from '../../internal/MenuMessage';\nimport { locale } from '../../lib/locale/decorators';\nimport { getRandomID, isNullable } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isKeyArrowDown, isKeyArrowUp, isKeyEnter, isKeyEscape } from '../../lib/events/keyboard/identifiers';\nimport { Input, InputProps } from '../Input';\nimport { DropdownContainer, DropdownContainerProps } from '../../internal/DropdownContainer';\nimport { Menu } from '../../internal/Menu';\nimport { MenuItem } from '../MenuItem';\nimport { RenderLayer } from '../../internal/RenderLayer';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { Nullable, Override } from '../../typings/utility-types';\nimport { fixClickFocusIE } from '../../lib/events/fixClickFocusIE';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { MobilePopup } from '../../internal/MobilePopup';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\nimport { SizeProp } from '../../lib/types/props';\n\nimport { styles } from './Autocomplete.styles';\nimport { AutocompleteLocale, AutocompleteLocaleHelper } from './locale';\nimport { getAutocompleteTheme } from './getAutocompleteTheme';\n\nfunction match(pattern: string, items: string[]) {\n if (!pattern || !items) {\n return Promise.resolve([]);\n }\n\n const lowerCasedPattern = pattern.toLowerCase();\n const itemsMatchingPattern = items.filter((item) => {\n return item.toLowerCase().includes(lowerCasedPattern);\n });\n\n return Promise.resolve(itemsMatchingPattern);\n}\n\nfunction renderItem(item: any) {\n return item;\n}\n\nexport interface AutocompleteProps\n extends CommonProps,\n Pick<DropdownContainerProps, 'menuPos'>,\n Pick<AriaAttributes, 'aria-label'>,\n Override<\n InputProps,\n {\n /** Функция отрисовки элемента меню */\n renderItem?: (item: string) => React.ReactNode;\n /** Промис, резолвящий элементы меню */\n source?: string[] | ((patter: string) => Promise<string[]>);\n /** Отключает использование портала */\n disablePortal?: boolean;\n /** Отрисовка тени у выпадающего меню */\n hasShadow?: boolean;\n /** Выравнивание выпадающего меню */\n menuAlign?: 'left' | 'right';\n /** Максимальная высота меню */\n menuMaxHeight?: number | string;\n /** Ширина меню */\n menuWidth?: number | string;\n /** Отключить скролл окна, когда меню открыто */\n preventWindowScroll?: boolean;\n /** Вызывается при изменении `value` */\n onValueChange: (value: string) => void;\n /** onBlur */\n onBlur?: () => void;\n /** Размер инпута */\n size?: SizeProp;\n /** value */\n value: string;\n /**\n * Текст заголовка выпадающего меню в мобильной версии\n */\n mobileMenuHeaderText?: string;\n }\n > {}\n\nexport interface AutocompleteState {\n items: Nullable<string[]>;\n selected: number;\n focused: boolean;\n isMobileOpened: boolean;\n}\n\nexport const AutocompleteDataTids = {\n root: 'Autocomplete__root',\n menu: 'Autocomplete__menu',\n} as const;\n\nexport const AutocompleteIds = {\n menu: AutocompleteDataTids.menu,\n} as const;\n\ntype DefaultProps = Required<\n Pick<\n AutocompleteProps,\n 'renderItem' | 'size' | 'disablePortal' | 'hasShadow' | 'menuMaxHeight' | 'menuAlign' | 'preventWindowScroll'\n >\n>;\n\n/**\n * Стандартный инпут с подсказками.\n *\n * Все свойства передаются во внутренний *Input*.\n */\n@responsiveLayout\n@rootNode\n@locale('Autocomplete', AutocompleteLocaleHelper)\nexport class Autocomplete extends React.Component<AutocompleteProps, AutocompleteState> {\n public static __KONTUR_REACT_UI__ = 'Autocomplete';\n public static displayName = 'Autocomplete';\n\n public static propTypes = {\n /**\n * Функция для отрисовки элемента в выпадающем списке. Единственный аргумент\n * — *item*.\n */\n renderItem: PropTypes.func,\n\n /**\n * Если передан массив, то совпадения ищутся по этому массиву.\n *\n * Если передается функция, то она должна возвращать thenable, который\n * резолвится уже отфильтрованным массивом. Возвращенный thenable может\n * иметь метод cancel, который будет вызван при отмене поиска (пользователь\n * изменил строку поиска, автокомплит потерял фокус).\n * ```\n * function(pattern) {\n * return service.findAll(pattern);\n * }\n * ```\n */\n source: PropTypes.oneOfType([PropTypes.array, PropTypes.func]),\n };\n\n public static defaultProps: DefaultProps = {\n renderItem,\n size: 'small',\n disablePortal: false,\n hasShadow: true,\n menuMaxHeight: 300,\n menuAlign: 'left',\n preventWindowScroll: true,\n };\n\n public state: AutocompleteState = {\n items: null,\n selected: -1,\n focused: false,\n isMobileOpened: false,\n };\n\n private theme!: Theme;\n private readonly locale!: AutocompleteLocale;\n private isMobileLayout!: boolean;\n private opened = false;\n private input: Nullable<Input> = null;\n private menu: Nullable<Menu>;\n private menuId = AutocompleteIds.menu + getRandomID();\n private rootSpan: Nullable<HTMLSpanElement>;\n private mobilePopup: Nullable<MobilePopup>;\n\n private requestId = 0;\n\n private getProps = createPropsGetter(Autocomplete.defaultProps);\n private setRootNode!: TSetRootNode;\n\n /**\n * @public\n */\n public focus() {\n if (this.input) {\n this.input.focus();\n }\n }\n\n /**\n * @public\n */\n public blur() {\n this.handleBlur();\n }\n\n public componentDidUpdate(prevProps: AutocompleteProps) {\n if (prevProps.value !== this.props.value) {\n this.updateItems(this.props.value || '');\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = getAutocompleteTheme(theme);\n return (\n <ThemeContext.Provider value={this.theme}>\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n {this.renderMain}\n </CommonWrapper>\n </ThemeContext.Provider>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n public renderMain = (props: CommonWrapperRestProps<AutocompleteProps>) => {\n const { focused } = this.state;\n\n const isMobile = this.isMobileLayout;\n\n const {\n onValueChange,\n onKeyDown,\n onFocus,\n onBlur,\n renderItem: _renderItem,\n disablePortal,\n hasShadow,\n menuAlign,\n menuMaxHeight,\n preventWindowScroll,\n source,\n width = this.theme.inputWidth,\n mobileMenuHeaderText,\n 'aria-label': ariaLabel,\n ...rest\n } = props;\n\n const inputProps = {\n ...rest,\n width: '100%',\n onValueChange: this.handleValueChange,\n onKeyDown: this.handleKeyDown,\n onFocus: this.handleFocus,\n ref: this.refInput,\n };\n\n return (\n <RenderLayer onFocusOutside={this.handleBlur} onClickOutside={this.handleClickOutside} active={focused}>\n <span\n data-tid={AutocompleteDataTids.root}\n className={styles.root(this.theme)}\n style={{ width }}\n ref={this.refRootSpan}\n >\n <Input aria-label={ariaLabel} aria-controls={this.menuId} {...inputProps} />\n {isMobile ? this.renderMobileMenu() : this.renderMenu()}\n </span>\n </RenderLayer>\n );\n };\n\n private renderHints(): React.ReactNode {\n const items = this.state.items;\n\n if (!this.props.value) {\n return <MenuMessage>{this.locale.enterValue}</MenuMessage>;\n }\n\n if (items?.length === 0 && this.props.value) {\n return <MenuMessage>{this.locale.notFound}</MenuMessage>;\n }\n\n if (isNullable(items) && this.props.value) {\n return <MenuMessage>{this.locale.updateValue}</MenuMessage>;\n }\n\n return null;\n }\n\n private renderMenu(): React.ReactNode {\n const items = this.state.items;\n const { menuMaxHeight, hasShadow, menuWidth, width, preventWindowScroll, menuAlign, disablePortal, menuPos } =\n this.getProps();\n const menuProps = {\n ref: this.refMenu,\n maxHeight: menuMaxHeight,\n hasShadow,\n width: menuWidth || (width && getDOMRect(this.rootSpan).width),\n preventWindowScroll,\n };\n if (!items || items.length === 0) {\n return null;\n }\n\n return (\n <DropdownContainer\n id={this.menuId}\n data-tid={AutocompleteDataTids.menu}\n getParent={this.getAnchor}\n align={menuAlign}\n disablePortal={disablePortal}\n menuPos={menuPos}\n >\n <Menu {...menuProps}>{this.getItems()}</Menu>\n </DropdownContainer>\n );\n }\n\n private renderMobileMenu = () => {\n const inputProps: InputProps = {\n autoFocus: true,\n width: '100%',\n onValueChange: this.handleValueChange,\n onKeyPress: this.handleKeyPressMobile,\n value: this.props.value,\n placeholder: this.locale.enterValue,\n };\n\n const items = this.state.items;\n\n return (\n <MobilePopup\n id={this.menuId}\n headerChildComponent={<Input {...inputProps} />}\n caption={this.props.mobileMenuHeaderText}\n opened={this.state.isMobileOpened}\n onCloseRequest={this.handleCloseMobile}\n ref={this.refMobilePopup}\n >\n <Menu ref={this.refMenu} onItemClick={this.mobilePopup?.close} disableScrollContainer maxHeight={'auto'}>\n {items && items.length > 0 && this.getItems()}\n {this.renderHints()}\n </Menu>\n </MobilePopup>\n );\n };\n\n private getItems = () => {\n const items = this.state.items;\n const isMobile = this.isMobileLayout;\n\n return items\n ? items.map((item, i) => {\n return (\n <MenuItem onClick={this.handleMenuItemClick(i)} key={i} isMobile={isMobile} size={this.props.size}>\n {this.getProps().renderItem(item)}\n </MenuItem>\n );\n })\n : null;\n };\n\n private handleValueChange = (value: string) => {\n this.opened = true;\n\n this.fireChange(value);\n };\n\n private handleCloseMobile = () => {\n this.setState({\n isMobileOpened: false,\n });\n\n this.handleBlur();\n };\n\n private handleKeyPressMobile = (e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n this.mobilePopup?.close();\n }\n };\n\n private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n if (this.isMobileLayout) {\n this.setState({ isMobileOpened: true });\n }\n\n if (this.state.focused) {\n return;\n }\n\n this.setState({ focused: true });\n\n if (this.props.onFocus) {\n this.props.onFocus(event);\n }\n };\n\n private handleBlur = () => {\n if (!this.state.focused) {\n return;\n }\n\n this.opened = false;\n this.setState({ items: null, focused: false });\n\n if (this.input) {\n this.input.blur();\n }\n\n if (this.props.onBlur) {\n this.props.onBlur();\n }\n };\n\n private handleClickOutside = (e: Event) => {\n fixClickFocusIE(e);\n this.handleBlur();\n };\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (this.props.onKeyDown) {\n this.props.onKeyDown(e);\n }\n switch (true) {\n case isKeyEscape(e):\n e.preventDefault();\n this.setState({ items: null });\n return;\n case isKeyArrowUp(e):\n e.preventDefault();\n if (this.menu) {\n this.menu.up();\n }\n return;\n case isKeyArrowDown(e):\n e.preventDefault();\n if (this.menu) {\n this.menu.down();\n }\n return;\n case isKeyEnter(e):\n e.preventDefault(); // To prevent form submission.\n if (this.menu) {\n this.menu.enter(e);\n }\n return;\n }\n };\n\n private handleMenuItemClick(i: number) {\n return (event: React.SyntheticEvent<HTMLElement>) => this.handleItemClick(event, i);\n }\n\n private getAnchor = () => {\n return getRootNode(this);\n };\n\n private handleItemClick(event: React.SyntheticEvent<HTMLElement> | React.MouseEvent<HTMLElement>, index: number) {\n if ((event as React.MouseEvent<HTMLElement>).button) {\n return;\n }\n\n event.preventDefault();\n this.choose(index);\n }\n\n private choose(index: number) {\n if (!this.state.items) {\n return;\n }\n\n const value = this.state.items[index];\n this.opened = false;\n this.setState({\n selected: -1,\n items: null,\n });\n\n this.fireChange(value);\n this.blur();\n }\n\n private updateItems(value: string) {\n if (!this.opened) {\n return;\n }\n const pattern = value.trim();\n const source = this.props.source;\n\n if (!source) {\n return;\n }\n\n let promise;\n this.requestId += 1;\n const expectingId = this.requestId;\n if (typeof source === 'function') {\n promise = source(pattern);\n } else {\n promise = match(pattern, source);\n }\n promise.then((items) => {\n if (this.opened && expectingId === this.requestId) {\n this.setState({\n items,\n selected: -1,\n });\n }\n });\n }\n\n private fireChange(value: string) {\n if (this.props.onValueChange) {\n this.props.onValueChange(value);\n }\n }\n\n private refInput = (el: Input | null) => {\n this.input = el;\n };\n\n private refMenu = (menu: Menu | null) => {\n this.menu = menu;\n };\n\n private refRootSpan = (span: HTMLSpanElement) => {\n this.rootSpan = span;\n };\n\n private refMobilePopup = (mobilePopup: MobilePopup | null) => {\n this.mobilePopup = mobilePopup;\n };\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["Autocomplete.tsx"],"names":["match","pattern","items","Promise","resolve","lowerCasedPattern","toLowerCase","itemsMatchingPattern","filter","item","includes","renderItem","AutocompleteDataTids","root","menu","AutocompleteIds","Autocomplete","AutocompleteLocaleHelper","responsiveLayout","rootNode","state","selected","focused","isMobileOpened","opened","input","menuId","requestId","getProps","defaultProps","renderMain","props","isMobile","isMobileLayout","onValueChange","onKeyDown","onFocus","onBlur","_renderItem","disablePortal","hasShadow","menuAlign","menuMaxHeight","preventWindowScroll","source","width","theme","inputWidth","mobileMenuHeaderText","ariaLabel","rest","inputProps","autoComplete","handleValueChange","handleKeyDown","handleFocus","ref","refInput","handleBlur","handleClickOutside","styles","refRootSpan","renderMobileMenu","renderMenu","autoFocus","onKeyPress","handleKeyPressMobile","value","placeholder","locale","enterValue","handleCloseMobile","refMobilePopup","refMenu","mobilePopup","close","length","getItems","renderHints","map","i","handleMenuItemClick","size","fireChange","setState","e","key","event","blur","preventDefault","up","down","enter","getAnchor","el","span","rootSpan","focus","componentDidUpdate","prevProps","updateItems","render","setRootNode","notFound","updateValue","menuWidth","menuPos","menuProps","maxHeight","handleItemClick","index","button","choose","trim","promise","expectingId","then","React","Component","__KONTUR_REACT_UI__","displayName","propTypes","PropTypes","func","oneOfType","array"],"mappings":"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","sourcesContent":["// TODO: Enable this rule in functional components.\n/* eslint-disable @typescript-eslint/no-unused-vars */\nimport React, { AriaAttributes, KeyboardEvent } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { MenuMessage } from '../../internal/MenuMessage';\nimport { locale } from '../../lib/locale/decorators';\nimport { getRandomID, isNullable } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isKeyArrowDown, isKeyArrowUp, isKeyEnter, isKeyEscape } from '../../lib/events/keyboard/identifiers';\nimport { Input, InputProps } from '../Input';\nimport { DropdownContainer, DropdownContainerProps } from '../../internal/DropdownContainer';\nimport { Menu } from '../../internal/Menu';\nimport { MenuItem } from '../MenuItem';\nimport { RenderLayer } from '../../internal/RenderLayer';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { Nullable, Override } from '../../typings/utility-types';\nimport { fixClickFocusIE } from '../../lib/events/fixClickFocusIE';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { MobilePopup } from '../../internal/MobilePopup';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\nimport { SizeProp } from '../../lib/types/props';\n\nimport { styles } from './Autocomplete.styles';\nimport { AutocompleteLocale, AutocompleteLocaleHelper } from './locale';\nimport { getAutocompleteTheme } from './getAutocompleteTheme';\n\nfunction match(pattern: string, items: string[]) {\n if (!pattern || !items) {\n return Promise.resolve([]);\n }\n\n const lowerCasedPattern = pattern.toLowerCase();\n const itemsMatchingPattern = items.filter((item) => {\n return item.toLowerCase().includes(lowerCasedPattern);\n });\n\n return Promise.resolve(itemsMatchingPattern);\n}\n\nfunction renderItem(item: any) {\n return item;\n}\n\nexport interface AutocompleteProps\n extends CommonProps,\n Pick<DropdownContainerProps, 'menuPos'>,\n Pick<AriaAttributes, 'aria-label'>,\n Override<\n InputProps,\n {\n /** Функция отрисовки элемента меню */\n renderItem?: (item: string) => React.ReactNode;\n /** Промис, резолвящий элементы меню */\n source?: string[] | ((patter: string) => Promise<string[]>);\n /** Отключает использование портала */\n disablePortal?: boolean;\n /** Отрисовка тени у выпадающего меню */\n hasShadow?: boolean;\n /** Выравнивание выпадающего меню */\n menuAlign?: 'left' | 'right';\n /** Максимальная высота меню */\n menuMaxHeight?: number | string;\n /** Ширина меню */\n menuWidth?: number | string;\n /** Отключить скролл окна, когда меню открыто */\n preventWindowScroll?: boolean;\n /** Вызывается при изменении `value` */\n onValueChange: (value: string) => void;\n /** onBlur */\n onBlur?: () => void;\n /** Размер инпута */\n size?: SizeProp;\n /** value */\n value: string;\n /**\n * Текст заголовка выпадающего меню в мобильной версии\n */\n mobileMenuHeaderText?: string;\n }\n > {}\n\nexport interface AutocompleteState {\n items: Nullable<string[]>;\n selected: number;\n focused: boolean;\n isMobileOpened: boolean;\n}\n\nexport const AutocompleteDataTids = {\n root: 'Autocomplete__root',\n menu: 'Autocomplete__menu',\n} as const;\n\nexport const AutocompleteIds = {\n menu: AutocompleteDataTids.menu,\n} as const;\n\ntype DefaultProps = Required<\n Pick<\n AutocompleteProps,\n 'renderItem' | 'size' | 'disablePortal' | 'hasShadow' | 'menuMaxHeight' | 'menuAlign' | 'preventWindowScroll'\n >\n>;\n\n/**\n * Стандартный инпут с подсказками.\n *\n * Все свойства передаются во внутренний *Input*.\n */\n@responsiveLayout\n@rootNode\n@locale('Autocomplete', AutocompleteLocaleHelper)\nexport class Autocomplete extends React.Component<AutocompleteProps, AutocompleteState> {\n public static __KONTUR_REACT_UI__ = 'Autocomplete';\n public static displayName = 'Autocomplete';\n\n public static propTypes = {\n /**\n * Функция для отрисовки элемента в выпадающем списке. Единственный аргумент\n * — *item*.\n */\n renderItem: PropTypes.func,\n\n /**\n * Если передан массив, то совпадения ищутся по этому массиву.\n *\n * Если передается функция, то она должна возвращать thenable, который\n * резолвится уже отфильтрованным массивом. Возвращенный thenable может\n * иметь метод cancel, который будет вызван при отмене поиска (пользователь\n * изменил строку поиска, автокомплит потерял фокус).\n * ```\n * function(pattern) {\n * return service.findAll(pattern);\n * }\n * ```\n */\n source: PropTypes.oneOfType([PropTypes.array, PropTypes.func]),\n };\n\n public static defaultProps: DefaultProps = {\n renderItem,\n size: 'small',\n disablePortal: false,\n hasShadow: true,\n menuMaxHeight: 300,\n menuAlign: 'left',\n preventWindowScroll: true,\n };\n\n public state: AutocompleteState = {\n items: null,\n selected: -1,\n focused: false,\n isMobileOpened: false,\n };\n\n private theme!: Theme;\n private readonly locale!: AutocompleteLocale;\n private isMobileLayout!: boolean;\n private opened = false;\n private input: Nullable<Input> = null;\n private menu: Nullable<Menu>;\n private menuId = AutocompleteIds.menu + getRandomID();\n private rootSpan: Nullable<HTMLSpanElement>;\n private mobilePopup: Nullable<MobilePopup>;\n\n private requestId = 0;\n\n private getProps = createPropsGetter(Autocomplete.defaultProps);\n private setRootNode!: TSetRootNode;\n\n /**\n * @public\n */\n public focus() {\n if (this.input) {\n this.input.focus();\n }\n }\n\n /**\n * @public\n */\n public blur() {\n this.handleBlur();\n }\n\n public componentDidUpdate(prevProps: AutocompleteProps) {\n if (prevProps.value !== this.props.value) {\n this.updateItems(this.props.value || '');\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = getAutocompleteTheme(theme);\n return (\n <ThemeContext.Provider value={this.theme}>\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n {this.renderMain}\n </CommonWrapper>\n </ThemeContext.Provider>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n public renderMain = (props: CommonWrapperRestProps<AutocompleteProps>) => {\n const { focused } = this.state;\n\n const isMobile = this.isMobileLayout;\n\n const {\n onValueChange,\n onKeyDown,\n onFocus,\n onBlur,\n renderItem: _renderItem,\n disablePortal,\n hasShadow,\n menuAlign,\n menuMaxHeight,\n preventWindowScroll,\n source,\n width = this.theme.inputWidth,\n mobileMenuHeaderText,\n 'aria-label': ariaLabel,\n ...rest\n } = props;\n\n const inputProps = {\n ...rest,\n width: '100%',\n autoComplete: 'off',\n onValueChange: this.handleValueChange,\n onKeyDown: this.handleKeyDown,\n onFocus: this.handleFocus,\n ref: this.refInput,\n };\n\n return (\n <RenderLayer onFocusOutside={this.handleBlur} onClickOutside={this.handleClickOutside} active={focused}>\n <span\n data-tid={AutocompleteDataTids.root}\n className={styles.root(this.theme)}\n style={{ width }}\n ref={this.refRootSpan}\n >\n <Input aria-label={ariaLabel} aria-controls={this.menuId} {...inputProps} />\n {isMobile ? this.renderMobileMenu() : this.renderMenu()}\n </span>\n </RenderLayer>\n );\n };\n\n private renderHints(): React.ReactNode {\n const items = this.state.items;\n\n if (!this.props.value) {\n return <MenuMessage>{this.locale.enterValue}</MenuMessage>;\n }\n\n if (items?.length === 0 && this.props.value) {\n return <MenuMessage>{this.locale.notFound}</MenuMessage>;\n }\n\n if (isNullable(items) && this.props.value) {\n return <MenuMessage>{this.locale.updateValue}</MenuMessage>;\n }\n\n return null;\n }\n\n private renderMenu(): React.ReactNode {\n const items = this.state.items;\n const { menuMaxHeight, hasShadow, menuWidth, width, preventWindowScroll, menuAlign, disablePortal, menuPos } =\n this.getProps();\n const menuProps = {\n ref: this.refMenu,\n maxHeight: menuMaxHeight,\n hasShadow,\n width: menuWidth || (width && getDOMRect(this.rootSpan).width),\n preventWindowScroll,\n };\n if (!items || items.length === 0) {\n return null;\n }\n\n return (\n <DropdownContainer\n id={this.menuId}\n data-tid={AutocompleteDataTids.menu}\n getParent={this.getAnchor}\n align={menuAlign}\n disablePortal={disablePortal}\n menuPos={menuPos}\n >\n <Menu {...menuProps}>{this.getItems()}</Menu>\n </DropdownContainer>\n );\n }\n\n private renderMobileMenu = () => {\n const inputProps: InputProps = {\n autoComplete: 'off',\n autoFocus: true,\n width: '100%',\n onValueChange: this.handleValueChange,\n onKeyPress: this.handleKeyPressMobile,\n value: this.props.value,\n placeholder: this.locale.enterValue,\n };\n\n const items = this.state.items;\n\n return (\n <MobilePopup\n id={this.menuId}\n headerChildComponent={<Input {...inputProps} />}\n caption={this.props.mobileMenuHeaderText}\n opened={this.state.isMobileOpened}\n onCloseRequest={this.handleCloseMobile}\n ref={this.refMobilePopup}\n >\n <Menu ref={this.refMenu} onItemClick={this.mobilePopup?.close} disableScrollContainer maxHeight={'auto'}>\n {items && items.length > 0 && this.getItems()}\n {this.renderHints()}\n </Menu>\n </MobilePopup>\n );\n };\n\n private getItems = () => {\n const items = this.state.items;\n const isMobile = this.isMobileLayout;\n\n return items\n ? items.map((item, i) => {\n return (\n <MenuItem onClick={this.handleMenuItemClick(i)} key={i} isMobile={isMobile} size={this.props.size}>\n {this.getProps().renderItem(item)}\n </MenuItem>\n );\n })\n : null;\n };\n\n private handleValueChange = (value: string) => {\n this.opened = true;\n\n this.fireChange(value);\n };\n\n private handleCloseMobile = () => {\n this.setState({\n isMobileOpened: false,\n });\n\n this.handleBlur();\n };\n\n private handleKeyPressMobile = (e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n this.mobilePopup?.close();\n }\n };\n\n private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n if (this.isMobileLayout) {\n this.setState({ isMobileOpened: true });\n }\n\n if (this.state.focused) {\n return;\n }\n\n this.setState({ focused: true });\n\n if (this.props.onFocus) {\n this.props.onFocus(event);\n }\n };\n\n private handleBlur = () => {\n if (!this.state.focused) {\n return;\n }\n\n this.opened = false;\n this.setState({ items: null, focused: false });\n\n if (this.input) {\n this.input.blur();\n }\n\n if (this.props.onBlur) {\n this.props.onBlur();\n }\n };\n\n private handleClickOutside = (e: Event) => {\n fixClickFocusIE(e);\n this.handleBlur();\n };\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (this.props.onKeyDown) {\n this.props.onKeyDown(e);\n }\n switch (true) {\n case isKeyEscape(e):\n e.preventDefault();\n this.setState({ items: null });\n return;\n case isKeyArrowUp(e):\n e.preventDefault();\n if (this.menu) {\n this.menu.up();\n }\n return;\n case isKeyArrowDown(e):\n e.preventDefault();\n if (this.menu) {\n this.menu.down();\n }\n return;\n case isKeyEnter(e):\n e.preventDefault(); // To prevent form submission.\n if (this.menu) {\n this.menu.enter(e);\n }\n return;\n }\n };\n\n private handleMenuItemClick(i: number) {\n return (event: React.SyntheticEvent<HTMLElement>) => this.handleItemClick(event, i);\n }\n\n private getAnchor = () => {\n return getRootNode(this);\n };\n\n private handleItemClick(event: React.SyntheticEvent<HTMLElement> | React.MouseEvent<HTMLElement>, index: number) {\n if ((event as React.MouseEvent<HTMLElement>).button) {\n return;\n }\n\n event.preventDefault();\n this.choose(index);\n }\n\n private choose(index: number) {\n if (!this.state.items) {\n return;\n }\n\n const value = this.state.items[index];\n this.opened = false;\n this.setState({\n selected: -1,\n items: null,\n });\n\n this.fireChange(value);\n this.blur();\n }\n\n private updateItems(value: string) {\n if (!this.opened) {\n return;\n }\n const pattern = value.trim();\n const source = this.props.source;\n\n if (!source) {\n return;\n }\n\n let promise;\n this.requestId += 1;\n const expectingId = this.requestId;\n if (typeof source === 'function') {\n promise = source(pattern);\n } else {\n promise = match(pattern, source);\n }\n promise.then((items) => {\n if (this.opened && expectingId === this.requestId) {\n this.setState({\n items,\n selected: -1,\n });\n }\n });\n }\n\n private fireChange(value: string) {\n if (this.props.onValueChange) {\n this.props.onValueChange(value);\n }\n }\n\n private refInput = (el: Input | null) => {\n this.input = el;\n };\n\n private refMenu = (menu: Menu | null) => {\n this.menu = menu;\n };\n\n private refRootSpan = (span: HTMLSpanElement) => {\n this.rootSpan = span;\n };\n\n private refMobilePopup = (mobilePopup: MobilePopup | null) => {\n this.mobilePopup = mobilePopup;\n };\n}\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { PopupPositionsType } from '../../internal/Popup';
|
|
2
|
+
import { PopupPositionsType, ShortPopupPositionsType } from '../../internal/Popup';
|
|
3
3
|
import { Nullable } from '../../typings/utility-types';
|
|
4
4
|
import { MouseEventType } from '../../typings/event-types';
|
|
5
5
|
import { CommonProps } from '../../internal/CommonWrapper';
|
|
@@ -35,7 +35,7 @@ export interface HintProps extends CommonProps {
|
|
|
35
35
|
*
|
|
36
36
|
* **Допустимые значения**: `"top"`, `"right"`, `"bottom"`, `"left"`, `"top left"`, `"top center"`, `"top right"`, `"right top"`, `"right middle"`, `"right bottom"`, `"bottom left"`, `"bottom center"`, `"bottom right"`, `"left top"`, `"left middle"`, `"left bottom"`.
|
|
37
37
|
*/
|
|
38
|
-
pos?:
|
|
38
|
+
pos?: ShortPopupPositionsType | PopupPositionsType;
|
|
39
39
|
/**
|
|
40
40
|
* Текст подсказки.
|
|
41
41
|
*/
|
|
@@ -61,7 +61,7 @@ export interface HintState {
|
|
|
61
61
|
opened: boolean;
|
|
62
62
|
position: PopupPositionsType;
|
|
63
63
|
}
|
|
64
|
-
declare type DefaultProps = Required<Pick<HintProps, '
|
|
64
|
+
declare type DefaultProps = Required<Pick<HintProps, 'manual' | 'opened' | 'maxWidth' | 'disableAnimations' | 'useWrapper'>>;
|
|
65
65
|
/**
|
|
66
66
|
* Всплывающая подсказка, которая по умолчанию отображается при наведении на элемент. <br/> Можно задать другие условия отображения.
|
|
67
67
|
*/
|
|
@@ -77,6 +77,7 @@ export declare class Hint extends React.PureComponent<HintProps, HintState> impl
|
|
|
77
77
|
private setRootNode;
|
|
78
78
|
private positions;
|
|
79
79
|
private popupRef;
|
|
80
|
+
getAllowedPositions(): ("top center" | "top left" | "top right" | "bottom center" | "bottom left" | "bottom right" | "left middle" | "left top" | "left bottom" | "right middle" | "right top" | "right bottom")[];
|
|
80
81
|
componentDidUpdate(prevProps: HintProps): void;
|
|
81
82
|
componentWillUnmount(): void;
|
|
82
83
|
render(): JSX.Element;
|
|
@@ -84,7 +84,7 @@ var HINT_BORDER_COLOR = 'transparent';
|
|
|
84
84
|
|
|
85
85
|
|
|
86
86
|
|
|
87
|
-
var
|
|
87
|
+
var OldPositions = [
|
|
88
88
|
'top center',
|
|
89
89
|
'top left',
|
|
90
90
|
'top right',
|
|
@@ -101,8 +101,6 @@ var Positions = [
|
|
|
101
101
|
|
|
102
102
|
|
|
103
103
|
|
|
104
|
-
|
|
105
|
-
|
|
106
104
|
/**
|
|
107
105
|
* Всплывающая подсказка, которая по умолчанию отображается при наведении на элемент. <br/> Можно задать другие условия отображения.
|
|
108
106
|
*/var
|
|
@@ -119,8 +117,6 @@ Hint = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function
|
|
|
119
117
|
|
|
120
118
|
|
|
121
119
|
|
|
122
|
-
|
|
123
|
-
|
|
124
120
|
getProps = (0, _createPropsGetter.createPropsGetter)(Hint.defaultProps);_this.
|
|
125
121
|
|
|
126
122
|
state = {
|
|
@@ -229,6 +225,7 @@ Hint = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function
|
|
|
229
225
|
|
|
230
226
|
|
|
231
227
|
|
|
228
|
+
|
|
232
229
|
|
|
233
230
|
|
|
234
231
|
getAnchorElement = function () {var _this$popupRef$curren;
|
|
@@ -254,9 +251,13 @@ Hint = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function
|
|
|
254
251
|
|
|
255
252
|
|
|
256
253
|
getPositions = function () {
|
|
254
|
+
if (_this.featureFlags.popupUnifyPositioning) {
|
|
255
|
+
return _this.props.allowedPositions;
|
|
256
|
+
}
|
|
257
|
+
var pos = _this.props.pos ? _this.props.pos : 'top';
|
|
258
|
+
var allowedPositions = _this.getAllowedPositions();
|
|
257
259
|
if (_this.featureFlags.hintAddDynamicPositioning) {
|
|
258
260
|
if (!_this.positions) {
|
|
259
|
-
var _this$getProps = _this.getProps(),allowedPositions = _this$getProps.allowedPositions,pos = _this$getProps.pos;
|
|
260
261
|
var priorityPosition;
|
|
261
262
|
switch (pos) {
|
|
262
263
|
case 'top':
|
|
@@ -282,7 +283,7 @@ Hint = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function
|
|
|
282
283
|
}
|
|
283
284
|
return _this.positions;
|
|
284
285
|
}
|
|
285
|
-
return
|
|
286
|
+
return OldPositions.filter(function (x) {return x.startsWith(pos);});
|
|
286
287
|
};_this.
|
|
287
288
|
|
|
288
289
|
handleMouseEnter = function (e) {
|
|
@@ -309,4 +310,4 @@ Hint = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function
|
|
|
309
310
|
|
|
310
311
|
open = function () {
|
|
311
312
|
_this.setState({ opened: true });
|
|
312
|
-
};return _this;}var _proto = Hint.prototype;_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var _this$
|
|
313
|
+
};return _this;}var _proto = Hint.prototype;_proto.getAllowedPositions = function getAllowedPositions() {return this.props.allowedPositions ? this.props.allowedPositions : OldPositions;};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var _this$getProps = this.getProps(),opened = _this$getProps.opened,manual = _this$getProps.manual;if (!manual) {return;}if (this.timer) {_globalObject.globalObject.clearTimeout(this.timer);this.timer = null;}if (opened !== prevProps.opened) {this.setState({ opened: !!opened });}if (this.featureFlags.hintAddDynamicPositioning && !this.featureFlags.popupUnifyPositioning) {var pos = this.props.pos ? this.props.pos : 'top';var allowedPositions = this.props.allowedPositions ? this.props.allowedPositions : OldPositions;var posChanged = prevProps.pos !== pos;var allowedChanged = !(0, _lodash.default)(prevProps.allowedPositions, allowedPositions);if (posChanged || allowedChanged) {this.positions = null;}}};_proto.componentWillUnmount = function componentWillUnmount() {if (this.timer) {_globalObject.globalObject.clearTimeout(this.timer);this.timer = null;}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_featureFlagsContext.ReactUIFeatureFlagsContext.Consumer, null, function (flags) {_this2.featureFlags = (0, _featureFlagsContext.getFullReactUIFlagsContext)(flags);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _ThemeFactory.ThemeFactory.create({ popupPinOffset: theme.hintPinOffset, popupMargin: theme.hintMargin, popupBorder: theme.hintBorder, popupBorderRadius: theme.hintBorderRadius }, _this2.theme) }, _this2.renderMain());});});};_proto.renderMain = function renderMain() {var _this3 = this;var _this$getProps2 = this.getProps(),disableAnimations = _this$getProps2.disableAnimations,useWrapper = _this$getProps2.useWrapper;var hasPin = !this.featureFlags.kebabHintRemovePin || !(0, _ThemeHelpers.isTheme2022)(this.theme);return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_Popup.Popup, { hasPin: hasPin, opened: this.state.opened, anchorElement: this.props.children, positions: this.getPositions(), pos: this.props.pos, backgroundColor: this.theme.hintBgColor, borderColor: HINT_BORDER_COLOR, onPositionChange: function onPositionChange(position) {return _this3.setState({ position: position });}, disableAnimations: disableAnimations, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, useWrapper: useWrapper, ref: this.popupRef, withoutMobile: true }, this.renderContent()));};_proto.renderContent = function renderContent() {var _cx;if (!this.props.text) {return null;}var _this$getProps3 = this.getProps(),maxWidth = _this$getProps3.maxWidth;var centerAlignPositions = ['top', 'top center', 'bottom', 'bottom center'];var className = (0, _Emotion.cx)((_cx = {}, _cx[_Hint.styles.content(this.theme)] = true, _cx[_Hint.styles.contentCenter(this.theme)] = centerAlignPositions.includes(this.state.position), _cx));return /*#__PURE__*/_react.default.createElement("div", { className: className, style: { maxWidth: maxWidth } }, this.props.text);};return Hint;}(_react.default.PureComponent), _class2.__KONTUR_REACT_UI__ = 'Hint', _class2.displayName = 'Hint', _class2.defaultProps = { manual: false, opened: false, maxWidth: 200, disableAnimations: _currentEnvironment.isTestEnv, useWrapper: false }, _temp)) || _class;exports.Hint = Hint;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Hint.tsx"],"names":["HINT_BORDER_COLOR","Positions","Hint","rootNode","getProps","defaultProps","state","opened","manual","position","DUMMY_LOCATION","positions","popupRef","React","createRef","getAnchorElement","current","anchorElement","getPositions","featureFlags","hintAddDynamicPositioning","allowedPositions","pos","priorityPosition","index","indexOf","Error","join","slice","filter","x","startsWith","handleMouseEnter","e","timer","globalObject","setTimeout","open","props","onMouseEnter","handleMouseLeave","clearTimeout","setState","onMouseLeave","componentDidUpdate","prevProps","posChanged","allowedChanged","componentWillUnmount","render","flags","theme","ThemeFactory","create","popupPinOffset","hintPinOffset","popupMargin","hintMargin","popupBorder","hintBorder","popupBorderRadius","hintBorderRadius","renderMain","disableAnimations","useWrapper","hasPin","kebabHintRemovePin","setRootNode","children","hintBgColor","renderContent","text","maxWidth","centerAlignPositions","className","styles","content","contentCenter","includes","PureComponent","__KONTUR_REACT_UI__","displayName","isTestEnv"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { globalObject, SafeTimer } from '@skbkontur/global-object';\nimport isEqual from 'lodash.isequal';\n\nimport {\n ReactUIFeatureFlags,\n ReactUIFeatureFlagsContext,\n getFullReactUIFlagsContext,\n} from '../../lib/featureFlagsContext';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { Theme } from '../../lib/theming/Theme';\nimport { DUMMY_LOCATION, Popup, PopupPositionsType } from '../../internal/Popup';\nimport { Nullable } from '../../typings/utility-types';\nimport { MouseEventType } from '../../typings/event-types';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { InstanceWithAnchorElement } from '../../lib/InstanceWithAnchorElement';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\n\nimport { styles } from './Hint.styles';\n\nconst HINT_BORDER_COLOR = 'transparent';\n\nexport interface HintProps extends CommonProps {\n children?: React.ReactNode;\n /**\n * Переводит отображение подсказки в _\"ручной режим\"_.\n *\n * В _\"ручном режиме\"_ подсказку можно активировать только задав значение пропу `opened`.\n */\n manual?: boolean;\n /**\n * Задаёт максимальную ширину подсказки.\n */\n maxWidth?: React.CSSProperties['maxWidth'];\n /**\n * HTML-событие `mouseenter`.\n */\n onMouseEnter?: (event: MouseEventType) => void;\n /**\n * HTML-событие `mouseleave`.\n */\n onMouseLeave?: (event: MouseEventType) => void;\n /**\n * Если `true` - подсказка будет открыта.\n *\n * _Примечание_: работает только при `manual=true`.\n */\n opened?: boolean;\n /**\n * Расположение подсказки относительно текста.\n *\n * **Допустимые значения**: `\"top\"`, `\"right\"`, `\"bottom\"`, `\"left\"`, `\"top left\"`, `\"top center\"`, `\"top right\"`, `\"right top\"`, `\"right middle\"`, `\"right bottom\"`, `\"bottom left\"`, `\"bottom center\"`, `\"bottom right\"`, `\"left top\"`, `\"left middle\"`, `\"left bottom\"`.\n */\n pos?: 'top' | 'right' | 'bottom' | 'left' | PopupPositionsType;\n /**\n * Текст подсказки.\n */\n text: React.ReactNode;\n /**\n * Список позиций, которые хинт будет занимать. Если положение хинт в определенной позиции будет выходить\n * за край экрана, то будет выбрана следующая позиция. Обязательно должен включать позицию указанную в `pos`.\n * Для применения этого пропа необходимо включить фиче-флаг hintAddDynamicPositioning.\n */\n allowedPositions?: PopupPositionsType[];\n /**\n * Отключает анимацию.\n */\n disableAnimations?: boolean;\n /**\n * Явно указывает, что вложенные элементы должны быть обёрнуты в `<span/>`. <br/> Используется для корректного позиционирования хинта при двух и более вложенных элементах.\n *\n * _Примечание_: при **двух и более** вложенных элементах обёртка будет добавлена автоматически.\n */\n useWrapper?: boolean;\n}\n\nexport interface HintState {\n opened: boolean;\n position: PopupPositionsType;\n}\n\nconst Positions: PopupPositionsType[] = [\n 'top center',\n 'top left',\n 'top right',\n 'bottom center',\n 'bottom left',\n 'bottom right',\n 'left middle',\n 'left top',\n 'left bottom',\n 'right middle',\n 'right top',\n 'right bottom',\n];\n\ntype DefaultProps = Required<\n Pick<HintProps, 'pos' | 'allowedPositions' | 'manual' | 'opened' | 'maxWidth' | 'disableAnimations' | 'useWrapper'>\n>;\n\n/**\n * Всплывающая подсказка, которая по умолчанию отображается при наведении на элемент. <br/> Можно задать другие условия отображения.\n */\n@rootNode\nexport class Hint extends React.PureComponent<HintProps, HintState> implements InstanceWithAnchorElement {\n public static __KONTUR_REACT_UI__ = 'Hint';\n public static displayName = 'Hint';\n\n public static defaultProps: DefaultProps = {\n pos: 'top',\n manual: false,\n opened: false,\n maxWidth: 200,\n allowedPositions: Positions,\n disableAnimations: isTestEnv,\n useWrapper: false,\n };\n\n private getProps = createPropsGetter(Hint.defaultProps);\n\n public state: HintState = {\n opened: this.getProps().manual ? !!this.getProps().opened : false,\n position: DUMMY_LOCATION.position,\n };\n\n private timer: SafeTimer;\n private theme!: Theme;\n private featureFlags!: ReactUIFeatureFlags;\n private setRootNode!: TSetRootNode;\n private positions: Nullable<PopupPositionsType[]> = null;\n\n private popupRef = React.createRef<Popup>();\n\n public componentDidUpdate(prevProps: HintProps) {\n const { opened, manual, pos, allowedPositions } = this.getProps();\n if (!manual) {\n return;\n }\n if (this.timer) {\n globalObject.clearTimeout(this.timer);\n this.timer = null;\n }\n if (opened !== prevProps.opened) {\n this.setState({ opened: !!opened });\n }\n\n if (this.featureFlags.hintAddDynamicPositioning) {\n const posChanged = prevProps.pos !== pos;\n const allowedChanged = !isEqual(prevProps.allowedPositions, allowedPositions);\n\n if (posChanged || allowedChanged) {\n this.positions = null;\n }\n }\n }\n\n public componentWillUnmount() {\n if (this.timer) {\n globalObject.clearTimeout(this.timer);\n this.timer = null;\n }\n }\n\n public render() {\n return (\n <ReactUIFeatureFlagsContext.Consumer>\n {(flags) => {\n this.featureFlags = getFullReactUIFlagsContext(flags);\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <ThemeContext.Provider\n value={ThemeFactory.create(\n {\n popupPinOffset: theme.hintPinOffset,\n popupMargin: theme.hintMargin,\n popupBorder: theme.hintBorder,\n popupBorderRadius: theme.hintBorderRadius,\n },\n this.theme,\n )}\n >\n {this.renderMain()}\n </ThemeContext.Provider>\n );\n }}\n </ThemeContext.Consumer>\n );\n }}\n </ReactUIFeatureFlagsContext.Consumer>\n );\n }\n\n public renderMain() {\n const { disableAnimations, useWrapper } = this.getProps();\n\n return (\n <ReactUIFeatureFlagsContext.Consumer>\n {(flags) => {\n const hasPin = !getFullReactUIFlagsContext(flags).kebabHintRemovePin || !isTheme2022(this.theme);\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <Popup\n hasPin={hasPin}\n opened={this.state.opened}\n anchorElement={this.props.children}\n positions={this.getPositions()}\n backgroundColor={this.theme.hintBgColor}\n borderColor={HINT_BORDER_COLOR}\n onPositionChange={(position) => this.setState({ position })}\n disableAnimations={disableAnimations}\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n useWrapper={useWrapper}\n ref={this.popupRef}\n withoutMobile\n >\n {this.renderContent()}\n </Popup>\n </CommonWrapper>\n );\n }}\n </ReactUIFeatureFlagsContext.Consumer>\n );\n }\n\n public getAnchorElement = (): Nullable<Element> => {\n return this.popupRef.current?.anchorElement;\n };\n\n private renderContent() {\n if (!this.props.text) {\n return null;\n }\n\n const { maxWidth } = this.getProps();\n const centerAlignPositions = ['top', 'top center', 'bottom', 'bottom center'];\n const className = cx({\n [styles.content(this.theme)]: true,\n [styles.contentCenter(this.theme)]: centerAlignPositions.includes(this.state.position),\n });\n return (\n <div className={className} style={{ maxWidth }}>\n {this.props.text}\n </div>\n );\n }\n\n private getPositions = (): PopupPositionsType[] => {\n if (this.featureFlags.hintAddDynamicPositioning) {\n if (!this.positions) {\n const { allowedPositions, pos } = this.getProps();\n let priorityPosition: PopupPositionsType;\n switch (pos) {\n case 'top':\n priorityPosition = 'top center';\n break;\n case 'bottom':\n priorityPosition = 'bottom center';\n break;\n case 'left':\n priorityPosition = 'left middle';\n break;\n case 'right':\n priorityPosition = 'right middle';\n break;\n default:\n priorityPosition = pos;\n }\n const index = allowedPositions.indexOf(priorityPosition);\n if (index === -1) {\n throw new Error('Unexpected position passed to Hint. Expected one of: ' + allowedPositions.join(', '));\n }\n this.positions = [...allowedPositions.slice(index), ...allowedPositions.slice(0, index)];\n }\n return this.positions;\n }\n return Positions.filter((x) => x.startsWith(this.getProps().pos));\n };\n\n private handleMouseEnter = (e: MouseEventType) => {\n if (!this.getProps().manual && !this.timer) {\n this.timer = globalObject.setTimeout(this.open, 400);\n }\n\n if (this.props.onMouseEnter) {\n this.props.onMouseEnter(e);\n }\n };\n\n private handleMouseLeave = (e: MouseEventType) => {\n if (!this.getProps().manual && this.timer) {\n globalObject.clearTimeout(this.timer);\n this.timer = null;\n this.setState({ opened: false });\n }\n\n if (this.props.onMouseLeave) {\n this.props.onMouseLeave(e);\n }\n };\n\n private open = () => {\n this.setState({ opened: true });\n };\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["Hint.tsx"],"names":["HINT_BORDER_COLOR","OldPositions","Hint","rootNode","getProps","defaultProps","state","opened","manual","position","DUMMY_LOCATION","positions","popupRef","React","createRef","getAnchorElement","current","anchorElement","getPositions","featureFlags","popupUnifyPositioning","props","allowedPositions","pos","getAllowedPositions","hintAddDynamicPositioning","priorityPosition","index","indexOf","Error","join","slice","filter","x","startsWith","handleMouseEnter","e","timer","globalObject","setTimeout","open","onMouseEnter","handleMouseLeave","clearTimeout","setState","onMouseLeave","componentDidUpdate","prevProps","posChanged","allowedChanged","componentWillUnmount","render","flags","theme","ThemeFactory","create","popupPinOffset","hintPinOffset","popupMargin","hintMargin","popupBorder","hintBorder","popupBorderRadius","hintBorderRadius","renderMain","disableAnimations","useWrapper","hasPin","kebabHintRemovePin","setRootNode","children","hintBgColor","renderContent","text","maxWidth","centerAlignPositions","className","styles","content","contentCenter","includes","PureComponent","__KONTUR_REACT_UI__","displayName","isTestEnv"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { globalObject, SafeTimer } from '@skbkontur/global-object';\nimport isEqual from 'lodash.isequal';\n\nimport {\n ReactUIFeatureFlags,\n ReactUIFeatureFlagsContext,\n getFullReactUIFlagsContext,\n} from '../../lib/featureFlagsContext';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { Theme } from '../../lib/theming/Theme';\nimport { DUMMY_LOCATION, Popup, PopupPositionsType, ShortPopupPositionsType } from '../../internal/Popup';\nimport { Nullable } from '../../typings/utility-types';\nimport { MouseEventType } from '../../typings/event-types';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { InstanceWithAnchorElement } from '../../lib/InstanceWithAnchorElement';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\n\nimport { styles } from './Hint.styles';\n\nconst HINT_BORDER_COLOR = 'transparent';\n\nexport interface HintProps extends CommonProps {\n children?: React.ReactNode;\n /**\n * Переводит отображение подсказки в _\"ручной режим\"_.\n *\n * В _\"ручном режиме\"_ подсказку можно активировать только задав значение пропу `opened`.\n */\n manual?: boolean;\n /**\n * Задаёт максимальную ширину подсказки.\n */\n maxWidth?: React.CSSProperties['maxWidth'];\n /**\n * HTML-событие `mouseenter`.\n */\n onMouseEnter?: (event: MouseEventType) => void;\n /**\n * HTML-событие `mouseleave`.\n */\n onMouseLeave?: (event: MouseEventType) => void;\n /**\n * Если `true` - подсказка будет открыта.\n *\n * _Примечание_: работает только при `manual=true`.\n */\n opened?: boolean;\n /**\n * Расположение подсказки относительно текста.\n *\n * **Допустимые значения**: `\"top\"`, `\"right\"`, `\"bottom\"`, `\"left\"`, `\"top left\"`, `\"top center\"`, `\"top right\"`, `\"right top\"`, `\"right middle\"`, `\"right bottom\"`, `\"bottom left\"`, `\"bottom center\"`, `\"bottom right\"`, `\"left top\"`, `\"left middle\"`, `\"left bottom\"`.\n */\n pos?: ShortPopupPositionsType | PopupPositionsType;\n /**\n * Текст подсказки.\n */\n text: React.ReactNode;\n /**\n * Список позиций, которые хинт будет занимать. Если положение хинт в определенной позиции будет выходить\n * за край экрана, то будет выбрана следующая позиция. Обязательно должен включать позицию указанную в `pos`.\n * Для применения этого пропа необходимо включить фиче-флаг hintAddDynamicPositioning.\n */\n allowedPositions?: PopupPositionsType[];\n /**\n * Отключает анимацию.\n */\n disableAnimations?: boolean;\n /**\n * Явно указывает, что вложенные элементы должны быть обёрнуты в `<span/>`. <br/> Используется для корректного позиционирования хинта при двух и более вложенных элементах.\n *\n * _Примечание_: при **двух и более** вложенных элементах обёртка будет добавлена автоматически.\n */\n useWrapper?: boolean;\n}\n\nexport interface HintState {\n opened: boolean;\n position: PopupPositionsType;\n}\n\nconst OldPositions: PopupPositionsType[] = [\n 'top center',\n 'top left',\n 'top right',\n 'bottom center',\n 'bottom left',\n 'bottom right',\n 'left middle',\n 'left top',\n 'left bottom',\n 'right middle',\n 'right top',\n 'right bottom',\n];\n\ntype DefaultProps = Required<Pick<HintProps, 'manual' | 'opened' | 'maxWidth' | 'disableAnimations' | 'useWrapper'>>;\n\n/**\n * Всплывающая подсказка, которая по умолчанию отображается при наведении на элемент. <br/> Можно задать другие условия отображения.\n */\n@rootNode\nexport class Hint extends React.PureComponent<HintProps, HintState> implements InstanceWithAnchorElement {\n public static __KONTUR_REACT_UI__ = 'Hint';\n public static displayName = 'Hint';\n\n public static defaultProps: DefaultProps = {\n manual: false,\n opened: false,\n maxWidth: 200,\n disableAnimations: isTestEnv,\n useWrapper: false,\n };\n\n private getProps = createPropsGetter(Hint.defaultProps);\n\n public state: HintState = {\n opened: this.getProps().manual ? !!this.getProps().opened : false,\n position: DUMMY_LOCATION.position,\n };\n\n private timer: SafeTimer;\n private theme!: Theme;\n private featureFlags!: ReactUIFeatureFlags;\n private setRootNode!: TSetRootNode;\n private positions: Nullable<PopupPositionsType[]> = null;\n\n private popupRef = React.createRef<Popup>();\n\n public getAllowedPositions() {\n return this.props.allowedPositions ? this.props.allowedPositions : OldPositions;\n }\n\n public componentDidUpdate(prevProps: HintProps) {\n const { opened, manual } = this.getProps();\n if (!manual) {\n return;\n }\n if (this.timer) {\n globalObject.clearTimeout(this.timer);\n this.timer = null;\n }\n if (opened !== prevProps.opened) {\n this.setState({ opened: !!opened });\n }\n\n if (this.featureFlags.hintAddDynamicPositioning && !this.featureFlags.popupUnifyPositioning) {\n const pos = this.props.pos ? this.props.pos : 'top';\n const allowedPositions = this.props.allowedPositions ? this.props.allowedPositions : OldPositions;\n const posChanged = prevProps.pos !== pos;\n const allowedChanged = !isEqual(prevProps.allowedPositions, allowedPositions);\n\n if (posChanged || allowedChanged) {\n this.positions = null;\n }\n }\n }\n\n public componentWillUnmount() {\n if (this.timer) {\n globalObject.clearTimeout(this.timer);\n this.timer = null;\n }\n }\n\n public render() {\n return (\n <ReactUIFeatureFlagsContext.Consumer>\n {(flags) => {\n this.featureFlags = getFullReactUIFlagsContext(flags);\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <ThemeContext.Provider\n value={ThemeFactory.create(\n {\n popupPinOffset: theme.hintPinOffset,\n popupMargin: theme.hintMargin,\n popupBorder: theme.hintBorder,\n popupBorderRadius: theme.hintBorderRadius,\n },\n this.theme,\n )}\n >\n {this.renderMain()}\n </ThemeContext.Provider>\n );\n }}\n </ThemeContext.Consumer>\n );\n }}\n </ReactUIFeatureFlagsContext.Consumer>\n );\n }\n\n public renderMain() {\n const { disableAnimations, useWrapper } = this.getProps();\n const hasPin = !this.featureFlags.kebabHintRemovePin || !isTheme2022(this.theme);\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <Popup\n hasPin={hasPin}\n opened={this.state.opened}\n anchorElement={this.props.children}\n positions={this.getPositions()}\n pos={this.props.pos}\n backgroundColor={this.theme.hintBgColor}\n borderColor={HINT_BORDER_COLOR}\n onPositionChange={(position) => this.setState({ position })}\n disableAnimations={disableAnimations}\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n useWrapper={useWrapper}\n ref={this.popupRef}\n withoutMobile\n >\n {this.renderContent()}\n </Popup>\n </CommonWrapper>\n );\n }\n\n public getAnchorElement = (): Nullable<Element> => {\n return this.popupRef.current?.anchorElement;\n };\n\n private renderContent() {\n if (!this.props.text) {\n return null;\n }\n\n const { maxWidth } = this.getProps();\n const centerAlignPositions = ['top', 'top center', 'bottom', 'bottom center'];\n const className = cx({\n [styles.content(this.theme)]: true,\n [styles.contentCenter(this.theme)]: centerAlignPositions.includes(this.state.position),\n });\n return (\n <div className={className} style={{ maxWidth }}>\n {this.props.text}\n </div>\n );\n }\n\n private getPositions = (): PopupPositionsType[] | undefined => {\n if (this.featureFlags.popupUnifyPositioning) {\n return this.props.allowedPositions;\n }\n const pos = this.props.pos ? this.props.pos : 'top';\n const allowedPositions = this.getAllowedPositions();\n if (this.featureFlags.hintAddDynamicPositioning) {\n if (!this.positions) {\n let priorityPosition: PopupPositionsType;\n switch (pos) {\n case 'top':\n priorityPosition = 'top center';\n break;\n case 'bottom':\n priorityPosition = 'bottom center';\n break;\n case 'left':\n priorityPosition = 'left middle';\n break;\n case 'right':\n priorityPosition = 'right middle';\n break;\n default:\n priorityPosition = pos;\n }\n const index = allowedPositions.indexOf(priorityPosition);\n if (index === -1) {\n throw new Error('Unexpected position passed to Hint. Expected one of: ' + allowedPositions.join(', '));\n }\n this.positions = [...allowedPositions.slice(index), ...allowedPositions.slice(0, index)];\n }\n return this.positions;\n }\n return OldPositions.filter((x) => x.startsWith(pos));\n };\n\n private handleMouseEnter = (e: MouseEventType) => {\n if (!this.getProps().manual && !this.timer) {\n this.timer = globalObject.setTimeout(this.open, 400);\n }\n\n if (this.props.onMouseEnter) {\n this.props.onMouseEnter(e);\n }\n };\n\n private handleMouseLeave = (e: MouseEventType) => {\n if (!this.getProps().manual && this.timer) {\n globalObject.clearTimeout(this.timer);\n this.timer = null;\n this.setState({ opened: false });\n }\n\n if (this.props.onMouseLeave) {\n this.props.onMouseLeave(e);\n }\n };\n\n private open = () => {\n this.setState({ opened: true });\n };\n}\n"]}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { PopupPositionsType } from '../../internal/Popup';
|
|
2
|
+
import { PopupPositionsType, ShortPopupPositionsType } from '../../internal/Popup';
|
|
3
3
|
import { Nullable } from '../../typings/utility-types';
|
|
4
4
|
import { CommonProps } from '../../internal/CommonWrapper';
|
|
5
5
|
import { InstanceWithAnchorElement } from '../../lib/InstanceWithAnchorElement';
|
|
6
|
+
import { ReactUIFeatureFlags } from '../../lib/featureFlagsContext';
|
|
6
7
|
export declare type TooltipTrigger =
|
|
7
8
|
/** Наведение на children и на тултип */
|
|
8
9
|
'hover'
|
|
@@ -43,9 +44,11 @@ export interface TooltipProps extends CommonProps {
|
|
|
43
44
|
*/
|
|
44
45
|
render?: Nullable<() => React.ReactNode>;
|
|
45
46
|
/**
|
|
46
|
-
*
|
|
47
|
+
* Приоритетное расположение подсказки относительно текста.
|
|
48
|
+
*
|
|
49
|
+
* **Допустимые значения**: `"top"`, `"right"`, `"bottom"`, `"left"`, `"top left"`, `"top center"`, `"top right"`, `"right top"`, `"right middle"`, `"right bottom"`, `"bottom left"`, `"bottom center"`, `"bottom right"`, `"left top"`, `"left middle"`, `"left bottom"`.
|
|
47
50
|
*/
|
|
48
|
-
pos?: PopupPositionsType;
|
|
51
|
+
pos?: ShortPopupPositionsType | PopupPositionsType;
|
|
49
52
|
/**
|
|
50
53
|
* Триггер открытия тултипа
|
|
51
54
|
* ```ts
|
|
@@ -112,7 +115,7 @@ export declare const TooltipDataTids: {
|
|
|
112
115
|
readonly content: "Tooltip__content";
|
|
113
116
|
readonly crossIcon: "Tooltip__crossIcon";
|
|
114
117
|
};
|
|
115
|
-
declare type DefaultProps = Required<Pick<TooltipProps, '
|
|
118
|
+
declare type DefaultProps = Required<Pick<TooltipProps, 'trigger' | 'disableAnimations' | 'useWrapper' | 'delayBeforeShow'>>;
|
|
116
119
|
export declare class Tooltip extends React.PureComponent<TooltipProps, TooltipState> implements InstanceWithAnchorElement {
|
|
117
120
|
static __KONTUR_REACT_UI__: string;
|
|
118
121
|
static displayName: string;
|
|
@@ -125,12 +128,14 @@ export declare class Tooltip extends React.PureComponent<TooltipProps, TooltipSt
|
|
|
125
128
|
private static triggersWithoutCloseButton;
|
|
126
129
|
state: TooltipState;
|
|
127
130
|
private theme;
|
|
131
|
+
featureFlags: ReactUIFeatureFlags;
|
|
128
132
|
private hoverTimeout;
|
|
129
133
|
private contentElement;
|
|
130
134
|
private positions;
|
|
131
135
|
private clickedOutside;
|
|
132
136
|
private setRootNode;
|
|
133
137
|
private popupRef;
|
|
138
|
+
getAllowedPositions(): ("top center" | "top left" | "top right" | "bottom center" | "bottom left" | "bottom right" | "left middle" | "left top" | "left bottom" | "right middle" | "right top" | "right bottom")[];
|
|
134
139
|
componentDidUpdate(prevProps: TooltipProps): void;
|
|
135
140
|
componentWillUnmount(): void;
|
|
136
141
|
render(): JSX.Element;
|
|
@@ -151,8 +156,8 @@ export declare class Tooltip extends React.PureComponent<TooltipProps, TooltipSt
|
|
|
151
156
|
hide(): void;
|
|
152
157
|
private renderMain;
|
|
153
158
|
private renderPopup;
|
|
154
|
-
private refContent;
|
|
155
159
|
private getPositions;
|
|
160
|
+
private refContent;
|
|
156
161
|
private getPopupAndLayerProps;
|
|
157
162
|
private open;
|
|
158
163
|
private close;
|
|
@@ -6,6 +6,13 @@ var _globalObject = require("@skbkontur/global-object");
|
|
|
6
6
|
var _utils = require("../../lib/utils");
|
|
7
7
|
var _ThemeFactory = require("../../lib/theming/ThemeFactory");
|
|
8
8
|
var _Popup = require("../../internal/Popup");
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
9
16
|
var _RenderLayer = require("../../internal/RenderLayer");
|
|
10
17
|
var _CrossIcon = require("../../internal/icons/CrossIcon");
|
|
11
18
|
|
|
@@ -21,6 +28,11 @@ var _createPropsGetter = require("../../lib/createPropsGetter");
|
|
|
21
28
|
var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
|
|
22
29
|
var _CloseButtonIcon = require("../../internal/CloseButtonIcon/CloseButtonIcon");
|
|
23
30
|
var _isInstanceOf = require("../../lib/isInstanceOf");
|
|
31
|
+
var _featureFlagsContext = require("../../lib/featureFlagsContext");
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
|
|
24
36
|
|
|
25
37
|
var _Tooltip = require("./Tooltip.styles");var _class, _class2, _temp;
|
|
26
38
|
|
|
@@ -137,6 +149,8 @@ var _Tooltip = require("./Tooltip.styles");var _class, _class2, _temp;
|
|
|
137
149
|
|
|
138
150
|
|
|
139
151
|
|
|
152
|
+
|
|
153
|
+
|
|
140
154
|
|
|
141
155
|
|
|
142
156
|
|
|
@@ -153,7 +167,7 @@ var TooltipDataTids = {
|
|
|
153
167
|
crossIcon: 'Tooltip__crossIcon' };exports.TooltipDataTids = TooltipDataTids;
|
|
154
168
|
|
|
155
169
|
|
|
156
|
-
var
|
|
170
|
+
var OldPositions = [
|
|
157
171
|
'right bottom',
|
|
158
172
|
'right middle',
|
|
159
173
|
'right top',
|
|
@@ -171,8 +185,6 @@ var Positions = [
|
|
|
171
185
|
|
|
172
186
|
|
|
173
187
|
|
|
174
|
-
|
|
175
|
-
|
|
176
188
|
Tooltip = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$PureComponent) {(0, _inheritsLoose2.default)(Tooltip, _React$PureComponent);function Tooltip() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$PureComponent.call.apply(_React$PureComponent, [this].concat(args)) || this;_this.
|
|
177
189
|
|
|
178
190
|
|
|
@@ -195,8 +207,6 @@ Tooltip = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/funct
|
|
|
195
207
|
|
|
196
208
|
|
|
197
209
|
|
|
198
|
-
|
|
199
|
-
|
|
200
210
|
|
|
201
211
|
|
|
202
212
|
|
|
@@ -208,6 +218,7 @@ Tooltip = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/funct
|
|
|
208
218
|
state = { opened: false, focused: false };_this.
|
|
209
219
|
|
|
210
220
|
|
|
221
|
+
|
|
211
222
|
contentElement = null;_this.
|
|
212
223
|
positions = null;_this.
|
|
213
224
|
clickedOutside = true;_this.
|
|
@@ -243,6 +254,22 @@ Tooltip = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/funct
|
|
|
243
254
|
|
|
244
255
|
|
|
245
256
|
|
|
257
|
+
|
|
258
|
+
|
|
259
|
+
|
|
260
|
+
|
|
261
|
+
|
|
262
|
+
|
|
263
|
+
|
|
264
|
+
|
|
265
|
+
|
|
266
|
+
|
|
267
|
+
|
|
268
|
+
|
|
269
|
+
|
|
270
|
+
|
|
271
|
+
|
|
272
|
+
|
|
246
273
|
|
|
247
274
|
|
|
248
275
|
|
|
@@ -386,23 +413,35 @@ Tooltip = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/funct
|
|
|
386
413
|
|
|
387
414
|
|
|
388
415
|
|
|
389
|
-
refContent = function (node) {
|
|
390
|
-
_this.contentElement = node;
|
|
391
|
-
};_this.
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
416
|
|
|
417
|
+
getPositions = function () {
|
|
418
|
+
if (_this.featureFlags.popupUnifyPositioning) {
|
|
419
|
+
return _this.props.allowedPositions;
|
|
420
|
+
}
|
|
421
|
+
if (!_this.positions) {
|
|
422
|
+
var pos;
|
|
423
|
+
if (_this.props.pos) {
|
|
424
|
+
pos = _this.props.pos;
|
|
425
|
+
} else if (_this.featureFlags.popupUnifyPositioning) {
|
|
426
|
+
pos = _Popup.DefaultPosition;
|
|
427
|
+
} else {
|
|
428
|
+
pos = _Popup.OldDefaultPosition;
|
|
429
|
+
}
|
|
430
|
+
var allowedPositions = _this.getAllowedPositions();
|
|
431
|
+
var index = allowedPositions.indexOf(pos);
|
|
432
|
+
if (index === -1) {
|
|
433
|
+
throw new Error('Unexpected position passed to Tooltip. Expected one of: ' + allowedPositions.join(', '));
|
|
434
|
+
}
|
|
403
435
|
|
|
436
|
+
_this.positions = [].concat(allowedPositions.slice(index), allowedPositions.slice(0, index));
|
|
437
|
+
}
|
|
404
438
|
|
|
439
|
+
return _this.positions;
|
|
440
|
+
};_this.
|
|
405
441
|
|
|
442
|
+
refContent = function (node) {
|
|
443
|
+
_this.contentElement = node;
|
|
444
|
+
};_this.
|
|
406
445
|
|
|
407
446
|
|
|
408
447
|
|
|
@@ -585,7 +624,7 @@ Tooltip = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/funct
|
|
|
585
624
|
}
|
|
586
625
|
|
|
587
626
|
_this.close();
|
|
588
|
-
};return _this;}var _proto = Tooltip.prototype;_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var _this$getProps = this.getProps(),trigger = _this$getProps.trigger
|
|
627
|
+
};return _this;}var _proto = Tooltip.prototype;_proto.getAllowedPositions = function getAllowedPositions() {return this.props.allowedPositions ? this.props.allowedPositions : OldPositions;};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var _this$getProps = this.getProps(),trigger = _this$getProps.trigger;if (trigger === 'closed' && this.state.opened) {this.close();}if (this.featureFlags.hintAddDynamicPositioning && !this.featureFlags.popupUnifyPositioning) {var pos = this.props.pos ? this.props.pos : _Popup.OldDefaultPosition;var allowedPositions = this.getAllowedPositions();var posChanged = prevProps.pos !== pos;var allowedChanged = !(0, _lodash.default)(prevProps.allowedPositions, allowedPositions);if (posChanged || allowedChanged) {this.positions = null;}}};_proto.componentWillUnmount = function componentWillUnmount() {this.clearHoverTimeout();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_featureFlagsContext.ReactUIFeatureFlagsContext.Consumer, null, function (flags) {_this2.featureFlags = (0, _featureFlagsContext.getFullReactUIFlagsContext)(flags);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _ThemeFactory.ThemeFactory.create({ popupPinOffset: theme.tooltipPinOffset, popupMargin: theme.tooltipMargin, popupBorder: theme.tooltipBorder, popupBorderRadius: theme.tooltipBorderRadius, popupPinSize: theme.tooltipPinSize, popupPinOffsetX: theme.tooltipPinOffsetX, popupPinOffsetY: theme.tooltipPinOffsetY, popupBackground: theme.tooltipBg }, theme) }, _this2.renderMain());});});};_proto.renderCloseButton = function renderCloseButton() {var hasCross = this.props.closeButton === undefined ? !Tooltip.triggersWithoutCloseButton.includes(this.getProps().trigger) : this.props.closeButton;if (!hasCross) {return null;}var icon = (0, _ThemeHelpers.isTheme2022)(this.theme) ? /*#__PURE__*/_react.default.createElement(_CloseButtonIcon.CloseButtonIcon, { tabbable: false, side: parseInt(this.theme.tooltipCloseBtnSide), color: this.theme.tooltipCloseBtnColor, colorHover: this.theme.tooltipCloseBtnHoverColor }) : /*#__PURE__*/_react.default.createElement(_CrossIcon.CrossIcon, null);return /*#__PURE__*/_react.default.createElement("div", { className: _Tooltip.styles.cross(this.theme), onClick: this.handleCloseButtonClick, "data-tid": TooltipDataTids.crossIcon }, icon);}; /**
|
|
589
628
|
* Программно открывает тултип.
|
|
590
629
|
* <p>Не действует если проп *trigger* `'opened'` или `'closed'`.</p>
|
|
591
630
|
* @public
|
|
@@ -593,4 +632,4 @@ Tooltip = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/funct
|
|
|
593
632
|
* Программно закрывает тултип.
|
|
594
633
|
* <p>Не действует если проп *trigger* `'opened'` или `'closed'`.</p>
|
|
595
634
|
* @public
|
|
596
|
-
*/;_proto.hide = function hide() {var trigger = this.getProps().trigger;if (trigger === 'opened' || trigger === 'closed') {(0, _warning.default)(true, "Function 'hide' is not supported with trigger specified '" + trigger + "'");return;}this.close();};_proto.renderMain = function renderMain() {var props = this.props;var content = this.renderContent();var _this$getPopupAndLaye = this.getPopupAndLayerProps(),popupProps = _this$getPopupAndLaye.popupProps,_this$getPopupAndLaye2 = _this$getPopupAndLaye.layerProps,layerProps = _this$getPopupAndLaye2 === void 0 ? { active: false } : _this$getPopupAndLaye2;var anchorElement = props.children || props.anchorElement;var popup = this.renderPopup(anchorElement, popupProps, content);return /*#__PURE__*/_react.default.createElement(_RenderLayer.RenderLayer, (0, _extends2.default)({}, layerProps, { getAnchorElement: this.getAnchorElement }), popup);};_proto.renderPopup = function renderPopup(anchorElement, popupProps, content) {var _this$getProps2 = this.getProps(),disableAnimations = _this$getProps2.disableAnimations,trigger = _this$getProps2.trigger;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_Popup.Popup, (0, _extends2.default)({ "data-tid": TooltipDataTids.root, anchorElement: anchorElement, hasPin: true, hasShadow: true, maxWidth: "none", opened: this.state.opened, disableAnimations: disableAnimations, positions: this.getPositions(), ignoreHover: trigger === 'hoverAnchor', onOpen: this.props.onOpen, onClose: this.props.onClose, tryPreserveFirstRenderedPosition: true, ref: this.popupRef, withoutMobile: true }, popupProps), content));};_proto.
|
|
635
|
+
*/;_proto.hide = function hide() {var trigger = this.getProps().trigger;if (trigger === 'opened' || trigger === 'closed') {(0, _warning.default)(true, "Function 'hide' is not supported with trigger specified '" + trigger + "'");return;}this.close();};_proto.renderMain = function renderMain() {var props = this.props;var content = this.renderContent();var _this$getPopupAndLaye = this.getPopupAndLayerProps(),popupProps = _this$getPopupAndLaye.popupProps,_this$getPopupAndLaye2 = _this$getPopupAndLaye.layerProps,layerProps = _this$getPopupAndLaye2 === void 0 ? { active: false } : _this$getPopupAndLaye2;var anchorElement = props.children || props.anchorElement;var popup = this.renderPopup(anchorElement, popupProps, content);return /*#__PURE__*/_react.default.createElement(_RenderLayer.RenderLayer, (0, _extends2.default)({}, layerProps, { getAnchorElement: this.getAnchorElement }), popup);};_proto.renderPopup = function renderPopup(anchorElement, popupProps, content) {var _this$getProps2 = this.getProps(),disableAnimations = _this$getProps2.disableAnimations,trigger = _this$getProps2.trigger;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_Popup.Popup, (0, _extends2.default)({ "data-tid": TooltipDataTids.root, anchorElement: anchorElement, hasPin: true, hasShadow: true, maxWidth: "none", opened: this.state.opened, disableAnimations: disableAnimations, positions: this.getPositions(), pos: this.props.pos, ignoreHover: trigger === 'hoverAnchor', onOpen: this.props.onOpen, onClose: this.props.onClose, tryPreserveFirstRenderedPosition: true, ref: this.popupRef, withoutMobile: true }, popupProps), content));};_proto.getPopupAndLayerProps = function getPopupAndLayerProps() {var props = this.props;var useWrapper = !!props.children && this.getProps().useWrapper;var trigger = this.getProps().trigger;switch (trigger) {case 'opened':return { layerProps: { active: true, onClickOutside: this.handleClickOutsideAnchor }, popupProps: { opened: true, useWrapper: useWrapper } };case 'closed':return { popupProps: { opened: false, useWrapper: useWrapper } };case 'hoverAnchor':case 'hover':return { popupProps: { onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, useWrapper: useWrapper } };case 'manual':return { popupProps: { useWrapper: useWrapper } };case 'click':return { layerProps: { active: this.state.opened, onClickOutside: this.handleClickOutsideAnchor }, popupProps: { onClick: this.handleClick, useWrapper: useWrapper } };case 'focus':return { popupProps: { onFocus: this.handleFocus, onBlur: this.handleBlur, useWrapper: useWrapper } };case 'hover&focus':return { layerProps: { active: this.state.opened, onClickOutside: this.handleClickOutsideAnchor }, popupProps: { onFocus: this.handleFocus, onBlur: this.handleBlur, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, useWrapper: useWrapper } };default:throw new Error('Unknown trigger specified: ' + trigger);}};_proto.clearHoverTimeout = function clearHoverTimeout() {if (this.hoverTimeout) {_globalObject.globalObject.clearTimeout(this.hoverTimeout);this.hoverTimeout = null;}};_proto.isClickOutsideContent = function isClickOutsideContent(event) {if (this.contentElement && (0, _isInstanceOf.isInstanceOf)(event.target, _globalObject.globalObject.Element)) {return !(0, _listenFocusOutside.containsTargetOrRenderContainer)(event.target)(this.contentElement);}return true;};return Tooltip;}(_react.default.PureComponent), _class2.__KONTUR_REACT_UI__ = 'Tooltip', _class2.displayName = 'Tooltip', _class2.propTypes = { children: function children(props, propName, componentName) {var children = props[propName];(0, _warning.default)(children || props.anchorElement, "[" + componentName + "]: you must provide either 'children' or 'anchorElement' prop for " + componentName + " to work properly");(0, _warning.default)(!(Array.isArray(children) && props.useWrapper === false), "[" + componentName + "]: you provided multiple children, but useWrapper={false} - forcing wrapper <span/> for positioning to work correctly");} }, _class2.defaultProps = { trigger: 'hover', disableAnimations: _currentEnvironment.isTestEnv, useWrapper: false, delayBeforeShow: DEFAULT_DELAY }, _class2.delay = DEFAULT_DELAY, _class2.triggersWithoutCloseButton = ['hover', 'hoverAnchor', 'focus', 'hover&focus'], _temp)) || _class;exports.Tooltip = Tooltip;
|