npm - @skbkontur/react-ui - Versions diffs - 0.0.0-b08da15166 → 0.0.0-b5a1896fa9 - Mend

@skbkontur/react-ui 0.0.0-b08da15166 → 0.0.0-b5a1896fa9

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 (2163) hide show

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

@@ -5,7 +5,6 @@ import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 var _class, _class2, _temp;
 import React from 'react';
-import PropTypes from 'prop-types';
 import invariant from 'invariant';
 import { ResizeDetector } from "../../../internal/ResizeDetector";
 import { isKeyArrow, isKeyArrowLeft, isKeyArrowUp } from "../../../lib/events/keyboard/identifiers";
@@ -15,8 +14,12 @@ import { ThemeContext } from "../../../lib/theming/ThemeContext";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
 import { cx } from "../../../lib/theming/Emotion";
 import { rootNode } from "../../../lib/rootNode";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
 import { TabsContext, TabsContextDefaultValue } from "../TabsContext";
 import { styles, horizontalStyles, verticalStyles, globalClasses } from "../Tab.styles";
+export var TabDataTids = {
+  root: 'Tab__root'
+};
 export
 /**
 * Tab element of Tabs component
@@ -41,6 +44,7 @@ var Tab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Com
     _this = _React$Component.call(this, props) || this;
     _this.context = _this.context;
+    _this.getProps = createPropsGetter(Tab.defaultProps);
     _this.state = {
       focusedByKeyboard: false
     };
@@ -51,7 +55,7 @@ var Tab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Com
     };
     _this.getId = function () {
-      return _this.props.id || _this.props.href;
+      return _this.props.id || _this.getProps().href;
     };
     _this.refTabComponent = function (instance) {
@@ -68,7 +72,11 @@ var Tab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Com
         return;
       }
-      var id = _this.props.id || _this.props.href;
+      var _this$getProps = _this.getProps(),
+          href = _this$getProps.href,
+          component = _this$getProps.component;
+      var id = _this.props.id || href;
       if (_this.props.onClick) {
         _this.props.onClick(event);
@@ -82,7 +90,7 @@ var Tab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Com
         _this.context.switchTab(id);
       }
-      if (_this.props.component === 'a' && !_this.props.href) {
+      if (component === 'a' && !href) {
         event.preventDefault();
       }
     };
@@ -199,9 +207,12 @@ var Tab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Com
         warning = _this$props.warning,
         success = _this$props.success,
         primary = _this$props.primary,
-        _this$props$component = _this$props.component,
-        Component = _this$props$component === void 0 ? Tab.defaultProps.component : _this$props$component,
-        href = _this$props.href;
+        ariaDescribedby = _this$props['aria-describedby'];
+    var _this$getProps2 = this.getProps(),
+        Component = _this$getProps2.component,
+        href = _this$getProps2.href;
     var isActive = false;
     var isVertical = false;
     var id = this.getId();
@@ -215,6 +226,7 @@ var Tab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Com
     return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
       rootNodeRef: this.setRootNode
     }, this.props), /*#__PURE__*/React.createElement(Component, {
+      "data-tid": TabDataTids.root,
       className: cx((_cx = {}, _cx[styles.root(this.theme)] = true, _cx[styles.vertical(this.theme)] = !!isVertical, _cx[orientationStyles.primary(this.theme)] = !!primary, _cx[orientationStyles.success(this.theme)] = !!success, _cx[orientationStyles.warning(this.theme)] = !!warning, _cx[orientationStyles.error(this.theme)] = !!error, _cx[styles.active()] = !!isActive, _cx[orientationStyles.active(this.theme)] = !!isActive, _cx[styles.disabled(this.theme)] = !!disabled, _cx[orientationStyles.disabled()] = !!disabled, _cx)),
       onBlur: this.handleBlur,
       onClick: this.switchTab,
@@ -222,7 +234,8 @@ var Tab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Com
       onKeyDown: this.handleKeyDown,
       tabIndex: disabled ? -1 : 0,
       ref: isFunctionalComponent(Component) ? null : this.refTabComponent,
-      href: href
+      href: href,
+      "aria-describedby": ariaDescribedby
     }, /*#__PURE__*/React.createElement(ResizeDetector, {
       onResize: this.context.notifyUpdate
     }, children), this.state.focusedByKeyboard && /*#__PURE__*/React.createElement("div", {
@@ -231,13 +244,7 @@ var Tab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Com
   };
   return Tab;
-}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Tab', _class2.contextType = TabsContext, _class2.propTypes = {
-  children: PropTypes.node,
-  disabled: PropTypes.bool,
-  href: PropTypes.string.isRequired,
-  onClick: PropTypes.func,
-  onKeyDown: PropTypes.func
-}, _class2.defaultProps = {
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Tab', _class2.contextType = TabsContext, _class2.defaultProps = {
   component: 'a',
   href: ''
 }, _temp)) || _class;

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["Tab.tsx"],"names":["React","PropTypes","invariant","ResizeDetector","isKeyArrow","isKeyArrowLeft","isKeyArrowUp","keyListener","isFunctionalComponent","ThemeContext","CommonWrapper","cx","rootNode","TabsContext","TabsContextDefaultValue","styles","horizontalStyles","verticalStyles","globalClasses","Tab","props","context","state","focusedByKeyboard","tabComponent","getUnderlyingNode","getId","id","href","refTabComponent","instance","getTabInstance","switchTab","event","disabled","preventDefault","onClick","defaultPrevented","component","handleKeyDown","e","onKeyDown","delta","shiftFocus","handleFocus","requestAnimationFrame","isTabPressed","isArrowPressed","setState","handleBlur","componentDidMount","addTab","componentDidUpdate","activeTab","notifyUpdate","componentWillUnmount","removeTab","render","theme","renderMain","getIndicators","error","Boolean","warning","success","primary","children","Component","defaultProps","isActive","isVertical","vertical","orientationStyles","setRootNode","root","active","focus","__KONTUR_REACT_UI__","contextType","propTypes","node","bool","string","isRequired","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport invariant from 'invariant';\n\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { isKeyArrow, isKeyArrowLeft, isKeyArrowUp } from '../../lib/events/keyboard/identifiers';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Nullable } from '../../typings/utility-types';\nimport { isFunctionalComponent } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { TabsContext, TabsContextType, TabsContextDefaultValue } from './TabsContext';\nimport { styles, horizontalStyles, verticalStyles, globalClasses } from './Tab.styles';\n\nexport interface TabIndicators {\n error: boolean;\n warning: boolean;\n success: boolean;\n primary: boolean;\n disabled: boolean;\n}\n\nexport interface TabProps<T extends string = string> extends CommonProps {\n /*\n Tab content\n /\n children?: React.ReactNode;\n\n /\n Component to use as a tab\n /\n component?: React.ComponentType<any> \| string;\n\n /\n Link href\n /\n href?: string;\n\n /\n Tab identifier\n /\n id?: T;\n\n /\n Click event\n /\n onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n\n /\n Click event\n /\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n\n /\n Disabled indicator\n /\n disabled?: boolean;\n\n /\n Состояние валидации при ошибке.\n /\n error?: boolean;\n\n /\n Состояние валидации при предупреждении.\n /\n warning?: boolean;\n\n /\n Success indicator\n /\n success?: boolean;\n\n /\n Primary indicator\n /\n primary?: boolean;\n\n /\n Style property\n /\n style?: React.CSSProperties;\n}\n\nexport interface TabState {\n focusedByKeyboard: boolean;\n}\n\n/\n Tab element of Tabs component\n \n Can be used for creating custom tabs\n * ```js\n \n const RouteTab = (props) => (\n * <Tab id={props.to} component={RouteLink} {...props}/>\n * )\n \n const MyAwesomeTab = (props) => <Tab id={props.id}>8) {props.children}</Tab>\n * ```\n \n Works only inside Tabs component, otherwise throws\n */\n@rootNode\nexport class Tab<T extends string = string> extends React.Component<TabProps<T>, TabState> {\n public static __KONTUR_REACT_UI__ = 'Tab';\n\n public static contextType = TabsContext;\n public context: TabsContextType = this.context;\n\n public static propTypes = {\n children: PropTypes.node,\n disabled: PropTypes.bool,\n href: PropTypes.string.isRequired,\n onClick: PropTypes.func,\n onKeyDown: PropTypes.func,\n };\n\n public static defaultProps = {\n component: 'a',\n href: '',\n };\n\n public state: TabState = {\n focusedByKeyboard: false,\n };\n\n private theme!: Theme;\n private tabComponent: Nullable<React.ReactElement<Tab<T>>> = null;\n private setRootNode!: TSetRootNode;\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 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() {\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() {\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 = () => this.tabComponent;\n\n private renderMain() {\n const {\n children,\n disabled,\n error,\n warning,\n success,\n primary,\n component: Component = Tab.defaultProps.component,\n href,\n } = this.props;\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 rootNodeRef={this.setRootNode} {...this.props}>\n <Component\n className={cx({\n [styles.root(this.theme)]: true,\n [styles.vertical(this.theme)]: !!isVertical,\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 [styles.active()]: !!isActive,\n [orientationStyles.active(this.theme)]: !!isActive,\n [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 >\n <ResizeDetector onResize={this.context.notifyUpdate}>{children}</ResizeDetector>\n {this.state.focusedByKeyboard && <div className={cx(styles.focus(this.theme), globalClasses.focus)} />}\n </Component>\n </CommonWrapper>\n );\n }\n\n private getId = () => this.props.id \|\| this.props.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\n const id = this.props.id \|\| this.props.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 (this.props.component === 'a' && !this.props.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 requestAnimationFrame(() => {\n if (keyListener.isTabPressed \|\| 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,"sources":["Tab.tsx"],"names":["React","invariant","ResizeDetector","isKeyArrow","isKeyArrowLeft","isKeyArrowUp","keyListener","isFunctionalComponent","ThemeContext","CommonWrapper","cx","rootNode","createPropsGetter","TabsContext","TabsContextDefaultValue","styles","horizontalStyles","verticalStyles","globalClasses","TabDataTids","root","Tab","props","context","getProps","defaultProps","state","focusedByKeyboard","tabComponent","getUnderlyingNode","getId","id","href","refTabComponent","instance","getTabInstance","switchTab","event","disabled","preventDefault","component","onClick","defaultPrevented","handleKeyDown","e","onKeyDown","delta","shiftFocus","handleFocus","requestAnimationFrame","isTabPressed","isArrowPressed","setState","handleBlur","componentDidMount","addTab","componentDidUpdate","activeTab","notifyUpdate","componentWillUnmount","removeTab","render","theme","renderMain","getIndicators","error","Boolean","warning","success","primary","children","ariaDescribedby","Component","isActive","isVertical","vertical","orientationStyles","setRootNode","active","focus","__KONTUR_REACT_UI__","contextType"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport invariant from 'invariant';\n\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { isKeyArrow, isKeyArrowLeft, isKeyArrowUp } from '../../lib/events/keyboard/identifiers';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Nullable } from '../../typings/utility-types';\nimport { isFunctionalComponent } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { TabsContext, TabsContextType, TabsContextDefaultValue } from './TabsContext';\nimport { styles, horizontalStyles, verticalStyles, globalClasses } from './Tab.styles';\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> extends CommonProps {\n /*\n Tab content\n /\n children?: React.ReactNode;\n\n /\n Component to use as a tab\n /\n component?: React.ComponentType<any> \| string;\n\n /\n Link href\n /\n href?: string;\n\n /\n Tab identifier\n /\n id?: T;\n\n /\n Click event\n /\n onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n\n /\n Click event\n /\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n\n /\n Disabled indicator\n /\n disabled?: boolean;\n\n /\n Состояние валидации при ошибке.\n /\n error?: boolean;\n\n /\n Состояние валидации при предупреждении.\n /\n warning?: boolean;\n\n /\n Success indicator\n /\n success?: boolean;\n\n /\n Primary indicator\n /\n primary?: boolean;\n\n /\n Style property\n /\n style?: React.CSSProperties;\n\n /\n Атрибут для указания id элемента(-ов), описывающих его\n /\n 'aria-describedby'?: AriaAttributes['aria-describedby'];\n}\n\nexport interface TabState {\n focusedByKeyboard: boolean;\n}\n\ntype DefaultProps = Required<Pick<TabProps, 'component' \| 'href'>>;\n\n/\n Tab element of Tabs component\n \n Can be used for creating custom tabs\n * ```js\n \n const RouteTab = (props) => (\n * <Tab id={props.to} component={RouteLink} {...props}/>\n * )\n \n const MyAwesomeTab = (props) => <Tab id={props.id}>8) {props.children}</Tab>\n * ```\n \n Works only inside Tabs component, otherwise throws\n */\n@rootNode\nexport class Tab<T extends string = string> extends React.Component<TabProps<T>, TabState> {\n public static __KONTUR_REACT_UI__ = '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 theme!: Theme;\n private tabComponent: Nullable<React.ReactElement<Tab<T>>> = null;\n private setRootNode!: TSetRootNode;\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 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() {\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() {\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 = () => this.tabComponent;\n\n private renderMain() {\n const { children, disabled, error, warning, success, primary, 'aria-describedby': ariaDescribedby } = 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 rootNodeRef={this.setRootNode} {...this.props}>\n <Component\n data-tid={TabDataTids.root}\n className={cx({\n [styles.root(this.theme)]: true,\n [styles.vertical(this.theme)]: !!isVertical,\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 [styles.active()]: !!isActive,\n [orientationStyles.active(this.theme)]: !!isActive,\n [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 >\n <ResizeDetector onResize={this.context.notifyUpdate}>{children}</ResizeDetector>\n {this.state.focusedByKeyboard && <div className={cx(styles.focus(this.theme), globalClasses.focus)} />}\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 requestAnimationFrame(() => {\n if (keyListener.isTabPressed \|\| 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/Tab.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import React, { AriaAttributes } from 'react';
 import { Nullable } from '../../typings/utility-types';
 import { CommonProps } from '../../internal/CommonWrapper';
 import { TabsContextType } from './TabsContext';
@@ -10,6 +9,9 @@ export interface TabIndicators {
     primary: boolean;
     disabled: boolean;
 }
+export declare const TabDataTids: {
+    readonly root: "Tab__root";
+};
 export interface TabProps<T extends string = string> extends CommonProps {
     /**
      * Tab content
@@ -59,10 +61,15 @@ export interface TabProps<T extends string = string> extends CommonProps {
      * Style property
      */
     style?: React.CSSProperties;
+    /**
+     * Атрибут для указания id элемента(-ов), описывающих его
+     */
+    'aria-describedby'?: AriaAttributes['aria-describedby'];
 }
 export interface TabState {
     focusedByKeyboard: boolean;
 }
+declare type DefaultProps = Required<Pick<TabProps, 'component' | 'href'>>;
 /**
  * Tab element of Tabs component
  *
@@ -82,17 +89,8 @@ export declare class Tab<T extends string = string> extends React.Component<TabP
     static __KONTUR_REACT_UI__: string;
     static contextType: React.Context<TabsContextType<any>>;
     context: TabsContextType;
-    static propTypes: {
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        disabled: PropTypes.Requireable<boolean>;
-        href: PropTypes.Validator<string>;
-        onClick: PropTypes.Requireable<(...args: any[]) => any>;
-        onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    static defaultProps: {
-        component: string;
-        href: string;
-    };
+    static defaultProps: DefaultProps;
+    private getProps;
     state: TabState;
     private theme;
     private tabComponent;
@@ -119,3 +117,4 @@ export declare class Tab<T extends string = string> extends React.Component<TabP
     private handleFocus;
     private handleBlur;
 }
+export {};

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

@@ -5,16 +5,20 @@ import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 var _class, _class2, _temp;
 import React from 'react';
-import PropTypes from 'prop-types';
 import { ThemeContext } from "../../../lib/theming/ThemeContext";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
 import { cx } from "../../../lib/theming/Emotion";
 import { getRootNode } from "../../../lib/rootNode/getRootNode";
 import { rootNode } from "../../../lib/rootNode";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
 import { Indicator } from "../Indicator";
 import { styles } from "../Tabs.styles";
 import { TabsContext } from "../TabsContext";
 import { Tab } from "../Tab";
+export var TabsDataTids = {
+  root: 'Tabs__root',
+  indicatorRoot: 'Indicator__root'
+};
 export
 /**
 * Tabs wrapper
@@ -32,6 +36,7 @@ var Tabs = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
     }
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(Tabs.defaultProps);
     _this.tabs = [];
     _this.tabUpdates = {
       on: function on(cb) {
@@ -109,20 +114,23 @@ var Tabs = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
     var _this2 = this;
     var _this$props2 = this.props,
-        vertical = _this$props2.vertical,
         value = _this$props2.value,
         width = _this$props2.width,
         children = _this$props2.children,
-        indicatorClassName = _this$props2.indicatorClassName;
+        indicatorClassName = _this$props2.indicatorClassName,
+        ariaDescribedby = _this$props2['aria-describedby'];
+    var vertical = this.getProps().vertical;
     return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
       _this2.theme = theme;
       return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
         rootNodeRef: _this2.setRootNode
       }, _this2.props), /*#__PURE__*/React.createElement("div", {
+        "data-tid": TabsDataTids.root,
         className: cx(styles.root(_this2.theme), vertical && styles.vertical()),
         style: {
           width: width
-        }
+        },
+        "aria-describedby": ariaDescribedby
       }, /*#__PURE__*/React.createElement(TabsContext.Provider, {
         value: {
           vertical: vertical,
@@ -137,18 +145,12 @@ var Tabs = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
       }, children, /*#__PURE__*/React.createElement(Indicator, {
         className: indicatorClassName,
         tabUpdates: _this2.tabUpdates,
-        vertical: vertical
+        vertical: _this2.getProps().vertical
       }))));
     });
   };
   return Tabs;
