@skbkontur/react-ui 0.0.0-0fe669bb2d → 0.0.0-0ffbe8b468

package/cjs/components/Tooltip/Tooltip.styles.js

@@ -3,16 +3,16 @@
 
 var styles = (0, _Emotion.memoizeStyle)({
   cross: function cross(t) {
-    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      cursor: pointer;\n      height: 8px;\n      line-height: 0;\n      padding: ", ";\n      position: absolute;\n      right: 0;\n      top: 0;\n      width: 8px;\n      box-sizing: content-box;\n\n      &:hover {\n        color: ", ";\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      cursor: pointer;\n      height: ", ";\n      line-height: 0;\n      padding: ", ";\n      position: absolute;\n      right: 0;\n      top: 0;\n      width: ", ";\n      box-sizing: content-box;\n\n      &:hover {\n        color: ", ";\n      }\n    "])),
     t.tooltipCloseBtnColor,
 
-
+    t.tooltipCloseBtnSide,
 
     t.tooltipCloseBtnPadding,
 
 
 
-
+    t.tooltipCloseBtnSide,
 
 
 

package/cjs/components/Tooltip/Tooltip.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Tooltip.styles.ts"],"names":["styles","cross","t","css","tooltipCloseBtnColor","tooltipCloseBtnPadding","tooltipCloseBtnHoverColor","tooltipContent","tooltipTextColor","tooltipPaddingY","tooltipPaddingX","tooltipFontSize","tooltipLineHeight"],"mappings":"4QAAA,oD;;;AAGO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,KADiC,iBAC3BC,CAD2B,EACjB;AACd,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACE,oBADb;;;;AAKaF,IAAAA,CAAC,CAACG,sBALf;;;;;;;;AAaaH,IAAAA,CAAC,CAACI,yBAbf;;;AAgBD,GAlBgC;;AAoBjCC,EAAAA,cApBiC,0BAoBlBL,CApBkB,EAoBR;AACvB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACM,gBADb;AAEaN,IAAAA,CAAC,CAACO,eAFf,EAEkCP,CAAC,CAACQ,eAFpC;;AAIeR,IAAAA,CAAC,CAACS,eAJjB;AAKiBT,IAAAA,CAAC,CAACU,iBALnB;;AAOD,GA5BgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  cross(t: Theme) {\n    return css`\n      color: ${t.tooltipCloseBtnColor};\n      cursor: pointer;\n      height: 8px;\n      line-height: 0;\n      padding: ${t.tooltipCloseBtnPadding};\n      position: absolute;\n      right: 0;\n      top: 0;\n      width: 8px;\n      box-sizing: content-box;\n\n      &:hover {\n        color: ${t.tooltipCloseBtnHoverColor};\n      }\n    `;\n  },\n\n  tooltipContent(t: Theme) {\n    return css`\n      color: ${t.tooltipTextColor};\n      padding: ${t.tooltipPaddingY} ${t.tooltipPaddingX};\n      position: relative;\n      font-size: ${t.tooltipFontSize};\n      line-height: ${t.tooltipLineHeight};\n    `;\n  },\n});\n"]}
+{"version":3,"sources":["Tooltip.styles.ts"],"names":["styles","cross","t","css","tooltipCloseBtnColor","tooltipCloseBtnSide","tooltipCloseBtnPadding","tooltipCloseBtnHoverColor","tooltipContent","tooltipTextColor","tooltipPaddingY","tooltipPaddingX","tooltipFontSize","tooltipLineHeight"],"mappings":"4QAAA,oD;;;AAGO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,KADiC,iBAC3BC,CAD2B,EACjB;AACd,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACE,oBADb;;AAGYF,IAAAA,CAAC,CAACG,mBAHd;;AAKaH,IAAAA,CAAC,CAACI,sBALf;;;;AASWJ,IAAAA,CAAC,CAACG,mBATb;;;;AAaaH,IAAAA,CAAC,CAACK,yBAbf;;;AAgBD,GAlBgC;;AAoBjCC,EAAAA,cApBiC,0BAoBlBN,CApBkB,EAoBR;AACvB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACO,gBADb;AAEaP,IAAAA,CAAC,CAACQ,eAFf,EAEkCR,CAAC,CAACS,eAFpC;;AAIeT,IAAAA,CAAC,CAACU,eAJjB;AAKiBV,IAAAA,CAAC,CAACW,iBALnB;;AAOD,GA5BgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  cross(t: Theme) {\n    return css`\n      color: ${t.tooltipCloseBtnColor};\n      cursor: pointer;\n      height: ${t.tooltipCloseBtnSide};\n      line-height: 0;\n      padding: ${t.tooltipCloseBtnPadding};\n      position: absolute;\n      right: 0;\n      top: 0;\n      width: ${t.tooltipCloseBtnSide};\n      box-sizing: content-box;\n\n      &:hover {\n        color: ${t.tooltipCloseBtnHoverColor};\n      }\n    `;\n  },\n\n  tooltipContent(t: Theme) {\n    return css`\n      color: ${t.tooltipTextColor};\n      padding: ${t.tooltipPaddingY} ${t.tooltipPaddingX};\n      position: relative;\n      font-size: ${t.tooltipFontSize};\n      line-height: ${t.tooltipLineHeight};\n    `;\n  },\n});\n"]}

package/cjs/components/TooltipMenu/TooltipMenu.d.ts

@@ -1,11 +1,11 @@
-import React from 'react';
+import React, { AriaAttributes } from 'react';
 import { PopupMenuProps } from '../../internal/PopupMenu';
 import { MenuItemProps } from '../MenuItem';
 import { MenuHeaderProps } from '../MenuHeader';
 import { PopupPositionsType } from '../../internal/Popup';
 import { CommonProps } from '../../internal/CommonWrapper';
 export declare type TooltipMenuChildType = React.ReactElement<MenuItemProps | unknown | MenuHeaderProps>;
-export interface TooltipMenuProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose'> {
+export interface TooltipMenuProps extends Pick<AriaAttributes, 'aria-label'>, CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'preventIconsOffset'> {
     children?: TooltipMenuChildType | TooltipMenuChildType[];
     /** Максимальная высота меню */
     menuMaxHeight?: number | string;
@@ -21,13 +21,13 @@ export interface TooltipMenuProps extends CommonProps, Pick<PopupMenuProps, 'onO
     /**
      * Произвольный элемент, который будет отрендерен в шапке меню.
      *
-     * _Примечание_: контрол [`MenuHeader`](#/Components/MenuHeader) передаётся только в `children` меню-контролов. Не стоит передавать `MenuHeader` в `header`.
+     * _Примечание_: контрол [MenuHeader](#/Components/MenuHeader) передаётся только в `children` меню-контролов. Не стоит передавать `MenuHeader` в `header`.
      */
     header?: React.ReactNode;
     /**
      * Произвольный элемент, который будет отрендерен в подвале меню.
      *
-     * Перед элементом переданным в `footer` будет отрендерен [`MenuSeparator`](#/Components/MenuSeparator).
+     * Перед элементом переданным в `footer` будет отрендерен [MenuSeparator](#/Components/MenuSeparator).
      */
     footer?: React.ReactNode;
     /**  Список позиций доступных для расположения выпадашки относительно `caption`.

package/cjs/components/TooltipMenu/TooltipMenu.js

@@ -47,6 +47,9 @@ var _createPropsGetter = require("../../lib/createPropsGetter");var _class, _cla
 
 
 
+
+
+
 
 
 
@@ -97,7 +100,8 @@ TooltipMenu = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/f
             {
               popupPinOffset: theme.tooltipMenuPinOffset,
               popupMargin: theme.tooltipMenuMargin,
-              popupPinSize: theme.tooltipMenuPinSize },
+              popupPinSize: theme.tooltipMenuPinSize,
+              menuScrollContainerContentWrapperPaddingY: theme.menuLegacyPaddingY },
 
             theme) },
 
@@ -115,20 +119,24 @@ TooltipMenu = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/f
       return null;
     }
 
+    var _this$getProps = this.getProps(),disableAnimations = _this$getProps.disableAnimations;
+
     return /*#__PURE__*/(
       _react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/
       _react.default.createElement(_PopupMenu.PopupMenu, {
+        "aria-label": this.props['aria-label'],
         "data-tid": TooltipMenuDataTids.root,
         menuMaxHeight: this.props.menuMaxHeight,
         menuWidth: this.props.menuWidth,
         caption: this.props.caption,
         header: this.props.header,
         footer: this.props.footer,
+        preventIconsOffset: this.props.preventIconsOffset,
         positions: this.props.positions,
         onOpen: this.props.onOpen,
         onClose: this.props.onClose,
         popupHasPin: true,
-        disableAnimations: this.getProps().disableAnimations },
+        disableAnimations: disableAnimations },
 
       this.props.children)));
 

