npm - @skbkontur/react-ui - Versions diffs - 6.4.6 → 6.4.7-25ce4.0 - Mend

@skbkontur/react-ui 6.4.6 → 6.4.7-25ce4.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.

Files changed (908) hide show

package/components/Tabs/Tab.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tab.js","sourceRoot":"","sources":["Tab.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport invariant from 'invariant';\nimport type { AriaAttributes } from 'react';\nimport React from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { getVisualStateDataAttributes } from '../../internal/CommonWrapper/utils/getVisualStateDataAttributes.js';\nimport { ResizeDetector } from '../../internal/ResizeDetector/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { isKeyArrow, isKeyArrowLeft, isKeyArrowUp } from '../../lib/events/keyboard/identifiers.js';\nimport { KeyListener } from '../../lib/events/keyListener.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { isFunctionalComponent } from '../../lib/utils.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport { getHorizontalStyles, getStyles, getVerticalStyles, globalClasses } from './Tab.styles.js';\nimport { TabsContext, TabsContextDefaultValue } from './TabsContext.js';\nimport type { TabsContextType } from './TabsContext.js';\n\nexport interface TabIndicators {\n error: boolean;\n warning: boolean;\n success: boolean;\n primary: boolean;\n disabled: boolean;\n}\n\nexport const TabDataTids = {\n root: 'Tab__root',\n} as const;\n\nexport interface TabProps<T extends string = string>\n extends Pick<AriaAttributes, 'aria-label' \| 'aria-describedby'>, CommonProps {\n /** Компонент или тег для рендера корневого элемента. /\n component?: React.ComponentType<any> \| string;\n\n /* HTML-атрибут `href`. /\n href?: string;\n\n /* Уникальный идентификатор таба. По нему компонент `<Tabs />` определяет выбранный таб. /\n id?: T;\n\n /`HTML`-событие `onclick`. /\n onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n\n /** `HTML`-событие `onkeydown`. /\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n\n /* Делает таб недоступным. /\n disabled?: boolean;\n\n /* Переводит таб в состояние ошибки. /\n error?: boolean;\n\n /* Переводит таб в состояние предупреждения. /\n warning?: boolean;\n\n /* Переводит таб в состояние успеха. /\n success?: boolean;\n\n /* Визульное состояние главного элемента. /\n primary?: boolean;\n}\n\nexport interface TabState {\n focusedByKeyboard: boolean;\n}\n\ntype DefaultProps = Required<Pick<TabProps, 'component' \| 'href'>>;\n\n/\n Табы группируют контент и помогают в навигации.\n \n /\n@withRenderEnvironment\n@rootNode\nexport class Tab<T extends string = string> extends React.Component<TabProps<T>, TabState> {\n public static __KONTUR_REACT_UI__ = 'Tab';\n public static displayName = 'Tab';\n\n public static contextType = TabsContext;\n public context: TabsContextType = this.context;\n\n public static defaultProps: DefaultProps = {\n component: 'a',\n href: '',\n };\n\n private getProps = createPropsGetter(Tab.defaultProps);\n\n public state: TabState = {\n focusedByKeyboard: false,\n };\n\n private globalObject!: GlobalObject;\n private emotion!: Emotion;\n private cx!: Emotion['cx'];\n private styles!: ReturnType<typeof getStyles>;\n private horizontalStyles!: ReturnType<typeof getHorizontalStyles>;\n private verticalStyles!: ReturnType<typeof getVerticalStyles>;\n private theme!: Theme;\n private tabComponent: Nullable<React.ReactElement<Tab<T>>> = null;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n private keyListener!: KeyListener;\n\n constructor(props: TabProps<T>) {\n super(props);\n invariant(this.context !== TabsContextDefaultValue, 'Tab should be placed inside Tabs component');\n }\n\n public componentDidMount() {\n this.keyListener = new KeyListener(this.globalObject);\n const id = this.getId();\n if (typeof id === 'string') {\n this.context.addTab(id, this.getTabInstance);\n }\n }\n\n public componentDidUpdate() {\n if (this.context.activeTab === this.props.id) {\n this.context.notifyUpdate();\n }\n }\n\n public componentWillUnmount() {\n const id = this.getId();\n if (typeof id === 'string') {\n this.context.removeTab(id);\n }\n }\n\n public render(): React.JSX.Element {\n this.styles = getStyles(this.emotion);\n this.horizontalStyles = getHorizontalStyles(this.emotion);\n this.verticalStyles = getVerticalStyles(this.emotion);\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public getIndicators(): TabIndicators {\n return {\n error: Boolean(this.props.error),\n warning: Boolean(this.props.warning),\n success: Boolean(this.props.success),\n primary: Boolean(this.props.primary),\n disabled: Boolean(this.props.disabled),\n };\n }\n\n public getUnderlyingNode(): Nullable<React.ReactElement<Tab<T>>> {\n return this.tabComponent;\n }\n\n private renderMain() {\n const {\n children,\n disabled,\n error,\n warning,\n success,\n primary,\n 'aria-describedby': ariaDescribedby,\n 'aria-label': ariaLabel,\n } = this.props;\n const { component: Component, href } = this.getProps();\n\n let isActive = false;\n let isVertical = false;\n\n const id = this.getId();\n if (typeof id === 'string') {\n isActive = this.context.activeTab === this.getId();\n isVertical = this.context.vertical;\n }\n const orientationStyles = isVertical ? this.verticalStyles : this.horizontalStyles;\n\n return (\n <CommonWrapper\n rootNodeRef={this.setRootNode}\n {...getVisualStateDataAttributes({ active: isActive, disabled })}\n {...this.props}\n >\n <Component\n data-tid={TabDataTids.root}\n className={this.cx({\n [this.styles.rootSmall(this.theme)]: this.context.size === 'small',\n [this.styles.rootMedium(this.theme)]: this.context.size === 'medium',\n [this.styles.rootLarge(this.theme)]: this.context.size === 'large',\n [this.styles.verticalSmall(this.theme)]: !!isVertical && this.context.size === 'small',\n [this.styles.verticalMedium(this.theme)]: !!isVertical && this.context.size === 'medium',\n [this.styles.verticalLarge(this.theme)]: !!isVertical && this.context.size === 'large',\n [orientationStyles.primary(this.theme)]: !!primary,\n [orientationStyles.success(this.theme)]: !!success,\n [orientationStyles.warning(this.theme)]: !!warning,\n [orientationStyles.error(this.theme)]: !!error,\n [this.styles.active()]: !!isActive,\n [orientationStyles.active(this.theme)]: !!isActive,\n [this.styles.disabled(this.theme)]: !!disabled,\n [orientationStyles.disabled()]: !!disabled,\n })}\n onBlur={this.handleBlur}\n onClick={this.switchTab}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n tabIndex={disabled ? -1 : 0}\n ref={isFunctionalComponent(Component) ? null : this.refTabComponent}\n href={href}\n aria-describedby={ariaDescribedby}\n aria-label={ariaLabel}\n >\n <ResizeDetector onResize={this.context.notifyUpdate}>{children}</ResizeDetector>\n {this.state.focusedByKeyboard && (\n <div\n className={this.cx(globalClasses.focus, {\n [this.styles.focusSmall(this.theme)]: this.context.size === 'small',\n [this.styles.focusMedium(this.theme)]: this.context.size === 'medium',\n [this.styles.focusLarge(this.theme)]: this.context.size === 'large',\n })}\n />\n )}\n </Component>\n </CommonWrapper>\n );\n }\n\n private getId = () => this.props.id \|\| this.getProps().href;\n\n private refTabComponent = (instance: React.ReactElement<any>) => {\n this.tabComponent = instance;\n };\n\n private getTabInstance = () => this;\n\n private switchTab = (event: React.MouseEvent<HTMLElement>) => {\n if (this.props.disabled) {\n event.preventDefault();\n return;\n }\n const { href, component } = this.getProps();\n\n const id = this.props.id \|\| href;\n if (this.props.onClick) {\n this.props.onClick(event);\n if (event.defaultPrevented) {\n return;\n }\n }\n if (typeof id === 'string') {\n this.context.switchTab(id);\n }\n if (component === 'a' && !href) {\n event.preventDefault();\n }\n };\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n if (this.props.disabled) {\n return;\n }\n\n if (this.props.onKeyDown) {\n this.props.onKeyDown(e);\n if (e.defaultPrevented) {\n return;\n }\n }\n const id = this.getId();\n if (typeof id !== 'string') {\n return;\n }\n if (!isKeyArrow(e)) {\n return;\n }\n e.preventDefault();\n const delta = isKeyArrowLeft(e) \|\| isKeyArrowUp(e) ? -1 : 1;\n this.context.shiftFocus(id, delta);\n };\n\n private handleFocus = () => {\n if (this.props.disabled) {\n return;\n }\n\n // focus event fires before keyDown eventlistener\n // so we should check focusKeyPressed in async way\n this.globalObject.requestAnimationFrame?.(() => {\n if (this.keyListener.isTabPressed \|\| this.keyListener.isArrowPressed) {\n this.setState({ focusedByKeyboard: true });\n }\n });\n };\n\n private handleBlur = () => {\n if (this.props.disabled) {\n return;\n }\n\n this.setState({ focusedByKeyboard: false });\n };\n}\n"]}
1	+ {"version":3,"file":"Tab.js","sourceRoot":"","sources":["Tab.tsx"],"names":[],"mappings":"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","sourcesContent":["import invariant from 'invariant';\nimport type { AriaAttributes } from 'react';\nimport React from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { getVisualStateDataAttributes } from '../../internal/CommonWrapper/utils/getVisualStateDataAttributes.js';\nimport { ResizeDetector } from '../../internal/ResizeDetector/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { cx } from '../../lib/cx.js';\nimport { isKeyArrow, isKeyArrowLeft, isKeyArrowUp } from '../../lib/events/keyboard/identifiers.js';\nimport { KeyListener } from '../../lib/events/keyListener.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { isFunctionalComponent } from '../../lib/utils.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport { horizontalStyles, styles, verticalStyles, globalClasses } from './Tab.css.js';\nimport { TabsContext, TabsContextDefaultValue } from './TabsContext.js';\nimport type { TabsContextType } from './TabsContext.js';\n\nexport interface TabIndicators {\n error: boolean;\n warning: boolean;\n success: boolean;\n primary: boolean;\n disabled: boolean;\n}\n\nexport const TabDataTids = {\n root: 'Tab__root',\n} as const;\n\nexport interface TabProps<T extends string = string>\n extends Pick<AriaAttributes, 'aria-label' \| 'aria-describedby'>, CommonProps {\n /** Компонент или тег для рендера корневого элемента. /\n component?: React.ComponentType<any> \| string;\n\n /* HTML-атрибут `href`. /\n href?: string;\n\n /* Уникальный идентификатор таба. По нему компонент `<Tabs />` определяет выбранный таб. /\n id?: T;\n\n /`HTML`-событие `onclick`. /\n onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n\n /** `HTML`-событие `onkeydown`. /\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n\n /* Делает таб недоступным. /\n disabled?: boolean;\n\n /* Переводит таб в состояние ошибки. /\n error?: boolean;\n\n /* Переводит таб в состояние предупреждения. /\n warning?: boolean;\n\n /* Переводит таб в состояние успеха. /\n success?: boolean;\n\n /* Визульное состояние главного элемента. /\n primary?: boolean;\n}\n\nexport interface TabState {\n focusedByKeyboard: boolean;\n}\n\ntype DefaultProps = Required<Pick<TabProps, 'component' \| 'href'>>;\n\n/\n Табы группируют контент и помогают в навигации.\n \n /\n@withRenderEnvironment\n@rootNode\nexport class Tab<T extends string = string> extends React.Component<TabProps<T>, TabState> {\n public static __KONTUR_REACT_UI__ = 'Tab';\n public static displayName = 'Tab';\n\n public static contextType = TabsContext;\n public context: TabsContextType = this.context;\n\n public static defaultProps: DefaultProps = {\n component: 'a',\n href: '',\n };\n\n private getProps = createPropsGetter(Tab.defaultProps);\n\n public state: TabState = {\n focusedByKeyboard: false,\n };\n\n private globalObject!: GlobalObject;\n private tabComponent: Nullable<React.ReactElement<Tab<T>>> = null;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n private keyListener!: KeyListener;\n\n constructor(props: TabProps<T>) {\n super(props);\n invariant(this.context !== TabsContextDefaultValue, 'Tab should be placed inside Tabs component');\n }\n\n public componentDidMount() {\n this.keyListener = new KeyListener(this.globalObject);\n const id = this.getId();\n if (typeof id === 'string') {\n this.context.addTab(id, this.getTabInstance);\n }\n }\n\n public componentDidUpdate() {\n if (this.context.activeTab === this.props.id) {\n this.context.notifyUpdate();\n }\n }\n\n public componentWillUnmount() {\n const id = this.getId();\n if (typeof id === 'string') {\n this.context.removeTab(id);\n }\n }\n\n public getIndicators(): TabIndicators {\n return {\n error: Boolean(this.props.error),\n warning: Boolean(this.props.warning),\n success: Boolean(this.props.success),\n primary: Boolean(this.props.primary),\n disabled: Boolean(this.props.disabled),\n };\n }\n\n public getUnderlyingNode(): Nullable<React.ReactElement<Tab<T>>> {\n return this.tabComponent;\n }\n\n public render(): React.JSX.Element {\n const {\n children,\n disabled,\n error,\n warning,\n success,\n primary,\n 'aria-describedby': ariaDescribedby,\n 'aria-label': ariaLabel,\n } = this.props;\n const { component: Component, href } = this.getProps();\n\n let isActive = false;\n let isVertical = false;\n\n const id = this.getId();\n if (typeof id === 'string') {\n isActive = this.context.activeTab === this.getId();\n isVertical = this.context.vertical;\n }\n const orientationStyles = isVertical ? verticalStyles : horizontalStyles;\n\n return (\n <CommonWrapper\n rootNodeRef={this.setRootNode}\n {...getVisualStateDataAttributes({ active: isActive, disabled })}\n {...this.props}\n >\n <Component\n data-tid={TabDataTids.root}\n className={cx({\n [styles.rootSmall]: this.context.size === 'small',\n [styles.rootMedium]: this.context.size === 'medium',\n [styles.rootLarge]: this.context.size === 'large',\n [styles.verticalSmall]: !!isVertical && this.context.size === 'small',\n [styles.verticalMedium]: !!isVertical && this.context.size === 'medium',\n [styles.verticalLarge]: !!isVertical && this.context.size === 'large',\n [orientationStyles.primary]: !!primary,\n [orientationStyles.success]: !!success,\n [orientationStyles.warning]: !!warning,\n [orientationStyles.error]: !!error,\n [styles.active]: !!isActive,\n [orientationStyles.active]: !!isActive,\n [styles.disabled]: !!disabled,\n [orientationStyles.disabled]: !!disabled,\n })}\n onBlur={this.handleBlur}\n onClick={this.switchTab}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n tabIndex={disabled ? -1 : 0}\n ref={isFunctionalComponent(Component) ? null : this.refTabComponent}\n href={href}\n aria-describedby={ariaDescribedby}\n aria-label={ariaLabel}\n >\n <ResizeDetector onResize={this.context.notifyUpdate}>{children}</ResizeDetector>\n {this.state.focusedByKeyboard && (\n <div\n className={cx(globalClasses.focus, {\n [styles.focusSmall]: this.context.size === 'small',\n [styles.focusMedium]: this.context.size === 'medium',\n [styles.focusLarge]: this.context.size === 'large',\n })}\n />\n )}\n </Component>\n </CommonWrapper>\n );\n }\n\n private getId = () => this.props.id \|\| this.getProps().href;\n\n private refTabComponent = (instance: React.ReactElement<any>) => {\n this.tabComponent = instance;\n };\n\n private getTabInstance = () => this;\n\n private switchTab = (event: React.MouseEvent<HTMLElement>) => {\n if (this.props.disabled) {\n event.preventDefault();\n return;\n }\n const { href, component } = this.getProps();\n\n const id = this.props.id \|\| href;\n if (this.props.onClick) {\n this.props.onClick(event);\n if (event.defaultPrevented) {\n return;\n }\n }\n if (typeof id === 'string') {\n this.context.switchTab(id);\n }\n if (component === 'a' && !href) {\n event.preventDefault();\n }\n };\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n if (this.props.disabled) {\n return;\n }\n\n if (this.props.onKeyDown) {\n this.props.onKeyDown(e);\n if (e.defaultPrevented) {\n return;\n }\n }\n const id = this.getId();\n if (typeof id !== 'string') {\n return;\n }\n if (!isKeyArrow(e)) {\n return;\n }\n e.preventDefault();\n const delta = isKeyArrowLeft(e) \|\| isKeyArrowUp(e) ? -1 : 1;\n this.context.shiftFocus(id, delta);\n };\n\n private handleFocus = () => {\n if (this.props.disabled) {\n return;\n }\n\n // focus event fires before keyDown eventlistener\n // so we should check focusKeyPressed in async way\n this.globalObject.requestAnimationFrame?.(() => {\n if (this.keyListener.isTabPressed \|\| this.keyListener.isArrowPressed) {\n this.setState({ focusedByKeyboard: true });\n }\n });\n };\n\n private handleBlur = () => {\n if (this.props.disabled) {\n return;\n }\n\n this.setState({ focusedByKeyboard: false });\n };\n}\n"]}

