@skbkontur/react-ui 0.0.0-7dc91ef93e → 0.0.0-7f260475fb

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

@@ -1 +0,0 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_invariant","_globalObject","_ResizeDetector","_identifiers","_keyListener","_utils","_ThemeContext","_CommonWrapper","_Emotion","_rootNode","_createPropsGetter","_getVisualStateDataAttributes","_TabsContext","_Tab2","_class","_Tab","TabDataTids","exports","root","Tab","rootNode","_React$Component","props","_this","call","context","getProps","createPropsGetter","defaultProps","state","focusedByKeyboard","tabComponent","getUnderlyingNode","getId","id","href","refTabComponent","instance","getTabInstance","switchTab","event","disabled","preventDefault","_this$getProps","component","onClick","defaultPrevented","handleKeyDown","e","onKeyDown","isKeyArrow","delta","isKeyArrowLeft","isKeyArrowUp","shiftFocus","handleFocus","globalObject","requestAnimationFrame","keyListener","isTabPressed","isArrowPressed","setState","handleBlur","invariant","TabsContextDefaultValue","_inheritsLoose2","default","_proto","prototype","componentDidMount","addTab","componentDidUpdate","activeTab","notifyUpdate","componentWillUnmount","removeTab","render","_this2","createElement","ThemeContext","Consumer","theme","renderMain","getIndicators","error","Boolean","warning","success","primary","_cx","_cx2","_this$props","children","ariaDescribedby","ariaLabel","_this$getProps2","Component","isActive","isVertical","vertical","orientationStyles","verticalStyles","horizontalStyles","CommonWrapper","_extends2","rootNodeRef","setRootNode","getVisualStateDataAttributes","active","className","cx","styles","rootSmall","size","rootMedium","rootLarge","verticalSmall","verticalMedium","verticalLarge","onBlur","onFocus","tabIndex","ref","isFunctionalComponent","ResizeDetector","onResize","globalClasses","focus","focusSmall","focusMedium","focusLarge","React","__KONTUR_REACT_UI__","displayName","contextType","TabsContext"],"sources":["Tab.tsx"],"sourcesContent":["import React, { AriaAttributes } from 'react';\nimport invariant from 'invariant';\nimport { globalObject } from '@skbkontur/global-object';\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';\nimport { getVisualStateDataAttributes } from '../../internal/CommonWrapper/utils/getVisualStateDataAttributes';\n\nimport { TabsContext, TabsContextDefaultValue, TabsContextType } from './TabsContext';\nimport { globalClasses, horizontalStyles, styles, verticalStyles } 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>\n  extends Pick<AriaAttributes, 'aria-label' | 'aria-describedby'>,\n    CommonProps {\n  /** Позволяет передавать свой компонент, строку или функцию, которая заменит собой элемент используемый в компоненте по умолчанию.\n   * Реализует паттерн [render prop](https://www.patterns.dev/posts/render-props-pattern). */\n  component?: React.ComponentType<any> | string;\n\n  /** Задает HTML-атрибут `href` - адрес, на который следует перейти. */\n  href?: string;\n\n  /** Задает уникальный идентификатор таба. По нему компонент `<Tabs />` определяет какой `<Tab />` сейчас выбран. */\n  id?: T;\n\n  /**`HTML`-событие `onclick`. */\n  onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n\n  /** `HTML`-событие `onkeydown`. */\n  onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n\n  /** Делает компонент недоступным. */\n  disabled?: boolean;\n\n  /** Переводит контрол в состояние валидации \"ошибка\". */\n  error?: boolean;\n\n  /** Переводит контрол в состояние валидации \"предупреждение\". */\n  warning?: boolean;\n\n  /** Устанавливает визульное состояние валидации \"успех\". */\n  success?: boolean;\n\n  /** Задает визульное состояние главного элемента. */\n  primary?: boolean;\n}\n\nexport interface TabState {\n  focusedByKeyboard: boolean;\n}\n\ntype DefaultProps = Required<Pick<TabProps, 'component' | 'href'>>;\n\n/**\n * Вложенный элемент компонента Tabs.\n */\n@rootNode\nexport class Tab<T extends string = string> extends React.Component<TabProps<T>, TabState> {\n  public static __KONTUR_REACT_UI__ = 'Tab';\n  public static displayName = 'Tab';\n\n  public static contextType = TabsContext;\n  public context: TabsContextType = this.context;\n\n  public static defaultProps: DefaultProps = {\n    component: 'a',\n    href: '',\n  };\n\n  private getProps = createPropsGetter(Tab.defaultProps);\n\n  public state: TabState = {\n    focusedByKeyboard: false,\n  };\n\n  private 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      'aria-describedby': ariaDescribedby,\n      'aria-label': ariaLabel,\n    } = this.props;\n    const { component: Component, href } = this.getProps();\n\n    let isActive = false;\n    let isVertical = false;\n\n    const id = this.getId();\n    if (typeof id === 'string') {\n      isActive = this.context.activeTab === this.getId();\n      isVertical = this.context.vertical;\n    }\n    const orientationStyles = isVertical ? verticalStyles : horizontalStyles;\n\n    return (\n      <CommonWrapper\n        rootNodeRef={this.setRootNode}\n        {...getVisualStateDataAttributes({ active: isActive, disabled })}\n        {...this.props}\n      >\n        <Component\n          data-tid={TabDataTids.root}\n          className={cx({\n            [styles.rootSmall(this.theme)]: this.context.size === 'small',\n            [styles.rootMedium(this.theme)]: this.context.size === 'medium',\n            [styles.rootLarge(this.theme)]: this.context.size === 'large',\n            [styles.verticalSmall(this.theme)]: !!isVertical && this.context.size === 'small',\n            [styles.verticalMedium(this.theme)]: !!isVertical && this.context.size === 'medium',\n            [styles.verticalLarge(this.theme)]: !!isVertical && this.context.size === 'large',\n            [orientationStyles.primary(this.theme)]: !!primary,\n            [orientationStyles.success(this.theme)]: !!success,\n            [orientationStyles.warning(this.theme)]: !!warning,\n            [orientationStyles.error(this.theme)]: !!error,\n            [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          aria-label={ariaLabel}\n        >\n          <ResizeDetector onResize={this.context.notifyUpdate}>{children}</ResizeDetector>\n          {this.state.focusedByKeyboard && (\n            <div\n              className={cx(globalClasses.focus, {\n                [styles.focusSmall(this.theme)]: this.context.size === 'small',\n                [styles.focusMedium(this.theme)]: this.context.size === 'medium',\n                [styles.focusLarge(this.theme)]: this.context.size === 'large',\n              })}\n            />\n          )}\n        </Component>\n      </CommonWrapper>\n    );\n  }\n\n  private getId = () => this.props.id || this.getProps().href;\n\n  private refTabComponent = (instance: React.ReactElement<any>) => {\n    this.tabComponent = instance;\n  };\n\n  private getTabInstance = () => this;\n\n  private switchTab = (event: React.MouseEvent<HTMLElement>) => {\n    if (this.props.disabled) {\n      event.preventDefault();\n      return;\n    }\n    const { href, component } = this.getProps();\n\n    const id = this.props.id || href;\n    if (this.props.onClick) {\n      this.props.onClick(event);\n      if (event.defaultPrevented) {\n        return;\n      }\n    }\n    if (typeof id === 'string') {\n      this.context.switchTab(id);\n    }\n    if (component === 'a' && !href) {\n      event.preventDefault();\n    }\n  };\n\n  private handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n    if (this.props.disabled) {\n      return;\n    }\n\n    if (this.props.onKeyDown) {\n      this.props.onKeyDown(e);\n      if (e.defaultPrevented) {\n        return;\n      }\n    }\n    const id = this.getId();\n    if (typeof id !== 'string') {\n      return;\n    }\n    if (!isKeyArrow(e)) {\n      return;\n    }\n    e.preventDefault();\n    const delta = isKeyArrowLeft(e) || isKeyArrowUp(e) ? -1 : 1;\n    this.context.shiftFocus(id, delta);\n  };\n\n  private handleFocus = () => {\n    if (this.props.disabled) {\n      return;\n    }\n\n    // focus event fires before keyDown eventlistener\n    // so we should check focusKeyPressed in async way\n    globalObject.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"],"mappings":"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","ignoreList":[]}