package/cjs/components/TooltipMenu/TooltipMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["TooltipMenu.tsx"],"names":["TooltipMenuDataTids","root","TooltipMenu","rootNode","props","getProps","defaultProps","caption","isProductionEnv","Error","render","theme","ThemeFactory","create","popupPinOffset","tooltipMenuPinOffset","popupMargin","tooltipMenuMargin","popupPinSize","tooltipMenuPinSize","renderMain","setRootNode","menuMaxHeight","menuWidth","header","footer","positions","onOpen","onClose","disableAnimations","children","React","Component","__KONTUR_REACT_UI__","isTestEnv"],"mappings":"uWAAA;;AAEA;AACA;AACA;;AAEA;;;AAGA;AACA;AACA,gE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B,C;;;;;AAMP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,G;;AAEaC,W,OADZC,kB;;;;;;;;;;AAWC,uBAAYC,KAAZ,EAAqC;AACnC,wCAAMA,KAAN,UADmC,MAF7BC,QAE6B,GAFlB,0CAAkBH,WAAW,CAACI,YAA9B,CAEkB;;AAGnC,QAAI,CAACF,KAAK,CAACG,OAAP,IAAkB,CAACC,mCAAvB,EAAwC;AACtC,YAAM,IAAIC,KAAJ,CAAU,+BAAV,CAAN;AACD,KALkC;AAMpC,G;;AAEMC,EAAAA,M,GAAP,kBAAgB;AACd;AACE,mCAAC,0BAAD,CAAc,QAAd;AACG,gBAACC,KAAD,EAAW;AACV;AACE,uCAAC,0BAAD,CAAc,QAAd;AACE,YAAA,KAAK,EAAEC,2BAAaC,MAAb;AACL;AACEC,cAAAA,cAAc,EAAEH,KAAK,CAACI,oBADxB;AAEEC,cAAAA,WAAW,EAAEL,KAAK,CAACM,iBAFrB;AAGEC,cAAAA,YAAY,EAAEP,KAAK,CAACQ,kBAHtB,EADK;;AAMLR,YAAAA,KANK,CADT;;;AAUG,UAAA,MAAI,CAACS,UAAL,EAVH,CADF;;;AAcD,OAhBH,CADF;;;AAoBD,G;;AAEMA,EAAAA,U,GAAP,sBAAoB;AAClB,QAAI,CAAC,KAAKhB,KAAL,CAAWG,OAAhB,EAAyB;AACvB,aAAO,IAAP;AACD;;AAED;AACE,mCAAC,4BAAD,2BAAe,WAAW,EAAE,KAAKc,WAAjC,IAAkD,KAAKjB,KAAvD;AACE,mCAAC,oBAAD;AACE,oBAAUJ,mBAAmB,CAACC,IADhC;AAEE,QAAA,aAAa,EAAE,KAAKG,KAAL,CAAWkB,aAF5B;AAGE,QAAA,SAAS,EAAE,KAAKlB,KAAL,CAAWmB,SAHxB;AAIE,QAAA,OAAO,EAAE,KAAKnB,KAAL,CAAWG,OAJtB;AAKE,QAAA,MAAM,EAAE,KAAKH,KAAL,CAAWoB,MALrB;AAME,QAAA,MAAM,EAAE,KAAKpB,KAAL,CAAWqB,MANrB;AAOE,QAAA,SAAS,EAAE,KAAKrB,KAAL,CAAWsB,SAPxB;AAQE,QAAA,MAAM,EAAE,KAAKtB,KAAL,CAAWuB,MARrB;AASE,QAAA,OAAO,EAAE,KAAKvB,KAAL,CAAWwB,OATtB;AAUE,QAAA,WAAW,MAVb;AAWE,QAAA,iBAAiB,EAAE,KAAKvB,QAAL,GAAgBwB,iBAXrC;;AAaG,WAAKzB,KAAL,CAAW0B,QAbd,CADF,CADF;;;;AAmBD,G,sBAjE8BC,eAAMC,S,WACvBC,mB,GAAsB,a,UAGtB3B,Y,GAA6B,EACzCuB,iBAAiB,EAAEK,6BADsB,E","sourcesContent":["import React from 'react';\n\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { PopupMenu, PopupMenuProps } from '../../internal/PopupMenu';\nimport { MenuItemProps } from '../MenuItem';\nimport { isProductionEnv, isTestEnv } from '../../lib/currentEnvironment';\nimport { MenuHeaderProps } from '../MenuHeader';\nimport { PopupPositionsType } from '../../internal/Popup';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nexport type TooltipMenuChildType = React.ReactElement<MenuItemProps | unknown | MenuHeaderProps>;\n\nexport interface TooltipMenuProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose'> {\n  children?: TooltipMenuChildType | TooltipMenuChildType[];\n  /** Максимальная высота меню */\n  menuMaxHeight?: number | string;\n  /** Ширина меню */\n  menuWidth?: number | string;\n  /**\n   * Элемент или функция возвращающая элемент,\n   * если передана, используется вместо `caption`,\n   * в таком случае управлять открытием и закрытием меню\n   * придется в этой функции\n   */\n  caption: PopupMenuProps['caption'];\n  /**\n   * Произвольный элемент, который будет отрендерен в шапке меню.\n   *\n   * _Примечание_: контрол [`MenuHeader`](#/Components/MenuHeader) передаётся только в `children` меню-контролов. Не стоит передавать `MenuHeader` в `header`.\n   */\n  header?: React.ReactNode;\n  /**\n   * Произвольный элемент, который будет отрендерен в подвале меню.\n   *\n   * Перед элементом переданным в `footer` будет отрендерен [`MenuSeparator`](#/Components/MenuSeparator).\n   */\n  footer?: React.ReactNode;\n  /**  Список позиций доступных для расположения выпадашки относительно `caption`.\n   *\n   * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n   *\n   * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n   */\n  positions?: PopupPositionsType[];\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations?: boolean;\n}\n\nexport const TooltipMenuDataTids = {\n  root: 'TooltipMenu__root',\n} as const;\n\ntype DefaultProps = Required<Pick<TooltipMenuProps, 'disableAnimations'>>;\n\n/**\n * Меню, раскрывающееся по клику на переданный в `caption` элемент.\n *\n * Положение меню задаётся с помощью массива `positions` и работает так:\n * первое значение в массиве - дефолтная позиция, меню раскроется на этой позиции, если оно не будет выходить за пределы `viewport`,\n * если раскрыться в дефолтной позиции не получится - будет использована следующая позиция, и так далее, пока не будет достигнут конец массива. Если все положения из списка будут выходить за пределы `viewport`, в качестве положения будет использовано первое значение в массиве.\n *\n * Если меню должно раскрываться только в одну сторону - массив `positions` должен содержать только один элемент: сторону, в которую должно открываться меню.\n *\n * Если массив `positions` не передан (или передан пустой массив), будут использованы всевозможные значения.\n */\n@rootNode\nexport class TooltipMenu extends React.Component<TooltipMenuProps> {\n  public static __KONTUR_REACT_UI__ = 'TooltipMenu';\n  private setRootNode!: TSetRootNode;\n\n  public static defaultProps: DefaultProps = {\n    disableAnimations: isTestEnv,\n  };\n\n  private getProps = createPropsGetter(TooltipMenu.defaultProps);\n\n  constructor(props: TooltipMenuProps) {\n    super(props);\n\n    if (!props.caption && !isProductionEnv) {\n      throw new Error('Prop \"caption\" is required!!!');\n    }\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          return (\n            <ThemeContext.Provider\n              value={ThemeFactory.create(\n                {\n                  popupPinOffset: theme.tooltipMenuPinOffset,\n                  popupMargin: theme.tooltipMenuMargin,\n                  popupPinSize: theme.tooltipMenuPinSize,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderMain() {\n    if (!this.props.caption) {\n      return null;\n    }\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <PopupMenu\n          data-tid={TooltipMenuDataTids.root}\n          menuMaxHeight={this.props.menuMaxHeight}\n          menuWidth={this.props.menuWidth}\n          caption={this.props.caption}\n          header={this.props.header}\n          footer={this.props.footer}\n          positions={this.props.positions}\n          onOpen={this.props.onOpen}\n          onClose={this.props.onClose}\n          popupHasPin\n          disableAnimations={this.getProps().disableAnimations}\n        >\n          {this.props.children}\n        </PopupMenu>\n      </CommonWrapper>\n    );\n  }\n}\n"]}
+{"version":3,"sources":["TooltipMenu.tsx"],"names":["TooltipMenuDataTids","root","TooltipMenu","rootNode","props","getProps","defaultProps","caption","isProductionEnv","Error","render","theme","ThemeFactory","create","popupPinOffset","tooltipMenuPinOffset","popupMargin","tooltipMenuMargin","popupPinSize","tooltipMenuPinSize","menuScrollContainerContentWrapperPaddingY","menuLegacyPaddingY","renderMain","disableAnimations","setRootNode","menuMaxHeight","menuWidth","header","footer","preventIconsOffset","positions","onOpen","onClose","children","React","Component","__KONTUR_REACT_UI__","isTestEnv"],"mappings":"uWAAA;;AAEA;AACA;AACA;;AAEA;;;AAGA;AACA;AACA,gE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B,C;;;;;AAMP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,G;;AAEaC,W,OADZC,kB;;;;;;;;;;AAWC,uBAAYC,KAAZ,EAAqC;AACnC,wCAAMA,KAAN,UADmC,MAF7BC,QAE6B,GAFlB,0CAAkBH,WAAW,CAACI,YAA9B,CAEkB;;AAGnC,QAAI,CAACF,KAAK,CAACG,OAAP,IAAkB,CAACC,mCAAvB,EAAwC;AACtC,YAAM,IAAIC,KAAJ,CAAU,+BAAV,CAAN;AACD,KALkC;AAMpC,G;;AAEMC,EAAAA,M,GAAP,kBAAgB;AACd;AACE,mCAAC,0BAAD,CAAc,QAAd;AACG,gBAACC,KAAD,EAAW;AACV;AACE,uCAAC,0BAAD,CAAc,QAAd;AACE,YAAA,KAAK,EAAEC,2BAAaC,MAAb;AACL;AACEC,cAAAA,cAAc,EAAEH,KAAK,CAACI,oBADxB;AAEEC,cAAAA,WAAW,EAAEL,KAAK,CAACM,iBAFrB;AAGEC,cAAAA,YAAY,EAAEP,KAAK,CAACQ,kBAHtB;AAIEC,cAAAA,yCAAyC,EAAET,KAAK,CAACU,kBAJnD,EADK;;AAOLV,YAAAA,KAPK,CADT;;;AAWG,UAAA,MAAI,CAACW,UAAL,EAXH,CADF;;;AAeD,OAjBH,CADF;;;AAqBD,G;;AAEMA,EAAAA,U,GAAP,sBAAoB;AAClB,QAAI,CAAC,KAAKlB,KAAL,CAAWG,OAAhB,EAAyB;AACvB,aAAO,IAAP;AACD;;AAED,yBAA8B,KAAKF,QAAL,EAA9B,CAAQkB,iBAAR,kBAAQA,iBAAR;;AAEA;AACE,mCAAC,4BAAD,2BAAe,WAAW,EAAE,KAAKC,WAAjC,IAAkD,KAAKpB,KAAvD;AACE,mCAAC,oBAAD;AACE,sBAAY,KAAKA,KAAL,CAAW,YAAX,CADd;AAEE,oBAAUJ,mBAAmB,CAACC,IAFhC;AAGE,QAAA,aAAa,EAAE,KAAKG,KAAL,CAAWqB,aAH5B;AAIE,QAAA,SAAS,EAAE,KAAKrB,KAAL,CAAWsB,SAJxB;AAKE,QAAA,OAAO,EAAE,KAAKtB,KAAL,CAAWG,OALtB;AAME,QAAA,MAAM,EAAE,KAAKH,KAAL,CAAWuB,MANrB;AAOE,QAAA,MAAM,EAAE,KAAKvB,KAAL,CAAWwB,MAPrB;AAQE,QAAA,kBAAkB,EAAE,KAAKxB,KAAL,CAAWyB,kBARjC;AASE,QAAA,SAAS,EAAE,KAAKzB,KAAL,CAAW0B,SATxB;AAUE,QAAA,MAAM,EAAE,KAAK1B,KAAL,CAAW2B,MAVrB;AAWE,QAAA,OAAO,EAAE,KAAK3B,KAAL,CAAW4B,OAXtB;AAYE,QAAA,WAAW,MAZb;AAaE,QAAA,iBAAiB,EAAET,iBAbrB;;AAeG,WAAKnB,KAAL,CAAW6B,QAfd,CADF,CADF;;;;AAqBD,G,sBAtE8BC,eAAMC,S,WACvBC,mB,GAAsB,a,UAGtB9B,Y,GAA6B,EACzCiB,iBAAiB,EAAEc,6BADsB,E","sourcesContent":["import React, { AriaAttributes } from 'react';\n\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { PopupMenu, PopupMenuProps } from '../../internal/PopupMenu';\nimport { MenuItemProps } from '../MenuItem';\nimport { isProductionEnv, isTestEnv } from '../../lib/currentEnvironment';\nimport { MenuHeaderProps } from '../MenuHeader';\nimport { PopupPositionsType } from '../../internal/Popup';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nexport type TooltipMenuChildType = React.ReactElement<MenuItemProps | unknown | MenuHeaderProps>;\n\nexport interface TooltipMenuProps\n  extends Pick<AriaAttributes, 'aria-label'>,\n    CommonProps,\n    Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'preventIconsOffset'> {\n  children?: TooltipMenuChildType | TooltipMenuChildType[];\n  /** Максимальная высота меню */\n  menuMaxHeight?: number | string;\n  /** Ширина меню */\n  menuWidth?: number | string;\n  /**\n   * Элемент или функция возвращающая элемент,\n   * если передана, используется вместо `caption`,\n   * в таком случае управлять открытием и закрытием меню\n   * придется в этой функции\n   */\n  caption: PopupMenuProps['caption'];\n  /**\n   * Произвольный элемент, который будет отрендерен в шапке меню.\n   *\n   * _Примечание_: контрол [MenuHeader](#/Components/MenuHeader) передаётся только в `children` меню-контролов. Не стоит передавать `MenuHeader` в `header`.\n   */\n  header?: React.ReactNode;\n  /**\n   * Произвольный элемент, который будет отрендерен в подвале меню.\n   *\n   * Перед элементом переданным в `footer` будет отрендерен [MenuSeparator](#/Components/MenuSeparator).\n   */\n  footer?: React.ReactNode;\n  /**  Список позиций доступных для расположения выпадашки относительно `caption`.\n   *\n   * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n   *\n   * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n   */\n  positions?: PopupPositionsType[];\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations?: boolean;\n}\n\nexport const TooltipMenuDataTids = {\n  root: 'TooltipMenu__root',\n} as const;\n\ntype DefaultProps = Required<Pick<TooltipMenuProps, 'disableAnimations'>>;\n\n/**\n * Меню, раскрывающееся по клику на переданный в `caption` элемент.\n *\n * Положение меню задаётся с помощью массива `positions` и работает так:\n * первое значение в массиве - дефолтная позиция, меню раскроется на этой позиции, если оно не будет выходить за пределы `viewport`,\n * если раскрыться в дефолтной позиции не получится - будет использована следующая позиция, и так далее, пока не будет достигнут конец массива. Если все положения из списка будут выходить за пределы `viewport`, в качестве положения будет использовано первое значение в массиве.\n *\n * Если меню должно раскрываться только в одну сторону - массив `positions` должен содержать только один элемент: сторону, в которую должно открываться меню.\n *\n * Если массив `positions` не передан (или передан пустой массив), будут использованы всевозможные значения.\n */\n@rootNode\nexport class TooltipMenu extends React.Component<TooltipMenuProps> {\n  public static __KONTUR_REACT_UI__ = 'TooltipMenu';\n  private setRootNode!: TSetRootNode;\n\n  public static defaultProps: DefaultProps = {\n    disableAnimations: isTestEnv,\n  };\n\n  private getProps = createPropsGetter(TooltipMenu.defaultProps);\n\n  constructor(props: TooltipMenuProps) {\n    super(props);\n\n    if (!props.caption && !isProductionEnv) {\n      throw new Error('Prop \"caption\" is required!!!');\n    }\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          return (\n            <ThemeContext.Provider\n              value={ThemeFactory.create(\n                {\n                  popupPinOffset: theme.tooltipMenuPinOffset,\n                  popupMargin: theme.tooltipMenuMargin,\n                  popupPinSize: theme.tooltipMenuPinSize,\n                  menuScrollContainerContentWrapperPaddingY: theme.menuLegacyPaddingY,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderMain() {\n    if (!this.props.caption) {\n      return null;\n    }\n\n    const { disableAnimations } = this.getProps();\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <PopupMenu\n          aria-label={this.props['aria-label']}\n          data-tid={TooltipMenuDataTids.root}\n          menuMaxHeight={this.props.menuMaxHeight}\n          menuWidth={this.props.menuWidth}\n          caption={this.props.caption}\n          header={this.props.header}\n          footer={this.props.footer}\n          preventIconsOffset={this.props.preventIconsOffset}\n          positions={this.props.positions}\n          onOpen={this.props.onOpen}\n          onClose={this.props.onClose}\n          popupHasPin\n          disableAnimations={disableAnimations}\n        >\n          {this.props.children}\n        </PopupMenu>\n      </CommonWrapper>\n    );\n  }\n}\n"]}

