@skbkontur/react-ui 5.5.1 → 5.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +22 -0
- package/cjs/components/Calendar/MonthView.js +1 -2
- package/cjs/components/Calendar/MonthView.js.map +1 -1
- package/cjs/components/FileUploader/FileUploader.styles.js +4 -5
- package/cjs/components/FileUploader/FileUploader.styles.js.map +1 -1
- package/cjs/components/Modal/Modal.d.ts +25 -22
- package/cjs/components/Modal/Modal.js +10 -7
- package/cjs/components/Modal/Modal.js.map +1 -1
- package/cjs/components/Modal/ModalBody.d.ts +1 -1
- package/cjs/components/Modal/ModalBody.js +1 -1
- package/cjs/components/Modal/ModalBody.js.map +1 -1
- package/cjs/components/Modal/ModalFooter.d.ts +5 -5
- package/cjs/components/Modal/ModalFooter.js +1 -1
- package/cjs/components/Modal/ModalFooter.js.map +1 -1
- package/cjs/components/Modal/ModalHeader.d.ts +3 -3
- package/cjs/components/Modal/ModalHeader.js +1 -1
- package/cjs/components/Modal/ModalHeader.js.map +1 -1
- package/cjs/components/Radio/Radio.d.ts +11 -10
- package/cjs/components/Radio/Radio.js +5 -4
- package/cjs/components/Radio/Radio.js.map +1 -1
- package/cjs/components/RadioGroup/RadioGroup.d.ts +21 -28
- package/cjs/components/RadioGroup/RadioGroup.js +2 -9
- package/cjs/components/RadioGroup/RadioGroup.js.map +1 -1
- package/cjs/components/Tabs/Tab.styles.js +3 -9
- package/cjs/components/Tabs/Tab.styles.js.map +1 -1
- package/cjs/components/Textarea/Textarea.d.ts +5 -1
- package/cjs/components/Textarea/Textarea.js +10 -1
- package/cjs/components/Textarea/Textarea.js.map +1 -1
- package/cjs/internal/CustomComboBox/CustomComboBoxReducer.js +5 -0
- package/cjs/internal/CustomComboBox/CustomComboBoxReducer.js.map +1 -1
- package/cjs/internal/InternalTextareaWithLayout/InternalTextareaWithLayout.d.ts +1 -0
- package/cjs/internal/InternalTextareaWithLayout/InternalTextareaWithLayout.js +4 -1
- package/cjs/internal/InternalTextareaWithLayout/InternalTextareaWithLayout.js.map +1 -1
- package/cjs/internal/RenderContainer/RenderInnerContainer.d.ts +4 -0
- package/cjs/internal/RenderContainer/RenderInnerContainer.js +29 -2
- package/cjs/internal/RenderContainer/RenderInnerContainer.js.map +1 -1
- package/cjs/internal/ThemePlayground/Playground.styles.js +2 -1
- package/cjs/internal/ThemePlayground/Playground.styles.js.map +1 -1
- package/cjs/internal/ThemePlayground/ThemeContextPlayground.d.ts +1 -35
- package/cjs/internal/ThemePlayground/ThemeContextPlayground.js +32 -5
- package/cjs/internal/ThemePlayground/ThemeContextPlayground.js.map +1 -1
- package/cjs/internal/themes/DarkTheme5_5.js +3 -8
- package/cjs/internal/themes/DarkTheme5_5.js.map +1 -1
- package/cjs/internal/themes/DarkTheme5_6.d.ts +1 -0
- package/cjs/internal/themes/DarkTheme5_6.js +753 -0
- package/cjs/internal/themes/DarkTheme5_6.js.map +1 -0
- package/cjs/internal/themes/LightTheme5_6.d.ts +1 -0
- package/cjs/internal/themes/LightTheme5_6.js +753 -0
- package/cjs/internal/themes/LightTheme5_6.js.map +1 -0
- package/cjs/lib/theming/ThemeVersions.d.ts +1 -1
- package/cjs/lib/theming/ThemeVersions.js.map +1 -1
- package/cjs/lib/theming/themes/DarkTheme.d.ts +1 -0
- package/cjs/lib/theming/themes/DarkTheme.js +4 -2
- package/cjs/lib/theming/themes/DarkTheme.js.map +1 -1
- package/cjs/lib/theming/themes/LightTheme.d.ts +1 -0
- package/cjs/lib/theming/themes/LightTheme.js +4 -2
- package/cjs/lib/theming/themes/LightTheme.js.map +1 -1
- package/components/Calendar/MonthView/MonthView.js +1 -2
- package/components/Calendar/MonthView/MonthView.js.map +1 -1
- package/components/FileUploader/FileUploader.styles/FileUploader.styles.js +1 -2
- package/components/FileUploader/FileUploader.styles/FileUploader.styles.js.map +1 -1
- package/components/Modal/Modal/Modal.js +5 -7
- package/components/Modal/Modal/Modal.js.map +1 -1
- package/components/Modal/Modal.d.ts +25 -22
- package/components/Modal/ModalBody/ModalBody.js +1 -1
- package/components/Modal/ModalBody/ModalBody.js.map +1 -1
- package/components/Modal/ModalBody.d.ts +1 -1
- package/components/Modal/ModalFooter/ModalFooter.js +1 -1
- package/components/Modal/ModalFooter/ModalFooter.js.map +1 -1
- package/components/Modal/ModalFooter.d.ts +5 -5
- package/components/Modal/ModalHeader/ModalHeader.js +1 -1
- package/components/Modal/ModalHeader/ModalHeader.js.map +1 -1
- package/components/Modal/ModalHeader.d.ts +3 -3
- package/components/Radio/Radio/Radio.js +5 -4
- package/components/Radio/Radio/Radio.js.map +1 -1
- package/components/Radio/Radio.d.ts +11 -10
- package/components/RadioGroup/RadioGroup/RadioGroup.js +2 -9
- package/components/RadioGroup/RadioGroup/RadioGroup.js.map +1 -1
- package/components/RadioGroup/RadioGroup.d.ts +21 -28
- package/components/Tabs/Tab.styles/Tab.styles.js +1 -2
- package/components/Tabs/Tab.styles/Tab.styles.js.map +1 -1
- package/components/Textarea/Textarea/Textarea.js +5 -0
- package/components/Textarea/Textarea/Textarea.js.map +1 -1
- package/components/Textarea/Textarea.d.ts +5 -1
- package/internal/CustomComboBox/CustomComboBoxReducer/CustomComboBoxReducer.js +5 -0
- package/internal/CustomComboBox/CustomComboBoxReducer/CustomComboBoxReducer.js.map +1 -1
- package/internal/InternalTextareaWithLayout/InternalTextareaWithLayout/InternalTextareaWithLayout.js +4 -0
- package/internal/InternalTextareaWithLayout/InternalTextareaWithLayout/InternalTextareaWithLayout.js.map +1 -1
- package/internal/InternalTextareaWithLayout/InternalTextareaWithLayout.d.ts +1 -0
- package/internal/RenderContainer/RenderInnerContainer/RenderInnerContainer.js +35 -2
- package/internal/RenderContainer/RenderInnerContainer/RenderInnerContainer.js.map +1 -1
- package/internal/RenderContainer/RenderInnerContainer.d.ts +4 -0
- package/internal/ThemePlayground/Playground.styles/Playground.styles.js +1 -1
- package/internal/ThemePlayground/Playground.styles/Playground.styles.js.map +1 -1
- package/internal/ThemePlayground/ThemeContextPlayground/ThemeContextPlayground.js +28 -9
- package/internal/ThemePlayground/ThemeContextPlayground/ThemeContextPlayground.js.map +1 -1
- package/internal/ThemePlayground/ThemeContextPlayground.d.ts +1 -35
- package/internal/themes/DarkTheme5_5/DarkTheme5_5.js +4 -7
- package/internal/themes/DarkTheme5_5/DarkTheme5_5.js.map +1 -1
- package/internal/themes/DarkTheme5_6/DarkTheme5_6.js +768 -0
- package/internal/themes/DarkTheme5_6/DarkTheme5_6.js.map +1 -0
- package/internal/themes/DarkTheme5_6/package.json +6 -0
- package/internal/themes/DarkTheme5_6.d.ts +1 -0
- package/internal/themes/LightTheme5_6/LightTheme5_6.js +768 -0
- package/internal/themes/LightTheme5_6/LightTheme5_6.js.map +1 -0
- package/internal/themes/LightTheme5_6/package.json +6 -0
- package/internal/themes/LightTheme5_6.d.ts +1 -0
- package/lib/theming/ThemeVersions/ThemeVersions.js.map +1 -1
- package/lib/theming/ThemeVersions.d.ts +1 -1
- package/lib/theming/themes/DarkTheme/DarkTheme.js +3 -1
- package/lib/theming/themes/DarkTheme/DarkTheme.js.map +1 -1
- package/lib/theming/themes/DarkTheme.d.ts +1 -0
- package/lib/theming/themes/LightTheme/LightTheme.js +3 -1
- package/lib/theming/themes/LightTheme/LightTheme.js.map +1 -1
- package/lib/theming/themes/LightTheme.d.ts +1 -0
- package/package.json +2 -1
|
@@ -107,6 +107,9 @@ InternalTextareaWithLayout = exports.InternalTextareaWithLayout = (0, _rootNode.
|
|
|
107
107
|
|
|
108
108
|
|
|
109
109
|
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
|
|
110
113
|
|
|
111
114
|
|
|
112
115
|
|
|
@@ -232,4 +235,4 @@ InternalTextareaWithLayout = exports.InternalTextareaWithLayout = (0, _rootNode.
|
|
|
232
235
|
clearCrossShowed: _this.getClearCrossShowed({ focused: true, hovered: _this.state.hovered })
|
|
233
236
|
});
|
|
234
237
|
_this.props.onFocus == null || _this.props.onFocus(event);
|
|
235
|
-
};return _this;}(0, _inheritsLoose2.default)(InternalTextareaWithLayout, _React$Component);var _proto = InternalTextareaWithLayout.prototype;_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var _this$state = this.state,focused = _this$state.focused,hovered = _this$state.hovered;if (Boolean(prevProps.value) !== Boolean(this.props.value)) {this.setState({ clearCrossShowed: this.getClearCrossShowed({ focused: focused, hovered: hovered }) });}};_proto.focus = function focus() {var _this$wrappedComponen2;(_this$wrappedComponen2 = this.wrappedComponentRef.current) == null || _this$wrappedComponen2.focus();};_proto.blur = function blur() {var _this$wrappedComponen3;(_this$wrappedComponen3 = this.wrappedComponentRef.current) == null || _this$wrappedComponen3.blur();};_proto.setSelectionRange = function setSelectionRange(start, end) {var _this$wrappedComponen4;(_this$wrappedComponen4 = this.wrappedComponentRef.current) == null || _this$wrappedComponen4.setSelectionRange(start, end);};_proto.selectAll = function selectAll() {var _this$wrappedComponen5;(_this$wrappedComponen5 = this.wrappedComponentRef.current) == null || _this$wrappedComponen5.selectAll();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement("span", { "data-tid": 'InternalTextareaWithLayout' }, _this2.renderLayout());});};_proto.getTextareaSizeClassName = function getTextareaSizeClassName() {switch (this.getProps().size) {case 'large':return _Textarea2.styles.textareaLarge(this.theme);case 'medium':return _Textarea2.styles.textareaMedium(this.theme);case 'small':default:return _Textarea2.styles.textareaSmall(this.theme);}};_proto.getRootSizeClassName = function getRootSizeClassName() {switch (this.getProps().size) {case 'large':return _Textarea2.styles.rootLarge(this.theme);case 'medium':return _Textarea2.styles.rootMedium(this.theme);case 'small':default:return _Textarea2.styles.rootSmall(this.theme);}};return (0, _createClass2.default)(InternalTextareaWithLayout, [{ key: "preparedTheme", get: function get() {return _ThemeFactory.ThemeFactory.create({ textareaWidth: 'auto', textareaBorderWidth: '0px', textareaPaddingXSmall: '0px', textareaPaddingXMedium: '0px', textareaPaddingXLarge: '0px', textareaPaddingYSmall: '0px', textareaPaddingYMedium: '0px', textareaPaddingYLarge: '0px', textareaOutlineWidth: '0px', textareaShadow: 'none', textareaDisabledBg: 'transparent', textareaBg: 'transparent' }, this.theme);} }]);}(_react.default.Component), _InternalTextareaWithLayout.__KONTUR_REACT_UI__ = 'InternalTextareaWithLayout', _InternalTextareaWithLayout)) || _class;
|
|
238
|
+
};return _this;}(0, _inheritsLoose2.default)(InternalTextareaWithLayout, _React$Component);var _proto = InternalTextareaWithLayout.prototype;_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var _this$state = this.state,focused = _this$state.focused,hovered = _this$state.hovered;if (Boolean(prevProps.value) !== Boolean(this.props.value)) {this.setState({ clearCrossShowed: this.getClearCrossShowed({ focused: focused, hovered: hovered }) });}};_proto.focus = function focus() {var _this$wrappedComponen2;(_this$wrappedComponen2 = this.wrappedComponentRef.current) == null || _this$wrappedComponen2.focus();};_proto.blur = function blur() {var _this$wrappedComponen3;(_this$wrappedComponen3 = this.wrappedComponentRef.current) == null || _this$wrappedComponen3.blur();};_proto.setSelectionRange = function setSelectionRange(start, end) {var _this$wrappedComponen4;(_this$wrappedComponen4 = this.wrappedComponentRef.current) == null || _this$wrappedComponen4.setSelectionRange(start, end);};_proto.selectAll = function selectAll() {var _this$wrappedComponen5;(_this$wrappedComponen5 = this.wrappedComponentRef.current) == null || _this$wrappedComponen5.selectAll();};_proto.getNode = function getNode() {var _this$wrappedComponen6;return (_this$wrappedComponen6 = this.wrappedComponentRef.current) == null ? void 0 : _this$wrappedComponen6.getNode();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement("span", { "data-tid": 'InternalTextareaWithLayout' }, _this2.renderLayout());});};_proto.getTextareaSizeClassName = function getTextareaSizeClassName() {switch (this.getProps().size) {case 'large':return _Textarea2.styles.textareaLarge(this.theme);case 'medium':return _Textarea2.styles.textareaMedium(this.theme);case 'small':default:return _Textarea2.styles.textareaSmall(this.theme);}};_proto.getRootSizeClassName = function getRootSizeClassName() {switch (this.getProps().size) {case 'large':return _Textarea2.styles.rootLarge(this.theme);case 'medium':return _Textarea2.styles.rootMedium(this.theme);case 'small':default:return _Textarea2.styles.rootSmall(this.theme);}};return (0, _createClass2.default)(InternalTextareaWithLayout, [{ key: "preparedTheme", get: function get() {return _ThemeFactory.ThemeFactory.create({ textareaWidth: 'auto', textareaBorderWidth: '0px', textareaPaddingXSmall: '0px', textareaPaddingXMedium: '0px', textareaPaddingXLarge: '0px', textareaPaddingYSmall: '0px', textareaPaddingYMedium: '0px', textareaPaddingYLarge: '0px', textareaOutlineWidth: '0px', textareaShadow: 'none', textareaDisabledBg: 'transparent', textareaBg: 'transparent' }, this.theme);} }]);}(_react.default.Component), _InternalTextareaWithLayout.__KONTUR_REACT_UI__ = 'InternalTextareaWithLayout', _InternalTextareaWithLayout)) || _class;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","_InputLayout","_Textarea","_Textarea2","_Emotion","_ThemeContext","_ThemeFactory","_rootNode","_Input","_createPropsGetter","_currentEnvironment","_Input2","_ClearCrossIcon","_InternalTextareaWithLayout2","_excluded","_class","_InternalTextareaWithLayout","InternalTextareaWithLayout","exports","rootNode","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","wrappedComponentRef","React","createRef","getProps","createPropsGetter","Textarea","defaultProps","getClearCrossShowed","_ref","focused","hovered","props","disabled","calculateClearCrossShowedState","showClearIcon","notEmptyValue","Boolean","value","state","clearCrossShowed","handleClearInput","current","clear","focus","onValueChange","getRightIcon","_this$props","size","rightIcon","default","createElement","ClearCrossIcon","InputDataTids","clearCross","onClick","handleMouseEnter","setState","handleMouseOut","renderLayout","_cx","labelProps","className","cx","styles","contentWrapper","textareaStyles","textarea","theme","getTextareaSizeClassName","getRootSizeClassName","inputStyles","warning","error","borderless","style","width","DEFAULT_WIDTH","minWidth","position","onMouseEnter","onMouseLeave","handleLayoutClick","InputLayout","leftIcon","context","tag","renderTextarea","_this$props2","textareaProps","_objectWithoutPropertiesLoose2","ThemeContext","Provider","preparedTheme","_extends2","isTestEnv","spellCheck","ref","onFocus","handleFocus","onBlur","handleBlur","_this$wrappedComponen","event","_getRootNode","getRootNode","contains","relatedTarget","_inheritsLoose2","_proto","prototype","componentDidUpdate","prevProps","_this$state","_this$wrappedComponen2","blur","_this$wrappedComponen3","setSelectionRange","start","end","_this$wrappedComponen4","selectAll","_this$wrappedComponen5","render","_this2","Consumer","textareaLarge","textareaMedium","textareaSmall","rootLarge","rootMedium","rootSmall","_createClass2","key","get","ThemeFactory","create","textareaWidth","textareaBorderWidth","textareaPaddingXSmall","textareaPaddingXMedium","textareaPaddingXLarge","textareaPaddingYSmall","textareaPaddingYMedium","textareaPaddingYLarge","textareaOutlineWidth","textareaShadow","textareaDisabledBg","textareaBg","Component","__KONTUR_REACT_UI__"],"sources":["InternalTextareaWithLayout.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { InputProps } from '../../components/Input';\nimport { InputLayout } from '../../components/Input/InputLayout/InputLayout';\nimport { DEFAULT_WIDTH, Textarea } from '../../components/Textarea';\nimport type { TextareaProps } from '../../components/Textarea';\nimport { styles as textareaStyles } from '../../components/Textarea/Textarea.styles';\nimport { cx } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { getRootNode, rootNode } from '../../lib/rootNode';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { styles as inputStyles } from '../../components/Input/Input.styles';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { calculateClearCrossShowedState, InputDataTids } from '../../components/Input';\nimport { ClearCrossIcon } from '../ClearCrossIcon/ClearCrossIcon';\n\nimport { styles } from './InternalTextareaWithLayout.styles';\n\ninterface InternalTextareaWithLayoutProps\n extends TextareaProps,\n Pick<InputProps, 'leftIcon' | 'rightIcon' | 'align' | 'borderless' | 'showClearIcon'> {}\n\ninterface InternalTextareaWithLayoutState {\n focused: boolean;\n hovered: boolean;\n clearCrossShowed: boolean;\n}\n\n@rootNode\nexport class InternalTextareaWithLayout extends React.Component<\n InternalTextareaWithLayoutProps,\n InternalTextareaWithLayoutState\n> {\n public static __KONTUR_REACT_UI__ = 'InternalTextareaWithLayout';\n private wrappedComponentRef = React.createRef<Textarea>();\n private theme!: Theme;\n private getProps = createPropsGetter(Textarea.defaultProps);\n\n public componentDidUpdate(prevProps: Readonly<InternalTextareaWithLayoutProps>) {\n const { focused, hovered } = this.state;\n if (Boolean(prevProps.value) !== Boolean(this.props.value)) {\n this.setState({ clearCrossShowed: this.getClearCrossShowed({ focused, hovered }) });\n }\n }\n\n private getClearCrossShowed = ({ focused, hovered }: { focused?: boolean; hovered?: boolean }): boolean => {\n if (this.props.disabled) {\n return false;\n }\n return calculateClearCrossShowedState({\n showClearIcon: this.getProps().showClearIcon || 'never',\n notEmptyValue: Boolean(this.props.value),\n focused,\n hovered,\n });\n };\n\n public state: InternalTextareaWithLayoutState = {\n focused: false,\n hovered: false,\n clearCrossShowed: this.getClearCrossShowed({ focused: false }),\n };\n\n public focus() {\n this.wrappedComponentRef.current?.focus();\n }\n public blur() {\n this.wrappedComponentRef.current?.blur();\n }\n public setSelectionRange(start: number, end: number) {\n this.wrappedComponentRef.current?.setSelectionRange(start, end);\n }\n public selectAll() {\n this.wrappedComponentRef.current?.selectAll();\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return <span data-tid={'InternalTextareaWithLayout'}>{this.renderLayout()}</span>;\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private getTextareaSizeClassName() {\n switch (this.getProps().size) {\n case 'large':\n return textareaStyles.textareaLarge(this.theme);\n case 'medium':\n return textareaStyles.textareaMedium(this.theme);\n case 'small':\n default:\n return textareaStyles.textareaSmall(this.theme);\n }\n }\n\n private getRootSizeClassName() {\n switch (this.getProps().size) {\n case 'large':\n return textareaStyles.rootLarge(this.theme);\n case 'medium':\n return textareaStyles.rootMedium(this.theme);\n case 'small':\n default:\n return textareaStyles.rootSmall(this.theme);\n }\n }\n\n private handleClearInput = () => {\n if (this.wrappedComponentRef.current) {\n this.wrappedComponentRef.current.clear();\n\n if (!this.state.focused) {\n this.wrappedComponentRef.current.focus();\n }\n }\n\n if (this.props.onValueChange) {\n this.props.onValueChange('');\n }\n };\n\n private getRightIcon = () => {\n const { size, rightIcon } = this.props;\n\n return this.state.clearCrossShowed ? (\n <ClearCrossIcon data-tid={InputDataTids.clearCross} size={size} onClick={this.handleClearInput} />\n ) : (\n rightIcon\n );\n };\n\n private handleMouseEnter = () => {\n this.setState({ clearCrossShowed: this.getClearCrossShowed({ focused: this.state.focused, hovered: true }) });\n };\n\n private handleMouseOut = () => {\n this.setState({ clearCrossShowed: this.getClearCrossShowed({ focused: this.state.focused, hovered: false }) });\n };\n\n private renderLayout = () => {\n const labelProps = {\n className: cx(\n styles.contentWrapper(),\n textareaStyles.textarea(this.theme),\n this.getTextareaSizeClassName(),\n this.getRootSizeClassName(),\n {\n [inputStyles.focus(this.theme)]: this.state.focused && !this.props.warning && !this.props.error,\n [inputStyles.borderless()]: this.props.borderless && !this.state.focused,\n [textareaStyles.disabled(this.theme)]: this.props.disabled,\n [textareaStyles.warning(this.theme)]: this.props.warning,\n [textareaStyles.error(this.theme)]: this.props.error,\n },\n ),\n style: { width: this.props.width || DEFAULT_WIDTH, minWidth: '0', position: 'relative' as const },\n onMouseEnter: this.handleMouseEnter,\n onMouseLeave: this.handleMouseOut,\n onClick: this.handleLayoutClick,\n };\n return (\n <InputLayout\n leftIcon={this.props.leftIcon}\n rightIcon={this.getRightIcon()}\n labelProps={labelProps}\n context={{ disabled: this.props.disabled, focused: this.state.focused, size: this.getProps().size }}\n tag=\"span\"\n >\n {this.renderTextarea()}\n </InputLayout>\n );\n };\n\n private get preparedTheme(): Theme {\n return ThemeFactory.create(\n {\n textareaWidth: 'auto',\n textareaBorderWidth: '0px',\n textareaPaddingXSmall: '0px',\n textareaPaddingXMedium: '0px',\n textareaPaddingXLarge: '0px',\n textareaPaddingYSmall: '0px',\n textareaPaddingYMedium: '0px',\n textareaPaddingYLarge: '0px',\n textareaOutlineWidth: '0px',\n textareaShadow: 'none',\n textareaDisabledBg: 'transparent',\n textareaBg: 'transparent',\n },\n this.theme,\n );\n }\n\n private renderTextarea = () => {\n const { leftIcon, rightIcon, borderless, ...textareaProps } = this.props;\n return (\n <ThemeContext.Provider value={this.preparedTheme}>\n <Textarea\n {...(isTestEnv ? { spellCheck: false } : {})}\n {...textareaProps}\n width={'100%'}\n ref={this.wrappedComponentRef}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n />\n </ThemeContext.Provider>\n );\n };\n\n private handleLayoutClick = () => {\n this.wrappedComponentRef.current?.focus();\n };\n private handleBlur = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n if (getRootNode(this)?.contains(event.relatedTarget)) {\n this.setState({ focused: false });\n } else {\n this.setState({\n focused: false,\n clearCrossShowed: this.getClearCrossShowed({ focused: false, hovered: this.state.hovered }),\n });\n this.props.onBlur?.(event);\n }\n };\n private handleFocus = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n this.setState({\n focused: true,\n clearCrossShowed: this.getClearCrossShowed({ focused: true, hovered: this.state.hovered }),\n });\n this.props.onFocus?.(event);\n };\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_InputLayout","_Textarea","_Textarea2","_Emotion","_ThemeContext","_ThemeFactory","_rootNode","_Input","_createPropsGetter","_currentEnvironment","_Input2","_ClearCrossIcon","_InternalTextareaWithLayout2","_excluded","_class","_InternalTextareaWithLayout","InternalTextareaWithLayout","exports","rootNode","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","wrappedComponentRef","React","createRef","getProps","createPropsGetter","Textarea","defaultProps","getClearCrossShowed","_ref","focused","hovered","props","disabled","calculateClearCrossShowedState","showClearIcon","notEmptyValue","Boolean","value","state","clearCrossShowed","handleClearInput","current","clear","focus","onValueChange","getRightIcon","_this$props","size","rightIcon","default","createElement","ClearCrossIcon","InputDataTids","clearCross","onClick","handleMouseEnter","setState","handleMouseOut","renderLayout","_cx","labelProps","className","cx","styles","contentWrapper","textareaStyles","textarea","theme","getTextareaSizeClassName","getRootSizeClassName","inputStyles","warning","error","borderless","style","width","DEFAULT_WIDTH","minWidth","position","onMouseEnter","onMouseLeave","handleLayoutClick","InputLayout","leftIcon","context","tag","renderTextarea","_this$props2","textareaProps","_objectWithoutPropertiesLoose2","ThemeContext","Provider","preparedTheme","_extends2","isTestEnv","spellCheck","ref","onFocus","handleFocus","onBlur","handleBlur","_this$wrappedComponen","event","_getRootNode","getRootNode","contains","relatedTarget","_inheritsLoose2","_proto","prototype","componentDidUpdate","prevProps","_this$state","_this$wrappedComponen2","blur","_this$wrappedComponen3","setSelectionRange","start","end","_this$wrappedComponen4","selectAll","_this$wrappedComponen5","getNode","_this$wrappedComponen6","render","_this2","Consumer","textareaLarge","textareaMedium","textareaSmall","rootLarge","rootMedium","rootSmall","_createClass2","key","get","ThemeFactory","create","textareaWidth","textareaBorderWidth","textareaPaddingXSmall","textareaPaddingXMedium","textareaPaddingXLarge","textareaPaddingYSmall","textareaPaddingYMedium","textareaPaddingYLarge","textareaOutlineWidth","textareaShadow","textareaDisabledBg","textareaBg","Component","__KONTUR_REACT_UI__"],"sources":["InternalTextareaWithLayout.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { InputProps } from '../../components/Input';\nimport { InputLayout } from '../../components/Input/InputLayout/InputLayout';\nimport { DEFAULT_WIDTH, Textarea } from '../../components/Textarea';\nimport type { TextareaProps } from '../../components/Textarea';\nimport { styles as textareaStyles } from '../../components/Textarea/Textarea.styles';\nimport { cx } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { getRootNode, rootNode } from '../../lib/rootNode';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { styles as inputStyles } from '../../components/Input/Input.styles';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { calculateClearCrossShowedState, InputDataTids } from '../../components/Input';\nimport { ClearCrossIcon } from '../ClearCrossIcon/ClearCrossIcon';\n\nimport { styles } from './InternalTextareaWithLayout.styles';\n\ninterface InternalTextareaWithLayoutProps\n extends TextareaProps,\n Pick<InputProps, 'leftIcon' | 'rightIcon' | 'align' | 'borderless' | 'showClearIcon'> {}\n\ninterface InternalTextareaWithLayoutState {\n focused: boolean;\n hovered: boolean;\n clearCrossShowed: boolean;\n}\n\n@rootNode\nexport class InternalTextareaWithLayout extends React.Component<\n InternalTextareaWithLayoutProps,\n InternalTextareaWithLayoutState\n> {\n public static __KONTUR_REACT_UI__ = 'InternalTextareaWithLayout';\n private wrappedComponentRef = React.createRef<Textarea>();\n private theme!: Theme;\n private getProps = createPropsGetter(Textarea.defaultProps);\n\n public componentDidUpdate(prevProps: Readonly<InternalTextareaWithLayoutProps>) {\n const { focused, hovered } = this.state;\n if (Boolean(prevProps.value) !== Boolean(this.props.value)) {\n this.setState({ clearCrossShowed: this.getClearCrossShowed({ focused, hovered }) });\n }\n }\n\n private getClearCrossShowed = ({ focused, hovered }: { focused?: boolean; hovered?: boolean }): boolean => {\n if (this.props.disabled) {\n return false;\n }\n return calculateClearCrossShowedState({\n showClearIcon: this.getProps().showClearIcon || 'never',\n notEmptyValue: Boolean(this.props.value),\n focused,\n hovered,\n });\n };\n\n public state: InternalTextareaWithLayoutState = {\n focused: false,\n hovered: false,\n clearCrossShowed: this.getClearCrossShowed({ focused: false }),\n };\n\n public focus() {\n this.wrappedComponentRef.current?.focus();\n }\n public blur() {\n this.wrappedComponentRef.current?.blur();\n }\n public setSelectionRange(start: number, end: number) {\n this.wrappedComponentRef.current?.setSelectionRange(start, end);\n }\n public selectAll() {\n this.wrappedComponentRef.current?.selectAll();\n }\n public getNode() {\n return this.wrappedComponentRef.current?.getNode();\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return <span data-tid={'InternalTextareaWithLayout'}>{this.renderLayout()}</span>;\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private getTextareaSizeClassName() {\n switch (this.getProps().size) {\n case 'large':\n return textareaStyles.textareaLarge(this.theme);\n case 'medium':\n return textareaStyles.textareaMedium(this.theme);\n case 'small':\n default:\n return textareaStyles.textareaSmall(this.theme);\n }\n }\n\n private getRootSizeClassName() {\n switch (this.getProps().size) {\n case 'large':\n return textareaStyles.rootLarge(this.theme);\n case 'medium':\n return textareaStyles.rootMedium(this.theme);\n case 'small':\n default:\n return textareaStyles.rootSmall(this.theme);\n }\n }\n\n private handleClearInput = () => {\n if (this.wrappedComponentRef.current) {\n this.wrappedComponentRef.current.clear();\n\n if (!this.state.focused) {\n this.wrappedComponentRef.current.focus();\n }\n }\n\n if (this.props.onValueChange) {\n this.props.onValueChange('');\n }\n };\n\n private getRightIcon = () => {\n const { size, rightIcon } = this.props;\n\n return this.state.clearCrossShowed ? (\n <ClearCrossIcon data-tid={InputDataTids.clearCross} size={size} onClick={this.handleClearInput} />\n ) : (\n rightIcon\n );\n };\n\n private handleMouseEnter = () => {\n this.setState({ clearCrossShowed: this.getClearCrossShowed({ focused: this.state.focused, hovered: true }) });\n };\n\n private handleMouseOut = () => {\n this.setState({ clearCrossShowed: this.getClearCrossShowed({ focused: this.state.focused, hovered: false }) });\n };\n\n private renderLayout = () => {\n const labelProps = {\n className: cx(\n styles.contentWrapper(),\n textareaStyles.textarea(this.theme),\n this.getTextareaSizeClassName(),\n this.getRootSizeClassName(),\n {\n [inputStyles.focus(this.theme)]: this.state.focused && !this.props.warning && !this.props.error,\n [inputStyles.borderless()]: this.props.borderless && !this.state.focused,\n [textareaStyles.disabled(this.theme)]: this.props.disabled,\n [textareaStyles.warning(this.theme)]: this.props.warning,\n [textareaStyles.error(this.theme)]: this.props.error,\n },\n ),\n style: { width: this.props.width || DEFAULT_WIDTH, minWidth: '0', position: 'relative' as const },\n onMouseEnter: this.handleMouseEnter,\n onMouseLeave: this.handleMouseOut,\n onClick: this.handleLayoutClick,\n };\n return (\n <InputLayout\n leftIcon={this.props.leftIcon}\n rightIcon={this.getRightIcon()}\n labelProps={labelProps}\n context={{ disabled: this.props.disabled, focused: this.state.focused, size: this.getProps().size }}\n tag=\"span\"\n >\n {this.renderTextarea()}\n </InputLayout>\n );\n };\n\n private get preparedTheme(): Theme {\n return ThemeFactory.create(\n {\n textareaWidth: 'auto',\n textareaBorderWidth: '0px',\n textareaPaddingXSmall: '0px',\n textareaPaddingXMedium: '0px',\n textareaPaddingXLarge: '0px',\n textareaPaddingYSmall: '0px',\n textareaPaddingYMedium: '0px',\n textareaPaddingYLarge: '0px',\n textareaOutlineWidth: '0px',\n textareaShadow: 'none',\n textareaDisabledBg: 'transparent',\n textareaBg: 'transparent',\n },\n this.theme,\n );\n }\n\n private renderTextarea = () => {\n const { leftIcon, rightIcon, borderless, ...textareaProps } = this.props;\n return (\n <ThemeContext.Provider value={this.preparedTheme}>\n <Textarea\n {...(isTestEnv ? { spellCheck: false } : {})}\n {...textareaProps}\n width={'100%'}\n ref={this.wrappedComponentRef}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n />\n </ThemeContext.Provider>\n );\n };\n\n private handleLayoutClick = () => {\n this.wrappedComponentRef.current?.focus();\n };\n private handleBlur = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n if (getRootNode(this)?.contains(event.relatedTarget)) {\n this.setState({ focused: false });\n } else {\n this.setState({\n focused: false,\n clearCrossShowed: this.getClearCrossShowed({ focused: false, hovered: this.state.hovered }),\n });\n this.props.onBlur?.(event);\n }\n };\n private handleFocus = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n this.setState({\n focused: true,\n clearCrossShowed: this.getClearCrossShowed({ focused: true, hovered: this.state.hovered }),\n });\n this.props.onFocus?.(event);\n };\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -13,6 +13,10 @@ export declare const Portal: {
|
|
|
13
13
|
export declare class RenderInnerContainer extends React.Component<RenderInnerContainerProps> {
|
|
14
14
|
static __KONTUR_REACT_UI__: string;
|
|
15
15
|
static displayName: string;
|
|
16
|
+
private kColorsCheckerRef;
|
|
17
|
+
componentDidMount(): void;
|
|
18
|
+
componentDidUpdate(): void;
|
|
19
|
+
private applyKonturColorsAttributes;
|
|
16
20
|
render(): React.ReactNode;
|
|
17
21
|
}
|
|
18
22
|
export {};
|
|
@@ -6,6 +6,8 @@ var _reactDom = _interopRequireDefault(require("react-dom"));
|
|
|
6
6
|
|
|
7
7
|
var _RenderContainer = require("./RenderContainer");
|
|
8
8
|
|
|
9
|
+
var KONTUR_COLORS_ATTRIBUTES = ['data-k-brand', 'data-k-accent', 'data-k-theme'];
|
|
10
|
+
|
|
9
11
|
|
|
10
12
|
|
|
11
13
|
|
|
@@ -41,9 +43,33 @@ var Portal = exports.Portal = function Portal(_ref) {var _ref2;var container = _
|
|
|
41
43
|
|
|
42
44
|
};var
|
|
43
45
|
|
|
44
|
-
RenderInnerContainer = exports.RenderInnerContainer = /*#__PURE__*/function (_React$Component) {function RenderInnerContainer() {
|
|
46
|
+
RenderInnerContainer = exports.RenderInnerContainer = /*#__PURE__*/function (_React$Component) {function RenderInnerContainer() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
kColorsCheckerRef = /*#__PURE__*/_react.default.createRef();return _this;}(0, _inheritsLoose2.default)(RenderInnerContainer, _React$Component);var _proto = RenderInnerContainer.prototype;_proto.
|
|
45
51
|
|
|
52
|
+
componentDidMount = function componentDidMount() {
|
|
53
|
+
this.applyKonturColorsAttributes();
|
|
54
|
+
};_proto.
|
|
46
55
|
|
|
56
|
+
componentDidUpdate = function componentDidUpdate() {
|
|
57
|
+
this.applyKonturColorsAttributes();
|
|
58
|
+
};_proto.
|
|
59
|
+
|
|
60
|
+
applyKonturColorsAttributes = function applyKonturColorsAttributes() {var _this$kColorsCheckerR;
|
|
61
|
+
var domContainer = this.props.domContainer;
|
|
62
|
+
var source = (_this$kColorsCheckerR = this.kColorsCheckerRef.current) == null ? void 0 : _this$kColorsCheckerR.closest(
|
|
63
|
+
KONTUR_COLORS_ATTRIBUTES.map(function (x) {return "[" + x + "]";}).join(',')
|
|
64
|
+
);
|
|
65
|
+
|
|
66
|
+
for (var _i = 0, _KONTUR_COLORS_ATTRIB = KONTUR_COLORS_ATTRIBUTES; _i < _KONTUR_COLORS_ATTRIB.length; _i++) {var attribute = _KONTUR_COLORS_ATTRIB[_i];
|
|
67
|
+
var value = source == null ? void 0 : source.getAttribute(attribute);
|
|
68
|
+
if (value) {
|
|
69
|
+
domContainer == null || domContainer.setAttribute(attribute, value);
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
};_proto.
|
|
47
73
|
|
|
48
74
|
render = function render() {
|
|
49
75
|
var _this$props = this.props,anchor = _this$props.anchor,children = _this$props.children,domContainer = _this$props.domContainer,rootId = _this$props.rootId;
|
|
@@ -55,7 +81,8 @@ RenderInnerContainer = exports.RenderInnerContainer = /*#__PURE__*/function (_Re
|
|
|
55
81
|
anchor, /*#__PURE__*/
|
|
56
82
|
_react.default.createElement(Portal, { key: "portal-ref", rt_rootID: rootId, container: domContainer },
|
|
57
83
|
children
|
|
58
|
-
)
|
|
84
|
+
), /*#__PURE__*/
|
|
85
|
+
_react.default.createElement("span", { ref: this.kColorsCheckerRef, style: { display: 'none' } })
|
|
59
86
|
);
|
|
60
87
|
|
|
61
88
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","_reactDom","_RenderContainer","SSRPlaceholder","default","createElement","Portal","exports","_ref","_ref2","container","rt_rootID","children","Fragment","ReactDOM","createPortal","PORTAL_INLET_ATTR","RenderInnerContainer","_React$Component","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_reactDom","_RenderContainer","KONTUR_COLORS_ATTRIBUTES","SSRPlaceholder","default","createElement","Portal","exports","_ref","_ref2","container","rt_rootID","children","Fragment","ReactDOM","createPortal","PORTAL_INLET_ATTR","RenderInnerContainer","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","kColorsCheckerRef","React","createRef","_inheritsLoose2","_proto","prototype","componentDidMount","applyKonturColorsAttributes","componentDidUpdate","_this$kColorsCheckerR","domContainer","props","source","current","closest","map","x","join","_i","_KONTUR_COLORS_ATTRIB","attribute","value","getAttribute","setAttribute","render","_this$props","anchor","rootId","inner","key","ref","style","display","Component","__KONTUR_REACT_UI__","displayName"],"sources":["RenderInnerContainer.tsx"],"sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\n\nimport type { Nullable } from '../../typings/utility-types';\n\nimport type { PortalProps, RenderContainerProps } from './RenderContainerTypes';\nimport { PORTAL_INLET_ATTR } from './RenderContainer';\n\nconst KONTUR_COLORS_ATTRIBUTES = ['data-k-brand', 'data-k-accent', 'data-k-theme'];\n\ninterface RenderInnerContainerProps extends RenderContainerProps {\n domContainer: Nullable<HTMLElement>;\n rootId: string;\n}\n\n// Заглушка нужна для корректной гидрации порталов после SSR,\n// которую реакт сам пока не поддерживает.\n// @see https://github.com/facebook/react/issues/13097\n// А также для вставки актуального render-container-id на клиенте.\n//\n// Дело в том, что во время гидрации, структура HTML на сервере\n// и на клиенте должна совпадать, иначе возможны артефакты.\n// Алгоритм там примерно такой. Клиент во время гидрации идет\n// по этим двум деревьям и сравнивает узлы. Элементы разных типов\n// он подменяет на свои. А те, что совпадают, он оставляет как есть\n// вместе со всеми атрибутами, навесив только обработчики событий.\n//\n// Поэтому, для портала, который рендерится только на клиенте,\n// нужно использовать серверную заглушку, чтобы при гидрации\n// он не испортил какой-то другой элемент. Null не подходит,\n// т.к. на сервере он тоже не рендерится.\n// А элемент с render-container-id нужно отрендерить с нуля.\n\nconst SSRPlaceholder = () => <script data-id=\"ssr-placeholder\" />;\n\nexport const Portal = ({ container, rt_rootID, children }: PortalProps) => {\n // container exists only in browser\n return (\n <React.Fragment>\n {container ? ReactDOM.createPortal(children, container) : <SSRPlaceholder />}\n {container ? <noscript {...{ [PORTAL_INLET_ATTR]: rt_rootID }} /> : <SSRPlaceholder />}\n </React.Fragment>\n );\n};\n\nexport class RenderInnerContainer extends React.Component<RenderInnerContainerProps> {\n public static __KONTUR_REACT_UI__ = 'RenderInnerContainer';\n public static displayName = 'RenderInnerContainer';\n\n private kColorsCheckerRef = React.createRef<HTMLSpanElement>();\n\n public componentDidMount() {\n this.applyKonturColorsAttributes();\n }\n\n public componentDidUpdate() {\n this.applyKonturColorsAttributes();\n }\n\n private applyKonturColorsAttributes() {\n const { domContainer } = this.props;\n const source = this.kColorsCheckerRef.current?.closest<HTMLElement>(\n KONTUR_COLORS_ATTRIBUTES.map((x) => `[${x}]`).join(','),\n );\n\n for (const attribute of KONTUR_COLORS_ATTRIBUTES) {\n const value = source?.getAttribute(attribute);\n if (value) {\n domContainer?.setAttribute(attribute, value);\n }\n }\n }\n\n public render() {\n const { anchor, children, domContainer, rootId } = this.props;\n let inner = anchor;\n\n if (children) {\n inner = (\n <React.Fragment>\n {anchor}\n <Portal key=\"portal-ref\" rt_rootID={rootId} container={domContainer}>\n {children}\n </Portal>\n <span ref={this.kColorsCheckerRef} style={{ display: 'none' }} />\n </React.Fragment>\n );\n }\n\n return inner;\n }\n}\n\nPortal.__KONTUR_REACT_UI__ = 'Portal';\nPortal.displayName = 'Portal';\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -25,7 +25,8 @@ var styles = exports.styles = (0, _Emotion.memoizeStyle)({
|
|
|
25
25
|
},
|
|
26
26
|
|
|
27
27
|
sidePageBody: function sidePageBody() {
|
|
28
|
-
return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n padding: 0 30px 30px;\n "])));
|
|
28
|
+
return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n padding: 0 30px 30px;\n overflow-x: hidden;\n "])));
|
|
29
|
+
|
|
29
30
|
|
|
30
31
|
|
|
31
32
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_templateObject12","_templateObject13","_templateObject14","_templateObject15","_templateObject16","_templateObject17","_templateObject18","_templateObject19","_templateObject20","styles","exports","memoizeStyle","playground","css","_taggedTemplateLiteralLoose2","default","title","t","textColorDefault","componentsGroup","sidePageBody","variable","borderColorFocus","variableName","deprecated","colorIcon","baseLinkWrapper","linkRoot","baseVariableRoot","loaderWrapper","loader","tabsWrapper","tooltipContent","stickyTabsWrapper","tabsInnerWrapper","playgroundWrapper","bgDefault","editorHeaderWrapper","editorGroupHeader"],"sources":["Playground.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport type { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n playground() {\n return css`\n margin: 0 -24px;\n padding: 0 24px;\n border-radius: 8px;\n `;\n },\n\n title(t: Theme) {\n return css`\n width: 110px;\n color: ${t.textColorDefault};\n `;\n },\n\n componentsGroup(t: Theme) {\n return css`\n max-width: 700px;\n color: ${t.textColorDefault};\n `;\n },\n\n sidePageBody() {\n return css`\n padding: 0 30px 30px;\n `;\n },\n\n variable(t: Theme) {\n return css`\n display: flex;\n align-items: center;\n margin-bottom: 16px;\n\n &:focus {\n outline: 1px solid ${t.borderColorFocus};\n outline-offset: 8px;\n }\n `;\n },\n\n variableName(t: Theme) {\n return css`\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n width: 250px;\n position: relative;\n z-index: 1;\n line-height: 34px;\n color: ${t.textColorDefault};\n flex: 1 1 auto;\n `;\n },\n\n deprecated() {\n return css`\n text-decoration: line-through;\n `;\n },\n\n colorIcon() {\n return css`\n height: 16px;\n width: 16px;\n `;\n },\n\n baseLinkWrapper() {\n return css`\n margin-left: auto;\n `;\n },\n\n linkRoot() {\n return css`\n position: relative;\n z-index: 1;\n `;\n },\n\n baseVariableRoot() {\n return css`\n position: relative;\n z-index: 1;\n width: 240px;\n display: flex;\n `;\n },\n\n loaderWrapper() {\n return css`\n width: 500px;\n `;\n },\n\n loader() {\n return css`\n height: 300px;\n margin: auto;\n `;\n },\n\n tabsWrapper(t: Theme) {\n return css`\n position: relative;\n color: ${t.textColorDefault};\n\n &::after {\n content: '';\n position: absolute;\n bottom: 0;\n left: 0;\n height: 1px;\n width: 100%;\n z-index: -1;\n }\n `;\n },\n\n tooltipContent() {\n return css`\n width: 210px;\n `;\n },\n\n stickyTabsWrapper(t: Theme) {\n return css`\n &:after {\n box-shadow: 0 2px 10px 0px ${t.textColorDefault};\n }\n `;\n },\n tabsInnerWrapper(t: Theme) {\n return css`\n color: ${t.textColorDefault};\n `;\n },\n playgroundWrapper(t: Theme) {\n return css`\n background: ${t.bgDefault};\n `;\n },\n editorHeaderWrapper(t: Theme) {\n return css`\n color: ${t.textColorDefault};\n `;\n },\n editorGroupHeader(t: Theme) {\n return css`\n color: ${t.textColorDefault};\n `;\n },\n});\n"],"mappings":"oRAAA,IAAAA,QAAA,GAAAC,OAAA,8BAA8D,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA;;;AAGvD,IAAMC,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,IAAAE,qBAAY,EAAC;EACjCC,UAAU,WAAAA,WAAA,EAAG;IACX,WAAOC,YAAG,EAAAxB,eAAA,KAAAA,eAAA,OAAAyB,4BAAA,CAAAC,OAAA;;;;;EAKZ,CAAC;;EAEDC,KAAK,WAAAA,MAACC,CAAQ,EAAE;IACd,WAAOJ,YAAG,EAAAvB,gBAAA,KAAAA,gBAAA,OAAAwB,4BAAA,CAAAC,OAAA;;IAECE,CAAC,CAACC,gBAAgB;;EAE/B,CAAC;;EAEDC,eAAe,WAAAA,gBAACF,CAAQ,EAAE;IACxB,WAAOJ,YAAG,EAAAtB,gBAAA,KAAAA,gBAAA,OAAAuB,4BAAA,CAAAC,OAAA;;IAECE,CAAC,CAACC,gBAAgB;;EAE/B,CAAC;;EAEDE,YAAY,WAAAA,aAAA,EAAG;IACb,WAAOP,YAAG,EAAArB,gBAAA,KAAAA,gBAAA,OAAAsB,4BAAA,CAAAC,OAAA
|
|
1
|
+
{"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_templateObject12","_templateObject13","_templateObject14","_templateObject15","_templateObject16","_templateObject17","_templateObject18","_templateObject19","_templateObject20","styles","exports","memoizeStyle","playground","css","_taggedTemplateLiteralLoose2","default","title","t","textColorDefault","componentsGroup","sidePageBody","variable","borderColorFocus","variableName","deprecated","colorIcon","baseLinkWrapper","linkRoot","baseVariableRoot","loaderWrapper","loader","tabsWrapper","tooltipContent","stickyTabsWrapper","tabsInnerWrapper","playgroundWrapper","bgDefault","editorHeaderWrapper","editorGroupHeader"],"sources":["Playground.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport type { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n playground() {\n return css`\n margin: 0 -24px;\n padding: 0 24px;\n border-radius: 8px;\n `;\n },\n\n title(t: Theme) {\n return css`\n width: 110px;\n color: ${t.textColorDefault};\n `;\n },\n\n componentsGroup(t: Theme) {\n return css`\n max-width: 700px;\n color: ${t.textColorDefault};\n `;\n },\n\n sidePageBody() {\n return css`\n padding: 0 30px 30px;\n overflow-x: hidden;\n `;\n },\n\n variable(t: Theme) {\n return css`\n display: flex;\n align-items: center;\n margin-bottom: 16px;\n\n &:focus {\n outline: 1px solid ${t.borderColorFocus};\n outline-offset: 8px;\n }\n `;\n },\n\n variableName(t: Theme) {\n return css`\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n width: 250px;\n position: relative;\n z-index: 1;\n line-height: 34px;\n color: ${t.textColorDefault};\n flex: 1 1 auto;\n `;\n },\n\n deprecated() {\n return css`\n text-decoration: line-through;\n `;\n },\n\n colorIcon() {\n return css`\n height: 16px;\n width: 16px;\n `;\n },\n\n baseLinkWrapper() {\n return css`\n margin-left: auto;\n `;\n },\n\n linkRoot() {\n return css`\n position: relative;\n z-index: 1;\n `;\n },\n\n baseVariableRoot() {\n return css`\n position: relative;\n z-index: 1;\n width: 240px;\n display: flex;\n `;\n },\n\n loaderWrapper() {\n return css`\n width: 500px;\n `;\n },\n\n loader() {\n return css`\n height: 300px;\n margin: auto;\n `;\n },\n\n tabsWrapper(t: Theme) {\n return css`\n position: relative;\n color: ${t.textColorDefault};\n\n &::after {\n content: '';\n position: absolute;\n bottom: 0;\n left: 0;\n height: 1px;\n width: 100%;\n z-index: -1;\n }\n `;\n },\n\n tooltipContent() {\n return css`\n width: 210px;\n `;\n },\n\n stickyTabsWrapper(t: Theme) {\n return css`\n &:after {\n box-shadow: 0 2px 10px 0px ${t.textColorDefault};\n }\n `;\n },\n tabsInnerWrapper(t: Theme) {\n return css`\n color: ${t.textColorDefault};\n `;\n },\n playgroundWrapper(t: Theme) {\n return css`\n background: ${t.bgDefault};\n `;\n },\n editorHeaderWrapper(t: Theme) {\n return css`\n color: ${t.textColorDefault};\n `;\n },\n editorGroupHeader(t: Theme) {\n return css`\n color: ${t.textColorDefault};\n `;\n },\n});\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -2,45 +2,11 @@ import type { ReactNode } from 'react';
|
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import type { Theme } from '../../lib/theming/Theme';
|
|
4
4
|
import type { Writeable } from '../../typings/utility-types';
|
|
5
|
-
import { ThemeType } from './constants';
|
|
6
|
-
interface PlaygroundState {
|
|
7
|
-
editorOpened: boolean;
|
|
8
|
-
editingThemeItem?: EditingThemeItem;
|
|
9
|
-
themes: Themes;
|
|
10
|
-
themesErrors: ThemesErrors;
|
|
11
|
-
currentTheme: Theme;
|
|
12
|
-
currentThemeType: ThemeType;
|
|
13
|
-
}
|
|
14
|
-
interface Themes {
|
|
15
|
-
lightTheme: Theme;
|
|
16
|
-
darkTheme: Theme;
|
|
17
|
-
}
|
|
18
|
-
interface ThemesErrors {
|
|
19
|
-
lightTheme: ThemeErrorsType;
|
|
20
|
-
darkTheme: ThemeErrorsType;
|
|
21
|
-
}
|
|
22
|
-
interface EditingThemeItem {
|
|
23
|
-
value: ThemeType;
|
|
24
|
-
label: string;
|
|
25
|
-
}
|
|
26
5
|
interface PlaygroundProps {
|
|
27
6
|
children?: ReactNode;
|
|
28
7
|
}
|
|
29
8
|
export type ThemeErrorsType = Writeable<{
|
|
30
9
|
[key in keyof Theme]?: boolean;
|
|
31
10
|
}>;
|
|
32
|
-
export declare
|
|
33
|
-
private readonly editableThemesItems;
|
|
34
|
-
constructor(props: PlaygroundProps);
|
|
35
|
-
render(): React.JSX.Element;
|
|
36
|
-
private renderSidePage;
|
|
37
|
-
private handleGetTheme;
|
|
38
|
-
private handleOpen;
|
|
39
|
-
private handleClose;
|
|
40
|
-
private handleThemeChange;
|
|
41
|
-
private handleThemeVariableChange;
|
|
42
|
-
private getEditableThemesItems;
|
|
43
|
-
private handleEditingThemeSwitch;
|
|
44
|
-
private changeThemeVariable;
|
|
45
|
-
}
|
|
11
|
+
export declare const ThemeContextPlayground: (props: PlaygroundProps) => React.JSX.Element;
|
|
46
12
|
export {};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.ThemeContextPlayground = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
|
|
2
|
-
var _react =
|
|
2
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
3
|
+
var _addonDocs = require("@storybook/addon-docs");
|
|
3
4
|
|
|
4
5
|
var _ThemeContext = require("../../lib/theming/ThemeContext");
|
|
5
6
|
|
|
@@ -37,6 +38,12 @@ var _constants = require("./constants");
|
|
|
37
38
|
|
|
38
39
|
|
|
39
40
|
|
|
41
|
+
|
|
42
|
+
|
|
43
|
+
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
|
|
40
47
|
|
|
41
48
|
|
|
42
49
|
|
|
@@ -51,13 +58,17 @@ var getEditingThemeType = function getEditingThemeType(editingThemeItem) {
|
|
|
51
58
|
|
|
52
59
|
return 'lightTheme';
|
|
53
60
|
};var
|
|
54
|
-
|
|
61
|
+
|
|
62
|
+
ThemeContextPlaygroundInternal = /*#__PURE__*/function (_React$Component) {
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
|
|
55
66
|
|
|
56
67
|
|
|
57
68
|
|
|
58
69
|
|
|
59
70
|
|
|
60
|
-
function
|
|
71
|
+
function ThemeContextPlaygroundInternal(props) {var _this;
|
|
61
72
|
_this = _React$Component.call(this, props) || this;_this.editableThemesItems = [{ value: _constants.ThemeType.LightTheme, label: 'Светлая тема' }, { value: _constants.ThemeType.DarkTheme, label: 'Тёмная тема' }];_this.
|
|
62
73
|
|
|
63
74
|
|
|
@@ -83,6 +94,12 @@ ThemeContextPlayground = exports.ThemeContextPlayground = /*#__PURE__*/function
|
|
|
83
94
|
|
|
84
95
|
|
|
85
96
|
|
|
97
|
+
|
|
98
|
+
|
|
99
|
+
|
|
100
|
+
|
|
101
|
+
|
|
102
|
+
|
|
86
103
|
|
|
87
104
|
|
|
88
105
|
|
|
@@ -97,7 +114,7 @@ ThemeContextPlayground = exports.ThemeContextPlayground = /*#__PURE__*/function
|
|
|
97
114
|
var themeErrors = themesErrors[editingThemeType];
|
|
98
115
|
|
|
99
116
|
return /*#__PURE__*/(
|
|
100
|
-
_react.default.createElement(_SidePage.SidePage, { disableAnimations: true, ignoreBackgroundClick: true,
|
|
117
|
+
_react.default.createElement(_SidePage.SidePage, { disableAnimations: true, ignoreBackgroundClick: true, width: 600, onClose: _this.handleClose }, /*#__PURE__*/
|
|
101
118
|
_react.default.createElement(_SidePage.SidePage.Header, null, /*#__PURE__*/
|
|
102
119
|
_react.default.createElement("div", { className: _Playground.styles.editorHeaderWrapper(currentTheme) }, /*#__PURE__*/
|
|
103
120
|
_react.default.createElement(_Gapped.Gapped, { wrap: true, verticalAlign: "middle" }, /*#__PURE__*/
|
|
@@ -212,4 +229,14 @@ ThemeContextPlayground = exports.ThemeContextPlayground = /*#__PURE__*/function
|
|
|
212
229
|
});
|
|
213
230
|
|
|
214
231
|
return _ThemeFactory.ThemeFactory.create(result);
|
|
215
|
-
};_this.state = { currentTheme: _LightTheme.LIGHT_THEME, currentThemeType: _constants.ThemeType.LightTheme, editorOpened: false, themes: { lightTheme: _LightTheme.LIGHT_THEME, darkTheme: _DarkTheme.DARK_THEME }, themesErrors: { lightTheme: {}, darkTheme: {} } };return _this;}(0, _inheritsLoose2.default)(
|
|
232
|
+
};_this.state = { currentTheme: _LightTheme.LIGHT_THEME, currentThemeType: _constants.ThemeType.LightTheme, editorOpened: false, themes: { lightTheme: _LightTheme.LIGHT_THEME, darkTheme: _DarkTheme.DARK_THEME }, themesErrors: { lightTheme: {}, darkTheme: {} } };return _this;}(0, _inheritsLoose2.default)(ThemeContextPlaygroundInternal, _React$Component);var _proto = ThemeContextPlaygroundInternal.prototype;_proto.render = function render() {var _this$state3 = this.state,currentTheme = _this$state3.currentTheme,editorOpened = _this$state3.editorOpened,currentThemeType = _this$state3.currentThemeType;var _this$props = this.props,globalBrand = _this$props.globalBrand,globalAccent = _this$props.globalAccent;var themeAttribute = currentThemeType === _constants.ThemeType.DarkTheme ? 'dark' : 'light';return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: currentTheme }, /*#__PURE__*/_react.default.createElement("div", { "data-k-brand": globalBrand, "data-k-accent": globalAccent, "data-k-theme": themeAttribute }, editorOpened && this.renderSidePage(), /*#__PURE__*/_react.default.createElement(_Playground2.Playground, { onThemeChange: this.handleThemeChange, currentThemeType: currentThemeType, onEditLinkClick: this.handleOpen })));};return ThemeContextPlaygroundInternal;}(_react.default.Component);
|
|
233
|
+
|
|
234
|
+
|
|
235
|
+
var ThemeContextPlayground = exports.ThemeContextPlayground = function ThemeContextPlayground(props) {var _context$store$userGl;
|
|
236
|
+
var context = (0, _react.useContext)(_addonDocs.DocsContext);
|
|
237
|
+
var globals = (context == null || (_context$store$userGl = context.store.userGlobals) == null ? void 0 : _context$store$userGl.globals) || {};
|
|
238
|
+
var brand = globals.brand || 'red';
|
|
239
|
+
var accent = globals.accent || 'gray';
|
|
240
|
+
|
|
241
|
+
return /*#__PURE__*/_react.default.createElement(ThemeContextPlaygroundInternal, (0, _extends2.default)({}, props, { globalBrand: brand, globalAccent: accent }));
|
|
242
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","_ThemeContext","_ThemeFactory","_SidePage","_Gapped","_ComboBox","_Link","ColorFunctions","_interopRequireWildcard","_ThemeHelpers","_LightTheme","_DarkTheme","_ThemeEditor","_Playground","_Playground2","_constants","getEditingThemeType","editingThemeItem","value","ThemeContextPlayground","exports","_React$Component","props","_this","call","editableThemesItems","ThemeType","LightTheme","label","DarkTheme","renderSidePage","_this$state","state","currentTheme","themesErrors","themes","editingThemeType","themeErrors","default","createElement","SidePage","disableAnimations","ignoreBackgroundClick","blockBackground","width","onClose","handleClose","Header","className","styles","editorHeaderWrapper","Gapped","wrap","verticalAlign","ComboBox","getItems","getEditableThemesItems","onValueChange","handleEditingThemeSwitch","style","fontSize","marginTop","Link","onClick","handleGetTheme","Body","sidePageBody","ThemeEditor","editingTheme","currentErrors","handleThemeVariableChange","themeObject","ThemeFactory","getKeys","forEach","key","descriptor","Object","getOwnPropertyDescriptor","get","LIGHT_THEME","console","log","JSON","stringify","handleOpen","setState","editorOpened","find","i","currentThemeType","handleThemeChange","themeType","variable","_this$state2","theme","currentValue","canSetVariable","isValid","nextThemeErrors","_extends2","stateUpdate","result","changeThemeVariable","query","Promise","resolve","filter","toLowerCase","includes","item","variableName","variableValue","findPropertyDescriptor","enumerable","configurable","set","defineProperty","create","lightTheme","darkTheme","DARK_THEME","_inheritsLoose2","_proto","prototype","render","_this$state3","ThemeContext","Provider","Playground","onThemeChange","onEditLinkClick","React","Component"],"sources":["ThemeContextPlayground.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport React from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport type { Theme, ThemeIn } from '../../lib/theming/Theme';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { SidePage } from '../../components/SidePage';\nimport { Gapped } from '../../components/Gapped';\nimport { ComboBox } from '../../components/ComboBox';\nimport { Link } from '../../components/Link';\nimport * as ColorFunctions from '../../lib/styles/ColorFunctions';\nimport type { Writeable } from '../../typings/utility-types';\nimport { findPropertyDescriptor } from '../../lib/theming/ThemeHelpers';\nimport { LIGHT_THEME } from '../../lib/theming/themes/LightTheme';\nimport { DARK_THEME } from '../../lib/theming/themes/DarkTheme';\n\nimport { ThemeEditor } from './ThemeEditor';\nimport { styles } from './Playground.styles';\nimport { Playground } from './Playground';\nimport { ThemeType } from './constants';\n\ninterface PlaygroundState {\n editorOpened: boolean;\n editingThemeItem?: EditingThemeItem;\n themes: Themes;\n themesErrors: ThemesErrors;\n currentTheme: Theme;\n currentThemeType: ThemeType;\n}\ninterface Themes {\n lightTheme: Theme;\n darkTheme: Theme;\n}\ninterface ThemesErrors {\n lightTheme: ThemeErrorsType;\n darkTheme: ThemeErrorsType;\n}\ninterface EditingThemeItem {\n value: ThemeType;\n label: string;\n}\ninterface PlaygroundProps {\n children?: ReactNode;\n}\nexport type ThemeErrorsType = Writeable<{ [key in keyof Theme]?: boolean }>;\n\nconst getEditingThemeType = (editingThemeItem: PlaygroundState['editingThemeItem']) => {\n if (editingThemeItem) {\n return editingThemeItem.value;\n }\n\n return 'lightTheme';\n};\nexport class ThemeContextPlayground extends React.Component<PlaygroundProps, PlaygroundState> {\n private readonly editableThemesItems = [\n { value: ThemeType.LightTheme, label: 'Светлая тема' },\n { value: ThemeType.DarkTheme, label: 'Тёмная тема' },\n ];\n\n constructor(props: PlaygroundProps) {\n super(props);\n this.state = {\n currentTheme: LIGHT_THEME,\n currentThemeType: ThemeType.LightTheme,\n editorOpened: false,\n themes: {\n lightTheme: LIGHT_THEME,\n darkTheme: DARK_THEME,\n },\n themesErrors: {\n lightTheme: {},\n darkTheme: {},\n },\n };\n }\n\n public render() {\n const { currentTheme, editorOpened, currentThemeType } = this.state;\n return (\n <ThemeContext.Provider value={currentTheme}>\n {editorOpened && this.renderSidePage()}\n {\n <Playground\n onThemeChange={this.handleThemeChange}\n currentThemeType={currentThemeType}\n onEditLinkClick={this.handleOpen}\n />\n }\n </ThemeContext.Provider>\n );\n }\n\n private renderSidePage = () => {\n const { currentTheme, themesErrors, editingThemeItem, themes } = this.state;\n\n const editingThemeType = getEditingThemeType(editingThemeItem);\n const themeErrors = themesErrors[editingThemeType];\n\n return (\n <SidePage disableAnimations ignoreBackgroundClick blockBackground width={600} onClose={this.handleClose}>\n <SidePage.Header>\n <div className={styles.editorHeaderWrapper(currentTheme)}>\n <Gapped wrap verticalAlign=\"middle\">\n <span>Тема для редактирования:</span>\n <ComboBox\n getItems={this.getEditableThemesItems}\n value={editingThemeItem}\n onValueChange={this.handleEditingThemeSwitch}\n />\n </Gapped>\n </div>\n <div style={{ fontSize: 14, marginTop: 8 }}>\n <Link onClick={this.handleGetTheme}>Вывести тему в консоль</Link>\n </div>\n </SidePage.Header>\n <SidePage.Body>\n <div className={styles.sidePageBody()}>\n <ThemeEditor\n editingTheme={themes[editingThemeType]}\n currentTheme={currentTheme}\n currentErrors={themeErrors}\n onValueChange={this.handleThemeVariableChange}\n />\n </div>\n </SidePage.Body>\n </SidePage>\n );\n };\n\n private handleGetTheme = () => {\n const currentTheme = this.state.currentTheme;\n const themeObject: Writeable<ThemeIn> = {};\n ThemeFactory.getKeys(currentTheme).forEach((key) => {\n const descriptor = Object.getOwnPropertyDescriptor(currentTheme, key);\n if (descriptor && !descriptor.get && LIGHT_THEME[key] && currentTheme[key] !== LIGHT_THEME[key]) {\n themeObject[key] = currentTheme[key] as keyof Theme;\n }\n });\n\n console.log(JSON.stringify(themeObject));\n };\n\n private handleOpen = () => {\n this.setState((state) => ({\n editorOpened: true,\n editingThemeItem: this.editableThemesItems.find((i) => i.value === state.currentThemeType),\n }));\n };\n\n private handleClose = () => {\n this.setState({\n editorOpened: false,\n });\n };\n\n private handleThemeChange = (value: string) => {\n const themeType = value as ThemeType;\n this.setState({\n currentThemeType: themeType,\n currentTheme: this.state.themes[themeType],\n });\n };\n\n private handleThemeVariableChange = (variable: keyof Theme, value: string) => {\n const { editingThemeItem, currentTheme, themes, themesErrors } = this.state;\n const editingThemeType = getEditingThemeType(editingThemeItem);\n\n const theme = themes[editingThemeType];\n const currentValue = theme[variable] as string;\n\n let canSetVariable = true;\n if (ColorFunctions.isValid(currentValue)) {\n canSetVariable = ColorFunctions.isValid(value);\n themesErrors[editingThemeType][variable] = !canSetVariable;\n }\n\n const nextThemeErrors: ThemesErrors = { ...themesErrors };\n nextThemeErrors[editingThemeType][variable] = !canSetVariable;\n const stateUpdate = { themes, currentTheme, themesErrors: nextThemeErrors };\n\n if (canSetVariable) {\n const result = this.changeThemeVariable(theme, variable, value);\n stateUpdate.themes[editingThemeType] = result;\n if (this.state.currentThemeType === editingThemeType) {\n stateUpdate.currentTheme = result;\n }\n }\n\n this.setState(stateUpdate);\n };\n\n private getEditableThemesItems = (query: string) => {\n return Promise.resolve(this.editableThemesItems.filter((i) => i.label.toLowerCase().includes(query.toLowerCase())));\n };\n\n private handleEditingThemeSwitch = (item: EditingThemeItem) => {\n this.setState({ editingThemeItem: item });\n };\n\n private changeThemeVariable = (theme: Theme, variableName: keyof Theme, variableValue: string): Theme => {\n const result: ThemeIn = {};\n ThemeFactory.getKeys(theme).forEach((key) => {\n const descriptor = findPropertyDescriptor(theme, key);\n descriptor.enumerable = true;\n descriptor.configurable = true;\n if (key === variableName) {\n delete descriptor.get;\n delete descriptor.set;\n descriptor.value = variableValue;\n }\n Object.defineProperty(result, key, descriptor);\n });\n\n return ThemeFactory.create<ThemeIn>(result);\n };\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_addonDocs","_ThemeContext","_ThemeFactory","_SidePage","_Gapped","_ComboBox","_Link","ColorFunctions","_ThemeHelpers","_LightTheme","_DarkTheme","_ThemeEditor","_Playground","_Playground2","_constants","getEditingThemeType","editingThemeItem","value","ThemeContextPlaygroundInternal","_React$Component","props","_this","call","editableThemesItems","ThemeType","LightTheme","label","DarkTheme","renderSidePage","_this$state","state","currentTheme","themesErrors","themes","editingThemeType","themeErrors","default","createElement","SidePage","disableAnimations","ignoreBackgroundClick","width","onClose","handleClose","Header","className","styles","editorHeaderWrapper","Gapped","wrap","verticalAlign","ComboBox","getItems","getEditableThemesItems","onValueChange","handleEditingThemeSwitch","style","fontSize","marginTop","Link","onClick","handleGetTheme","Body","sidePageBody","ThemeEditor","editingTheme","currentErrors","handleThemeVariableChange","themeObject","ThemeFactory","getKeys","forEach","key","descriptor","Object","getOwnPropertyDescriptor","get","LIGHT_THEME","console","log","JSON","stringify","handleOpen","setState","editorOpened","find","i","currentThemeType","handleThemeChange","themeType","variable","_this$state2","theme","currentValue","canSetVariable","isValid","nextThemeErrors","_extends2","stateUpdate","result","changeThemeVariable","query","Promise","resolve","filter","toLowerCase","includes","item","variableName","variableValue","findPropertyDescriptor","enumerable","configurable","set","defineProperty","create","lightTheme","darkTheme","DARK_THEME","_inheritsLoose2","_proto","prototype","render","_this$state3","_this$props","globalBrand","globalAccent","themeAttribute","ThemeContext","Provider","Playground","onThemeChange","onEditLinkClick","React","Component","ThemeContextPlayground","exports","_context$store$userGl","context","useContext","DocsContext","globals","store","userGlobals","brand","accent"],"sources":["ThemeContextPlayground.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport React, { useContext } from 'react';\nimport { DocsContext } from '@storybook/addon-docs';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport type { Theme, ThemeIn } from '../../lib/theming/Theme';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { SidePage } from '../../components/SidePage';\nimport { Gapped } from '../../components/Gapped';\nimport { ComboBox } from '../../components/ComboBox';\nimport { Link } from '../../components/Link';\nimport * as ColorFunctions from '../../lib/styles/ColorFunctions';\nimport type { Writeable } from '../../typings/utility-types';\nimport { findPropertyDescriptor } from '../../lib/theming/ThemeHelpers';\nimport { LIGHT_THEME } from '../../lib/theming/themes/LightTheme';\nimport { DARK_THEME } from '../../lib/theming/themes/DarkTheme';\n\nimport { ThemeEditor } from './ThemeEditor';\nimport { styles } from './Playground.styles';\nimport { Playground } from './Playground';\nimport { ThemeType } from './constants';\n\ninterface PlaygroundState {\n editorOpened: boolean;\n editingThemeItem?: EditingThemeItem;\n themes: Themes;\n themesErrors: ThemesErrors;\n currentTheme: Theme;\n currentThemeType: ThemeType;\n}\ninterface Themes {\n lightTheme: Theme;\n darkTheme: Theme;\n}\ninterface ThemesErrors {\n lightTheme: ThemeErrorsType;\n darkTheme: ThemeErrorsType;\n}\ninterface EditingThemeItem {\n value: ThemeType;\n label: string;\n}\ninterface PlaygroundProps {\n children?: ReactNode;\n}\n\ninterface PlaygroundWrapperProps {\n globalBrand: string;\n globalAccent: string;\n}\n\nexport type ThemeErrorsType = Writeable<{ [key in keyof Theme]?: boolean }>;\n\nconst getEditingThemeType = (editingThemeItem: PlaygroundState['editingThemeItem']) => {\n if (editingThemeItem) {\n return editingThemeItem.value;\n }\n\n return 'lightTheme';\n};\n\nclass ThemeContextPlaygroundInternal extends React.Component<\n PlaygroundProps & PlaygroundWrapperProps,\n PlaygroundState\n> {\n private readonly editableThemesItems = [\n { value: ThemeType.LightTheme, label: 'Светлая тема' },\n { value: ThemeType.DarkTheme, label: 'Тёмная тема' },\n ];\n\n constructor(props: PlaygroundProps & PlaygroundWrapperProps) {\n super(props);\n this.state = {\n currentTheme: LIGHT_THEME,\n currentThemeType: ThemeType.LightTheme,\n editorOpened: false,\n themes: {\n lightTheme: LIGHT_THEME,\n darkTheme: DARK_THEME,\n },\n themesErrors: {\n lightTheme: {},\n darkTheme: {},\n },\n };\n }\n\n public render() {\n const { currentTheme, editorOpened, currentThemeType } = this.state;\n const { globalBrand, globalAccent } = this.props;\n\n const themeAttribute = currentThemeType === ThemeType.DarkTheme ? 'dark' : 'light';\n\n return (\n <ThemeContext.Provider value={currentTheme}>\n <div data-k-brand={globalBrand} data-k-accent={globalAccent} data-k-theme={themeAttribute}>\n {editorOpened && this.renderSidePage()}\n {\n <Playground\n onThemeChange={this.handleThemeChange}\n currentThemeType={currentThemeType}\n onEditLinkClick={this.handleOpen}\n />\n }\n </div>\n </ThemeContext.Provider>\n );\n }\n\n private renderSidePage = () => {\n const { currentTheme, themesErrors, editingThemeItem, themes } = this.state;\n\n const editingThemeType = getEditingThemeType(editingThemeItem);\n const themeErrors = themesErrors[editingThemeType];\n\n return (\n <SidePage disableAnimations ignoreBackgroundClick width={600} onClose={this.handleClose}>\n <SidePage.Header>\n <div className={styles.editorHeaderWrapper(currentTheme)}>\n <Gapped wrap verticalAlign=\"middle\">\n <span>Тема для редактирования:</span>\n <ComboBox\n getItems={this.getEditableThemesItems}\n value={editingThemeItem}\n onValueChange={this.handleEditingThemeSwitch}\n />\n </Gapped>\n </div>\n <div style={{ fontSize: 14, marginTop: 8 }}>\n <Link onClick={this.handleGetTheme}>Вывести тему в консоль</Link>\n </div>\n </SidePage.Header>\n <SidePage.Body>\n <div className={styles.sidePageBody()}>\n <ThemeEditor\n editingTheme={themes[editingThemeType]}\n currentTheme={currentTheme}\n currentErrors={themeErrors}\n onValueChange={this.handleThemeVariableChange}\n />\n </div>\n </SidePage.Body>\n </SidePage>\n );\n };\n\n private handleGetTheme = () => {\n const currentTheme = this.state.currentTheme;\n const themeObject: Writeable<ThemeIn> = {};\n ThemeFactory.getKeys(currentTheme).forEach((key) => {\n const descriptor = Object.getOwnPropertyDescriptor(currentTheme, key);\n if (descriptor && !descriptor.get && LIGHT_THEME[key] && currentTheme[key] !== LIGHT_THEME[key]) {\n themeObject[key] = currentTheme[key] as keyof Theme;\n }\n });\n\n console.log(JSON.stringify(themeObject));\n };\n\n private handleOpen = () => {\n this.setState((state) => ({\n editorOpened: true,\n editingThemeItem: this.editableThemesItems.find((i) => i.value === state.currentThemeType),\n }));\n };\n\n private handleClose = () => {\n this.setState({\n editorOpened: false,\n });\n };\n\n private handleThemeChange = (value: string) => {\n const themeType = value as ThemeType;\n this.setState({\n currentThemeType: themeType,\n currentTheme: this.state.themes[themeType],\n });\n };\n\n private handleThemeVariableChange = (variable: keyof Theme, value: string) => {\n const { editingThemeItem, currentTheme, themes, themesErrors } = this.state;\n const editingThemeType = getEditingThemeType(editingThemeItem);\n\n const theme = themes[editingThemeType];\n const currentValue = theme[variable] as string;\n\n let canSetVariable = true;\n if (ColorFunctions.isValid(currentValue)) {\n canSetVariable = ColorFunctions.isValid(value);\n themesErrors[editingThemeType][variable] = !canSetVariable;\n }\n\n const nextThemeErrors: ThemesErrors = { ...themesErrors };\n nextThemeErrors[editingThemeType][variable] = !canSetVariable;\n const stateUpdate = { themes, currentTheme, themesErrors: nextThemeErrors };\n\n if (canSetVariable) {\n const result = this.changeThemeVariable(theme, variable, value);\n stateUpdate.themes[editingThemeType] = result;\n if (this.state.currentThemeType === editingThemeType) {\n stateUpdate.currentTheme = result;\n }\n }\n\n this.setState(stateUpdate);\n };\n\n private getEditableThemesItems = (query: string) => {\n return Promise.resolve(this.editableThemesItems.filter((i) => i.label.toLowerCase().includes(query.toLowerCase())));\n };\n\n private handleEditingThemeSwitch = (item: EditingThemeItem) => {\n this.setState({ editingThemeItem: item });\n };\n\n private changeThemeVariable = (theme: Theme, variableName: keyof Theme, variableValue: string): Theme => {\n const result: ThemeIn = {};\n ThemeFactory.getKeys(theme).forEach((key) => {\n const descriptor = findPropertyDescriptor(theme, key);\n descriptor.enumerable = true;\n descriptor.configurable = true;\n if (key === variableName) {\n delete descriptor.get;\n delete descriptor.set;\n descriptor.value = variableValue;\n }\n Object.defineProperty(result, key, descriptor);\n });\n\n return ThemeFactory.create<ThemeIn>(result);\n };\n}\n\nexport const ThemeContextPlayground = (props: PlaygroundProps) => {\n const context = useContext(DocsContext) as any;\n const globals = context?.store.userGlobals?.globals || {};\n const brand = globals.brand || 'red';\n const accent = globals.accent || 'gray';\n\n return <ThemeContextPlaygroundInternal {...props} globalBrand={brand} globalAccent={accent} />;\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -4,13 +4,8 @@ var _BasicTheme = require("./BasicTheme");
|
|
|
4
4
|
var _DarkTheme5_2 = require("./DarkTheme5_4");var _DarkTheme5_;
|
|
5
5
|
|
|
6
6
|
var DarkTheme5_5 = exports.DarkTheme5_5 = (0, _ThemeHelpers.createTheme)({
|
|
7
|
-
themeClass: (_DarkTheme5_ = /*#__PURE__*/function (_BasicThemeClassForEx) {function DarkTheme5_5() {return _BasicThemeClassForEx.apply(this, arguments) || this;}(0, _inheritsLoose2.default)(DarkTheme5_5, _BasicThemeClassForEx);return (0, _createClass2.default)(DarkTheme5_5, null, [{ key: "
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
function get() {
|
|
11
|
-
return this.bgSecondary;
|
|
12
|
-
} }, { key: "fileUploaderErrorColor", get:
|
|
13
|
-
|
|
7
|
+
themeClass: (_DarkTheme5_ = /*#__PURE__*/function (_BasicThemeClassForEx) {function DarkTheme5_5() {return _BasicThemeClassForEx.apply(this, arguments) || this;}(0, _inheritsLoose2.default)(DarkTheme5_5, _BasicThemeClassForEx);return (0, _createClass2.default)(DarkTheme5_5, null, [{ key: "fileUploaderErrorColor", get:
|
|
8
|
+
//#region FileUploader
|
|
14
9
|
function get() {
|
|
15
10
|
return this.textColorDisabled;
|
|
16
11
|
} }, { key: "fileUploaderErrorTextColor", get:
|
|
@@ -47,7 +42,7 @@ var DarkTheme5_5 = exports.DarkTheme5_5 = (0, _ThemeHelpers.createTheme)({
|
|
|
47
42
|
return this.fileUploaderDisabledIconColor;
|
|
48
43
|
}
|
|
49
44
|
//#endregion FileUploader
|
|
50
|
-
}]);}(_BasicTheme.BasicThemeClassForExtension), _DarkTheme5_.
|
|
45
|
+
}]);}(_BasicTheme.BasicThemeClassForExtension), _DarkTheme5_.fileUploaderFileTypeUnknownIconColor = '#676767', _DarkTheme5_.fileUploaderPaddingXSmall = '7px', _DarkTheme5_.fileUploaderPaddingXMedium = '9px', _DarkTheme5_.fileUploaderPaddingXLarge = '11px', _DarkTheme5_.fileUploaderErrorBgColor = '#4F2421', _DarkTheme5_.fileUploaderErrorBgHoverColor = '#612A29', _DarkTheme5_.fileUploaderWarningBgColor = '#3F2F1E', _DarkTheme5_.fileUploaderWarningBgHoverColor = '#4C3923', _DarkTheme5_.fileUploaderWarningTextColor = '#FDD481', _DarkTheme5_.fileUploaderDisabledColor = 'rgba(255, 255, 255, 0.54)', _DarkTheme5_.fileUploaderDisabledIconColor = 'rgba(255, 255, 255, 0.32)', _DarkTheme5_),
|
|
51
46
|
prototypeTheme: _DarkTheme5_2.DarkTheme5_4,
|
|
52
47
|
themeMarkers: [(0, _ThemeHelpers.markThemeVersion)('5.5')]
|
|
53
48
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_ThemeHelpers","require","_BasicTheme","_DarkTheme5_2","_DarkTheme5_","DarkTheme5_5","exports","createTheme","themeClass","_BasicThemeClassForEx","apply","arguments","_inheritsLoose2","default","_createClass2","key","get","
|
|
1
|
+
{"version":3,"names":["_ThemeHelpers","require","_BasicTheme","_DarkTheme5_2","_DarkTheme5_","DarkTheme5_5","exports","createTheme","themeClass","_BasicThemeClassForEx","apply","arguments","_inheritsLoose2","default","_createClass2","key","get","textColorDisabled","errorText","fileUploaderTextColorDefault","gray","borderColorGrayLight","fileUploaderDisabledColor","fileUploaderDisabledIconColor","BasicThemeClassForExtension","fileUploaderFileTypeUnknownIconColor","fileUploaderPaddingXSmall","fileUploaderPaddingXMedium","fileUploaderPaddingXLarge","fileUploaderErrorBgColor","fileUploaderErrorBgHoverColor","fileUploaderWarningBgColor","fileUploaderWarningBgHoverColor","fileUploaderWarningTextColor","prototypeTheme","DarkTheme5_4","themeMarkers","markThemeVersion"],"sources":["DarkTheme5_5.ts"],"sourcesContent":["import { createTheme, markThemeVersion } from '../../lib/theming/ThemeHelpers';\n\nimport { BasicThemeClassForExtension } from './BasicTheme';\nimport { DarkTheme5_4 } from './DarkTheme5_4';\n\nexport const DarkTheme5_5 = createTheme({\n themeClass: class DarkTheme5_5 extends BasicThemeClassForExtension {\n //#region FileUploader\n public static get fileUploaderErrorColor() {\n return this.textColorDisabled;\n }\n\n public static fileUploaderFileTypeUnknownIconColor = '#676767';\n public static fileUploaderPaddingXSmall = '7px';\n public static fileUploaderPaddingXMedium = '9px';\n public static fileUploaderPaddingXLarge = '11px';\n\n public static fileUploaderErrorBgColor = '#4F2421';\n public static fileUploaderErrorBgHoverColor = '#612A29';\n public static get fileUploaderErrorTextColor() {\n return this.errorText;\n }\n public static fileUploaderWarningBgColor = '#3F2F1E';\n public static fileUploaderWarningBgHoverColor = '#4C3923';\n public static fileUploaderWarningTextColor = '#FDD481';\n\n public static get fileUploaderValidationTextColor() {\n return this.fileUploaderTextColorDefault;\n }\n public static get fileUploaderAfterLinkColor() {\n return this.gray;\n }\n public static get fileUploaderBorderColor() {\n return this.borderColorGrayLight;\n }\n public static fileUploaderDisabledColor = 'rgba(255, 255, 255, 0.54)';\n public static fileUploaderDisabledIconColor = 'rgba(255, 255, 255, 0.32)';\n public static get fileUploaderDisabledTextColor() {\n return this.fileUploaderDisabledColor;\n }\n public static get fileUploaderDisabledFileTypeIcon() {\n return this.fileUploaderDisabledIconColor;\n }\n //#endregion FileUploader\n },\n prototypeTheme: DarkTheme5_4,\n themeMarkers: [markThemeVersion('5.5')],\n});\n"],"mappings":"0VAAA,IAAAA,aAAA,GAAAC,OAAA;;AAEA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,aAAA,GAAAF,OAAA,mBAA8C,IAAAG,YAAA;;AAEvC,IAAMC,YAAY,GAAAC,OAAA,CAAAD,YAAA,GAAG,IAAAE,yBAAW,EAAC;EACtCC,UAAU,GAAAJ,YAAA,0BAAAK,qBAAA,YAAAJ,aAAA,UAAAI,qBAAA,CAAAC,KAAA,OAAAC,SAAA,eAAAC,eAAA,CAAAC,OAAA,EAAAR,YAAA,EAAAI,qBAAA,aAAAK,aAAA,CAAAD,OAAA,EAAAR,YAAA,WAAAU,GAAA,4BAAAC,GAAA;MACR;MACA,SAAAA,IAAA,EAA2C;QACzC,OAAO,IAAI,CAACC,iBAAiB;MAC/B,CAAC,MAAAF,GAAA,gCAAAC,GAAA;;;;;;;;;MASD,SAAAA,IAAA,EAA+C;QAC7C,OAAO,IAAI,CAACE,SAAS;MACvB,CAAC,MAAAH,GAAA,qCAAAC,GAAA;;;;;MAKD,SAAAA,IAAA,EAAoD;QAClD,OAAO,IAAI,CAACG,4BAA4B;MAC1C,CAAC,MAAAJ,GAAA,gCAAAC,GAAA;MACD,SAAAA,IAAA,EAA+C;QAC7C,OAAO,IAAI,CAACI,IAAI;MAClB,CAAC,MAAAL,GAAA,6BAAAC,GAAA;MACD,SAAAA,IAAA,EAA4C;QAC1C,OAAO,IAAI,CAACK,oBAAoB;MAClC,CAAC,MAAAN,GAAA,mCAAAC,GAAA;;;MAGD,SAAAA,IAAA,EAAkD;QAChD,OAAO,IAAI,CAACM,yBAAyB;MACvC,CAAC,MAAAP,GAAA,sCAAAC,GAAA;MACD,SAAAA,IAAA,EAAqD;QACnD,OAAO,IAAI,CAACO,6BAA6B;MAC3C;MACA;IAAA,MArCqCC,uCAA2B,GAAApB,YAAA,CAMlDqB,oCAAoC,GAAG,SAAS,EAAArB,YAAA,CAChDsB,yBAAyB,GAAG,KAAK,EAAAtB,YAAA,CACjCuB,0BAA0B,GAAG,KAAK,EAAAvB,YAAA,CAClCwB,yBAAyB,GAAG,MAAM,EAAAxB,YAAA,CAElCyB,wBAAwB,GAAG,SAAS,EAAAzB,YAAA,CACpC0B,6BAA6B,GAAG,SAAS,EAAA1B,YAAA,CAIzC2B,0BAA0B,GAAG,SAAS,EAAA3B,YAAA,CACtC4B,+BAA+B,GAAG,SAAS,EAAA5B,YAAA,CAC3C6B,4BAA4B,GAAG,SAAS,EAAA7B,YAAA,CAWxCkB,yBAAyB,GAAG,2BAA2B,EAAAlB,YAAA,CACvDmB,6BAA6B,GAAG,2BAA2B,EAAAnB,YAAA,CAQ1E;EACD8B,cAAc,EAAEC,0BAAY;EAC5BC,YAAY,EAAE,CAAC,IAAAC,8BAAgB,EAAC,KAAK,CAAC;AACxC,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const DarkTheme5_6: Readonly<typeof import("./BasicTheme").BasicThemeClass>;
|