@skbkontur/react-ui 4.2.2 → 4.4.0

package/components/Tabs/Indicator/Indicator.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Indicator.tsx"],"names":["React","throttle","LayoutEvents","ThemeContext","cx","getRootNode","rootNode","getDOMRect","styles","TabsContext","TabsDataTids","Indicator","context","state","eventListener","removeTabUpdatesListener","reflow","getTab","activeTab","node","nodeStyles","getStyles","stylesUpdated","some","prop","setState","componentDidMount","addListener","props","tabUpdates","on","componentWillUnmount","cancel","remove","componentDidUpdate","_","prevState","render","theme","renderMain","indicators","getIndicators","error","warning","success","primary","disabled","indicatorRoot","root","className","setRootNode","htmlNode","HTMLElement","rect","vertical","width","tabBorderWidth","left","offsetLeft","top","offsetTop","height","bottom","parseInt","offsetHeight","right","Component","contextType"],"mappings":"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","sourcesContent":["import React from 'react';\nimport throttle from 'lodash.throttle';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { cx } from '../../lib/theming/Emotion';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { styles } from './Indicator.styles';\nimport { TabsContext, TabsContextType } from './TabsContext';\nimport { TabIndicators } from './Tab';\nimport { TabsDataTids } from './Tabs';\n\nexport interface IndicatorProps {\n  className?: string;\n  tabUpdates: {\n    on: (x0: () => void) => () => void;\n  };\n  vertical: boolean;\n}\n\nexport interface IndicatorState {\n  styles: React.CSSProperties;\n}\n\n@rootNode\nexport class Indicator extends React.Component<IndicatorProps, IndicatorState> {\n  public static contextType = TabsContext;\n  public context: TabsContextType = this.context;\n\n  public state: IndicatorState = {\n    styles: {},\n  };\n\n  private theme!: Theme;\n\n  private eventListener: Nullable<{\n    remove: () => void;\n  }> = null;\n\n  private removeTabUpdatesListener: Nullable<() => void> = null;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidMount() {\n    this.eventListener = LayoutEvents.addListener(this.reflow);\n    this.removeTabUpdatesListener = this.props.tabUpdates.on(this.reflow);\n    this.reflow();\n  }\n\n  public componentWillUnmount() {\n    this.reflow.cancel();\n\n    if (this.eventListener) {\n      this.eventListener.remove();\n    }\n    if (this.removeTabUpdatesListener) {\n      this.removeTabUpdatesListener();\n    }\n  }\n\n  public componentDidUpdate(_: IndicatorProps, prevState: IndicatorState) {\n    this.reflow();\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    const { getTab, activeTab } = this.context;\n    const node = getTab(activeTab);\n    const indicators: TabIndicators = (node && node.getIndicators && node.getIndicators()) || {\n      error: false,\n      warning: false,\n      success: false,\n      primary: false,\n      disabled: false,\n    };\n    return (\n      <div\n        data-tid={TabsDataTids.indicatorRoot}\n        className={cx(\n          styles.root(this.theme),\n          indicators.primary && styles.primary(this.theme),\n          indicators.success && styles.success(this.theme),\n          indicators.warning && styles.warning(this.theme),\n          indicators.error && styles.error(this.theme),\n          this.props.className,\n        )}\n        style={this.state.styles}\n        ref={this.setRootNode}\n      />\n    );\n  }\n\n  private reflow = throttle(() => {\n    const { getTab, activeTab } = this.context;\n    const node = getTab(activeTab);\n    const nodeStyles = this.getStyles(node);\n    const stylesUpdated = ['left', 'top', 'width', 'height'].some(\n      (prop) => nodeStyles[prop as keyof React.CSSProperties] !== this.state.styles[prop as keyof React.CSSProperties],\n    );\n    if (stylesUpdated) {\n      this.setState({ styles: nodeStyles });\n    }\n  }, 100);\n\n  private getStyles(node: any): React.CSSProperties {\n    const htmlNode = getRootNode(node);\n\n    if (htmlNode && htmlNode instanceof HTMLElement) {\n      const rect = getDOMRect(htmlNode);\n      if (this.props.vertical) {\n        return {\n          width: this.theme.tabBorderWidth,\n          left: htmlNode.offsetLeft,\n          top: htmlNode.offsetTop,\n          height: rect.bottom - rect.top,\n        };\n      }\n\n      const tabBorderWidth = parseInt(this.theme.tabBorderWidth, 10) || 0;\n      return {\n        left: htmlNode.offsetLeft,\n        top: htmlNode.offsetHeight + htmlNode.offsetTop - tabBorderWidth,\n        width: rect.right - rect.left,\n      };\n    }\n\n    return {};\n  }\n}\n"]}
+{"version":3,"sources":["Indicator.tsx"],"names":["React","throttle","LayoutEvents","ThemeContext","cx","getRootNode","rootNode","getDOMRect","styles","TabsContext","TabsDataTids","Indicator","context","state","eventListener","removeTabUpdatesListener","reflow","getTab","activeTab","node","nodeStyles","getStyles","stylesUpdated","some","prop","setState","componentDidMount","addListener","props","tabUpdates","on","componentWillUnmount","cancel","remove","componentDidUpdate","render","theme","renderMain","indicators","getIndicators","error","warning","success","primary","disabled","indicatorRoot","root","className","setRootNode","htmlNode","HTMLElement","rect","vertical","width","tabBorderWidth","left","offsetLeft","top","offsetTop","height","bottom","parseInt","offsetHeight","right","Component","contextType"],"mappings":"iGAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,MAAqB,iBAArB;;AAEA,OAAO,KAAKC,YAAZ,MAA8B,wBAA9B;;AAEA,SAASC,YAAT,QAA6B,gCAA7B;;AAEA,SAASC,EAAT,QAAmB,2BAAnB;AACA,SAASC,WAAT,EAAsBC,QAAtB,QAAoD,oBAApD;AACA,SAASC,UAAT,QAA2B,0BAA3B;;AAEA,SAASC,MAAT,QAAuB,oBAAvB;AACA,SAASC,WAAT,QAA6C,eAA7C;;AAEA,SAASC,YAAT,QAA6B,QAA7B;;;;;;;;;;;;;;;AAeA,WAAaC,SAAb,GADCL,QACD;;AAESM,IAAAA,OAFT,GAEoC,MAAKA,OAFzC;;AAISC,IAAAA,KAJT,GAIiC;AAC7BL,MAAAA,MAAM,EAAE,EADqB,EAJjC;;;;;AAUUM,IAAAA,aAVV;;AAYO,QAZP;;AAcUC,IAAAA,wBAdV,GAc2D,IAd3D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4EUC,IAAAA,MA5EV,GA4EmBf,QAAQ,CAAC,YAAM;AAC9B,0BAA8B,MAAKW,OAAnC,CAAQK,MAAR,iBAAQA,MAAR,CAAgBC,SAAhB,iBAAgBA,SAAhB;AACA,UAAMC,IAAI,GAAGF,MAAM,CAACC,SAAD,CAAnB;AACA,UAAME,UAAU,GAAG,MAAKC,SAAL,CAAeF,IAAf,CAAnB;AACA,UAAMG,aAAa,GAAG,CAAC,MAAD,EAAS,KAAT,EAAgB,OAAhB,EAAyB,QAAzB,EAAmCC,IAAnC;AACpB,gBAACC,IAAD,UAAUJ,UAAU,CAACI,IAAD,CAAV,KAAkD,MAAKX,KAAL,CAAWL,MAAX,CAAkBgB,IAAlB,CAA5D,EADoB,CAAtB;;AAGA,UAAIF,aAAJ,EAAmB;AACjB,cAAKG,QAAL,CAAc,EAAEjB,MAAM,EAAEY,UAAV,EAAd;AACD;AACF,KAVwB,EAUtB,GAVsB,CA5E3B,uDAiBSM,iBAjBT,GAiBE,6BAA2B,CACzB,KAAKZ,aAAL,GAAqBZ,YAAY,CAACyB,WAAb,CAAyB,KAAKX,MAA9B,CAArB,CACA,KAAKD,wBAAL,GAAgC,KAAKa,KAAL,CAAWC,UAAX,CAAsBC,EAAtB,CAAyB,KAAKd,MAA9B,CAAhC,CACA,KAAKA,MAAL,GACD,CArBH,QAuBSe,oBAvBT,GAuBE,gCAA8B,CAC5B,KAAKf,MAAL,CAAYgB,MAAZ,GAEA,IAAI,KAAKlB,aAAT,EAAwB,CACtB,KAAKA,aAAL,CAAmBmB,MAAnB,GACD,CACD,IAAI,KAAKlB,wBAAT,EAAmC,CACjC,KAAKA,wBAAL,GACD,CACF,CAhCH,QAkCSmB,kBAlCT,GAkCE,8BAA4B,CAC1B,KAAKlB,MAAL,GACD,CApCH,QAsCSmB,MAtCT,GAsCE,kBAAgB,mBACd,oBACE,oBAAC,YAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,OAAO,MAAI,CAACC,UAAL,EAAP,CACD,CAJH,CADF,CAQD,CA/CH,QAiDUA,UAjDV,GAiDE,sBAAqB,CACnB,qBAA8B,KAAKzB,OAAnC,CAAQK,MAAR,kBAAQA,MAAR,CAAgBC,SAAhB,kBAAgBA,SAAhB,CACA,IAAMC,IAAI,GAAGF,MAAM,CAACC,SAAD,CAAnB,CACA,IAAMoB,UAAyB,GAAInB,IAAI,IAAIA,IAAI,CAACoB,aAAb,IAA8BpB,IAAI,CAACoB,aAAL,EAA/B,IAAwD,EACxFC,KAAK,EAAE,KADiF,EAExFC,OAAO,EAAE,KAF+E,EAGxFC,OAAO,EAAE,KAH+E,EAIxFC,OAAO,EAAE,KAJ+E,EAKxFC,QAAQ,EAAE,KAL8E,EAA1F,CAOA,oBACE,6BACE,YAAUlC,YAAY,CAACmC,aADzB,EAEE,SAAS,EAAEzC,EAAE,CACXI,MAAM,CAACsC,IAAP,CAAY,KAAKV,KAAjB,CADW,EAEXE,UAAU,CAACK,OAAX,IAAsBnC,MAAM,CAACmC,OAAP,CAAe,KAAKP,KAApB,CAFX,EAGXE,UAAU,CAACI,OAAX,IAAsBlC,MAAM,CAACkC,OAAP,CAAe,KAAKN,KAApB,CAHX,EAIXE,UAAU,CAACG,OAAX,IAAsBjC,MAAM,CAACiC,OAAP,CAAe,KAAKL,KAApB,CAJX,EAKXE,UAAU,CAACE,KAAX,IAAoBhC,MAAM,CAACgC,KAAP,CAAa,KAAKJ,KAAlB,CALT,EAMX,KAAKR,KAAL,CAAWmB,SANA,CAFf,EAUE,KAAK,EAAE,KAAKlC,KAAL,CAAWL,MAVpB,EAWE,GAAG,EAAE,KAAKwC,WAXZ,GADF,CAeD,CA1EH;;AAwFU3B,EAAAA,SAxFV,GAwFE,mBAAkBF,IAAlB,EAAkD;AAChD,QAAM8B,QAAQ,GAAG5C,WAAW,CAACc,IAAD,CAA5B;;AAEA,QAAI8B,QAAQ,IAAIA,QAAQ,YAAYC,WAApC,EAAiD;AAC/C,UAAMC,IAAI,GAAG5C,UAAU,CAAC0C,QAAD,CAAvB;AACA,UAAI,KAAKrB,KAAL,CAAWwB,QAAf,EAAyB;AACvB,eAAO;AACLC,UAAAA,KAAK,EAAE,KAAKjB,KAAL,CAAWkB,cADb;AAELC,UAAAA,IAAI,EAAEN,QAAQ,CAACO,UAFV;AAGLC,UAAAA,GAAG,EAAER,QAAQ,CAACS,SAHT;AAILC,UAAAA,MAAM,EAAER,IAAI,CAACS,MAAL,GAAcT,IAAI,CAACM,GAJtB,EAAP;;AAMD;;AAED,UAAMH,cAAc,GAAGO,QAAQ,CAAC,KAAKzB,KAAL,CAAWkB,cAAZ,EAA4B,EAA5B,CAAR,IAA2C,CAAlE;AACA,aAAO;AACLC,QAAAA,IAAI,EAAEN,QAAQ,CAACO,UADV;AAELC,QAAAA,GAAG,EAAER,QAAQ,CAACa,YAAT,GAAwBb,QAAQ,CAACS,SAAjC,GAA6CJ,cAF7C;AAGLD,QAAAA,KAAK,EAAEF,IAAI,CAACY,KAAL,GAAaZ,IAAI,CAACI,IAHpB,EAAP;;AAKD;;AAED,WAAO,EAAP;AACD,GA/GH,oBAA+BvD,KAAK,CAACgE,SAArC,WACgBC,WADhB,GAC8BxD,WAD9B","sourcesContent":["import React from 'react';\nimport throttle from 'lodash.throttle';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { cx } from '../../lib/theming/Emotion';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { styles } from './Indicator.styles';\nimport { TabsContext, TabsContextType } from './TabsContext';\nimport { TabIndicators } from './Tab';\nimport { TabsDataTids } from './Tabs';\n\nexport interface IndicatorProps {\n  className?: string;\n  tabUpdates: {\n    on: (x0: () => void) => () => void;\n  };\n  vertical: boolean;\n}\n\nexport interface IndicatorState {\n  styles: React.CSSProperties;\n}\n\n@rootNode\nexport class Indicator extends React.Component<IndicatorProps, IndicatorState> {\n  public static contextType = TabsContext;\n  public context: TabsContextType = this.context;\n\n  public state: IndicatorState = {\n    styles: {},\n  };\n\n  private theme!: Theme;\n\n  private eventListener: Nullable<{\n    remove: () => void;\n  }> = null;\n\n  private removeTabUpdatesListener: Nullable<() => void> = null;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidMount() {\n    this.eventListener = LayoutEvents.addListener(this.reflow);\n    this.removeTabUpdatesListener = this.props.tabUpdates.on(this.reflow);\n    this.reflow();\n  }\n\n  public componentWillUnmount() {\n    this.reflow.cancel();\n\n    if (this.eventListener) {\n      this.eventListener.remove();\n    }\n    if (this.removeTabUpdatesListener) {\n      this.removeTabUpdatesListener();\n    }\n  }\n\n  public componentDidUpdate() {\n    this.reflow();\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    const { getTab, activeTab } = this.context;\n    const node = getTab(activeTab);\n    const indicators: TabIndicators = (node && node.getIndicators && node.getIndicators()) || {\n      error: false,\n      warning: false,\n      success: false,\n      primary: false,\n      disabled: false,\n    };\n    return (\n      <div\n        data-tid={TabsDataTids.indicatorRoot}\n        className={cx(\n          styles.root(this.theme),\n          indicators.primary && styles.primary(this.theme),\n          indicators.success && styles.success(this.theme),\n          indicators.warning && styles.warning(this.theme),\n          indicators.error && styles.error(this.theme),\n          this.props.className,\n        )}\n        style={this.state.styles}\n        ref={this.setRootNode}\n      />\n    );\n  }\n\n  private reflow = throttle(() => {\n    const { getTab, activeTab } = this.context;\n    const node = getTab(activeTab);\n    const nodeStyles = this.getStyles(node);\n    const stylesUpdated = ['left', 'top', 'width', 'height'].some(\n      (prop) => nodeStyles[prop as keyof React.CSSProperties] !== this.state.styles[prop as keyof React.CSSProperties],\n    );\n    if (stylesUpdated) {\n      this.setState({ styles: nodeStyles });\n    }\n  }, 100);\n\n  private getStyles(node: any): React.CSSProperties {\n    const htmlNode = getRootNode(node);\n\n    if (htmlNode && htmlNode instanceof HTMLElement) {\n      const rect = getDOMRect(htmlNode);\n      if (this.props.vertical) {\n        return {\n          width: this.theme.tabBorderWidth,\n          left: htmlNode.offsetLeft,\n          top: htmlNode.offsetTop,\n          height: rect.bottom - rect.top,\n        };\n      }\n\n      const tabBorderWidth = parseInt(this.theme.tabBorderWidth, 10) || 0;\n      return {\n        left: htmlNode.offsetLeft,\n        top: htmlNode.offsetHeight + htmlNode.offsetTop - tabBorderWidth,\n        width: rect.right - rect.left,\n      };\n    }\n\n    return {};\n  }\n}\n"]}