package/cjs/components/TooltipMenu/TooltipMenu.md

@@ -16,6 +16,33 @@ import { Button, MenuHeader, MenuItem, MenuSeparator } from '@skbkontur/react-ui
 </TooltipMenu>;
 ```
 
+В проп `caption` помимо компонента можно передать функцию, возвращающую компонент, с помощью которой можно управлять текущим состоянием тултип-меню.
+
+```jsx harmony
+import { Button, MenuHeader, MenuItem, MenuSeparator } from '@skbkontur/react-ui';
+
+<TooltipMenu caption={({ opened, openMenu, closeMenu, toggleMenu }) => {
+    return (
+      <>
+        <p>Сейчас тултип-меню { opened ? 'окрыто' : 'закрыто' }</p>
+        <Button onClick={toggleMenu}>Переключить меню</Button>
+        <Button onClick={openMenu}>Открыть меню</Button>
+        <Button onClick={closeMenu}>Закрыть меню</Button>
+      </>
+    )
+  }}>
+  <MenuHeader>Заголовок меню</MenuHeader>
+  <MenuSeparator />
+  <MenuItem>Раз</MenuItem>
+  <MenuItem>Два</MenuItem>
+  <MenuItem>Три</MenuItem>
+  <MenuSeparator />
+  <MenuItem>Раз</MenuItem>
+  <MenuItem>Два</MenuItem>
+  <MenuItem>Три</MenuItem>
+</TooltipMenu>;
+```
+
 Тултип-меню с заданной шириной.
 
 ```jsx harmony