-}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Tabs', _class2.propTypes = {
-  children: PropTypes.node,
-  indicatorClassName: PropTypes.string,
-  value: PropTypes.string.isRequired,
-  vertical: PropTypes.bool,
-  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
-}, _class2.defaultProps = {
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Tabs', _class2.defaultProps = {
   vertical: false
 }, _class2.Tab = Tab, _temp)) || _class;

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["Tabs.tsx"],"names":["React","~~PropTypes","~~ThemeContext","CommonWrapper","cx","getRootNode","rootNode","Indicator","styles","TabsContext","Tab","Tabs","tabs","tabUpdates","on","cb","index","listeners","push","splice","shiftFocus","fromTab","delta","findIndex","x","id","newIndex","Math","max","min","length","tab","tabNode","getNode","htmlNode","HTMLElement","focus","notifyUpdate","forEach","switchTab","props","onValueChange","value","getTab","find","addTab","concat","removeTab","filter","render","~~vertical","~~width","children","indicatorClassName","~~theme~~","~~setRootNode~~","~~root~~","activeTab","Component","__KONTUR_REACT_UI__"~~,"propTypes","node","string","isRequired","bool","oneOfType","number","defaultProps"~~],"mappings":"iPAAA,OAAOA,KAAP,~~MAAkB~~,~~OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB~~;;;AAGA,SAASC,YAAT,QAA6B,gCAA7B;;AAEA,SAAsBC,aAAtB,QAA2C,8BAA3C;AACA,SAASC,EAAT,QAAmB,2BAAnB;AACA,SAASC,WAAT,QAA4B,gCAA5B;AACA,SAASC,QAAT,QAAuC,oBAAvC;;AAEA,SAASC,SAAT,QAA0B,aAA1B;AACA,SAASC,MAAT,QAAuB,eAAvB;AACA,SAASC,WAAT,QAA6C,eAA7C;AACA,SAASC,GAAT,QAAoB,OAApB~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+CA~~,OANA;AACA;AACA;AACA;AACA,GAEA,IAAaC,IAAb,~~GADCL~~,QACD~~;;;;;;;;;;;;;;AAkBUM~~,IAAAA,~~IAlBV~~,~~GAkBoC~~,~~EAlBpC~~;;~~AAoBUC~~,IAAAA,~~UApBV~~,~~GAoBuB~~;AACnBC,MAAAA,EAAE,EAAE,YAACC,EAAD,EAAoB;AACtB,YAAMC,KAAK,GAAG,MAAKC,SAAL,CAAeC,IAAf,CAAoBH,EAApB,CAAd;AACA,eAAO,YAAM;AACX,gBAAKE,SAAL,CAAeE,MAAf,CAAsBH,KAAtB,EAA6B,CAA7B;AACD,SAFD;AAGD,OANkB,~~EApBvB~~;;;~~AA6BUC~~,IAAAA,~~SA7BV~~,~~GA6BkD~~,~~EA7BlD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiEUG~~,IAAAA,~~UAjEV~~,~~GAiEyD~~,UAACC,OAAD,EAAUC,KAAV,EAAoB;AACzE,gEAAQV,IAAR,yBAAQA,IAAR;AACA,UAAMI,KAAK,GAAGJ,IAAI,CAACW,SAAL,CAAe,UAACC,CAAD,UAAOA,CAAC,CAACC,EAAF,KAASJ,OAAhB,EAAf,CAAd;AACA,UAAMK,QAAQ,GAAGC,IAAI,CAACC,GAAL,CAAS,CAAT,EAAYD,IAAI,CAACE,GAAL,CAASb,KAAK,GAAGM,KAAjB,EAAwBV,IAAI,CAACkB,MAAL,GAAc,CAAtC,CAAZ,CAAjB;AACA,UAAMC,GAAG,GAAGnB,IAAI,CAACc,QAAD,CAAhB;;AAEA,UAAMM,OAAO,GAAGD,GAAG,CAACE,OAAJ,EAAhB;AACA,UAAMC,QAAQ,~~GAAG7B~~,WAAW,~~CAAC2B~~,OAAD,CAA5B;;AAEA,UAAIE,QAAQ,IAAIA,QAAQ,YAAYC,WAAhC,IAA+C,OAAOD,QAAQ,CAACE,KAAhB,KAA0B,UAA7E,EAAyF;AACvFF,QAAAA,QAAQ,CAACE,KAAT;AACD;AACF,~~KA7EH~~;;~~AA+EUC~~,IAAAA,~~YA/EV~~,~~GA+E6D~~,YAAM;AAC/D,YAAKpB,SAAL,CAAeqB,OAAf,CAAuB,UAACvB,EAAD,UAAQA,EAAE,EAAV,EAAvB;AACD,~~KAjFH~~;;~~AAmFUwB~~,IAAAA,~~SAnFV~~,~~GAmFuD~~,UAACd,EAAD,EAAQ;AAC3D,wBAAiC,MAAKe,KAAtC,CAAQC,aAAR,eAAQA,aAAR,CAAuBC,KAAvB,eAAuBA,KAAvB;AACA,UAAIjB,EAAE,KAAKiB,KAAP,IAAgBD,aAApB,EAAmC;AACjCA,QAAAA,aAAa,CAAChB,EAAD,CAAb;AACD;AACF,~~KAxFH~~;;~~AA0FUkB~~,IAAAA,~~MA1FV~~,~~GA0FiD~~,UAAClB,EAAD,EAAQ;AACrD,iBAA2B,MAAKb,IAAL,CAAUgC,IAAV,CAAe,UAACpB,CAAD,UAAOA,CAAC,CAACC,EAAF,KAASA,EAAhB,EAAf,KAAsC,EAAjE,qBAAQQ,OAAR,CAAQA,OAAR,6BAAkB,IAAlB;AACA,aAAOA,OAAO,IAAIA,OAAO,EAAzB;AACD,~~KA7FH~~;;~~AA+FUY~~,IAAAA,~~MA/FV~~,~~GA+FiD~~,UAACpB,EAAD,EAAKQ,OAAL,EAAiB;AAC9D,YAAKrB,IAAL,GAAY,MAAKA,IAAL,CAAUkC,MAAV,CAAiB,EAAErB,EAAE,EAAFA,EAAF,EAAMQ,OAAO,EAAPA,OAAN,EAAjB,CAAZ;AACD,~~KAjGH~~;;~~AAmGUc~~,IAAAA,~~SAnGV~~,~~GAmGuD~~,UAACtB,EAAD,EAAQ;AAC3D,YAAKb,IAAL,GAAY,MAAKA,IAAL,CAAUoC,MAAV,CAAiB,UAACjB,GAAD,UAASA,GAAG,CAACN,EAAJ,KAAWA,EAApB,EAAjB,CAAZ;AACD,~~KArGH~~,~~kDAgCSwB~~,~~MAhCT~~,~~GAgCE~~,kBAA6B,mBAC3B,~~mBAAiE~~,KAAKT,~~KAAtE~~,~~CAAQU~~,~~QAAR~~,gBAAQA,~~QAAR~~,~~CAAkBR~~,~~KAAlB~~,~~gBAAkBA~~,~~KAAlB~~,~~CAAyBS~~,~~KAAzB~~,~~gBAAyBA~~,~~KAAzB~~,CAAgCC,~~QAAhC~~,gBAAgCA,~~QAAhC~~,~~CAA0CC~~,~~kBAA1C~~,~~gBAA0CA~~,~~kBAA1C~~,~~CAEA~~,oBACE,oBAAC,YAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,oBACE,oBAAC,aAAD,aAAe,WAAW,EAAE,MAAI,CAACC,WAAjC,IAAkD,MAAI,~~CAACf~~,KAAvD,gBACE,~~6BAAK~~,SAAS,~~EAAEpC~~,EAAE,~~CAACI~~,MAAM,~~CAACgD~~,IAAP,CAAY,MAAI,~~CAACF~~,KAAjB,CAAD,~~EAA0BJ~~,QAAQ,~~IAAI1C~~,MAAM,~~CAAC0C~~,QAAP,EAAtC,~~CAAlB~~,~~EAA4E~~,KAAK,EAAE,~~EAAEC~~,KAAK,EAALA,KAAF,~~EAAnF~~,~~iBACE~~,oBAAC,WAAD,CAAa,QAAb,IACE,KAAK,EAAE,~~EACLD~~,QAAQ,EAARA,QADK,~~EAELO~~,SAAS,EAAEf,KAFN,EAGLC,MAAM,EAAE,MAAI,CAACA,MAHR,EAILE,MAAM,EAAE,MAAI,CAACA,MAJR,EAKLE,SAAS,EAAE,MAAI,CAACA,SALX,EAMLV,YAAY,EAAE,MAAI,CAACA,YANd,EAOLjB,UAAU,EAAE,MAAI,CAACA,UAPZ,EAQLmB,SAAS,EAAE,MAAI,CAACA,SARX,EADT,~~IAYGa~~,QAZH,eAaE,oBAAC,SAAD,~~IAAW~~,SAAS,EAAEC,~~kBAAtB~~,~~EAA0C~~,UAAU,EAAE,MAAI,~~CAACxC~~,~~UAA3D~~,~~EAAuE~~,QAAQ,~~EAAEqC~~,~~QAAjF~~,GAbF,~~CADF~~,CADF,CADF,~~CAqBD~~,~~CAxBH~~,CADF,~~CA4BD~~,~~CA/DH~~,~~eAAqDlD~~,KAAK,~~CAAC0D~~,SAA3D,WACgBC,mBADhB,GACsC,MADtC,~~UAGgBC~~,~~SAHhB~~,~~GAG4B~~,~~EACxBR~~,QAAQ,~~EAAEnD~~,~~SAAS,CAAC4D,IADI,EAExBR,kBAAkB,EAAEpD,SAAS,CAAC6D,MAFN,EAGxBpB,KAAK,EAAEzC,SAAS,CAAC6D,MAAV,CAAiBC,UAHA,EAIxBb,QAAQ,EAAEjD,SAAS,CAAC~~+~~D,IAJI,EAKxBb,KAAK,EAAElD,SAAS,CAACgE,SAAV,CAAoB,CAAChE,SAAS,CAAC6D,MAAX,EAAmB7D,SAAS,CAACiE,MAA7B,CAApB,CALiB,EAH5B,UAUgBC,YAVhB,GAU+~~B,~~EAC3BjB~~,~~QAAQ~~,~~EAAE~~,~~KADiB~~,~~EAV/B,UAcgBxC,GAdhB,GAcsBA,GAdtB~~","sourcesContent":["import React ~~from~~ ~~'react';\nimport~~ ~~PropTypes~~ from '~~prop-types~~';\n\nimport { emptyHandler } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { getRootNode } from '../../lib/rootNode/getRootNode';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { Indicator } from './Indicator';\nimport { styles } from './Tabs.styles';\nimport { TabsContext, TabsContextType } from './TabsContext';\nimport { Tab } from './Tab';\n\ntype ValueBaseType = string;\~~ntype~~ 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 Tab component should be child of Tabs component\n /\n children?: React.ReactNode;\n\n /\n Classname of indicator\n /\n indicatorClassName?: string;\n\n /\n Tabs change event\n /\n onValueChange?: (value: T) => void;\n\n /\n Active tab identifier\n /\n value: T;\n\n /\n Vertical indicator\n * @default false\n /\n vertical: boolean;\n\n /\n Width of tabs container\n /\n width?: number \| string;\n}\n\n/\n Tabs wrapper\n \n contains static property `Tab`\n */\n@rootNode\nexport class Tabs<T extends string = string> extends React.Component<TabsProps<T>> {\n public static __KONTUR_REACT_UI__ = 'Tabs';\n\n public static ~~propTypes~~ = {\n ~~children: PropTypes.node,\n indicatorClassName: PropTypes.string,\n value: PropTypes.string.isRequired,\n~~ vertical: ~~PropTypes.bool~~,\n ~~width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n~~ };\n ~~public~~ ~~static~~ ~~defaultProps~~ = ~~{\n vertical: false,\n }~~;\n\n public static Tab = Tab;\n\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 private setRootNode!: TSetRootNode;\n\n public render(): JSX.Element {\n const { ~~vertical,~~ value, width, children, indicatorClassName } = this.props;\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div className={cx(styles.root(this.theme), vertical && styles.vertical())} style={{ width }}>\n <TabsContext.Provider\n value={{\n vertical,\n activeTab: value,\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 className={indicatorClassName} tabUpdates={this.tabUpdates} vertical={vertical} />\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 (htmlNode && htmlNode instanceof 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,"sources":["Tabs.tsx"],"names":["React","ThemeContext","CommonWrapper","cx","getRootNode","rootNode","createPropsGetter","Indicator","styles","TabsContext","Tab","TabsDataTids","root","indicatorRoot","Tabs","getProps","defaultProps","tabs","tabUpdates","on","cb","index","listeners","push","splice","shiftFocus","fromTab","delta","findIndex","x","id","newIndex","Math","max","min","length","tab","tabNode","getNode","htmlNode","HTMLElement","focus","notifyUpdate","forEach","switchTab","props","onValueChange","value","getTab","find","addTab","concat","removeTab","filter","render","width","children","indicatorClassName","ariaDescribedby","vertical","theme","setRootNode","activeTab","Component","__KONTUR_REACT_UI__"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\n\nimport { emptyHandler } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { getRootNode } from '../../lib/rootNode/getRootNode';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { Indicator } from './Indicator';\nimport { styles } from './Tabs.styles';\nimport { TabsContext, TabsContextType } from './TabsContext';\nimport { Tab } from './Tab';\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 Tab component should be child of Tabs component\n /\n children?: React.ReactNode;\n\n /\n Classname of indicator\n /\n indicatorClassName?: string;\n\n /\n Tabs change event\n /\n onValueChange?: (value: T) => void;\n\n /\n Active tab identifier\n /\n value: T;\n\n /\n Vertical indicator\n * @default false\n /\n vertical?: boolean;\n\n /\n Width of tabs container\n /\n width?: number \| string;\n\n /\n Атрибут для указания id элемента(-ов), описывающих его\n /\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'>>;\n\n/\n Tabs wrapper\n \n contains static property `Tab`\n */\n@rootNode\nexport class Tabs<T extends string = string> extends React.Component<TabsProps<T>> {\n public static __KONTUR_REACT_UI__ = 'Tabs';\n\n public static defaultProps: DefaultProps = {\n vertical: false,\n };\n\n private getProps = createPropsGetter(Tabs.defaultProps);\n\n public static Tab = Tab;\n\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 private setRootNode!: TSetRootNode;\n\n public render(): JSX.Element {\n const { value, width, children, indicatorClassName, 'aria-describedby': ariaDescribedby } = this.props;\n const vertical = this.getProps().vertical;\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={cx(styles.root(this.theme), vertical && styles.vertical())}\n style={{ width }}\n aria-describedby={ariaDescribedby}\n >\n <TabsContext.Provider\n value={{\n vertical,\n activeTab: value,\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 (htmlNode && htmlNode instanceof 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/Tabs/Tabs.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import React, { AriaAttributes } from 'react';
 import { CommonProps } from '../../internal/CommonWrapper';
 import { Tab } from './Tab';
 declare type ValueBaseType = string;
@@ -24,12 +23,21 @@ export interface TabsProps<T extends ValueBaseType = string> extends CommonProps
      * Vertical indicator
      * @default false
      */
-    vertical: boolean;
+    vertical?: boolean;
     /**
      * Width of tabs container
      */
     width?: number | string;
+    /**
+     * Атрибут для указания id элемента(-ов), описывающих его
+     */
+    'aria-describedby'?: AriaAttributes['aria-describedby'];
 }
