@skbkontur/react-ui 0.0.0-2ac4c133dd → 0.0.0-2dd5039746

package/internal/PopupMenu/PopupMenu/PopupMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["PopupMenu.tsx"],"names":["React","isKeyArrowVertical","isKeyEnter","isKeyEscape","isKeySpace","someKeys","InternalMenu","Popup","RenderLayer","CommonWrapper","responsiveLayout","rootNode","isValidPositions","styles","PopupMenuType","Dropdown","Tooltip","PopupMenuDataTids","root","caption","Positions","PopupMenu","state","menuVisible","firstItemShouldBeSelected","captionWrapper","savedFocusableElement","menu","open","showMenu","close","hideMenu","refInternalMenu","element","handleOpen","focus","renderCaption","props","opened","openMenu","closeMenu","toggleMenu","handleCaptionClick","handleCaptionKeyDown","hideMenuWithoutFocusing","saveFocus","setState","handleChangeMenuVisible","restoreFocus","e","preventDefault","handleKeyDown","document","activeElement","focusShouldBeRestored","onOpen","onClose","onChangeMenuState","handleItemSelection","event","isDefaultPrevented","type","render","setRootNode","container","width","children","popupMargin","popupHasPin","popupPinOffset","getPositions","disableAnimations","isMobileLayout","menuWidth","menuMaxHeight","header","footer","positions","Component","__KONTUR_REACT_UI__","defaultProps","Type"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {\n  isKeyArrowVertical,\n  isKeyEnter,\n  isKeyEscape,\n  isKeySpace,\n  someKeys,\n} from '../../lib/events/keyboard/identifiers';\nimport { InternalMenu } from '../InternalMenu';\nimport { Popup, PopupPositionsType } from '../Popup';\nimport { RenderLayer } from '../RenderLayer';\nimport { Nullable } from '../../typings/utility-types';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { isValidPositions } from './validatePositions';\nimport { styles } from './PopupMenu.styles';\n\nexport interface PopupMenuCaptionProps {\n  opened: boolean;\n  openMenu: (firstItemShouldBeSelected?: boolean) => void;\n  closeMenu: (restoreFocus?: boolean) => void;\n  toggleMenu: () => void;\n}\n\nexport interface PopupMenuProps extends CommonProps {\n  children?: React.ReactNode;\n  /** Максимальная высота меню */\n  menuMaxHeight?: number | string;\n  /** Ширина меню */\n  menuWidth?: number | string;\n  /** Ширина контейнера и caption */\n  width?: React.CSSProperties['width'];\n\n  /**\n   * Элемент или функция возвращающая элемент,\n   * если передана, используется вместо ```caption```,\n   * в таком случае управлять открытием и закрытием меню\n   * придется в этой функции\n   */\n  caption: React.ReactNode | ((props: PopupMenuCaptionProps) => React.ReactNode);\n\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n\n  /**  Массив разрешенных положений меню относительно caption'а. */\n  positions?: PopupPositionsType[];\n  /** Колбэк, вызываемый после открытия/закрытия меню */\n  onChangeMenuState?: (isOpened: boolean, restoreFocus: boolean) => void;\n  /** Пропсы, передающиеся в Popup */\n  popupHasPin?: boolean;\n  popupMargin?: number;\n  popupPinOffset?: number;\n  type?: 'dropdown' | 'tooltip';\n  disableAnimations: boolean;\n  /** Действие при открытии меню */\n  onOpen?: () => void;\n  /** Действие при закрытии меню */\n  onClose?: () => void;\n}\n\ninterface PopupMenuState {\n  menuVisible: boolean;\n  firstItemShouldBeSelected?: boolean;\n}\n\nexport const PopupMenuType = {\n  Dropdown: 'dropdown',\n  Tooltip: 'tooltip',\n};\n\nexport const PopupMenuDataTids = {\n  root: 'PopupMenu__root',\n  caption: 'PopupMenu__caption',\n} as const;\n\nconst Positions: PopupPositionsType[] = [\n  'top left',\n  'top center',\n  'top right',\n  'right top',\n  'right middle',\n  'right bottom',\n  'bottom left',\n  'bottom center',\n  'bottom right',\n  'left top',\n  'left middle',\n  'left bottom',\n];\n\n@rootNode\n@responsiveLayout\nexport class PopupMenu extends React.Component<PopupMenuProps, PopupMenuState> {\n  public static __KONTUR_REACT_UI__ = 'PopupMenu';\n\n  private isMobileLayout!: boolean;\n\n  public static defaultProps = {\n    positions: Positions,\n    type: PopupMenuType.Tooltip,\n    popupHasPin: true,\n    disableAnimations: false,\n  };\n\n  public static Type = PopupMenuType;\n\n  public state = {\n    menuVisible: false,\n    firstItemShouldBeSelected: false,\n  };\n\n  private captionWrapper: HTMLSpanElement | null = null;\n  private savedFocusableElement: HTMLElement | null = null;\n  private menu: Nullable<InternalMenu> = null;\n  private setRootNode!: TSetRootNode;\n\n  public render() {\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <RenderLayer\n          onClickOutside={this.hideMenuWithoutFocusing}\n          onFocusOutside={this.hideMenuWithoutFocusing}\n          active={this.state.menuVisible}\n        >\n          <div data-tid={PopupMenuDataTids.root} className={styles.container()} style={{ width: this.props.width }}>\n            {this.renderCaption()}\n            {this.captionWrapper && this.props.children && (\n              <Popup\n                anchorElement={this.captionWrapper}\n                opened={this.state.menuVisible}\n                hasShadow\n                margin={this.props.popupMargin}\n                hasPin={this.props.popupHasPin}\n                pinOffset={this.props.popupPinOffset}\n                positions={this.getPositions()}\n                disableAnimations={this.props.disableAnimations}\n                onOpen={this.handleOpen}\n                mobileOnCloseRequest={this.hideMenu}\n                width={this.isMobileLayout ? 'auto' : this.props.menuWidth || 'auto'}\n              >\n                <InternalMenu\n                  hasShadow={false}\n                  maxHeight={this.isMobileLayout ? 'none' : this.props.menuMaxHeight || 'none'}\n                  onKeyDown={this.handleKeyDown}\n                  onItemClick={this.handleItemSelection}\n                  cyclicSelection={false}\n                  ref={this.refInternalMenu}\n                  initialSelectedItemIndex={this.state.firstItemShouldBeSelected ? 0 : -1}\n                  header={this.props.header}\n                  footer={this.props.footer}\n                >\n                  {this.props.children}\n                </InternalMenu>\n              </Popup>\n            )}\n          </div>\n        </RenderLayer>\n      </CommonWrapper>\n    );\n  }\n\n  public open = (): void => this.showMenu();\n  public close = (): void => this.hideMenu();\n\n  private refInternalMenu = (element: Nullable<InternalMenu>) => (this.menu = element);\n\n  private handleOpen = () => {\n    if (this.menu) {\n      this.menu.focus();\n    }\n  };\n\n  private renderCaption = () => {\n    if (typeof this.props.caption === 'function') {\n      const caption = this.props.caption({\n        opened: this.state.menuVisible,\n        openMenu: this.showMenu,\n        closeMenu: this.hideMenu,\n        toggleMenu: this.toggleMenu,\n      });\n\n      return (\n        <span\n          data-tid={PopupMenuDataTids.caption}\n          className={styles.caption()}\n          ref={(element) => (this.captionWrapper = element)}\n        >\n          {caption}\n        </span>\n      );\n    }\n\n    return (\n      <span\n        data-tid={PopupMenuDataTids.caption}\n        onClick={this.handleCaptionClick}\n        onKeyDown={this.handleCaptionKeyDown}\n        ref={(element) => (this.captionWrapper = element)}\n        className={styles.caption()}\n      >\n        {this.props.caption}\n      </span>\n    );\n  };\n\n  private hideMenuWithoutFocusing = () => this.hideMenu();\n\n  private getPositions(): Readonly<PopupPositionsType[]> {\n    if (this.props.positions && isValidPositions(this.props.positions)) {\n      return this.props.positions;\n    }\n\n    return Positions;\n  }\n\n  private showMenu = (firstItemShouldBeSelected?: boolean): void => {\n    this.saveFocus();\n    this.setState(\n      {\n        menuVisible: true,\n        firstItemShouldBeSelected,\n      },\n      () => {\n        this.handleChangeMenuVisible(false);\n      },\n    );\n  };\n\n  private hideMenu = (restoreFocus?: boolean): void => {\n    this.setState(\n      {\n        menuVisible: false,\n        firstItemShouldBeSelected: false,\n      },\n      () => {\n        this.handleChangeMenuVisible(!!restoreFocus);\n      },\n    );\n  };\n\n  private toggleMenu = (): void => {\n    this.state.menuVisible ? this.hideMenu() : this.showMenu();\n  };\n\n  private handleCaptionClick = (): void => {\n    this.toggleMenu();\n  };\n\n  private handleCaptionKeyDown = (e: React.KeyboardEvent<HTMLElement>): void => {\n    if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {\n      e.preventDefault();\n      this.showMenu(true);\n    }\n  };\n\n  private handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n    if (isKeyEscape(e)) {\n      const restoreFocus = true;\n      this.hideMenu(restoreFocus);\n    }\n  };\n\n  private saveFocus = (): void => {\n    if (document) {\n      this.savedFocusableElement = document.activeElement as HTMLElement;\n    }\n  };\n\n  private restoreFocus = (): void => {\n    if (this.savedFocusableElement) {\n      this.savedFocusableElement.focus();\n      this.savedFocusableElement = null;\n    }\n  };\n\n  private handleChangeMenuVisible = (focusShouldBeRestored: boolean): void => {\n    if (focusShouldBeRestored) {\n      this.restoreFocus();\n    }\n\n    if (this.state.menuVisible && this.props.onOpen) {\n      this.props.onOpen();\n    }\n\n    if (!this.state.menuVisible && this.props.onClose) {\n      this.props.onClose();\n    }\n\n    if (typeof this.props.onChangeMenuState === 'function') {\n      this.props.onChangeMenuState(this.state.menuVisible, focusShouldBeRestored);\n    }\n  };\n\n  private handleItemSelection = (event: React.SyntheticEvent<HTMLElement>): void => {\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n\n    if (event.type === 'keydown') {\n      event.preventDefault();\n    }\n\n    const restoreFocus = event.type === 'keydown';\n    this.hideMenu(restoreFocus);\n  };\n}\n"]}
+{"version":3,"sources":["PopupMenu.tsx"],"names":["React","isKeyArrowVertical","isKeyEnter","isKeyEscape","isKeySpace","someKeys","InternalMenu","Popup","RenderLayer","CommonWrapper","responsiveLayout","rootNode","createPropsGetter","isValidPositions","styles","PopupMenuType","Dropdown","Tooltip","PopupMenuDataTids","root","caption","Positions","PopupMenu","getProps","defaultProps","state","menuVisible","firstItemShouldBeSelected","captionWrapper","savedFocusableElement","menu","open","showMenu","close","hideMenu","refInternalMenu","element","handleOpen","focus","renderCaption","props","opened","openMenu","closeMenu","toggleMenu","handleCaptionClick","handleCaptionKeyDown","hideMenuWithoutFocusing","saveFocus","setState","handleChangeMenuVisible","restoreFocus","e","preventDefault","handleKeyDown","document","activeElement","focusShouldBeRestored","onOpen","onClose","onChangeMenuState","handleItemSelection","event","isDefaultPrevented","type","render","popupHasPin","disableAnimations","setRootNode","container","width","children","popupMargin","popupPinOffset","getPositions","isMobileLayout","menuWidth","menuMaxHeight","header","footer","positions","Component","__KONTUR_REACT_UI__","Type"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {\n  isKeyArrowVertical,\n  isKeyEnter,\n  isKeyEscape,\n  isKeySpace,\n  someKeys,\n} from '../../lib/events/keyboard/identifiers';\nimport { InternalMenu } from '../InternalMenu';\nimport { Popup, PopupPositionsType } from '../Popup';\nimport { RenderLayer } from '../RenderLayer';\nimport { Nullable } from '../../typings/utility-types';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { isValidPositions } from './validatePositions';\nimport { styles } from './PopupMenu.styles';\n\nexport interface PopupMenuCaptionProps {\n  opened: boolean;\n  openMenu: (firstItemShouldBeSelected?: boolean) => void;\n  closeMenu: (restoreFocus?: boolean) => void;\n  toggleMenu: () => void;\n}\n\nexport interface PopupMenuProps extends CommonProps {\n  children?: React.ReactNode;\n  /** Максимальная высота меню */\n  menuMaxHeight?: number | string;\n  /** Ширина меню */\n  menuWidth?: number | string;\n  /** Ширина контейнера и caption */\n  width?: React.CSSProperties['width'];\n\n  /**\n   * Элемент или функция возвращающая элемент,\n   * если передана, используется вместо ```caption```,\n   * в таком случае управлять открытием и закрытием меню\n   * придется в этой функции\n   */\n  caption: React.ReactNode | ((props: PopupMenuCaptionProps) => React.ReactNode);\n\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n\n  /**  Массив разрешенных положений меню относительно caption'а. */\n  positions?: PopupPositionsType[];\n  /** Колбэк, вызываемый после открытия/закрытия меню */\n  onChangeMenuState?: (isOpened: boolean, restoreFocus: boolean) => void;\n  /** Пропсы, передающиеся в Popup */\n  popupHasPin?: boolean;\n  popupMargin?: number;\n  popupPinOffset?: number;\n  type?: 'dropdown' | 'tooltip';\n  disableAnimations?: boolean;\n  /** Действие при открытии меню */\n  onOpen?: () => void;\n  /** Действие при закрытии меню */\n  onClose?: () => void;\n}\n\ninterface PopupMenuState {\n  menuVisible: boolean;\n  firstItemShouldBeSelected?: boolean;\n}\n\nexport const PopupMenuType = {\n  Dropdown: 'dropdown',\n  Tooltip: 'tooltip',\n} as const;\n\nexport const PopupMenuDataTids = {\n  root: 'PopupMenu__root',\n  caption: 'PopupMenu__caption',\n} as const;\n\nconst Positions: PopupPositionsType[] = [\n  'top left',\n  'top center',\n  'top right',\n  'right top',\n  'right middle',\n  'right bottom',\n  'bottom left',\n  'bottom center',\n  'bottom right',\n  'left top',\n  'left middle',\n  'left bottom',\n];\n\ntype DefaultProps = Required<Pick<PopupMenuProps, 'positions' | 'type' | 'popupHasPin' | 'disableAnimations'>>;\n\n@rootNode\n@responsiveLayout\nexport class PopupMenu extends React.Component<PopupMenuProps, PopupMenuState> {\n  public static __KONTUR_REACT_UI__ = 'PopupMenu';\n\n  private isMobileLayout!: boolean;\n\n  public static defaultProps: DefaultProps = {\n    positions: Positions,\n    type: PopupMenuType.Tooltip,\n    popupHasPin: true,\n    disableAnimations: false,\n  };\n\n  private getProps = createPropsGetter(PopupMenu.defaultProps);\n\n  public static Type = PopupMenuType;\n\n  public state = {\n    menuVisible: false,\n    firstItemShouldBeSelected: false,\n  };\n\n  private captionWrapper: HTMLSpanElement | null = null;\n  private savedFocusableElement: HTMLElement | null = null;\n  private menu: Nullable<InternalMenu> = null;\n  private setRootNode!: TSetRootNode;\n\n  public render() {\n    const { popupHasPin, disableAnimations } = this.getProps();\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <RenderLayer\n          onClickOutside={this.hideMenuWithoutFocusing}\n          onFocusOutside={this.hideMenuWithoutFocusing}\n          active={this.state.menuVisible}\n        >\n          <div data-tid={PopupMenuDataTids.root} className={styles.container()} style={{ width: this.props.width }}>\n            {this.renderCaption()}\n            {this.captionWrapper && this.props.children && (\n              <Popup\n                anchorElement={this.captionWrapper}\n                opened={this.state.menuVisible}\n                hasShadow\n                margin={this.props.popupMargin}\n                hasPin={popupHasPin}\n                pinOffset={this.props.popupPinOffset}\n                positions={this.getPositions()}\n                disableAnimations={disableAnimations}\n                onOpen={this.handleOpen}\n                mobileOnCloseRequest={this.hideMenu}\n                width={this.isMobileLayout ? 'auto' : this.props.menuWidth || 'auto'}\n              >\n                <InternalMenu\n                  hasShadow={false}\n                  maxHeight={this.isMobileLayout ? 'none' : this.props.menuMaxHeight || 'none'}\n                  onKeyDown={this.handleKeyDown}\n                  onItemClick={this.handleItemSelection}\n                  cyclicSelection={false}\n                  ref={this.refInternalMenu}\n                  initialSelectedItemIndex={this.state.firstItemShouldBeSelected ? 0 : -1}\n                  header={this.props.header}\n                  footer={this.props.footer}\n                >\n                  {this.props.children}\n                </InternalMenu>\n              </Popup>\n            )}\n          </div>\n        </RenderLayer>\n      </CommonWrapper>\n    );\n  }\n\n  public open = (): void => this.showMenu();\n  public close = (): void => this.hideMenu();\n\n  private refInternalMenu = (element: Nullable<InternalMenu>) => (this.menu = element);\n\n  private handleOpen = () => {\n    if (this.menu) {\n      this.menu.focus();\n    }\n  };\n\n  private renderCaption = () => {\n    if (typeof this.props.caption === 'function') {\n      const caption = this.props.caption({\n        opened: this.state.menuVisible,\n        openMenu: this.showMenu,\n        closeMenu: this.hideMenu,\n        toggleMenu: this.toggleMenu,\n      });\n\n      return (\n        <span\n          data-tid={PopupMenuDataTids.caption}\n          className={styles.caption()}\n          ref={(element) => (this.captionWrapper = element)}\n        >\n          {caption}\n        </span>\n      );\n    }\n\n    return (\n      <span\n        data-tid={PopupMenuDataTids.caption}\n        onClick={this.handleCaptionClick}\n        onKeyDown={this.handleCaptionKeyDown}\n        ref={(element) => (this.captionWrapper = element)}\n        className={styles.caption()}\n      >\n        {this.props.caption}\n      </span>\n    );\n  };\n\n  private hideMenuWithoutFocusing = () => this.hideMenu();\n\n  private getPositions(): Readonly<PopupPositionsType[]> {\n    const positions = this.getProps().positions;\n    if (positions && isValidPositions(positions)) {\n      return positions;\n    }\n\n    return Positions;\n  }\n\n  private showMenu = (firstItemShouldBeSelected?: boolean): void => {\n    this.saveFocus();\n    this.setState(\n      {\n        menuVisible: true,\n        firstItemShouldBeSelected,\n      },\n      () => {\n        this.handleChangeMenuVisible(false);\n      },\n    );\n  };\n\n  private hideMenu = (restoreFocus?: boolean): void => {\n    this.setState(\n      {\n        menuVisible: false,\n        firstItemShouldBeSelected: false,\n      },\n      () => {\n        this.handleChangeMenuVisible(!!restoreFocus);\n      },\n    );\n  };\n\n  private toggleMenu = (): void => {\n    this.state.menuVisible ? this.hideMenu() : this.showMenu();\n  };\n\n  private handleCaptionClick = (): void => {\n    this.toggleMenu();\n  };\n\n  private handleCaptionKeyDown = (e: React.KeyboardEvent<HTMLElement>): void => {\n    if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {\n      e.preventDefault();\n      this.showMenu(true);\n    }\n  };\n\n  private handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n    if (isKeyEscape(e)) {\n      const restoreFocus = true;\n      this.hideMenu(restoreFocus);\n    }\n  };\n\n  private saveFocus = (): void => {\n    if (document) {\n      this.savedFocusableElement = document.activeElement as HTMLElement;\n    }\n  };\n\n  private restoreFocus = (): void => {\n    if (this.savedFocusableElement) {\n      this.savedFocusableElement.focus();\n      this.savedFocusableElement = null;\n    }\n  };\n\n  private handleChangeMenuVisible = (focusShouldBeRestored: boolean): void => {\n    if (focusShouldBeRestored) {\n      this.restoreFocus();\n    }\n\n    if (this.state.menuVisible && this.props.onOpen) {\n      this.props.onOpen();\n    }\n\n    if (!this.state.menuVisible && this.props.onClose) {\n      this.props.onClose();\n    }\n\n    if (typeof this.props.onChangeMenuState === 'function') {\n      this.props.onChangeMenuState(this.state.menuVisible, focusShouldBeRestored);\n    }\n  };\n\n  private handleItemSelection = (event: React.SyntheticEvent<HTMLElement>): void => {\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n\n    if (event.type === 'keydown') {\n      event.preventDefault();\n    }\n\n    const restoreFocus = event.type === 'keydown';\n    this.hideMenu(restoreFocus);\n  };\n}\n"]}