@@ -153,7 +180,35 @@ import { Button, MenuHeader, MenuItem, MenuSeparator } from '@skbkontur/react-ui
 </TooltipMenu>;
 ```
 
-Условный рендер элементов тултип-меню (с сохранением поведения [`MenuItem`](#/Components/MenuItem)).
+С иконками и включенным по-умолчанию автоматическим выравниванием текста.
+
+```jsx harmony
+import { Button, MenuHeader, MenuItem, MenuSeparator, TooltipMenu } from '@skbkontur/react-ui';
+import OkIcon from '@skbkontur/react-icons/Ok';
+
+<TooltipMenu caption={<Button use="primary">Открыть меню</Button>}>
+  <MenuHeader>MenuHeader</MenuHeader>
+  <MenuItem icon={<OkIcon />}>MenuItem1</MenuItem>
+  <MenuItem icon={<OkIcon />}>MenuItem2</MenuItem>
+  <MenuItem>MenuItem3</MenuItem>
+</TooltipMenu>;
+```
+
+С иконками и отключенным автоматическим выравниванием текста.
+
+```jsx harmony
+import { Button, MenuHeader, MenuItem, MenuSeparator, TooltipMenu } from '@skbkontur/react-ui';
+import OkIcon from '@skbkontur/react-icons/Ok';
+
+<TooltipMenu preventIconsOffset caption={<Button use="primary">Открыть меню</Button>}>
+  <MenuHeader>MenuHeader</MenuHeader>
+  <MenuItem icon={<OkIcon />}>MenuItem1</MenuItem>
+  <MenuItem icon={<OkIcon />}>MenuItem2</MenuItem>
+  <MenuItem>MenuItem3</MenuItem>
+</TooltipMenu>
+```
+
+Условный рендер элементов тултип-меню (с сохранением поведения [MenuItem](#/Components/MenuItem)).
 
 ```jsx harmony
 import {Button, MenuItem, Gapped, MenuSeparator} from '@skbkontur/react-ui';

package/cjs/index.d.ts

@@ -1,5 +1,6 @@
 export * from './components/Autocomplete';
 export * from './components/Button';
+export * from './components/Calendar';
 export * from './components/Center';
 export * from './components/Checkbox';
 export * from './components/ComboBox';
@@ -51,4 +52,7 @@ export * from './lib/theming/themes/DefaultTheme8pxOld';
 export * from './lib/theming/themes/FlatTheme8pxOld';
 export * from './lib/theming/themes/Theme2022';
 export * from './lib/theming/themes/Theme2022Dark';
+export * from './lib/types/props';
 export * from './internal/Popup/types';
+export * as ColorFunctions from './lib/styles/ColorFunctions';
+export * as DimensionFunctions from './lib/styles/DimensionFunctions';

package/cjs/index.js

