@skbkontur/react-ui 6.3.4 → 6.3.5-4fa10.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/components/Autocomplete/Autocomplete.d.ts +4 -1
- package/components/Autocomplete/Autocomplete.js +15 -7
- package/components/Autocomplete/Autocomplete.js.map +1 -1
- package/components/Button/Button.js +9 -3
- package/components/Button/Button.js.map +1 -1
- package/components/Button/Button.styles.d.ts +3 -0
- package/components/Button/Button.styles.js +62 -50
- package/components/Button/Button.styles.js.map +1 -1
- package/components/Checkbox/Checkbox.d.ts +1 -0
- package/components/Checkbox/Checkbox.js +12 -1
- package/components/Checkbox/Checkbox.js.map +1 -1
- package/components/Checkbox/Checkbox.styles.d.ts +3 -0
- package/components/Checkbox/Checkbox.styles.js +27 -18
- package/components/Checkbox/Checkbox.styles.js.map +1 -1
- package/components/ComboBox/ComboBox.d.ts +5 -1
- package/components/ComboBox/ComboBox.js.map +1 -1
- package/components/DropdownMenu/DropdownMenu.d.ts +3 -0
- package/components/DropdownMenu/DropdownMenu.js +1 -1
- package/components/DropdownMenu/DropdownMenu.js.map +1 -1
- package/components/FileUploader/FileUploader.js +8 -3
- package/components/FileUploader/FileUploader.js.map +1 -1
- package/components/FileUploader/FileUploader.styles.d.ts +3 -0
- package/components/FileUploader/FileUploader.styles.js +73 -64
- package/components/FileUploader/FileUploader.styles.js.map +1 -1
- package/components/FileUploader/FileUploaderFile.styles.js +12 -12
- package/components/FileUploader/FileUploaderFile.styles.js.map +1 -1
- package/components/FileUploader/FileUploaderFileList/FileUploaderFileList.styles.js +13 -13
- package/components/FileUploader/FileUploaderFileList/FileUploaderFileList.styles.js.map +1 -1
- package/components/Input/InputLayout/InputLayout.styles.d.ts +1 -0
- package/components/Input/InputLayout/InputLayout.styles.js +11 -8
- package/components/Input/InputLayout/InputLayout.styles.js.map +1 -1
- package/components/Input/InputLayout/InputLayoutAsideText.js +3 -1
- package/components/Input/InputLayout/InputLayoutAsideText.js.map +1 -1
- package/components/Kebab/Kebab.js +1 -1
- package/components/Kebab/Kebab.js.map +1 -1
- package/components/MenuItem/MenuItem.styles.js +3 -3
- package/components/MenuItem/MenuItem.styles.js.map +1 -1
- package/components/Radio/Radio.js +18 -22
- package/components/Radio/Radio.js.map +1 -1
- package/components/Radio/Radio.styles.js +1 -1
- package/components/Radio/Radio.styles.js.map +1 -1
- package/components/Select/Select.js +5 -4
- package/components/Select/Select.js.map +1 -1
- package/components/SidePage/SidePage.styles.d.ts +1 -0
- package/components/SidePage/SidePage.styles.js +19 -16
- package/components/SidePage/SidePage.styles.js.map +1 -1
- package/components/SidePage/SidePageHeader.js +3 -0
- package/components/SidePage/SidePageHeader.js.map +1 -1
- package/components/Textarea/Textarea.styles.js +4 -4
- package/components/Textarea/Textarea.styles.js.map +1 -1
- package/components/TokenInput/TokenInput.d.ts +17 -16
- package/components/TokenInput/TokenInput.js +202 -59
- package/components/TokenInput/TokenInput.js.map +1 -1
- package/components/TokenInput/TokenInputFailedMenu.d.ts +17 -0
- package/components/TokenInput/TokenInputFailedMenu.js +30 -0
- package/components/TokenInput/TokenInputFailedMenu.js.map +1 -0
- package/components/TokenInput/TokenInputMenu.d.ts +13 -2
- package/components/TokenInput/TokenInputMenu.js +150 -22
- package/components/TokenInput/TokenInputMenu.js.map +1 -1
- package/components/TokenInput/TokenInputMobileMenu.js +3 -2
- package/components/TokenInput/TokenInputMobileMenu.js.map +1 -1
- package/components/TokenInput/TokenInputReducer.d.ts +6 -1
- package/components/TokenInput/TokenInputReducer.js +14 -3
- package/components/TokenInput/TokenInputReducer.js.map +1 -1
- package/components/TokenInput/locale/locales/en.js +1 -0
- package/components/TokenInput/locale/locales/en.js.map +1 -1
- package/components/TokenInput/locale/locales/ru.js +1 -0
- package/components/TokenInput/locale/locales/ru.js.map +1 -1
- package/components/TokenInput/locale/types.d.ts +1 -0
- package/components/TokenInput/locale/types.js.map +1 -1
- package/components/TooltipMenu/TooltipMenu.d.ts +3 -0
- package/components/TooltipMenu/TooltipMenu.js +1 -1
- package/components/TooltipMenu/TooltipMenu.js.map +1 -1
- package/internal/CustomComboBox/ComboBoxView.d.ts +1 -0
- package/internal/CustomComboBox/ComboBoxView.js +8 -4
- package/internal/CustomComboBox/ComboBoxView.js.map +1 -1
- package/internal/CustomComboBox/CustomComboBox.d.ts +1 -0
- package/internal/CustomComboBox/CustomComboBox.js +1 -0
- package/internal/CustomComboBox/CustomComboBox.js.map +1 -1
- package/internal/Popup/Popup.js.map +1 -1
- package/internal/PopupMenu/PopupMenu.d.ts +4 -0
- package/internal/PopupMenu/PopupMenu.js +7 -4
- package/internal/PopupMenu/PopupMenu.js.map +1 -1
- package/internal/themes/BasicTheme.d.ts +36 -0
- package/internal/themes/BasicTheme.js +42 -0
- package/internal/themes/BasicTheme.js.map +1 -1
- package/internal/themes/DarkTheme6_0.js +1 -0
- package/internal/themes/DarkTheme6_0.js.map +1 -1
- package/internal/themes/DarkTheme6_4.d.ts +1 -0
- package/internal/themes/DarkTheme6_4.js +44 -0
- package/internal/themes/DarkTheme6_4.js.map +1 -0
- package/internal/themes/DarkTheme6_5.d.ts +1 -0
- package/internal/themes/DarkTheme6_5.js +63 -0
- package/internal/themes/DarkTheme6_5.js.map +1 -0
- package/internal/themes/LightTheme6_4.d.ts +1 -0
- package/internal/themes/LightTheme6_4.js +44 -0
- package/internal/themes/LightTheme6_4.js.map +1 -0
- package/internal/themes/LightTheme6_5.d.ts +1 -0
- package/internal/themes/LightTheme6_5.js +63 -0
- package/internal/themes/LightTheme6_5.js.map +1 -0
- package/lib/theming/ThemeVersions.d.ts +1 -1
- package/lib/theming/ThemeVersions.js.map +1 -1
- package/lib/theming/getMenuProgressiveRadius.d.ts +8 -0
- package/lib/theming/getMenuProgressiveRadius.js +23 -0
- package/lib/theming/getMenuProgressiveRadius.js.map +1 -0
- package/lib/theming/themes/DarkTheme.d.ts +2 -0
- package/lib/theming/themes/DarkTheme.js +5 -1
- package/lib/theming/themes/DarkTheme.js.map +1 -1
- package/lib/theming/themes/LightTheme.d.ts +2 -0
- package/lib/theming/themes/LightTheme.js +5 -1
- package/lib/theming/themes/LightTheme.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["Checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport type { AriaAttributes } from 'react';\nimport React from 'react';\n\nimport type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { FocusControlWrapper } from '../../internal/FocusControlWrapper/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { fixFirefoxModifiedClickOnLabel } from '../../lib/events/fixFirefoxModifiedClickOnLabel.js';\nimport { KeyListener } from '../../lib/events/keyListener.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { withSize } from '../../lib/size/SizeDecorator.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport type { Override } from '../../typings/utility-types.js';\nimport { getStyles, globalClasses } from './Checkbox.styles.js';\nimport { CheckedIcon } from './CheckedIcon.js';\nimport { IndeterminateIcon } from './IndeterminateIcon.js';\n\nexport interface CheckboxProps\n extends\n CommonProps,\n Pick<AriaAttributes, 'aria-describedby' | 'aria-label'>,\n Override<\n React.InputHTMLAttributes<HTMLInputElement>,\n {\n /** @ignore */\n children?: React.ReactNode;\n\n /** Переводит контрол в состояние ошибки. */\n error?: boolean;\n\n /** Переводит контрол в состояние предупреждения. */\n warning?: boolean;\n\n /** Размер чекбокса. */\n size?: SizeProp;\n\n /** HTML-событие `onmouseenter`.\n * @ignore */\n onMouseEnter?: React.MouseEventHandler<HTMLLabelElement>;\n\n /** HTML-событие `onmouseleave`.\n * @ignore */\n onMouseLeave?: React.MouseEventHandler<HTMLLabelElement>;\n\n /** HTML-событие `onmouseover`.\n * @ignore */\n onMouseOver?: React.MouseEventHandler<HTMLLabelElement>;\n\n /** Событие изменения value. */\n onValueChange?: (value: boolean) => void;\n\n /** HTML-событие `onblur`.\n * @ignore */\n onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;\n\n /** Устанавливает начальное [неопределенное состояние чекбокса](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#attr-indeterminate). */\n initialIndeterminate?: boolean;\n\n /** Задаёт второстепенный пояснительный текст под основным текстом чекбокса. */\n comment?: React.ReactNode;\n }\n > {}\n\nexport interface CheckboxState {\n focusedByTab: boolean;\n indeterminate: boolean;\n isShiftPressed: boolean;\n}\n\nexport const CheckboxDataTids = {\n root: 'Checkbox__root',\n} as const;\n\n/**\n * Чекбокс используется для управления параметром с двумя состояниями.\n */\n@withRenderEnvironment\n@rootNode\n@withSize\nexport class Checkbox extends React.PureComponent<CheckboxProps, CheckboxState> {\n public static __KONTUR_REACT_UI__ = 'Checkbox';\n public static displayName = 'Checkbox';\n\n private getRootSizeClassName() {\n switch (this.size) {\n case 'large':\n return this.styles.rootLarge(this.theme);\n case 'medium':\n return this.styles.rootMedium(this.theme);\n case 'small':\n default:\n return this.styles.rootSmall(this.theme);\n }\n }\n\n private getBoxWrapperSizeClassName() {\n switch (this.size) {\n case 'large':\n return this.styles.boxWrapperLarge(this.theme);\n case 'medium':\n return this.styles.boxWrapperMedium(this.theme);\n case 'small':\n default:\n return this.styles.boxWrapperSmall(this.theme);\n }\n }\n\n private getCheckboxBoxSize() {\n switch (this.size) {\n case 'large':\n return this.theme.checkboxBoxSizeLarge;\n case 'medium':\n return this.theme.checkboxBoxSizeMedium;\n case 'small':\n default:\n return this.theme.checkboxBoxSizeSmall;\n }\n }\n\n public state = {\n focusedByTab: false,\n indeterminate: this.props.initialIndeterminate || false,\n isShiftPressed: false,\n };\n private size!: SizeProp;\n\n private globalObject!: GlobalObject;\n private emotion!: Emotion;\n private cx!: Emotion['cx'];\n private styles!: ReturnType<typeof getStyles>;\n private theme!: Theme;\n private input = React.createRef<HTMLInputElement>();\n private getProps = createPropsGetter({});\n private keyListener!: KeyListener;\n\n private handleShiftPress = (e: KeyboardEvent) => {\n if (e.key === 'Shift') {\n this.setState(() => ({\n isShiftPressed: true,\n }));\n }\n };\n\n private handleShiftRelease = (e: KeyboardEvent) => {\n if (e.key === 'Shift') {\n this.setState({\n isShiftPressed: false,\n });\n }\n };\n\n public componentDidMount = () => {\n this.keyListener = new KeyListener(this.globalObject);\n if (this.state.indeterminate && this.input.current) {\n this.input.current.indeterminate = true;\n }\n\n this.globalObject.document?.addEventListener('keydown', this.handleShiftPress);\n this.globalObject.document?.addEventListener('keyup', this.handleShiftRelease);\n };\n\n public componentWillUnmount = () => {\n this.globalObject.document?.removeEventListener('keydown', this.handleShiftPress);\n this.globalObject.document?.removeEventListener('keyup', this.handleShiftRelease);\n };\n\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n public componentDidUpdate(prevProps: CheckboxProps) {\n if (prevProps.checked !== this.props.checked) {\n this.resetIndeterminate();\n }\n }\n\n public render(): React.JSX.Element {\n this.styles = getStyles(this.emotion);\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.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 /**\n * Программно устанавливает фокус на чекбокс.\n * @public\n */\n public focus(): void {\n this.keyListener.isTabPressed = true;\n this.input.current?.focus();\n }\n\n /**\n * Программно снимает фокус с чекбокса.\n * @public\n */\n public blur(): void {\n this.input.current?.blur();\n }\n\n /**\n * Устанавливает чекбокс в HTML-состояние `indeterminate`.\n * @public\n */\n public setIndeterminate = (): void => {\n this.setState({\n indeterminate: true,\n });\n if (this.input.current) {\n this.input.current.indeterminate = true;\n }\n };\n\n /**\n * Снимает с чекбокса HTML-состояние `indeterminate`.\n * @public\n */\n public resetIndeterminate = (): void => {\n this.setState({\n indeterminate: false,\n });\n if (this.input.current) {\n this.input.current.indeterminate = false;\n }\n };\n\n private renderMain = (props: CommonWrapperRestProps<CheckboxProps>) => {\n const {\n error,\n warning,\n size,\n onMouseEnter,\n onMouseLeave,\n onMouseOver,\n onValueChange,\n onClick,\n type,\n initialIndeterminate,\n comment,\n 'aria-describedby': ariaDescribedby,\n 'aria-label': ariaLabel,\n ...rest\n } = props;\n const isIndeterminate = this.state.indeterminate;\n\n const iconClass = this.cx(\n this.styles.icon(),\n !this.props.checked && !isIndeterminate && this.styles.iconUnchecked(),\n );\n\n const iconSize = parseInt(this.getCheckboxBoxSize());\n const IconCheck = (\n <span className={iconClass}>\n <CheckedIcon size={iconSize} />\n </span>\n );\n const IconSquare = (\n <span className={iconClass}>\n <IndeterminateIcon size={iconSize} />\n </span>\n );\n\n const rootClass = this.cx(this.getRootSizeClassName(), {\n [this.styles.root(this.theme)]: true,\n [this.styles.rootChecked(this.theme)]: props.checked || isIndeterminate,\n [this.styles.rootDisableTextSelect()]: this.state.isShiftPressed,\n [this.styles.disabled(this.theme)]: Boolean(this.props.disabled),\n });\n\n const inputProps = {\n ...rest,\n type: 'checkbox',\n className: this.styles.input(),\n onChange: this.handleChange,\n onFocus: this.handleFocus,\n onBlur: this.handleBlur,\n onClick: this.handleInputClick,\n ref: this.input,\n };\n\n const box = (\n <div\n className={this.cx(this.getBoxWrapperSizeClassName(), {\n [this.styles.boxWrapper(this.theme)]: true,\n })}\n >\n <div\n className={this.cx(this.styles.box(this.theme), globalClasses.box, {\n [this.styles.boxChecked(this.theme)]: this.props.checked || isIndeterminate,\n [this.styles.boxFocus(this.theme)]: this.state.focusedByTab,\n [this.styles.boxError(this.theme)]: this.props.error,\n [this.styles.boxWarning(this.theme)]: this.props.warning,\n [this.styles.boxDisabled(this.theme)]: this.props.disabled,\n })}\n >\n {(isIndeterminate && IconSquare) || IconCheck}\n </div>\n </div>\n );\n\n return (\n <label\n data-tid={CheckboxDataTids.root}\n className={rootClass}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n onMouseOver={onMouseOver}\n onClick={this.handleLabelClick}\n >\n <FocusControlWrapper onBlurWhenDisabled={this.resetFocus}>\n <input {...inputProps} aria-label={ariaLabel} aria-describedby={ariaDescribedby} />\n </FocusControlWrapper>\n {box}\n {this.props.children &&\n (comment ? (\n <div className={this.styles.captionWrapper(this.theme)}>\n {this.renderCaption(Boolean(props.disabled), true)}\n {this.renderComment(Boolean(props.disabled))}\n </div>\n ) : (\n this.renderCaption(Boolean(props.disabled), false)\n ))}\n </label>\n );\n };\n\n private getSubcaptionSizeClassName() {\n switch (this.size) {\n case 'large':\n return this.styles.subcaptionLarge(this.theme);\n case 'medium':\n return this.styles.subcaptionMedium(this.theme);\n case 'small':\n default:\n return this.styles.subcaptionSmall(this.theme);\n }\n }\n\n private renderCaption(disabled: boolean, noGap: boolean) {\n const captionClass = this.cx({\n [this.styles.caption(this.theme)]: true,\n [this.styles.disabled(this.theme)]: disabled,\n [this.styles.captionNoGap()]: noGap,\n });\n\n return <div className={captionClass}>{this.props.children}</div>;\n }\n\n private renderComment(disabled: boolean) {\n return (\n <div\n className={this.cx(this.styles.subcaption(this.theme), this.getSubcaptionSizeClassName(), {\n [this.styles.subcaptionDisabled(this.theme)]: disabled,\n })}\n >\n {this.props.comment}\n </div>\n );\n }\n\n private handleFocus = (e: React.FocusEvent<any>) => {\n if (!this.props.disabled) {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n this.globalObject.requestAnimationFrame?.(() => {\n if (this.keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n\n if (this.props.onFocus) {\n this.props.onFocus(e);\n }\n }\n };\n\n private resetFocus = () => this.setState({ focusedByTab: false });\n\n private handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n this.resetFocus();\n this.props.onBlur?.(e);\n };\n\n private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n const checked = event.currentTarget.checked;\n this.props.onValueChange?.(checked);\n\n this.resetIndeterminate();\n\n this.props.onChange?.(event);\n };\n\n private handleLabelClick = (e: React.MouseEvent<HTMLLabelElement>) => {\n const handleModifierClickInFirefox = fixFirefoxModifiedClickOnLabel(this.input);\n handleModifierClickInFirefox(e);\n if (this.props.onClick && e.target !== this.input.current) {\n e.stopPropagation();\n }\n };\n\n private handleInputClick = (e: React.MouseEvent<HTMLInputElement>) => {\n this.props.onClick?.(e);\n };\n}\n"]}
|
|
1
|
+
{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["Checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport type { AriaAttributes } from 'react';\nimport React from 'react';\n\nimport type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { FocusControlWrapper } from '../../internal/FocusControlWrapper/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { fixFirefoxModifiedClickOnLabel } from '../../lib/events/fixFirefoxModifiedClickOnLabel.js';\nimport { KeyListener } from '../../lib/events/keyListener.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { withSize } from '../../lib/size/SizeDecorator.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport type { Override } from '../../typings/utility-types.js';\nimport { getStyles, globalClasses } from './Checkbox.styles.js';\nimport { CheckedIcon } from './CheckedIcon.js';\nimport { IndeterminateIcon } from './IndeterminateIcon.js';\n\nexport interface CheckboxProps\n extends\n CommonProps,\n Pick<AriaAttributes, 'aria-describedby' | 'aria-label'>,\n Override<\n React.InputHTMLAttributes<HTMLInputElement>,\n {\n /** @ignore */\n children?: React.ReactNode;\n\n /** Переводит контрол в состояние ошибки. */\n error?: boolean;\n\n /** Переводит контрол в состояние предупреждения. */\n warning?: boolean;\n\n /** Размер чекбокса. */\n size?: SizeProp;\n\n /** HTML-событие `onmouseenter`.\n * @ignore */\n onMouseEnter?: React.MouseEventHandler<HTMLLabelElement>;\n\n /** HTML-событие `onmouseleave`.\n * @ignore */\n onMouseLeave?: React.MouseEventHandler<HTMLLabelElement>;\n\n /** HTML-событие `onmouseover`.\n * @ignore */\n onMouseOver?: React.MouseEventHandler<HTMLLabelElement>;\n\n /** Событие изменения value. */\n onValueChange?: (value: boolean) => void;\n\n /** HTML-событие `onblur`.\n * @ignore */\n onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;\n\n /** Устанавливает начальное [неопределенное состояние чекбокса](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#attr-indeterminate). */\n initialIndeterminate?: boolean;\n\n /** Задаёт второстепенный пояснительный текст под основным текстом чекбокса. */\n comment?: React.ReactNode;\n }\n > {}\n\nexport interface CheckboxState {\n focusedByTab: boolean;\n indeterminate: boolean;\n isShiftPressed: boolean;\n}\n\nexport const CheckboxDataTids = {\n root: 'Checkbox__root',\n} as const;\n\n/**\n * Чекбокс используется для управления параметром с двумя состояниями.\n */\n@withRenderEnvironment\n@rootNode\n@withSize\nexport class Checkbox extends React.PureComponent<CheckboxProps, CheckboxState> {\n public static __KONTUR_REACT_UI__ = 'Checkbox';\n public static displayName = 'Checkbox';\n\n private getRootSizeClassName() {\n switch (this.size) {\n case 'large':\n return this.styles.rootLarge(this.theme);\n case 'medium':\n return this.styles.rootMedium(this.theme);\n case 'small':\n default:\n return this.styles.rootSmall(this.theme);\n }\n }\n\n private getBoxWrapperSizeClassName() {\n switch (this.size) {\n case 'large':\n return this.styles.boxWrapperLarge(this.theme);\n case 'medium':\n return this.styles.boxWrapperMedium(this.theme);\n case 'small':\n default:\n return this.styles.boxWrapperSmall(this.theme);\n }\n }\n\n private getBoxSizeClassName() {\n switch (this.size) {\n case 'large':\n return this.styles.boxLarge(this.theme);\n case 'medium':\n return this.styles.boxMedium(this.theme);\n case 'small':\n default:\n return this.styles.boxSmall(this.theme);\n }\n }\n\n private getCheckboxBoxSize() {\n switch (this.size) {\n case 'large':\n return this.theme.checkboxBoxSizeLarge;\n case 'medium':\n return this.theme.checkboxBoxSizeMedium;\n case 'small':\n default:\n return this.theme.checkboxBoxSizeSmall;\n }\n }\n\n public state = {\n focusedByTab: false,\n indeterminate: this.props.initialIndeterminate || false,\n isShiftPressed: false,\n };\n private size!: SizeProp;\n\n private globalObject!: GlobalObject;\n private emotion!: Emotion;\n private cx!: Emotion['cx'];\n private styles!: ReturnType<typeof getStyles>;\n private theme!: Theme;\n private input = React.createRef<HTMLInputElement>();\n private getProps = createPropsGetter({});\n private keyListener!: KeyListener;\n\n private handleShiftPress = (e: KeyboardEvent) => {\n if (e.key === 'Shift') {\n this.setState(() => ({\n isShiftPressed: true,\n }));\n }\n };\n\n private handleShiftRelease = (e: KeyboardEvent) => {\n if (e.key === 'Shift') {\n this.setState({\n isShiftPressed: false,\n });\n }\n };\n\n public componentDidMount = () => {\n this.keyListener = new KeyListener(this.globalObject);\n if (this.state.indeterminate && this.input.current) {\n this.input.current.indeterminate = true;\n }\n\n this.globalObject.document?.addEventListener('keydown', this.handleShiftPress);\n this.globalObject.document?.addEventListener('keyup', this.handleShiftRelease);\n };\n\n public componentWillUnmount = () => {\n this.globalObject.document?.removeEventListener('keydown', this.handleShiftPress);\n this.globalObject.document?.removeEventListener('keyup', this.handleShiftRelease);\n };\n\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n public componentDidUpdate(prevProps: CheckboxProps) {\n if (prevProps.checked !== this.props.checked) {\n this.resetIndeterminate();\n }\n }\n\n public render(): React.JSX.Element {\n this.styles = getStyles(this.emotion);\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.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 /**\n * Программно устанавливает фокус на чекбокс.\n * @public\n */\n public focus(): void {\n this.keyListener.isTabPressed = true;\n this.input.current?.focus();\n }\n\n /**\n * Программно снимает фокус с чекбокса.\n * @public\n */\n public blur(): void {\n this.input.current?.blur();\n }\n\n /**\n * Устанавливает чекбокс в HTML-состояние `indeterminate`.\n * @public\n */\n public setIndeterminate = (): void => {\n this.setState({\n indeterminate: true,\n });\n if (this.input.current) {\n this.input.current.indeterminate = true;\n }\n };\n\n /**\n * Снимает с чекбокса HTML-состояние `indeterminate`.\n * @public\n */\n public resetIndeterminate = (): void => {\n this.setState({\n indeterminate: false,\n });\n if (this.input.current) {\n this.input.current.indeterminate = false;\n }\n };\n\n private renderMain = (props: CommonWrapperRestProps<CheckboxProps>) => {\n const {\n error,\n warning,\n size,\n onMouseEnter,\n onMouseLeave,\n onMouseOver,\n onValueChange,\n onClick,\n type,\n initialIndeterminate,\n comment,\n 'aria-describedby': ariaDescribedby,\n 'aria-label': ariaLabel,\n ...rest\n } = props;\n const isIndeterminate = this.state.indeterminate;\n\n const iconClass = this.cx(\n this.styles.icon(),\n !this.props.checked && !isIndeterminate && this.styles.iconUnchecked(),\n );\n\n const iconSize = parseInt(this.getCheckboxBoxSize());\n const IconCheck = (\n <span className={iconClass}>\n <CheckedIcon size={iconSize} />\n </span>\n );\n const IconSquare = (\n <span className={iconClass}>\n <IndeterminateIcon size={iconSize} />\n </span>\n );\n\n const rootClass = this.cx(this.getRootSizeClassName(), {\n [this.styles.root(this.theme)]: true,\n [this.styles.rootChecked(this.theme)]: props.checked || isIndeterminate,\n [this.styles.rootDisableTextSelect()]: this.state.isShiftPressed,\n [this.styles.disabled(this.theme)]: Boolean(this.props.disabled),\n });\n\n const inputProps = {\n ...rest,\n type: 'checkbox',\n className: this.styles.input(),\n onChange: this.handleChange,\n onFocus: this.handleFocus,\n onBlur: this.handleBlur,\n onClick: this.handleInputClick,\n ref: this.input,\n };\n\n const box = (\n <div\n className={this.cx(this.getBoxWrapperSizeClassName(), {\n [this.styles.boxWrapper(this.theme)]: true,\n })}\n >\n <div\n className={this.cx(this.styles.box(this.theme), this.getBoxSizeClassName(), globalClasses.box, {\n [this.styles.boxChecked(this.theme)]: this.props.checked || isIndeterminate,\n [this.styles.boxFocus(this.theme)]: this.state.focusedByTab,\n [this.styles.boxError(this.theme)]: this.props.error,\n [this.styles.boxWarning(this.theme)]: this.props.warning,\n [this.styles.boxDisabled(this.theme)]: this.props.disabled,\n })}\n >\n {(isIndeterminate && IconSquare) || IconCheck}\n </div>\n </div>\n );\n\n return (\n <label\n data-tid={CheckboxDataTids.root}\n className={rootClass}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n onMouseOver={onMouseOver}\n onClick={this.handleLabelClick}\n >\n <FocusControlWrapper onBlurWhenDisabled={this.resetFocus}>\n <input {...inputProps} aria-label={ariaLabel} aria-describedby={ariaDescribedby} />\n </FocusControlWrapper>\n {box}\n {this.props.children &&\n (comment ? (\n <div className={this.styles.captionWrapper(this.theme)}>\n {this.renderCaption(Boolean(props.disabled), true)}\n {this.renderComment(Boolean(props.disabled))}\n </div>\n ) : (\n this.renderCaption(Boolean(props.disabled), false)\n ))}\n </label>\n );\n };\n\n private getSubcaptionSizeClassName() {\n switch (this.size) {\n case 'large':\n return this.styles.subcaptionLarge(this.theme);\n case 'medium':\n return this.styles.subcaptionMedium(this.theme);\n case 'small':\n default:\n return this.styles.subcaptionSmall(this.theme);\n }\n }\n\n private renderCaption(disabled: boolean, noGap: boolean) {\n const captionClass = this.cx({\n [this.styles.caption(this.theme)]: true,\n [this.styles.disabled(this.theme)]: disabled,\n [this.styles.captionNoGap()]: noGap,\n });\n\n return <div className={captionClass}>{this.props.children}</div>;\n }\n\n private renderComment(disabled: boolean) {\n return (\n <div\n className={this.cx(this.styles.subcaption(this.theme), this.getSubcaptionSizeClassName(), {\n [this.styles.subcaptionDisabled(this.theme)]: disabled,\n })}\n >\n {this.props.comment}\n </div>\n );\n }\n\n private handleFocus = (e: React.FocusEvent<any>) => {\n if (!this.props.disabled) {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n this.globalObject.requestAnimationFrame?.(() => {\n if (this.keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n\n if (this.props.onFocus) {\n this.props.onFocus(e);\n }\n }\n };\n\n private resetFocus = () => this.setState({ focusedByTab: false });\n\n private handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n this.resetFocus();\n this.props.onBlur?.(e);\n };\n\n private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n const checked = event.currentTarget.checked;\n this.props.onValueChange?.(checked);\n\n this.resetIndeterminate();\n\n this.props.onChange?.(event);\n };\n\n private handleLabelClick = (e: React.MouseEvent<HTMLLabelElement>) => {\n const handleModifierClickInFirefox = fixFirefoxModifiedClickOnLabel(this.input);\n handleModifierClickInFirefox(e);\n if (this.props.onClick && e.target !== this.input.current) {\n e.stopPropagation();\n }\n };\n\n private handleInputClick = (e: React.MouseEvent<HTMLInputElement>) => {\n this.props.onClick?.(e);\n };\n}\n"]}
|
|
@@ -14,6 +14,9 @@ export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGet
|
|
|
14
14
|
boxWrapperMedium(t: Theme): string;
|
|
15
15
|
boxWrapperLarge(t: Theme): string;
|
|
16
16
|
box(t: Theme): string;
|
|
17
|
+
boxSmall(t: Theme): string;
|
|
18
|
+
boxMedium(t: Theme): string;
|
|
19
|
+
boxLarge(t: Theme): string;
|
|
17
20
|
input(): string;
|
|
18
21
|
boxWarning(t: Theme): string;
|
|
19
22
|
boxError(t: Theme): string;
|
|
@@ -43,58 +43,67 @@ export var getStyles = memoizeGetStyles(function (_a) {
|
|
|
43
43
|
box: function (t) {
|
|
44
44
|
return css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n color: ", ";\n box-shadow: ", ";\n background: ", ";\n border-radius: ", ";\n height: 100%;\n "], ["\n color: ", ";\n box-shadow: ", ";\n background: ", ";\n border-radius: ", ";\n height: 100%;\n "])), t.checkboxTextColorDefault, t.checkboxShadow, t.checkboxBg, t.checkboxBorderRadius);
|
|
45
45
|
},
|
|
46
|
+
boxSmall: function (t) {
|
|
47
|
+
return css(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n border-radius: ", ";\n "], ["\n border-radius: ", ";\n "])), t.checkboxBorderRadiusSmall);
|
|
48
|
+
},
|
|
49
|
+
boxMedium: function (t) {
|
|
50
|
+
return css(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n border-radius: ", ";\n "], ["\n border-radius: ", ";\n "])), t.checkboxBorderRadiusMedium);
|
|
51
|
+
},
|
|
52
|
+
boxLarge: function (t) {
|
|
53
|
+
return css(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n border-radius: ", ";\n "], ["\n border-radius: ", ";\n "])), t.checkboxBorderRadiusLarge);
|
|
54
|
+
},
|
|
46
55
|
input: function () {
|
|
47
|
-
return css(
|
|
56
|
+
return css(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n display: inline-block;\n height: 0;\n opacity: 0;\n position: absolute;\n width: 0;\n z-index: -1;\n "], ["\n display: inline-block;\n height: 0;\n opacity: 0;\n position: absolute;\n width: 0;\n z-index: -1;\n "])));
|
|
48
57
|
},
|
|
49
58
|
boxWarning: function (t) {
|
|
50
|
-
return css(
|
|
59
|
+
return css(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n box-shadow:\n inset 0 0 0 1px ", ",\n 0 0 0 ", " ", " !important; // override hover and active\n "], ["\n box-shadow:\n inset 0 0 0 1px ", ",\n 0 0 0 ", " ", " !important; // override hover and active\n "])), t.checkboxOutlineColorFocus, t.checkboxOutlineWidth, t.checkboxBorderColorWarning);
|
|
51
60
|
},
|
|
52
61
|
boxError: function (t) {
|
|
53
|
-
return css(
|
|
62
|
+
return css(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n box-shadow:\n inset 0 0 0 1px ", ",\n 0 0 0 ", " ", " !important; // override hover and active\n "], ["\n box-shadow:\n inset 0 0 0 1px ", ",\n 0 0 0 ", " ", " !important; // override hover and active\n "])), t.checkboxOutlineColorFocus, t.checkboxOutlineWidth, t.checkboxBorderColorError);
|
|
54
63
|
},
|
|
55
64
|
boxChecked: function (t) {
|
|
56
|
-
return css(
|
|
65
|
+
return css(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n box-shadow: ", ";\n "], ["\n background: ", ";\n color: ", ";\n box-shadow: ", ";\n "])), t.checkboxCheckedBg, t.checkboxCheckedColor, t.checkboxCheckedShadow);
|
|
57
66
|
},
|
|
58
67
|
boxFocus: function (t) {
|
|
59
|
-
return css(
|
|
68
|
+
return css(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n box-shadow:\n inset 0 0 0 1px ", ",\n 0 0 0 ", " ", " !important; // override hover and active\n "], ["\n box-shadow:\n inset 0 0 0 1px ", ",\n 0 0 0 ", " ", " !important; // override hover and active\n "])), t.checkboxOutlineColorFocus, t.checkboxOutlineWidth, t.checkboxBorderColorFocus);
|
|
60
69
|
},
|
|
61
70
|
boxDisabled: function (t) {
|
|
62
|
-
return css(
|
|
71
|
+
return css(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n box-shadow: ", " !important; // override hover and active\n background: ", " !important; // override hover and active\n color: ", ";\n "], ["\n box-shadow: ", " !important; // override hover and active\n background: ", " !important; // override hover and active\n color: ", ";\n "])), t.checkboxShadowDisabled, t.checkboxBgDisabled, t.checkboxTextColorDisabled);
|
|
63
72
|
},
|
|
64
73
|
disabled: function (t) {
|
|
65
|
-
return css(
|
|
74
|
+
return css(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n color: ", ";\n cursor: default;\n "], ["\n color: ", ";\n cursor: default;\n "])), t.checkboxTextColorDisabled);
|
|
66
75
|
},
|
|
67
76
|
icon: function () {
|
|
68
|
-
return css(
|
|
77
|
+
return css(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n "], ["\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n "])));
|
|
69
78
|
},
|
|
70
79
|
iconUnchecked: function () {
|
|
71
|
-
return css(
|
|
80
|
+
return css(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n color: transparent;\n "], ["\n color: transparent;\n "])));
|
|
72
81
|
},
|
|
73
82
|
caption: function (t) {
|
|
74
|
-
return css(
|
|
83
|
+
return css(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n color: ", ";\n padding-left: ", ";\n "], ["\n color: ", ";\n padding-left: ", ";\n "])), t.checkboxTextColorDefault, t.checkboxCaptionGap);
|
|
75
84
|
},
|
|
76
85
|
captionWrapper: function (t) {
|
|
77
|
-
return css(
|
|
86
|
+
return css(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n display: inline-block;\n padding-left: ", ";\n "], ["\n display: inline-block;\n padding-left: ", ";\n "])), t.checkboxCaptionGap);
|
|
78
87
|
},
|
|
79
88
|
captionNoGap: function () {
|
|
80
|
-
return css(
|
|
89
|
+
return css(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n padding-left: 0;\n "], ["\n padding-left: 0;\n "])));
|
|
81
90
|
},
|
|
82
91
|
subcaption: function (t) {
|
|
83
|
-
return css(
|
|
92
|
+
return css(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n margin-top: 2px;\n color: ", ";\n "], ["\n margin-top: 2px;\n color: ", ";\n "])), t.checkboxCommentTextColor);
|
|
84
93
|
},
|
|
85
94
|
subcaptionDisabled: function (t) {
|
|
86
|
-
return css(
|
|
95
|
+
return css(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n ", ";\n "], ["\n ", ";\n "])), disabledTextColorMixin(t.checkboxTextColorDisabled));
|
|
87
96
|
},
|
|
88
97
|
subcaptionSmall: function (t) {
|
|
89
|
-
return css(
|
|
98
|
+
return css(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n ", ";\n "], ["\n ", ";\n "])), subcaptionMixin(t.checkboxCommentFontSizeSmall, t.checkboxCommentLineHeightSmall));
|
|
90
99
|
},
|
|
91
100
|
subcaptionMedium: function (t) {
|
|
92
|
-
return css(
|
|
101
|
+
return css(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n ", ";\n "], ["\n ", ";\n "])), subcaptionMixin(t.checkboxCommentFontSizeMedium, t.checkboxCommentLineHeightMedium));
|
|
93
102
|
},
|
|
94
103
|
subcaptionLarge: function (t) {
|
|
95
|
-
return css(
|
|
104
|
+
return css(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n ", ";\n "], ["\n ", ";\n "])), subcaptionMixin(t.checkboxCommentFontSizeLarge, t.checkboxCommentLineHeightLarge));
|
|
96
105
|
},
|
|
97
106
|
});
|
|
98
107
|
});
|
|
99
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28;
|
|
108
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31;
|
|
100
109
|
//# sourceMappingURL=Checkbox.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.styles.js","sourceRoot":"","sources":["Checkbox.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles, prefix } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { boxWrapperSizeMixin, checkboxSizeMixin, disabledTextColorMixin, subcaptionMixin } from './Checkbox.mixins.js';\n\nexport const globalClasses = prefix('checkbox')({\n box: 'box',\n});\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n root(t: Theme) {\n return css`\n display: inline-flex;\n align-items: baseline;\n cursor: pointer;\n position: relative;\n\n &::before {\n // non-breaking space.\n // makes a correct space for absolutely positioned box,\n // and also height and baseline for checkbox without caption.\n content: '\\\\00A0';\n display: inline-block;\n flex: 0 0 auto;\n }\n\n .${globalClasses.box} {\n transition:\n background ${t.transitionDuration} ${t.transitionTimingFunction},\n box-shadow ${t.transitionDuration} ${t.transitionTimingFunction};\n }\n\n &:hover .${globalClasses.box} {\n background: ${t.checkboxHoverBg};\n box-shadow: ${t.checkboxShadowHover};\n }\n\n &:active .${globalClasses.box} {\n box-shadow: ${t.checkboxShadowActive};\n background: ${t.checkboxActiveBg};\n }\n `;\n },\n\n rootSmall(t: Theme) {\n return css`\n ${checkboxSizeMixin(\n t.checkboxFontSizeSmall,\n t.checkboxLineHeightSmall,\n t.checkboxPaddingYSmall,\n t.checkboxBoxSizeSmall,\n t.checkboxPaddingXSmall,\n )};\n `;\n },\n\n rootMedium(t: Theme) {\n return css`\n ${checkboxSizeMixin(\n t.checkboxFontSizeMedium,\n t.checkboxLineHeightMedium,\n t.checkboxPaddingYMedium,\n t.checkboxBoxSizeMedium,\n t.checkboxPaddingXMedium,\n )};\n `;\n },\n\n rootLarge(t: Theme) {\n return css`\n ${checkboxSizeMixin(\n t.checkboxFontSizeLarge,\n t.checkboxLineHeightLarge,\n t.checkboxPaddingYLarge,\n t.checkboxBoxSizeLarge,\n t.checkboxPaddingXLarge,\n )};\n `;\n },\n\n rootDisableTextSelect() {\n return css`\n user-select: none;\n `;\n },\n\n rootChecked(t: Theme) {\n return css`\n &:hover .${globalClasses.box} {\n box-shadow: ${t.checkboxCheckedHoverShadow};\n background: ${t.checkboxCheckedHoverBg};\n }\n\n &:active .${globalClasses.box} {\n background: ${t.checkboxCheckedActiveBg};\n box-shadow: ${t.checkboxCheckedActiveShadow};\n }\n `;\n },\n\n boxWrapper(t: Theme) {\n return css`\n position: absolute;\n box-sizing: border-box;\n padding: ${t.checkboxBorderWidth};\n\n display: inline-block; \n )};\n `;\n },\n\n boxWrapperSmall(t: Theme) {\n return css`\n ${boxWrapperSizeMixin(\n t.labGrotesqueBaselineCompensation,\n t.checkboxFontSizeSmall,\n t.checkboxBoxSizeSmall,\n t.checkboxBoxOffsetY,\n t.checkboxPaddingXSmall,\n )};\n `;\n },\n\n boxWrapperMedium(t: Theme) {\n return css`\n ${boxWrapperSizeMixin(\n t.labGrotesqueBaselineCompensation,\n t.checkboxFontSizeMedium,\n t.checkboxBoxSizeMedium,\n t.checkboxBoxOffsetY,\n t.checkboxPaddingXMedium,\n )};\n `;\n },\n\n boxWrapperLarge(t: Theme) {\n return css`\n ${boxWrapperSizeMixin(\n t.labGrotesqueBaselineCompensation,\n t.checkboxFontSizeLarge,\n t.checkboxBoxSizeLarge,\n t.checkboxBoxOffsetY,\n t.checkboxPaddingXLarge,\n )};\n `;\n },\n\n box(t: Theme) {\n return css`\n color: ${t.checkboxTextColorDefault};\n box-shadow: ${t.checkboxShadow};\n background: ${t.checkboxBg};\n border-radius: ${t.checkboxBorderRadius};\n height: 100%;\n `;\n },\n\n input() {\n return css`\n display: inline-block;\n height: 0;\n opacity: 0;\n position: absolute;\n width: 0;\n z-index: -1;\n `;\n },\n\n boxWarning(t: Theme) {\n return css`\n box-shadow:\n inset 0 0 0 1px ${t.checkboxOutlineColorFocus},\n 0 0 0 ${t.checkboxOutlineWidth} ${t.checkboxBorderColorWarning} !important; // override hover and active\n `;\n },\n\n boxError(t: Theme) {\n return css`\n box-shadow:\n inset 0 0 0 1px ${t.checkboxOutlineColorFocus},\n 0 0 0 ${t.checkboxOutlineWidth} ${t.checkboxBorderColorError} !important; // override hover and active\n `;\n },\n\n boxChecked(t: Theme) {\n return css`\n background: ${t.checkboxCheckedBg};\n color: ${t.checkboxCheckedColor};\n box-shadow: ${t.checkboxCheckedShadow};\n `;\n },\n\n boxFocus(t: Theme) {\n return css`\n box-shadow:\n inset 0 0 0 1px ${t.checkboxOutlineColorFocus},\n 0 0 0 ${t.checkboxOutlineWidth} ${t.checkboxBorderColorFocus} !important; // override hover and active\n `;\n },\n\n boxDisabled(t: Theme) {\n return css`\n box-shadow: ${t.checkboxShadowDisabled} !important; // override hover and active\n background: ${t.checkboxBgDisabled} !important; // override hover and active\n color: ${t.checkboxTextColorDisabled};\n `;\n },\n\n disabled(t: Theme) {\n return css`\n color: ${t.checkboxTextColorDisabled};\n cursor: default;\n `;\n },\n\n icon() {\n return css`\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n `;\n },\n\n iconUnchecked() {\n return css`\n color: transparent;\n `;\n },\n\n caption(t: Theme) {\n return css`\n color: ${t.checkboxTextColorDefault};\n padding-left: ${t.checkboxCaptionGap};\n `;\n },\n\n captionWrapper(t: Theme) {\n return css`\n display: inline-block;\n padding-left: ${t.checkboxCaptionGap};\n `;\n },\n\n captionNoGap() {\n return css`\n padding-left: 0;\n `;\n },\n\n subcaption(t: Theme) {\n return css`\n margin-top: 2px;\n color: ${t.checkboxCommentTextColor};\n `;\n },\n\n subcaptionDisabled(t: Theme) {\n return css`\n ${disabledTextColorMixin(t.checkboxTextColorDisabled)};\n `;\n },\n\n subcaptionSmall(t: Theme) {\n return css`\n ${subcaptionMixin(t.checkboxCommentFontSizeSmall, t.checkboxCommentLineHeightSmall)};\n `;\n },\n subcaptionMedium(t: Theme) {\n return css`\n ${subcaptionMixin(t.checkboxCommentFontSizeMedium, t.checkboxCommentLineHeightMedium)};\n `;\n },\n subcaptionLarge(t: Theme) {\n return css`\n ${subcaptionMixin(t.checkboxCommentFontSizeLarge, t.checkboxCommentLineHeightLarge)};\n `;\n },\n}));\n"]}
|
|
1
|
+
{"version":3,"file":"Checkbox.styles.js","sourceRoot":"","sources":["Checkbox.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles, prefix } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { boxWrapperSizeMixin, checkboxSizeMixin, disabledTextColorMixin, subcaptionMixin } from './Checkbox.mixins.js';\n\nexport const globalClasses = prefix('checkbox')({\n box: 'box',\n});\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n root(t: Theme) {\n return css`\n display: inline-flex;\n align-items: baseline;\n cursor: pointer;\n position: relative;\n\n &::before {\n // non-breaking space.\n // makes a correct space for absolutely positioned box,\n // and also height and baseline for checkbox without caption.\n content: '\\\\00A0';\n display: inline-block;\n flex: 0 0 auto;\n }\n\n .${globalClasses.box} {\n transition:\n background ${t.transitionDuration} ${t.transitionTimingFunction},\n box-shadow ${t.transitionDuration} ${t.transitionTimingFunction};\n }\n\n &:hover .${globalClasses.box} {\n background: ${t.checkboxHoverBg};\n box-shadow: ${t.checkboxShadowHover};\n }\n\n &:active .${globalClasses.box} {\n box-shadow: ${t.checkboxShadowActive};\n background: ${t.checkboxActiveBg};\n }\n `;\n },\n\n rootSmall(t: Theme) {\n return css`\n ${checkboxSizeMixin(\n t.checkboxFontSizeSmall,\n t.checkboxLineHeightSmall,\n t.checkboxPaddingYSmall,\n t.checkboxBoxSizeSmall,\n t.checkboxPaddingXSmall,\n )};\n `;\n },\n\n rootMedium(t: Theme) {\n return css`\n ${checkboxSizeMixin(\n t.checkboxFontSizeMedium,\n t.checkboxLineHeightMedium,\n t.checkboxPaddingYMedium,\n t.checkboxBoxSizeMedium,\n t.checkboxPaddingXMedium,\n )};\n `;\n },\n\n rootLarge(t: Theme) {\n return css`\n ${checkboxSizeMixin(\n t.checkboxFontSizeLarge,\n t.checkboxLineHeightLarge,\n t.checkboxPaddingYLarge,\n t.checkboxBoxSizeLarge,\n t.checkboxPaddingXLarge,\n )};\n `;\n },\n\n rootDisableTextSelect() {\n return css`\n user-select: none;\n `;\n },\n\n rootChecked(t: Theme) {\n return css`\n &:hover .${globalClasses.box} {\n box-shadow: ${t.checkboxCheckedHoverShadow};\n background: ${t.checkboxCheckedHoverBg};\n }\n\n &:active .${globalClasses.box} {\n background: ${t.checkboxCheckedActiveBg};\n box-shadow: ${t.checkboxCheckedActiveShadow};\n }\n `;\n },\n\n boxWrapper(t: Theme) {\n return css`\n position: absolute;\n box-sizing: border-box;\n padding: ${t.checkboxBorderWidth};\n\n display: inline-block; \n )};\n `;\n },\n\n boxWrapperSmall(t: Theme) {\n return css`\n ${boxWrapperSizeMixin(\n t.labGrotesqueBaselineCompensation,\n t.checkboxFontSizeSmall,\n t.checkboxBoxSizeSmall,\n t.checkboxBoxOffsetY,\n t.checkboxPaddingXSmall,\n )};\n `;\n },\n\n boxWrapperMedium(t: Theme) {\n return css`\n ${boxWrapperSizeMixin(\n t.labGrotesqueBaselineCompensation,\n t.checkboxFontSizeMedium,\n t.checkboxBoxSizeMedium,\n t.checkboxBoxOffsetY,\n t.checkboxPaddingXMedium,\n )};\n `;\n },\n\n boxWrapperLarge(t: Theme) {\n return css`\n ${boxWrapperSizeMixin(\n t.labGrotesqueBaselineCompensation,\n t.checkboxFontSizeLarge,\n t.checkboxBoxSizeLarge,\n t.checkboxBoxOffsetY,\n t.checkboxPaddingXLarge,\n )};\n `;\n },\n\n box(t: Theme) {\n return css`\n color: ${t.checkboxTextColorDefault};\n box-shadow: ${t.checkboxShadow};\n background: ${t.checkboxBg};\n border-radius: ${t.checkboxBorderRadius};\n height: 100%;\n `;\n },\n\n boxSmall(t: Theme) {\n return css`\n border-radius: ${t.checkboxBorderRadiusSmall};\n `;\n },\n\n boxMedium(t: Theme) {\n return css`\n border-radius: ${t.checkboxBorderRadiusMedium};\n `;\n },\n\n boxLarge(t: Theme) {\n return css`\n border-radius: ${t.checkboxBorderRadiusLarge};\n `;\n },\n\n input() {\n return css`\n display: inline-block;\n height: 0;\n opacity: 0;\n position: absolute;\n width: 0;\n z-index: -1;\n `;\n },\n\n boxWarning(t: Theme) {\n return css`\n box-shadow:\n inset 0 0 0 1px ${t.checkboxOutlineColorFocus},\n 0 0 0 ${t.checkboxOutlineWidth} ${t.checkboxBorderColorWarning} !important; // override hover and active\n `;\n },\n\n boxError(t: Theme) {\n return css`\n box-shadow:\n inset 0 0 0 1px ${t.checkboxOutlineColorFocus},\n 0 0 0 ${t.checkboxOutlineWidth} ${t.checkboxBorderColorError} !important; // override hover and active\n `;\n },\n\n boxChecked(t: Theme) {\n return css`\n background: ${t.checkboxCheckedBg};\n color: ${t.checkboxCheckedColor};\n box-shadow: ${t.checkboxCheckedShadow};\n `;\n },\n\n boxFocus(t: Theme) {\n return css`\n box-shadow:\n inset 0 0 0 1px ${t.checkboxOutlineColorFocus},\n 0 0 0 ${t.checkboxOutlineWidth} ${t.checkboxBorderColorFocus} !important; // override hover and active\n `;\n },\n\n boxDisabled(t: Theme) {\n return css`\n box-shadow: ${t.checkboxShadowDisabled} !important; // override hover and active\n background: ${t.checkboxBgDisabled} !important; // override hover and active\n color: ${t.checkboxTextColorDisabled};\n `;\n },\n\n disabled(t: Theme) {\n return css`\n color: ${t.checkboxTextColorDisabled};\n cursor: default;\n `;\n },\n\n icon() {\n return css`\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n `;\n },\n\n iconUnchecked() {\n return css`\n color: transparent;\n `;\n },\n\n caption(t: Theme) {\n return css`\n color: ${t.checkboxTextColorDefault};\n padding-left: ${t.checkboxCaptionGap};\n `;\n },\n\n captionWrapper(t: Theme) {\n return css`\n display: inline-block;\n padding-left: ${t.checkboxCaptionGap};\n `;\n },\n\n captionNoGap() {\n return css`\n padding-left: 0;\n `;\n },\n\n subcaption(t: Theme) {\n return css`\n margin-top: 2px;\n color: ${t.checkboxCommentTextColor};\n `;\n },\n\n subcaptionDisabled(t: Theme) {\n return css`\n ${disabledTextColorMixin(t.checkboxTextColorDisabled)};\n `;\n },\n\n subcaptionSmall(t: Theme) {\n return css`\n ${subcaptionMixin(t.checkboxCommentFontSizeSmall, t.checkboxCommentLineHeightSmall)};\n `;\n },\n subcaptionMedium(t: Theme) {\n return css`\n ${subcaptionMixin(t.checkboxCommentFontSizeMedium, t.checkboxCommentLineHeightMedium)};\n `;\n },\n subcaptionLarge(t: Theme) {\n return css`\n ${subcaptionMixin(t.checkboxCommentFontSizeLarge, t.checkboxCommentLineHeightLarge)};\n `;\n },\n}));\n"]}
|
|
@@ -49,6 +49,10 @@ export interface ComboBoxProps<T> extends Pick<AriaAttributes, 'aria-describedby
|
|
|
49
49
|
menuPos?: 'top' | 'bottom';
|
|
50
50
|
/** Выравнивание выпадающего меню. */
|
|
51
51
|
menuAlign?: 'left' | 'right';
|
|
52
|
+
/** Ширина выпадающего списка. На ширину поля не влияет.
|
|
53
|
+
* Список не уже поля: если задать меньшую ширину, сработает минимум по ширине поля.
|
|
54
|
+
* В мобильном режиме не ограничивает попап. */
|
|
55
|
+
menuWidth?: string | number;
|
|
52
56
|
/** Событие потери комбобоксом фокуса. */
|
|
53
57
|
onBlur?: () => void;
|
|
54
58
|
/** Событие изменения значения (`value`) в поле. */
|
|
@@ -107,7 +111,7 @@ export interface ComboBoxProps<T> extends Pick<AriaAttributes, 'aria-describedby
|
|
|
107
111
|
size?: SizeProp;
|
|
108
112
|
/** Переводит комбобокс в состояние предупреждения. */
|
|
109
113
|
warning?: boolean;
|
|
110
|
-
/** Ширина комбобокса. */
|
|
114
|
+
/** Ширина комбобокса. Задаёт ширину поля, на выпадающий список не влияет. */
|
|
111
115
|
width?: string | number;
|
|
112
116
|
/** Максимальная высота выпадающего списка. */
|
|
113
117
|
maxMenuHeight?: number | string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboBox.js","sourceRoot":"","sources":["ComboBox.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { AriaAttributes, HTMLAttributes } from 'react';\nimport React from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/types.js';\nimport { CustomComboBox } from '../../internal/CustomComboBox/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode//rootNodeDecorator.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport type { InputIconType, ShowClearIcon } from '../Input/Input.js';\nimport type { MaskedInputOnBeforePasteValue, MaskedInputProps } from '../MaskedInput/MaskedInput.js';\nimport type { MenuItemState } from '../MenuItem/MenuItem.js';\n\nexport type ComboBoxViewMode = 'singleline' | 'multiline' | 'multiline-editing';\n\nexport interface ComboBoxProps<T>\n extends\n Pick<AriaAttributes, 'aria-describedby' | 'aria-label'>,\n Pick<HTMLAttributes<HTMLElement>, 'id'>,\n Partial<Pick<MaskedInputProps, 'mask' | 'maskChar' | 'formatChars'>>,\n CommonProps {\n /** Показывает иконку очистки значения в заполненном поле.\n * @default never */\n showClearIcon?: ShowClearIcon;\n\n /** Ввыравнивание текста в поле. */\n align?: 'left' | 'center' | 'right';\n\n /** Вызывает функцию поиска `getItems` при фокусе и очистке поля ввода. */\n searchOnFocus?: boolean;\n\n /** Отображает справа иконку в виде стрелки. */\n drawArrow?: boolean;\n\n /** Устанавливает фокус на комбобоксе после окончания загрузки страницы. */\n autoFocus?: boolean;\n\n /** Убирает обводку поля. */\n borderless?: boolean;\n\n /** По умолчанию выпадающий список рендерится через [паттерн Portal](https://react.dev/reference/react-dom/createPortal). Проп отключает использование Portal и список рендерится как обычный блок с абсолютным позиционированием внутри компонента. */\n disablePortal?: boolean;\n\n /** Блокирует комбобокс. */\n disabled?: boolean;\n\n /** Переводит комбобокс в состояние ошибки. */\n error?: boolean;\n\n /** Добавляет иконку слева.\n При использовании `ReactNode` применяются дефолтные стили для иконки.\n При использовании `() => ReactNode` применяются только стили для позиционирования. */\n leftIcon?: InputIconType;\n\n /** Добавляет иконку справа.\n При использовании `ReactNode` применяются дефолтные стили для иконки.\n При использовании `() => ReactNode` применяются только стили для позиционирования. */\n rightIcon?: InputIconType;\n\n /** Задаёт функцию поиска элементов, которая должна возвращать Promise с массивом значений.\n * По умолчанию ожидаются объекты с типом `{ value: string, label: string }`.\n * Элементы могут быть любого типа. В этом случае необходимо определить свойства `itemToId`, `renderValue`, `renderItem`, `valueToString`. */\n getItems: (query: string) => Promise<Array<ComboBoxExtendedItem<T>>>;\n\n /** Сравнивает полученные результаты с `value`. */\n itemToId?: (item: T) => string | number;\n\n /** Mаксимальная длина значения, которое пользователь может ввести в поле. */\n maxLength?: number;\n\n /** Расположение выпадающего списка — над или под полем.\n */\n menuPos?: 'top' | 'bottom';\n\n /** Выравнивание выпадающего меню. */\n menuAlign?: 'left' | 'right';\n\n /** Событие потери комбобоксом фокуса. */\n onBlur?: () => void;\n\n /** Событие изменения значения (`value`) в поле. */\n onValueChange?: (value: T) => void;\n\n /** Событие получения комбобоксом фокуса. */\n onFocus?: () => void;\n\n /** Событие, которое вызывается при изменении текста в поле ввода, если результатом функции будет строка, то она станет следующим состоянием полем ввода.\n *\n * **Не рекомендуется менять значение, передаваемое в проп `value`, внутри этой функции. Используйте для этих целей `onValueChange` или `onUnexpectedInput`. Иначе возможно неожиданное поведение компонента.**\n */\n onInputValueChange?: (value: string) => Nullable<string> | void;\n\n /** Событие обработки ввода строки в поле ввода и последующей потерей фокуса компонентом.\n * Функция срабатывает с аргументом поля строки.\n * Если при потере фокуса в выпадающем списке будет только один элемент и результат `valueToString` с этим элементом будет совпадать со значение в текстовом поле, то сработает `onValueChange` со значением данного элемента.\n * Сама функция также может вернуть значение, не равное undefined, с которым будет вызван `onValueChange`. Если возвращаемое значение будет равно null, то сработает очистка текущего значения поля, а в режиме редактирования токен будет удален. */\n onUnexpectedInput?: (value: string) => void | null | T;\n\n /** Текст, который отображается если не введено никакое значение. */\n placeholder?: string;\n\n /** Отрисовывает элементы результата поиска.\n * Не применяется, если элемент является функцией или React-элементом.\n * @default item => item.label\n * @param {T} item - элемент из результата поиска.\n * @param {MenuItemState} state? - состояние элемента.\n * @returns {React.ReactNode} React-элемент. */\n renderItem?: (item: T, state?: MenuItemState) => React.ReactNode;\n\n /** Устанавливает компонент, заменяющий собой обёртку элементов результата поиска.\n * По умолчанию все элементы результата поиска оборачиваются в тег <button />.\n * @example\n * itemWrapper={(item) => {\n * if (item.value === 3) {\n * return (props) => {\n * return <a {...props} />\n * }\n * }\n * }}\n */\n itemWrapper?: (item: T) => React.ComponentType;\n\n /** Отображает сообщение о пустом результате поиска. При `renderAddButton` не работает. */\n renderNotFound?: () => React.ReactNode;\n\n /** Отображает сообщение об общем количестве элементов.\n * @param {number} found - количество элементов по результатам поиска. Учитывает только компонент MenuItem. Им \"оборачиваются\" элементы, возвращаемые `getItems()`.\n * @param {number} total - количество всех элементов. */\n renderTotalCount?: (found: number, total: number) => React.ReactNode;\n\n /** Отображает выбранное значение.\n * @default item => item.label */\n renderValue?: (item: T) => React.ReactNode;\n\n /** Отрисовывает кнопку добавления в выпадающем списке. */\n renderAddButton?: (query?: string) => React.ReactNode;\n\n /** Определяет общее количество элементов. Необходим для работы renderTotalCount. */\n totalCount?: number;\n\n /** Устанавливает выбранное в комбобоксе значение. Тип `value` совпадает с типом элементов в массиве, возвращаемом в `getItems`. */\n value?: Nullable<T>;\n\n /** Возвращает строковое представление `value`. Необходимо при фокусировке. */\n valueToString?: (item: T) => string;\n\n /** Размер комбобокса. */\n size?: SizeProp;\n\n /** Переводит комбобокс в состояние предупреждения. */\n warning?: boolean;\n\n /** Ширина комбобокса. */\n width?: string | number;\n\n /** Максимальная высота выпадающего списка. */\n maxMenuHeight?: number | string;\n\n /** Событие наведения мышкой (событие `onmouseenter`). Смотрите разницу с `onMouseOver` в [документации](https://learn.javascript.ru/mousemove-mouseover-mouseout-mouseenter-mouseleave) */\n onMouseEnter?: (e: React.MouseEvent) => void;\n\n /** Событие наведения мышкой (событие `onmouseover`). */\n onMouseOver?: (e: React.MouseEvent) => void;\n\n /** Событие ухода мышки с объекта (событие `onmouseleave`). */\n onMouseLeave?: (e: React.MouseEvent) => void;\n\n /** Событие нажатия кнопки на клавиатуре. */\n onInputKeyDown?: (e: React.KeyboardEvent<HTMLElement>) => void;\n\n /** Задаёт типы вводимых данных. */\n inputMode?: React.HTMLAttributes<HTMLInputElement>['inputMode'];\n\n /** Событие вставки значения в поле с маской. */\n onBeforePasteInMask?: MaskedInputOnBeforePasteValue;\n\n /** Режим отображения комбобокса:\n * - `\"singleline\"` — однострочное поле;\n * - `\"multiline\"` — многострочное поле;\n * - `\"multiline-editing\"` — поле становится многострочным только при редактировании.\n *\n * Многострочные режимы не работают, если указан проп `mask`. В таком случае будет отображаться однострочное поле.\n * @default singleline */\n viewMode?: ComboBoxViewMode;\n\n /** Максимальное количество отображаемых строк, если для поля добавлен проп многострочного режима — `\"multiline\"` или `\"multiline-editing\"`. */\n maxRows?: number;\n\n /** Отключает выравнивание текста пунктов списка относительно иконок в других пунктах. */\n preventIconsOffset?: boolean;\n}\n\nexport interface ComboBoxItem {\n value: string;\n label: string;\n}\n\nexport type ComboBoxExtendedItem<T> = T | (() => React.ReactElement<T>) | React.ReactElement<T>;\n\ntype DefaultProps<T> = Required<\n Pick<\n ComboBoxProps<T>,\n | 'itemToId'\n | 'valueToString'\n | 'renderValue'\n | 'renderItem'\n | 'menuAlign'\n | 'searchOnFocus'\n | 'drawArrow'\n | 'showClearIcon'\n | 'viewMode'\n >\n>;\n\n/**\n * Комбобокс — поле ввода с выпадающим списком подсказок, из которых пользователь может выбрать нужное. Открыть выпадающий список можно ещё до начала ввода значения, нажав на поле. */\n@rootNode\nexport class ComboBox<T = ComboBoxItem> extends React.Component<ComboBoxProps<T>> {\n public static __KONTUR_REACT_UI__ = 'ComboBox';\n public static displayName = 'ComboBox';\n\n public static defaultProps: DefaultProps<any> = {\n itemToId: (item: ComboBoxItem) => item.value,\n valueToString: (item: ComboBoxItem) => item.label,\n renderValue: (item: ComboBoxItem) => item.label,\n renderItem: (item: ComboBoxItem) => item.label,\n menuAlign: 'left',\n searchOnFocus: true,\n drawArrow: true,\n showClearIcon: 'never',\n viewMode: 'singleline',\n };\n\n private getProps = createPropsGetter(ComboBox.defaultProps);\n\n private comboboxElement: Nullable<CustomComboBox<T>> = null;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n /** Программно устанавливает фокус на комбобокс.\n * @public\n */\n public focus(opts?: { withoutOpenDropdown?: boolean }): void {\n if (this.comboboxElement) {\n this.comboboxElement.focus(opts);\n }\n }\n\n /** Программно снимает фокус с комбобокса.\n * @public\n */\n public blur(): void {\n if (this.comboboxElement) {\n this.comboboxElement.blur();\n }\n }\n\n /** Открывает список значений и запускает поиск.\n *\n * По умолчанию для поиска используется введенное в поле значение или результат `valueToString(value)`.\n *\n * @public\n * @param {string} [query] Текст поиска.`\n */\n public search(query?: string): void {\n if (this.comboboxElement) {\n this.comboboxElement.search(query);\n }\n }\n\n /** Отменяет текущий поиск — останавливает фильтрацию и очищает результаты поиска.\n * @public\n */\n public cancelSearch(): void {\n if (this.comboboxElement) {\n this.comboboxElement.cancelSearch();\n }\n }\n\n /** Открывает выпадающий список.\n * @public\n */\n public open(): void {\n if (this.comboboxElement) {\n this.comboboxElement.open();\n }\n }\n\n /** Закрывает выпадающий список.\n * @public\n */\n public close(): void {\n if (this.comboboxElement) {\n this.comboboxElement.close();\n }\n }\n\n /**\n * Переводит фокус в поле, если ещё не в фокусе, и выделяет весь текст в нём.\n * @public\n */\n public selectInputText(): void {\n if (this.comboboxElement) {\n this.comboboxElement.selectInputText();\n }\n }\n\n /**\n * Сбрасывает введённое пользователем значение без изменения `value`.\n * @public\n */\n public reset(): void {\n if (this.comboboxElement) {\n this.comboboxElement.reset();\n }\n }\n\n public render(): React.JSX.Element {\n return <CustomComboBox {...this.getProps()} size={this.props.size} ref={this.customComboBoxRef} />;\n }\n\n private customComboBoxRef = (element: Nullable<CustomComboBox<T>>) => {\n this.setRootNode(element);\n this.comboboxElement = element;\n };\n}\n"]}
|
|
1
|
+
{"version":3,"file":"ComboBox.js","sourceRoot":"","sources":["ComboBox.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AACxE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAEnE,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAqNvD;uLACuL;AAEvL;IAAgD,4BAAiC;IAAjF;;QAgBU,cAAQ,GAAG,iBAAiB,CAAC,UAAQ,CAAC,YAAY,CAAC,CAAC;QAEpD,qBAAe,GAAgC,IAAI,CAAC;QAsFpD,uBAAiB,GAAG,UAAC,OAAoC;YAC/D,KAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;YAC1B,KAAI,CAAC,eAAe,GAAG,OAAO,CAAC;QACjC,CAAC,CAAC;;IACJ,CAAC;iBA5GY,QAAQ;IAsBnB;;OAEG;IACI,wBAAK,GAAZ,UAAa,IAAwC;QACnD,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YACzB,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QACnC,CAAC;IACH,CAAC;IAED;;OAEG;IACI,uBAAI,GAAX;QACE,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YACzB,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,CAAC;QAC9B,CAAC;IACH,CAAC;IAED;;;;;;OAMG;IACI,yBAAM,GAAb,UAAc,KAAc;QAC1B,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YACzB,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACrC,CAAC;IACH,CAAC;IAED;;OAEG;IACI,+BAAY,GAAnB;QACE,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YACzB,IAAI,CAAC,eAAe,CAAC,YAAY,EAAE,CAAC;QACtC,CAAC;IACH,CAAC;IAED;;OAEG;IACI,uBAAI,GAAX;QACE,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YACzB,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,CAAC;QAC9B,CAAC;IACH,CAAC;IAED;;OAEG;IACI,wBAAK,GAAZ;QACE,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YACzB,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,CAAC;QAC/B,CAAC;IACH,CAAC;IAED;;;OAGG;IACI,kCAAe,GAAtB;QACE,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YACzB,IAAI,CAAC,eAAe,CAAC,eAAe,EAAE,CAAC;QACzC,CAAC;IACH,CAAC;IAED;;;OAGG;IACI,wBAAK,GAAZ;QACE,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YACzB,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,CAAC;QAC/B,CAAC;IACH,CAAC;IAEM,yBAAM,GAAb;QACE,OAAO,oBAAC,cAAc,eAAK,IAAI,CAAC,QAAQ,EAAE,IAAE,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,CAAC,iBAAiB,IAAI,CAAC;IACrG,CAAC;;IArGa,4BAAmB,GAAG,UAAU,AAAb,CAAc;IACjC,oBAAW,GAAG,UAAU,AAAb,CAAc;IAEzB,qBAAY,GAAsB;QAC9C,QAAQ,EAAE,UAAC,IAAkB,IAAK,OAAA,IAAI,CAAC,KAAK,EAAV,CAAU;QAC5C,aAAa,EAAE,UAAC,IAAkB,IAAK,OAAA,IAAI,CAAC,KAAK,EAAV,CAAU;QACjD,WAAW,EAAE,UAAC,IAAkB,IAAK,OAAA,IAAI,CAAC,KAAK,EAAV,CAAU;QAC/C,UAAU,EAAE,UAAC,IAAkB,IAAK,OAAA,IAAI,CAAC,KAAK,EAAV,CAAU;QAC9C,SAAS,EAAE,MAAM;QACjB,aAAa,EAAE,IAAI;QACnB,SAAS,EAAE,IAAI;QACf,aAAa,EAAE,OAAO;QACtB,QAAQ,EAAE,YAAY;KACvB,AAVyB,CAUxB;IAdS,QAAQ;QADpB,QAAQ;OACI,QAAQ,CA4GpB;IAAD,eAAC;CAAA,AA5GD,CAAgD,KAAK,CAAC,SAAS,GA4G9D;SA5GY,QAAQ","sourcesContent":["import type { AriaAttributes, HTMLAttributes } from 'react';\nimport React from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/types.js';\nimport { CustomComboBox } from '../../internal/CustomComboBox/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode//rootNodeDecorator.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport type { InputIconType, ShowClearIcon } from '../Input/Input.js';\nimport type { MaskedInputOnBeforePasteValue, MaskedInputProps } from '../MaskedInput/MaskedInput.js';\nimport type { MenuItemState } from '../MenuItem/MenuItem.js';\n\nexport type ComboBoxViewMode = 'singleline' | 'multiline' | 'multiline-editing';\n\nexport interface ComboBoxProps<T>\n extends\n Pick<AriaAttributes, 'aria-describedby' | 'aria-label'>,\n Pick<HTMLAttributes<HTMLElement>, 'id'>,\n Partial<Pick<MaskedInputProps, 'mask' | 'maskChar' | 'formatChars'>>,\n CommonProps {\n /** Показывает иконку очистки значения в заполненном поле.\n * @default never */\n showClearIcon?: ShowClearIcon;\n\n /** Ввыравнивание текста в поле. */\n align?: 'left' | 'center' | 'right';\n\n /** Вызывает функцию поиска `getItems` при фокусе и очистке поля ввода. */\n searchOnFocus?: boolean;\n\n /** Отображает справа иконку в виде стрелки. */\n drawArrow?: boolean;\n\n /** Устанавливает фокус на комбобоксе после окончания загрузки страницы. */\n autoFocus?: boolean;\n\n /** Убирает обводку поля. */\n borderless?: boolean;\n\n /** По умолчанию выпадающий список рендерится через [паттерн Portal](https://react.dev/reference/react-dom/createPortal). Проп отключает использование Portal и список рендерится как обычный блок с абсолютным позиционированием внутри компонента. */\n disablePortal?: boolean;\n\n /** Блокирует комбобокс. */\n disabled?: boolean;\n\n /** Переводит комбобокс в состояние ошибки. */\n error?: boolean;\n\n /** Добавляет иконку слева.\n При использовании `ReactNode` применяются дефолтные стили для иконки.\n При использовании `() => ReactNode` применяются только стили для позиционирования. */\n leftIcon?: InputIconType;\n\n /** Добавляет иконку справа.\n При использовании `ReactNode` применяются дефолтные стили для иконки.\n При использовании `() => ReactNode` применяются только стили для позиционирования. */\n rightIcon?: InputIconType;\n\n /** Задаёт функцию поиска элементов, которая должна возвращать Promise с массивом значений.\n * По умолчанию ожидаются объекты с типом `{ value: string, label: string }`.\n * Элементы могут быть любого типа. В этом случае необходимо определить свойства `itemToId`, `renderValue`, `renderItem`, `valueToString`. */\n getItems: (query: string) => Promise<Array<ComboBoxExtendedItem<T>>>;\n\n /** Сравнивает полученные результаты с `value`. */\n itemToId?: (item: T) => string | number;\n\n /** Mаксимальная длина значения, которое пользователь может ввести в поле. */\n maxLength?: number;\n\n /** Расположение выпадающего списка — над или под полем.\n */\n menuPos?: 'top' | 'bottom';\n\n /** Выравнивание выпадающего меню. */\n menuAlign?: 'left' | 'right';\n\n /** Ширина выпадающего списка. На ширину поля не влияет.\n * Список не уже поля: если задать меньшую ширину, сработает минимум по ширине поля.\n * В мобильном режиме не ограничивает попап. */\n menuWidth?: string | number;\n\n /** Событие потери комбобоксом фокуса. */\n onBlur?: () => void;\n\n /** Событие изменения значения (`value`) в поле. */\n onValueChange?: (value: T) => void;\n\n /** Событие получения комбобоксом фокуса. */\n onFocus?: () => void;\n\n /** Событие, которое вызывается при изменении текста в поле ввода, если результатом функции будет строка, то она станет следующим состоянием полем ввода.\n *\n * **Не рекомендуется менять значение, передаваемое в проп `value`, внутри этой функции. Используйте для этих целей `onValueChange` или `onUnexpectedInput`. Иначе возможно неожиданное поведение компонента.**\n */\n onInputValueChange?: (value: string) => Nullable<string> | void;\n\n /** Событие обработки ввода строки в поле ввода и последующей потерей фокуса компонентом.\n * Функция срабатывает с аргументом поля строки.\n * Если при потере фокуса в выпадающем списке будет только один элемент и результат `valueToString` с этим элементом будет совпадать со значение в текстовом поле, то сработает `onValueChange` со значением данного элемента.\n * Сама функция также может вернуть значение, не равное undefined, с которым будет вызван `onValueChange`. Если возвращаемое значение будет равно null, то сработает очистка текущего значения поля, а в режиме редактирования токен будет удален. */\n onUnexpectedInput?: (value: string) => void | null | T;\n\n /** Текст, который отображается если не введено никакое значение. */\n placeholder?: string;\n\n /** Отрисовывает элементы результата поиска.\n * Не применяется, если элемент является функцией или React-элементом.\n * @default item => item.label\n * @param {T} item - элемент из результата поиска.\n * @param {MenuItemState} state? - состояние элемента.\n * @returns {React.ReactNode} React-элемент. */\n renderItem?: (item: T, state?: MenuItemState) => React.ReactNode;\n\n /** Устанавливает компонент, заменяющий собой обёртку элементов результата поиска.\n * По умолчанию все элементы результата поиска оборачиваются в тег <button />.\n * @example\n * itemWrapper={(item) => {\n * if (item.value === 3) {\n * return (props) => {\n * return <a {...props} />\n * }\n * }\n * }}\n */\n itemWrapper?: (item: T) => React.ComponentType;\n\n /** Отображает сообщение о пустом результате поиска. При `renderAddButton` не работает. */\n renderNotFound?: () => React.ReactNode;\n\n /** Отображает сообщение об общем количестве элементов.\n * @param {number} found - количество элементов по результатам поиска. Учитывает только компонент MenuItem. Им \"оборачиваются\" элементы, возвращаемые `getItems()`.\n * @param {number} total - количество всех элементов. */\n renderTotalCount?: (found: number, total: number) => React.ReactNode;\n\n /** Отображает выбранное значение.\n * @default item => item.label */\n renderValue?: (item: T) => React.ReactNode;\n\n /** Отрисовывает кнопку добавления в выпадающем списке. */\n renderAddButton?: (query?: string) => React.ReactNode;\n\n /** Определяет общее количество элементов. Необходим для работы renderTotalCount. */\n totalCount?: number;\n\n /** Устанавливает выбранное в комбобоксе значение. Тип `value` совпадает с типом элементов в массиве, возвращаемом в `getItems`. */\n value?: Nullable<T>;\n\n /** Возвращает строковое представление `value`. Необходимо при фокусировке. */\n valueToString?: (item: T) => string;\n\n /** Размер комбобокса. */\n size?: SizeProp;\n\n /** Переводит комбобокс в состояние предупреждения. */\n warning?: boolean;\n\n /** Ширина комбобокса. Задаёт ширину поля, на выпадающий список не влияет. */\n width?: string | number;\n\n /** Максимальная высота выпадающего списка. */\n maxMenuHeight?: number | string;\n\n /** Событие наведения мышкой (событие `onmouseenter`). Смотрите разницу с `onMouseOver` в [документации](https://learn.javascript.ru/mousemove-mouseover-mouseout-mouseenter-mouseleave) */\n onMouseEnter?: (e: React.MouseEvent) => void;\n\n /** Событие наведения мышкой (событие `onmouseover`). */\n onMouseOver?: (e: React.MouseEvent) => void;\n\n /** Событие ухода мышки с объекта (событие `onmouseleave`). */\n onMouseLeave?: (e: React.MouseEvent) => void;\n\n /** Событие нажатия кнопки на клавиатуре. */\n onInputKeyDown?: (e: React.KeyboardEvent<HTMLElement>) => void;\n\n /** Задаёт типы вводимых данных. */\n inputMode?: React.HTMLAttributes<HTMLInputElement>['inputMode'];\n\n /** Событие вставки значения в поле с маской. */\n onBeforePasteInMask?: MaskedInputOnBeforePasteValue;\n\n /** Режим отображения комбобокса:\n * - `\"singleline\"` — однострочное поле;\n * - `\"multiline\"` — многострочное поле;\n * - `\"multiline-editing\"` — поле становится многострочным только при редактировании.\n *\n * Многострочные режимы не работают, если указан проп `mask`. В таком случае будет отображаться однострочное поле.\n * @default singleline */\n viewMode?: ComboBoxViewMode;\n\n /** Максимальное количество отображаемых строк, если для поля добавлен проп многострочного режима — `\"multiline\"` или `\"multiline-editing\"`. */\n maxRows?: number;\n\n /** Отключает выравнивание текста пунктов списка относительно иконок в других пунктах. */\n preventIconsOffset?: boolean;\n}\n\nexport interface ComboBoxItem {\n value: string;\n label: string;\n}\n\nexport type ComboBoxExtendedItem<T> = T | (() => React.ReactElement<T>) | React.ReactElement<T>;\n\ntype DefaultProps<T> = Required<\n Pick<\n ComboBoxProps<T>,\n | 'itemToId'\n | 'valueToString'\n | 'renderValue'\n | 'renderItem'\n | 'menuAlign'\n | 'searchOnFocus'\n | 'drawArrow'\n | 'showClearIcon'\n | 'viewMode'\n >\n>;\n\n/**\n * Комбобокс — поле ввода с выпадающим списком подсказок, из которых пользователь может выбрать нужное. Открыть выпадающий список можно ещё до начала ввода значения, нажав на поле. */\n@rootNode\nexport class ComboBox<T = ComboBoxItem> extends React.Component<ComboBoxProps<T>> {\n public static __KONTUR_REACT_UI__ = 'ComboBox';\n public static displayName = 'ComboBox';\n\n public static defaultProps: DefaultProps<any> = {\n itemToId: (item: ComboBoxItem) => item.value,\n valueToString: (item: ComboBoxItem) => item.label,\n renderValue: (item: ComboBoxItem) => item.label,\n renderItem: (item: ComboBoxItem) => item.label,\n menuAlign: 'left',\n searchOnFocus: true,\n drawArrow: true,\n showClearIcon: 'never',\n viewMode: 'singleline',\n };\n\n private getProps = createPropsGetter(ComboBox.defaultProps);\n\n private comboboxElement: Nullable<CustomComboBox<T>> = null;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n /** Программно устанавливает фокус на комбобокс.\n * @public\n */\n public focus(opts?: { withoutOpenDropdown?: boolean }): void {\n if (this.comboboxElement) {\n this.comboboxElement.focus(opts);\n }\n }\n\n /** Программно снимает фокус с комбобокса.\n * @public\n */\n public blur(): void {\n if (this.comboboxElement) {\n this.comboboxElement.blur();\n }\n }\n\n /** Открывает список значений и запускает поиск.\n *\n * По умолчанию для поиска используется введенное в поле значение или результат `valueToString(value)`.\n *\n * @public\n * @param {string} [query] Текст поиска.`\n */\n public search(query?: string): void {\n if (this.comboboxElement) {\n this.comboboxElement.search(query);\n }\n }\n\n /** Отменяет текущий поиск — останавливает фильтрацию и очищает результаты поиска.\n * @public\n */\n public cancelSearch(): void {\n if (this.comboboxElement) {\n this.comboboxElement.cancelSearch();\n }\n }\n\n /** Открывает выпадающий список.\n * @public\n */\n public open(): void {\n if (this.comboboxElement) {\n this.comboboxElement.open();\n }\n }\n\n /** Закрывает выпадающий список.\n * @public\n */\n public close(): void {\n if (this.comboboxElement) {\n this.comboboxElement.close();\n }\n }\n\n /**\n * Переводит фокус в поле, если ещё не в фокусе, и выделяет весь текст в нём.\n * @public\n */\n public selectInputText(): void {\n if (this.comboboxElement) {\n this.comboboxElement.selectInputText();\n }\n }\n\n /**\n * Сбрасывает введённое пользователем значение без изменения `value`.\n * @public\n */\n public reset(): void {\n if (this.comboboxElement) {\n this.comboboxElement.reset();\n }\n }\n\n public render(): React.JSX.Element {\n return <CustomComboBox {...this.getProps()} size={this.props.size} ref={this.customComboBoxRef} />;\n }\n\n private customComboBoxRef = (element: Nullable<CustomComboBox<T>>) => {\n this.setRootNode(element);\n this.comboboxElement = element;\n };\n}\n"]}
|
|
@@ -4,7 +4,10 @@ import type { CommonProps } from '../../internal/CommonWrapper/types.js';
|
|
|
4
4
|
import type { PopupPositionsType } from '../../internal/Popup/index.js';
|
|
5
5
|
import type { PopupMenuProps } from '../../internal/PopupMenu/index.js';
|
|
6
6
|
import type { TGetRootNode } from '../../lib/rootNode//rootNodeDecorator.js';
|
|
7
|
+
import type { SizeProp } from '../../lib/types/props.js';
|
|
7
8
|
export interface DropdownMenuProps extends Pick<AriaAttributes, 'aria-label'>, Pick<HTMLAttributes<HTMLElement>, 'id'>, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId' | 'preventIconsOffset'>, CommonProps {
|
|
9
|
+
/** Размер выпадающего меню. По умолчанию: `'small'`. */
|
|
10
|
+
size?: SizeProp;
|
|
8
11
|
/** Максимальная высота меню. */
|
|
9
12
|
menuMaxHeight?: React.CSSProperties['maxWidth'];
|
|
10
13
|
/** Ширина раскрывающегося меню. */
|
|
@@ -82,7 +82,7 @@ var DropdownMenu = /** @class */ (function (_super) {
|
|
|
82
82
|
}
|
|
83
83
|
var _a = this.getProps(), positions = _a.positions, disableAnimations = _a.disableAnimations;
|
|
84
84
|
return (React.createElement(CommonWrapper, __assign({ rootNodeRef: this.setRootNode }, this.props),
|
|
85
|
-
React.createElement(PopupMenu, { id: this.props.id, "aria-label": this.props['aria-label'], ref: this.refPopupMenu, caption: this.props.caption, menuMaxHeight: this.props.menuMaxHeight, menuWidth: this.props.menuWidth, preventIconsOffset: this.props.preventIconsOffset, popupHasPin: false, positions: positions, disableAnimations: disableAnimations, header: this.props.header, footer: this.props.footer, width: this.props.width, corners: this.props.corners, onClose: this.props.onClose, onOpen: this.props.onOpen, popupMenuId: this.props.popupMenuId }, this.props.children)));
|
|
85
|
+
React.createElement(PopupMenu, { id: this.props.id, "aria-label": this.props['aria-label'], ref: this.refPopupMenu, caption: this.props.caption, menuMaxHeight: this.props.menuMaxHeight, menuWidth: this.props.menuWidth, preventIconsOffset: this.props.preventIconsOffset, popupHasPin: false, positions: positions, disableAnimations: disableAnimations, header: this.props.header, footer: this.props.footer, width: this.props.width, corners: this.props.corners, onClose: this.props.onClose, onOpen: this.props.onOpen, popupMenuId: this.props.popupMenuId, size: this.props.size }, this.props.children)));
|
|
86
86
|
};
|
|
87
87
|
var DropdownMenu_1;
|
|
88
88
|
DropdownMenu.__KONTUR_REACT_UI__ = 'DropdownMenu';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenu.js","sourceRoot":"","sources":["DropdownMenu.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,OAAO,MAAM,SAAS,CAAC;AAE9B,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AAGtE,OAAO,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AAE9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAE5D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;
|
|
1
|
+
{"version":3,"file":"DropdownMenu.js","sourceRoot":"","sources":["DropdownMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { AriaAttributes, HTMLAttributes } from 'react';\nimport React from 'react';\nimport warning from 'warning';\n\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport type { CommonProps } from '../../internal/CommonWrapper/types.js';\nimport type { PopupPositionsType } from '../../internal/Popup/index.js';\nimport { PopupMenu } from '../../internal/PopupMenu/index.js';\nimport type { PopupMenuProps } from '../../internal/PopupMenu/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { isTestEnv } from '../../lib/currentEnvironment.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode//rootNodeDecorator.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport { getDropdownMenuTheme } from './getDropdownMenuTheme.js';\n\nexport interface DropdownMenuProps\n extends\n Pick<AriaAttributes, 'aria-label'>,\n Pick<HTMLAttributes<HTMLElement>, 'id'>,\n Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId' | 'preventIconsOffset'>,\n CommonProps {\n /** Размер выпадающего меню. По умолчанию: `'small'`. */\n size?: SizeProp;\n /** Максимальная высота меню. */\n menuMaxHeight?: React.CSSProperties['maxWidth'];\n /** Ширина раскрывающегося меню. */\n menuWidth?: React.CSSProperties['width'];\n /** Ширина контейнера с `caption`. */\n width?: React.CSSProperties['width'];\n\n /**\n * Элемент или render-функция, по которым открывается меню.\n *\n * Если передать функцию, ей нужно самостоятельно вызвать `openMenu`, `closeMenu` или `toggleMenu`.\n */\n caption: PopupMenuProps['caption'];\n\n /**\n * Рендерит произвольный элемент в шапке меню.\n *\n * _Примечание_: `MenuHeader` передается только в `children` меню-контролов. Не передавайте `MenuHeader` в `header`.\n */\n header?: React.ReactNode;\n /**\n * Рендерит произвольный элемент в подвале меню.\n *\n * Перед элементом из `footer` автоматически добавляется `MenuSeparator`.\n */\n footer?: React.ReactNode;\n /**\n * Список допустимых положений раскрывающегося меню относительно `caption`.\n *\n * Если меню выходит за пределы `viewport` во всех положениях, будет использовано первое положение из списка.\n *\n * **Возможные значения**: `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 * @default ['bottom left', 'bottom right', 'top left', 'top right']\n */\n positions?: PopupPositionsType[];\n\n /**\n * Отключает анимацию раскрывающегося меню.\n */\n disableAnimations?: boolean;\n\n /** @ignore */\n corners?: React.CSSProperties;\n}\n\ntype DefaultProps = Required<Pick<DropdownMenuProps, 'disableAnimations' | 'positions'>>;\n\n/**\n * Раскрывающееся меню.\n *\n * Раскрывается по клику на переданный в `caption` элемент.\n * Поддерживает настройку `header`, `footer`, позиций открытия `positions` и другие настройки внешнего вида.\n */\n@rootNode\nexport class DropdownMenu extends React.Component<DropdownMenuProps> {\n public static __KONTUR_REACT_UI__ = 'DropdownMenu';\n public static displayName = 'DropdownMenu';\n\n public static defaultProps: DefaultProps = {\n disableAnimations: isTestEnv,\n positions: ['bottom left', 'bottom right', 'top left', 'top right'],\n };\n\n private getProps = createPropsGetter(DropdownMenu.defaultProps);\n\n private popupMenu: Nullable<PopupMenu> = null;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n constructor(props: DropdownMenuProps) {\n super(props);\n\n if (!props.caption) {\n warning(false, 'Prop \"caption\" is required!!!');\n }\n }\n\n public render(): React.JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return <ThemeContext.Provider value={getDropdownMenuTheme(theme)}>{this.renderMain()}</ThemeContext.Provider>;\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public renderMain(): React.JSX.Element | null {\n if (!this.props.caption) {\n return null;\n }\n const { positions, disableAnimations } = this.getProps();\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <PopupMenu\n id={this.props.id}\n aria-label={this.props['aria-label']}\n ref={this.refPopupMenu}\n caption={this.props.caption}\n menuMaxHeight={this.props.menuMaxHeight}\n menuWidth={this.props.menuWidth}\n preventIconsOffset={this.props.preventIconsOffset}\n popupHasPin={false}\n positions={positions}\n disableAnimations={disableAnimations}\n header={this.props.header}\n footer={this.props.footer}\n width={this.props.width}\n corners={this.props.corners}\n onClose={this.props.onClose}\n onOpen={this.props.onOpen}\n popupMenuId={this.props.popupMenuId}\n size={this.props.size}\n >\n {this.props.children}\n </PopupMenu>\n </CommonWrapper>\n );\n }\n\n public open = (): void => {\n if (this.popupMenu) {\n this.popupMenu.open();\n }\n };\n\n public close = (): void => {\n if (this.popupMenu) {\n this.popupMenu.close();\n }\n };\n\n private refPopupMenu = (ref: Nullable<PopupMenu>) => {\n this.popupMenu = ref;\n };\n}\n"]}
|
|
@@ -275,7 +275,12 @@ var _FileUploader = forwardRefAndName('FileUploader', function (props, ref) {
|
|
|
275
275
|
var hasOneFileForSingle = isSingleMode && hasOneFile && !hideFiles;
|
|
276
276
|
var hasError = !!error || ((_g = files[0]) === null || _g === void 0 ? void 0 : _g.status) === FileUploaderFileStatus.Error;
|
|
277
277
|
var hasWarning = !!warning || ((_h = files[0]) === null || _h === void 0 ? void 0 : _h.status) === FileUploaderFileStatus.Warning;
|
|
278
|
-
var
|
|
278
|
+
var borderRadiusClass = useFileUploaderSize(size, {
|
|
279
|
+
small: jsStyles.borderRadiusSmall(theme),
|
|
280
|
+
medium: jsStyles.borderRadiusMedium(theme),
|
|
281
|
+
large: jsStyles.borderRadiusLarge(theme),
|
|
282
|
+
});
|
|
283
|
+
var uploadButtonClassNames = cx(jsStyles.uploadButton(theme), jsViewStyles.uploadButton(), sizeClassName, borderRadiusClass, hasOneFileForSingle && jsViewStyles.uploadButtonWithFile(theme), focusedByTab && jsStyles.uploadButtonFocus(theme), disabled && (_a = {},
|
|
279
284
|
_a[jsStyles.disabled(theme)] = true,
|
|
280
285
|
_a[jsStyles.disabledBackground(theme)] = !hasFiles,
|
|
281
286
|
_a), (focusedByTab || !hasOneFileForSingle) && (_b = {},
|
|
@@ -294,9 +299,9 @@ var _FileUploader = forwardRefAndName('FileUploader', function (props, ref) {
|
|
|
294
299
|
var uploadButtonWrapperClassNames = cx(isTileView && (_e = {},
|
|
295
300
|
_e[sizeWrapperClass] = true,
|
|
296
301
|
_e[sizeWrapperEmptyFileClass] = !hasOneFileForSingle,
|
|
297
|
-
_e), jsViewStyles.uploadButtonWrapper(), canDrop && jsStyles.windowDragOver(theme));
|
|
302
|
+
_e), jsViewStyles.uploadButtonWrapper(), borderRadiusClass, canDrop && jsStyles.windowDragOver(theme));
|
|
298
303
|
var uploadButtonIconClassNames = cx(jsStyles.icon(theme), sizeIconClass, disabled && jsStyles.iconDisabled(theme), uploadButtonIconGapClass);
|
|
299
|
-
var rootClassNames = cx(jsStyles.root(theme), !isTileView && jsRowStyles.root());
|
|
304
|
+
var rootClassNames = cx(jsStyles.root(theme), borderRadiusClass, !isTileView && jsRowStyles.root());
|
|
300
305
|
var contentClassNames = cx(jsViewStyles.content(), (_f = {},
|
|
301
306
|
_f[jsViewStyles.contentWithFiles()] = hasOneFileForSingle,
|
|
302
307
|
_f[contentInnerClass] = !isTileView && (!files.length || !isSingleMode),
|