package/internal/PopupMenu/PopupMenu.d.ts

@@ -33,7 +33,7 @@ export interface PopupMenuProps extends CommonProps {
     popupMargin?: number;
     popupPinOffset?: number;
     type?: 'dropdown' | 'tooltip';
-    disableAnimations: boolean;
+    disableAnimations?: boolean;
     /** Действие при открытии меню */
     onOpen?: () => void;
     /** Действие при закрытии меню */
@@ -44,25 +44,22 @@ interface PopupMenuState {
     firstItemShouldBeSelected?: boolean;
 }
 export declare const PopupMenuType: {
-    Dropdown: string;
-    Tooltip: string;
+    readonly Dropdown: "dropdown";
+    readonly Tooltip: "tooltip";
 };
 export declare const PopupMenuDataTids: {
     readonly root: "PopupMenu__root";
     readonly caption: "PopupMenu__caption";
 };
+declare type DefaultProps = Required<Pick<PopupMenuProps, 'positions' | 'type' | 'popupHasPin' | 'disableAnimations'>>;
 export declare class PopupMenu extends React.Component<PopupMenuProps, PopupMenuState> {
     static __KONTUR_REACT_UI__: string;
     private isMobileLayout;
-    static defaultProps: {
-        positions: ("top left" | "top center" | "top right" | "right top" | "right middle" | "right bottom" | "bottom right" | "bottom center" | "bottom left" | "left bottom" | "left middle" | "left top")[];
-        type: string;
-        popupHasPin: boolean;
-        disableAnimations: boolean;
-    };
+    static defaultProps: DefaultProps;
+    private getProps;
     static Type: {
-        Dropdown: string;
-        Tooltip: string;
+        readonly Dropdown: "dropdown";
+        readonly Tooltip: "tooltip";
     };
     state: {
         menuVisible: boolean;

package/internal/RenderLayer/RenderLayer/RenderLayer.js

@@ -7,6 +7,7 @@ import React from 'react';
 import { listen as listenFocusOutside, containsTargetOrRenderContainer } from "../../../lib/listenFocusOutside";
 import { CommonWrapper } from "../../CommonWrapper";
 import { getRootNode, rootNode } from "../../../lib/rootNode";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
 export var RenderLayer = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(RenderLayer, _React$Component);
 
@@ -18,6 +19,7 @@ export var RenderLayer = rootNode(_class = (_temp = _class2 = /*#__PURE__*/funct
     }
 
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(RenderLayer.defaultProps);
     _this.focusOutsideListenerToken = null;
 
     _this.handleFocusOutside = function (event) {
@@ -46,23 +48,25 @@ export var RenderLayer = rootNode(_class = (_temp = _class2 = /*#__PURE__*/funct
   var _proto = RenderLayer.prototype;
 
   _proto.componentDidMount = function componentDidMount() {
-    if (this.props.active) {
+    if (this.getProps().active) {
       this.attachListeners();
     }
   };
 
   _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
-    if (!prevProps.active && this.props.active) {
+    var active = this.getProps().active;
+
+    if (!prevProps.active && active) {
       this.attachListeners();
     }
 
-    if (prevProps.active && !this.props.active) {
+    if (prevProps.active && !active) {
       this.detachListeners();
     }
   };
 
   _proto.componentWillUnmount = function componentWillUnmount() {
-    if (this.props.active) {
+    if (this.getProps().active) {
       this.detachListeners();
     }
   };
@@ -89,7 +93,7 @@ export var RenderLayer = rootNode(_class = (_temp = _class2 = /*#__PURE__*/funct
       return [node];
     }, this.handleFocusOutside);
     window.addEventListener('blur', this.handleFocusOutside);
-    document.addEventListener('ontouchstart' in document.documentElement ? 'touchstart' : 'mousedown', this.handleNativeDocClick);
+    document.addEventListener('ontouchstart' in document.documentElement && 'onpointerup' in document.documentElement ? 'pointerup' : 'mousedown', this.handleNativeDocClick);
   };
 
   _proto.detachListeners = function detachListeners() {
@@ -99,7 +103,7 @@ export var RenderLayer = rootNode(_class = (_temp = _class2 = /*#__PURE__*/funct
     }
 
     window.removeEventListener('blur', this.handleFocusOutside);
-    document.removeEventListener('ontouchstart' in document.documentElement ? 'touchstart' : 'mousedown', this.handleNativeDocClick);
+    document.removeEventListener('ontouchstart' in document.documentElement && 'onpointerup' in document.documentElement ? 'pointerup' : 'mousedown', this.handleNativeDocClick);
   };
 
   return RenderLayer;

package/internal/RenderLayer/RenderLayer/RenderLayer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["RenderLayer.tsx"],"names":["React","listen","listenFocusOutside","containsTargetOrRenderContainer","CommonWrapper","getRootNode","rootNode","RenderLayer","focusOutsideListenerToken","handleFocusOutside","event","props","onFocusOutside","handleNativeDocClick","target","srcElement","node","getAnchorNode","Element","onClickOutside","componentDidMount","active","attachListeners","componentDidUpdate","prevProps","detachListeners","componentWillUnmount","render","setRootNode","Children","only","children","getAnchorElement","window","addEventListener","document","documentElement","remove","removeEventListener","Component","__KONTUR_REACT_UI__","propTypes","propName","componentName","Error","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { listen as listenFocusOutside, containsTargetOrRenderContainer } from '../../lib/listenFocusOutside';\nimport { CommonProps, CommonWrapper } from '../CommonWrapper';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { Nullable } from '../../typings/utility-types';\n\nexport interface RenderLayerProps extends CommonProps {\n  children: JSX.Element;\n  onClickOutside?: (e: Event) => void;\n  onFocusOutside?: (e: Event) => void;\n  active?: boolean;\n  getAnchorElement?: () => Nullable<HTMLElement>;\n}\n\n@rootNode\nexport class RenderLayer extends React.Component<RenderLayerProps> {\n  public static __KONTUR_REACT_UI__ = 'RenderLayer';\n\n  public static propTypes = {\n    active(props: RenderLayerProps, propName: keyof RenderLayerProps, componentName: string) {\n      const { active, onClickOutside, onFocusOutside } = props;\n      if (active && !(onClickOutside || onFocusOutside)) {\n        return new Error(\n          `[${componentName}]: using the component without either 'onClickOutside' or 'onFocusOutside' callback is pointless.`,\n        );\n      }\n    },\n  };\n\n  public static defaultProps = {\n    active: true,\n  };\n\n  private focusOutsideListenerToken: {\n    remove: () => void;\n  } | null = null;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidMount() {\n    if (this.props.active) {\n      this.attachListeners();\n    }\n  }\n\n  public componentDidUpdate(prevProps: RenderLayerProps) {\n    if (!prevProps.active && this.props.active) {\n      this.attachListeners();\n    }\n    if (prevProps.active && !this.props.active) {\n      this.detachListeners();\n    }\n  }\n\n  public componentWillUnmount() {\n    if (this.props.active) {\n      this.detachListeners();\n    }\n  }\n\n  public render() {\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        {React.Children.only(this.props.children)}\n      </CommonWrapper>\n    );\n  }\n\n  private getAnchorNode(): Nullable<HTMLElement> {\n    const { getAnchorElement } = this.props;\n    return getAnchorElement ? getAnchorElement() : getRootNode(this);\n  }\n\n  private attachListeners() {\n    const node = this.getAnchorNode();\n    if (!node) {\n      return;\n    }\n\n    this.focusOutsideListenerToken = listenFocusOutside(() => [node], this.handleFocusOutside);\n    window.addEventListener('blur', this.handleFocusOutside);\n    document.addEventListener(\n      'ontouchstart' in document.documentElement ? 'touchstart' : 'mousedown',\n      this.handleNativeDocClick,\n    );\n  }\n\n  private detachListeners() {\n    if (this.focusOutsideListenerToken) {\n      this.focusOutsideListenerToken.remove();\n      this.focusOutsideListenerToken = null;\n    }\n\n    window.removeEventListener('blur', this.handleFocusOutside);\n    document.removeEventListener(\n      'ontouchstart' in document.documentElement ? 'touchstart' : 'mousedown',\n      this.handleNativeDocClick,\n    );\n  }\n\n  private handleFocusOutside = (event: Event) => {\n    if (this.props.onFocusOutside) {\n      this.props.onFocusOutside(event);\n    }\n  };\n\n  private handleNativeDocClick = (event: Event) => {\n    const target = event.target || event.srcElement;\n    const node = this.getAnchorNode();\n\n    if (!node || (target instanceof Element && containsTargetOrRenderContainer(target)(node))) {\n      return;\n    }\n\n    if (this.props.onClickOutside) {\n      this.props.onClickOutside(event);\n    }\n  };\n}\n"]}
+{"version":3,"sources":["RenderLayer.tsx"],"names":["React","listen","listenFocusOutside","containsTargetOrRenderContainer","CommonWrapper","getRootNode","rootNode","createPropsGetter","RenderLayer","getProps","defaultProps","focusOutsideListenerToken","handleFocusOutside","event","props","onFocusOutside","handleNativeDocClick","target","srcElement","node","getAnchorNode","Element","onClickOutside","componentDidMount","active","attachListeners","componentDidUpdate","prevProps","detachListeners","componentWillUnmount","render","setRootNode","Children","only","children","getAnchorElement","window","addEventListener","document","documentElement","remove","removeEventListener","Component","__KONTUR_REACT_UI__","propTypes","propName","componentName","Error"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { listen as listenFocusOutside, containsTargetOrRenderContainer } from '../../lib/listenFocusOutside';\nimport { CommonProps, CommonWrapper } from '../CommonWrapper';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { Nullable } from '../../typings/utility-types';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nexport interface RenderLayerProps extends CommonProps {\n  children: JSX.Element;\n  onClickOutside?: (e: Event) => void;\n  onFocusOutside?: (e: Event) => void;\n  active?: boolean;\n  getAnchorElement?: () => Nullable<Element>;\n}\n\ntype DefaultProps = Required<Pick<RenderLayerProps, 'active'>>;\n\n@rootNode\nexport class RenderLayer extends React.Component<RenderLayerProps> {\n  public static __KONTUR_REACT_UI__ = 'RenderLayer';\n\n  public static propTypes = {\n    active(props: RenderLayerProps, propName: keyof RenderLayerProps, componentName: string) {\n      const { active, onClickOutside, onFocusOutside } = props;\n      if (active && !(onClickOutside || onFocusOutside)) {\n        return new Error(\n          `[${componentName}]: using the component without either 'onClickOutside' or 'onFocusOutside' callback is pointless.`,\n        );\n      }\n    },\n  };\n\n  public static defaultProps: DefaultProps = {\n    active: true,\n  };\n\n  private getProps = createPropsGetter(RenderLayer.defaultProps);\n\n  private focusOutsideListenerToken: {\n    remove: () => void;\n  } | null = null;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidMount() {\n    if (this.getProps().active) {\n      this.attachListeners();\n    }\n  }\n\n  public componentDidUpdate(prevProps: RenderLayerProps) {\n    const active = this.getProps().active;\n    if (!prevProps.active && active) {\n      this.attachListeners();\n    }\n    if (prevProps.active && !active) {\n      this.detachListeners();\n    }\n  }\n\n  public componentWillUnmount() {\n    if (this.getProps().active) {\n      this.detachListeners();\n    }\n  }\n\n  public render() {\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        {React.Children.only(this.props.children)}\n      </CommonWrapper>\n    );\n  }\n\n  private getAnchorNode(): Nullable<Element> {\n    const { getAnchorElement } = this.props;\n    return getAnchorElement ? getAnchorElement() : getRootNode(this);\n  }\n\n  private attachListeners() {\n    const node = this.getAnchorNode();\n    if (!node) {\n      return;\n    }\n\n    this.focusOutsideListenerToken = listenFocusOutside(() => [node], this.handleFocusOutside);\n    window.addEventListener('blur', this.handleFocusOutside);\n    document.addEventListener(\n      'ontouchstart' in document.documentElement && 'onpointerup' in document.documentElement\n        ? 'pointerup'\n        : 'mousedown',\n      this.handleNativeDocClick,\n    );\n  }\n\n  private detachListeners() {\n    if (this.focusOutsideListenerToken) {\n      this.focusOutsideListenerToken.remove();\n      this.focusOutsideListenerToken = null;\n    }\n\n    window.removeEventListener('blur', this.handleFocusOutside);\n    document.removeEventListener(\n      'ontouchstart' in document.documentElement && 'onpointerup' in document.documentElement\n        ? 'pointerup'\n        : 'mousedown',\n      this.handleNativeDocClick,\n    );\n  }\n\n  private handleFocusOutside = (event: Event) => {\n    if (this.props.onFocusOutside) {\n      this.props.onFocusOutside(event);\n    }\n  };\n\n  private handleNativeDocClick = (event: Event) => {\n    const target = event.target || event.srcElement;\n    const node = this.getAnchorNode();\n\n    if (!node || (target instanceof Element && containsTargetOrRenderContainer(target)(node))) {\n      return;\n    }\n\n    if (this.props.onClickOutside) {\n      this.props.onClickOutside(event);\n    }\n  };\n}\n"]}

package/internal/RenderLayer/RenderLayer.d.ts

@@ -6,16 +6,16 @@ export interface RenderLayerProps extends CommonProps {
     onClickOutside?: (e: Event) => void;
     onFocusOutside?: (e: Event) => void;
     active?: boolean;
-    getAnchorElement?: () => Nullable<HTMLElement>;
+    getAnchorElement?: () => Nullable<Element>;
 }
+declare type DefaultProps = Required<Pick<RenderLayerProps, 'active'>>;
 export declare class RenderLayer extends React.Component<RenderLayerProps> {
     static __KONTUR_REACT_UI__: string;
     static propTypes: {
         active(props: RenderLayerProps, propName: keyof RenderLayerProps, componentName: string): Error | undefined;
     };
-    static defaultProps: {
-        active: boolean;
-    };
+    static defaultProps: DefaultProps;
+    private getProps;
     private focusOutsideListenerToken;
     private setRootNode;
     componentDidMount(): void;
@@ -28,3 +28,4 @@ export declare class RenderLayer extends React.Component<RenderLayerProps> {
     private handleFocusOutside;
     private handleNativeDocClick;
 }
+export {};

package/internal/ThemePlayground/AnotherInputsPlayground/AnotherInputsPlayground.js.map

@@ -1 +1 @@
-{"version":3,"sources":["AnotherInputsPlayground.tsx"],"names":["React","Tooltip","DatePicker","DatePickerPlayground","state","value","error","tooltip","handleChange","setState","invalidate","validate","currentValue","removeTooltip","render","props","disabled","size","Component"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,OAAT,QAAwB,0BAAxB;AACA,SAASC,UAAT,QAA2B,6BAA3B;;AAEA,WAAaC,oBAAb;AACSC,IAAAA,KADT,GACiB;AACbC,MAAAA,KAAK,EAAE,YADM;AAEbC,MAAAA,KAAK,EAAE,KAFM;AAGbC,MAAAA,OAAO,EAAE,KAHI,EADjB;;;;;;;;;;;;;;;;;;;;;;;;;AA6BUC,IAAAA,YA7BV,GA6ByB,UAACH,KAAD,EAAmB;AACxC,YAAKI,QAAL,CAAc;AACZJ,QAAAA,KAAK,EAALA,KADY,EAAd;;AAGD,KAjCH;;AAmCUK,IAAAA,UAnCV,GAmCuB,YAAM;AACzB,YAAKD,QAAL,CAAc,EAAEH,KAAK,EAAE,KAAT,EAAgBC,OAAO,EAAE,KAAzB,EAAd;AACD,KArCH;;AAuCUI,IAAAA,QAvCV,GAuCqB,YAAM;AACvB,UAAMC,YAAY,GAAG,MAAKR,KAAL,CAAWC,KAAhC;AACA,YAAKI,QAAL,CAAc,YAAM;AAClB,YAAMH,KAAK,GAAG,CAAC,CAACM,YAAF,IAAkB,CAACV,UAAU,CAACS,QAAX,CAAoBC,YAApB,CAAjC;AACA,eAAO;AACLN,UAAAA,KAAK,EAALA,KADK;AAELC,UAAAA,OAAO,EAAED,KAFJ,EAAP;;AAID,OAND;AAOD,KAhDH;;AAkDUO,IAAAA,aAlDV,GAkD0B,YAAM;AAC5B,YAAKJ,QAAL,CAAc;AACZF,QAAAA,OAAO,EAAE,KADG,EAAd;;AAGD,KAtDH,kEAOSO,MAPT,GAOE,kBAAgB,CACd,oBACE,oBAAC,OAAD,IACE,OAAO,EAAE,KAAKV,KAAL,CAAWG,OAAX,GAAqB,QAArB,GAAgC,QAD3C,EAEE,MAAM,EAAE,0BAAM,0BAAN,EAFV,EAGE,YAAY,EAAE,KAAKM,aAHrB,iBAKE,oBAAC,UAAD,eACM,KAAKE,KADX,IAEE,QAAQ,EAAE,KAAKA,KAAL,CAAWC,QAFvB,EAGE,IAAI,EAAE,KAAKD,KAAL,CAAWE,IAHnB,EAIE,KAAK,EAAE,KAAKb,KAAL,CAAWE,KAJpB,EAKE,KAAK,EAAE,KAAKF,KAAL,CAAWC,KALpB,EAME,aAAa,EAAE,KAAKG,YANtB,EAOE,OAAO,EAAE,KAAKE,UAPhB,EAQE,MAAM,EAAE,KAAKC,QARf,EASE,eAAe,MATjB,IALF,CADF,CAmBD,CA3BH,+BAA0CX,KAAK,CAACkB,SAAhD","sourcesContent":["import React from 'react';\n\nimport { Tooltip } from '../../components/Tooltip';\nimport { DatePicker } from '../../components/DatePicker';\n\nexport class DatePickerPlayground extends React.Component<any, any> {\n  public state = {\n    value: '17.06.2019',\n    error: false,\n    tooltip: false,\n  };\n\n  public render() {\n    return (\n      <Tooltip\n        trigger={this.state.tooltip ? 'opened' : 'closed'}\n        render={() => 'Такой даты не существует'}\n        onCloseClick={this.removeTooltip}\n      >\n        <DatePicker\n          {...this.props}\n          disabled={this.props.disabled}\n          size={this.props.size}\n          error={this.state.error}\n          value={this.state.value}\n          onValueChange={this.handleChange}\n          onFocus={this.invalidate}\n          onBlur={this.validate}\n          enableTodayLink\n        />\n      </Tooltip>\n    );\n  }\n\n  private handleChange = (value: string) => {\n    this.setState({\n      value,\n    });\n  };\n\n  private invalidate = () => {\n    this.setState({ error: false, tooltip: false });\n  };\n\n  private validate = () => {\n    const currentValue = this.state.value;\n    this.setState(() => {\n      const error = !!currentValue && !DatePicker.validate(currentValue);\n      return {\n        error,\n        tooltip: error,\n      };\n    });\n  };\n\n  private removeTooltip = () => {\n    this.setState({\n      tooltip: false,\n    });\n  };\n}\n"]}
+{"version":3,"sources":["AnotherInputsPlayground.tsx"],"names":["React","Tooltip","DatePicker","DatePickerPlayground","state","value","error","tooltip","handleChange","setState","invalidate","validate","currentValue","removeTooltip","render","props","disabled","size","Component"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;;AAGA,SAASC,OAAT,QAAwB,0BAAxB;AACA,SAASC,UAAT,QAA4C,6BAA5C;;;;;;;;AAQA,WAAaC,oBAAb;AACSC,IAAAA,KADT,GAC4C;AACxCC,MAAAA,KAAK,EAAE,YADiC;AAExCC,MAAAA,KAAK,EAAE,KAFiC;AAGxCC,MAAAA,OAAO,EAAE,KAH+B,EAD5C;;;;;;;;;;;;;;;;;;;;;;;;;AA6BUC,IAAAA,YA7BV,GA6ByB,UAACH,KAAD,EAAmB;AACxC,YAAKI,QAAL,CAAc;AACZJ,QAAAA,KAAK,EAALA,KADY,EAAd;;AAGD,KAjCH;;AAmCUK,IAAAA,UAnCV,GAmCuB,YAAM;AACzB,YAAKD,QAAL,CAAc,EAAEH,KAAK,EAAE,KAAT,EAAgBC,OAAO,EAAE,KAAzB,EAAd;AACD,KArCH;;AAuCUI,IAAAA,QAvCV,GAuCqB,YAAM;AACvB,UAAMC,YAAY,GAAG,MAAKR,KAAL,CAAWC,KAAhC;AACA,YAAKI,QAAL,CAAc,YAAM;AAClB,YAAMH,KAAK,GAAG,CAAC,CAACM,YAAF,IAAkB,CAACV,UAAU,CAACS,QAAX,CAAoBC,YAApB,CAAjC;AACA,eAAO;AACLN,UAAAA,KAAK,EAALA,KADK;AAELC,UAAAA,OAAO,EAAED,KAFJ,EAAP;;AAID,OAND;AAOD,KAhDH;;AAkDUO,IAAAA,aAlDV,GAkD0B,YAAM;AAC5B,YAAKJ,QAAL,CAAc;AACZF,QAAAA,OAAO,EAAE,KADG,EAAd;;AAGD,KAtDH,kEAOSO,MAPT,GAOE,kBAAgB,CACd,oBACE,oBAAC,OAAD,IACE,OAAO,EAAE,KAAKV,KAAL,CAAWG,OAAX,GAAqB,QAArB,GAAgC,QAD3C,EAEE,MAAM,EAAE,0BAAM,0BAAN,EAFV,EAGE,YAAY,EAAE,KAAKM,aAHrB,iBAKE,oBAAC,UAAD,eACM,KAAKE,KADX,IAEE,QAAQ,EAAE,KAAKA,KAAL,CAAWC,QAFvB,EAGE,IAAI,EAAE,KAAKD,KAAL,CAAWE,IAHnB,EAIE,KAAK,EAAE,KAAKb,KAAL,CAAWE,KAJpB,EAKE,KAAK,EAAE,KAAKF,KAAL,CAAWC,KALpB,EAME,aAAa,EAAE,KAAKG,YANtB,EAOE,OAAO,EAAE,KAAKE,UAPhB,EAQE,MAAM,EAAE,KAAKC,QARf,EASE,eAAe,MATjB,IALF,CADF,CAmBD,CA3BH,+BAA0CX,KAAK,CAACkB,SAAhD","sourcesContent":["import React from 'react';\n\nimport { Nullable } from '../../typings/utility-types';\nimport { Tooltip } from '../../components/Tooltip';\nimport { DatePicker, DatePickerProps } from '../../components/DatePicker';\n\ninterface DatePickerPlaygroundState {\n  value: Nullable<string>;\n  error: boolean;\n  tooltip: boolean;\n}\ntype DatePickerPlaygroundProps = Partial<DatePickerProps>;\nexport class DatePickerPlayground extends React.Component<DatePickerPlaygroundProps> {\n  public state: DatePickerPlaygroundState = {\n    value: '17.06.2019',\n    error: false,\n    tooltip: false,\n  };\n\n  public render() {\n    return (\n      <Tooltip\n        trigger={this.state.tooltip ? 'opened' : 'closed'}\n        render={() => 'Такой даты не существует'}\n        onCloseClick={this.removeTooltip}\n      >\n        <DatePicker\n          {...this.props}\n          disabled={this.props.disabled}\n          size={this.props.size}\n          error={this.state.error}\n          value={this.state.value}\n          onValueChange={this.handleChange}\n          onFocus={this.invalidate}\n          onBlur={this.validate}\n          enableTodayLink\n        />\n      </Tooltip>\n    );\n  }\n\n  private handleChange = (value: string) => {\n    this.setState({\n      value,\n    });\n  };\n\n  private invalidate = () => {\n    this.setState({ error: false, tooltip: false });\n  };\n\n  private validate = () => {\n    const currentValue = this.state.value;\n    this.setState(() => {\n      const error = !!currentValue && !DatePicker.validate(currentValue);\n      return {\n        error,\n        tooltip: error,\n      };\n    });\n  };\n\n  private removeTooltip = () => {\n    this.setState({\n      tooltip: false,\n    });\n  };\n}\n"]}

package/internal/ThemePlayground/AnotherInputsPlayground.d.ts

@@ -1,13 +1,18 @@
 import React from 'react';
-export declare class DatePickerPlayground extends React.Component<any, any> {
-    state: {
-        value: string;
-        error: boolean;
-        tooltip: boolean;
-    };
+import { Nullable } from '../../typings/utility-types';
+import { DatePickerProps } from '../../components/DatePicker';
+interface DatePickerPlaygroundState {
+    value: Nullable<string>;
+    error: boolean;
+    tooltip: boolean;
+}
+declare type DatePickerPlaygroundProps = Partial<DatePickerProps>;
+export declare class DatePickerPlayground extends React.Component<DatePickerPlaygroundProps> {
+    state: DatePickerPlaygroundState;
     render(): JSX.Element;
     private handleChange;
     private invalidate;
     private validate;
     private removeTooltip;
 }
+export {};

package/internal/ThemePlayground/CurrencyInputPlayground/CurrencyInputPlayground.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CurrencyInputPlayground.tsx"],"names":["React","CurrencyInput","CurrencyInputPlayground","state","value","props","handleChange","setState","render","Component"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,aAAT,QAAkD,gCAAlD;;AAEA,WAAaC,uBAAb;;;;;;AAMSC,IAAAA,KANT,GAMiB;AACbC,MAAAA,KAAK,EAAE,MAAKC,KAAL,CAAWD,KAAX,IAAoB,IADd,EANjB;;;;;;;;;;;;;;;;;AAwBUE,IAAAA,YAxBV,GAwByB,UAACF,KAAD,EAA2B;AAChD,YAAKG,QAAL,CAAc,EAAEH,KAAK,EAALA,KAAF,EAAd;AACD,KA1BH,qEAUSI,MAVT,GAUE,kBAAgB,CACd,oBACE,8CACE,oBAAC,aAAD,eACM,KAAKH,KADX,IAEE,WAAW,EAAE,UAFf,EAGE,KAAK,EAAE,KAAKF,KAAL,CAAWC,KAHpB,EAIE,aAAa,EAAE,KAAKE,YAJtB,EAKE,KAAK,EAAE,GALT,IADF,CADF,CAWD,CAtBH,kCAA6CN,KAAK,CAACS,SAAnD","sourcesContent":["import React from 'react';\n\nimport { CurrencyInput, CurrencyInputProps } from '../../components/CurrencyInput';\n\nexport class CurrencyInputPlayground extends React.Component<\n  Partial<CurrencyInputProps>,\n  {\n    value?: number | null;\n  }\n> {\n  public state = {\n    value: this.props.value || 2222,\n  };\n\n  public render() {\n    return (\n      <div>\n        <CurrencyInput\n          {...this.props}\n          placeholder={'currency'}\n          value={this.state.value}\n          onValueChange={this.handleChange}\n          width={150}\n        />\n      </div>\n    );\n  }\n\n  private handleChange = (value?: number | null) => {\n    this.setState({ value });\n  };\n}\n"]}
+{"version":3,"sources":["CurrencyInputPlayground.tsx"],"names":["React","CurrencyInput","CurrencyInputPlayground","state","value","props","handleChange","setState","render","Component"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;;AAGA,SAASC,aAAT,QAAkD,gCAAlD;;;;;AAKA,WAAaC,uBAAb;AACSC,IAAAA,KADT,GAC+C;AAC3CC,MAAAA,KAAK,EAAE,MAAKC,KAAL,CAAWD,KAAX,IAAoB,IADgB,EAD/C;;;;;;;;;;;;;;;;;AAmBUE,IAAAA,YAnBV,GAmByB,UAACF,KAAD,EAA2B;AAChD,YAAKG,QAAL,CAAc,EAAEH,KAAK,EAALA,KAAF,EAAd;AACD,KArBH,qEAKSI,MALT,GAKE,kBAAgB,CACd,oBACE,8CACE,oBAAC,aAAD,eACM,KAAKH,KADX,IAEE,WAAW,EAAE,UAFf,EAGE,KAAK,EAAE,KAAKF,KAAL,CAAWC,KAHpB,EAIE,aAAa,EAAE,KAAKE,YAJtB,EAKE,KAAK,EAAE,GALT,IADF,CADF,CAWD,CAjBH,kCAA6CN,KAAK,CAACS,SAAnD","sourcesContent":["import React from 'react';\n\nimport { Nullable } from '../../typings/utility-types';\nimport { CurrencyInput, CurrencyInputProps } from '../../components/CurrencyInput';\n\ninterface CurrencyInputPlaygroundState {\n  value: Nullable<number>;\n}\nexport class CurrencyInputPlayground extends React.Component<Partial<CurrencyInputProps>> {\n  public state: CurrencyInputPlaygroundState = {\n    value: this.props.value || 2222,\n  };\n\n  public render() {\n    return (\n      <div>\n        <CurrencyInput\n          {...this.props}\n          placeholder={'currency'}\n          value={this.state.value}\n          onValueChange={this.handleChange}\n          width={150}\n        />\n      </div>\n    );\n  }\n\n  private handleChange = (value?: number | null) => {\n    this.setState({ value });\n  };\n}\n"]}

package/internal/ThemePlayground/CurrencyInputPlayground.d.ts

@@ -1,11 +1,12 @@
 import React from 'react';
+import { Nullable } from '../../typings/utility-types';
 import { CurrencyInputProps } from '../../components/CurrencyInput';
-export declare class CurrencyInputPlayground extends React.Component<Partial<CurrencyInputProps>, {
-    value?: number | null;
-}> {
-    state: {
-        value: number;
-    };
+interface CurrencyInputPlaygroundState {
+    value: Nullable<number>;
+}
+export declare class CurrencyInputPlayground extends React.Component<Partial<CurrencyInputProps>> {
+    state: CurrencyInputPlaygroundState;
     render(): JSX.Element;
     private handleChange;
 }
+export {};

package/internal/ThemePlayground/FxInputPlayground/FxInputPlayground.js

@@ -4,10 +4,18 @@ import { FxInput } from "../../../components/FxInput";
 export var FxInputPlayground = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(FxInputPlayground, _React$Component);
 
-  function FxInputPlayground(props) {
+  function FxInputPlayground() {
     var _this;
 
-    _this = _React$Component.call(this, props) || 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.state = {
+      auto: true,
+      value: 'auto'
+    };
 
     _this.onValueChange = function (value) {
       _this.setState({
@@ -23,10 +31,6 @@ export var FxInputPlayground = /*#__PURE__*/function (_React$Component) {
       });
     };
 
-    _this.state = {
-      auto: true,
-      value: 'auto'
-    };
     return _this;
   }
 

package/internal/ThemePlayground/FxInputPlayground/FxInputPlayground.js.map

@@ -1 +1 @@
-{"version":3,"sources":["FxInputPlayground.tsx"],"names":["React","FxInput","FxInputPlayground","props","onValueChange","value","setState","auto","handleRestore","state","render","Component"],"mappings":"sEAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,OAAT,QAAwB,0BAAxB;;AAEA,WAAaC,iBAAb;AACE,6BAAYC,KAAZ,EAAuB;AACrB,wCAAMA,KAAN,UADqB;;;;;;;;;;;;;;;;;;;;;AAsBfC,IAAAA,aAtBe,GAsBC,UAACC,KAAD,EAAmB;AACzC,YAAKC,QAAL,CAAc,EAAED,KAAK,EAALA,KAAF,EAASE,IAAI,EAAE,KAAf,EAAd;AACD,KAxBsB;;AA0BfC,IAAAA,aA1Be,GA0BC,YAAM;AAC5B,YAAKF,QAAL,CAAc;AACZD,QAAAA,KAAK,EAAE,MADK;AAEZE,QAAAA,IAAI,EAAE,IAFM,EAAd;;AAID,KA/BsB,CAGrB,MAAKE,KAAL,GAAa,EACXF,IAAI,EAAE,IADK,EAEXF,KAAK,EAAE,MAFI,EAAb,CAHqB,aAOtB,CARH,gDAUSK,MAVT,GAUE,kBAA6B,CAC3B,oBACE,oBAAC,OAAD,IACE,IAAI,EAAE,KAAKD,KAAL,CAAWF,IADnB,EAEE,IAAI,EAAE,MAFR,EAGE,KAAK,EAAE,KAAKE,KAAL,CAAWJ,KAHpB,EAIE,SAAS,EAAE,KAAKG,aAJlB,EAKE,aAAa,EAAE,KAAKJ,aALtB,EAME,KAAK,EAAE,GANT,GADF,CAUD,CArBH,4BAAuCJ,KAAK,CAACW,SAA7C","sourcesContent":["import React from 'react';\n\nimport { FxInput } from '../../components/FxInput';\n\nexport class FxInputPlayground extends React.Component<{}, { value: string; auto: boolean }> {\n  constructor(props: {}) {\n    super(props);\n\n    this.state = {\n      auto: true,\n      value: 'auto',\n    };\n  }\n\n  public render(): JSX.Element {\n    return (\n      <FxInput\n        auto={this.state.auto}\n        type={'text'}\n        value={this.state.value}\n        onRestore={this.handleRestore}\n        onValueChange={this.onValueChange}\n        width={150}\n      />\n    );\n  }\n\n  private onValueChange = (value: string) => {\n    this.setState({ value, auto: false });\n  };\n\n  private handleRestore = () => {\n    this.setState({\n      value: 'auto',\n      auto: true,\n    });\n  };\n}\n"]}
+{"version":3,"sources":["FxInputPlayground.tsx"],"names":["React","FxInput","FxInputPlayground","state","auto","value","onValueChange","setState","handleRestore","render","Component"],"mappings":"sEAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,OAAT,QAAwB,0BAAxB;;;;;;AAMA,WAAaC,iBAAb;AACSC,IAAAA,KADT,GACyC;AACrCC,MAAAA,IAAI,EAAE,IAD+B;AAErCC,MAAAA,KAAK,EAAE,MAF8B,EADzC;;;;;;;;;;;;;;;;AAmBUC,IAAAA,aAnBV,GAmB0B,UAACD,KAAD,EAAmB;AACzC,YAAKE,QAAL,CAAc,EAAEF,KAAK,EAALA,KAAF,EAASD,IAAI,EAAE,KAAf,EAAd;AACD,KArBH;;AAuBUI,IAAAA,aAvBV,GAuB0B,YAAM;AAC5B,YAAKD,QAAL,CAAc;AACZF,QAAAA,KAAK,EAAE,MADK;AAEZD,QAAAA,IAAI,EAAE,IAFM,EAAd;;AAID,KA5BH,+DAMSK,MANT,GAME,kBAA6B,CAC3B,oBACE,oBAAC,OAAD,IACE,IAAI,EAAE,KAAKN,KAAL,CAAWC,IADnB,EAEE,IAAI,EAAE,MAFR,EAGE,KAAK,EAAE,KAAKD,KAAL,CAAWE,KAHpB,EAIE,SAAS,EAAE,KAAKG,aAJlB,EAKE,aAAa,EAAE,KAAKF,aALtB,EAME,KAAK,EAAE,GANT,GADF,CAUD,CAjBH,4BAAuCN,KAAK,CAACU,SAA7C","sourcesContent":["import React from 'react';\n\nimport { FxInput } from '../../components/FxInput';\n\ninterface FxInputPlaygroundState {\n  auto: boolean;\n  value: string;\n}\nexport class FxInputPlayground extends React.Component {\n  public state: FxInputPlaygroundState = {\n    auto: true,\n    value: 'auto',\n  };\n\n  public render(): JSX.Element {\n    return (\n      <FxInput\n        auto={this.state.auto}\n        type={'text'}\n        value={this.state.value}\n        onRestore={this.handleRestore}\n        onValueChange={this.onValueChange}\n        width={150}\n      />\n    );\n  }\n\n  private onValueChange = (value: string) => {\n    this.setState({ value, auto: false });\n  };\n\n  private handleRestore = () => {\n    this.setState({\n      value: 'auto',\n      auto: true,\n    });\n  };\n}\n"]}

package/internal/ThemePlayground/FxInputPlayground.d.ts

@@ -1,10 +1,12 @@
 import React from 'react';
-export declare class FxInputPlayground extends React.Component<{}, {
-    value: string;
+interface FxInputPlaygroundState {
     auto: boolean;
-}> {
-    constructor(props: {});
+    value: string;
+}
+export declare class FxInputPlayground extends React.Component {
+    state: FxInputPlaygroundState;
     render(): JSX.Element;
     private onValueChange;
     private handleRestore;
 }
+export {};

package/internal/ThemePlayground/HintPlayground/HintPlayground.js.map

@@ -1 +1 @@
-{"version":3,"sources":["HintPlayground.tsx"],"names":["React","Gapped","Button","Hint","Toast","HintPlayground","pushToast","push","pushToastWithAction","label","handler","render","Component"],"mappings":"sEAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,MAAT,QAAuB,yBAAvB;AACA,SAASC,MAAT,QAAuB,yBAAvB;AACA,SAASC,IAAT,QAAqB,uBAArB;AACA,SAASC,KAAT,QAAsB,wBAAtB;;AAEA,WAAaC,cAAb;;;;;;;;;;;;;;AAcUC,IAAAA,SAdV,GAcsB,YAAM;AACxBF,MAAAA,KAAK,CAACG,IAAN,CAAW,iBAAX;AACD,KAhBH;;AAkBUC,IAAAA,mBAlBV,GAkBgC,YAAM;AAClCJ,MAAAA,KAAK,CAACG,IAAN,CAAW,iBAAX,EAA8B,EAAEE,KAAK,EAAE,QAAT,EAAmBC,OAAO,EAAE,2BAAM,IAAN,EAA5B,EAA9B;AACD,KApBH,4DACSC,MADT,GACE,kBAAgB,CACd,oBACE,oBAAC,MAAD,IAAQ,GAAG,EAAE,EAAb,iBACE,oBAAC,IAAD,IAAM,MAAM,MAAZ,EAAa,MAAM,MAAnB,EAAoB,IAAI,EAAE,eAA1B,iBACE,oBAAC,MAAD,IAAQ,OAAO,EAAE,KAAKL,SAAtB,YADF,CADF,eAIE,oBAAC,IAAD,IAAM,MAAM,MAAZ,EAAa,MAAM,MAAnB,EAAoB,IAAI,EAAE,yBAA1B,EAAqD,GAAG,EAAE,OAA1D,iBACE,oBAAC,MAAD,IAAQ,OAAO,EAAE,KAAKE,mBAAtB,sBADF,CAJF,CADF,CAUD,CAZH,yBAAoCR,KAAK,CAACY,SAA1C","sourcesContent":["import React from 'react';\n\nimport { Gapped } from '../../components/Gapped';\nimport { Button } from '../../components/Button';\nimport { Hint } from '../../components/Hint';\nimport { Toast } from '../../components/Toast';\n\nexport class HintPlayground extends React.Component<{}, {}> {\n  public render() {\n    return (\n      <Gapped gap={10}>\n        <Hint manual opened text={'Показать тост'}>\n          <Button onClick={this.pushToast}>Toast</Button>\n        </Hint>\n        <Hint manual opened text={'Показать тост с ссылкой'} pos={'right'}>\n          <Button onClick={this.pushToastWithAction}>Toast with link</Button>\n        </Hint>\n      </Gapped>\n    );\n  }\n\n  private pushToast = () => {\n    Toast.push('Текст сообщения');\n  };\n\n  private pushToastWithAction = () => {\n    Toast.push('Текст сообщения', { label: 'Ссылка', handler: () => null });\n  };\n}\n"]}
+{"version":3,"sources":["HintPlayground.tsx"],"names":["React","Gapped","Button","Hint","Toast","HintPlayground","pushToast","push","pushToastWithAction","label","handler","render","Component"],"mappings":"sEAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,MAAT,QAAuB,yBAAvB;AACA,SAASC,MAAT,QAAuB,yBAAvB;AACA,SAASC,IAAT,QAAqB,uBAArB;AACA,SAASC,KAAT,QAAsB,wBAAtB;;AAEA,WAAaC,cAAb;;;;;;;;;;;;;;AAcUC,IAAAA,SAdV,GAcsB,YAAM;AACxBF,MAAAA,KAAK,CAACG,IAAN,CAAW,iBAAX;AACD,KAhBH;;AAkBUC,IAAAA,mBAlBV,GAkBgC,YAAM;AAClCJ,MAAAA,KAAK,CAACG,IAAN,CAAW,iBAAX,EAA8B,EAAEE,KAAK,EAAE,QAAT,EAAmBC,OAAO,EAAE,2BAAM,IAAN,EAA5B,EAA9B;AACD,KApBH,4DACSC,MADT,GACE,kBAAgB,CACd,oBACE,oBAAC,MAAD,IAAQ,GAAG,EAAE,EAAb,iBACE,oBAAC,IAAD,IAAM,MAAM,MAAZ,EAAa,MAAM,MAAnB,EAAoB,IAAI,EAAE,eAA1B,iBACE,oBAAC,MAAD,IAAQ,OAAO,EAAE,KAAKL,SAAtB,YADF,CADF,eAIE,oBAAC,IAAD,IAAM,MAAM,MAAZ,EAAa,MAAM,MAAnB,EAAoB,IAAI,EAAE,yBAA1B,EAAqD,GAAG,EAAE,OAA1D,iBACE,oBAAC,MAAD,IAAQ,OAAO,EAAE,KAAKE,mBAAtB,sBADF,CAJF,CADF,CAUD,CAZH,yBAAoCR,KAAK,CAACY,SAA1C","sourcesContent":["import React from 'react';\n\nimport { Gapped } from '../../components/Gapped';\nimport { Button } from '../../components/Button';\nimport { Hint } from '../../components/Hint';\nimport { Toast } from '../../components/Toast';\n\nexport class HintPlayground extends React.Component {\n  public render() {\n    return (\n      <Gapped gap={10}>\n        <Hint manual opened text={'Показать тост'}>\n          <Button onClick={this.pushToast}>Toast</Button>\n        </Hint>\n        <Hint manual opened text={'Показать тост с ссылкой'} pos={'right'}>\n          <Button onClick={this.pushToastWithAction}>Toast with link</Button>\n        </Hint>\n      </Gapped>\n    );\n  }\n\n  private pushToast = () => {\n    Toast.push('Текст сообщения');\n  };\n\n  private pushToastWithAction = () => {\n    Toast.push('Текст сообщения', { label: 'Ссылка', handler: () => null });\n  };\n}\n"]}

package/internal/ThemePlayground/HintPlayground.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-export declare class HintPlayground extends React.Component<{}, {}> {
+export declare class HintPlayground extends React.Component {
     render(): JSX.Element;
     private pushToast;
     private pushToastWithAction;

package/internal/ThemePlayground/PagingPlayground/PagingPlayground.js

@@ -13,7 +13,7 @@ export var PagingPlayground = /*#__PURE__*/function (_React$Component) {
 
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
     _this.state = {
-      active: 1
+      activePage: 1
     };
 
     _this.handlePageChange = function (pageNumber) {
@@ -29,7 +29,7 @@ export var PagingPlayground = /*#__PURE__*/function (_React$Component) {
 
   _proto.render = function render() {
     return /*#__PURE__*/React.createElement(Paging, {
-      activePage: this.state.active,
+      activePage: this.state.activePage,
       onPageChange: this.handlePageChange,
       pagesCount: 12
     });

package/internal/ThemePlayground/PagingPlayground/PagingPlayground.js.map

@@ -1 +1 @@
-{"version":3,"sources":["PagingPlayground.tsx"],"names":["React","Paging","PagingPlayground","state","active","handlePageChange","pageNumber","setState","render","Component"],"mappings":"sEAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,MAAT,QAAuB,yBAAvB;;AAEA,WAAaC,gBAAb;AACSC,IAAAA,KADT,GACiB;AACbC,MAAAA,MAAM,EAAE,CADK,EADjB;;;;;;;AASUC,IAAAA,gBATV,GAS6B,UAACC,UAAD,EAAwB;AACjD,YAAKC,QAAL,CAAc,EAAEH,MAAM,EAAEE,UAAV,EAAd;AACD,KAXH,8DAKSE,MALT,GAKE,kBAAgB,CACd,oBAAO,oBAAC,MAAD,IAAQ,UAAU,EAAE,KAAKL,KAAL,CAAWC,MAA/B,EAAuC,YAAY,EAAE,KAAKC,gBAA1D,EAA4E,UAAU,EAAE,EAAxF,GAAP,CACD,CAPH,2BAAsCL,KAAK,CAACS,SAA5C","sourcesContent":["import React from 'react';\n\nimport { Paging } from '../../components/Paging';\n\nexport class PagingPlayground extends React.Component<{}, { active: number }> {\n  public state = {\n    active: 1,\n  };\n\n  public render() {\n    return <Paging activePage={this.state.active} onPageChange={this.handlePageChange} pagesCount={12} />;\n  }\n\n  private handlePageChange = (pageNumber: number) => {\n    this.setState({ active: pageNumber });\n  };\n}\n"]}
+{"version":3,"sources":["PagingPlayground.tsx"],"names":["React","Paging","PagingPlayground","state","activePage","handlePageChange","pageNumber","setState","active","render","Component"],"mappings":"sEAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,MAAT,QAAuB,yBAAvB;;;;;AAKA,WAAaC,gBAAb;AACSC,IAAAA,KADT,GACwC;AACpCC,MAAAA,UAAU,EAAE,CADwB,EADxC;;;;;;;AASUC,IAAAA,gBATV,GAS6B,UAACC,UAAD,EAAwB;AACjD,YAAKC,QAAL,CAAc,EAAEC,MAAM,EAAEF,UAAV,EAAd;AACD,KAXH,8DAKSG,MALT,GAKE,kBAAgB,CACd,oBAAO,oBAAC,MAAD,IAAQ,UAAU,EAAE,KAAKN,KAAL,CAAWC,UAA/B,EAA2C,YAAY,EAAE,KAAKC,gBAA9D,EAAgF,UAAU,EAAE,EAA5F,GAAP,CACD,CAPH,2BAAsCL,KAAK,CAACU,SAA5C","sourcesContent":["import React from 'react';\n\nimport { Paging } from '../../components/Paging';\n\ninterface PagingPlaygroundState {\n  activePage: number;\n}\nexport class PagingPlayground extends React.Component {\n  public state: PagingPlaygroundState = {\n    activePage: 1,\n  };\n\n  public render() {\n    return <Paging activePage={this.state.activePage} onPageChange={this.handlePageChange} pagesCount={12} />;\n  }\n\n  private handlePageChange = (pageNumber: number) => {\n    this.setState({ active: pageNumber });\n  };\n}\n"]}

package/internal/ThemePlayground/PagingPlayground.d.ts

@@ -1,10 +1,10 @@
 import React from 'react';
-export declare class PagingPlayground extends React.Component<{}, {
-    active: number;
-}> {
-    state: {
-        active: number;
-    };
+interface PagingPlaygroundState {
+    activePage: number;
+}
+export declare class PagingPlayground extends React.Component {
+    state: PagingPlaygroundState;
     render(): JSX.Element;
     private handlePageChange;
 }
+export {};

package/internal/ThemePlayground/Playground/Playground.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Playground.tsx"],"names":["React","SearchIcon","LinkIcon","OkIcon","ErrorIcon","TrashIcon","HelpDotIcon","Button","Tabs","Gapped","Link","Input","ThemeContext","Tooltip","Sticky","isTestEnv","cx","FileUploader","ThemeType","TokenInputPlayground","DatePickerPlayground","TogglePlayground","SwitcherPlayground","FxInputPlayground","CurrencyInputPlayground","getComponentsFromPropsList","CheckboxPlayground","RadioPlayground","PagingPlayground","HintPlayground","ComponentsGroup","styles","SizesGroup","useSticky","Playground","stopEl","createRef","renderTabsGroup","getStickyStop","renderTabs","getCurrentTab","props","currentThemeType","Dark","FlatOld","DefaultOld","Theme2022","Theme2022Dark","Default","renderSizesGroup","theme","renderLinksGroup","propsList","icon","children","use","disabled","renderButtonsGroup","arrow","size","width","loading","renderInputsGroup","placeholder","error","warning","fromProps","renderTokenInputsGroup","renderOtherInputsGroup","renderSwitchersGroup","renderControlsGroup","renderHintsGroup","renderTooltip","tooltipContent","renderPaging","renderFileUploader","renderStickyStopElement","height","current","render","renderMain","wrapperClassName","playground","playgroundWrapper","onThemeChange","onEditLinkClick","tabsOuterWrapperStyle","background","bgDefault","tabsOuterWrapperClass","tabsWrapper","stickyTabsWrapper","tabsInnerWrapper","Component"],"mappings":"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","sourcesContent":["import React from 'react';\nimport SearchIcon from '@skbkontur/react-icons/Search';\nimport LinkIcon from '@skbkontur/react-icons/Link';\nimport OkIcon from '@skbkontur/react-icons/Ok';\nimport ErrorIcon from '@skbkontur/react-icons/Error';\nimport TrashIcon from '@skbkontur/react-icons/Trash';\nimport HelpDotIcon from '@skbkontur/react-icons/HelpDot';\n\nimport { Button, ButtonProps } from '../../components/Button';\nimport { Tabs } from '../../components/Tabs';\nimport { Gapped } from '../../components/Gapped';\nimport { Link, LinkProps } from '../../components/Link';\nimport { Input, InputProps } from '../../components/Input';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Tooltip } from '../../components/Tooltip';\nimport { Sticky } from '../../components/Sticky';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { cx } from '../../lib/theming/Emotion';\nimport { FileUploader } from '../../components/FileUploader';\n\nimport { ThemeType } from './constants';\nimport { TokenInputPlayground } from './TokenInputPlayground';\nimport { DatePickerPlayground } from './AnotherInputsPlayground';\nimport { TogglePlayground } from './TogglePlayground';\nimport { SwitcherPlayground } from './SwitcherPlayground';\nimport { FxInputPlayground } from './FxInputPlayground';\nimport { CurrencyInputPlayground } from './CurrencyInputPlayground';\nimport { getComponentsFromPropsList } from './helpers';\nimport { CheckboxPlayground } from './CheckboxPlayground';\nimport { RadioPlayground } from './RadioPlayground';\nimport { PagingPlayground } from './PagingPlayground';\nimport { HintPlayground } from './HintPlayground';\nimport { ComponentsGroup } from './ComponentsGroup';\nimport { styles } from './Playground.styles';\nimport { SizesGroup } from './SizesGroup';\n\nconst useSticky = !isTestEnv;\n\nexport interface PlaygroundProps {\n  currentThemeType: ThemeType;\n  onThemeChange: (value: string) => void;\n  onEditLinkClick: () => void;\n}\n\nexport class Playground extends React.Component<PlaygroundProps, {}> {\n  private theme!: Theme;\n  private stopEl = React.createRef<HTMLDivElement>();\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  private renderMain() {\n    const wrapperClassName = cx(styles.playground(), styles.playgroundWrapper(this.theme));\n    return (\n      <div className={wrapperClassName}>\n        <Gapped vertical gap={50}>\n          {this.renderTabsGroup()}\n          {this.renderSizesGroup()}\n          {this.renderLinksGroup()}\n          {this.renderButtonsGroup()}\n          {this.renderInputsGroup()}\n          {this.renderOtherInputsGroup()}\n          {this.renderTokenInputsGroup()}\n          {this.renderSwitchersGroup()}\n          {this.renderControlsGroup()}\n        </Gapped>\n        {this.renderStickyStopElement()}\n        <Gapped vertical gap={50}>\n          {this.renderHintsGroup()}\n          {this.renderTooltip()}\n          {this.renderPaging()}\n          {this.renderFileUploader()}\n        </Gapped>\n      </div>\n    );\n  }\n\n  private renderTabsGroup = () => {\n    return useSticky ? (\n      <Sticky side={'top'} getStop={this.getStickyStop}>\n        {this.renderTabs()}\n      </Sticky>\n    ) : (\n      this.renderTabs()\n    );\n  };\n\n  private renderTabs() {\n    const { onThemeChange, onEditLinkClick } = this.props;\n    const tabsOuterWrapperStyle = { background: this.theme.bgDefault };\n    const tabsOuterWrapperClass = cx({\n      [styles.tabsWrapper(this.theme)]: true,\n      [styles.stickyTabsWrapper(this.theme)]: useSticky,\n    });\n\n    return (\n      <div style={tabsOuterWrapperStyle} className={tabsOuterWrapperClass}>\n        <Gapped gap={40}>\n          <Tabs value={this.getCurrentTab()} onValueChange={onThemeChange} vertical={false}>\n            <div className={styles.tabsInnerWrapper(this.theme)}>\n              <Tabs.Tab id={ThemeType.Default}>Дефолтная</Tabs.Tab>\n              <Tabs.Tab id={ThemeType.Dark}>Темная</Tabs.Tab>\n              <Tabs.Tab id={ThemeType.DefaultOld}>Дефолтная 3.0</Tabs.Tab>\n              <Tabs.Tab id={ThemeType.FlatOld}>Плоская 3.0</Tabs.Tab>\n              <Tabs.Tab id={ThemeType.Theme2022}>Новая 2022</Tabs.Tab>\n              <Tabs.Tab id={ThemeType.Theme2022Dark}>Новая 2022 Тёмная</Tabs.Tab>\n            </div>\n          </Tabs>\n          <Link onClick={onEditLinkClick}>Настроить тему</Link>\n        </Gapped>\n      </div>\n    );\n  }\n\n  private getCurrentTab = () => {\n    switch (this.props.currentThemeType) {\n      case ThemeType.Dark:\n        return ThemeType.Dark;\n      case ThemeType.FlatOld:\n        return ThemeType.FlatOld;\n      case ThemeType.DefaultOld:\n        return ThemeType.DefaultOld;\n      case ThemeType.Theme2022:\n        return ThemeType.Theme2022;\n      case ThemeType.Theme2022Dark:\n        return ThemeType.Theme2022Dark;\n      default:\n        return ThemeType.Default;\n    }\n  };\n\n  private renderSizesGroup = () => {\n    return (\n      <ComponentsGroup title={'Размеры'} theme={this.theme}>\n        <SizesGroup size={'small'} />\n        <SizesGroup size={'medium'} />\n        <SizesGroup size={'large'} />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderLinksGroup = () => {\n    const propsList: LinkProps[] = [\n      { icon: <LinkIcon />, children: 'Enabled' },\n      { icon: <OkIcon />, use: 'success', children: 'Success' },\n      { icon: <ErrorIcon />, use: 'danger', children: 'Danger' },\n      { icon: <TrashIcon />, use: 'grayed', children: 'Grayed' },\n      { icon: <TrashIcon />, children: 'Disabled', disabled: true },\n    ];\n    return (\n      <ComponentsGroup title={'Ссылки'} theme={this.theme}>\n        <Gapped wrap verticalAlign=\"middle\" gap={10}>\n          {getComponentsFromPropsList(<Link />, propsList)}\n        </Gapped>\n      </ComponentsGroup>\n    );\n  };\n\n  private renderButtonsGroup = () => {\n    const propsList: ButtonProps[] = [\n      { children: 'Default' },\n      { children: 'Primary', use: 'primary' },\n      { children: 'Danger', use: 'danger' },\n      { children: 'Pay', use: 'pay' },\n      { children: 'Success', use: 'success' },\n      { children: 'Disabled', disabled: true },\n      { children: 'Back', arrow: 'left', size: 'medium', width: 110 },\n      { children: 'Forward', arrow: true, size: 'medium', use: 'primary', width: 110 },\n      { children: 'Loading', size: 'medium', loading: true },\n    ];\n\n    return (\n      <ComponentsGroup title={'Кнопки'} theme={this.theme}>\n        {getComponentsFromPropsList(<Button width={120} size={'small'} />, propsList)}\n      </ComponentsGroup>\n    );\n  };\n\n  private renderInputsGroup = () => {\n    const propsList: InputProps[] = [\n      { placeholder: 'Enabled' },\n      { placeholder: 'Error', error: true },\n      { placeholder: 'Warning', warning: true },\n      { placeholder: 'Disabled', disabled: true },\n    ];\n    const fromProps = getComponentsFromPropsList(<Input width={120} />, propsList);\n    return (\n      <ComponentsGroup title={'Поле ввода'} theme={this.theme}>\n        <Input width={380} prefix=\"https://kontur.ru/search?query=\" rightIcon={<SearchIcon />} />\n        <div>\n          <Gapped gap={10}>{fromProps}</Gapped>\n        </div>\n      </ComponentsGroup>\n    );\n  };\n\n  private renderTokenInputsGroup = () => {\n    return (\n      <ComponentsGroup title={'Поле с токеном'} theme={this.theme}>\n        <TokenInputPlayground />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderOtherInputsGroup = () => {\n    return (\n      <ComponentsGroup title={'Прочие поля'} theme={this.theme}>\n        <CurrencyInputPlayground />\n        <FxInputPlayground />\n        <DatePickerPlayground />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderSwitchersGroup = () => {\n    return (\n      <ComponentsGroup title={'Переключатели'} theme={this.theme}>\n        <SwitcherPlayground />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderControlsGroup = () => {\n    return (\n      <ComponentsGroup title={'Радио, чекбоксы'} theme={this.theme}>\n        <Gapped verticalAlign={'top'} gap={60}>\n          <CheckboxPlayground />\n          <RadioPlayground />\n          <TogglePlayground />\n        </Gapped>\n      </ComponentsGroup>\n    );\n  };\n\n  private renderHintsGroup = () => {\n    return (\n      <ComponentsGroup title={'Тултип'} theme={this.theme}>\n        <HintPlayground />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderTooltip = () => {\n    const tooltipContent = () => (\n      <div className={styles.tooltipContent()}>\n        {'Информация об ошибке. Короткий объясняющий текст и ссылка, если нужно'}\n      </div>\n    );\n    return (\n      <ComponentsGroup title={'Тултип'} theme={this.theme}>\n        <Tooltip render={tooltipContent} pos=\"right middle\" trigger={'opened'} disableAnimations>\n          <Link icon={<HelpDotIcon />} />\n        </Tooltip>\n      </ComponentsGroup>\n    );\n  };\n\n  private renderPaging = () => {\n    return (\n      <ComponentsGroup title={'Пейджинг'} theme={this.theme}>\n        <PagingPlayground />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderFileUploader = () => {\n    return (\n      <ComponentsGroup title={'FileUploader'} theme={this.theme}>\n        <FileUploader multiple />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderStickyStopElement = () => {\n    return <div ref={this.stopEl} style={{ height: 50 }} />;\n  };\n\n  private getStickyStop = () => this.stopEl.current;\n}\n"]}
+{"version":3,"sources":["Playground.tsx"],"names":["React","SearchIcon","LinkIcon","OkIcon","ErrorIcon","TrashIcon","HelpDotIcon","Button","Tabs","Gapped","Link","Input","ThemeContext","Tooltip","Sticky","isTestEnv","cx","FileUploader","ThemeType","TokenInputPlayground","DatePickerPlayground","TogglePlayground","SwitcherPlayground","FxInputPlayground","CurrencyInputPlayground","getComponentsFromPropsList","CheckboxPlayground","RadioPlayground","PagingPlayground","HintPlayground","ComponentsGroup","styles","SizesGroup","useSticky","Playground","stopEl","createRef","renderTabsGroup","getStickyStop","renderTabs","getCurrentTab","props","currentThemeType","Dark","FlatOld","DefaultOld","Theme2022","Theme2022Dark","Default","renderSizesGroup","theme","renderLinksGroup","propsList","icon","children","use","disabled","renderButtonsGroup","arrow","size","width","loading","renderInputsGroup","placeholder","error","warning","fromProps","renderTokenInputsGroup","renderOtherInputsGroup","renderSwitchersGroup","renderControlsGroup","renderHintsGroup","renderTooltip","tooltipContent","renderPaging","renderFileUploader","renderStickyStopElement","height","current","render","renderMain","wrapperClassName","playground","playgroundWrapper","onThemeChange","onEditLinkClick","tabsOuterWrapperStyle","background","bgDefault","tabsOuterWrapperClass","tabsWrapper","stickyTabsWrapper","tabsInnerWrapper","Component"],"mappings":"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","sourcesContent":["import React from 'react';\nimport SearchIcon from '@skbkontur/react-icons/Search';\nimport LinkIcon from '@skbkontur/react-icons/Link';\nimport OkIcon from '@skbkontur/react-icons/Ok';\nimport ErrorIcon from '@skbkontur/react-icons/Error';\nimport TrashIcon from '@skbkontur/react-icons/Trash';\nimport HelpDotIcon from '@skbkontur/react-icons/HelpDot';\n\nimport { Button, ButtonProps } from '../../components/Button';\nimport { Tabs } from '../../components/Tabs';\nimport { Gapped } from '../../components/Gapped';\nimport { Link, LinkProps } from '../../components/Link';\nimport { Input, InputProps } from '../../components/Input';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Tooltip } from '../../components/Tooltip';\nimport { Sticky } from '../../components/Sticky';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { cx } from '../../lib/theming/Emotion';\nimport { FileUploader } from '../../components/FileUploader';\n\nimport { ThemeType } from './constants';\nimport { TokenInputPlayground } from './TokenInputPlayground';\nimport { DatePickerPlayground } from './AnotherInputsPlayground';\nimport { TogglePlayground } from './TogglePlayground';\nimport { SwitcherPlayground } from './SwitcherPlayground';\nimport { FxInputPlayground } from './FxInputPlayground';\nimport { CurrencyInputPlayground } from './CurrencyInputPlayground';\nimport { getComponentsFromPropsList } from './helpers';\nimport { CheckboxPlayground } from './CheckboxPlayground';\nimport { RadioPlayground } from './RadioPlayground';\nimport { PagingPlayground } from './PagingPlayground';\nimport { HintPlayground } from './HintPlayground';\nimport { ComponentsGroup } from './ComponentsGroup';\nimport { styles } from './Playground.styles';\nimport { SizesGroup } from './SizesGroup';\n\nconst useSticky = !isTestEnv;\n\nexport interface PlaygroundProps {\n  currentThemeType: ThemeType;\n  onThemeChange: (value: string) => void;\n  onEditLinkClick: () => void;\n}\n\nexport class Playground extends React.Component<PlaygroundProps> {\n  private theme!: Theme;\n  private stopEl = React.createRef<HTMLDivElement>();\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  private renderMain() {\n    const wrapperClassName = cx(styles.playground(), styles.playgroundWrapper(this.theme));\n    return (\n      <div className={wrapperClassName}>\n        <Gapped vertical gap={50}>\n          {this.renderTabsGroup()}\n          {this.renderSizesGroup()}\n          {this.renderLinksGroup()}\n          {this.renderButtonsGroup()}\n          {this.renderInputsGroup()}\n          {this.renderOtherInputsGroup()}\n          {this.renderTokenInputsGroup()}\n          {this.renderSwitchersGroup()}\n          {this.renderControlsGroup()}\n        </Gapped>\n        {this.renderStickyStopElement()}\n        <Gapped vertical gap={50}>\n          {this.renderHintsGroup()}\n          {this.renderTooltip()}\n          {this.renderPaging()}\n          {this.renderFileUploader()}\n        </Gapped>\n      </div>\n    );\n  }\n\n  private renderTabsGroup = () => {\n    return useSticky ? (\n      <Sticky side={'top'} getStop={this.getStickyStop}>\n        {this.renderTabs()}\n      </Sticky>\n    ) : (\n      this.renderTabs()\n    );\n  };\n\n  private renderTabs() {\n    const { onThemeChange, onEditLinkClick } = this.props;\n    const tabsOuterWrapperStyle = { background: this.theme.bgDefault };\n    const tabsOuterWrapperClass = cx({\n      [styles.tabsWrapper(this.theme)]: true,\n      [styles.stickyTabsWrapper(this.theme)]: useSticky,\n    });\n\n    return (\n      <div style={tabsOuterWrapperStyle} className={tabsOuterWrapperClass}>\n        <Gapped gap={40}>\n          <Tabs value={this.getCurrentTab()} onValueChange={onThemeChange} vertical={false}>\n            <div className={styles.tabsInnerWrapper(this.theme)}>\n              <Tabs.Tab id={ThemeType.Default}>Дефолтная</Tabs.Tab>\n              <Tabs.Tab id={ThemeType.Dark}>Темная</Tabs.Tab>\n              <Tabs.Tab id={ThemeType.DefaultOld}>Дефолтная 3.0</Tabs.Tab>\n              <Tabs.Tab id={ThemeType.FlatOld}>Плоская 3.0</Tabs.Tab>\n              <Tabs.Tab id={ThemeType.Theme2022}>Новая 2022</Tabs.Tab>\n              <Tabs.Tab id={ThemeType.Theme2022Dark}>Новая 2022 Тёмная</Tabs.Tab>\n            </div>\n          </Tabs>\n          <Link onClick={onEditLinkClick}>Настроить тему</Link>\n        </Gapped>\n      </div>\n    );\n  }\n\n  private getCurrentTab = () => {\n    switch (this.props.currentThemeType) {\n      case ThemeType.Dark:\n        return ThemeType.Dark;\n      case ThemeType.FlatOld:\n        return ThemeType.FlatOld;\n      case ThemeType.DefaultOld:\n        return ThemeType.DefaultOld;\n      case ThemeType.Theme2022:\n        return ThemeType.Theme2022;\n      case ThemeType.Theme2022Dark:\n        return ThemeType.Theme2022Dark;\n      default:\n        return ThemeType.Default;\n    }\n  };\n\n  private renderSizesGroup = () => {\n    return (\n      <ComponentsGroup title={'Размеры'} theme={this.theme}>\n        <SizesGroup size={'small'} />\n        <SizesGroup size={'medium'} />\n        <SizesGroup size={'large'} />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderLinksGroup = () => {\n    const propsList: LinkProps[] = [\n      { icon: <LinkIcon />, children: 'Enabled' },\n      { icon: <OkIcon />, use: 'success', children: 'Success' },\n      { icon: <ErrorIcon />, use: 'danger', children: 'Danger' },\n      { icon: <TrashIcon />, use: 'grayed', children: 'Grayed' },\n      { icon: <TrashIcon />, children: 'Disabled', disabled: true },\n    ];\n    return (\n      <ComponentsGroup title={'Ссылки'} theme={this.theme}>\n        <Gapped wrap verticalAlign=\"middle\" gap={10}>\n          {getComponentsFromPropsList(<Link />, propsList)}\n        </Gapped>\n      </ComponentsGroup>\n    );\n  };\n\n  private renderButtonsGroup = () => {\n    const propsList: ButtonProps[] = [\n      { children: 'Default' },\n      { children: 'Primary', use: 'primary' },\n      { children: 'Danger', use: 'danger' },\n      { children: 'Pay', use: 'pay' },\n      { children: 'Success', use: 'success' },\n      { children: 'Disabled', disabled: true },\n      { children: 'Back', arrow: 'left', size: 'medium', width: 110 },\n      { children: 'Forward', arrow: true, size: 'medium', use: 'primary', width: 110 },\n      { children: 'Loading', size: 'medium', loading: true },\n    ];\n\n    return (\n      <ComponentsGroup title={'Кнопки'} theme={this.theme}>\n        {getComponentsFromPropsList(<Button width={120} size={'small'} />, propsList)}\n      </ComponentsGroup>\n    );\n  };\n\n  private renderInputsGroup = () => {\n    const propsList: InputProps[] = [\n      { placeholder: 'Enabled' },\n      { placeholder: 'Error', error: true },\n      { placeholder: 'Warning', warning: true },\n      { placeholder: 'Disabled', disabled: true },\n    ];\n    const fromProps = getComponentsFromPropsList(<Input width={120} />, propsList);\n    return (\n      <ComponentsGroup title={'Поле ввода'} theme={this.theme}>\n        <Input width={380} prefix=\"https://kontur.ru/search?query=\" rightIcon={<SearchIcon />} />\n        <div>\n          <Gapped gap={10}>{fromProps}</Gapped>\n        </div>\n      </ComponentsGroup>\n    );\n  };\n\n  private renderTokenInputsGroup = () => {\n    return (\n      <ComponentsGroup title={'Поле с токеном'} theme={this.theme}>\n        <TokenInputPlayground />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderOtherInputsGroup = () => {\n    return (\n      <ComponentsGroup title={'Прочие поля'} theme={this.theme}>\n        <CurrencyInputPlayground />\n        <FxInputPlayground />\n        <DatePickerPlayground />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderSwitchersGroup = () => {\n    return (\n      <ComponentsGroup title={'Переключатели'} theme={this.theme}>\n        <SwitcherPlayground />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderControlsGroup = () => {\n    return (\n      <ComponentsGroup title={'Радио, чекбоксы'} theme={this.theme}>\n        <Gapped verticalAlign={'top'} gap={60}>\n          <CheckboxPlayground />\n          <RadioPlayground />\n          <TogglePlayground />\n        </Gapped>\n      </ComponentsGroup>\n    );\n  };\n\n  private renderHintsGroup = () => {\n    return (\n      <ComponentsGroup title={'Тултип'} theme={this.theme}>\n        <HintPlayground />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderTooltip = () => {\n    const tooltipContent = () => (\n      <div className={styles.tooltipContent()}>\n        {'Информация об ошибке. Короткий объясняющий текст и ссылка, если нужно'}\n      </div>\n    );\n    return (\n      <ComponentsGroup title={'Тултип'} theme={this.theme}>\n        <Tooltip render={tooltipContent} pos=\"right middle\" trigger={'opened'} disableAnimations>\n          <Link icon={<HelpDotIcon />} />\n        </Tooltip>\n      </ComponentsGroup>\n    );\n  };\n\n  private renderPaging = () => {\n    return (\n      <ComponentsGroup title={'Пейджинг'} theme={this.theme}>\n        <PagingPlayground />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderFileUploader = () => {\n    return (\n      <ComponentsGroup title={'FileUploader'} theme={this.theme}>\n        <FileUploader multiple />\n      </ComponentsGroup>\n    );\n  };\n\n  private renderStickyStopElement = () => {\n    return <div ref={this.stopEl} style={{ height: 50 }} />;\n  };\n\n  private getStickyStop = () => this.stopEl.current;\n}\n"]}

package/internal/ThemePlayground/Playground.d.ts

@@ -5,7 +5,7 @@ export interface PlaygroundProps {
     onThemeChange: (value: string) => void;
     onEditLinkClick: () => void;
 }
-export declare class Playground extends React.Component<PlaygroundProps, {}> {
+export declare class Playground extends React.Component<PlaygroundProps> {
     private theme;
     private stopEl;
     render(): JSX.Element;

package/internal/ThemePlayground/SelectPlayground/SelectPlayground.js.map

@@ -1 +1 @@
-{"version":3,"sources":["SelectPlayground.tsx"],"names":["React","Select","SelectPlayground","state","value","capitalize","props","size","selectItems","handleChange","setState","render","Component","input","charAt","toUpperCase","slice"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,MAAT,QAAoC,yBAApC;;AAEA,WAAaC,gBAAb;AACSC,IAAAA,KADT,GACiB;AACbC,MAAAA,KAAK,EAAEC,UAAU,CAAC,MAAKC,KAAL,CAAWC,IAAZ,CADJ,EADjB;;AAImBC,IAAAA,WAJnB,GAIiC,CAAC,OAAD,EAAU,QAAV,EAAoB,OAApB,CAJjC;;;;;;;;;;;;;AAiBUC,IAAAA,YAjBV,GAiByB,UAACL,KAAD,EAAmB;AACxC,YAAKM,QAAL,CAAc;AACZN,QAAAA,KAAK,EAALA,KADY,EAAd;;AAGD,KArBH,8DAMSO,MANT,GAME,kBAAgB,CACd,oBACE,oBAAC,MAAD,eACM,KAAKL,KADX,IAEE,KAAK,EAAE,KAAKH,KAAL,CAAWC,KAFpB,EAGE,KAAK,EAAE,KAAKI,WAHd,EAIE,aAAa,EAAE,KAAKC,YAJtB,IADF,CAQD,CAfH,2BAAsCT,KAAK,CAACY,SAA5C;;;AAwBA,IAAMP,UAAU,GAAG,SAAbA,UAAa,CAACQ,KAAD,EAAwB,KAAvBA,KAAuB,cAAvBA,KAAuB,GAAf,EAAe;AACzC,SAAOA,KAAK,CAACC,MAAN,CAAa,CAAb,EAAgBC,WAAhB,KAAgCF,KAAK,CAACG,KAAN,CAAY,CAAZ,CAAvC;AACD,CAFD","sourcesContent":["import React from 'react';\n\nimport { Select, SelectProps } from '../../components/Select';\n\nexport class SelectPlayground extends React.Component<SelectProps<string, string>, { value: string | undefined }> {\n  public state = {\n    value: capitalize(this.props.size),\n  };\n  private readonly selectItems = ['Small', 'Medium', 'Large'];\n\n  public render() {\n    return (\n      <Select<string, string>\n        {...this.props}\n        value={this.state.value}\n        items={this.selectItems}\n        onValueChange={this.handleChange}\n      />\n    );\n  }\n\n  private handleChange = (value: string) => {\n    this.setState({\n      value,\n    });\n  };\n}\n\nconst capitalize = (input = ''): string => {\n  return input.charAt(0).toUpperCase() + input.slice(1);\n};\n"]}
+{"version":3,"sources":["SelectPlayground.tsx"],"names":["React","Select","SelectPlayground","state","value","capitalize","props","size","selectItems","handleChange","setState","render","Component","input","charAt","toUpperCase","slice"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,MAAT,QAAoC,yBAApC;;;;;;;;AAQA,WAAaC,gBAAb;AACSC,IAAAA,KADT,GACwC;AACpCC,MAAAA,KAAK,EAAEC,UAAU,CAAC,MAAKC,KAAL,CAAWC,IAAZ,CADmB,EADxC;;AAImBC,IAAAA,WAJnB,GAIiC,CAAC,OAAD,EAAU,QAAV,EAAoB,OAApB,CAJjC;;;;;;;;;;;;;AAiBUC,IAAAA,YAjBV,GAiByB,UAACL,KAAD,EAAmB;AACxC,YAAKM,QAAL,CAAc;AACZN,QAAAA,KAAK,EAALA,KADY,EAAd;;AAGD,KArBH,8DAMSO,MANT,GAME,kBAAgB,CACd,oBACE,oBAAC,MAAD,eACM,KAAKL,KADX,IAEE,KAAK,EAAE,KAAKH,KAAL,CAAWC,KAFpB,EAGE,KAAK,EAAE,KAAKI,WAHd,EAIE,aAAa,EAAE,KAAKC,YAJtB,IADF,CAQD,CAfH,2BAAsCT,KAAK,CAACY,SAA5C;;;AAwBA,IAAMP,UAAU,GAAG,SAAbA,UAAa,CAACQ,KAAD,EAAwB,KAAvBA,KAAuB,cAAvBA,KAAuB,GAAf,EAAe;AACzC,SAAOA,KAAK,CAACC,MAAN,CAAa,CAAb,EAAgBC,WAAhB,KAAgCF,KAAK,CAACG,KAAN,CAAY,CAAZ,CAAvC;AACD,CAFD","sourcesContent":["import React from 'react';\n\nimport { Select, SelectProps } from '../../components/Select';\n\ntype SelectPlaygroundValue = string;\ntype SelectPlaygroundItem = string;\ntype SelectPlaygroundProps = SelectProps<SelectPlaygroundValue, SelectPlaygroundItem>;\ninterface SelectPlaygroundState {\n  value: string;\n}\nexport class SelectPlayground extends React.Component<SelectPlaygroundProps> {\n  public state: SelectPlaygroundState = {\n    value: capitalize(this.props.size),\n  };\n  private readonly selectItems = ['Small', 'Medium', 'Large'];\n\n  public render() {\n    return (\n      <Select<SelectPlaygroundValue, SelectPlaygroundItem>\n        {...this.props}\n        value={this.state.value}\n        items={this.selectItems}\n        onValueChange={this.handleChange}\n      />\n    );\n  }\n\n  private handleChange = (value: string) => {\n    this.setState({\n      value,\n    });\n  };\n}\n\nconst capitalize = (input = ''): string => {\n  return input.charAt(0).toUpperCase() + input.slice(1);\n};\n"]}