@@ -1,54 +1,56 @@
-"use strict";exports.__esModule = true;var _Autocomplete = require("./components/Autocomplete");Object.keys(_Autocomplete).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Autocomplete[key]) return;exports[key] = _Autocomplete[key];});
-var _Button = require("./components/Button");Object.keys(_Button).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Button[key]) return;exports[key] = _Button[key];});
-var _Center = require("./components/Center");Object.keys(_Center).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Center[key]) return;exports[key] = _Center[key];});
-var _Checkbox = require("./components/Checkbox");Object.keys(_Checkbox).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Checkbox[key]) return;exports[key] = _Checkbox[key];});
-var _ComboBox = require("./components/ComboBox");Object.keys(_ComboBox).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _ComboBox[key]) return;exports[key] = _ComboBox[key];});
-var _CurrencyInput = require("./components/CurrencyInput");Object.keys(_CurrencyInput).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _CurrencyInput[key]) return;exports[key] = _CurrencyInput[key];});
-var _CurrencyLabel = require("./components/CurrencyLabel");Object.keys(_CurrencyLabel).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _CurrencyLabel[key]) return;exports[key] = _CurrencyLabel[key];});
-var _DateInput = require("./components/DateInput");Object.keys(_DateInput).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _DateInput[key]) return;exports[key] = _DateInput[key];});
-var _DatePicker = require("./components/DatePicker");Object.keys(_DatePicker).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _DatePicker[key]) return;exports[key] = _DatePicker[key];});
-var _Dropdown = require("./components/Dropdown");Object.keys(_Dropdown).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Dropdown[key]) return;exports[key] = _Dropdown[key];});
-var _DropdownMenu = require("./components/DropdownMenu");Object.keys(_DropdownMenu).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _DropdownMenu[key]) return;exports[key] = _DropdownMenu[key];});
-var _FileUploader = require("./components/FileUploader");Object.keys(_FileUploader).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _FileUploader[key]) return;exports[key] = _FileUploader[key];});
-var _FxInput = require("./components/FxInput");Object.keys(_FxInput).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _FxInput[key]) return;exports[key] = _FxInput[key];});
-var _Gapped = require("./components/Gapped");Object.keys(_Gapped).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Gapped[key]) return;exports[key] = _Gapped[key];});
-var _GlobalLoader = require("./components/GlobalLoader");Object.keys(_GlobalLoader).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _GlobalLoader[key]) return;exports[key] = _GlobalLoader[key];});
-var _Group = require("./components/Group");Object.keys(_Group).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Group[key]) return;exports[key] = _Group[key];});
-var _Hint = require("./components/Hint");Object.keys(_Hint).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Hint[key]) return;exports[key] = _Hint[key];});
-var _Input = require("./components/Input");Object.keys(_Input).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Input[key]) return;exports[key] = _Input[key];});
-var _Kebab = require("./components/Kebab");Object.keys(_Kebab).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Kebab[key]) return;exports[key] = _Kebab[key];});
-var _Link = require("./components/Link");Object.keys(_Link).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Link[key]) return;exports[key] = _Link[key];});
-var _Loader = require("./components/Loader");Object.keys(_Loader).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Loader[key]) return;exports[key] = _Loader[key];});
-var _MenuHeader = require("./components/MenuHeader");Object.keys(_MenuHeader).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _MenuHeader[key]) return;exports[key] = _MenuHeader[key];});
-var _MenuItem = require("./components/MenuItem");Object.keys(_MenuItem).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _MenuItem[key]) return;exports[key] = _MenuItem[key];});
-var _MenuSeparator = require("./components/MenuSeparator");Object.keys(_MenuSeparator).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _MenuSeparator[key]) return;exports[key] = _MenuSeparator[key];});
-var _Modal = require("./components/Modal");Object.keys(_Modal).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Modal[key]) return;exports[key] = _Modal[key];});
-var _Paging = require("./components/Paging");Object.keys(_Paging).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Paging[key]) return;exports[key] = _Paging[key];});
-var _PasswordInput = require("./components/PasswordInput");Object.keys(_PasswordInput).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _PasswordInput[key]) return;exports[key] = _PasswordInput[key];});
-var _Radio = require("./components/Radio");Object.keys(_Radio).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Radio[key]) return;exports[key] = _Radio[key];});
-var _RadioGroup = require("./components/RadioGroup");Object.keys(_RadioGroup).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _RadioGroup[key]) return;exports[key] = _RadioGroup[key];});
-var _ScrollContainer = require("./components/ScrollContainer");Object.keys(_ScrollContainer).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _ScrollContainer[key]) return;exports[key] = _ScrollContainer[key];});
-var _Select = require("./components/Select");Object.keys(_Select).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Select[key]) return;exports[key] = _Select[key];});
-var _SidePage = require("./components/SidePage");Object.keys(_SidePage).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _SidePage[key]) return;exports[key] = _SidePage[key];});
-var _Spinner = require("./components/Spinner");Object.keys(_Spinner).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Spinner[key]) return;exports[key] = _Spinner[key];});
-var _Sticky = require("./components/Sticky");Object.keys(_Sticky).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Sticky[key]) return;exports[key] = _Sticky[key];});
-var _Switcher = require("./components/Switcher");Object.keys(_Switcher).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Switcher[key]) return;exports[key] = _Switcher[key];});
-var _Tabs = require("./components/Tabs");Object.keys(_Tabs).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Tabs[key]) return;exports[key] = _Tabs[key];});
-var _Textarea = require("./components/Textarea");Object.keys(_Textarea).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Textarea[key]) return;exports[key] = _Textarea[key];});
-var _Toast = require("./components/Toast");Object.keys(_Toast).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Toast[key]) return;exports[key] = _Toast[key];});
-var _Toggle = require("./components/Toggle");Object.keys(_Toggle).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Toggle[key]) return;exports[key] = _Toggle[key];});
-var _Token = require("./components/Token");Object.keys(_Token).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Token[key]) return;exports[key] = _Token[key];});
-var _TokenInput = require("./components/TokenInput");Object.keys(_TokenInput).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _TokenInput[key]) return;exports[key] = _TokenInput[key];});
-var _Tooltip = require("./components/Tooltip");Object.keys(_Tooltip).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Tooltip[key]) return;exports[key] = _Tooltip[key];});
-var _TooltipMenu = require("./components/TooltipMenu");Object.keys(_TooltipMenu).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _TooltipMenu[key]) return;exports[key] = _TooltipMenu[key];});
-var _ResponsiveLayout = require("./components/ResponsiveLayout");Object.keys(_ResponsiveLayout).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _ResponsiveLayout[key]) return;exports[key] = _ResponsiveLayout[key];});
-var _locale = require("./lib/locale");Object.keys(_locale).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _locale[key]) return;exports[key] = _locale[key];});
-var _ThemeContext = require("./lib/theming/ThemeContext");Object.keys(_ThemeContext).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _ThemeContext[key]) return;exports[key] = _ThemeContext[key];});
-var _ThemeFactory = require("./lib/theming/ThemeFactory");Object.keys(_ThemeFactory).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _ThemeFactory[key]) return;exports[key] = _ThemeFactory[key];});
-var _DefaultTheme = require("./lib/theming/themes/DefaultTheme");Object.keys(_DefaultTheme).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _DefaultTheme[key]) return;exports[key] = _DefaultTheme[key];});
-var _DarkTheme = require("./lib/theming/themes/DarkTheme");Object.keys(_DarkTheme).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _DarkTheme[key]) return;exports[key] = _DarkTheme[key];});
-var _DefaultTheme8pxOld = require("./lib/theming/themes/DefaultTheme8pxOld");Object.keys(_DefaultTheme8pxOld).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _DefaultTheme8pxOld[key]) return;exports[key] = _DefaultTheme8pxOld[key];});
-var _FlatTheme8pxOld = require("./lib/theming/themes/FlatTheme8pxOld");Object.keys(_FlatTheme8pxOld).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _FlatTheme8pxOld[key]) return;exports[key] = _FlatTheme8pxOld[key];});
-var _Theme = require("./lib/theming/themes/Theme2022");Object.keys(_Theme).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Theme[key]) return;exports[key] = _Theme[key];});
-var _Theme2022Dark = require("./lib/theming/themes/Theme2022Dark");Object.keys(_Theme2022Dark).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Theme2022Dark[key]) return;exports[key] = _Theme2022Dark[key];});
-var _types = require("./internal/Popup/types");Object.keys(_types).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _types[key]) return;exports[key] = _types[key];});
+"use strict";exports.__esModule = true;var _exportNames = { ColorFunctions: true, DimensionFunctions: true };exports.DimensionFunctions = exports.ColorFunctions = void 0;var _Autocomplete = require("./components/Autocomplete");Object.keys(_Autocomplete).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Autocomplete[key]) return;exports[key] = _Autocomplete[key];});
+var _Button = require("./components/Button");Object.keys(_Button).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Button[key]) return;exports[key] = _Button[key];});
+var _Calendar = require("./components/Calendar");Object.keys(_Calendar).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Calendar[key]) return;exports[key] = _Calendar[key];});
+var _Center = require("./components/Center");Object.keys(_Center).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Center[key]) return;exports[key] = _Center[key];});
+var _Checkbox = require("./components/Checkbox");Object.keys(_Checkbox).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Checkbox[key]) return;exports[key] = _Checkbox[key];});
+var _ComboBox = require("./components/ComboBox");Object.keys(_ComboBox).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _ComboBox[key]) return;exports[key] = _ComboBox[key];});
+var _CurrencyInput = require("./components/CurrencyInput");Object.keys(_CurrencyInput).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _CurrencyInput[key]) return;exports[key] = _CurrencyInput[key];});
+var _CurrencyLabel = require("./components/CurrencyLabel");Object.keys(_CurrencyLabel).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _CurrencyLabel[key]) return;exports[key] = _CurrencyLabel[key];});
+var _DateInput = require("./components/DateInput");Object.keys(_DateInput).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _DateInput[key]) return;exports[key] = _DateInput[key];});
+var _DatePicker = require("./components/DatePicker");Object.keys(_DatePicker).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _DatePicker[key]) return;exports[key] = _DatePicker[key];});
+var _Dropdown = require("./components/Dropdown");Object.keys(_Dropdown).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Dropdown[key]) return;exports[key] = _Dropdown[key];});
+var _DropdownMenu = require("./components/DropdownMenu");Object.keys(_DropdownMenu).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _DropdownMenu[key]) return;exports[key] = _DropdownMenu[key];});
+var _FileUploader = require("./components/FileUploader");Object.keys(_FileUploader).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _FileUploader[key]) return;exports[key] = _FileUploader[key];});
+var _FxInput = require("./components/FxInput");Object.keys(_FxInput).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _FxInput[key]) return;exports[key] = _FxInput[key];});
+var _Gapped = require("./components/Gapped");Object.keys(_Gapped).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Gapped[key]) return;exports[key] = _Gapped[key];});
+var _GlobalLoader = require("./components/GlobalLoader");Object.keys(_GlobalLoader).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _GlobalLoader[key]) return;exports[key] = _GlobalLoader[key];});
+var _Group = require("./components/Group");Object.keys(_Group).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Group[key]) return;exports[key] = _Group[key];});
+var _Hint = require("./components/Hint");Object.keys(_Hint).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Hint[key]) return;exports[key] = _Hint[key];});
+var _Input = require("./components/Input");Object.keys(_Input).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Input[key]) return;exports[key] = _Input[key];});
+var _Kebab = require("./components/Kebab");Object.keys(_Kebab).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Kebab[key]) return;exports[key] = _Kebab[key];});
+var _Link = require("./components/Link");Object.keys(_Link).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Link[key]) return;exports[key] = _Link[key];});
+var _Loader = require("./components/Loader");Object.keys(_Loader).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Loader[key]) return;exports[key] = _Loader[key];});
+var _MenuHeader = require("./components/MenuHeader");Object.keys(_MenuHeader).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _MenuHeader[key]) return;exports[key] = _MenuHeader[key];});
+var _MenuItem = require("./components/MenuItem");Object.keys(_MenuItem).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _MenuItem[key]) return;exports[key] = _MenuItem[key];});
+var _MenuSeparator = require("./components/MenuSeparator");Object.keys(_MenuSeparator).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _MenuSeparator[key]) return;exports[key] = _MenuSeparator[key];});
+var _Modal = require("./components/Modal");Object.keys(_Modal).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Modal[key]) return;exports[key] = _Modal[key];});
+var _Paging = require("./components/Paging");Object.keys(_Paging).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Paging[key]) return;exports[key] = _Paging[key];});
+var _PasswordInput = require("./components/PasswordInput");Object.keys(_PasswordInput).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _PasswordInput[key]) return;exports[key] = _PasswordInput[key];});
+var _Radio = require("./components/Radio");Object.keys(_Radio).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Radio[key]) return;exports[key] = _Radio[key];});
+var _RadioGroup = require("./components/RadioGroup");Object.keys(_RadioGroup).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _RadioGroup[key]) return;exports[key] = _RadioGroup[key];});
+var _ScrollContainer = require("./components/ScrollContainer");Object.keys(_ScrollContainer).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _ScrollContainer[key]) return;exports[key] = _ScrollContainer[key];});
+var _Select = require("./components/Select");Object.keys(_Select).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Select[key]) return;exports[key] = _Select[key];});
+var _SidePage = require("./components/SidePage");Object.keys(_SidePage).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _SidePage[key]) return;exports[key] = _SidePage[key];});
+var _Spinner = require("./components/Spinner");Object.keys(_Spinner).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Spinner[key]) return;exports[key] = _Spinner[key];});
+var _Sticky = require("./components/Sticky");Object.keys(_Sticky).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Sticky[key]) return;exports[key] = _Sticky[key];});
+var _Switcher = require("./components/Switcher");Object.keys(_Switcher).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Switcher[key]) return;exports[key] = _Switcher[key];});
+var _Tabs = require("./components/Tabs");Object.keys(_Tabs).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Tabs[key]) return;exports[key] = _Tabs[key];});
+var _Textarea = require("./components/Textarea");Object.keys(_Textarea).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Textarea[key]) return;exports[key] = _Textarea[key];});
+var _Toast = require("./components/Toast");Object.keys(_Toast).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Toast[key]) return;exports[key] = _Toast[key];});
+var _Toggle = require("./components/Toggle");Object.keys(_Toggle).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Toggle[key]) return;exports[key] = _Toggle[key];});
+var _Token = require("./components/Token");Object.keys(_Token).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Token[key]) return;exports[key] = _Token[key];});
+var _TokenInput = require("./components/TokenInput");Object.keys(_TokenInput).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _TokenInput[key]) return;exports[key] = _TokenInput[key];});
+var _Tooltip = require("./components/Tooltip");Object.keys(_Tooltip).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Tooltip[key]) return;exports[key] = _Tooltip[key];});
+var _TooltipMenu = require("./components/TooltipMenu");Object.keys(_TooltipMenu).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _TooltipMenu[key]) return;exports[key] = _TooltipMenu[key];});
+var _ResponsiveLayout = require("./components/ResponsiveLayout");Object.keys(_ResponsiveLayout).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _ResponsiveLayout[key]) return;exports[key] = _ResponsiveLayout[key];});
+var _locale = require("./lib/locale");Object.keys(_locale).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _locale[key]) return;exports[key] = _locale[key];});
+var _ThemeContext = require("./lib/theming/ThemeContext");Object.keys(_ThemeContext).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _ThemeContext[key]) return;exports[key] = _ThemeContext[key];});
+var _ThemeFactory = require("./lib/theming/ThemeFactory");Object.keys(_ThemeFactory).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _ThemeFactory[key]) return;exports[key] = _ThemeFactory[key];});
+var _DefaultTheme = require("./lib/theming/themes/DefaultTheme");Object.keys(_DefaultTheme).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _DefaultTheme[key]) return;exports[key] = _DefaultTheme[key];});
+var _DarkTheme = require("./lib/theming/themes/DarkTheme");Object.keys(_DarkTheme).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _DarkTheme[key]) return;exports[key] = _DarkTheme[key];});
+var _DefaultTheme8pxOld = require("./lib/theming/themes/DefaultTheme8pxOld");Object.keys(_DefaultTheme8pxOld).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _DefaultTheme8pxOld[key]) return;exports[key] = _DefaultTheme8pxOld[key];});
+var _FlatTheme8pxOld = require("./lib/theming/themes/FlatTheme8pxOld");Object.keys(_FlatTheme8pxOld).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _FlatTheme8pxOld[key]) return;exports[key] = _FlatTheme8pxOld[key];});
+var _Theme = require("./lib/theming/themes/Theme2022");Object.keys(_Theme).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Theme[key]) return;exports[key] = _Theme[key];});
+var _Theme2022Dark = require("./lib/theming/themes/Theme2022Dark");Object.keys(_Theme2022Dark).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _Theme2022Dark[key]) return;exports[key] = _Theme2022Dark[key];});
+var _props = require("./lib/types/props");Object.keys(_props).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _props[key]) return;exports[key] = _props[key];});
+var _types = require("./internal/Popup/types");Object.keys(_types).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _types[key]) return;exports[key] = _types[key];});var _ColorFunctions = _interopRequireWildcard(require("./lib/styles/ColorFunctions"));exports.ColorFunctions = _ColorFunctions;var _DimensionFunctions = _interopRequireWildcard(require("./lib/styles/DimensionFunctions"));exports.DimensionFunctions = _DimensionFunctions;function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}

