@skbkontur/react-ui 3.7.2 → 3.8.3
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 +60 -2
- package/README.md +1 -1
- package/cjs/components/Checkbox/Checkbox.styles.js +1 -2
- package/cjs/components/Checkbox/Checkbox.styles.js.map +1 -1
- package/cjs/components/CurrencyLabel/CurrencyLabel.js +5 -14
- package/cjs/components/CurrencyLabel/CurrencyLabel.js.map +1 -1
- package/cjs/components/DateInput/DateInput.js +2 -1
- package/cjs/components/DateInput/DateInput.js.map +1 -1
- package/cjs/components/DatePicker/DatePicker.d.ts +3 -2
- package/cjs/components/DatePicker/DatePicker.js +12 -5
- package/cjs/components/DatePicker/DatePicker.js.map +1 -1
- package/cjs/components/Dropdown/Dropdown.d.ts +1 -0
- package/cjs/components/Dropdown/Dropdown.js +1 -0
- package/cjs/components/Dropdown/Dropdown.js.map +1 -1
- package/cjs/components/Dropdown/Dropdown.md +0 -1
- package/cjs/components/DropdownMenu/DropdownMenu.d.ts +17 -3
- package/cjs/components/DropdownMenu/DropdownMenu.js +15 -1
- package/cjs/components/DropdownMenu/DropdownMenu.js.map +1 -1
- package/cjs/components/DropdownMenu/DropdownMenu.md +87 -6
- package/cjs/components/Kebab/Kebab.d.ts +5 -2
- package/cjs/components/Kebab/Kebab.js +5 -1
- package/cjs/components/Kebab/Kebab.js.map +1 -1
- package/cjs/components/Kebab/Kebab.md +249 -3
- package/cjs/components/MenuHeader/MenuHeader.d.ts +5 -1
- package/cjs/components/MenuHeader/MenuHeader.js +5 -1
- package/cjs/components/MenuHeader/MenuHeader.js.map +1 -1
- package/cjs/components/MenuHeader/MenuHeader.md +23 -0
- package/cjs/components/MenuItem/MenuItem.d.ts +10 -1
- package/cjs/components/MenuItem/MenuItem.js +11 -1
- package/cjs/components/MenuItem/MenuItem.js.map +1 -1
- package/cjs/components/MenuItem/MenuItem.md +106 -4
- package/cjs/components/MenuSeparator/MenuSeparator.d.ts +3 -1
- package/cjs/components/MenuSeparator/MenuSeparator.js +3 -1
- package/cjs/components/MenuSeparator/MenuSeparator.js.map +1 -1
- package/cjs/components/MenuSeparator/MenuSeparator.md +14 -0
- package/cjs/components/Modal/Modal.styles.d.ts +1 -0
- package/cjs/components/Modal/Modal.styles.js +22 -20
- package/cjs/components/Modal/Modal.styles.js.map +1 -1
- package/cjs/components/Modal/ModalClose.js +23 -3
- package/cjs/components/Modal/ModalClose.js.map +1 -1
- package/cjs/components/Textarea/Textarea.d.ts +0 -2
- package/cjs/components/Textarea/Textarea.js +6 -3
- package/cjs/components/Textarea/Textarea.js.map +1 -1
- package/cjs/components/Toggle/Toggle.d.ts +47 -1
- package/cjs/components/Toggle/Toggle.js +52 -2
- package/cjs/components/Toggle/Toggle.js.map +1 -1
- package/cjs/components/Toggle/Toggle.md +83 -9
- package/cjs/components/Toggle/Toggle.styles.d.ts +3 -0
- package/cjs/components/Toggle/Toggle.styles.js +36 -23
- package/cjs/components/Toggle/Toggle.styles.js.map +1 -1
- package/cjs/components/TooltipMenu/TooltipMenu.d.ts +26 -8
- package/cjs/components/TooltipMenu/TooltipMenu.js +24 -6
- package/cjs/components/TooltipMenu/TooltipMenu.js.map +1 -1
- package/cjs/components/TooltipMenu/TooltipMenu.md +76 -8
- package/cjs/internal/CommonWrapper/CommonWrapper.d.ts +9 -1
- package/cjs/internal/CommonWrapper/CommonWrapper.js +8 -0
- package/cjs/internal/CommonWrapper/CommonWrapper.js.map +1 -1
- package/cjs/internal/CustomComboBox/ComboBoxView.js +2 -1
- package/cjs/internal/CustomComboBox/ComboBoxView.js.map +1 -1
- package/cjs/internal/CustomComboBox/CustomComboBoxReducer.js +3 -2
- package/cjs/internal/CustomComboBox/CustomComboBoxReducer.js.map +1 -1
- package/cjs/internal/InputLikeText/InputLikeText.d.ts +1 -0
- package/cjs/internal/InputLikeText/InputLikeText.js +8 -3
- package/cjs/internal/InputLikeText/InputLikeText.js.map +1 -1
- package/cjs/internal/InputLikeText/InputLikeText.styles.d.ts +1 -1
- package/cjs/internal/InputLikeText/InputLikeText.styles.js +1 -1
- package/cjs/internal/InputLikeText/InputLikeText.styles.js.map +1 -1
- package/cjs/internal/RenderContainer/RenderContainer.js +2 -1
- package/cjs/internal/RenderContainer/RenderContainer.js.map +1 -1
- package/cjs/internal/ThemeShowcase/VariablesCollector.d.ts +1 -1
- package/cjs/internal/themes/DefaultTheme.d.ts +3 -0
- package/cjs/internal/themes/DefaultTheme.js +11 -2
- package/cjs/internal/themes/DefaultTheme.js.map +1 -1
- package/cjs/lib/Upgrades.d.ts +2 -0
- package/cjs/lib/Upgrades.js +14 -0
- package/cjs/lib/Upgrades.js.map +1 -1
- package/cjs/lib/theming/Emotion.js +1 -1
- package/cjs/lib/theming/Emotion.js.map +1 -1
- package/components/Checkbox/Checkbox.styles/Checkbox.styles.js +1 -1
- package/components/Checkbox/Checkbox.styles/Checkbox.styles.js.map +1 -1
- package/components/CurrencyLabel/CurrencyLabel/CurrencyLabel.js +5 -11
- package/components/CurrencyLabel/CurrencyLabel/CurrencyLabel.js.map +1 -1
- package/components/DateInput/DateInput/DateInput.js +2 -1
- package/components/DateInput/DateInput/DateInput.js.map +1 -1
- package/components/DatePicker/DatePicker/DatePicker.js +12 -4
- package/components/DatePicker/DatePicker/DatePicker.js.map +1 -1
- package/components/DatePicker/DatePicker.d.ts +3 -2
- package/components/Dropdown/Dropdown/Dropdown.js +1 -0
- package/components/Dropdown/Dropdown/Dropdown.js.map +1 -1
- package/components/Dropdown/Dropdown.d.ts +1 -0
- package/components/Dropdown/Dropdown.md +0 -1
- package/components/DropdownMenu/DropdownMenu/DropdownMenu.js +1 -1
- package/components/DropdownMenu/DropdownMenu/DropdownMenu.js.map +1 -1
- package/components/DropdownMenu/DropdownMenu.d.ts +17 -3
- package/components/DropdownMenu/DropdownMenu.md +87 -6
- package/components/Kebab/Kebab/Kebab.js +2 -1
- package/components/Kebab/Kebab/Kebab.js.map +1 -1
- package/components/Kebab/Kebab.d.ts +5 -2
- package/components/Kebab/Kebab.md +249 -3
- package/components/MenuHeader/MenuHeader/MenuHeader.js +5 -1
- package/components/MenuHeader/MenuHeader/MenuHeader.js.map +1 -1
- package/components/MenuHeader/MenuHeader.d.ts +5 -1
- package/components/MenuHeader/MenuHeader.md +23 -0
- package/components/MenuItem/MenuItem/MenuItem.js +4 -1
- package/components/MenuItem/MenuItem/MenuItem.js.map +1 -1
- package/components/MenuItem/MenuItem.d.ts +10 -1
- package/components/MenuItem/MenuItem.md +106 -4
- package/components/MenuSeparator/MenuSeparator/MenuSeparator.js +3 -1
- package/components/MenuSeparator/MenuSeparator/MenuSeparator.js.map +1 -1
- package/components/MenuSeparator/MenuSeparator.d.ts +3 -1
- package/components/MenuSeparator/MenuSeparator.md +14 -0
- package/components/Modal/Modal.styles/Modal.styles.js +18 -15
- package/components/Modal/Modal.styles/Modal.styles.js.map +1 -1
- package/components/Modal/Modal.styles.d.ts +1 -0
- package/components/Modal/ModalClose/ModalClose.js +25 -2
- package/components/Modal/ModalClose/ModalClose.js.map +1 -1
- package/components/Textarea/Textarea/Textarea.js +1 -2
- package/components/Textarea/Textarea/Textarea.js.map +1 -1
- package/components/Textarea/Textarea.d.ts +0 -2
- package/components/Toggle/Toggle/Toggle.js +11 -5
- package/components/Toggle/Toggle/Toggle.js.map +1 -1
- package/components/Toggle/Toggle.d.ts +47 -1
- package/components/Toggle/Toggle.md +83 -9
- package/components/Toggle/Toggle.styles/Toggle.styles.js +21 -15
- package/components/Toggle/Toggle.styles/Toggle.styles.js.map +1 -1
- package/components/Toggle/Toggle.styles.d.ts +3 -0
- package/components/TooltipMenu/TooltipMenu/TooltipMenu.js +9 -6
- package/components/TooltipMenu/TooltipMenu/TooltipMenu.js.map +1 -1
- package/components/TooltipMenu/TooltipMenu.d.ts +26 -8
- package/components/TooltipMenu/TooltipMenu.md +76 -8
- package/internal/CommonWrapper/CommonWrapper/CommonWrapper.js.map +1 -1
- package/internal/CommonWrapper/CommonWrapper.d.ts +9 -1
- package/internal/CustomComboBox/ComboBoxView/ComboBoxView.js +2 -1
- package/internal/CustomComboBox/ComboBoxView/ComboBoxView.js.map +1 -1
- package/internal/CustomComboBox/CustomComboBoxReducer/CustomComboBoxReducer.js +3 -2
- package/internal/CustomComboBox/CustomComboBoxReducer/CustomComboBoxReducer.js.map +1 -1
- package/internal/InputLikeText/InputLikeText/InputLikeText.js +6 -3
- package/internal/InputLikeText/InputLikeText/InputLikeText.js.map +1 -1
- package/internal/InputLikeText/InputLikeText.d.ts +1 -0
- package/internal/InputLikeText/InputLikeText.styles/InputLikeText.styles.js +1 -1
- package/internal/InputLikeText/InputLikeText.styles/InputLikeText.styles.js.map +1 -1
- package/internal/InputLikeText/InputLikeText.styles.d.ts +1 -1
- package/internal/RenderContainer/RenderContainer/RenderContainer.js +2 -1
- package/internal/RenderContainer/RenderContainer/RenderContainer.js.map +1 -1
- package/internal/ThemeShowcase/VariablesCollector.d.ts +1 -1
- package/internal/themes/DefaultTheme/DefaultTheme.js +16 -1
- package/internal/themes/DefaultTheme/DefaultTheme.js.map +1 -1
- package/internal/themes/DefaultTheme.d.ts +3 -0
- package/lib/Upgrades/Upgrades.js +13 -0
- package/lib/Upgrades/Upgrades.js.map +1 -1
- package/lib/Upgrades.d.ts +2 -0
- package/lib/theming/Emotion/Emotion.js +1 -1
- package/lib/theming/Emotion/Emotion.js.map +1 -1
- package/package.json +2 -2
- package/cjs/components/CurrencyLabel/CurrencyLabel.styles.d.ts +0 -4
- package/cjs/components/CurrencyLabel/CurrencyLabel.styles.js +0 -9
- package/cjs/components/CurrencyLabel/CurrencyLabel.styles.js.map +0 -1
- package/components/CurrencyLabel/CurrencyLabel.styles/CurrencyLabel.styles.js +0 -10
- package/components/CurrencyLabel/CurrencyLabel.styles/CurrencyLabel.styles.js.map +0 -1
- package/components/CurrencyLabel/CurrencyLabel.styles/package.json +0 -6
- package/components/CurrencyLabel/CurrencyLabel.styles.d.ts +0 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Textarea.tsx"],"names":["React","PropTypes","throttle","raf","isKeyEnter","polyfillPlaceholder","LayoutEvents","ThemeContext","RenderLayer","ResizeDetector","isBrowser","isIE11","CommonWrapper","isTestEnv","cx","getTextAreaHeight","styles","TextareaCounter","DEFAULT_WIDTH","AUTORESIZE_THROTTLE_DEFAULT_WAIT","Textarea","state","rows","isCounterVisible","reflowCounter","counter","reflow","theme","selectAllId","node","fakeNode","layoutEvents","textareaObserver","MutationObserver","setSelectionRange","start","end","Error","document","activeElement","focus","selectAll","value","length","delaySelectAll","cancelDelayedSelectAll","cancel","renderMain","props","width","error","warning","autoResize","resize","onCut","onPaste","maxRows","onFocus","selectAllOnFocus","placeholder","onValueChange","showLengthCounter","lengthCounter","counterHelp","extraRow","disableAnimations","textareaProps","rootProps","style","textareaClassNames","textarea","isAnimationsDisabled","textareaStyle","placeholderPolyfill","fakeTextarea","fakeProps","defaultValue","className","fake","readOnly","refFake","maxLength","handleCloseCounterHelp","refCounter","root","undefined","ref","handleChange","handleCut","handlePaste","handleFocus","handleKeyDown","children","setState","e","toString","isBlockEnter","preventDefault","onKeyDown","fieldIsEmpty","target","onChange","element","autoResizeHandler","minRows","parseInt","height","exceededMaxHeight","overflowY","getAutoResizeThrottleWait","event","componentDidMount","addListener","observe","attributes","componentWillUnmount","remove","disconnect","componentDidUpdate","prevProps","render","blur","Component","__KONTUR_REACT_UI__","propTypes","bool","disabled","oneOfType","string","number","id","name","title","spellCheck","role","tabIndex","func","onMouseEnter","onMouseLeave","onMouseOver","onMouseMove","onMouseOut","onMouseUp","onMouseDown","onClick","onDoubleClick","onKeyPress","onKeyUp","onInput","onBlur","onScroll","onWheel","onCopy","defaultProps"],"mappings":"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","sourcesContent":["import React, { ReactNode } from 'react';\nimport PropTypes from 'prop-types';\nimport throttle from 'lodash.throttle';\nimport raf from 'raf';\n\nimport { isKeyEnter } from '../../lib/events/keyboard/identifiers';\nimport { polyfillPlaceholder } from '../../lib/polyfillPlaceholder';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable, Override } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { RenderLayer } from '../../internal/RenderLayer';\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { isBrowser, isIE11 } from '../../lib/client';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { getTextAreaHeight } from './TextareaHelpers';\nimport { styles } from './Textarea.styles';\nimport { TextareaCounter, TextareaCounterRef } from './TextareaCounter';\n\nconst DEFAULT_WIDTH = 250;\nconst AUTORESIZE_THROTTLE_DEFAULT_WAIT = 100;\n\nexport interface TextareaProps\n extends CommonProps,\n Override<\n React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n {\n /** Ошибка */\n error?: boolean;\n /** Предупреждение */\n warning?: boolean;\n /** Не активное состояние */\n disabled?: boolean;\n\n /**\n * Атоматический ресайз\n * в зависимости от содержимого\n */\n autoResize?: boolean;\n /**\n * Число строк\n */\n rows: number;\n /**\n * Максимальное число строк при\n * автоматическом ресайзе\n */\n maxRows: string | number;\n\n /**\n * Стандартный ресайз\n * Попадает в `style`\n */\n resize?: React.CSSProperties['resize'];\n\n /**\n * Ширина\n */\n width?: React.CSSProperties['width'];\n\n /**\n * Вызывается при изменении `value`\n */\n onValueChange?: (value: string) => void;\n\n /** Выделение значения при фокусе */\n selectAllOnFocus?: boolean;\n\n /** Показывать счетчик символов */\n showLengthCounter?: boolean;\n\n /** Допустимое количество символов в поле. Отображается в счетчике.\n * Если не указано, равно `maxLength`\n */\n lengthCounter?: number;\n\n /** Подсказка к счетчику символов.\n *\n * По умолчанию - тултип с содежимым из пропа, если передан`ReactNode`.\n *\n * Передав функцию, можно переопределить подсказку целиком, вместе с иконкой. Например,\n *\n * ```\n * counterHelp={() => <Tooltip render={...}><HelpIcon /></Tooltip>}\n * ```\n * */\n counterHelp?: ReactNode | (() => ReactNode);\n\n /** Добавлять дополнительную свободную строку при авто-ресайзе.\n * @see https://guides.kontur.ru/components/textarea/#04\n * */\n extraRow: boolean;\n\n /** Отключать анимацию при авто-ресайзе.\n * Автоматически отключается когда в `extraRow` передан `false`.\n */\n disableAnimations: boolean;\n }\n > {}\n\nexport interface TextareaState {\n polyfillPlaceholder: boolean;\n rows: number | string;\n isCounterVisible: boolean;\n}\n\n/**\n * Компонент для ввода многострочного текста.\n *\n * Принимает все атрибуты `React.TextareaHTMLAttributes<HTMLTextAreaElement>`\n *\n * ** `className` и `style` игнорируются**\n */\nexport class Textarea extends React.Component<TextareaProps, TextareaState> {\n public static __KONTUR_REACT_UI__ = 'Textarea';\n\n public static propTypes = {\n error: PropTypes.bool,\n warning: PropTypes.bool,\n disabled: PropTypes.bool,\n\n autoResize: PropTypes.bool,\n extraRow: PropTypes.bool,\n disableAnimations: PropTypes.bool,\n maxRows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n resize: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n id: PropTypes.string,\n name: PropTypes.string,\n title: PropTypes.string,\n spellCheck: PropTypes.bool,\n role: PropTypes.string,\n maxLength: PropTypes.number,\n tabIndex: PropTypes.number,\n rows: PropTypes.number,\n placeholder: PropTypes.string,\n\n value: PropTypes.string,\n defaultValue: PropTypes.string,\n onValueChange: PropTypes.func,\n\n onMouseEnter: PropTypes.func,\n onMouseLeave: PropTypes.func,\n onMouseOver: PropTypes.func,\n onMouseMove: PropTypes.func,\n onMouseOut: PropTypes.func,\n\n onMouseUp: PropTypes.func,\n onMouseDown: PropTypes.func,\n onClick: PropTypes.func,\n onDoubleClick: PropTypes.func,\n\n onKeyDown: PropTypes.func,\n onKeyPress: PropTypes.func,\n onKeyUp: PropTypes.func,\n onInput: PropTypes.func,\n\n onFocus: PropTypes.func,\n onBlur: PropTypes.func,\n\n onScroll: PropTypes.func,\n onWheel: PropTypes.func,\n\n onCut: PropTypes.func,\n onPaste: PropTypes.func,\n onCopy: PropTypes.func,\n };\n\n public static defaultProps = {\n rows: 3,\n maxRows: 15,\n extraRow: true,\n disableAnimations: isTestEnv,\n };\n\n public state = {\n polyfillPlaceholder,\n rows: 1,\n isCounterVisible: false,\n };\n private reflowCounter = () => {\n if (this.counter) {\n this.counter.reflow();\n }\n };\n\n private theme!: Theme;\n private selectAllId: number | null = null;\n private node: Nullable<HTMLTextAreaElement>;\n private fakeNode: Nullable<HTMLTextAreaElement>;\n private counter: Nullable<TextareaCounterRef>;\n private layoutEvents: Nullable<{ remove: () => void }>;\n private textareaObserver = isBrowser ? new MutationObserver(this.reflowCounter) : null;\n private getAutoResizeThrottleWait(props: TextareaProps = this.props): number {\n // NOTE: При отключении анимации остается эффект дергания при авто-ресайзе из-за троттлинга расчета высоты\n // Поэтому выставляем таймаут троттла в ноль. Подробности - https://github.com/skbkontur/retail-ui/issues/2120\n return this.isAnimationsDisabled(props) ? 0 : AUTORESIZE_THROTTLE_DEFAULT_WAIT;\n }\n private isAnimationsDisabled({ disableAnimations, extraRow }: TextareaProps = this.props): boolean {\n return disableAnimations || !extraRow;\n }\n\n public componentDidMount() {\n if (this.props.autoResize) {\n this.autoResize();\n this.layoutEvents = LayoutEvents.addListener(this.autoResize);\n }\n\n if (this.node && this.props.showLengthCounter && this.textareaObserver) {\n this.textareaObserver.observe(this.node, { attributes: true });\n }\n }\n\n public componentWillUnmount() {\n if (this.layoutEvents) {\n this.layoutEvents.remove();\n }\n if (this.props.showLengthCounter && this.textareaObserver) {\n this.textareaObserver.disconnect();\n }\n this.cancelDelayedSelectAll();\n }\n\n public componentDidUpdate(prevProps: TextareaProps) {\n if (this.getAutoResizeThrottleWait() !== this.getAutoResizeThrottleWait(prevProps)) {\n this.autoResize.cancel();\n this.autoResize = throttle(this.autoResizeHandler, this.getAutoResizeThrottleWait());\n }\n if ((this.props.autoResize && this.props.rows > this.state.rows) || this.props.value !== prevProps.value) {\n this.autoResize();\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return <CommonWrapper {...this.props}>{this.renderMain}</CommonWrapper>;\n }}\n </ThemeContext.Consumer>\n );\n }\n\n /**\n * @public\n */\n public focus() {\n if (this.node) {\n this.node.focus();\n }\n }\n\n /**\n * @public\n */\n public blur() {\n if (this.node) {\n this.node.blur();\n }\n }\n\n /**\n * @public\n * @param {number} start\n * @param {number} end\n */\n public setSelectionRange = (start: number, end: number) => {\n if (!this.node) {\n throw new Error('Cannot call \"setSelectionRange\" on unmounted Input');\n }\n\n if (document.activeElement !== this.node) {\n this.focus();\n }\n\n this.node.setSelectionRange(start, end);\n };\n\n /**\n * @public\n */\n public selectAll = () => {\n if (this.node) {\n this.setSelectionRange(0, this.node.value.length);\n }\n };\n\n private delaySelectAll = (): number => (this.selectAllId = raf(this.selectAll));\n\n private cancelDelayedSelectAll = (): void => {\n if (this.selectAllId) {\n raf.cancel(this.selectAllId);\n this.selectAllId = null;\n }\n };\n\n private renderMain = (props: CommonWrapperRestProps<TextareaProps>) => {\n const {\n width = DEFAULT_WIDTH,\n error,\n warning,\n autoResize,\n resize,\n onCut,\n onPaste,\n maxRows,\n onFocus,\n selectAllOnFocus,\n placeholder,\n onValueChange,\n showLengthCounter,\n lengthCounter,\n counterHelp,\n extraRow,\n disableAnimations,\n ...textareaProps\n } = props;\n\n const { isCounterVisible } = this.state;\n\n const rootProps = {\n style: {\n width,\n },\n };\n\n const textareaClassNames = cx({\n [styles.textarea(this.theme)]: true,\n [styles.error(this.theme)]: !!error,\n [styles.warning(this.theme)]: !!warning,\n [styles.disableAnimations()]: this.isAnimationsDisabled(),\n });\n\n const textareaStyle = {\n resize: autoResize ? 'none' : resize,\n };\n\n let placeholderPolyfill = null;\n\n if (this.state.polyfillPlaceholder && !textareaProps.value) {\n placeholderPolyfill = <span className={styles.placeholder()}>{placeholder}</span>;\n }\n\n let fakeTextarea = null;\n if (autoResize) {\n const fakeProps = {\n value: this.props.value,\n defaultValue: this.props.defaultValue,\n className: cx(textareaClassNames, styles.fake()),\n readOnly: true,\n };\n fakeTextarea = <textarea {...fakeProps} ref={this.refFake} />;\n }\n\n const counter = showLengthCounter && isCounterVisible && this.node && (\n <TextareaCounter\n textarea={this.node}\n help={counterHelp}\n value={textareaProps.value}\n length={textareaProps.maxLength ?? lengthCounter ?? 0}\n onCloseHelp={this.handleCloseCounterHelp}\n ref={this.refCounter}\n />\n );\n\n return (\n <RenderLayer\n onFocusOutside={this.handleCloseCounterHelp}\n onClickOutside={this.handleCloseCounterHelp}\n active={this.state.isCounterVisible}\n >\n <label {...rootProps} className={styles.root(this.theme)}>\n {placeholderPolyfill}\n <ResizeDetector onResize={this.reflowCounter}>\n <textarea\n {...textareaProps}\n className={textareaClassNames}\n style={textareaStyle}\n placeholder={!placeholderPolyfill ? placeholder : undefined}\n ref={this.ref}\n onChange={this.handleChange}\n onCut={this.handleCut}\n onPaste={this.handlePaste}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n >\n {this.props.children}\n </textarea>\n </ResizeDetector>\n {fakeTextarea}\n {counter}\n </label>\n </RenderLayer>\n );\n };\n\n private handleCloseCounterHelp = () => this.setState({ isCounterVisible: false });\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n // Edge bug: textarea maxlength doesn't work after new line\n // https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/18833616/\n const value = this.props.value !== undefined ? this.props.value.toString() : null;\n const isBlockEnter = isKeyEnter(e) && value !== null && value.length === this.props.maxLength;\n\n if (isBlockEnter) {\n e.preventDefault();\n }\n\n if (this.props.onKeyDown) {\n this.props.onKeyDown(e);\n }\n };\n\n private handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n if (polyfillPlaceholder) {\n const fieldIsEmpty = e.target.value === '';\n\n if (this.state.polyfillPlaceholder !== fieldIsEmpty) {\n this.setState({ polyfillPlaceholder: fieldIsEmpty });\n }\n }\n\n if (this.props.onValueChange) {\n this.props.onValueChange(e.target.value);\n }\n\n if (this.props.autoResize) {\n this.autoResize();\n }\n\n if (this.props.onChange) {\n this.props.onChange(e);\n }\n\n this.reflowCounter();\n };\n\n private ref = (element: HTMLTextAreaElement) => {\n this.node = element;\n };\n\n private refFake = (element: HTMLTextAreaElement) => {\n this.fakeNode = element;\n };\n\n private refCounter = (ref: TextareaCounterRef | null) => {\n this.counter = ref;\n };\n\n private autoResizeHandler = () => {\n const fakeNode = this.fakeNode;\n if (!fakeNode) {\n return;\n }\n const node = this.node;\n if (!node) {\n return;\n }\n if (this.props.value === undefined) {\n fakeNode.value = node.value;\n }\n\n const { rows, maxRows, extraRow } = this.props;\n if (rows === undefined || maxRows === undefined) {\n return;\n }\n const { height, exceededMaxHeight } = getTextAreaHeight({\n node: fakeNode,\n minRows: typeof rows === 'number' ? rows : parseInt(rows, 10),\n maxRows: typeof maxRows === 'number' ? maxRows : parseInt(maxRows, 10),\n extraRow,\n });\n node.style.height = height + 'px';\n node.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';\n fakeNode.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';\n };\n\n private autoResize = throttle(this.autoResizeHandler, this.getAutoResizeThrottleWait());\n\n private handleCut = (event: React.ClipboardEvent<HTMLTextAreaElement>) => {\n if (this.props.autoResize) {\n this.autoResize();\n }\n\n if (this.props.onCut) {\n this.props.onCut(event);\n }\n\n this.reflowCounter();\n };\n\n private handlePaste = (event: React.ClipboardEvent<HTMLTextAreaElement>) => {\n if (this.props.autoResize) {\n this.autoResize();\n }\n\n if (this.props.onPaste) {\n this.props.onPaste(event);\n }\n\n this.reflowCounter();\n };\n\n private handleFocus = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n this.setState({ isCounterVisible: true });\n\n if (this.props.selectAllOnFocus) {\n // https://github.com/facebook/react/issues/7769\n this.node && !isIE11 ? this.selectAll() : this.delaySelectAll();\n }\n\n if (this.props.onFocus) {\n this.props.onFocus(event);\n }\n };\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["Textarea.tsx"],"names":["React","PropTypes","throttle","raf","isKeyEnter","polyfillPlaceholder","LayoutEvents","ThemeContext","RenderLayer","ResizeDetector","isBrowser","isIE11","CommonWrapper","isTestEnv","cx","getTextAreaHeight","styles","TextareaCounter","DEFAULT_WIDTH","AUTORESIZE_THROTTLE_DEFAULT_WAIT","Textarea","state","isCounterVisible","reflowCounter","counter","reflow","theme","selectAllId","node","fakeNode","layoutEvents","textareaObserver","MutationObserver","setSelectionRange","start","end","Error","document","activeElement","focus","selectAll","value","length","delaySelectAll","cancelDelayedSelectAll","cancel","renderMain","props","width","error","warning","autoResize","resize","onCut","onPaste","maxRows","onFocus","selectAllOnFocus","placeholder","onValueChange","showLengthCounter","lengthCounter","counterHelp","extraRow","disableAnimations","textareaProps","rootProps","style","textareaClassNames","textarea","isAnimationsDisabled","textareaStyle","placeholderPolyfill","fakeTextarea","fakeProps","defaultValue","className","fake","readOnly","refFake","maxLength","handleCloseCounterHelp","refCounter","root","undefined","ref","handleChange","handleCut","handlePaste","handleFocus","handleKeyDown","children","setState","e","toString","isBlockEnter","preventDefault","onKeyDown","fieldIsEmpty","target","onChange","element","autoResizeHandler","rows","minRows","parseInt","height","exceededMaxHeight","overflowY","getAutoResizeThrottleWait","event","componentDidMount","addListener","observe","attributes","componentWillUnmount","remove","disconnect","componentDidUpdate","prevProps","render","blur","Component","__KONTUR_REACT_UI__","propTypes","bool","disabled","oneOfType","string","number","id","name","title","spellCheck","role","tabIndex","func","onMouseEnter","onMouseLeave","onMouseOver","onMouseMove","onMouseOut","onMouseUp","onMouseDown","onClick","onDoubleClick","onKeyPress","onKeyUp","onInput","onBlur","onScroll","onWheel","onCopy","defaultProps"],"mappings":"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","sourcesContent":["import React, { ReactNode } from 'react';\nimport PropTypes from 'prop-types';\nimport throttle from 'lodash.throttle';\nimport raf from 'raf';\n\nimport { isKeyEnter } from '../../lib/events/keyboard/identifiers';\nimport { polyfillPlaceholder } from '../../lib/polyfillPlaceholder';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable, Override } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { RenderLayer } from '../../internal/RenderLayer';\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { isBrowser, isIE11 } from '../../lib/client';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { getTextAreaHeight } from './TextareaHelpers';\nimport { styles } from './Textarea.styles';\nimport { TextareaCounter, TextareaCounterRef } from './TextareaCounter';\n\nconst DEFAULT_WIDTH = 250;\nconst AUTORESIZE_THROTTLE_DEFAULT_WAIT = 100;\n\nexport interface TextareaProps\n extends CommonProps,\n Override<\n React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n {\n /** Ошибка */\n error?: boolean;\n /** Предупреждение */\n warning?: boolean;\n /** Не активное состояние */\n disabled?: boolean;\n\n /**\n * Атоматический ресайз\n * в зависимости от содержимого\n */\n autoResize?: boolean;\n /**\n * Число строк\n */\n rows: number;\n /**\n * Максимальное число строк при\n * автоматическом ресайзе\n */\n maxRows: string | number;\n\n /**\n * Стандартный ресайз\n * Попадает в `style`\n */\n resize?: React.CSSProperties['resize'];\n\n /**\n * Ширина\n */\n width?: React.CSSProperties['width'];\n\n /**\n * Вызывается при изменении `value`\n */\n onValueChange?: (value: string) => void;\n\n /** Выделение значения при фокусе */\n selectAllOnFocus?: boolean;\n\n /** Показывать счетчик символов */\n showLengthCounter?: boolean;\n\n /** Допустимое количество символов в поле. Отображается в счетчике.\n * Если не указано, равно `maxLength`\n */\n lengthCounter?: number;\n\n /** Подсказка к счетчику символов.\n *\n * По умолчанию - тултип с содежимым из пропа, если передан`ReactNode`.\n *\n * Передав функцию, можно переопределить подсказку целиком, вместе с иконкой. Например,\n *\n * ```\n * counterHelp={() => <Tooltip render={...}><HelpIcon /></Tooltip>}\n * ```\n * */\n counterHelp?: ReactNode | (() => ReactNode);\n\n /** Добавлять дополнительную свободную строку при авто-ресайзе.\n * @see https://guides.kontur.ru/components/textarea/#04\n * */\n extraRow: boolean;\n\n /** Отключать анимацию при авто-ресайзе.\n * Автоматически отключается когда в `extraRow` передан `false`.\n */\n disableAnimations: boolean;\n }\n > {}\n\nexport interface TextareaState {\n polyfillPlaceholder: boolean;\n isCounterVisible: boolean;\n}\n\n/**\n * Компонент для ввода многострочного текста.\n *\n * Принимает все атрибуты `React.TextareaHTMLAttributes<HTMLTextAreaElement>`\n *\n * ** `className` и `style` игнорируются**\n */\nexport class Textarea extends React.Component<TextareaProps, TextareaState> {\n public static __KONTUR_REACT_UI__ = 'Textarea';\n\n public static propTypes = {\n error: PropTypes.bool,\n warning: PropTypes.bool,\n disabled: PropTypes.bool,\n\n autoResize: PropTypes.bool,\n extraRow: PropTypes.bool,\n disableAnimations: PropTypes.bool,\n maxRows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n resize: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n id: PropTypes.string,\n name: PropTypes.string,\n title: PropTypes.string,\n spellCheck: PropTypes.bool,\n role: PropTypes.string,\n maxLength: PropTypes.number,\n tabIndex: PropTypes.number,\n rows: PropTypes.number,\n placeholder: PropTypes.string,\n\n value: PropTypes.string,\n defaultValue: PropTypes.string,\n onValueChange: PropTypes.func,\n\n onMouseEnter: PropTypes.func,\n onMouseLeave: PropTypes.func,\n onMouseOver: PropTypes.func,\n onMouseMove: PropTypes.func,\n onMouseOut: PropTypes.func,\n\n onMouseUp: PropTypes.func,\n onMouseDown: PropTypes.func,\n onClick: PropTypes.func,\n onDoubleClick: PropTypes.func,\n\n onKeyDown: PropTypes.func,\n onKeyPress: PropTypes.func,\n onKeyUp: PropTypes.func,\n onInput: PropTypes.func,\n\n onFocus: PropTypes.func,\n onBlur: PropTypes.func,\n\n onScroll: PropTypes.func,\n onWheel: PropTypes.func,\n\n onCut: PropTypes.func,\n onPaste: PropTypes.func,\n onCopy: PropTypes.func,\n };\n\n public static defaultProps = {\n rows: 3,\n maxRows: 15,\n extraRow: true,\n disableAnimations: isTestEnv,\n };\n\n public state = {\n polyfillPlaceholder,\n isCounterVisible: false,\n };\n private reflowCounter = () => {\n if (this.counter) {\n this.counter.reflow();\n }\n };\n\n private theme!: Theme;\n private selectAllId: number | null = null;\n private node: Nullable<HTMLTextAreaElement>;\n private fakeNode: Nullable<HTMLTextAreaElement>;\n private counter: Nullable<TextareaCounterRef>;\n private layoutEvents: Nullable<{ remove: () => void }>;\n private textareaObserver = isBrowser ? new MutationObserver(this.reflowCounter) : null;\n private getAutoResizeThrottleWait(props: TextareaProps = this.props): number {\n // NOTE: При отключении анимации остается эффект дергания при авто-ресайзе из-за троттлинга расчета высоты\n // Поэтому выставляем таймаут троттла в ноль. Подробности - https://github.com/skbkontur/retail-ui/issues/2120\n return this.isAnimationsDisabled(props) ? 0 : AUTORESIZE_THROTTLE_DEFAULT_WAIT;\n }\n private isAnimationsDisabled({ disableAnimations, extraRow }: TextareaProps = this.props): boolean {\n return disableAnimations || !extraRow;\n }\n\n public componentDidMount() {\n if (this.props.autoResize) {\n this.autoResize();\n this.layoutEvents = LayoutEvents.addListener(this.autoResize);\n }\n\n if (this.node && this.props.showLengthCounter && this.textareaObserver) {\n this.textareaObserver.observe(this.node, { attributes: true });\n }\n }\n\n public componentWillUnmount() {\n if (this.layoutEvents) {\n this.layoutEvents.remove();\n }\n if (this.props.showLengthCounter && this.textareaObserver) {\n this.textareaObserver.disconnect();\n }\n this.cancelDelayedSelectAll();\n }\n\n public componentDidUpdate(prevProps: TextareaProps) {\n if (this.getAutoResizeThrottleWait() !== this.getAutoResizeThrottleWait(prevProps)) {\n this.autoResize.cancel();\n this.autoResize = throttle(this.autoResizeHandler, this.getAutoResizeThrottleWait());\n }\n if (\n this.props.autoResize &&\n (this.props.rows !== prevProps.rows ||\n this.props.maxRows !== prevProps.maxRows ||\n this.props.value !== prevProps.value)\n ) {\n this.autoResize();\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return <CommonWrapper {...this.props}>{this.renderMain}</CommonWrapper>;\n }}\n </ThemeContext.Consumer>\n );\n }\n\n /**\n * @public\n */\n public focus() {\n if (this.node) {\n this.node.focus();\n }\n }\n\n /**\n * @public\n */\n public blur() {\n if (this.node) {\n this.node.blur();\n }\n }\n\n /**\n * @public\n * @param {number} start\n * @param {number} end\n */\n public setSelectionRange = (start: number, end: number) => {\n if (!this.node) {\n throw new Error('Cannot call \"setSelectionRange\" on unmounted Input');\n }\n\n if (document.activeElement !== this.node) {\n this.focus();\n }\n\n this.node.setSelectionRange(start, end);\n };\n\n /**\n * @public\n */\n public selectAll = () => {\n if (this.node) {\n this.setSelectionRange(0, this.node.value.length);\n }\n };\n\n private delaySelectAll = (): number => (this.selectAllId = raf(this.selectAll));\n\n private cancelDelayedSelectAll = (): void => {\n if (this.selectAllId) {\n raf.cancel(this.selectAllId);\n this.selectAllId = null;\n }\n };\n\n private renderMain = (props: CommonWrapperRestProps<TextareaProps>) => {\n const {\n width = DEFAULT_WIDTH,\n error,\n warning,\n autoResize,\n resize,\n onCut,\n onPaste,\n maxRows,\n onFocus,\n selectAllOnFocus,\n placeholder,\n onValueChange,\n showLengthCounter,\n lengthCounter,\n counterHelp,\n extraRow,\n disableAnimations,\n ...textareaProps\n } = props;\n\n const { isCounterVisible } = this.state;\n\n const rootProps = {\n style: {\n width,\n },\n };\n\n const textareaClassNames = cx({\n [styles.textarea(this.theme)]: true,\n [styles.error(this.theme)]: !!error,\n [styles.warning(this.theme)]: !!warning,\n [styles.disableAnimations()]: this.isAnimationsDisabled(),\n });\n\n const textareaStyle = {\n resize: autoResize ? 'none' : resize,\n };\n\n let placeholderPolyfill = null;\n\n if (this.state.polyfillPlaceholder && !textareaProps.value) {\n placeholderPolyfill = <span className={styles.placeholder()}>{placeholder}</span>;\n }\n\n let fakeTextarea = null;\n if (autoResize) {\n const fakeProps = {\n value: this.props.value,\n defaultValue: this.props.defaultValue,\n className: cx(textareaClassNames, styles.fake()),\n readOnly: true,\n };\n fakeTextarea = <textarea {...fakeProps} ref={this.refFake} />;\n }\n\n const counter = showLengthCounter && isCounterVisible && this.node && (\n <TextareaCounter\n textarea={this.node}\n help={counterHelp}\n value={textareaProps.value}\n length={textareaProps.maxLength ?? lengthCounter ?? 0}\n onCloseHelp={this.handleCloseCounterHelp}\n ref={this.refCounter}\n />\n );\n\n return (\n <RenderLayer\n onFocusOutside={this.handleCloseCounterHelp}\n onClickOutside={this.handleCloseCounterHelp}\n active={this.state.isCounterVisible}\n >\n <label {...rootProps} className={styles.root(this.theme)}>\n {placeholderPolyfill}\n <ResizeDetector onResize={this.reflowCounter}>\n <textarea\n {...textareaProps}\n className={textareaClassNames}\n style={textareaStyle}\n placeholder={!placeholderPolyfill ? placeholder : undefined}\n ref={this.ref}\n onChange={this.handleChange}\n onCut={this.handleCut}\n onPaste={this.handlePaste}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n >\n {this.props.children}\n </textarea>\n </ResizeDetector>\n {fakeTextarea}\n {counter}\n </label>\n </RenderLayer>\n );\n };\n\n private handleCloseCounterHelp = () => this.setState({ isCounterVisible: false });\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n // Edge bug: textarea maxlength doesn't work after new line\n // https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/18833616/\n const value = this.props.value !== undefined ? this.props.value.toString() : null;\n const isBlockEnter = isKeyEnter(e) && value !== null && value.length === this.props.maxLength;\n\n if (isBlockEnter) {\n e.preventDefault();\n }\n\n if (this.props.onKeyDown) {\n this.props.onKeyDown(e);\n }\n };\n\n private handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n if (polyfillPlaceholder) {\n const fieldIsEmpty = e.target.value === '';\n\n if (this.state.polyfillPlaceholder !== fieldIsEmpty) {\n this.setState({ polyfillPlaceholder: fieldIsEmpty });\n }\n }\n\n if (this.props.onValueChange) {\n this.props.onValueChange(e.target.value);\n }\n\n if (this.props.autoResize) {\n this.autoResize();\n }\n\n if (this.props.onChange) {\n this.props.onChange(e);\n }\n\n this.reflowCounter();\n };\n\n private ref = (element: HTMLTextAreaElement) => {\n this.node = element;\n };\n\n private refFake = (element: HTMLTextAreaElement) => {\n this.fakeNode = element;\n };\n\n private refCounter = (ref: TextareaCounterRef | null) => {\n this.counter = ref;\n };\n\n private autoResizeHandler = () => {\n const fakeNode = this.fakeNode;\n if (!fakeNode) {\n return;\n }\n const node = this.node;\n if (!node) {\n return;\n }\n if (this.props.value === undefined) {\n fakeNode.value = node.value;\n }\n\n const { rows, maxRows, extraRow } = this.props;\n if (rows === undefined || maxRows === undefined) {\n return;\n }\n const { height, exceededMaxHeight } = getTextAreaHeight({\n node: fakeNode,\n minRows: typeof rows === 'number' ? rows : parseInt(rows, 10),\n maxRows: typeof maxRows === 'number' ? maxRows : parseInt(maxRows, 10),\n extraRow,\n });\n node.style.height = height + 'px';\n node.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';\n fakeNode.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';\n };\n\n private autoResize = throttle(this.autoResizeHandler, this.getAutoResizeThrottleWait());\n\n private handleCut = (event: React.ClipboardEvent<HTMLTextAreaElement>) => {\n if (this.props.autoResize) {\n this.autoResize();\n }\n\n if (this.props.onCut) {\n this.props.onCut(event);\n }\n\n this.reflowCounter();\n };\n\n private handlePaste = (event: React.ClipboardEvent<HTMLTextAreaElement>) => {\n if (this.props.autoResize) {\n this.autoResize();\n }\n\n if (this.props.onPaste) {\n this.props.onPaste(event);\n }\n\n this.reflowCounter();\n };\n\n private handleFocus = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n this.setState({ isCounterVisible: true });\n\n if (this.props.selectAllOnFocus) {\n // https://github.com/facebook/react/issues/7769\n this.node && !isIE11 ? this.selectAll() : this.delaySelectAll();\n }\n\n if (this.props.onFocus) {\n this.props.onFocus(event);\n }\n };\n}\n"]}
|
|
@@ -67,7 +67,6 @@ export interface TextareaProps extends CommonProps, Override<React.TextareaHTMLA
|
|
|
67
67
|
}
|
|
68
68
|
export interface TextareaState {
|
|
69
69
|
polyfillPlaceholder: boolean;
|
|
70
|
-
rows: number | string;
|
|
71
70
|
isCounterVisible: boolean;
|
|
72
71
|
}
|
|
73
72
|
/**
|
|
@@ -130,7 +129,6 @@ export declare class Textarea extends React.Component<TextareaProps, TextareaSta
|
|
|
130
129
|
};
|
|
131
130
|
state: {
|
|
132
131
|
polyfillPlaceholder: boolean;
|
|
133
|
-
rows: number;
|
|
134
132
|
isCounterVisible: boolean;
|
|
135
133
|
};
|
|
136
134
|
private reflowCounter;
|
|
@@ -8,6 +8,10 @@ import { CommonWrapper } from "../../../internal/CommonWrapper";
|
|
|
8
8
|
import { cx } from "../../../lib/theming/Emotion";
|
|
9
9
|
import { styles, globalClasses } from "../Toggle.styles";
|
|
10
10
|
var colorWarningShown = false;
|
|
11
|
+
/**
|
|
12
|
+
* _Примечание:_ под тоглом понимается полный компонент т.е. надпись + переключатель, а не просто переключатель.
|
|
13
|
+
*/
|
|
14
|
+
|
|
11
15
|
export var Toggle = /*#__PURE__*/function (_React$Component) {
|
|
12
16
|
_inheritsLoose(Toggle, _React$Component);
|
|
13
17
|
|
|
@@ -106,17 +110,18 @@ export var Toggle = /*#__PURE__*/function (_React$Component) {
|
|
|
106
110
|
warning = _this$props.warning,
|
|
107
111
|
error = _this$props.error,
|
|
108
112
|
loading = _this$props.loading,
|
|
109
|
-
color = _this$props.color
|
|
113
|
+
color = _this$props.color,
|
|
114
|
+
id = _this$props.id;
|
|
110
115
|
var disabled = this.props.disabled || loading;
|
|
111
116
|
var checked = this.isUncontrolled() ? this.state.checked : this.props.checked;
|
|
112
117
|
var containerClassNames = cx(styles.container(this.theme), (_cx = {}, _cx[styles.containerDisabled(this.theme)] = !!disabled, _cx[globalClasses.container] = true, _cx[globalClasses.containerDisabled] = !!disabled, _cx[globalClasses.containerLoading] = loading, _cx));
|
|
113
|
-
var labelClassNames = cx(styles.root(this.theme), (_cx2 = {}, _cx2[styles.rootLeft()] = captionPosition === 'left', _cx2[styles.disabled()] = !!disabled, _cx2));
|
|
118
|
+
var labelClassNames = cx(styles.root(this.theme), (_cx2 = {}, _cx2[styles.rootLeft()] = captionPosition === 'left', _cx2[styles.disabled()] = !!disabled, _cx2[globalClasses.disabled] = !!disabled, _cx2));
|
|
114
119
|
var caption = null;
|
|
115
120
|
|
|
116
121
|
if (children) {
|
|
117
122
|
var _cx3;
|
|
118
123
|
|
|
119
|
-
var captionClass = cx(styles.caption(this.theme), (_cx3 = {}, _cx3[styles.captionLeft(this.theme)] = captionPosition === 'left', _cx3));
|
|
124
|
+
var captionClass = cx(styles.caption(this.theme), (_cx3 = {}, _cx3[styles.captionLeft(this.theme)] = captionPosition === 'left', _cx3[styles.disabledCaption(this.theme)] = !!disabled, _cx3));
|
|
120
125
|
caption = /*#__PURE__*/React.createElement("span", {
|
|
121
126
|
className: captionClass
|
|
122
127
|
}, children);
|
|
@@ -136,7 +141,8 @@ export var Toggle = /*#__PURE__*/function (_React$Component) {
|
|
|
136
141
|
onFocus: this.handleFocus,
|
|
137
142
|
onBlur: this.handleBlur,
|
|
138
143
|
ref: this.inputRef,
|
|
139
|
-
disabled: disabled
|
|
144
|
+
disabled: disabled,
|
|
145
|
+
id: id
|
|
140
146
|
}), /*#__PURE__*/React.createElement("div", {
|
|
141
147
|
className: containerClassNames,
|
|
142
148
|
style: checked && color && !disabled ? {
|
|
@@ -144,7 +150,7 @@ export var Toggle = /*#__PURE__*/function (_React$Component) {
|
|
|
144
150
|
boxShadow: "inset 0 0 0 1px " + color
|
|
145
151
|
} : undefined
|
|
146
152
|
}, /*#__PURE__*/React.createElement("div", {
|
|
147
|
-
className: cx(styles.activeBackground(), globalClasses.background, (_cx5 = {}, _cx5[styles.activeBackgroundLoading(this.theme)] = loading, _cx5)),
|
|
153
|
+
className: cx(styles.activeBackground(), globalClasses.background, (_cx5 = {}, _cx5[styles.activeBackgroundLoading(this.theme)] = loading, _cx5[styles.disabledBackground(this.theme)] = disabled, _cx5)),
|
|
148
154
|
style: checked && color && !disabled ? {
|
|
149
155
|
backgroundColor: color,
|
|
150
156
|
boxShadow: "inset 0 0 0 1px " + color
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Toggle.tsx"],"names":["React","PropTypes","warning","keyListener","ThemeContext","CommonWrapper","cx","styles","globalClasses","colorWarningShown","Toggle","props","theme","input","focus","isTabPressed","inputRef","element","handleChange","event","onValueChange","target","checked","isUncontrolled","setState","onChange","handleFocus","onFocus","focusByTab","handleBlur","onBlur","state","defaultChecked","componentDidMount","autoFocus","render","renderMain","children","captionPosition","error","loading","color","disabled","containerClassNames","container","containerDisabled","containerLoading","labelClassNames","root","rootLeft","caption","captionClass","captionLeft","outline","isWarning","isError","focused","wrapper","backgroundColor","boxShadow","undefined","activeBackground","background","activeBackgroundLoading","handle","handleDisabled","Component","__KONTUR_REACT_UI__","propTypes","bool","func","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport warning from 'warning';\n\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { styles, globalClasses } from './Toggle.styles';\n\nlet colorWarningShown = false;\n\nexport interface ToggleProps extends CommonProps {\n children?: React.ReactNode;\n /**\n * Положение children справа или слева от переключателя\n * @default 'right'\n */\n captionPosition: 'left' | 'right';\n checked?: boolean;\n defaultChecked?: boolean;\n disabled?: boolean;\n onValueChange?: (value: boolean) => void;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n warning?: boolean;\n error?: boolean;\n loading?: boolean;\n autoFocus?: boolean;\n onFocus?: React.FocusEventHandler<HTMLInputElement>;\n onBlur?: React.FocusEventHandler<HTMLInputElement>;\n color?: React.CSSProperties['color'];\n}\n\nexport interface ToggleState {\n checked?: boolean;\n focusByTab?: boolean;\n}\n\nexport class Toggle extends React.Component<ToggleProps, ToggleState> {\n public static __KONTUR_REACT_UI__ = 'Toggle';\n\n public static propTypes = {\n checked: PropTypes.bool,\n defaultChecked: PropTypes.bool,\n disabled: PropTypes.bool,\n error: PropTypes.bool,\n loading: PropTypes.bool,\n warning: PropTypes.bool,\n onValueChange: PropTypes.func,\n color(props: ToggleProps) {\n if (props.color && !colorWarningShown) {\n warning(false, `[Toggle]: prop 'color' is deprecated. Please, use theme variable 'toggleBgChecked' instead. `);\n colorWarningShown = true;\n }\n },\n };\n\n public static defaultProps = {\n disabled: false,\n loading: false,\n captionPosition: 'right',\n };\n\n private theme!: Theme;\n private input: HTMLInputElement | null = null;\n\n constructor(props: ToggleProps) {\n super(props);\n\n this.state = {\n focusByTab: false,\n checked: props.defaultChecked,\n };\n }\n\n public componentDidMount() {\n if (this.props.autoFocus) {\n keyListener.isTabPressed = true;\n this.focus();\n }\n }\n\n /**\n * @public\n */\n public focus = () => {\n if (this.input) {\n keyListener.isTabPressed = true;\n this.input.focus();\n }\n };\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const { children, captionPosition, warning, error, loading, color } = this.props;\n const disabled = this.props.disabled || loading;\n const checked = this.isUncontrolled() ? this.state.checked : this.props.checked;\n\n const containerClassNames = cx(styles.container(this.theme), {\n [styles.containerDisabled(this.theme)]: !!disabled,\n [globalClasses.container]: true,\n [globalClasses.containerDisabled]: !!disabled,\n [globalClasses.containerLoading]: loading,\n });\n\n const labelClassNames = cx(styles.root(this.theme), {\n [styles.rootLeft()]: captionPosition === 'left',\n [styles.disabled()]: !!disabled,\n });\n\n let caption = null;\n if (children) {\n const captionClass = cx(styles.caption(this.theme), {\n [styles.captionLeft(this.theme)]: captionPosition === 'left',\n });\n caption = <span className={captionClass}>{children}</span>;\n }\n\n return (\n <CommonWrapper {...this.props}>\n <label className={labelClassNames}>\n <div\n className={cx(styles.outline(this.theme), {\n [styles.isWarning(this.theme)]: !!warning,\n [styles.isError(this.theme)]: !!error,\n [styles.focused(this.theme)]: !disabled && !!this.state.focusByTab,\n })}\n >\n <span className={cx(styles.wrapper(this.theme))}>\n <input\n type=\"checkbox\"\n checked={checked}\n onChange={this.handleChange}\n className={styles.input(this.theme)}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n ref={this.inputRef}\n disabled={disabled}\n />\n <div\n className={containerClassNames}\n style={\n checked && color && !disabled\n ? {\n backgroundColor: color,\n boxShadow: `inset 0 0 0 1px ${color}`,\n }\n : undefined\n }\n >\n <div\n className={cx(styles.activeBackground(), globalClasses.background, {\n [styles.activeBackgroundLoading(this.theme)]: loading,\n })}\n style={\n checked && color && !disabled\n ? {\n backgroundColor: color,\n boxShadow: `inset 0 0 0 1px ${color}`,\n }\n : undefined\n }\n />\n </div>\n <div\n className={cx(styles.handle(this.theme), globalClasses.handle, {\n [styles.handleDisabled(this.theme)]: disabled,\n })}\n />\n </span>\n </div>\n {caption}\n </label>\n </CommonWrapper>\n );\n }\n\n private inputRef = (element: HTMLInputElement) => {\n this.input = element;\n };\n\n private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n if (this.props.onValueChange) {\n this.props.onValueChange(event.target.checked);\n }\n\n if (this.isUncontrolled()) {\n this.setState({\n checked: event.target.checked,\n });\n }\n\n if (this.props.onChange) {\n this.props.onChange(event);\n }\n };\n\n private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n if (this.props.onFocus) {\n this.props.onFocus(event);\n }\n\n if (keyListener.isTabPressed) {\n this.setState({ focusByTab: true });\n }\n };\n\n private handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n if (this.props.onBlur) {\n this.props.onBlur(event);\n }\n this.setState({\n focusByTab: false,\n });\n };\n\n private isUncontrolled() {\n return this.props.checked === undefined;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["Toggle.tsx"],"names":["React","PropTypes","warning","keyListener","ThemeContext","CommonWrapper","cx","styles","globalClasses","colorWarningShown","Toggle","props","theme","input","focus","isTabPressed","inputRef","element","handleChange","event","onValueChange","target","checked","isUncontrolled","setState","onChange","handleFocus","onFocus","focusByTab","handleBlur","onBlur","state","defaultChecked","componentDidMount","autoFocus","render","renderMain","children","captionPosition","error","loading","color","id","disabled","containerClassNames","container","containerDisabled","containerLoading","labelClassNames","root","rootLeft","caption","captionClass","captionLeft","disabledCaption","outline","isWarning","isError","focused","wrapper","backgroundColor","boxShadow","undefined","activeBackground","background","activeBackgroundLoading","disabledBackground","handle","handleDisabled","Component","__KONTUR_REACT_UI__","propTypes","bool","func","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport warning from 'warning';\n\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { styles, globalClasses } from './Toggle.styles';\n\nlet colorWarningShown = false;\n\nexport interface ToggleProps extends CommonProps {\n children?: React.ReactNode;\n /**\n * Положение `children` относительно переключателя.\n * @default 'right'\n */\n captionPosition: 'left' | 'right';\n /**\n * Состояние `тогла`, если `true` - `тогл` будет включён, иначе выключен.\n * @default false\n */\n checked?: boolean;\n /**\n * Делает `тогл` включенным по умолчанию.\n */\n defaultChecked?: boolean;\n /**\n * Отключает `тогл`.\n */\n disabled?: boolean;\n /**\n * Событие вызывающееся, когда значение `тогла` меняется, передаёт текущее значение тогла в переданную функцию.\n */\n onValueChange?: (value: boolean) => void;\n /**\n * Событие вызывающееся при клике на `тогл`.\n */\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n /**\n * Добавляет оранжевую обводку вокруг переключателя.\n * @default false\n */\n warning?: boolean;\n /**\n * Добавляет красную обводку вокруг переключателя.\n * @default false\n */\n error?: boolean;\n /**\n * Добавляет стили для состояния `loading` и отключает `тогл`.\n */\n loading?: boolean;\n /**\n * Если true, выставляет фокус на `тогле` после загрузки страницы.\n */\n autoFocus?: boolean;\n /**\n * Событие вызывающееся, когда `тогл` получает фокус.\n */\n onFocus?: React.FocusEventHandler<HTMLInputElement>;\n /**\n * Событие вызывающееся, когда `тогл` теряет фокус.\n */\n onBlur?: React.FocusEventHandler<HTMLInputElement>;\n /**\n * @deprecated используйте переменную темы `toggleBgChecked` вместо этого пропа.\n */\n color?: React.CSSProperties['color'];\n /**\n * HTML-атрибут `id` для передачи во внутренний `<input />`.\n */\n id?: string;\n}\n\nexport interface ToggleState {\n checked?: boolean;\n focusByTab?: boolean;\n}\n\n/**\n * _Примечание:_ под тоглом понимается полный компонент т.е. надпись + переключатель, а не просто переключатель.\n */\nexport class Toggle extends React.Component<ToggleProps, ToggleState> {\n public static __KONTUR_REACT_UI__ = 'Toggle';\n\n public static propTypes = {\n checked: PropTypes.bool,\n defaultChecked: PropTypes.bool,\n disabled: PropTypes.bool,\n error: PropTypes.bool,\n loading: PropTypes.bool,\n warning: PropTypes.bool,\n onValueChange: PropTypes.func,\n color(props: ToggleProps) {\n if (props.color && !colorWarningShown) {\n warning(false, `[Toggle]: prop 'color' is deprecated. Please, use theme variable 'toggleBgChecked' instead. `);\n colorWarningShown = true;\n }\n },\n };\n\n public static defaultProps = {\n disabled: false,\n loading: false,\n captionPosition: 'right',\n };\n\n private theme!: Theme;\n private input: HTMLInputElement | null = null;\n\n constructor(props: ToggleProps) {\n super(props);\n\n this.state = {\n focusByTab: false,\n checked: props.defaultChecked,\n };\n }\n\n public componentDidMount() {\n if (this.props.autoFocus) {\n keyListener.isTabPressed = true;\n this.focus();\n }\n }\n\n /**\n * @public\n */\n public focus = () => {\n if (this.input) {\n keyListener.isTabPressed = true;\n this.input.focus();\n }\n };\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const { children, captionPosition, warning, error, loading, color, id } = this.props;\n const disabled = this.props.disabled || loading;\n const checked = this.isUncontrolled() ? this.state.checked : this.props.checked;\n\n const containerClassNames = cx(styles.container(this.theme), {\n [styles.containerDisabled(this.theme)]: !!disabled,\n [globalClasses.container]: true,\n [globalClasses.containerDisabled]: !!disabled,\n [globalClasses.containerLoading]: loading,\n });\n\n const labelClassNames = cx(styles.root(this.theme), {\n [styles.rootLeft()]: captionPosition === 'left',\n [styles.disabled()]: !!disabled,\n [globalClasses.disabled]: !!disabled,\n });\n\n let caption = null;\n if (children) {\n const captionClass = cx(styles.caption(this.theme), {\n [styles.captionLeft(this.theme)]: captionPosition === 'left',\n [styles.disabledCaption(this.theme)]: !!disabled,\n });\n caption = <span className={captionClass}>{children}</span>;\n }\n\n return (\n <CommonWrapper {...this.props}>\n <label className={labelClassNames}>\n <div\n className={cx(styles.outline(this.theme), {\n [styles.isWarning(this.theme)]: !!warning,\n [styles.isError(this.theme)]: !!error,\n [styles.focused(this.theme)]: !disabled && !!this.state.focusByTab,\n })}\n >\n <span className={cx(styles.wrapper(this.theme))}>\n <input\n type=\"checkbox\"\n checked={checked}\n onChange={this.handleChange}\n className={styles.input(this.theme)}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n ref={this.inputRef}\n disabled={disabled}\n id={id}\n />\n <div\n className={containerClassNames}\n style={\n checked && color && !disabled\n ? {\n backgroundColor: color,\n boxShadow: `inset 0 0 0 1px ${color}`,\n }\n : undefined\n }\n >\n <div\n className={cx(styles.activeBackground(), globalClasses.background, {\n [styles.activeBackgroundLoading(this.theme)]: loading,\n [styles.disabledBackground(this.theme)]: disabled,\n })}\n style={\n checked && color && !disabled\n ? {\n backgroundColor: color,\n boxShadow: `inset 0 0 0 1px ${color}`,\n }\n : undefined\n }\n />\n </div>\n <div\n className={cx(styles.handle(this.theme), globalClasses.handle, {\n [styles.handleDisabled(this.theme)]: disabled,\n })}\n />\n </span>\n </div>\n {caption}\n </label>\n </CommonWrapper>\n );\n }\n\n private inputRef = (element: HTMLInputElement) => {\n this.input = element;\n };\n\n private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n if (this.props.onValueChange) {\n this.props.onValueChange(event.target.checked);\n }\n\n if (this.isUncontrolled()) {\n this.setState({\n checked: event.target.checked,\n });\n }\n\n if (this.props.onChange) {\n this.props.onChange(event);\n }\n };\n\n private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n if (this.props.onFocus) {\n this.props.onFocus(event);\n }\n\n if (keyListener.isTabPressed) {\n this.setState({ focusByTab: true });\n }\n };\n\n private handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n if (this.props.onBlur) {\n this.props.onBlur(event);\n }\n this.setState({\n focusByTab: false,\n });\n };\n\n private isUncontrolled() {\n return this.props.checked === undefined;\n }\n}\n"]}
|
|
@@ -4,27 +4,73 @@ import { CommonProps } from '../../internal/CommonWrapper';
|
|
|
4
4
|
export interface ToggleProps extends CommonProps {
|
|
5
5
|
children?: React.ReactNode;
|
|
6
6
|
/**
|
|
7
|
-
* Положение children
|
|
7
|
+
* Положение `children` относительно переключателя.
|
|
8
8
|
* @default 'right'
|
|
9
9
|
*/
|
|
10
10
|
captionPosition: 'left' | 'right';
|
|
11
|
+
/**
|
|
12
|
+
* Состояние `тогла`, если `true` - `тогл` будет включён, иначе выключен.
|
|
13
|
+
* @default false
|
|
14
|
+
*/
|
|
11
15
|
checked?: boolean;
|
|
16
|
+
/**
|
|
17
|
+
* Делает `тогл` включенным по умолчанию.
|
|
18
|
+
*/
|
|
12
19
|
defaultChecked?: boolean;
|
|
20
|
+
/**
|
|
21
|
+
* Отключает `тогл`.
|
|
22
|
+
*/
|
|
13
23
|
disabled?: boolean;
|
|
24
|
+
/**
|
|
25
|
+
* Событие вызывающееся, когда значение `тогла` меняется, передаёт текущее значение тогла в переданную функцию.
|
|
26
|
+
*/
|
|
14
27
|
onValueChange?: (value: boolean) => void;
|
|
28
|
+
/**
|
|
29
|
+
* Событие вызывающееся при клике на `тогл`.
|
|
30
|
+
*/
|
|
15
31
|
onChange?: React.ChangeEventHandler<HTMLInputElement>;
|
|
32
|
+
/**
|
|
33
|
+
* Добавляет оранжевую обводку вокруг переключателя.
|
|
34
|
+
* @default false
|
|
35
|
+
*/
|
|
16
36
|
warning?: boolean;
|
|
37
|
+
/**
|
|
38
|
+
* Добавляет красную обводку вокруг переключателя.
|
|
39
|
+
* @default false
|
|
40
|
+
*/
|
|
17
41
|
error?: boolean;
|
|
42
|
+
/**
|
|
43
|
+
* Добавляет стили для состояния `loading` и отключает `тогл`.
|
|
44
|
+
*/
|
|
18
45
|
loading?: boolean;
|
|
46
|
+
/**
|
|
47
|
+
* Если true, выставляет фокус на `тогле` после загрузки страницы.
|
|
48
|
+
*/
|
|
19
49
|
autoFocus?: boolean;
|
|
50
|
+
/**
|
|
51
|
+
* Событие вызывающееся, когда `тогл` получает фокус.
|
|
52
|
+
*/
|
|
20
53
|
onFocus?: React.FocusEventHandler<HTMLInputElement>;
|
|
54
|
+
/**
|
|
55
|
+
* Событие вызывающееся, когда `тогл` теряет фокус.
|
|
56
|
+
*/
|
|
21
57
|
onBlur?: React.FocusEventHandler<HTMLInputElement>;
|
|
58
|
+
/**
|
|
59
|
+
* @deprecated используйте переменную темы `toggleBgChecked` вместо этого пропа.
|
|
60
|
+
*/
|
|
22
61
|
color?: React.CSSProperties['color'];
|
|
62
|
+
/**
|
|
63
|
+
* HTML-атрибут `id` для передачи во внутренний `<input />`.
|
|
64
|
+
*/
|
|
65
|
+
id?: string;
|
|
23
66
|
}
|
|
24
67
|
export interface ToggleState {
|
|
25
68
|
checked?: boolean;
|
|
26
69
|
focusByTab?: boolean;
|
|
27
70
|
}
|
|
71
|
+
/**
|
|
72
|
+
* _Примечание:_ под тоглом понимается полный компонент т.е. надпись + переключатель, а не просто переключатель.
|
|
73
|
+
*/
|
|
28
74
|
export declare class Toggle extends React.Component<ToggleProps, ToggleState> {
|
|
29
75
|
static __KONTUR_REACT_UI__: string;
|
|
30
76
|
static propTypes: {
|
|
@@ -1,20 +1,94 @@
|
|
|
1
|
+
Базовый пример тогла.
|
|
2
|
+
|
|
3
|
+
```jsx harmony
|
|
4
|
+
const [checked, setChecked] = React.useState(false);
|
|
5
|
+
|
|
6
|
+
<Toggle checked={checked} onValueChange={setChecked}>
|
|
7
|
+
{checked ? 'On' : 'Off'}
|
|
8
|
+
</Toggle>
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
Пример тогла включенного по умолчанию.
|
|
12
|
+
|
|
13
|
+
```jsx harmony
|
|
14
|
+
<Toggle defaultChecked>
|
|
15
|
+
Включен по умолчанию
|
|
16
|
+
</Toggle>
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
Тогл с надписью слева от переключателя.
|
|
20
|
+
|
|
1
21
|
```jsx harmony
|
|
2
22
|
const [checked, setChecked] = React.useState(false);
|
|
3
23
|
|
|
4
|
-
<
|
|
5
|
-
|
|
6
|
-
</
|
|
24
|
+
<Toggle checked={checked} onValueChange={setChecked} captionPosition="left">
|
|
25
|
+
Показывать уведомления
|
|
26
|
+
</Toggle>
|
|
7
27
|
```
|
|
8
28
|
|
|
9
|
-
|
|
10
|
-
Положение `children` относительно переключателя указывается в `captionPosition`.
|
|
29
|
+
Тогл с внешним `<label/>`.
|
|
11
30
|
|
|
12
31
|
```jsx harmony
|
|
32
|
+
import { Gapped } from '@skbkontur/react-ui';
|
|
33
|
+
|
|
13
34
|
const [checked, setChecked] = React.useState(false);
|
|
14
35
|
|
|
15
|
-
<
|
|
16
|
-
<Toggle checked={checked} onValueChange={setChecked}
|
|
17
|
-
|
|
36
|
+
<Gapped>
|
|
37
|
+
<Toggle id="toggle-1" checked={checked} onValueChange={setChecked}/>
|
|
38
|
+
<label htmlFor="toggle-1">Внешний label</label>
|
|
39
|
+
</Gapped>
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
Тогл получающий фокус после загрузки страницы.
|
|
43
|
+
|
|
44
|
+
```jsx harmony
|
|
45
|
+
<Toggle autoFocus>
|
|
46
|
+
Сразу с фокусом
|
|
47
|
+
</Toggle>
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
Тоглы в различных стилях.
|
|
51
|
+
|
|
52
|
+
```jsx harmony
|
|
53
|
+
import { Gapped } from '@skbkontur/react-ui';
|
|
54
|
+
|
|
55
|
+
<Gapped gap="20px">
|
|
56
|
+
<Toggle warning>
|
|
57
|
+
Warning
|
|
58
|
+
</Toggle>
|
|
59
|
+
<Toggle error>
|
|
60
|
+
Error
|
|
61
|
+
</Toggle>
|
|
62
|
+
<Toggle loading>
|
|
63
|
+
Loading
|
|
18
64
|
</Toggle>
|
|
19
|
-
|
|
65
|
+
<Toggle disabled>
|
|
66
|
+
Disabled
|
|
67
|
+
</Toggle>
|
|
68
|
+
</Gapped>
|
|
69
|
+
```
|
|
70
|
+
|
|
71
|
+
Тогл с кастомным действием при получении и потере фокуса.
|
|
72
|
+
|
|
73
|
+
|
|
74
|
+
```jsx harmony
|
|
75
|
+
import { Toast } from '@skbkontur/react-ui';
|
|
76
|
+
|
|
77
|
+
<Toggle
|
|
78
|
+
onFocus={() => Toast.push('Я получил фокус!')}
|
|
79
|
+
onBlur={() => Toast.push('И потерял его...')}
|
|
80
|
+
>
|
|
81
|
+
С кастомными действиями при фокусе и его потере
|
|
82
|
+
</Toggle>
|
|
83
|
+
```
|
|
84
|
+
|
|
85
|
+
|
|
86
|
+
Тогл с кастомным действием при переключении.
|
|
87
|
+
|
|
88
|
+
```jsx harmony
|
|
89
|
+
import { Toast } from '@skbkontur/react-ui';
|
|
90
|
+
|
|
91
|
+
<Toggle onChange={() => Toast.push("Запускаю кастомное действие")}>
|
|
92
|
+
Кастомное действие при переключении
|
|
93
|
+
</Toggle>
|
|
20
94
|
```
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
|
|
2
2
|
|
|
3
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
|
|
3
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
|
|
4
4
|
|
|
5
5
|
import { css, memoizeStyle, prefix } from "../../../lib/theming/Emotion";
|
|
6
6
|
export var globalClasses = prefix('toggle')({
|
|
7
7
|
handle: 'handle',
|
|
8
8
|
container: 'container',
|
|
9
|
+
disabled: 'disabled',
|
|
9
10
|
containerDisabled: 'container-disabled',
|
|
10
11
|
containerLoading: 'container-loading',
|
|
11
12
|
background: 'background'
|
|
@@ -14,25 +15,24 @@ export var styles = memoizeStyle({
|
|
|
14
15
|
root: function root(t) {
|
|
15
16
|
var handleWidthWithBorders = t.toggleHeight;
|
|
16
17
|
var handleActiveWidth = "calc(" + handleWidthWithBorders + " - 2 * " + t.toggleBorderWidth + " + " + t.toggleHandleActiveWidthIncrement + ")";
|
|
17
|
-
return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n cursor: pointer;\n\n &:hover .", " {\n background: ", ";\n }\n &:active .", " {\n width: ", ";\n }\n &:active input:checked ~ .", " {\n transform: translateX(", ") translateX(-", ")\n translateX(-", ");\n }\n "])), globalClasses.handle, t.toggleBgHover, globalClasses.handle, handleActiveWidth, globalClasses.handle, t.toggleWidth, handleWidthWithBorders, t.toggleHandleActiveWidthIncrement);
|
|
18
|
+
return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n cursor: pointer;\n\n &:hover .", " {\n background: ", ";\n }\n &:active:not(.", ") .", " {\n width: ", ";\n }\n &:active:not(.", ") input:checked ~ .", " {\n transform: translateX(", ") translateX(-", ")\n translateX(-", ");\n }\n "])), globalClasses.handle, t.toggleBgHover, globalClasses.disabled, globalClasses.handle, handleActiveWidth, globalClasses.disabled, globalClasses.handle, t.toggleWidth, handleWidthWithBorders, t.toggleHandleActiveWidthIncrement);
|
|
18
19
|
},
|
|
19
20
|
handle: function handle(t) {
|
|
20
21
|
var handleSize = "calc(" + t.toggleHeight + " - 2 * " + t.toggleBorderWidth + ")";
|
|
21
22
|
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border-radius: ", ";\n bottom: ", ";\n box-shadow: 0 ", " 0 0 rgba(0, 0, 0, 0.15), 0 0 0 ", " rgba(0, 0, 0, 0.15);\n height: ", ";\n left: ", ";\n position: absolute;\n top: ", ";\n transition: 0.2s ease-in;\n width: ", ";\n "])), t.toggleBg, t.toggleHandleBorderRadius, t.toggleBorderWidth, t.toggleBorderWidth, t.toggleBorderWidth, handleSize, t.toggleBorderWidth, t.toggleBorderWidth, handleSize);
|
|
22
23
|
},
|
|
23
24
|
handleDisabled: function handleDisabled(t) {
|
|
24
|
-
|
|
25
|
-
return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n background: ", " !important; // override root hover/active styles\n width: ", " !important; // override root active styles\n "])), t.toggleDisabledHandleBg, handleSize);
|
|
25
|
+
return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n background: ", " !important; // override root hover/active styles\n "])), t.toggleDisabledHandleBg);
|
|
26
26
|
},
|
|
27
27
|
input: function input(t) {
|
|
28
28
|
var handleWidthWithBorders = t.toggleHeight;
|
|
29
|
-
return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n position: absolute;\n opacity: 0;\n\n &:focus {\n outline: none;\n }\n &:checked ~ .", " {\n box-shadow: inset 0 0 0 ", " ", ";\n background: ", ";\n transition: background 0s 0.2s;\n }\n &:checked ~ .", " {\n box-shadow: inset 0 0 0 ", " ", ";\n background: ", ";\n transition: background 0s 0.2s;\n }\n &:checked ~ .", " {\n background: ", ";\n box-shadow: inset 0 0 0 ", " ", ";\n }\n &:checked ~ .", " .", " {\n width: 70%;\n background: ", ";\n }\n &:checked ~ .", " .", " {\n width: 70%;\n background: ", ";\n border-radius: calc(", " * 0.5) 0 0 calc(", " * 0.5);\n box-shadow: inset 0 0 0 1px ", ";\n }\n &:checked ~ .", " {\n transform: translateX(", ") translateX(-", ");\n }\n "])), globalClasses.container, t.toggleBorderWidth, t.toggleBgChecked, t.toggleBgChecked, globalClasses.containerDisabled, t.toggleBorderWidth, t.
|
|
29
|
+
return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n position: absolute;\n opacity: 0;\n\n &:focus {\n outline: none;\n }\n &:checked ~ .", " {\n box-shadow: inset 0 0 0 ", " ", ";\n background: ", ";\n transition: background 0s 0.2s;\n }\n &:checked ~ .", " {\n box-shadow: inset 0 0 0 ", " ", ";\n background: ", ";\n transition: background 0s 0.2s;\n }\n &:checked ~ .", " {\n background: ", ";\n box-shadow: inset 0 0 0 ", " ", ";\n }\n &:checked ~ .", " .", " {\n width: 70%;\n background: ", ";\n }\n &:checked ~ .", " .", " {\n width: 70%;\n background: ", ";\n border-radius: calc(", " * 0.5) 0 0 calc(", " * 0.5);\n box-shadow: inset 0 0 0 1px ", ";\n }\n &:checked ~ .", " {\n transform: translateX(", ") translateX(-", ");\n }\n "])), globalClasses.container, t.toggleBorderWidth, t.toggleBgChecked, t.toggleBgChecked, globalClasses.containerDisabled, t.toggleBorderWidth, t.toggleBorderColorDisabledChecked, t.toggleBgDisabledChecked, globalClasses.containerLoading, t.toggleBorderColor, t.toggleBorderWidth, t.toggleBorderColor, globalClasses.container, globalClasses.background, t.toggleBgChecked, globalClasses.containerDisabled, globalClasses.background, t.toggleBgDisabledChecked, t.toggleHeight, t.toggleHeight, t.toggleBorderColorDisabledChecked, globalClasses.handle, t.toggleWidth, handleWidthWithBorders);
|
|
30
30
|
},
|
|
31
31
|
container: function container(t) {
|
|
32
32
|
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n border-radius: ", ";\n box-shadow: inset 0 0 0 ", " ", ";\n height: 100%;\n overflow: hidden;\n position: absolute;\n width: 100%;\n /* fixes overflow issue in Safari: https://bugs.webkit.org/show_bug.cgi?id=98538 */\n z-index: 0;\n "])), t.toggleBorderRadius, t.toggleBorderWidth, t.toggleBorderColor);
|
|
33
33
|
},
|
|
34
34
|
containerDisabled: function containerDisabled(t) {
|
|
35
|
-
return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n background: ", ";\n "])), t.toggleBgDisabled);
|
|
35
|
+
return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n background: ", ";\n box-shadow: inset 0 0 0 1px ", ";\n "])), t.toggleBgDisabled, t.toggleBorderColorDisabled);
|
|
36
36
|
},
|
|
37
37
|
focused: function focused(t) {
|
|
38
38
|
return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n box-shadow: 0 0 0 1px ", ", 0 0 0 ", " ", ";\n "])), t.outlineColorFocus, t.toggleOutlineWidth, t.toggleFocusShadowColor);
|
|
@@ -40,31 +40,37 @@ export var styles = memoizeStyle({
|
|
|
40
40
|
activeBackground: function activeBackground() {
|
|
41
41
|
return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n background: inherit;\n bottom: 0;\n left: 0;\n position: absolute;\n top: 0;\n transition: 0.2s ease-in;\n width: 10px;\n "])));
|
|
42
42
|
},
|
|
43
|
+
disabledBackground: function disabledBackground(t) {
|
|
44
|
+
return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n box-shadow: inset 0 0 0 1px ", ";\n width: 0;\n "])), t.toggleBorderColorDisabled);
|
|
45
|
+
},
|
|
43
46
|
activeBackgroundLoading: function activeBackgroundLoading(t) {
|
|
44
|
-
return css(
|
|
47
|
+
return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n background: ", ";\n "])), t.toggleBgActive);
|
|
45
48
|
},
|
|
46
49
|
isWarning: function isWarning(t) {
|
|
47
|
-
return css(
|
|
50
|
+
return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n box-shadow: 0 0 0 1px ", ", 0 0 0 ", " ", ";\n "])), t.outlineColorFocus, t.toggleOutlineWidth, t.toggleShadowColorWarning);
|
|
48
51
|
},
|
|
49
52
|
isError: function isError(t) {
|
|
50
|
-
return css(
|
|
53
|
+
return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n box-shadow: 0 0 0 1px ", ", 0 0 0 ", " ", ";\n "])), t.outlineColorFocus, t.toggleOutlineWidth, t.toggleShadowColorError);
|
|
51
54
|
},
|
|
52
55
|
outline: function outline(t) {
|
|
53
|
-
return css(
|
|
56
|
+
return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border-radius: ", ";\n "])), t.toggleBaseBg, t.toggleBorderRadius);
|
|
54
57
|
},
|
|
55
58
|
wrapper: function wrapper(t) {
|
|
56
|
-
return css(
|
|
59
|
+
return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n display: inline-block;\n height: ", ";\n position: relative;\n width: ", ";\n flex: 1 0 ", ";\n\n &::after {\n content: '';\n display: inline-block;\n }\n "])), t.toggleHeight, t.toggleWidth, t.toggleWidth);
|
|
57
60
|
},
|
|
58
61
|
disabled: function disabled() {
|
|
59
|
-
return css(
|
|
62
|
+
return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n cursor: default;\n "])));
|
|
60
63
|
},
|
|
61
64
|
rootLeft: function rootLeft() {
|
|
62
|
-
return css(
|
|
65
|
+
return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n flex-direction: row-reverse;\n "])));
|
|
63
66
|
},
|
|
64
67
|
caption: function caption(t) {
|
|
65
|
-
return css(
|
|
68
|
+
return css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteralLoose(["\n color: ", ";\n padding: 0 0 0 ", ";\n "])), t.toggleTextColor, t.toggleCaptionGap);
|
|
69
|
+
},
|
|
70
|
+
disabledCaption: function disabledCaption(t) {
|
|
71
|
+
return css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteralLoose(["\n color: ", ";\n "])), t.textColorDisabled);
|
|
66
72
|
},
|
|
67
73
|
captionLeft: function captionLeft(t) {
|
|
68
|
-
return css(
|
|
74
|
+
return css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteralLoose(["\n color: ", ";\n padding: 0 ", " 0 0;\n "])), t.toggleTextColor, t.toggleCaptionGap);
|
|
69
75
|
}
|
|
70
76
|
});
|