package/cjs/components/Tabs/Tab.md

@@ -1,73 +0,0 @@
-У компонента `<Tabs.Tab />` есть несколько визуальных состояний, в которых компонент может находиться: `primary`, `success`, `warning` и `error`. Чтобы перевести контрол в нужное состояние передайте компоненту булевый проп с соответсвующим названием.
-
-### Кастомизация
-Используя переменные `tabColorPrimary`, `tabColorSuccess`, `tabColorWarning` и `tabColorError` можно изменить активный цвет состояния, а библиотека автоматически подберёт цвет подчёркивания при наведении.
-```jsx harmony
-import { ThemeContext, ThemeFactory, Button, Tabs } from '@skbkontur/react-ui';
-
-const getRandomColor = () => '#' + Math.random().toString(16).substr(-6);
-const updateColors = () => {
-  return {
-    tabColorPrimary: getRandomColor(),
-    tabColorSuccess: getRandomColor(),
-    tabColorWarning: getRandomColor(),
-    tabColorError: getRandomColor(),
-  }
-};
-
-const [activeBase, setActiveBase] = React.useState('error');
-const [activeRandom, setActiveRandom] = React.useState('error');
-const [colors, setColors] = React.useState(updateColors());
-
-<>
-  <p style={{ fontSize: '17px' }}>C цветами по умолчанию</p>
-  <Tabs value={activeBase} onValueChange={setActiveBase}>
-    <Tabs.Tab primary id="primary">Primary</Tabs.Tab>
-    <Tabs.Tab success id="success">Success</Tabs.Tab>
-    <Tabs.Tab warning id="warning">Warning</Tabs.Tab>
-    <Tabs.Tab error id="error">Error</Tabs.Tab>
-  </Tabs>
-
-  <p style={{ fontSize: '17px' }}>Со случайным основным цветом</p>
-  <div style={{ display: 'inline-flex', flexDirection: 'column', justifyContent: 'space-between', height: '100px' }}>
-    <ThemeContext.Consumer>
-      {(theme) => {
-        return (
-          <ThemeContext.Provider
-            value={ThemeFactory.create(colors,theme)}
-          >
-            <Tabs value={activeRandom} onValueChange={setActiveRandom}>
-            <Tabs.Tab primary id="primary">Primary</Tabs.Tab>
-            <Tabs.Tab success id="success">Success</Tabs.Tab>
-            <Tabs.Tab warning id="warning">Warning</Tabs.Tab>
-            <Tabs.Tab error id="error">Error</Tabs.Tab>
-          </Tabs>
-          </ThemeContext.Provider>
-        );
-      }}
-    </ThemeContext.Consumer>
-    <Button onClick={() => setColors(updateColors)}>Получить новый набор цветов</Button>
-  </div>
-</>
-```
-
-### Изменение корневого компонента Tab
-С помощью пропа `component` можно изменять корневой элемент `<Tab />`.
-
-Проп может принимать: компоненты, функции и строки.
-```jsx harmony
-import { Tabs } from '@skbkontur/react-ui';
-
-const [active, setActive] = React.useState('/fuji');
-
-const NavLink = props => <a {...props} />;
-
-<Tabs value={active} onValueChange={setActive}>
-  {/** Кастомный компонент **/}
-  <Tabs.Tab  component={(props) => <NavLink {...props} />} id="/fuji">🌋 Fuji</Tabs.Tab>
-  {/** Функция **/}
-  <Tabs.Tab component={(props) => <a {...props} />} id="/tahat">⛰ Tahat</Tabs.Tab>
-  {/** Строка **/}
-  <Tabs.Tab component="a" id="/alps">🗻 Alps</Tabs.Tab>
-</Tabs>;
-```