package/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":"uCAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","sourcesContent":["export * from './components/Autocomplete';\nexport * from './components/Button';\nexport * from './components/Center';\nexport * from './components/Checkbox';\nexport * from './components/ComboBox';\nexport * from './components/CurrencyInput';\nexport * from './components/CurrencyLabel';\nexport * from './components/DateInput';\nexport * from './components/DatePicker';\nexport * from './components/Dropdown';\nexport * from './components/DropdownMenu';\nexport * from './components/FileUploader';\nexport * from './components/FxInput';\nexport * from './components/Gapped';\nexport * from './components/GlobalLoader';\nexport * from './components/Group';\nexport * from './components/Hint';\nexport * from './components/Input';\nexport * from './components/Kebab';\nexport * from './components/Link';\nexport * from './components/Loader';\nexport * from './components/MenuHeader';\nexport * from './components/MenuItem';\nexport * from './components/MenuSeparator';\nexport * from './components/Modal';\nexport * from './components/Paging';\nexport * from './components/PasswordInput';\nexport * from './components/Radio';\nexport * from './components/RadioGroup';\nexport * from './components/ScrollContainer';\nexport * from './components/Select';\nexport * from './components/SidePage';\nexport * from './components/Spinner';\nexport * from './components/Sticky';\nexport * from './components/Switcher';\nexport * from './components/Tabs';\nexport * from './components/Textarea';\nexport * from './components/Toast';\nexport * from './components/Toggle';\nexport * from './components/Token';\nexport * from './components/TokenInput';\nexport * from './components/Tooltip';\nexport * from './components/TooltipMenu';\nexport * from './components/ResponsiveLayout';\nexport * from './lib/locale';\nexport * from './lib/theming/ThemeContext';\nexport * from './lib/theming/ThemeFactory';\nexport * from './lib/theming/themes/DefaultTheme';\nexport * from './lib/theming/themes/DarkTheme';\nexport * from './lib/theming/themes/DefaultTheme8pxOld';\nexport * from './lib/theming/themes/FlatTheme8pxOld';\nexport * from './lib/theming/themes/Theme2022';\nexport * from './lib/theming/themes/Theme2022Dark';\nexport * from './internal/Popup/types';\n"]}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"0KAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,8S","sourcesContent":["export * from './components/Autocomplete';\nexport * from './components/Button';\nexport * from './components/Calendar';\nexport * from './components/Center';\nexport * from './components/Checkbox';\nexport * from './components/ComboBox';\nexport * from './components/CurrencyInput';\nexport * from './components/CurrencyLabel';\nexport * from './components/DateInput';\nexport * from './components/DatePicker';\nexport * from './components/Dropdown';\nexport * from './components/DropdownMenu';\nexport * from './components/FileUploader';\nexport * from './components/FxInput';\nexport * from './components/Gapped';\nexport * from './components/GlobalLoader';\nexport * from './components/Group';\nexport * from './components/Hint';\nexport * from './components/Input';\nexport * from './components/Kebab';\nexport * from './components/Link';\nexport * from './components/Loader';\nexport * from './components/MenuHeader';\nexport * from './components/MenuItem';\nexport * from './components/MenuSeparator';\nexport * from './components/Modal';\nexport * from './components/Paging';\nexport * from './components/PasswordInput';\nexport * from './components/Radio';\nexport * from './components/RadioGroup';\nexport * from './components/ScrollContainer';\nexport * from './components/Select';\nexport * from './components/SidePage';\nexport * from './components/Spinner';\nexport * from './components/Sticky';\nexport * from './components/Switcher';\nexport * from './components/Tabs';\nexport * from './components/Textarea';\nexport * from './components/Toast';\nexport * from './components/Toggle';\nexport * from './components/Token';\nexport * from './components/TokenInput';\nexport * from './components/Tooltip';\nexport * from './components/TooltipMenu';\nexport * from './components/ResponsiveLayout';\nexport * from './lib/locale';\nexport * from './lib/theming/ThemeContext';\nexport * from './lib/theming/ThemeFactory';\nexport * from './lib/theming/themes/DefaultTheme';\nexport * from './lib/theming/themes/DarkTheme';\nexport * from './lib/theming/themes/DefaultTheme8pxOld';\nexport * from './lib/theming/themes/FlatTheme8pxOld';\nexport * from './lib/theming/themes/Theme2022';\nexport * from './lib/theming/themes/Theme2022Dark';\nexport * from './lib/types/props';\nexport * from './internal/Popup/types';\nexport * as ColorFunctions from './lib/styles/ColorFunctions';\nexport * as DimensionFunctions from './lib/styles/DimensionFunctions';\n"]}