+export declare const TabsDataTids: {
+    readonly root: "Tabs__root";
+    readonly indicatorRoot: "Indicator__root";
+};
+declare type DefaultProps = Required<Pick<TabsProps, 'vertical'>>;
 /**
  * Tabs wrapper
  *
@@ -37,16 +45,8 @@ export interface TabsProps<T extends ValueBaseType = string> extends CommonProps
  */
 export declare class Tabs<T extends string = string> extends React.Component<TabsProps<T>> {
     static __KONTUR_REACT_UI__: string;
-    static propTypes: {
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        indicatorClassName: PropTypes.Requireable<string>;
-        value: PropTypes.Validator<string>;
-        vertical: PropTypes.Requireable<boolean>;
-        width: PropTypes.Requireable<string | number>;
-    };
-    static defaultProps: {
-        vertical: boolean;
-    };
+    static defaultProps: DefaultProps;
+    private getProps;
     static Tab: typeof Tab;
     private theme;
     private tabs;

package/components/Textarea/Textarea/Textarea.js CHANGED Viewed

@@ -3,7 +3,10 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 var _excluded = ["width", "error", "warning", "autoResize", "resize", "onCut", "onPaste", "maxRows", "onFocus", "selectAllOnFocus", "placeholder", "onValueChange", "showLengthCounter", "lengthCounter", "counterHelp", "extraRow", "disableAnimations", "disabled"];
-var _class, _class2, _temp;
+var _class, _class2, _temp; // TODO: Enable this rule in functional components.
+/* eslint-disable @typescript-eslint/no-unused-vars */
 import React from 'react';
 import PropTypes from 'prop-types';
@@ -20,11 +23,17 @@ import { CommonWrapper } from "../../../internal/CommonWrapper";
 import { isTestEnv } from "../../../lib/currentEnvironment";
 import { cx } from "../../../lib/theming/Emotion";
 import { rootNode } from "../../../lib/rootNode";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
 import { getTextAreaHeight } from "../TextareaHelpers";
 import { styles } from "../Textarea.styles";
 import { TextareaCounter } from "../TextareaCounter";
 var DEFAULT_WIDTH = 250;
 var AUTORESIZE_THROTTLE_DEFAULT_WAIT = 100;
+export var TextareaDataTids = {
+  root: 'Textarea__root',
+  counter: 'TextareaCounter__root',
+  helpIcon: 'TextareaCounter__helpIcon'
+};
 export
 /**
 * Компонент для ввода многострочного текста.
@@ -44,6 +53,7 @@ var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_Reac
     }
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(Textarea.defaultProps);
     _this.state = {
       needsPolyfillPlaceholder: needsPolyfillPlaceholder,
       isCounterVisible: false
@@ -117,7 +127,7 @@ var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_Reac
           width: width
         }
       };
-      var textareaClassNames = cx((_cx = {}, _cx[styles.textarea(_this.theme)] = true, _cx[styles.disabled(_this.theme)] = disabled, _cx[styles.error(_this.theme)] = !!error, _cx[styles.warning(_this.theme)] = !!warning, _cx[styles.disableAnimations()] = _this.isAnimationsDisabled(), _cx));
+      var textareaClassNames = cx((_cx = {}, _cx[styles.textarea(_this.theme)] = true, _cx[styles.hovering(_this.theme)] = !error && !warning, _cx[styles.disabled(_this.theme)] = disabled, _cx[styles.error(_this.theme)] = !!error, _cx[styles.warning(_this.theme)] = !!warning, _cx[styles.disableAnimations()] = _this.isAnimationsDisabled(), _cx));
       var textareaStyle = {
         resize: autoResize ? 'none' : resize
       };
@@ -155,7 +165,9 @@ var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_Reac
         onFocusOutside: _this.handleCloseCounterHelp,
         onClickOutside: _this.handleCloseCounterHelp,
         active: _this.state.isCounterVisible
-      }, /*#__PURE__*/React.createElement("label", _extends({}, rootProps, {
+      }, /*#__PURE__*/React.createElement("label", _extends({
+        "data-tid": TextareaDataTids.root
+      }, rootProps, {
         className: styles.root(_this.theme)
       }), placeholderPolyfill, /*#__PURE__*/React.createElement(ResizeDetector, {
         onResize: _this.reflowCounter
@@ -250,10 +262,9 @@ var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_Reac
         fakeNode.value = node.value;
       }
-      var _this$props = _this.props,
-          rows = _this$props.rows,
-          maxRows = _this$props.maxRows,
-          extraRow = _this$props.extraRow;
+      var _this$getProps = _this.getProps(),
+          rows = _this$getProps.rows,
+          maxRows = _this$getProps.maxRows;
       if (rows === undefined || maxRows === undefined) {
         return;
@@ -263,7 +274,7 @@ var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_Reac
         node: fakeNode,
         minRows: typeof rows === 'number' ? rows : parseInt(rows, 10),
         maxRows: typeof maxRows === 'number' ? maxRows : parseInt(maxRows, 10),
-        extraRow: extraRow
+        extraRow: _this.getProps().extraRow
       }),
           height = _getTextAreaHeight.height,
           exceededMaxHeight = _getTextAreaHeight.exceededMaxHeight;
@@ -368,7 +379,11 @@ var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_Reac
       this.autoResize = throttle(this.autoResizeHandler, this.getAutoResizeThrottleWait());
     }
-    if (this.props.autoResize && (this.props.rows !== prevProps.rows || this.props.maxRows !== prevProps.maxRows || this.props.value !== prevProps.value)) {
+    var _this$getProps2 = this.getProps(),
+        rows = _this$getProps2.rows,
+        maxRows = _this$getProps2.maxRows;
+    if (this.props.autoResize && (rows !== prevProps.rows || maxRows !== prevProps.maxRows || this.props.value !== prevProps.value)) {
       this.autoResize();
     }
   };