package/cjs/components/Tabs/Tab.styles.d.ts

@@ -1,33 +0,0 @@
-import { Theme } from '../../lib/theming/Theme';
-export declare const globalClasses: {
-    focus: string;
-};
-export declare const styles: {
-    rootSmall(t: Theme): string;
-    rootMedium(t: Theme): string;
-    rootLarge(t: Theme): string;
-    verticalSmall(t: Theme): string;
-    verticalMedium(t: Theme): string;
-    verticalLarge(t: Theme): string;
-    focusSmall(t: Theme): string;
-    focusMedium(t: Theme): string;
-    focusLarge(t: Theme): string;
-    disabled(t: Theme): string;
-    active(): string;
-};
-export declare const horizontalStyles: {
-    active(t: Theme): string;
-    disabled(): string;
-    primary(t: Theme): string;
-    success(t: Theme): string;
-    warning(t: Theme): string;
-    error(t: Theme): string;
-};
-export declare const verticalStyles: {
-    active(t: Theme): string;
-    disabled(): string;
-    primary(t: Theme): string;
-    success(t: Theme): string;
-    warning(t: Theme): string;
-    error(t: Theme): string;
-};

package/cjs/components/Tabs/Tab.styles.js

@@ -1,229 +0,0 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.verticalStyles = exports.styles = exports.horizontalStyles = exports.globalClasses = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");
-var _DimensionFunctions = require("../../lib/styles/DimensionFunctions");
-var ColorFunctions = _interopRequireWildcard(require("../../lib/styles/ColorFunctions"));
-
-
-
-var _helpers = require("./helpers");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
-
-var globalClasses = exports.globalClasses = (0, _Emotion.prefix)('tab')({
-  focus: 'focus'
-});
-
-var styles = exports.styles = (0, _Emotion.memoizeStyle)({
-  rootSmall: function rootSmall(t) {
-    return tabRoot(t, 'small');
-  },
-
-  rootMedium: function rootMedium(t) {
-    return tabRoot(t, 'medium');
-  },
-
-  rootLarge: function rootLarge(t) {
-    return tabRoot(t, 'large');
-  },
-
-  verticalSmall: function verticalSmall(t) {
-    return tabVertical(t, 'small');
-  },
-
-  verticalMedium: function verticalMedium(t) {
-    return tabVertical(t, 'medium');
-  },
-
-  verticalLarge: function verticalLarge(t) {
-    return tabVertical(t, 'large');
-  },
-
-  focusSmall: function focusSmall(t) {
-    return tabFocus(t, 'small');
-  },
-
-  focusMedium: function focusMedium(t) {
-    return tabFocus(t, 'medium');
-  },
-
-  focusLarge: function focusLarge(t) {
-    return tabFocus(t, 'large');
-  },
-
-  disabled: function disabled(t) {
-    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: rgba(\n        ", ",\n        ", ",\n        ", ",\n        0.5\n      );\n      cursor: default;\n    "])),
-
-    ColorFunctions.red(t.tabTextColorDefault),
-    ColorFunctions.green(t.tabTextColorDefault),
-    ColorFunctions.blue(t.tabTextColorDefault));
-
-
-
-
-  },
-
-  active: function active() {
-    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      cursor: default;\n    "])));
-
-
-  }
-});
-
-var horizontalStyles = exports.horizontalStyles = (0, _Emotion.memoizeStyle)({
-  active: function active(t) {
-    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-bottom: ", " solid transparent;\n      }\n    "])),
-
-    t.tabBorderWidth);
-
-
-  },
-
-  disabled: function disabled() {
-    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-bottom-color: transparent;\n      }\n    "])));
-
-
-
-
-  },
-
-  primary: function primary(t) {
-    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-bottom-color: ", ";\n      }\n    "])),
-
-    t.tabColorHoverPrimary);
-
-
-  },
-
-  success: function success(t) {
-    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-bottom-color: ", ";\n      }\n    "])),
-
-    t.tabColorHoverSuccess);
-
-
-  },
-
-  warning: function warning(t) {
-    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-bottom-color: ", ";\n      }\n    "])),
-
-    t.tabColorHoverWarning);
-
-
-  },
-
-  error: function error(t) {
-    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-bottom-color: ", ";\n      }\n    "])),
-
-    t.tabColorHoverError);
-
-
-  }
-});
-
-var verticalStyles = exports.verticalStyles = (0, _Emotion.memoizeStyle)({
-  active: function active(t) {
-    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-left: ", " solid transparent;\n      }\n    "])),
-
-    t.tabBorderWidth);
-
-
-  },
-
-  disabled: function disabled() {
-    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-left-color: transparent;\n      }\n    "])));
-
-
-
-
-  },
-
-  primary: function primary(t) {
-    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-left-color: ", ";\n      }\n    "])),
-
-    t.tabColorHoverPrimary);
-
-
-  },
-
-  success: function success(t) {
-    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-left-color: ", ";\n      }\n    "])),
-
-    t.tabColorHoverSuccess);
-
-
-  },
-
-  warning: function warning(t) {
-    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-left-color: ", ";\n      }\n    "])),
-
-    t.tabColorHoverWarning);
-
-
-  },
-
-  error: function error(t) {
-    return (0, _Emotion.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-left-color: ", ";\n      }\n    "])),
-
-    t.tabColorHoverError);
-
-
-  }
-});
-
-function tabRoot(t, size) {
-  return (0, _Emotion.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n    border-bottom: ", " solid transparent;\n    box-sizing: border-box;\n    color: ", ";\n    cursor: pointer;\n    display: inline-block;\n    font-size: ", ";\n    line-height: ", ";\n    margin-left: ", ";\n    margin-right: ", ";\n    padding-bottom: calc(", " - ", ");\n    padding-top: ", ";\n    position: relative;\n    text-decoration: inherit;\n    transition: border-bottom ", " ", ";\n\n    &:hover {\n      outline: inherit;\n      border-bottom: ", " solid ", ";\n    }\n\n    &:focus {\n      outline: inherit;\n    }\n  "])),
-  t.tabBorderWidth,
-
-  t.tabTextColorDefault,
-
-
-  (0, _helpers.fontSize)(t, size),
-  (0, _helpers.lineHeight)(t, size),
-  (0, _helpers.paddingX)(t, size),
-  (0, _helpers.paddingX)(t, size),
-  (0, _helpers.paddingY)(t, size), t.tabBorderWidth,
-  (0, _helpers.paddingY)(t, size),
-
-
-  t.transitionDuration, t.transitionTimingFunction,
-
-
-
-  t.tabBorderWidth, t.tabColorHover);
-
-
-
-
-
-
-}
-
-function tabVertical(t, size) {
-  return (0, _Emotion.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n    border-bottom: none;\n    border-left: ", " solid transparent;\n    display: block;\n    margin-left: 0;\n    margin-right: 0;\n    padding-left: ", ";\n    padding-right: ", ";\n\n    &:hover {\n      border-bottom: none;\n      border-left: ", " solid ", ";\n    }\n\n    .", " {\n      bottom: 0;\n      left: -", ";\n      right: 0;\n    }\n  "])),
-
-  t.tabBorderWidth,
-
-
-
-  (0, _DimensionFunctions.shift)((0, _helpers.paddingX)(t, size), "-" + t.tabBorderWidth),
-  (0, _helpers.paddingX)(t, size),
-
-
-
-  t.tabBorderWidth, t.tabColorHover,
-
-
-  globalClasses.focus,
-
-  t.tabBorderWidth);
-
-
-
-}
-
-function tabFocus(t, size) {
-  return (0, _Emotion.css)(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteralLoose2.default)(["\n    border: ", " solid ", ";\n    bottom: -", ";\n    left: -", ";\n    position: absolute;\n    right: -", ";\n    top: 0;\n  "])),
-  t.tabOutlineWidth, t.tabColorFocus,
-  t.tabBorderWidth,
-  (0, _helpers.paddingX)(t, size),
-
-  (0, _helpers.paddingX)(t, size));
-
-
-}

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