package/cjs/internal/CloseButtonIcon/CloseButtonIcon.d.ts

@@ -0,0 +1,35 @@
+import React, { AriaAttributes, CSSProperties } from 'react';
+import { CommonProps } from '../CommonWrapper';
+export interface CloseButtonIconProps extends Pick<AriaAttributes, 'aria-label'>, React.ButtonHTMLAttributes<HTMLButtonElement>, CommonProps {
+    /**
+     * Ширина и высота иконки крестика
+     *
+     * @default 16
+     */
+    size?: number;
+    /**
+     * Ширина и высота всей кнопки
+     *
+     * @default 16
+     */
+    side?: number;
+    /**
+     * Цвет иконки
+     *
+     * Переменная темы: `closeBtnIconColor`
+     */
+    color?: CSSProperties['color'];
+    /**
+     * Цвет иконки при наведении мышью и при фокусе
+     *
+     * Переменная темы: `closeBtnIconHoverColor`
+     */
+    colorHover?: CSSProperties['color'];
+    /**
+     * Возможность сфокусироваться на кнопке клавишей TAB
+     *
+     * @default true
+     * */
+    tabbable?: boolean;
+}
+export declare const CloseButtonIcon: React.FunctionComponent<CloseButtonIconProps>;

package/cjs/internal/CloseButtonIcon/CloseButtonIcon.js

@@ -0,0 +1,101 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.CloseButtonIcon = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireDefault(require("react"));
+
+var _Emotion = require("../../lib/theming/Emotion");
+var _keyListener = require("../../lib/events/keyListener");
+var _ThemeContext = require("../../lib/theming/ThemeContext");
+var _iconConstants = require("../icons2022/iconConstants");
+var _ThemeFactory = require("../../lib/theming/ThemeFactory");
+var _CommonWrapper = require("../CommonWrapper");
+
+var _CloseButtonIcon = require("./CloseButtonIcon.styles");
+var _CrossIcon = require("./CrossIcon");var _excluded = ["side", "size", "color", "colorHover", "tabbable", "style"];
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var CloseButtonIcon = function CloseButtonIcon(_ref)
+
+
+
+
+
+
+
+{var _ref$side = _ref.side,side = _ref$side === void 0 ? _iconConstants.DEFAULT_ICON_SIZE : _ref$side,_ref$size = _ref.size,size = _ref$size === void 0 ? _iconConstants.DEFAULT_ICON_SIZE : _ref$size,color = _ref.color,colorHover = _ref.colorHover,_ref$tabbable = _ref.tabbable,tabbable = _ref$tabbable === void 0 ? true : _ref$tabbable,style = _ref.style,rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
+  var _theme = _react.default.useContext(_ThemeContext.ThemeContext);
+  var theme = _ThemeFactory.ThemeFactory.create(
+  {
+    closeBtnIconColor: color != null ? color : _theme.closeBtnIconColor,
+    closeBtnIconHoverColor: colorHover != null ? colorHover : _theme.closeBtnIconHoverColor },
+
+  _theme);
+
+  var _React$useState = _react.default.useState(false),focusedByTab = _React$useState[0],setFocusedByTab = _React$useState[1];
+
+  var handleFocus = function handleFocus() {
+    // focus event fires before keyDown eventlistener
+    // so we should check tabPressed in async way
+    requestAnimationFrame(function () {
+      if (_keyListener.keyListener.isTabPressed) {
+        setFocusedByTab(true);
+      }
+    });
+  };
+  var handleBlur = function handleBlur() {return setFocusedByTab(false);};
+
+  var tabIndex = !tabbable || rest.disabled ? -1 : 0;
+
+  return /*#__PURE__*/(
+    _react.default.createElement(_CommonWrapper.CommonWrapper, rest, /*#__PURE__*/
+    _react.default.createElement("button", (0, _extends2.default)({
+      tabIndex: tabIndex,
+      className: (0, _Emotion.cx)(
+      _CloseButtonIcon.styles.root(theme),
+      !rest.disabled && focusedByTab && _CloseButtonIcon.styles.focus(theme),
+      rest.disabled && _CloseButtonIcon.styles.rootDisabled(theme)),
+
+      style: (0, _extends2.default)({}, style, { width: side, height: side }),
+      onFocus: handleFocus,
+      onBlur: handleBlur },
+    rest), /*#__PURE__*/
+
+    _react.default.createElement("span", { className: _CloseButtonIcon.styles.wrapper() }, /*#__PURE__*/
+    _react.default.createElement(_CrossIcon.CrossIcon, { size: side < size ? side : size, focusable: tabIndex >= 0 })))));
+
+
+
+
+};exports.CloseButtonIcon = CloseButtonIcon;

