@skbkontur/react-ui 2.17.4-source-maps.1 → 2.17.7

package/cjs/internal/Menu/Menu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Menu.tsx"],"names":["Menu","state","highlightedIndex","theme","scrollContainer","highlighted","unmounted","refScrollContainer","scrollToSelected","scrollTo","ReactDOM","findDOMNode","scrollToTop","scrollToBottom","highlight","index","setState","unhighlight","componentWillUnmount","render","renderMain","up","move","down","enter","event","select","reset","hasHighlightedItem","highlightItem","enableIconPadding","React","Children","toArray","props","children","some","x","isValidElement","icon","isEmpty","jsStyles","root","shadow","hasShadow","width","maxHeight","preventWindowScroll","map","child","cloneElement","_enableIconPadding","ref","refHighlighted","bind","onClick","onMouseEnter","onMouseLeave","originalRef","menuItem","shouldHandleHref","item","childrenToArray","href","target","window","open","location","onItemClick","step","activeElements","filter","isActiveElement","length","indexOf","isExist","Component","__KONTUR_REACT_UI__","defaultProps","value","undefined","ret","forEach","push"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport cn from 'classnames';\n\nimport { ScrollContainer } from '../../components/ScrollContainer';\nimport { isMenuItem, MenuItem, MenuItemProps } from '../../components/MenuItem';\nimport { isMenuHeader } from '../../components/MenuHeader';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\n\nimport { jsStyles } from './Menu.styles';\nimport { isActiveElement } from './isActiveElement';\n\nexport interface MenuProps {\n  children: React.ReactNode;\n  hasShadow?: boolean;\n  maxHeight?: number | string;\n  onItemClick?: () => void;\n  width?: number | string;\n  preventWindowScroll?: boolean;\n}\n\nexport interface MenuState {\n  highlightedIndex: number;\n}\n\nexport class Menu extends React.Component<MenuProps, MenuState> {\n  public static __KONTUR_REACT_UI__ = 'Menu';\n\n  public static defaultProps = {\n    width: 'auto',\n    maxHeight: 300,\n    hasShadow: true,\n    preventWindowScroll: true,\n  };\n\n  public state = {\n    highlightedIndex: -1,\n  };\n\n  private theme!: Theme;\n  private scrollContainer: Nullable<ScrollContainer>;\n  private highlighted: Nullable<MenuItem>;\n  private unmounted = false;\n\n  public componentWillUnmount() {\n    this.unmounted = true;\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {theme => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  /**\n   * @public\n   */\n  public up() {\n    this.move(-1);\n  }\n\n  /**\n   * @public\n   */\n  public down() {\n    this.move(1);\n  }\n\n  /**\n   * @public\n   */\n  public enter(event: React.SyntheticEvent<HTMLElement>) {\n    return this.select(this.state.highlightedIndex, true, event);\n  }\n\n  /**\n   * @public\n   */\n  public reset() {\n    this.setState({ highlightedIndex: -1 });\n  }\n\n  /**\n   * @public\n   */\n  public hasHighlightedItem() {\n    return this.state.highlightedIndex !== -1;\n  }\n\n  public highlightItem(index: number) {\n    this.highlight(index);\n  }\n\n  private renderMain() {\n    const enableIconPadding = React.Children.toArray(this.props.children).some(\n      x => React.isValidElement(x) && x.props.icon,\n    );\n\n    if (this.isEmpty()) {\n      return null;\n    }\n\n    return (\n      <div\n        className={cn({\n          [jsStyles.root(this.theme)]: true,\n          [jsStyles.shadow(this.theme)]: this.props.hasShadow,\n        })}\n        style={{ width: this.props.width, maxHeight: this.props.maxHeight }}\n      >\n        <ScrollContainer\n          ref={this.refScrollContainer}\n          maxHeight={this.props.maxHeight}\n          preventWindowScroll={this.props.preventWindowScroll}\n        >\n          <div className={jsStyles.scrollContainer(this.theme)}>\n            {React.Children.map(this.props.children, (child, index) => {\n              if (!child) {\n                return child;\n              }\n              if (typeof child === 'string' || typeof child === 'number') {\n                return child;\n              }\n\n              if (enableIconPadding && (isMenuItem(child) || isMenuHeader(child))) {\n                child = React.cloneElement(child, {\n                  _enableIconPadding: true,\n                });\n              }\n              if (isActiveElement(child)) {\n                const highlight = this.state.highlightedIndex === index;\n\n                let ref = child.ref;\n                if (highlight && typeof child.ref !== 'string') {\n                  ref = this.refHighlighted.bind(this, child.ref);\n                }\n\n                return React.cloneElement<MenuItemProps, MenuItem>(child, {\n                  ref,\n                  state: highlight ? 'hover' : child.props.state,\n                  onClick: this.select.bind(this, index, false),\n                  onMouseEnter: this.highlight.bind(this, index),\n                  onMouseLeave: this.unhighlight,\n                });\n              }\n              return child;\n            })}\n          </div>\n        </ScrollContainer>\n      </div>\n    );\n  }\n\n  private refScrollContainer = (scrollContainer: Nullable<ScrollContainer>) => {\n    this.scrollContainer = scrollContainer;\n  };\n\n  private refHighlighted(\n    originalRef: ((menuItem: MenuItem | null) => any) | React.RefObject<MenuItem> | null | undefined,\n    menuItem: MenuItem | null,\n  ) {\n    this.highlighted = menuItem;\n\n    if (typeof originalRef === 'function') {\n      originalRef(menuItem);\n    }\n  }\n\n  private scrollToSelected = () => {\n    if (this.scrollContainer && this.highlighted) {\n      this.scrollContainer.scrollTo(ReactDOM.findDOMNode(this.highlighted) as HTMLElement);\n    }\n  };\n\n  private scrollToTop = () => {\n    if (this.scrollContainer) {\n      this.scrollContainer.scrollToTop();\n    }\n  };\n\n  private scrollToBottom = () => {\n    if (this.scrollContainer) {\n      this.scrollContainer.scrollToBottom();\n    }\n  };\n\n  private select(index: number, shouldHandleHref: boolean, event: React.SyntheticEvent<HTMLElement>): boolean {\n    const item = childrenToArray(this.props.children)[index];\n    if (isActiveElement(item)) {\n      if (shouldHandleHref && item.props.href) {\n        if (item.props.target) {\n          window.open(item.props.href, item.props.target);\n        } else {\n          location.href = item.props.href;\n        }\n      }\n      if (item.props.onClick) {\n        item.props.onClick(event);\n      }\n      if (this.props.onItemClick) {\n        this.props.onItemClick();\n      }\n      return true;\n    }\n    return false;\n  }\n\n  private highlight = (index: number) => {\n    this.setState({ highlightedIndex: index });\n  };\n\n  private unhighlight = () => {\n    this.setState({ highlightedIndex: -1 });\n  };\n\n  private move(step: number) {\n    if (this.unmounted) {\n      // NOTE workaround, because `ComboBox` call `process.nextTick` in reducer\n      return;\n    }\n\n    const children = childrenToArray(this.props.children);\n    const activeElements = children.filter(isActiveElement);\n    if (!activeElements.length) {\n      return;\n    }\n    let index = this.state.highlightedIndex;\n    do {\n      index += step;\n      if (index < 0) {\n        index = children.length - 1;\n      } else if (index > children.length) {\n        index = 0;\n      }\n\n      const child = children[index];\n      if (isActiveElement(child)) {\n        this.setState({ highlightedIndex: index }, () => {\n          switch (activeElements.indexOf(child)) {\n            case 0:\n              this.scrollToTop();\n              break;\n            case activeElements.length - 1:\n              this.scrollToBottom();\n              break;\n            default:\n              this.scrollToSelected();\n          }\n        });\n        return;\n      }\n    } while (index !== this.state.highlightedIndex);\n  }\n\n  private isEmpty() {\n    const { children } = this.props;\n    return !children || !childrenToArray(children).filter(isExist).length;\n  }\n}\n\nfunction isExist(value: any): value is any {\n  return value !== null && value !== undefined;\n}\n\nfunction childrenToArray(children: React.ReactNode): React.ReactNode[] {\n  const ret: React.ReactNode[] = [];\n  // Use forEach instead of map to avoid cloning for key unifying.\n  React.Children.forEach(children, child => {\n    ret.push(child);\n  });\n  return ret;\n}\n"]}
+{"version":3,"sources":["Menu.tsx"],"names":["Menu","state","highlightedIndex","theme","scrollContainer","highlighted","unmounted","refScrollContainer","scrollToSelected","scrollTo","ReactDOM","findDOMNode","scrollToTop","scrollToBottom","highlight","index","setState","unhighlight","componentWillUnmount","render","renderMain","up","move","down","enter","event","select","reset","hasHighlightedItem","highlightItem","enableIconPadding","React","Children","toArray","props","children","some","x","isValidElement","icon","isEmpty","jsStyles","root","shadow","hasShadow","width","maxHeight","preventWindowScroll","map","child","cloneElement","_enableIconPadding","ref","refHighlighted","bind","onClick","onMouseEnter","onMouseLeave","originalRef","menuItem","shouldHandleHref","item","childrenToArray","href","target","window","open","location","onItemClick","step","activeElements","filter","isActiveElement","length","indexOf","isExist","Component","__KONTUR_REACT_UI__","defaultProps","value","undefined","ret","forEach","push"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport ReactDOM from 'react-dom';\r\nimport cn from 'classnames';\r\n\r\nimport { ScrollContainer } from '../../components/ScrollContainer';\r\nimport { isMenuItem, MenuItem, MenuItemProps } from '../../components/MenuItem';\r\nimport { isMenuHeader } from '../../components/MenuHeader';\r\nimport { Nullable } from '../../typings/utility-types';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { Theme } from '../../lib/theming/Theme';\r\n\r\nimport { jsStyles } from './Menu.styles';\r\nimport { isActiveElement } from './isActiveElement';\r\n\r\nexport interface MenuProps {\r\n  children: React.ReactNode;\r\n  hasShadow?: boolean;\r\n  maxHeight?: number | string;\r\n  onItemClick?: () => void;\r\n  width?: number | string;\r\n  preventWindowScroll?: boolean;\r\n}\r\n\r\nexport interface MenuState {\r\n  highlightedIndex: number;\r\n}\r\n\r\nexport class Menu extends React.Component<MenuProps, MenuState> {\r\n  public static __KONTUR_REACT_UI__ = 'Menu';\r\n\r\n  public static defaultProps = {\r\n    width: 'auto',\r\n    maxHeight: 300,\r\n    hasShadow: true,\r\n    preventWindowScroll: true,\r\n  };\r\n\r\n  public state = {\r\n    highlightedIndex: -1,\r\n  };\r\n\r\n  private theme!: Theme;\r\n  private scrollContainer: Nullable<ScrollContainer>;\r\n  private highlighted: Nullable<MenuItem>;\r\n  private unmounted = false;\r\n\r\n  public componentWillUnmount() {\r\n    this.unmounted = true;\r\n  }\r\n\r\n  public render() {\r\n    return (\r\n      <ThemeContext.Consumer>\r\n        {theme => {\r\n          this.theme = theme;\r\n          return this.renderMain();\r\n        }}\r\n      </ThemeContext.Consumer>\r\n    );\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public up() {\r\n    this.move(-1);\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public down() {\r\n    this.move(1);\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public enter(event: React.SyntheticEvent<HTMLElement>) {\r\n    return this.select(this.state.highlightedIndex, true, event);\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public reset() {\r\n    this.setState({ highlightedIndex: -1 });\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public hasHighlightedItem() {\r\n    return this.state.highlightedIndex !== -1;\r\n  }\r\n\r\n  public highlightItem(index: number) {\r\n    this.highlight(index);\r\n  }\r\n\r\n  private renderMain() {\r\n    const enableIconPadding = React.Children.toArray(this.props.children).some(\r\n      x => React.isValidElement(x) && x.props.icon,\r\n    );\r\n\r\n    if (this.isEmpty()) {\r\n      return null;\r\n    }\r\n\r\n    return (\r\n      <div\r\n        className={cn({\r\n          [jsStyles.root(this.theme)]: true,\r\n          [jsStyles.shadow(this.theme)]: this.props.hasShadow,\r\n        })}\r\n        style={{ width: this.props.width, maxHeight: this.props.maxHeight }}\r\n      >\r\n        <ScrollContainer\r\n          ref={this.refScrollContainer}\r\n          maxHeight={this.props.maxHeight}\r\n          preventWindowScroll={this.props.preventWindowScroll}\r\n        >\r\n          <div className={jsStyles.scrollContainer(this.theme)}>\r\n            {React.Children.map(this.props.children, (child, index) => {\r\n              if (!child) {\r\n                return child;\r\n              }\r\n              if (typeof child === 'string' || typeof child === 'number') {\r\n                return child;\r\n              }\r\n\r\n              if (enableIconPadding && (isMenuItem(child) || isMenuHeader(child))) {\r\n                child = React.cloneElement(child, {\r\n                  _enableIconPadding: true,\r\n                });\r\n              }\r\n              if (isActiveElement(child)) {\r\n                const highlight = this.state.highlightedIndex === index;\r\n\r\n                let ref = child.ref;\r\n                if (highlight && typeof child.ref !== 'string') {\r\n                  ref = this.refHighlighted.bind(this, child.ref);\r\n                }\r\n\r\n                return React.cloneElement<MenuItemProps, MenuItem>(child, {\r\n                  ref,\r\n                  state: highlight ? 'hover' : child.props.state,\r\n                  onClick: this.select.bind(this, index, false),\r\n                  onMouseEnter: this.highlight.bind(this, index),\r\n                  onMouseLeave: this.unhighlight,\r\n                });\r\n              }\r\n              return child;\r\n            })}\r\n          </div>\r\n        </ScrollContainer>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private refScrollContainer = (scrollContainer: Nullable<ScrollContainer>) => {\r\n    this.scrollContainer = scrollContainer;\r\n  };\r\n\r\n  private refHighlighted(\r\n    originalRef: ((menuItem: MenuItem | null) => any) | React.RefObject<MenuItem> | null | undefined,\r\n    menuItem: MenuItem | null,\r\n  ) {\r\n    this.highlighted = menuItem;\r\n\r\n    if (typeof originalRef === 'function') {\r\n      originalRef(menuItem);\r\n    }\r\n  }\r\n\r\n  private scrollToSelected = () => {\r\n    if (this.scrollContainer && this.highlighted) {\r\n      this.scrollContainer.scrollTo(ReactDOM.findDOMNode(this.highlighted) as HTMLElement);\r\n    }\r\n  };\r\n\r\n  private scrollToTop = () => {\r\n    if (this.scrollContainer) {\r\n      this.scrollContainer.scrollToTop();\r\n    }\r\n  };\r\n\r\n  private scrollToBottom = () => {\r\n    if (this.scrollContainer) {\r\n      this.scrollContainer.scrollToBottom();\r\n    }\r\n  };\r\n\r\n  private select(index: number, shouldHandleHref: boolean, event: React.SyntheticEvent<HTMLElement>): boolean {\r\n    const item = childrenToArray(this.props.children)[index];\r\n    if (isActiveElement(item)) {\r\n      if (shouldHandleHref && item.props.href) {\r\n        if (item.props.target) {\r\n          window.open(item.props.href, item.props.target);\r\n        } else {\r\n          location.href = item.props.href;\r\n        }\r\n      }\r\n      if (item.props.onClick) {\r\n        item.props.onClick(event);\r\n      }\r\n      if (this.props.onItemClick) {\r\n        this.props.onItemClick();\r\n      }\r\n      return true;\r\n    }\r\n    return false;\r\n  }\r\n\r\n  private highlight = (index: number) => {\r\n    this.setState({ highlightedIndex: index });\r\n  };\r\n\r\n  private unhighlight = () => {\r\n    this.setState({ highlightedIndex: -1 });\r\n  };\r\n\r\n  private move(step: number) {\r\n    if (this.unmounted) {\r\n      // NOTE workaround, because `ComboBox` call `process.nextTick` in reducer\r\n      return;\r\n    }\r\n\r\n    const children = childrenToArray(this.props.children);\r\n    const activeElements = children.filter(isActiveElement);\r\n    if (!activeElements.length) {\r\n      return;\r\n    }\r\n    let index = this.state.highlightedIndex;\r\n    do {\r\n      index += step;\r\n      if (index < 0) {\r\n        index = children.length - 1;\r\n      } else if (index > children.length) {\r\n        index = 0;\r\n      }\r\n\r\n      const child = children[index];\r\n      if (isActiveElement(child)) {\r\n        this.setState({ highlightedIndex: index }, () => {\r\n          switch (activeElements.indexOf(child)) {\r\n            case 0:\r\n              this.scrollToTop();\r\n              break;\r\n            case activeElements.length - 1:\r\n              this.scrollToBottom();\r\n              break;\r\n            default:\r\n              this.scrollToSelected();\r\n          }\r\n        });\r\n        return;\r\n      }\r\n    } while (index !== this.state.highlightedIndex);\r\n  }\r\n\r\n  private isEmpty() {\r\n    const { children } = this.props;\r\n    return !children || !childrenToArray(children).filter(isExist).length;\r\n  }\r\n}\r\n\r\nfunction isExist(value: any): value is any {\r\n  return value !== null && value !== undefined;\r\n}\r\n\r\nfunction childrenToArray(children: React.ReactNode): React.ReactNode[] {\r\n  const ret: React.ReactNode[] = [];\r\n  // Use forEach instead of map to avoid cloning for key unifying.\r\n  React.Children.forEach(children, child => {\r\n    ret.push(child);\r\n  });\r\n  return ret;\r\n}\r\n"]}

package/cjs/internal/Menu/Menu.styles.d.ts

@@ -1,5 +1,5 @@
-export declare const jsStyles: {
-    root(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme>): string;
-    scrollContainer(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme>): string;
-    shadow(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme>): string;
-};
+export declare const jsStyles: {
+    root(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme>): string;
+    scrollContainer(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme>): string;
+    shadow(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme>): string;
+};

package/cjs/internal/Menu/Menu.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Menu.styles.ts"],"names":["styles","root","t","css","menuBgDefault","menuPaddingY","scrollContainer","shadow","menuBorder","menuShadow","jsStyles"],"mappings":"8QAAA;;AAEA,8D;;AAEA,IAAMA,MAAM,GAAG;AACbC,EAAAA,IADa,gBACRC,CADQ,EACE;AACb,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACE,aADlB;;;AAIa,kCAAWF,CAAX,IAAgB,CAAhB,GAAoBA,CAAC,CAACG,YAJnC;;AAMD,GARY;;AAUbC,EAAAA,eAVa,2BAUGJ,CAVH,EAUa;AACxB,eAAOC,YAAP;AACa,kCAAWD,CAAX,IAAgBA,CAAC,CAACG,YAAlB,GAAiC,CAD9C;;AAGD,GAdY;;AAgBbE,EAAAA,MAhBa,kBAgBNL,CAhBM,EAgBI;AACf,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACM,UADd;AAEgBN,IAAAA,CAAC,CAACO,UAFlB;;AAID,GArBY,EAAf;;;AAwBO,IAAMC,QAAQ,GAAG,2BAAaV,MAAb,CAAjB,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { is8pxTheme } from '../../lib/theming/ThemeHelpers';\n\nconst styles = {\n  root(t: Theme) {\n    return css`\n      background: ${t.menuBgDefault};\n      box-sizing: content-box;\n      overflow: auto;\n      padding: ${is8pxTheme(t) ? 0 : t.menuPaddingY} 0;\n    `;\n  },\n\n  scrollContainer(t: Theme) {\n    return css`\n      padding: ${is8pxTheme(t) ? t.menuPaddingY : 0} 0;\n    `;\n  },\n\n  shadow(t: Theme) {\n    return css`\n      border: ${t.menuBorder};\n      box-shadow: ${t.menuShadow};\n    `;\n  },\n};\n\nexport const jsStyles = memoizeStyle(styles);\n"]}
+{"version":3,"sources":["Menu.styles.ts"],"names":["styles","root","t","css","menuBgDefault","menuPaddingY","scrollContainer","shadow","menuBorder","menuShadow","jsStyles"],"mappings":"8QAAA;;AAEA,8D;;AAEA,IAAMA,MAAM,GAAG;AACbC,EAAAA,IADa,gBACRC,CADQ,EACE;AACb,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACE,aADlB;;;AAIa,kCAAWF,CAAX,IAAgB,CAAhB,GAAoBA,CAAC,CAACG,YAJnC;;AAMD,GARY;;AAUbC,EAAAA,eAVa,2BAUGJ,CAVH,EAUa;AACxB,eAAOC,YAAP;AACa,kCAAWD,CAAX,IAAgBA,CAAC,CAACG,YAAlB,GAAiC,CAD9C;;AAGD,GAdY;;AAgBbE,EAAAA,MAhBa,kBAgBNL,CAhBM,EAgBI;AACf,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACM,UADd;AAEgBN,IAAAA,CAAC,CAACO,UAFlB;;AAID,GArBY,EAAf;;;AAwBO,IAAMC,QAAQ,GAAG,2BAAaV,MAAb,CAAjB,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { is8pxTheme } from '../../lib/theming/ThemeHelpers';\r\n\r\nconst styles = {\r\n  root(t: Theme) {\r\n    return css`\r\n      background: ${t.menuBgDefault};\r\n      box-sizing: content-box;\r\n      overflow: auto;\r\n      padding: ${is8pxTheme(t) ? 0 : t.menuPaddingY} 0;\r\n    `;\r\n  },\r\n\r\n  scrollContainer(t: Theme) {\r\n    return css`\r\n      padding: ${is8pxTheme(t) ? t.menuPaddingY : 0} 0;\r\n    `;\r\n  },\r\n\r\n  shadow(t: Theme) {\r\n    return css`\r\n      border: ${t.menuBorder};\r\n      box-shadow: ${t.menuShadow};\r\n    `;\r\n  },\r\n};\r\n\r\nexport const jsStyles = memoizeStyle(styles);\r\n"]}

package/cjs/internal/Menu/index.d.ts

@@ -1 +1 @@
-export * from './Menu';
+export * from './Menu';

package/cjs/internal/Menu/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './Menu';\n"]}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './Menu';\r\n"]}

package/cjs/internal/Menu/isActiveElement.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-import { MenuItem, MenuItemProps } from '../../components/MenuItem';
-export declare function isActiveElement(element: any): element is React.ComponentElement<MenuItemProps, MenuItem>;
+import React from 'react';
+import { MenuItem, MenuItemProps } from '../../components/MenuItem';
+export declare function isActiveElement(element: any): element is React.ComponentElement<MenuItemProps, MenuItem>;

package/cjs/internal/Menu/isActiveElement.js.map

@@ -1 +1 @@
-{"version":3,"sources":["isActiveElement.tsx"],"names":["isActiveElement","element","props","disabled"],"mappings":";;AAEA;;AAEO,SAASA,eAAT,CAAyBC,OAAzB,EAAmG;AACxG,SAAO,0BAAWA,OAAX,KAAuB,CAACA,OAAO,CAACC,KAAR,CAAcC,QAA7C;AACD","sourcesContent":["import React from 'react';\n\nimport { MenuItem, MenuItemProps, isMenuItem } from '../../components/MenuItem';\n\nexport function isActiveElement(element: any): element is React.ComponentElement<MenuItemProps, MenuItem> {\n  return isMenuItem(element) && !element.props.disabled;\n}\n"]}
+{"version":3,"sources":["isActiveElement.tsx"],"names":["isActiveElement","element","props","disabled"],"mappings":";;AAEA;;AAEO,SAASA,eAAT,CAAyBC,OAAzB,EAAmG;AACxG,SAAO,0BAAWA,OAAX,KAAuB,CAACA,OAAO,CAACC,KAAR,CAAcC,QAA7C;AACD","sourcesContent":["import React from 'react';\r\n\r\nimport { MenuItem, MenuItemProps, isMenuItem } from '../../components/MenuItem';\r\n\r\nexport function isActiveElement(element: any): element is React.ComponentElement<MenuItemProps, MenuItem> {\r\n  return isMenuItem(element) && !element.props.disabled;\r\n}\r\n"]}

package/cjs/internal/PerformanceMetrics/PerformanceMetrics.d.ts

@@ -1,7 +1,7 @@
-import React from 'react';
-interface PerformanceMetricsProps {
-    componentsA: React.ReactElement<any>;
-    componentsB: React.ReactElement<any>;
-}
-export declare function PerformanceMetrics(props: PerformanceMetricsProps): JSX.Element;
-export {};
+import React from 'react';
+interface PerformanceMetricsProps {
+    componentsA: React.ReactElement<any>;
+    componentsB: React.ReactElement<any>;
+}
+export declare function PerformanceMetrics(props: PerformanceMetricsProps): JSX.Element;
+export {};

package/cjs/internal/PerformanceMetrics/PerformanceMetrics.js.map

@@ -1 +1 @@
-{"version":3,"sources":["PerformanceMetrics.tsx"],"names":["PANEL_WRAPPER_STYLES","width","display","verticalAlign","PerformanceMetrics","props","padding","position","componentsA","componentsB","PerformanceMetricsPanel","state","mounted","container","setContainerRef","element","toggleMountedState","setState","render","lineHeight","title","marginBottom","componentDidMount","ReactDOM","component","componentDidUpdate","unmountComponentAtNode","React","Component"],"mappings":"0QAAA;AACA;;AAEA;;AAEA;;AAEA,IAAMA,oBAAoB,GAAG,EAAEC,KAAK,EAAE,KAAT,EAAgBC,OAAO,EAAE,cAAzB,EAAyCC,aAAa,EAAE,KAAxD,EAA7B;;;;;;;AAOO,SAASC,kBAAT,CAA4BC,KAA5B,EAA4D;AACjE;AACE,0CAAK,KAAK,EAAE,EAAEC,OAAO,EAAE,EAAX,EAAeL,KAAK,EAAE,IAAtB,EAAZ;AACE,0CAAK,KAAK,EAAE,EAAEM,QAAQ,EAAE,UAAZ,EAAZ;AACE,iCAAC,gBAAD,IAAS,IAAI,EAAE,MAAf,EAAuB,OAAO,EAAE,EAAhC,GADF,CADF;;AAIE,0CAAK,KAAK,EAAE,EAAED,OAAO,EAAE,EAAX,EAAZ;AACE,0CAAK,KAAK,EAAEN,oBAAZ;AACE,iCAAC,uBAAD,IAAyB,KAAK,EAAE,QAAhC,EAA0C,SAAS,EAAEK,KAAK,CAACG,WAA3D,GADF,CADF;;AAIE,0CAAK,KAAK,EAAER,oBAAZ;AACE,iCAAC,uBAAD,IAAyB,KAAK,EAAE,QAAhC,EAA0C,SAAS,EAAEK,KAAK,CAACI,WAA3D,GADF,CAJF,CAJF,CADF;;;;;AAeD,C;;;;;;;;;;AAUKC,uB;AACGC,IAAAA,K,GAAQ;AACbC,MAAAA,OAAO,EAAE,KADI,E;;AAGPC,IAAAA,S;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCAC,IAAAA,e,GAAkB,UAACC,OAAD,EAAoC;AAC5D,YAAKF,SAAL,GAAiBE,OAAjB;AACD,K;;AAEOC,IAAAA,kB,GAAqB,YAAM;AACjC,YAAKC,QAAL,CAAc;AACZL,QAAAA,OAAO,EAAE,CAAC,MAAKD,KAAL,CAAWC,OADT,EAAd;;AAGD,K,qEAvCMM,M,GAAP,kBAAgB,CACd,oBACE,uDACE,qCAAI,KAAK,EAAE,EAAEC,UAAU,EAAE,KAAd,EAAX,IAAmC,KAAKd,KAAL,CAAWe,KAA9C,CADF,eAEE,sCAAK,KAAK,EAAE,EAAEC,YAAY,EAAE,EAAhB,EAAZ,iBACE,6BAAC,cAAD,IAAQ,OAAO,EAAE,KAAKL,kBAAtB,EAA0C,IAAI,EAAE,OAAhD,IACG,KAAKL,KAAL,CAAWC,OAAX,GAAqB,SAArB,GAAiC,OADpC,CADF,CAFF,eAOE,sCAAK,GAAG,EAAE,KAAKE,eAAf,GAPF,CADF,CAWD,C,QAEMQ,iB,GAAP,6BAA2B,CACzB,IAAI,KAAKX,KAAL,CAAWC,OAAX,IAAsB,KAAKC,SAA/B,EAA0C,CACxCU,kBAASL,MAAT,CAAgB,KAAKb,KAAL,CAAWmB,SAA3B,EAAsC,KAAKX,SAA3C,EACD,CACF,C,QAEMY,kB,GAAP,8BAAkC,CAChC,IAAI,CAAC,KAAKZ,SAAV,EAAqB,CACnB,OACD,CACD,IAAI,KAAKF,KAAL,CAAWC,OAAf,EAAwB,CACtBW,kBAASL,MAAT,CAAgB,KAAKb,KAAL,CAAWmB,SAA3B,EAAsC,KAAKX,SAA3C,EACD,CAFD,MAEO,CACLU,kBAASG,sBAAT,CAAgC,KAAKb,SAArC,EACD,CACF,C,kCAnCmCc,eAAMC,S","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\n\nimport { Button } from '../../components/Button';\nimport { Nullable } from '../../typings/utility-types';\nimport { Spinner } from '../../components/Spinner';\n\nconst PANEL_WRAPPER_STYLES = { width: '45%', display: 'inline-block', verticalAlign: 'top' };\n\ninterface PerformanceMetricsProps {\n  componentsA: React.ReactElement<any>;\n  componentsB: React.ReactElement<any>;\n}\n\nexport function PerformanceMetrics(props: PerformanceMetricsProps) {\n  return (\n    <div style={{ padding: 10, width: 1200 }}>\n      <div style={{ position: 'absolute' }}>\n        <Spinner type={'mini'} caption={''} />\n      </div>\n      <div style={{ padding: 10 }}>\n        <div style={PANEL_WRAPPER_STYLES}>\n          <PerformanceMetricsPanel title={'Case A'} component={props.componentsA} />\n        </div>\n        <div style={PANEL_WRAPPER_STYLES}>\n          <PerformanceMetricsPanel title={'Case B'} component={props.componentsB} />\n        </div>\n      </div>\n    </div>\n  );\n}\n\ninterface PerformanceMetricsPanelProps {\n  title: string;\n  component: React.ReactElement<any>;\n}\ninterface PerformanceMetricsPanelState {\n  mounted: boolean;\n}\n\nclass PerformanceMetricsPanel extends React.Component<PerformanceMetricsPanelProps, PerformanceMetricsPanelState> {\n  public state = {\n    mounted: false,\n  };\n  private container: Nullable<HTMLElement>;\n\n  public render() {\n    return (\n      <div>\n        <h1 style={{ lineHeight: '2em' }}>{this.props.title}</h1>\n        <div style={{ marginBottom: 10 }}>\n          <Button onClick={this.toggleMountedState} size={'small'}>\n            {this.state.mounted ? 'Unmount' : 'Mount'}\n          </Button>\n        </div>\n        <div ref={this.setContainerRef} />\n      </div>\n    );\n  }\n\n  public componentDidMount() {\n    if (this.state.mounted && this.container) {\n      ReactDOM.render(this.props.component, this.container);\n    }\n  }\n\n  public componentDidUpdate(): void {\n    if (!this.container) {\n      return;\n    }\n    if (this.state.mounted) {\n      ReactDOM.render(this.props.component, this.container);\n    } else {\n      ReactDOM.unmountComponentAtNode(this.container);\n    }\n  }\n\n  private setContainerRef = (element: Nullable<HTMLElement>) => {\n    this.container = element;\n  };\n\n  private toggleMountedState = () => {\n    this.setState({\n      mounted: !this.state.mounted,\n    });\n  };\n}\n"]}
+{"version":3,"sources":["PerformanceMetrics.tsx"],"names":["PANEL_WRAPPER_STYLES","width","display","verticalAlign","PerformanceMetrics","props","padding","position","componentsA","componentsB","PerformanceMetricsPanel","state","mounted","container","setContainerRef","element","toggleMountedState","setState","render","lineHeight","title","marginBottom","componentDidMount","ReactDOM","component","componentDidUpdate","unmountComponentAtNode","React","Component"],"mappings":"0QAAA;AACA;;AAEA;;AAEA;;AAEA,IAAMA,oBAAoB,GAAG,EAAEC,KAAK,EAAE,KAAT,EAAgBC,OAAO,EAAE,cAAzB,EAAyCC,aAAa,EAAE,KAAxD,EAA7B;;;;;;;AAOO,SAASC,kBAAT,CAA4BC,KAA5B,EAA4D;AACjE;AACE,0CAAK,KAAK,EAAE,EAAEC,OAAO,EAAE,EAAX,EAAeL,KAAK,EAAE,IAAtB,EAAZ;AACE,0CAAK,KAAK,EAAE,EAAEM,QAAQ,EAAE,UAAZ,EAAZ;AACE,iCAAC,gBAAD,IAAS,IAAI,EAAE,MAAf,EAAuB,OAAO,EAAE,EAAhC,GADF,CADF;;AAIE,0CAAK,KAAK,EAAE,EAAED,OAAO,EAAE,EAAX,EAAZ;AACE,0CAAK,KAAK,EAAEN,oBAAZ;AACE,iCAAC,uBAAD,IAAyB,KAAK,EAAE,QAAhC,EAA0C,SAAS,EAAEK,KAAK,CAACG,WAA3D,GADF,CADF;;AAIE,0CAAK,KAAK,EAAER,oBAAZ;AACE,iCAAC,uBAAD,IAAyB,KAAK,EAAE,QAAhC,EAA0C,SAAS,EAAEK,KAAK,CAACI,WAA3D,GADF,CAJF,CAJF,CADF;;;;;AAeD,C;;;;;;;;;;AAUKC,uB;AACGC,IAAAA,K,GAAQ;AACbC,MAAAA,OAAO,EAAE,KADI,E;;AAGPC,IAAAA,S;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCAC,IAAAA,e,GAAkB,UAACC,OAAD,EAAoC;AAC5D,YAAKF,SAAL,GAAiBE,OAAjB;AACD,K;;AAEOC,IAAAA,kB,GAAqB,YAAM;AACjC,YAAKC,QAAL,CAAc;AACZL,QAAAA,OAAO,EAAE,CAAC,MAAKD,KAAL,CAAWC,OADT,EAAd;;AAGD,K,qEAvCMM,M,GAAP,kBAAgB,CACd,oBACE,uDACE,qCAAI,KAAK,EAAE,EAAEC,UAAU,EAAE,KAAd,EAAX,IAAmC,KAAKd,KAAL,CAAWe,KAA9C,CADF,eAEE,sCAAK,KAAK,EAAE,EAAEC,YAAY,EAAE,EAAhB,EAAZ,iBACE,6BAAC,cAAD,IAAQ,OAAO,EAAE,KAAKL,kBAAtB,EAA0C,IAAI,EAAE,OAAhD,IACG,KAAKL,KAAL,CAAWC,OAAX,GAAqB,SAArB,GAAiC,OADpC,CADF,CAFF,eAOE,sCAAK,GAAG,EAAE,KAAKE,eAAf,GAPF,CADF,CAWD,C,QAEMQ,iB,GAAP,6BAA2B,CACzB,IAAI,KAAKX,KAAL,CAAWC,OAAX,IAAsB,KAAKC,SAA/B,EAA0C,CACxCU,kBAASL,MAAT,CAAgB,KAAKb,KAAL,CAAWmB,SAA3B,EAAsC,KAAKX,SAA3C,EACD,CACF,C,QAEMY,kB,GAAP,8BAAkC,CAChC,IAAI,CAAC,KAAKZ,SAAV,EAAqB,CACnB,OACD,CACD,IAAI,KAAKF,KAAL,CAAWC,OAAf,EAAwB,CACtBW,kBAASL,MAAT,CAAgB,KAAKb,KAAL,CAAWmB,SAA3B,EAAsC,KAAKX,SAA3C,EACD,CAFD,MAEO,CACLU,kBAASG,sBAAT,CAAgC,KAAKb,SAArC,EACD,CACF,C,kCAnCmCc,eAAMC,S","sourcesContent":["import React from 'react';\r\nimport ReactDOM from 'react-dom';\r\n\r\nimport { Button } from '../../components/Button';\r\nimport { Nullable } from '../../typings/utility-types';\r\nimport { Spinner } from '../../components/Spinner';\r\n\r\nconst PANEL_WRAPPER_STYLES = { width: '45%', display: 'inline-block', verticalAlign: 'top' };\r\n\r\ninterface PerformanceMetricsProps {\r\n  componentsA: React.ReactElement<any>;\r\n  componentsB: React.ReactElement<any>;\r\n}\r\n\r\nexport function PerformanceMetrics(props: PerformanceMetricsProps) {\r\n  return (\r\n    <div style={{ padding: 10, width: 1200 }}>\r\n      <div style={{ position: 'absolute' }}>\r\n        <Spinner type={'mini'} caption={''} />\r\n      </div>\r\n      <div style={{ padding: 10 }}>\r\n        <div style={PANEL_WRAPPER_STYLES}>\r\n          <PerformanceMetricsPanel title={'Case A'} component={props.componentsA} />\r\n        </div>\r\n        <div style={PANEL_WRAPPER_STYLES}>\r\n          <PerformanceMetricsPanel title={'Case B'} component={props.componentsB} />\r\n        </div>\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n\r\ninterface PerformanceMetricsPanelProps {\r\n  title: string;\r\n  component: React.ReactElement<any>;\r\n}\r\ninterface PerformanceMetricsPanelState {\r\n  mounted: boolean;\r\n}\r\n\r\nclass PerformanceMetricsPanel extends React.Component<PerformanceMetricsPanelProps, PerformanceMetricsPanelState> {\r\n  public state = {\r\n    mounted: false,\r\n  };\r\n  private container: Nullable<HTMLElement>;\r\n\r\n  public render() {\r\n    return (\r\n      <div>\r\n        <h1 style={{ lineHeight: '2em' }}>{this.props.title}</h1>\r\n        <div style={{ marginBottom: 10 }}>\r\n          <Button onClick={this.toggleMountedState} size={'small'}>\r\n            {this.state.mounted ? 'Unmount' : 'Mount'}\r\n          </Button>\r\n        </div>\r\n        <div ref={this.setContainerRef} />\r\n      </div>\r\n    );\r\n  }\r\n\r\n  public componentDidMount() {\r\n    if (this.state.mounted && this.container) {\r\n      ReactDOM.render(this.props.component, this.container);\r\n    }\r\n  }\r\n\r\n  public componentDidUpdate(): void {\r\n    if (!this.container) {\r\n      return;\r\n    }\r\n    if (this.state.mounted) {\r\n      ReactDOM.render(this.props.component, this.container);\r\n    } else {\r\n      ReactDOM.unmountComponentAtNode(this.container);\r\n    }\r\n  }\r\n\r\n  private setContainerRef = (element: Nullable<HTMLElement>) => {\r\n    this.container = element;\r\n  };\r\n\r\n  private toggleMountedState = () => {\r\n    this.setState({\r\n      mounted: !this.state.mounted,\r\n    });\r\n  };\r\n}\r\n"]}

package/cjs/internal/Popup/Popup.d.ts

@@ -1,145 +1,145 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { Nullable } from '../../typings/utility-types';
-import { FocusEventType, MouseEventType } from '../../typings/event-types';
-import { CommonProps } from '../CommonWrapper';
-export declare type PopupPosition = 'top left' | 'top center' | 'top right' | 'right top' | 'right middle' | 'right bottom' | 'bottom left' | 'bottom center' | 'bottom right' | 'left top' | 'left middle' | 'left bottom';
-export declare const PopupPositions: PopupPosition[];
-export interface PopupHandlerProps {
-    onMouseEnter?: (event: MouseEventType) => void;
-    onMouseLeave?: (event: MouseEventType) => void;
-    onClick?: (event: MouseEventType) => void;
-    onFocus?: (event: FocusEventType) => void;
-    onBlur?: (event: FocusEventType) => void;
-    onOpen?: () => void;
-    onClose?: () => void;
-}
-export interface PopupProps extends CommonProps, PopupHandlerProps {
-    anchorElement: React.ReactNode | HTMLElement;
-    backgroundColor?: React.CSSProperties['backgroundColor'];
-    borderColor?: React.CSSProperties['borderColor'];
-    children: React.ReactNode | (() => React.ReactNode);
-    hasPin: boolean;
-    hasShadow: boolean;
-    disableAnimations: boolean;
-    margin?: number;
-    maxWidth?: number | string;
-    opened: boolean;
-    pinOffset?: number;
-    pinSize?: number;
-    popupOffset: number;
-    positions: PopupPosition[];
-    useWrapper: boolean;
-    ignoreHover: boolean;
-}
-interface PopupLocation {
-    coordinates: {
-        left: number;
-        top: number;
-    };
-    position: PopupPosition;
-}
-export interface PopupState {
-    location: Nullable<PopupLocation>;
-}
-export declare class Popup extends React.Component<PopupProps, PopupState> {
-    static __KONTUR_REACT_UI__: string;
-    static propTypes: {
-        /**
-         * Ссылка (ref) на элемент или React компонент, для которого рисуется попап
-         */
-        anchorElement: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        /**
-         * Фон попапа и пина
-         */
-        backgroundColor: PropTypes.Requireable<string>;
-        children: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        /**
-         * Показывать ли пин
-         */
-        hasPin: PropTypes.Requireable<boolean>;
-        /**
-         * Применять ли box-shadow на попапе. При false отключает границу на пине
-         */
-        hasShadow: PropTypes.Requireable<boolean>;
-        /**
-         * Отступ попапа от элемента
-         */
-        margin: PropTypes.Requireable<number>;
-        /**
-         * Показан или скрыт попап
-         */
-        opened: PropTypes.Requireable<boolean>;
-        /**
-         * Смещение пина от края попапа. Край задаётся в пропе position вторым словом
-         */
-        pinOffset: PropTypes.Requireable<number>;
-        /**
-         * Сторона пина без учёта границы.
-         * Пин представляет собой равносторонний треугольник, высота от попапа
-         * до "носика" пина будет соответствовать формуле (size* √3)/2
-         */
-        pinSize: PropTypes.Requireable<number>;
-        /**
-         * смещение попапа относительно родительского элемента
-         */
-        popupOffset: PropTypes.Requireable<number>;
-        /**
-         * С какой стороны показывать попап и край попапа,
-         * на котором будет отображаться пин
-         */
-        positions: PropTypes.Requireable<any[]>;
-        /**
-         * Игнорировать ли события hover/click
-         */
-        ignoreHover: PropTypes.Requireable<boolean>;
-    };
-    static defaultProps: {
-        popupOffset: number;
-        hasPin: boolean;
-        hasShadow: boolean;
-        disableAnimations: boolean;
-        useWrapper: boolean;
-        ignoreHover: boolean;
-    };
-    state: PopupState;
-    private theme;
-    private layoutEventsToken;
-    private locationUpdateId;
-    private lastPopupElement;
-    private anchorElement;
-    private anchorInstance;
-    componentDidMount(): void;
-    UNSAFE_componentWillReceiveProps(nextProps: Readonly<PopupProps>): void;
-    componentDidUpdate(prevProps: PopupProps, prevState: PopupState): void;
-    componentWillUnmount(): void;
-    render(): JSX.Element;
-    private renderMain;
-    private refAnchorElement;
-    private extractElement;
-    private updateAnchorElement;
-    private addEventListeners;
-    private removeEventListeners;
-    private handleMouseEnter;
-    private handleMouseLeave;
-    private handleClick;
-    private handleFocus;
-    private handleBlur;
-    private renderContent;
-    private resetLocation;
-    private renderChildren;
-    private refPopupElement;
-    private renderPin;
-    private handleLayoutEvent;
-    private delayUpdateLocation;
-    private cancelDelayedUpdateLocation;
-    private updateLocation;
-    private locationEquals;
-    private getLocation;
-    private getPinnedPopupOffset;
-    private getCoordinates;
-    private getPinOffset;
-    private getHorizontalPosition;
-    private getVerticalPosition;
-}
-export {};
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Nullable } from '../../typings/utility-types';
+import { FocusEventType, MouseEventType } from '../../typings/event-types';
+import { CommonProps } from '../CommonWrapper';
+export declare type PopupPosition = 'top left' | 'top center' | 'top right' | 'right top' | 'right middle' | 'right bottom' | 'bottom left' | 'bottom center' | 'bottom right' | 'left top' | 'left middle' | 'left bottom';
+export declare const PopupPositions: PopupPosition[];
+export interface PopupHandlerProps {
+    onMouseEnter?: (event: MouseEventType) => void;
+    onMouseLeave?: (event: MouseEventType) => void;
+    onClick?: (event: MouseEventType) => void;
+    onFocus?: (event: FocusEventType) => void;
+    onBlur?: (event: FocusEventType) => void;
+    onOpen?: () => void;
+    onClose?: () => void;
+}
+export interface PopupProps extends CommonProps, PopupHandlerProps {
+    anchorElement: React.ReactNode | HTMLElement;
+    backgroundColor?: React.CSSProperties['backgroundColor'];
+    borderColor?: React.CSSProperties['borderColor'];
+    children: React.ReactNode | (() => React.ReactNode);
+    hasPin: boolean;
+    hasShadow: boolean;
+    disableAnimations: boolean;
+    margin?: number;
+    maxWidth?: number | string;
+    opened: boolean;
+    pinOffset?: number;
+    pinSize?: number;
+    popupOffset: number;
+    positions: PopupPosition[];
+    useWrapper: boolean;
+    ignoreHover: boolean;
+}
+interface PopupLocation {
+    coordinates: {
+        left: number;
+        top: number;
+    };
+    position: PopupPosition;
+}
+export interface PopupState {
+    location: Nullable<PopupLocation>;
+}
+export declare class Popup extends React.Component<PopupProps, PopupState> {
+    static __KONTUR_REACT_UI__: string;
+    static propTypes: {
+        /**
+         * Ссылка (ref) на элемент или React компонент, для которого рисуется попап
+         */
+        anchorElement: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
+        /**
+         * Фон попапа и пина
+         */
+        backgroundColor: PropTypes.Requireable<string>;
+        children: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
+        /**
+         * Показывать ли пин
+         */
+        hasPin: PropTypes.Requireable<boolean>;
+        /**
+         * Применять ли box-shadow на попапе. При false отключает границу на пине
+         */
+        hasShadow: PropTypes.Requireable<boolean>;
+        /**
+         * Отступ попапа от элемента
+         */
+        margin: PropTypes.Requireable<number>;
+        /**
+         * Показан или скрыт попап
+         */
+        opened: PropTypes.Requireable<boolean>;
+        /**
+         * Смещение пина от края попапа. Край задаётся в пропе position вторым словом
+         */
+        pinOffset: PropTypes.Requireable<number>;
+        /**
+         * Сторона пина без учёта границы.
+         * Пин представляет собой равносторонний треугольник, высота от попапа
+         * до "носика" пина будет соответствовать формуле (size* √3)/2
+         */
+        pinSize: PropTypes.Requireable<number>;
+        /**
+         * смещение попапа относительно родительского элемента
+         */
+        popupOffset: PropTypes.Requireable<number>;
+        /**
+         * С какой стороны показывать попап и край попапа,
+         * на котором будет отображаться пин
+         */
+        positions: PropTypes.Requireable<any[]>;
+        /**
+         * Игнорировать ли события hover/click
+         */
+        ignoreHover: PropTypes.Requireable<boolean>;
+    };
+    static defaultProps: {
+        popupOffset: number;
+        hasPin: boolean;
+        hasShadow: boolean;
+        disableAnimations: boolean;
+        useWrapper: boolean;
+        ignoreHover: boolean;
+    };
+    state: PopupState;
+    private theme;
+    private layoutEventsToken;
+    private locationUpdateId;
+    private lastPopupElement;
+    private anchorElement;
+    private anchorInstance;
+    componentDidMount(): void;
+    UNSAFE_componentWillReceiveProps(nextProps: Readonly<PopupProps>): void;
+    componentDidUpdate(prevProps: PopupProps, prevState: PopupState): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+    private renderMain;
+    private refAnchorElement;
+    private extractElement;
+    private updateAnchorElement;
+    private addEventListeners;
+    private removeEventListeners;
+    private handleMouseEnter;
+    private handleMouseLeave;
+    private handleClick;
+    private handleFocus;
+    private handleBlur;
+    private renderContent;
+    private resetLocation;
+    private renderChildren;
+    private refPopupElement;
+    private renderPin;
+    private handleLayoutEvent;
+    private delayUpdateLocation;
+    private cancelDelayedUpdateLocation;
+    private updateLocation;
+    private locationEquals;
+    private getLocation;
+    private getPinnedPopupOffset;
+    private getCoordinates;
+    private getPinOffset;
+    private getHorizontalPosition;
+    private getVerticalPosition;
+}
+export {};

package/cjs/internal/Popup/Popup.js

@@ -465,12 +465,12 @@ Popup = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(P
       if (!_this.locationEquals(_this.state.location, location)) {
         _this.setState({ location: location });
       }
-    };return _this;}var _proto = Popup.prototype;_proto.componentDidMount = function componentDidMount() {this.updateLocation();this.layoutEventsToken = LayoutEvents.addListener(this.handleLayoutEvent);};_proto.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(nextProps) {/**
-     * Delaying updateLocation to ensure it happens after props update
-     */if (nextProps.opened) {if (!this.state.location) {this.setState({ location: DUMMY_LOCATION });}this.delayUpdateLocation();}};_proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {var hadNoLocation = prevState.location === DUMMY_LOCATION;var hasLocation = this.state.location !== DUMMY_LOCATION;if (hadNoLocation && hasLocation && this.props.onOpen) {this.props.onOpen();}if (!hadNoLocation && !this.state.location && this.props.onClose) {this.props.onClose();}};_proto.componentWillUnmount = function componentWillUnmount() {this.cancelDelayedUpdateLocation();this.removeEventListeners(this.anchorElement);if (this.layoutEventsToken) {this.layoutEventsToken.remove();this.layoutEventsToken = null;}if (this.state.location && this.props.onClose) {this.props.onClose();}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var location = this.state.location;var _this$props = this.props,anchorElement = _this$props.anchorElement,useWrapper = _this$props.useWrapper;var child = null;if ((0, _SSRSafe.isHTMLElement)(anchorElement)) {this.updateAnchorElement(anchorElement);} else if ( /*#__PURE__*/_react.default.isValidElement(anchorElement)) {child = useWrapper ? /*#__PURE__*/_react.default.createElement("span", null, anchorElement) : anchorElement;} else {child = /*#__PURE__*/_react.default.createElement("span", null, anchorElement);}return /*#__PURE__*/_react.default.createElement(_RenderContainer.RenderContainer, { anchor: child, ref: child ? this.refAnchorElement : undefined }, location && this.renderContent(location));};_proto.extractElement = function extractElement(instance) {if (!instance) {return null;}var element = (0, _reactDom.findDOMNode)(instance);return (0, _SSRSafe.isHTMLElement)(element) ? element : null;};_proto.updateAnchorElement = function updateAnchorElement(element) {var anchorElement = this.anchorElement;if (element !== anchorElement) {this.removeEventListeners(anchorElement);this.anchorElement = element;this.addEventListeners(element);}};_proto.addEventListeners = function addEventListeners(element) {if (element && (0, _SSRSafe.isHTMLElement)(element)) {element.addEventListener('mouseenter', this.handleMouseEnter);element.addEventListener('mouseleave', this.handleMouseLeave);element.addEventListener('click', this.handleClick);element.addEventListener('focusin', this.handleFocus);element.addEventListener('focusout', this.handleBlur);}};_proto.removeEventListeners = function removeEventListeners(element) {if (element && (0, _SSRSafe.isHTMLElement)(element)) {element.removeEventListener('mouseenter', this.handleMouseEnter);element.removeEventListener('mouseleave', this.handleMouseLeave);element.removeEventListener('click', this.handleClick);element.removeEventListener('focusin', this.handleFocus);element.removeEventListener('focusout', this.handleBlur);}};_proto.renderContent = function renderContent(location) {var _this3 = this;var _this$props2 = this.props,backgroundColor = _this$props2.backgroundColor,disableAnimations = _this$props2.disableAnimations,maxWidth = _this$props2.maxWidth,hasShadow = _this$props2.hasShadow,ignoreHover = _this$props2.ignoreHover,opened = _this$props2.opened;var children = this.renderChildren();var _PopupHelper$getPosit = _PopupHelper.PopupHelper.getPositionObject(location.position),direction = _PopupHelper$getPosit.direction;var rootStyle = (0, _extends3.default)({}, location.coordinates, { maxWidth: maxWidth });return /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.Transition, { timeout: TRANSITION_TIMEOUT, appear: !disableAnimations, in: Boolean(opened && children), mountOnEnter: true, unmountOnExit: true, enter: !disableAnimations, exit: !disableAnimations, onExited: this.resetLocation }, function (state) {var _extends2, _ref;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, _this3.props, /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { ref: _this3.refPopupElement, priority: 'Popup', className: (0, _classnames.default)((0, _extends3.default)((_extends2 = {}, _extends2[_Popup.jsStyles.popup(_this3.theme)] = true, _extends2[_Popup.jsStyles.shadow(_this3.theme)] = hasShadow, _extends2[_Popup.jsStyles.shadowFallback(_this3.theme)] = hasShadow && (_client.isIE11 || _client.isEdge), _extends2[_Popup.jsStyles.popupIgnoreHover()] = ignoreHover, _extends2), disableAnimations ? {} : (_ref = {}, _ref[_Popup.jsStyles["transition-enter-" + direction](_this3.theme)] = true, _ref[_Popup.jsStyles.transitionEnter()] = state === 'entering', _ref[_Popup.jsStyles.transitionEnterActive()] = state === 'entered', _ref[_Popup.jsStyles.transitionExit()] = state === 'exiting', _ref))), style: rootStyle, onMouseEnter: _this3.handleMouseEnter, onMouseLeave: _this3.handleMouseLeave }, /*#__PURE__*/_react.default.createElement("div", { className: _Popup.jsStyles.content(_this3.theme), "data-tid": 'PopupContent' }, /*#__PURE__*/_react.default.createElement("div", { className: _Popup.jsStyles.contentInner(_this3.theme), style: { backgroundColor: backgroundColor }, "data-tid": 'PopupContentInner' }, children)), _this3.renderPin(location.position)));});};_proto.renderChildren = function renderChildren() {return (0, _utils.isFunction)(this.props.children) ? this.props.children() : this.props.children;};_proto.renderPin = function renderPin(positionName) {/**
-     * Box-shadow does not appear under the pin. Borders are used instead.
-     * In non-ie browsers drop-shadow filter is used. It is applying
-     * shadow to the pin too.
+    };return _this;}var _proto = Popup.prototype;_proto.componentDidMount = function componentDidMount() {this.updateLocation();this.layoutEventsToken = LayoutEvents.addListener(this.handleLayoutEvent);};_proto.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(nextProps) {/**
+     * Delaying updateLocation to ensure it happens after props update
+     */if (nextProps.opened) {if (!this.state.location) {this.setState({ location: DUMMY_LOCATION });}this.delayUpdateLocation();}};_proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {var hadNoLocation = prevState.location === DUMMY_LOCATION;var hasLocation = this.state.location !== DUMMY_LOCATION;if (hadNoLocation && hasLocation && this.props.onOpen) {this.props.onOpen();}if (!hadNoLocation && !this.state.location && this.props.onClose) {this.props.onClose();}};_proto.componentWillUnmount = function componentWillUnmount() {this.cancelDelayedUpdateLocation();this.removeEventListeners(this.anchorElement);if (this.layoutEventsToken) {this.layoutEventsToken.remove();this.layoutEventsToken = null;}if (this.state.location && this.props.onClose) {this.props.onClose();}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var location = this.state.location;var _this$props = this.props,anchorElement = _this$props.anchorElement,useWrapper = _this$props.useWrapper;var child = null;if ((0, _SSRSafe.isHTMLElement)(anchorElement)) {this.updateAnchorElement(anchorElement);} else if ( /*#__PURE__*/_react.default.isValidElement(anchorElement)) {child = useWrapper ? /*#__PURE__*/_react.default.createElement("span", null, anchorElement) : anchorElement;} else {child = /*#__PURE__*/_react.default.createElement("span", null, anchorElement);}return /*#__PURE__*/_react.default.createElement(_RenderContainer.RenderContainer, { anchor: child, ref: child ? this.refAnchorElement : undefined }, location && this.renderContent(location));};_proto.extractElement = function extractElement(instance) {if (!instance) {return null;}var element = (0, _reactDom.findDOMNode)(instance);return (0, _SSRSafe.isHTMLElement)(element) ? element : null;};_proto.updateAnchorElement = function updateAnchorElement(element) {var anchorElement = this.anchorElement;if (element !== anchorElement) {this.removeEventListeners(anchorElement);this.anchorElement = element;this.addEventListeners(element);}};_proto.addEventListeners = function addEventListeners(element) {if (element && (0, _SSRSafe.isHTMLElement)(element)) {element.addEventListener('mouseenter', this.handleMouseEnter);element.addEventListener('mouseleave', this.handleMouseLeave);element.addEventListener('click', this.handleClick);element.addEventListener('focusin', this.handleFocus);element.addEventListener('focusout', this.handleBlur);}};_proto.removeEventListeners = function removeEventListeners(element) {if (element && (0, _SSRSafe.isHTMLElement)(element)) {element.removeEventListener('mouseenter', this.handleMouseEnter);element.removeEventListener('mouseleave', this.handleMouseLeave);element.removeEventListener('click', this.handleClick);element.removeEventListener('focusin', this.handleFocus);element.removeEventListener('focusout', this.handleBlur);}};_proto.renderContent = function renderContent(location) {var _this3 = this;var _this$props2 = this.props,backgroundColor = _this$props2.backgroundColor,disableAnimations = _this$props2.disableAnimations,maxWidth = _this$props2.maxWidth,hasShadow = _this$props2.hasShadow,ignoreHover = _this$props2.ignoreHover,opened = _this$props2.opened;var children = this.renderChildren();var _PopupHelper$getPosit = _PopupHelper.PopupHelper.getPositionObject(location.position),direction = _PopupHelper$getPosit.direction;var rootStyle = (0, _extends3.default)({}, location.coordinates, { maxWidth: maxWidth });return /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.Transition, { timeout: TRANSITION_TIMEOUT, appear: !disableAnimations, in: Boolean(opened && children), mountOnEnter: true, unmountOnExit: true, enter: !disableAnimations, exit: !disableAnimations, onExited: this.resetLocation }, function (state) {var _extends2, _ref;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, _this3.props, /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { ref: _this3.refPopupElement, priority: 'Popup', className: (0, _classnames.default)((0, _extends3.default)((_extends2 = {}, _extends2[_Popup.jsStyles.popup(_this3.theme)] = true, _extends2[_Popup.jsStyles.shadow(_this3.theme)] = hasShadow, _extends2[_Popup.jsStyles.shadowFallback(_this3.theme)] = hasShadow && (_client.isIE11 || _client.isEdge), _extends2[_Popup.jsStyles.popupIgnoreHover()] = ignoreHover, _extends2), disableAnimations ? {} : (_ref = {}, _ref[_Popup.jsStyles["transition-enter-" + direction](_this3.theme)] = true, _ref[_Popup.jsStyles.transitionEnter()] = state === 'entering', _ref[_Popup.jsStyles.transitionEnterActive()] = state === 'entered', _ref[_Popup.jsStyles.transitionExit()] = state === 'exiting', _ref))), style: rootStyle, onMouseEnter: _this3.handleMouseEnter, onMouseLeave: _this3.handleMouseLeave }, /*#__PURE__*/_react.default.createElement("div", { className: _Popup.jsStyles.content(_this3.theme), "data-tid": 'PopupContent' }, /*#__PURE__*/_react.default.createElement("div", { className: _Popup.jsStyles.contentInner(_this3.theme), style: { backgroundColor: backgroundColor }, "data-tid": 'PopupContentInner' }, children)), _this3.renderPin(location.position)));});};_proto.renderChildren = function renderChildren() {return (0, _utils.isFunction)(this.props.children) ? this.props.children() : this.props.children;};_proto.renderPin = function renderPin(positionName) {/**
+     * Box-shadow does not appear under the pin. Borders are used instead.
+     * In non-ie browsers drop-shadow filter is used. It is applying
+     * shadow to the pin too.
      */var isDefaultBorderColor = this.theme.popupBorderColor === POPUP_BORDER_DEFAULT_COLOR;var pinBorder = _client.isIE11 && isDefaultBorderColor ? 'rgba(0, 0, 0, 0.09)' : this.theme.popupBorderColor;var _this$props3 = this.props,pinSize = _this$props3.pinSize,hasShadow = _this$props3.hasShadow,backgroundColor = _this$props3.backgroundColor,borderColor = _this$props3.borderColor;var position = _PopupHelper.PopupHelper.getPositionObject(positionName);return this.props.hasPin && /*#__PURE__*/_react.default.createElement(_PopupPin.PopupPin, { popupElement: this.lastPopupElement, popupPosition: positionName, size: pinSize || parseInt(this.theme.popupPinSize), offset: this.getPinOffset(position.align), borderWidth: hasShadow ? 1 : 0, backgroundColor: backgroundColor || this.theme.popupBackground, borderColor: borderColor || pinBorder });};_proto.delayUpdateLocation = function delayUpdateLocation() {this.cancelDelayedUpdateLocation();this.locationUpdateId = (0, _raf.default)(this.updateLocation);};_proto.cancelDelayedUpdateLocation = function cancelDelayedUpdateLocation() {if (this.locationUpdateId) {_raf.default.cancel(this.locationUpdateId);this.locationUpdateId = null;}};_proto.locationEquals = function locationEquals(x, y) {if (x === y) {return true;}
     if (x == null || y == null) {
       return false;
@@ -611,29 +611,29 @@ Popup = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(P
       default:
         throw new Error("Unexpected align '" + align + "'");}
 
-  };return Popup;}(_react.default.Component);exports.Popup = Popup;Popup.__KONTUR_REACT_UI__ = 'Popup';Popup.propTypes = { /**
-   * Ссылка (ref) на элемент или React компонент, для которого рисуется попап
-   */anchorElement: _propTypes.default.oneOfType([(0, _SSRSafe.safePropTypesInstanceOf)(function () {return HTMLElement;}), _propTypes.default.node]).isRequired, /**
-   * Фон попапа и пина
-   */backgroundColor: _propTypes.default.string, children: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]), /**
-   * Показывать ли пин
-   */hasPin: _propTypes.default.bool, /**
-   * Применять ли box-shadow на попапе. При false отключает границу на пине
-   */hasShadow: _propTypes.default.bool, /**
-   * Отступ попапа от элемента
-   */margin: _propTypes.default.number, /**
-   * Показан или скрыт попап
-   */opened: _propTypes.default.bool, /**
-   * Смещение пина от края попапа. Край задаётся в пропе position вторым словом
-   */pinOffset: _propTypes.default.number, /**
-   * Сторона пина без учёта границы.
-   * Пин представляет собой равносторонний треугольник, высота от попапа
-   * до "носика" пина будет соответствовать формуле (size* √3)/2
-   */pinSize: _propTypes.default.number, /**
-   * смещение попапа относительно родительского элемента
-   */popupOffset: _propTypes.default.number, /**
-   * С какой стороны показывать попап и край попапа,
-   * на котором будет отображаться пин
-   */positions: _propTypes.default.array, /**
-   * Игнорировать ли события hover/click
+  };return Popup;}(_react.default.Component);exports.Popup = Popup;Popup.__KONTUR_REACT_UI__ = 'Popup';Popup.propTypes = { /**
+   * Ссылка (ref) на элемент или React компонент, для которого рисуется попап
+   */anchorElement: _propTypes.default.oneOfType([(0, _SSRSafe.safePropTypesInstanceOf)(function () {return HTMLElement;}), _propTypes.default.node]).isRequired, /**
+   * Фон попапа и пина
+   */backgroundColor: _propTypes.default.string, children: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]), /**
+   * Показывать ли пин
+   */hasPin: _propTypes.default.bool, /**
+   * Применять ли box-shadow на попапе. При false отключает границу на пине
+   */hasShadow: _propTypes.default.bool, /**
+   * Отступ попапа от элемента
+   */margin: _propTypes.default.number, /**
+   * Показан или скрыт попап
+   */opened: _propTypes.default.bool, /**
+   * Смещение пина от края попапа. Край задаётся в пропе position вторым словом
+   */pinOffset: _propTypes.default.number, /**
+   * Сторона пина без учёта границы.
+   * Пин представляет собой равносторонний треугольник, высота от попапа
+   * до "носика" пина будет соответствовать формуле (size* √3)/2
+   */pinSize: _propTypes.default.number, /**
+   * смещение попапа относительно родительского элемента
+   */popupOffset: _propTypes.default.number, /**
+   * С какой стороны показывать попап и край попапа,
+   * на котором будет отображаться пин
+   */positions: _propTypes.default.array, /**
+   * Игнорировать ли события hover/click
    */ignoreHover: _propTypes.default.bool };Popup.defaultProps = { popupOffset: 0, hasPin: false, hasShadow: false, disableAnimations: _currentEnvironment.isTestEnv, useWrapper: false, ignoreHover: false };