@@ -1 +0,0 @@
-{"version":3,"names":["_Emotion","require","_DimensionFunctions","ColorFunctions","_interopRequireWildcard","_helpers","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_templateObject12","_templateObject13","_templateObject14","_templateObject15","_templateObject16","_templateObject17","globalClasses","exports","prefix","focus","styles","memoizeStyle","rootSmall","t","tabRoot","rootMedium","rootLarge","verticalSmall","tabVertical","verticalMedium","verticalLarge","focusSmall","tabFocus","focusMedium","focusLarge","disabled","css","_taggedTemplateLiteralLoose2","default","red","tabTextColorDefault","green","blue","active","horizontalStyles","tabBorderWidth","primary","tabColorHoverPrimary","success","tabColorHoverSuccess","warning","tabColorHoverWarning","error","tabColorHoverError","verticalStyles","size","fontSize","lineHeight","paddingX","paddingY","transitionDuration","transitionTimingFunction","tabColorHover","shift","tabOutlineWidth","tabColorFocus"],"sources":["Tab.styles.ts"],"sourcesContent":["import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { shift } from '../../lib/styles/DimensionFunctions';\nimport * as ColorFunctions from '../../lib/styles/ColorFunctions';\nimport { Theme } from '../../lib/theming/Theme';\nimport { SizeProp } from '../../lib/types/props';\n\nimport { fontSize, lineHeight, paddingX, paddingY } from './helpers';\n\nexport const globalClasses = prefix('tab')({\n  focus: 'focus',\n});\n\nexport const styles = memoizeStyle({\n  rootSmall(t: Theme) {\n    return tabRoot(t, 'small');\n  },\n\n  rootMedium(t: Theme) {\n    return tabRoot(t, 'medium');\n  },\n\n  rootLarge(t: Theme) {\n    return tabRoot(t, 'large');\n  },\n\n  verticalSmall(t: Theme) {\n    return tabVertical(t, 'small');\n  },\n\n  verticalMedium(t: Theme) {\n    return tabVertical(t, 'medium');\n  },\n\n  verticalLarge(t: Theme) {\n    return tabVertical(t, 'large');\n  },\n\n  focusSmall(t: Theme) {\n    return tabFocus(t, 'small');\n  },\n\n  focusMedium(t: Theme) {\n    return tabFocus(t, 'medium');\n  },\n\n  focusLarge(t: Theme) {\n    return tabFocus(t, 'large');\n  },\n\n  disabled(t: Theme) {\n    return css`\n      color: rgba(\n        ${ColorFunctions.red(t.tabTextColorDefault)},\n        ${ColorFunctions.green(t.tabTextColorDefault)},\n        ${ColorFunctions.blue(t.tabTextColorDefault)},\n        0.5\n      );\n      cursor: default;\n    `;\n  },\n\n  active() {\n    return css`\n      cursor: default;\n    `;\n  },\n});\n\nexport const horizontalStyles = memoizeStyle({\n  active(t: Theme) {\n    return css`\n      &:hover {\n        border-bottom: ${t.tabBorderWidth} solid transparent;\n      }\n    `;\n  },\n\n  disabled() {\n    return css`\n      &:hover {\n        border-bottom-color: transparent;\n      }\n    `;\n  },\n\n  primary(t: Theme) {\n    return css`\n      &:hover {\n        border-bottom-color: ${t.tabColorHoverPrimary};\n      }\n    `;\n  },\n\n  success(t: Theme) {\n    return css`\n      &:hover {\n        border-bottom-color: ${t.tabColorHoverSuccess};\n      }\n    `;\n  },\n\n  warning(t: Theme) {\n    return css`\n      &:hover {\n        border-bottom-color: ${t.tabColorHoverWarning};\n      }\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      &:hover {\n        border-bottom-color: ${t.tabColorHoverError};\n      }\n    `;\n  },\n});\n\nexport const verticalStyles = memoizeStyle({\n  active(t: Theme) {\n    return css`\n      &:hover {\n        border-left: ${t.tabBorderWidth} solid transparent;\n      }\n    `;\n  },\n\n  disabled() {\n    return css`\n      &:hover {\n        border-left-color: transparent;\n      }\n    `;\n  },\n\n  primary(t: Theme) {\n    return css`\n      &:hover {\n        border-left-color: ${t.tabColorHoverPrimary};\n      }\n    `;\n  },\n\n  success(t: Theme) {\n    return css`\n      &:hover {\n        border-left-color: ${t.tabColorHoverSuccess};\n      }\n    `;\n  },\n\n  warning(t: Theme) {\n    return css`\n      &:hover {\n        border-left-color: ${t.tabColorHoverWarning};\n      }\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      &:hover {\n        border-left-color: ${t.tabColorHoverError};\n      }\n    `;\n  },\n});\n\nfunction tabRoot(t: Theme, size: SizeProp) {\n  return css`\n    border-bottom: ${t.tabBorderWidth} solid transparent;\n    box-sizing: border-box;\n    color: ${t.tabTextColorDefault};\n    cursor: pointer;\n    display: inline-block;\n    font-size: ${fontSize(t, size)};\n    line-height: ${lineHeight(t, size)};\n    margin-left: ${paddingX(t, size)};\n    margin-right: ${paddingX(t, size)};\n    padding-bottom: calc(${paddingY(t, size)} - ${t.tabBorderWidth});\n    padding-top: ${paddingY(t, size)};\n    position: relative;\n    text-decoration: inherit;\n    transition: border-bottom ${t.transitionDuration} ${t.transitionTimingFunction};\n\n    &:hover {\n      outline: inherit;\n      border-bottom: ${t.tabBorderWidth} solid ${t.tabColorHover};\n    }\n\n    &:focus {\n      outline: inherit;\n    }\n  `;\n}\n\nfunction tabVertical(t: Theme, size: SizeProp) {\n  return css`\n    border-bottom: none;\n    border-left: ${t.tabBorderWidth} solid transparent;\n    display: block;\n    margin-left: 0;\n    margin-right: 0;\n    padding-left: ${shift(paddingX(t, size), `-${t.tabBorderWidth}`)};\n    padding-right: ${paddingX(t, size)};\n\n    &:hover {\n      border-bottom: none;\n      border-left: ${t.tabBorderWidth} solid ${t.tabColorHover};\n    }\n\n    .${globalClasses.focus} {\n      bottom: 0;\n      left: -${t.tabBorderWidth};\n      right: 0;\n    }\n  `;\n}\n\nfunction tabFocus(t: Theme, size: SizeProp) {\n  return css`\n    border: ${t.tabOutlineWidth} solid ${t.tabColorFocus};\n    bottom: -${t.tabBorderWidth};\n    left: -${paddingX(t, size)};\n    position: absolute;\n    right: -${paddingX(t, size)};\n    top: 0;\n  `;\n}\n"],"mappings":"+bAAA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,mBAAA,GAAAD,OAAA;AACA,IAAAE,cAAA,GAAAC,uBAAA,CAAAH,OAAA;;;;AAIA,IAAAI,QAAA,GAAAJ,OAAA,cAAqE,IAAAK,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA;;AAE9D,IAAMC,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG,IAAAE,eAAM,EAAC,KAAK,CAAC,CAAC;EACzCC,KAAK,EAAE;AACT,CAAC,CAAC;;AAEK,IAAMC,MAAM,GAAAH,OAAA,CAAAG,MAAA,GAAG,IAAAC,qBAAY,EAAC;EACjCC,SAAS,WAAAA,UAACC,CAAQ,EAAE;IAClB,OAAOC,OAAO,CAACD,CAAC,EAAE,OAAO,CAAC;EAC5B,CAAC;;EAEDE,UAAU,WAAAA,WAACF,CAAQ,EAAE;IACnB,OAAOC,OAAO,CAACD,CAAC,EAAE,QAAQ,CAAC;EAC7B,CAAC;;EAEDG,SAAS,WAAAA,UAACH,CAAQ,EAAE;IAClB,OAAOC,OAAO,CAACD,CAAC,EAAE,OAAO,CAAC;EAC5B,CAAC;;EAEDI,aAAa,WAAAA,cAACJ,CAAQ,EAAE;IACtB,OAAOK,WAAW,CAACL,CAAC,EAAE,OAAO,CAAC;EAChC,CAAC;;EAEDM,cAAc,WAAAA,eAACN,CAAQ,EAAE;IACvB,OAAOK,WAAW,CAACL,CAAC,EAAE,QAAQ,CAAC;EACjC,CAAC;;EAEDO,aAAa,WAAAA,cAACP,CAAQ,EAAE;IACtB,OAAOK,WAAW,CAACL,CAAC,EAAE,OAAO,CAAC;EAChC,CAAC;;EAEDQ,UAAU,WAAAA,WAACR,CAAQ,EAAE;IACnB,OAAOS,QAAQ,CAACT,CAAC,EAAE,OAAO,CAAC;EAC7B,CAAC;;EAEDU,WAAW,WAAAA,YAACV,CAAQ,EAAE;IACpB,OAAOS,QAAQ,CAACT,CAAC,EAAE,QAAQ,CAAC;EAC9B,CAAC;;EAEDW,UAAU,WAAAA,WAACX,CAAQ,EAAE;IACnB,OAAOS,QAAQ,CAACT,CAAC,EAAE,OAAO,CAAC;EAC7B,CAAC;;EAEDY,QAAQ,WAAAA,SAACZ,CAAQ,EAAE;IACjB,WAAOa,YAAG,EAAArC,eAAA,KAAAA,eAAA,OAAAsC,4BAAA,CAAAC,OAAA;;IAEJ1C,cAAc,CAAC2C,GAAG,CAAChB,CAAC,CAACiB,mBAAmB,CAAC;IACzC5C,cAAc,CAAC6C,KAAK,CAAClB,CAAC,CAACiB,mBAAmB,CAAC;IAC3C5C,cAAc,CAAC8C,IAAI,CAACnB,CAAC,CAACiB,mBAAmB,CAAC;;;;;EAKlD,CAAC;;EAEDG,MAAM,WAAAA,OAAA,EAAG;IACP,WAAOP,YAAG,EAAApC,gBAAA,KAAAA,gBAAA,OAAAqC,4BAAA,CAAAC,OAAA;;;EAGZ;AACF,CAAC,CAAC;;AAEK,IAAMM,gBAAgB,GAAA3B,OAAA,CAAA2B,gBAAA,GAAG,IAAAvB,qBAAY,EAAC;EAC3CsB,MAAM,WAAAA,OAACpB,CAAQ,EAAE;IACf,WAAOa,YAAG,EAAAnC,gBAAA,KAAAA,gBAAA,OAAAoC,4BAAA,CAAAC,OAAA;;IAEWf,CAAC,CAACsB,cAAc;;;EAGvC,CAAC;;EAEDV,QAAQ,WAAAA,SAAA,EAAG;IACT,WAAOC,YAAG,EAAAlC,gBAAA,KAAAA,gBAAA,OAAAmC,4BAAA,CAAAC,OAAA;;;;;EAKZ,CAAC;;EAEDQ,OAAO,WAAAA,QAACvB,CAAQ,EAAE;IAChB,WAAOa,YAAG,EAAAjC,gBAAA,KAAAA,gBAAA,OAAAkC,4BAAA,CAAAC,OAAA;;IAEiBf,CAAC,CAACwB,oBAAoB;;;EAGnD,CAAC;;EAEDC,OAAO,WAAAA,QAACzB,CAAQ,EAAE;IAChB,WAAOa,YAAG,EAAAhC,gBAAA,KAAAA,gBAAA,OAAAiC,4BAAA,CAAAC,OAAA;;IAEiBf,CAAC,CAAC0B,oBAAoB;;;EAGnD,CAAC;;EAEDC,OAAO,WAAAA,QAAC3B,CAAQ,EAAE;IAChB,WAAOa,YAAG,EAAA/B,gBAAA,KAAAA,gBAAA,OAAAgC,4BAAA,CAAAC,OAAA;;IAEiBf,CAAC,CAAC4B,oBAAoB;;;EAGnD,CAAC;;EAEDC,KAAK,WAAAA,MAAC7B,CAAQ,EAAE;IACd,WAAOa,YAAG,EAAA9B,gBAAA,KAAAA,gBAAA,OAAA+B,4BAAA,CAAAC,OAAA;;IAEiBf,CAAC,CAAC8B,kBAAkB;;;EAGjD;AACF,CAAC,CAAC;;AAEK,IAAMC,cAAc,GAAArC,OAAA,CAAAqC,cAAA,GAAG,IAAAjC,qBAAY,EAAC;EACzCsB,MAAM,WAAAA,OAACpB,CAAQ,EAAE;IACf,WAAOa,YAAG,EAAA7B,gBAAA,KAAAA,gBAAA,OAAA8B,4BAAA,CAAAC,OAAA;;IAESf,CAAC,CAACsB,cAAc;;;EAGrC,CAAC;;EAEDV,QAAQ,WAAAA,SAAA,EAAG;IACT,WAAOC,YAAG,EAAA5B,iBAAA,KAAAA,iBAAA,OAAA6B,4BAAA,CAAAC,OAAA;;;;;EAKZ,CAAC;;EAEDQ,OAAO,WAAAA,QAACvB,CAAQ,EAAE;IAChB,WAAOa,YAAG,EAAA3B,iBAAA,KAAAA,iBAAA,OAAA4B,4BAAA,CAAAC,OAAA;;IAEef,CAAC,CAACwB,oBAAoB;;;EAGjD,CAAC;;EAEDC,OAAO,WAAAA,QAACzB,CAAQ,EAAE;IAChB,WAAOa,YAAG,EAAA1B,iBAAA,KAAAA,iBAAA,OAAA2B,4BAAA,CAAAC,OAAA;;IAEef,CAAC,CAAC0B,oBAAoB;;;EAGjD,CAAC;;EAEDC,OAAO,WAAAA,QAAC3B,CAAQ,EAAE;IAChB,WAAOa,YAAG,EAAAzB,iBAAA,KAAAA,iBAAA,OAAA0B,4BAAA,CAAAC,OAAA;;IAEef,CAAC,CAAC4B,oBAAoB;;;EAGjD,CAAC;;EAEDC,KAAK,WAAAA,MAAC7B,CAAQ,EAAE;IACd,WAAOa,YAAG,EAAAxB,iBAAA,KAAAA,iBAAA,OAAAyB,4BAAA,CAAAC,OAAA;;IAEef,CAAC,CAAC8B,kBAAkB;;;EAG/C;AACF,CAAC,CAAC;;AAEF,SAAS7B,OAAOA,CAACD,CAAQ,EAAEgC,IAAc,EAAE;EACzC,WAAOnB,YAAG,EAAAvB,iBAAA,KAAAA,iBAAA,OAAAwB,4BAAA,CAAAC,OAAA;EACSf,CAAC,CAACsB,cAAc;;EAExBtB,CAAC,CAACiB,mBAAmB;;;EAGjB,IAAAgB,iBAAQ,EAACjC,CAAC,EAAEgC,IAAI,CAAC;EACf,IAAAE,mBAAU,EAAClC,CAAC,EAAEgC,IAAI,CAAC;EACnB,IAAAG,iBAAQ,EAACnC,CAAC,EAAEgC,IAAI,CAAC;EAChB,IAAAG,iBAAQ,EAACnC,CAAC,EAAEgC,IAAI,CAAC;EACV,IAAAI,iBAAQ,EAACpC,CAAC,EAAEgC,IAAI,CAAC,EAAMhC,CAAC,CAACsB,cAAc;EAC/C,IAAAc,iBAAQ,EAACpC,CAAC,EAAEgC,IAAI,CAAC;;;EAGJhC,CAAC,CAACqC,kBAAkB,EAAIrC,CAAC,CAACsC,wBAAwB;;;;EAI3DtC,CAAC,CAACsB,cAAc,EAAUtB,CAAC,CAACuC,aAAa;;;;;;;AAOhE;;AAEA,SAASlC,WAAWA,CAACL,CAAQ,EAAEgC,IAAc,EAAE;EAC7C,WAAOnB,YAAG,EAAAtB,iBAAA,KAAAA,iBAAA,OAAAuB,4BAAA,CAAAC,OAAA;;EAEOf,CAAC,CAACsB,cAAc;;;;EAIf,IAAAkB,yBAAK,EAAC,IAAAL,iBAAQ,EAACnC,CAAC,EAAEgC,IAAI,CAAC,QAAMhC,CAAC,CAACsB,cAAgB,CAAC;EAC/C,IAAAa,iBAAQ,EAACnC,CAAC,EAAEgC,IAAI,CAAC;;;;EAIjBhC,CAAC,CAACsB,cAAc,EAAUtB,CAAC,CAACuC,aAAa;;;EAGvD9C,aAAa,CAACG,KAAK;;EAEXI,CAAC,CAACsB,cAAc;;;;AAI/B;;AAEA,SAASb,QAAQA,CAACT,CAAQ,EAAEgC,IAAc,EAAE;EAC1C,WAAOnB,YAAG,EAAArB,iBAAA,KAAAA,iBAAA,OAAAsB,4BAAA,CAAAC,OAAA;EACEf,CAAC,CAACyC,eAAe,EAAUzC,CAAC,CAAC0C,aAAa;EACzC1C,CAAC,CAACsB,cAAc;EAClB,IAAAa,iBAAQ,EAACnC,CAAC,EAAEgC,IAAI,CAAC;;EAEhB,IAAAG,iBAAQ,EAACnC,CAAC,EAAEgC,IAAI,CAAC;;;AAG/B","ignoreList":[]}