package/components/Tabs/Tabs.css.d.ts ADDED Viewed

@@ -0,0 +1,10 @@
+export declare const rootSmall: string;
+export declare const rootMedium: string;
+export declare const rootLarge: string;
+export declare const vertical: string;
+export declare const styles: {
+    rootSmall: string;
+    rootMedium: string;
+    rootLarge: string;
+    vertical: string;
+};

package/components/Tabs/Tabs.css.js ADDED Viewed

@@ -0,0 +1,6 @@
+export var rootLarge = 'react-ui-Tabs__rootLarge';
+export var rootMedium = 'react-ui-Tabs__rootMedium';
+export var rootSmall = 'react-ui-Tabs__rootSmall';
+export var styles = {rootSmall:'react-ui-Tabs__rootSmall',rootMedium:'react-ui-Tabs__rootMedium',rootLarge:'react-ui-Tabs__rootLarge',vertical:'react-ui-Tabs__vertical'};
+export var vertical = 'react-ui-Tabs__vertical';

package/components/Tabs/Tabs.css.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Tabs.css.js","sourceRoot":"","sources":["Tabs.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAE7C,OAAO,EAAE,CAAC,EAAE,MAAM,8BAA8B,CAAC;AAEjD,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,IAAM,QAAQ,GAAG,UAAC,IAAc;IAC9B,OAAA,CAAC;QACC,OAAO,EAAE,cAAc;QACvB,MAAM,EAAE,sBAAe,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,MAAG;QAC3C,OAAO,EAAE,CAAC;QACV,QAAQ,EAAE,UAAU;KACrB,CAAU;AALX,CAKW,CAAC;AAEd,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;AAElD,MAAM,CAAC,IAAM,UAAU,GAAG,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC;AAEpD,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;AAElD,MAAM,CAAC,IAAM,QAAQ,GAAG,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC;AAE7C,MAAM,CAAC,IAAM,MAAM,GAAG,EAAE,SAAS,WAAA,EAAE,UAAU,YAAA,EAAE,SAAS,WAAA,EAAE,QAAQ,UAAA,EAAE,CAAC","sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { t } from '../../lib/theming/vanilla.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport { paddingX } from './helpers.js';\n\nconst tabsRoot = (size: SizeProp) =>\n ({\n display: 'inline-block',\n margin: `0 calc(-1 * ${paddingX(t, size)})`,\n padding: 0,\n position: 'relative',\n }) as const;\n\nexport const rootSmall = style(tabsRoot('small'));\n\nexport const rootMedium = style(tabsRoot('medium'));\n\nexport const rootLarge = style(tabsRoot('large'));\n\nexport const vertical = style({ margin: 0 });\n\nexport const styles = { rootSmall, rootMedium, rootLarge, vertical };\n"]}