package/components/Tabs/Indicator.d.ts

@@ -20,7 +20,7 @@ export declare class Indicator extends React.Component<IndicatorProps, Indicator
     private setRootNode;
     componentDidMount(): void;
     componentWillUnmount(): void;
-    componentDidUpdate(_: IndicatorProps, prevState: IndicatorState): void;
+    componentDidUpdate(): void;
     render(): JSX.Element;
     private renderMain;
     private reflow;

package/components/Tabs/Tab/Tab.js

@@ -15,6 +15,7 @@ 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 = {
@@ -44,6 +45,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
     };
@@ -54,7 +56,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) {
@@ -71,7 +73,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);
@@ -85,7 +91,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();
       }
     };
@@ -201,10 +207,12 @@ var Tab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Com
         error = _this$props.error,
         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;
+        primary = _this$props.primary;
+
+    var _this$getProps2 = this.getProps(),
+        Component = _this$getProps2.component,
+        href = _this$getProps2.href;
+
     var isActive = false;
     var isVertical = false;
     var id = this.getId();

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

@@ -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","TabDataTids","root","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","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 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\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          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        >\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"]}
+{"version":3,"sources":["Tab.tsx"],"names":["React","PropTypes","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","Component","isActive","isVertical","vertical","orientationStyles","setRootNode","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';\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\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 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: 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 } = 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        >\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

@@ -66,6 +66,7 @@ export interface TabProps<T extends string = string> extends CommonProps {
 export interface TabState {
     focusedByKeyboard: boolean;
 }
+declare type DefaultProps = Required<Pick<TabProps, 'component' | 'href'>>;
 /**
  * Tab element of Tabs component
  *
@@ -92,10 +93,8 @@ export declare class Tab<T extends string = string> extends React.Component<TabP
         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;
@@ -122,3 +121,4 @@ export declare class Tab<T extends string = string> extends React.Component<TabP
     private handleFocus;
     private handleBlur;
 }
+export {};

package/components/Tabs/Tabs/Tabs.js

@@ -11,6 +11,7 @@ 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";
@@ -19,13 +20,13 @@ export var TabsDataTids = {
   root: 'Tabs__root',
   indicatorRoot: 'Indicator__root'
 };
+export
 /**
- * Tabs wrapper
- *
- * contains static property `Tab`
- */
-
-export var Tabs = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
+* Tabs wrapper
+*
+* contains static property `Tab`
+*/
+var Tabs = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(Tabs, _React$Component);
 
   function Tabs() {
@@ -36,6 +37,7 @@ export var Tabs = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_R
     }
 
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(Tabs.defaultProps);
     _this.tabs = [];
     _this.tabUpdates = {
       on: function on(cb) {
@@ -113,11 +115,11 @@ export var Tabs = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_R
     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;
+    var vertical = this.getProps().vertical;
     return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
       _this2.theme = theme;
       return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
@@ -142,7 +144,7 @@ export var Tabs = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_R
       }, children, /*#__PURE__*/React.createElement(Indicator, {
         className: indicatorClassName,
         tabUpdates: _this2.tabUpdates,
-        vertical: vertical
+        vertical: _this2.getProps().vertical
       }))));
     });
   };