package/cjs/components/Tabs/Tabs.d.ts

@@ -1,55 +0,0 @@
-import React, { AriaAttributes } from 'react';
-import { CommonProps } from '../../internal/CommonWrapper';
-import { SizeProp } from '../../lib/types/props';
-import { Tab } from './Tab';
-type ValueBaseType = string;
-export interface TabsProps<T extends ValueBaseType = string> extends CommonProps {
-    /** Задает кастомный класс подчёркиванию таба. */
-    indicatorClassName?: string;
-    /** Задает размер контрола. */
-    size?: SizeProp;
-    /** Задает текущий активный `<Tab />`. Принимает `id` таба. */
-    value: T;
-    /** Задает функцию, изменяющую текущий активный `<Tab />`. */
-    onValueChange?: (value: T) => void;
-    /** Задает расположение элементов по вертикали.
-     * @default false */
-    vertical?: boolean;
-    /** Задает ширину компонента Tabs. */
-    width?: number | string;
-    /** @ignore */
-    'aria-describedby'?: AriaAttributes['aria-describedby'];
-}
-export declare const TabsDataTids: {
-    readonly root: "Tabs__root";
-    readonly indicatorRoot: "Indicator__root";
-};
-type DefaultProps = Required<Pick<TabsProps, 'vertical' | 'size'>>;
-/**
- * Родитель компонента Tab. Связывает `Tab`'ы в группу и позволяет управлять их состоянием, помогают в навигации.
- *
- * Используйте `Tabs` для второстепенной навигации, для группировки или фильтрации контента.
- *
- * Не используйте `Tabs` для основной навигации. Для этого лучше подходит главное меню на цветной плашке — оно более заметно на странице.
- * Не используйте `Tabs` для переключения состояний — для этого есть RadioGroup, Toggle и Switcher.
- */
-export declare class Tabs<T extends string = string> extends React.Component<TabsProps<T>> {
-    static __KONTUR_REACT_UI__: string;
-    static displayName: string;
-    static defaultProps: DefaultProps;
-    private getProps;
-    static Tab: typeof Tab;
-    private theme;
-    private tabs;
-    private tabUpdates;
-    private listeners;
-    private setRootNode;
-    render(): JSX.Element;
-    private shiftFocus;
-    private notifyUpdate;
-    private switchTab;
-    private getTab;
-    private addTab;
-    private removeTab;
-}
-export {};