package/components/Tabs/Tabs.d.ts CHANGED Viewed

@@ -37,10 +37,6 @@ export declare class Tabs<T extends string = string> extends React.Component<Tab
     private getProps;
     static Tab: typeof Tab;
     private globalObject;
-    private emotion;
-    private cx;
-    private styles;
-    private theme;
     private tabs;
     private tabUpdates;
     private listeners;

package/components/Tabs/Tabs.js CHANGED Viewed

@@ -33,14 +33,14 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import React from 'react';
 import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
 import { createPropsGetter } from '../../lib/createPropsGetter.js';
+import { cx } from '../../lib/cx.js';
 import { isInstanceOf } from '../../lib/isInstanceOf.js';
 import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
 import { getRootNode } from '../../lib/rootNode/getRootNode.js';
 import { rootNode } from '../../lib/rootNode/index.js';
-import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { Indicator } from './Indicator.js';
 import { Tab } from './Tab.js';
-import { getStyles } from './Tabs.styles.js';
+import { styles } from './Tabs.css.js';
 import { TabsContext } from './TabsContext.js';
 export var TabsDataTids = {
     root: 'Tabs__root',
@@ -98,34 +98,29 @@ var Tabs = /** @class */ (function (_super) {
     }
     Tabs_1 = Tabs;
     Tabs.prototype.render = function () {
-        var _this = this;
-        var _a = this.props, value = _a.value, width = _a.width, children = _a.children, indicatorClassName = _a.indicatorClassName, ariaDescribedby = _a["aria-describedby"];
-        var _b = this.getProps(), vertical = _b.vertical, size = _b.size;
-        this.styles = getStyles(this.emotion);
-        return (React.createElement(ThemeContext.Consumer, null, function (theme) {
-            var _a;
-            _this.theme = theme;
-            return (React.createElement(CommonWrapper, __assign({ rootNodeRef: _this.setRootNode }, _this.props),
-                React.createElement("div", { "data-tid": TabsDataTids.root, className: _this.cx((_a = {},
-                        _a[_this.styles.rootSmall(_this.theme)] = size === 'small',
-                        _a[_this.styles.rootMedium(_this.theme)] = size === 'medium',
-                        _a[_this.styles.rootLarge(_this.theme)] = size === 'large',
-                        _a[_this.styles.vertical()] = vertical,
-                        _a)), style: { width: width }, "aria-describedby": ariaDescribedby },
-                    React.createElement(TabsContext.Provider, { value: {
-                            vertical: vertical,
-                            activeTab: value,
-                            size: size,
-                            getTab: _this.getTab,
-                            addTab: _this.addTab,
-                            removeTab: _this.removeTab,
-                            notifyUpdate: _this.notifyUpdate,
-                            shiftFocus: _this.shiftFocus,
-                            switchTab: _this.switchTab,
-                        } },
-                        children,
-                        React.createElement(Indicator, { className: indicatorClassName, tabUpdates: _this.tabUpdates, vertical: _this.getProps().vertical })))));
-        }));
+        var _a;
+        var _b = this.props, value = _b.value, width = _b.width, children = _b.children, indicatorClassName = _b.indicatorClassName, ariaDescribedby = _b["aria-describedby"];
+        var _c = this.getProps(), vertical = _c.vertical, size = _c.size;
+        return (React.createElement(CommonWrapper, __assign({ rootNodeRef: this.setRootNode }, this.props),
+            React.createElement("div", { "data-tid": TabsDataTids.root, className: cx((_a = {},
+                    _a[styles.rootSmall] = size === 'small',
+                    _a[styles.rootMedium] = size === 'medium',
+                    _a[styles.rootLarge] = size === 'large',
+                    _a[styles.vertical] = vertical,
+                    _a)), style: { width: width }, "aria-describedby": ariaDescribedby },
+                React.createElement(TabsContext.Provider, { value: {
+                        vertical: vertical,
+                        activeTab: value,
+                        size: size,
+                        getTab: this.getTab,
+                        addTab: this.addTab,
+                        removeTab: this.removeTab,
+                        notifyUpdate: this.notifyUpdate,
+                        shiftFocus: this.shiftFocus,
+                        switchTab: this.switchTab,
+                    } },
+                    children,
+                    React.createElement(Indicator, { className: indicatorClassName, tabUpdates: this.tabUpdates, vertical: this.getProps().vertical })))));
     };
     var Tabs_1;
     Tabs.__KONTUR_REACT_UI__ = 'Tabs';

package/components/Tabs/Tabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tabs.js","sourceRoot":"","sources":["Tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport type { AriaAttributes, JSX } from 'react';\nimport React from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { isInstanceOf } from '../../lib/isInstanceOf.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport { getRootNode } from '../../lib/rootNode/getRootNode.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport type { emptyHandler } from '../../lib/utils.js';\nimport { Indicator } from './Indicator.js';\nimport { Tab } from './Tab.js';\nimport { getStyles } from './Tabs.styles.js';\nimport { TabsContext } from './TabsContext.js';\nimport type { TabsContextType } from './TabsContext.js';\n\ntype ValueBaseType = string;\ninterface TabType<T extends ValueBaseType> {\n getNode: () => Tab<T> \| null;\n id: T;\n}\n\nexport interface TabsProps<T extends ValueBaseType = string> extends CommonProps {\n /** Кастомный класс для индикатора (подчёркивания) активного таба. /\n indicatorClassName?: string;\n\n /* Размер табов. /\n size?: SizeProp;\n\n /* Идентификатор активного таба. Совпадает с `id` выбранного `<Tab />`. /\n value: T;\n\n /* Событие смены активного таба. /\n onValueChange?: (value: T) => void;\n\n /* Располагает табы вертикально.\n * @default false /\n vertical?: boolean;\n\n /* Ширина компонента. /\n width?: number \| string;\n\n /* @ignore /\n 'aria-describedby'?: AriaAttributes['aria-describedby'];\n}\n\nexport const TabsDataTids = {\n root: 'Tabs__root',\n indicatorRoot: 'Indicator__root',\n} as const;\n\ntype DefaultProps = Required<Pick<TabsProps, 'vertical' \| 'size'>>;\n\n/\n Табы группируют контент и помогают в навигации.\n */\n@withRenderEnvironment\n@rootNode\nexport class Tabs<T extends string = string> extends React.Component<TabsProps<T>> {\n public static __KONTUR_REACT_UI__ = 'Tabs';\n public static displayName = 'Tabs';\n\n public static defaultProps: DefaultProps = {\n vertical: false,\n size: 'large',\n };\n\n private getProps = createPropsGetter(Tabs.defaultProps);\n\n public static Tab = Tab;\n\n private globalObject!: GlobalObject;\n private emotion!: Emotion;\n private cx!: Emotion['cx'];\n private styles!: ReturnType<typeof getStyles>;\n private theme!: Theme;\n\n private tabs: Array<TabType<T>> = [];\n\n private tabUpdates = {\n on: (cb: () => void) => {\n const index = this.listeners.push(cb);\n return () => {\n this.listeners.splice(index, 1);\n };\n },\n };\n\n private listeners: Array<typeof emptyHandler> = [];\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n public render(): JSX.Element {\n const { value, width, children, indicatorClassName, 'aria-describedby': ariaDescribedby } = this.props;\n const { vertical, size } = this.getProps();\n this.styles = getStyles(this.emotion);\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={TabsDataTids.root}\n className={this.cx({\n [this.styles.rootSmall(this.theme)]: size === 'small',\n [this.styles.rootMedium(this.theme)]: size === 'medium',\n [this.styles.rootLarge(this.theme)]: size === 'large',\n [this.styles.vertical()]: vertical,\n })}\n style={{ width }}\n aria-describedby={ariaDescribedby}\n >\n <TabsContext.Provider\n value={{\n vertical,\n activeTab: value,\n size,\n getTab: this.getTab,\n addTab: this.addTab,\n removeTab: this.removeTab,\n notifyUpdate: this.notifyUpdate,\n shiftFocus: this.shiftFocus,\n switchTab: this.switchTab,\n }}\n >\n {children}\n <Indicator\n className={indicatorClassName}\n tabUpdates={this.tabUpdates}\n vertical={this.getProps().vertical}\n />\n </TabsContext.Provider>\n </div>\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private shiftFocus: TabsContextType<T>['shiftFocus'] = (fromTab, delta) => {\n const { tabs } = this;\n const index = tabs.findIndex((x) => x.id === fromTab);\n const newIndex = Math.max(0, Math.min(index + delta, tabs.length - 1));\n const tab = tabs[newIndex];\n\n const tabNode = tab.getNode();\n const htmlNode = getRootNode(tabNode);\n\n if (isInstanceOf(htmlNode, this.globalObject.HTMLElement) && typeof htmlNode.focus === 'function') {\n htmlNode.focus();\n }\n };\n\n private notifyUpdate: TabsContextType<T>['notifyUpdate'] = () => {\n this.listeners.forEach((cb) => cb());\n };\n\n private switchTab: TabsContextType<T>['switchTab'] = (id) => {\n const { onValueChange, value } = this.props;\n if (id !== value && onValueChange) {\n onValueChange(id);\n }\n };\n\n private getTab: TabsContextType<T>['getTab'] = (id) => {\n const { getNode = null } = this.tabs.find((x) => x.id === id) \|\| {};\n return getNode && getNode();\n };\n\n private addTab: TabsContextType<T>['addTab'] = (id, getNode) => {\n this.tabs = this.tabs.concat({ id, getNode });\n };\n\n private removeTab: TabsContextType<T>['removeTab'] = (id) => {\n this.tabs = this.tabs.filter((tab) => tab.id !== id);\n };\n}\n"]}
1	+ {"version":3,"file":"Tabs.js","sourceRoot":"","sources":["Tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { AriaAttributes, JSX } from 'react';\nimport React from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { cx } from '../../lib/cx.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { isInstanceOf } from '../../lib/isInstanceOf.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport { getRootNode } from '../../lib/rootNode/getRootNode.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport type { emptyHandler } from '../../lib/utils.js';\nimport { Indicator } from './Indicator.js';\nimport { Tab } from './Tab.js';\nimport { styles } from './Tabs.css.js';\nimport { TabsContext } from './TabsContext.js';\nimport type { TabsContextType } from './TabsContext.js';\n\ntype ValueBaseType = string;\ninterface TabType<T extends ValueBaseType> {\n getNode: () => Tab<T> \| null;\n id: T;\n}\n\nexport interface TabsProps<T extends ValueBaseType = string> extends CommonProps {\n /** Кастомный класс для индикатора (подчёркивания) активного таба. /\n indicatorClassName?: string;\n\n /* Размер табов. /\n size?: SizeProp;\n\n /* Идентификатор активного таба. Совпадает с `id` выбранного `<Tab />`. /\n value: T;\n\n /* Событие смены активного таба. /\n onValueChange?: (value: T) => void;\n\n /* Располагает табы вертикально.\n * @default false /\n vertical?: boolean;\n\n /* Ширина компонента. /\n width?: number \| string;\n\n /* @ignore /\n 'aria-describedby'?: AriaAttributes['aria-describedby'];\n}\n\nexport const TabsDataTids = {\n root: 'Tabs__root',\n indicatorRoot: 'Indicator__root',\n} as const;\n\ntype DefaultProps = Required<Pick<TabsProps, 'vertical' \| 'size'>>;\n\n/\n Табы группируют контент и помогают в навигации.\n */\n@withRenderEnvironment\n@rootNode\nexport class Tabs<T extends string = string> extends React.Component<TabsProps<T>> {\n public static __KONTUR_REACT_UI__ = 'Tabs';\n public static displayName = 'Tabs';\n\n public static defaultProps: DefaultProps = {\n vertical: false,\n size: 'large',\n };\n\n private getProps = createPropsGetter(Tabs.defaultProps);\n\n public static Tab = Tab;\n\n private globalObject!: GlobalObject;\n\n private tabs: Array<TabType<T>> = [];\n\n private tabUpdates = {\n on: (cb: () => void) => {\n const index = this.listeners.push(cb);\n return () => {\n this.listeners.splice(index, 1);\n };\n },\n };\n\n private listeners: Array<typeof emptyHandler> = [];\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n public render(): JSX.Element {\n const { value, width, children, indicatorClassName, 'aria-describedby': ariaDescribedby } = this.props;\n const { vertical, size } = this.getProps();\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={TabsDataTids.root}\n className={cx({\n [styles.rootSmall]: size === 'small',\n [styles.rootMedium]: size === 'medium',\n [styles.rootLarge]: size === 'large',\n [styles.vertical]: vertical,\n })}\n style={{ width }}\n aria-describedby={ariaDescribedby}\n >\n <TabsContext.Provider\n value={{\n vertical,\n activeTab: value,\n size,\n getTab: this.getTab,\n addTab: this.addTab,\n removeTab: this.removeTab,\n notifyUpdate: this.notifyUpdate,\n shiftFocus: this.shiftFocus,\n switchTab: this.switchTab,\n }}\n >\n {children}\n <Indicator\n className={indicatorClassName}\n tabUpdates={this.tabUpdates}\n vertical={this.getProps().vertical}\n />\n </TabsContext.Provider>\n </div>\n </CommonWrapper>\n );\n }\n\n private shiftFocus: TabsContextType<T>['shiftFocus'] = (fromTab, delta) => {\n const { tabs } = this;\n const index = tabs.findIndex((x) => x.id === fromTab);\n const newIndex = Math.max(0, Math.min(index + delta, tabs.length - 1));\n const tab = tabs[newIndex];\n\n const tabNode = tab.getNode();\n const htmlNode = getRootNode(tabNode);\n\n if (isInstanceOf(htmlNode, this.globalObject.HTMLElement) && typeof htmlNode.focus === 'function') {\n htmlNode.focus();\n }\n };\n\n private notifyUpdate: TabsContextType<T>['notifyUpdate'] = () => {\n this.listeners.forEach((cb) => cb());\n };\n\n private switchTab: TabsContextType<T>['switchTab'] = (id) => {\n const { onValueChange, value } = this.props;\n if (id !== value && onValueChange) {\n onValueChange(id);\n }\n };\n\n private getTab: TabsContextType<T>['getTab'] = (id) => {\n const { getNode = null } = this.tabs.find((x) => x.id === id) \|\| {};\n return getNode && getNode();\n };\n\n private addTab: TabsContextType<T>['addTab'] = (id, getNode) => {\n this.tabs = this.tabs.concat({ id, getNode });\n };\n\n private removeTab: TabsContextType<T>['removeTab'] = (id) => {\n this.tabs = this.tabs.filter((tab) => tab.id !== id);\n };\n}\n"]}

package/components/Textarea/Textarea.css.d.ts ADDED Viewed

@@ -0,0 +1,42 @@
+export declare const root: string;
+export declare const textarea: string;
+export declare const fake: string;
+export declare const placeholder: string;
+export declare const counterContainer: string;
+export declare const counter: string;
+export declare const counter6_1: string;
+export declare const counterError: string;
+export declare const counterHelp: string;
+export declare const disableAnimations: string;
+export declare const rootSmall: string;
+export declare const rootMedium: string;
+export declare const rootLarge: string;
+export declare const textareaSmall: string;
+export declare const textareaMedium: string;
+export declare const textareaLarge: string;
+export declare const hovering: string;
+export declare const disabled: string;
+export declare const error: string;
+export declare const warning: string;
+export declare const styles: {
+    root: string;
+    rootSmall: string;
+    rootMedium: string;
+    rootLarge: string;
+    textarea: string;
+    textareaSmall: string;
+    textareaMedium: string;
+    textareaLarge: string;
+    hovering: string;
+    error: string;
+    warning: string;
+    disabled: string;
+    fake: string;
+    placeholder: string;
+    counterContainer: string;
+    counter: string;
+    counter6_1: string;
+    counterError: string;
+    counterHelp: string;
+    disableAnimations: string;
+};

package/components/Textarea/Textarea.css.js ADDED Viewed

@@ -0,0 +1,22 @@
+export var counter = 'react-ui-Textarea__counter';
+export var counter6_1 = 'react-ui-Textarea__counter6_1';
+export var counterContainer = 'react-ui-Textarea__counterContainer';
+export var counterError = 'react-ui-Textarea__counterError';
+export var counterHelp = 'react-ui-Textarea__counterHelp';
+export var disableAnimations = 'react-ui-Textarea__disableAnimations';
+export var disabled = 'react-ui-Textarea__disabled';
+export var error = 'react-ui-Textarea__error';
+export var fake = 'react-ui-Textarea__fake';
+export var hovering = 'react-ui-Textarea__hovering';
+export var placeholder = 'react-ui-Textarea__placeholder';
+export var root = 'react-ui-Textarea__root';
+export var rootLarge = 'react-ui-Textarea__rootLarge';
+export var rootMedium = 'react-ui-Textarea__rootMedium';
+export var rootSmall = 'react-ui-Textarea__rootSmall';
+export var styles = {root:'react-ui-Textarea__root',rootSmall:'react-ui-Textarea__rootSmall',rootMedium:'react-ui-Textarea__rootMedium',rootLarge:'react-ui-Textarea__rootLarge',textarea:'react-ui-Textarea__textarea',textareaSmall:'react-ui-Textarea__textareaSmall',textareaMedium:'react-ui-Textarea__textareaMedium',textareaLarge:'react-ui-Textarea__textareaLarge',hovering:'react-ui-Textarea__hovering',error:'react-ui-Textarea__error',warning:'react-ui-Textarea__warning',disabled:'react-ui-Textarea__disabled',fake:'react-ui-Textarea__fake',placeholder:'react-ui-Textarea__placeholder',counterContainer:'react-ui-Textarea__counterContainer',counter:'react-ui-Textarea__counter',counter6_1:'react-ui-Textarea__counter6_1',counterError:'react-ui-Textarea__counterError',counterHelp:'react-ui-Textarea__counterHelp',disableAnimations:'react-ui-Textarea__disableAnimations'};
+export var textarea = 'react-ui-Textarea__textarea';
+export var textareaLarge = 'react-ui-Textarea__textareaLarge';
+export var textareaMedium = 'react-ui-Textarea__textareaMedium';
+export var textareaSmall = 'react-ui-Textarea__textareaSmall';
+export var warning = 'react-ui-Textarea__warning';

package/components/Textarea/Textarea.css.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Textarea.css.js","sourceRoot":"","sources":["Textarea.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAE1D,OAAO,EAAE,CAAC,EAAE,MAAM,8BAA8B,CAAC;AACjD,OAAO,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEhF,MAAM,CAAC,IAAM,IAAI,GAAG,KAAK,CAAC;IACxB,OAAO,EAAE,cAAc;IACvB,QAAQ,EAAE,UAAU;CACrB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,QAAQ,GAAG,KAAK,CAAC;IAC5B,MAAM,EAAE,CAAC,CAAC,cAAc;IACxB,gBAAgB,EAAE,MAAM;IACxB,UAAU,EAAE,CAAC,CAAC,UAAU;IACxB,cAAc,EAAE,CAAC,CAAC,sBAAsB;IACxC,MAAM,EAAE,UAAG,CAAC,CAAC,mBAAmB,oBAAU,CAAC,CAAC,mBAAmB,CAAE;IACjE,SAAS,EAAE,CAAC,CAAC,cAAc;IAC3B,SAAS,EAAE,YAAY;IACvB,KAAK,EAAE,CAAC,CAAC,aAAa;IACtB,UAAU,EAAE,SAAS;IACrB,QAAQ,EAAE,SAAS;IACnB,UAAU,EAAE,SAAS;IACrB,QAAQ,EAAE,MAAM;IAChB,KAAK,EAAE,MAAM;IACb,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,uBAAgB,CAAC,CAAC,kBAAkB,cAAI,CAAC,CAAC,wBAAwB,0BAAuB;IACrG,aAAa,EAAE,CAAC,CAAC,qBAAqB;IACtC,YAAY,EAAE,CAAC,CAAC,oBAAoB;IACpC,UAAU,EAAE,UAAU;CACvB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,IAAI,GAAG,KAAK,CAAC;IACxB,MAAM,EAAE,CAAC;IACT,IAAI,EAAE,CAAC;IACP,QAAQ,EAAE,UAAU;IACpB,GAAG,EAAE,CAAC;IACN,UAAU,EAAE,QAAQ;IACpB,KAAK,EAAE,MAAM;CACd,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,WAAW,GAAG,KAAK,CAAC;IAC/B,YAAY,EAAE,MAAM;IACpB,KAAK,EAAE,MAAM;IACb,IAAI,EAAE,MAAM;IACZ,QAAQ,EAAE,QAAQ;IAClB,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,MAAM;IACb,GAAG,EAAE,KAAK;IACV,UAAU,EAAE,MAAM;IAClB,MAAM,EAAE,CAAC;CACV,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,gBAAgB,GAAG,KAAK,CAAC;IACpC,QAAQ,EAAE,UAAU;IACpB,GAAG,EAAE,CAAC;IACN,MAAM,EAAE,UAAG,CAAC,CAAC,mBAAmB,uBAAoB;IACpD,SAAS,EAAE,aAAa;CACzB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,OAAO,GAAG,KAAK,CAAC;IAC3B,QAAQ,EAAE,UAAU;IACpB,MAAM,EAAE,CAAC;IACT,SAAS,EAAE,OAAO;IAClB,UAAU,EAAE,CAAC,CAAC,iBAAiB;IAC/B,KAAK,EAAE,CAAC,CAAC,oBAAoB;IAC7B,YAAY,EAAE,KAAK;CACpB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,UAAU,GAAG,KAAK,CAAC;IAC9B,YAAY,EAAE,CAAC,CAAC,2BAA2B;IAC3C,OAAO,EAAE,UAAG,CAAC,CAAC,uBAAuB,cAAI,CAAC,CAAC,uBAAuB,CAAE;CACrE,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,YAAY,GAAG,KAAK,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,yBAAyB,EAAE,CAAC,CAAC;AAE1E,MAAM,CAAC,IAAM,WAAW,GAAG,KAAK,CAAC;IAC/B,UAAU,EAAE,KAAK;IACjB,MAAM,EAAE,SAAS;CAClB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,iBAAiB,GAAG,KAAK,CAAC,EAAE,UAAU,EAAE,MAAM,EAAE,CAAC,CAAC;AAE/D,+EAA+E;AAC/E,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,qBAAqB,EAAE,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC;AAE1G,MAAM,CAAC,IAAM,UAAU,GAAG,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,sBAAsB,EAAE,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC;AAE7G,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,qBAAqB,EAAE,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC;AAE1G,MAAM,CAAC,IAAM,aAAa,GAAG,KAAK,CAChC,iBAAiB,CAAC,CAAC,CAAC,qBAAqB,EAAE,CAAC,CAAC,qBAAqB,EAAE,CAAC,CAAC,sBAAsB,CAAC,CAC9F,CAAC;AAEF,MAAM,CAAC,IAAM,cAAc,GAAG,KAAK,CACjC,iBAAiB,CAAC,CAAC,CAAC,sBAAsB,EAAE,CAAC,CAAC,sBAAsB,EAAE,CAAC,CAAC,uBAAuB,CAAC,CACjG,CAAC;AAEF,MAAM,CAAC,IAAM,aAAa,GAAG,KAAK,CAChC,iBAAiB,CAAC,CAAC,CAAC,qBAAqB,EAAE,CAAC,CAAC,qBAAqB,EAAE,CAAC,CAAC,sBAAsB,CAAC,CAC9F,CAAC;AAEF,MAAM,CAAC,IAAM,QAAQ,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC;AAElC,MAAM,CAAC,IAAM,QAAQ,GAAG,KAAK,CAAC;IAC5B,KAAK,EAAE,CAAC,CAAC,yBAAyB;IAClC,UAAU,EAAE,CAAC,CAAC,kBAAkB;IAChC,WAAW,EAAE,CAAC,CAAC,2BAA2B;IAC1C,SAAS,EAAE,MAAM;CAClB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,KAAK,GAAG,KAAK,CAAC;IACzB,WAAW,EAAE,CAAC,CAAC,wBAAwB;IACvC,SAAS,EAAE,gBAAS,CAAC,CAAC,mBAAmB,cAAI,CAAC,CAAC,wBAAwB,CAAE;CAC1E,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,OAAO,GAAG,KAAK,CAAC;IAC3B,WAAW,EAAE,CAAC,CAAC,0BAA0B;IACzC,SAAS,EAAE,gBAAS,CAAC,CAAC,oBAAoB,cAAI,CAAC,CAAC,0BAA0B,CAAE;CAC7E,CAAC,CAAC;AAEH,qFAAqF;AACrF,WAAW,CAAC,UAAG,QAAQ,WAAQ,EAAE;IAC/B,WAAW,EAAE,CAAC,CAAC,wBAAwB;IACvC,SAAS,EAAE,gBAAS,CAAC,CAAC,oBAAoB,cAAI,CAAC,CAAC,wBAAwB,CAAE;IAC1E,QAAQ,EAAE,UAAU;IACpB,MAAM,EAAE,CAAC;CACV,CAAC,CAAC;AACH,WAAW,CAAC,UAAG,QAAQ,wBAAqB,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,6BAA6B,EAAE,CAAC,CAAC;AAC1F,WAAW,CAAC,UAAG,QAAQ,kBAAe,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,wBAAwB,EAAE,CAAC,CAAC;AAC/E,WAAW,CAAC,UAAG,QAAQ,sBAAmB,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,wBAAwB,EAAE,CAAC,CAAC;AACnF,WAAW,CAAC,UAAG,QAAQ,uBAAoB,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,wBAAwB,EAAE,CAAC,CAAC;AAEpF,WAAW,CAAC,UAAG,QAAQ,+BAA4B,EAAE,EAAE,WAAW,EAAE,CAAC,CAAC,wBAAwB,EAAE,CAAC,CAAC;AAElG,WAAW,CAAC,UAAG,QAAQ,kBAAe,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,gCAAgC,EAAE,CAAC,CAAC;AAEvF,WAAW,CAAC,UAAG,KAAK,WAAQ,EAAE;IAC5B,WAAW,EAAE,CAAC,CAAC,wBAAwB;IACvC,SAAS,EAAE,gBAAS,CAAC,CAAC,oBAAoB,cAAI,CAAC,CAAC,wBAAwB,CAAE;CAC3E,CAAC,CAAC;AAEH,WAAW,CAAC,UAAG,OAAO,WAAQ,EAAE;IAC9B,WAAW,EAAE,CAAC,CAAC,0BAA0B;IACzC,SAAS,EAAE,gBAAS,CAAC,CAAC,oBAAoB,cAAI,CAAC,CAAC,0BAA0B,CAAE;CAC7E,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,MAAM,GAAG;IACpB,IAAI,MAAA;IACJ,SAAS,WAAA;IACT,UAAU,YAAA;IACV,SAAS,WAAA;IACT,QAAQ,UAAA;IACR,aAAa,eAAA;IACb,cAAc,gBAAA;IACd,aAAa,eAAA;IACb,QAAQ,UAAA;IACR,KAAK,OAAA;IACL,OAAO,SAAA;IACP,QAAQ,UAAA;IACR,IAAI,MAAA;IACJ,WAAW,aAAA;IACX,gBAAgB,kBAAA;IAChB,OAAO,SAAA;IACP,UAAU,YAAA;IACV,YAAY,cAAA;IACZ,WAAW,aAAA;IACX,iBAAiB,mBAAA;CAClB,CAAC","sourcesContent":["import { globalStyle, style } from '@vanilla-extract/css';\n\nimport { t } from '../../lib/theming/vanilla.js';\nimport { rootTextareaSizeMixin, textareaSizeMixin } from './Textarea.mixins.js';\n\nexport const root = style({\n display: 'inline-block',\n position: 'relative',\n});\n\nexport const textarea = style({\n margin: t.textareaMargin,\n WebkitAppearance: 'none',\n background: t.textareaBg,\n backgroundClip: t.textareaBackgroundClip,\n border: `${t.textareaBorderWidth} solid ${t.textareaBorderColor}`,\n boxShadow: t.textareaShadow,\n boxSizing: 'border-box',\n color: t.textareaColor,\n fontFamily: 'inherit',\n fontSize: 'inherit',\n lineHeight: 'inherit',\n maxWidth: '100%',\n width: '100%',\n outline: 'none',\n transition: `border-color ${t.transitionDuration} ${t.transitionTimingFunction},height 0.2s ease-out`,\n verticalAlign: t.textareaVerticalAlign,\n borderRadius: t.textareaBorderRadius,\n whiteSpace: 'pre-wrap',\n});\n\nexport const fake = style({\n height: 0,\n left: 0,\n position: 'absolute',\n top: 0,\n visibility: 'hidden',\n width: '100%',\n});\n\nexport const placeholder = style({\n msUserSelect: 'none',\n color: '#aaa',\n left: '12px',\n overflow: 'hidden',\n position: 'absolute',\n right: '12px',\n top: '9px',\n userSelect: 'none',\n zIndex: 3,\n});\n\nexport const counterContainer = style({\n position: 'absolute',\n top: 0,\n border: `${t.textareaBorderWidth} solid transparent`,\n boxSizing: 'content-box',\n});\n\nexport const counter = style({\n position: 'absolute',\n zIndex: 3,\n textAlign: 'right',\n background: t.textareaCounterBg,\n color: t.textareaCounterColor,\n borderRadius: '2px',\n});\n\nexport const counter6_1 = style({\n borderRadius: t.textareaCounterBorderRadius,\n padding: `${t.textareaCounterPaddingY} ${t.textareaCounterPaddingX}`,\n});\n\nexport const counterError = style({ color: t.textareaCounterErrorColor });\n\nexport const counterHelp = style({\n marginLeft: '4px',\n cursor: 'pointer',\n});\n\nexport const disableAnimations = style({ transition: 'none' });\n\n// в cx(...) размеры идут после textarea, состояния — последними в этом порядке\nexport const rootSmall = style(rootTextareaSizeMixin(t.textareaFontSizeSmall, t.textareaLineHeightSmall));\n\nexport const rootMedium = style(rootTextareaSizeMixin(t.textareaFontSizeMedium, t.textareaLineHeightMedium));\n\nexport const rootLarge = style(rootTextareaSizeMixin(t.textareaFontSizeLarge, t.textareaLineHeightLarge));\n\nexport const textareaSmall = style(\n textareaSizeMixin(t.textareaPaddingYSmall, t.textareaPaddingXSmall, t.textareaMinHeightSmall),\n);\n\nexport const textareaMedium = style(\n textareaSizeMixin(t.textareaPaddingYMedium, t.textareaPaddingXMedium, t.textareaMinHeightMedium),\n);\n\nexport const textareaLarge = style(\n textareaSizeMixin(t.textareaPaddingYLarge, t.textareaPaddingXLarge, t.textareaMinHeightLarge),\n);\n\nexport const hovering = style({});\n\nexport const disabled = style({\n color: t.textareaTextColorDisabled,\n background: t.textareaDisabledBg,\n borderColor: t.textareaDisabledBorderColor,\n boxShadow: 'none',\n});\n\nexport const error = style({\n borderColor: t.textareaBorderColorError,\n boxShadow: `0 0 0 ${t.textareaBorderWidth} ${t.textareaBorderColorError}`,\n});\n\nexport const warning = style({\n borderColor: t.textareaBorderColorWarning,\n boxShadow: `0 0 0 ${t.textareaOutlineWidth} ${t.textareaBorderColorWarning}`,\n});\n\n// вложенные правила — после баз всех классов файла, как было в склеенном CSS Emotion\nglobalStyle(`${textarea}:focus`, {\n borderColor: t.textareaBorderColorFocus,\n boxShadow: `0 0 0 ${t.textareaOutlineWidth} ${t.textareaBorderColorFocus}`,\n position: 'relative',\n zIndex: 2,\n});\nglobalStyle(`${textarea}:focus::placeholder`, { color: t.textareaPlaceholderColorLight });\nglobalStyle(`${textarea}::placeholder`, { color: t.textareaPlaceholderColor });\nglobalStyle(`${textarea}:-moz-placeholder`, { color: t.textareaPlaceholderColor });\nglobalStyle(`${textarea}::-moz-placeholder`, { color: t.textareaPlaceholderColor });\n\nglobalStyle(`${hovering}:enabled:hover:not(:focus)`, { borderColor: t.textareaBorderColorHover });\n\nglobalStyle(`${disabled}::placeholder`, { color: t.textareaPlaceholderColorDisabled });\n\nglobalStyle(`${error}:focus`, {\n borderColor: t.textareaBorderColorError,\n boxShadow: `0 0 0 ${t.textareaOutlineWidth} ${t.textareaBorderColorError}`,\n});\n\nglobalStyle(`${warning}:focus`, {\n borderColor: t.textareaBorderColorWarning,\n boxShadow: `0 0 0 ${t.textareaOutlineWidth} ${t.textareaBorderColorWarning}`,\n});\n\nexport const styles = {\n root,\n rootSmall,\n rootMedium,\n rootLarge,\n textarea,\n textareaSmall,\n textareaMedium,\n textareaLarge,\n hovering,\n error,\n warning,\n disabled,\n fake,\n placeholder,\n counterContainer,\n counter,\n counter6_1,\n counterError,\n counterHelp,\n disableAnimations,\n};\n"]}

package/components/Textarea/Textarea.d.ts CHANGED Viewed

@@ -79,13 +79,10 @@ export declare class Textarea extends React.Component<TextareaProps, TextareaSta
     };
     private size;
     private reflowCounter;
-    private styles;
-    private emotion;
-    private cx;
     private globalObject;
-    private theme;
     private selectAllId;
     private node;
+    private theme;
     private fakeNode;
     private counter;
     private layoutEvents;

package/components/Textarea/Textarea.js CHANGED Viewed

@@ -51,6 +51,7 @@ import { blink } from '../../lib/blink.js';
 import { isSafariWithTextareaBug } from '../../lib/client.js';
 import { createPropsGetter } from '../../lib/createPropsGetter.js';
 import { isTestEnv } from '../../lib/currentEnvironment.js';
+import { cx } from '../../lib/cx.js';
 import { isKeyEnter } from '../../lib/events/keyboard/identifiers.js';
 import * as LayoutEvents from '../../lib/LayoutEvents.js';
 import { needsPolyfillPlaceholder } from '../../lib/needsPolyfillPlaceholder.js';
@@ -58,7 +59,7 @@ import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
 import { rootNode } from '../../lib/rootNode/index.js';
 import { withSize } from '../../lib/size/SizeDecorator.js';
 import { ThemeContext } from '../../lib/theming/ThemeContext.js';
-import { getStyles } from './Textarea.styles.js';
+import { styles } from './Textarea.css.js';
 import { TextareaCounter } from './TextareaCounter.js';
 import { getTextAreaHeight } from './TextareaHelpers.js';
 import { TextareaWithSafari17Workaround } from './TextareaWithSafari17Workaround.js';
@@ -136,13 +137,13 @@ var Textarea = /** @class */ (function (_super) {
                     width: width,
                 },
             };
-            var textareaClassNames = _this.cx(_this.getTextareaSizeClassName(), (_a = {},
-                _a[_this.styles.textarea(_this.theme)] = true,
-                _a[_this.styles.hovering(_this.theme)] = !error && !warning,
-                _a[_this.styles.disabled(_this.theme)] = disabled,
-                _a[_this.styles.error(_this.theme)] = !!error,
-                _a[_this.styles.warning(_this.theme)] = !!warning,
-                _a[_this.styles.disableAnimations()] = _this.isAnimationsDisabled(),
+            var textareaClassNames = cx(_this.getTextareaSizeClassName(), (_a = {},
+                _a[styles.textarea] = true,
+                _a[styles.hovering] = !error && !warning,
+                _a[styles.disabled] = disabled,
+                _a[styles.error] = !!error,
+                _a[styles.warning] = !!warning,
+                _a[styles.disableAnimations] = _this.isAnimationsDisabled(),
                 _a));
             var textareaStyle = {
                 resize: autoResize ? 'none' : resize,
@@ -150,14 +151,14 @@ var Textarea = /** @class */ (function (_super) {
             };
             var placeholderPolyfill = null;
             if (_this.state.needsPolyfillPlaceholder && !textareaProps.value && !textareaProps.defaultValue) {
-                placeholderPolyfill = React.createElement("span", { className: _this.styles.placeholder() }, placeholder);
+                placeholderPolyfill = React.createElement("span", { className: styles.placeholder }, placeholder);
             }
             var fakeTextarea = null;
             if (autoResize) {
                 var fakeProps = {
                     value: _this.props.value,
                     defaultValue: _this.props.defaultValue,
-                    className: _this.cx(textareaClassNames, _this.styles.fake()),
+                    className: cx(textareaClassNames, styles.fake),
                     readOnly: true,
                 };
                 fakeTextarea = React.createElement("textarea", __assign({}, fakeProps, { ref: _this.refFake }));
@@ -165,8 +166,8 @@ var Textarea = /** @class */ (function (_super) {
             var counter = showLengthCounter && isCounterVisible && _this.node && (React.createElement(TextareaCounter, { textarea: _this.node, size: _this.size, help: counterHelp, value: textareaProps.value, length: (_d = (_c = textareaProps.maxLength) !== null && _c !== void 0 ? _c : lengthCounter) !== null && _d !== void 0 ? _d : 0, onCloseHelp: _this.handleCloseCounterHelp, ref: _this.refCounter }));
             var Component = isSafariWithTextareaBug ? TextareaWithSafari17Workaround : 'textarea';
             return (React.createElement(RenderLayer, { onFocusOutside: _this.handleCloseCounterHelp, onClickOutside: _this.handleCloseCounterHelp, active: _this.state.isCounterVisible },
-                React.createElement("label", __assign({ "data-tid": TextareaDataTids.root }, rootProps, { className: _this.cx(_this.getRootSizeClassName(), (_b = {},
-                        _b[_this.styles.root()] = true,
+                React.createElement("label", __assign({ "data-tid": TextareaDataTids.root }, rootProps, { className: cx(_this.getRootSizeClassName(), (_b = {},
+                        _b[styles.root] = true,
                         _b)) }),
                     placeholderPolyfill,
                     React.createElement(ResizeDetector, { onResize: _this.reflowCounter, alignBaseline: true },
@@ -298,23 +299,23 @@ var Textarea = /** @class */ (function (_super) {
     Textarea.prototype.getRootSizeClassName = function () {
         switch (this.size) {
             case 'large':
-                return this.styles.rootLarge(this.theme);
+                return styles.rootLarge;
             case 'medium':
-                return this.styles.rootMedium(this.theme);
+                return styles.rootMedium;
             case 'small':
             default:
-                return this.styles.rootSmall(this.theme);
+                return styles.rootSmall;
         }
     };
     Textarea.prototype.getTextareaSizeClassName = function () {
         switch (this.size) {
             case 'large':
-                return this.styles.textareaLarge(this.theme);
+                return styles.textareaLarge;
             case 'medium':
-                return this.styles.textareaMedium(this.theme);
+                return styles.textareaMedium;
             case 'small':
             default:
-                return this.styles.textareaSmall(this.theme);
+                return styles.textareaSmall;
         }
     };
     Textarea.prototype.getAutoResizeThrottleWait = function (props) {
@@ -361,7 +362,6 @@ var Textarea = /** @class */ (function (_super) {
     };
     Textarea.prototype.render = function () {
         var _this = this;
-        this.styles = getStyles(this.emotion);
         return (React.createElement(ThemeContext.Consumer, null, function (theme) {
             _this.theme = theme;
             return (React.createElement(CommonWrapper, __assign({ rootNodeRef: _this.setRootNode }, _this.getProps()), _this.renderMain));