package/cjs/internal/CloseButtonIcon/CloseButtonIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["CloseButtonIcon.tsx"],"names":["CloseButtonIcon","side","DEFAULT_ICON_SIZE","size","color","colorHover","tabbable","style","rest","_theme","React","useContext","ThemeContext","theme","ThemeFactory","create","closeBtnIconColor","closeBtnIconHoverColor","useState","focusedByTab","setFocusedByTab","handleFocus","requestAnimationFrame","keyListener","isTabPressed","handleBlur","tabIndex","disabled","styles","root","focus","rootDisabled","width","height","wrapper"],"mappings":"2WAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,wC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCO,IAAMA,eAA8D,GAAG,SAAjEA,eAAiE;;;;;;;;AAQxE,sBAPJC,IAOI,CAPJA,IAOI,0BAPGC,gCAOH,8BANJC,IAMI,CANJA,IAMI,0BANGD,gCAMH,aALJE,KAKI,QALJA,KAKI,CAJJC,UAII,QAJJA,UAII,sBAHJC,QAGI,CAHJA,QAGI,8BAHO,IAGP,iBAFJC,KAEI,QAFJA,KAEI,CADDC,IACC;AACJ,MAAMC,MAAM,GAAGC,eAAMC,UAAN,CAAiBC,0BAAjB,CAAf;AACA,MAAMC,KAAK,GAAGC,2BAAaC,MAAb;AACZ;AACEC,IAAAA,iBAAiB,EAAEZ,KAAF,WAAEA,KAAF,GAAWK,MAAM,CAACO,iBADrC;AAEEC,IAAAA,sBAAsB,EAAEZ,UAAF,WAAEA,UAAF,GAAgBI,MAAM,CAACQ,sBAF/C,EADY;;AAKZR,EAAAA,MALY,CAAd;;AAOA,wBAAwCC,eAAMQ,QAAN,CAAe,KAAf,CAAxC,CAAOC,YAAP,sBAAqBC,eAArB;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB;AACA;AACAC,IAAAA,qBAAqB,CAAC,YAAM;AAC1B,UAAIC,yBAAYC,YAAhB,EAA8B;AAC5BJ,QAAAA,eAAe,CAAC,IAAD,CAAf;AACD;AACF,KAJoB,CAArB;AAKD,GARD;AASA,MAAMK,UAAU,GAAG,SAAbA,UAAa,WAAML,eAAe,CAAC,KAAD,CAArB,EAAnB;;AAEA,MAAMM,QAAQ,GAAG,CAACpB,QAAD,IAAaE,IAAI,CAACmB,QAAlB,GAA6B,CAAC,CAA9B,GAAkC,CAAnD;;AAEA;AACE,iCAAC,4BAAD,EAAmBnB,IAAnB;AACE;AACE,MAAA,QAAQ,EAAEkB,QADZ;AAEE,MAAA,SAAS,EAAE;AACTE,8BAAOC,IAAP,CAAYhB,KAAZ,CADS;AAET,OAACL,IAAI,CAACmB,QAAN,IAAkBR,YAAlB,IAAkCS,wBAAOE,KAAP,CAAajB,KAAb,CAFzB;AAGTL,MAAAA,IAAI,CAACmB,QAAL,IAAiBC,wBAAOG,YAAP,CAAoBlB,KAApB,CAHR,CAFb;;AAOE,MAAA,KAAK,6BAAON,KAAP,IAAcyB,KAAK,EAAE/B,IAArB,EAA2BgC,MAAM,EAAEhC,IAAnC,GAPP;AAQE,MAAA,OAAO,EAAEoB,WARX;AASE,MAAA,MAAM,EAAEI,UATV;AAUMjB,IAAAA,IAVN;;AAYE,2CAAM,SAAS,EAAEoB,wBAAOM,OAAP,EAAjB;AACE,iCAAC,oBAAD,IAAW,IAAI,EAAEjC,IAAI,GAAGE,IAAP,GAAcF,IAAd,GAAqBE,IAAtC,EAA4C,SAAS,EAAEuB,QAAQ,IAAI,CAAnE,GADF,CAZF,CADF,CADF;;;;;AAoBD,CApDM,C","sourcesContent":["import React, { AriaAttributes, CSSProperties } from 'react';\n\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { DEFAULT_ICON_SIZE } from '../icons2022/iconConstants';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { CommonWrapper, CommonProps } from '../CommonWrapper';\n\nimport { styles } from './CloseButtonIcon.styles';\nimport { CrossIcon } from './CrossIcon';\n\nexport interface CloseButtonIconProps\n  extends Pick<AriaAttributes, 'aria-label'>,\n    React.ButtonHTMLAttributes<HTMLButtonElement>,\n    CommonProps {\n  /**\n   * Ширина и высота иконки крестика\n   *\n   * @default 16\n   */\n  size?: number;\n  /**\n   * Ширина и высота всей кнопки\n   *\n   * @default 16\n   */\n  side?: number;\n  /**\n   * Цвет иконки\n   *\n   * Переменная темы: `closeBtnIconColor`\n   */\n  color?: CSSProperties['color'];\n  /**\n   * Цвет иконки при наведении мышью и при фокусе\n   *\n   * Переменная темы: `closeBtnIconHoverColor`\n   */\n  colorHover?: CSSProperties['color'];\n  /**\n   * Возможность сфокусироваться на кнопке клавишей TAB\n   *\n   * @default true\n   * */\n  tabbable?: boolean;\n}\n\nexport const CloseButtonIcon: React.FunctionComponent<CloseButtonIconProps> = ({\n  side = DEFAULT_ICON_SIZE,\n  size = DEFAULT_ICON_SIZE,\n  color,\n  colorHover,\n  tabbable = true,\n  style,\n  ...rest\n}) => {\n  const _theme = React.useContext(ThemeContext);\n  const theme = ThemeFactory.create(\n    {\n      closeBtnIconColor: color ?? _theme.closeBtnIconColor,\n      closeBtnIconHoverColor: colorHover ?? _theme.closeBtnIconHoverColor,\n    },\n    _theme,\n  );\n  const [focusedByTab, setFocusedByTab] = React.useState(false);\n\n  const handleFocus = () => {\n    // focus event fires before keyDown eventlistener\n    // so we should check tabPressed in async way\n    requestAnimationFrame(() => {\n      if (keyListener.isTabPressed) {\n        setFocusedByTab(true);\n      }\n    });\n  };\n  const handleBlur = () => setFocusedByTab(false);\n\n  const tabIndex = !tabbable || rest.disabled ? -1 : 0;\n\n  return (\n    <CommonWrapper {...rest}>\n      <button\n        tabIndex={tabIndex}\n        className={cx(\n          styles.root(theme),\n          !rest.disabled && focusedByTab && styles.focus(theme),\n          rest.disabled && styles.rootDisabled(theme),\n        )}\n        style={{ ...style, width: side, height: side }}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        {...rest}\n      >\n        <span className={styles.wrapper()}>\n          <CrossIcon size={side < size ? side : size} focusable={tabIndex >= 0} />\n        </span>\n      </button>\n    </CommonWrapper>\n  );\n};\n"]}

package/cjs/{components/DatePicker/Picker.styles.d.ts → internal/CloseButtonIcon/CloseButtonIcon.styles.d.ts}

@@ -1,5 +1,7 @@
 import { Theme } from '../../lib/theming/Theme';
 export declare const styles: {
     root(t: Theme): string;
-    todayWrapper(t: Theme): string;
+    rootDisabled(t: Theme): string;
+    focus(t: Theme): string;
+    wrapper(): string;
 };