package/components/Tabs/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Tabs.tsx"],"names":["React","PropTypes","ThemeContext","CommonWrapper","cx","getRootNode","rootNode","Indicator","styles","TabsContext","Tab","TabsDataTids","root","indicatorRoot","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","activeTab","Component","__KONTUR_REACT_UI__","propTypes","node","string","isRequired","bool","oneOfType","number","defaultProps"],"mappings":"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","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\nexport const TabsDataTids = {\n  root: 'Tabs__root',\n  indicatorRoot: 'Indicator__root',\n} as const;\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\n                data-tid={TabsDataTids.root}\n                className={cx(styles.root(this.theme), vertical && styles.vertical())}\n                style={{ width }}\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 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"]}
+{"version":3,"sources":["Tabs.tsx"],"names":["React","PropTypes","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","vertical","theme","setRootNode","activeTab","Component","__KONTUR_REACT_UI__","propTypes","node","string","isRequired","bool","oneOfType","number"],"mappings":"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","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';\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\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 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: 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 } = 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              >\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

@@ -24,7 +24,7 @@ export interface TabsProps<T extends ValueBaseType = string> extends CommonProps
      * Vertical indicator
      * @default false
      */
-    vertical: boolean;
+    vertical?: boolean;
     /**
      * Width of tabs container
      */
@@ -34,6 +34,7 @@ export declare const TabsDataTids: {
     readonly root: "Tabs__root";
     readonly indicatorRoot: "Indicator__root";
 };
+declare type DefaultProps = Required<Pick<TabsProps, 'vertical'>>;
 /**
  * Tabs wrapper
  *
@@ -48,9 +49,8 @@ export declare class Tabs<T extends string = string> extends React.Component<Tab
         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

@@ -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,6 +23,7 @@ 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";
@@ -29,15 +33,15 @@ export var TextareaDataTids = {
   root: 'Textarea__root',
   counter: 'TextareaCounter__root'
 };
+export
 /**
- * Компонент для ввода многострочного текста.
- *
- * Принимает все атрибуты `React.TextareaHTMLAttributes<HTMLTextAreaElement>`
- *
- * ** `className` и `style`  игнорируются**
- */
-
-export var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
+* Компонент для ввода многострочного текста.
+*
+* Принимает все атрибуты `React.TextareaHTMLAttributes<HTMLTextAreaElement>`
+*
+* ** `className` и `style`  игнорируются**
+*/
+var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(Textarea, _React$Component);
 
   function Textarea() {
@@ -48,6 +52,7 @@ export var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
     }
 
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(Textarea.defaultProps);
     _this.state = {
       needsPolyfillPlaceholder: needsPolyfillPlaceholder,
       isCounterVisible: false
@@ -256,10 +261,9 @@ export var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
         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;
@@ -269,7 +273,7 @@ export var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
         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;
@@ -374,7 +378,11 @@ export var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
       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();
     }
   };