package/cjs/components/Tabs/Tabs.js

@@ -1,179 +0,0 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.TabsDataTids = exports.Tabs = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
-var _globalObject = require("@skbkontur/global-object");
-
-
-var _ThemeContext = require("../../lib/theming/ThemeContext");
-
-var _CommonWrapper = require("../../internal/CommonWrapper");
-var _Emotion = require("../../lib/theming/Emotion");
-var _getRootNode = require("../../lib/rootNode/getRootNode");
-var _rootNode = require("../../lib/rootNode");
-var _createPropsGetter = require("../../lib/createPropsGetter");
-
-var _isInstanceOf = require("../../lib/isInstanceOf");
-
-var _Indicator = require("./Indicator");
-var _Tabs2 = require("./Tabs.styles");
-var _TabsContext = require("./TabsContext");
-var _Tab = require("./Tab");var _class, _Tabs;
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-var TabsDataTids = exports.TabsDataTids = {
-  root: 'Tabs__root',
-  indicatorRoot: 'Indicator__root'
-};
-
-
-
-/**
- * Родитель компонента Tab. Связывает `Tab`'ы в группу и позволяет управлять их состоянием, помогают в навигации.
- *
- * Используйте `Tabs` для второстепенной навигации, для группировки или фильтрации контента.
- *
- * Не используйте `Tabs` для основной навигации. Для этого лучше подходит главное меню на цветной плашке — оно более заметно на странице.
- * Не используйте `Tabs` для переключения состояний — для этого есть RadioGroup, Toggle и Switcher.
- */var
-
-Tabs = exports.Tabs = (0, _rootNode.rootNode)(_class = (_Tabs = /*#__PURE__*/function (_React$Component) {function Tabs() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
-
-
-
-
-
-
-
-
-    getProps = (0, _createPropsGetter.createPropsGetter)(Tabs.defaultProps);_this.
-
-
-
-
-
-    tabs = [];_this.
-
-    tabUpdates = {
-      on: function on(cb) {
-        var index = _this.listeners.push(cb);
-        return function () {
-          _this.listeners.splice(index, 1);
-        };
-      }
-    };_this.
-
-    listeners = [];_this.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-    shiftFocus = function (fromTab, delta) {
-      var _this2 = _this,tabs = _this2.tabs;
-      var index = tabs.findIndex(function (x) {return x.id === fromTab;});
-      var newIndex = Math.max(0, Math.min(index + delta, tabs.length - 1));
-      var tab = tabs[newIndex];
-
-      var tabNode = tab.getNode();
-      var htmlNode = (0, _getRootNode.getRootNode)(tabNode);
-
-      if ((0, _isInstanceOf.isInstanceOf)(htmlNode, _globalObject.globalObject.HTMLElement) && typeof htmlNode.focus === 'function') {
-        htmlNode.focus();
-      }
-    };_this.
-
-    notifyUpdate = function () {
-      _this.listeners.forEach(function (cb) {return cb();});
-    };_this.
-
-    switchTab = function (id) {
-      var _this$props = _this.props,onValueChange = _this$props.onValueChange,value = _this$props.value;
-      if (id !== value && onValueChange) {
-        onValueChange(id);
-      }
-    };_this.
-
-    getTab = function (id) {
-      var _ref = _this.tabs.find(function (x) {return x.id === id;}) || {},_ref$getNode = _ref.getNode,getNode = _ref$getNode === void 0 ? null : _ref$getNode;
-      return getNode && getNode();
-    };_this.
-
-    addTab = function (id, getNode) {
-      _this.tabs = _this.tabs.concat({ id: id, getNode: getNode });
-    };_this.
-
-    removeTab = function (id) {
-      _this.tabs = _this.tabs.filter(function (tab) {return tab.id !== id;});
-    };return _this;}(0, _inheritsLoose2.default)(Tabs, _React$Component);var _proto = Tabs.prototype;_proto.render = function render() {var _this3 = this;var _this$props2 = this.props,value = _this$props2.value,width = _this$props2.width,children = _this$props2.children,indicatorClassName = _this$props2.indicatorClassName,ariaDescribedby = _this$props2['aria-describedby'];var _this$getProps = this.getProps(),vertical = _this$getProps.vertical,size = _this$getProps.size;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {var _cx;_this3.theme = theme;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this3.setRootNode }, _this3.props), /*#__PURE__*/_react.default.createElement("div", { "data-tid": TabsDataTids.root, className: (0, _Emotion.cx)((_cx = {}, _cx[_Tabs2.styles.rootSmall(_this3.theme)] = size === 'small', _cx[_Tabs2.styles.rootMedium(_this3.theme)] = size === 'medium', _cx[_Tabs2.styles.rootLarge(_this3.theme)] = size === 'large', _cx[_Tabs2.styles.vertical()] = vertical, _cx)), style: { width: width }, "aria-describedby": ariaDescribedby }, /*#__PURE__*/_react.default.createElement(_TabsContext.TabsContext.Provider, { value: { vertical: vertical, activeTab: value, size: size, getTab: _this3.getTab, addTab: _this3.addTab, removeTab: _this3.removeTab, notifyUpdate: _this3.notifyUpdate, shiftFocus: _this3.shiftFocus, switchTab: _this3.switchTab } }, children, /*#__PURE__*/_react.default.createElement(_Indicator.Indicator, { className: indicatorClassName, tabUpdates: _this3.tabUpdates, vertical: _this3.getProps().vertical }))));});};return Tabs;}(_react.default.Component), _Tabs.__KONTUR_REACT_UI__ = 'Tabs', _Tabs.displayName = 'Tabs', _Tabs.defaultProps = { vertical: false, size: 'large' }, _Tabs.Tab = _Tab.Tab, _Tabs)) || _class;