@skbkontur/react-ui 0.0.0-e66a3400ba → 0.0.0-ea6161656e

package/components/Textarea/TextareaCounter/TextareaCounter.js

@@ -0,0 +1,103 @@
+import React, { useCallback, useImperativeHandle, useState } from 'react';
+import propTypes from 'prop-types';
+import { globalObject } from '@skbkontur/global-object';
+import { safePropTypesInstanceOf } from "../../../lib/SSRSafe";
+import { forwardRefAndName } from "../../../lib/forwardRefAndName";
+import { HelpDotIcon } from "../../../internal/icons/16px";
+import { isFunction } from "../../../lib/utils";
+import { Tooltip } from "../../Tooltip";
+import { useEmotion } from "../../../lib/theming/Emotion";
+import { isTheme2022 } from "../../../lib/theming/ThemeHelpers";
+import { QuestionCircleIcon16Solid } from "../../../internal/icons2022/QuestionCircleIcon/QuestionCircleIcon16Solid";
+import { useTheme } from "../../../lib/theming/useTheme";
+import { TextareaDataTids } from "../Textarea";
+import { getStyles } from "../Textarea.styles";
+
+var handleHelpMouseDown = function handleHelpMouseDown(e) {
+  return e.preventDefault();
+};
+
+export var TextareaCounter = forwardRefAndName('TextareaCounter', function (_ref, ref) {
+  var _emotion$cx;
+
+  var length = _ref.length,
+      value = _ref.value,
+      help = _ref.help,
+      onCloseHelp = _ref.onCloseHelp,
+      textarea = _ref.textarea,
+      size = _ref.size;
+  var theme = useTheme();
+  var emotion = useEmotion();
+
+  var _useState = useState(textarea.clientWidth),
+      width = _useState[0],
+      setWidth = _useState[1];
+
+  var _useState2 = useState(textarea.clientHeight),
+      height = _useState2[0],
+      setHeight = _useState2[1];
+
+  var reflow = useCallback(function () {
+    var clientWidth = textarea.clientWidth,
+        clientHeight = textarea.clientHeight;
+    setWidth(clientWidth);
+    setHeight(clientHeight);
+  }, [textarea]);
+  useImperativeHandle(ref, function () {
+    return {
+      reflow: reflow
+    };
+  }, [reflow]);
+  var renderTooltipContent = useCallback(function () {
+    return help;
+  }, [help]);
+  var textareaValue = value ? value.toString().length : 0;
+  var counterValue = length - textareaValue;
+  var helpIconProps = {
+    onMouseDown: handleHelpMouseDown,
+    color: theme.textareaCounterHelpIconColor,
+    'data-tid': TextareaDataTids.helpIcon
+  };
+  var helpIcon = isTheme2022(theme) ? /*#__PURE__*/React.createElement(QuestionCircleIcon16Solid, helpIconProps) : /*#__PURE__*/React.createElement(HelpDotIcon, helpIconProps);
+  var counterHelp = isFunction(help) ? help() : /*#__PURE__*/React.createElement(Tooltip, {
+    pos: 'right bottom',
+    trigger: 'click',
+    render: renderTooltipContent,
+    onCloseClick: onCloseHelp
+  }, helpIcon);
+  var styles = getStyles(emotion);
+
+  var getCounterSizeClassName = function getCounterSizeClassName() {
+    switch (size) {
+      case 'large':
+        return styles.counterLarge(theme);
+
+      case 'medium':
+        return styles.counterMedium(theme);
+
+      case 'small':
+      default:
+        return styles.counterSmall(theme);
+    }
+  };
+
+  return /*#__PURE__*/React.createElement("div", {
+    "data-tid": TextareaDataTids.counter,
+    className: emotion.cx(styles.counterContainer(theme)),
+    style: {
+      width: width,
+      height: height
+    }
+  }, /*#__PURE__*/React.createElement("span", {
+    className: emotion.cx(getCounterSizeClassName(), styles.counter(theme), (_emotion$cx = {}, _emotion$cx[styles.counterError(theme)] = counterValue < 0, _emotion$cx))
+  }, counterValue, help && /*#__PURE__*/React.createElement("span", {
+    className: styles.counterHelp()
+  }, counterHelp)));
+});
+TextareaCounter.propTypes = {
+  length: propTypes.number.isRequired,
+  value: propTypes.oneOfType([propTypes.string, propTypes.number]),
+  help: propTypes.oneOfType([propTypes.node, propTypes.func]),
+  onCloseHelp: propTypes.func.isRequired,
+  textarea: safePropTypesInstanceOf(globalObject.HTMLElement).isRequired
+};

package/components/Textarea/TextareaCounter/TextareaCounter.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["TextareaCounter.tsx"],"names":["React","useCallback","useImperativeHandle","useState","propTypes","globalObject","safePropTypesInstanceOf","forwardRefAndName","HelpDotIcon","isFunction","Tooltip","useEmotion","isTheme2022","QuestionCircleIcon16Solid","useTheme","TextareaDataTids","getStyles","handleHelpMouseDown","e","preventDefault","TextareaCounter","ref","length","value","help","onCloseHelp","textarea","size","theme","emotion","clientWidth","width","setWidth","clientHeight","height","setHeight","reflow","renderTooltipContent","textareaValue","toString","counterValue","helpIconProps","onMouseDown","color","textareaCounterHelpIconColor","helpIcon","counterHelp","styles","getCounterSizeClassName","counterLarge","counterMedium","counterSmall","counter","cx","counterContainer","counterError","number","isRequired","oneOfType","string","node","func","HTMLElement"],"mappings":"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","sourcesContent":["import React, { SyntheticEvent, useCallback, useImperativeHandle, useState } from 'react';\nimport propTypes from 'prop-types';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { safePropTypesInstanceOf } from '../../lib/SSRSafe';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName';\nimport { HelpDotIcon } from '../../internal/icons/16px';\nimport { isFunction } from '../../lib/utils';\nimport { Tooltip } from '../Tooltip';\nimport { useEmotion } from '../../lib/theming/Emotion';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { QuestionCircleIcon16Solid } from '../../internal/icons2022/QuestionCircleIcon/QuestionCircleIcon16Solid';\nimport { SizeProp } from '../../lib/types/props';\nimport { useTheme } from '../../lib/theming/useTheme';\n\nimport { TextareaDataTids, TextareaProps } from './Textarea';\nimport { getStyles } from './Textarea.styles';\n\nexport interface TextareaCounterProps {\n  value: TextareaProps['value'];\n  length: number;\n  help: TextareaProps['counterHelp'];\n  onCloseHelp: () => void;\n  textarea: HTMLTextAreaElement;\n  size: SizeProp;\n}\n\nexport interface TextareaCounterRef {\n  reflow: () => void;\n}\n\nconst handleHelpMouseDown = (e: SyntheticEvent) => e.preventDefault();\n\nexport const TextareaCounter = forwardRefAndName<TextareaCounterRef, TextareaCounterProps>(\n  'TextareaCounter',\n  ({ length, value, help, onCloseHelp, textarea, size }, ref) => {\n    const theme = useTheme();\n    const emotion = useEmotion();\n\n    const [width, setWidth] = useState(textarea.clientWidth);\n    const [height, setHeight] = useState(textarea.clientHeight);\n    const reflow = useCallback(() => {\n      const { clientWidth, clientHeight } = textarea;\n      setWidth(clientWidth);\n      setHeight(clientHeight);\n    }, [textarea]);\n    useImperativeHandle(ref, () => ({ reflow }), [reflow]);\n    const renderTooltipContent = useCallback(() => help, [help]);\n    const textareaValue = value ? value.toString().length : 0;\n    const counterValue = length - textareaValue;\n\n    const helpIconProps = {\n      onMouseDown: handleHelpMouseDown,\n      color: theme.textareaCounterHelpIconColor,\n      'data-tid': TextareaDataTids.helpIcon,\n    };\n    const helpIcon = isTheme2022(theme) ? (\n      <QuestionCircleIcon16Solid {...helpIconProps} />\n    ) : (\n      <HelpDotIcon {...helpIconProps} />\n    );\n    const counterHelp = isFunction(help) ? (\n      help()\n    ) : (\n      <Tooltip pos={'right bottom'} trigger={'click'} render={renderTooltipContent} onCloseClick={onCloseHelp}>\n        {helpIcon}\n      </Tooltip>\n    );\n    const styles = getStyles(emotion);\n    const getCounterSizeClassName = () => {\n      switch (size) {\n        case 'large':\n          return styles.counterLarge(theme);\n        case 'medium':\n          return styles.counterMedium(theme);\n        case 'small':\n        default:\n          return styles.counterSmall(theme);\n      }\n    };\n\n    return (\n      <div\n        data-tid={TextareaDataTids.counter}\n        className={emotion.cx(styles.counterContainer(theme))}\n        style={{ width, height }}\n      >\n        <span\n          className={emotion.cx(getCounterSizeClassName(), styles.counter(theme), {\n            [styles.counterError(theme)]: counterValue < 0,\n          })}\n        >\n          {counterValue}\n          {help && <span className={styles.counterHelp()}>{counterHelp}</span>}\n        </span>\n      </div>\n    );\n  },\n);\n\nTextareaCounter.propTypes = {\n  length: propTypes.number.isRequired,\n  value: propTypes.oneOfType([propTypes.string, propTypes.number]),\n  help: propTypes.oneOfType([propTypes.node, propTypes.func]),\n  onCloseHelp: propTypes.func.isRequired,\n  textarea: safePropTypesInstanceOf(globalObject.HTMLElement).isRequired,\n};\n"]}

package/components/Textarea/TextareaCounter/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/Textarea/TextareaCounter.js",
+  "module": "TextareaCounter",
+  "types": "../TextareaCounter.d.ts",
+  "sideEffects": false
+}

package/components/Textarea/TextareaCounter.d.ts

@@ -0,0 +1,14 @@
+import { SizeProp } from '../../lib/types/props';
+import { TextareaProps } from './Textarea';
+export interface TextareaCounterProps {
+    value: TextareaProps['value'];
+    length: number;
+    help: TextareaProps['counterHelp'];
+    onCloseHelp: () => void;
+    textarea: HTMLTextAreaElement;
+    size: SizeProp;
+}
+export interface TextareaCounterRef {
+    reflow: () => void;
+}
+export declare const TextareaCounter: import("../../lib/forwardRefAndName").ReactUIComponentWithRef<TextareaCounterRef, TextareaCounterProps> & Record<never, never>;

package/components/Textarea/TextareaHelpers/TextareaHelpers.js

@@ -0,0 +1,25 @@
+import { globalObject, isBrowser } from '@skbkontur/global-object';
+export function getTextAreaHeight(params) {
+  if (!isBrowser(globalObject)) {
+    return null;
+  }
+
+  var node = params.node,
+      minRows = params.minRows,
+      maxRows = params.maxRows,
+      extraRow = params.extraRow;
+  var style = globalObject.getComputedStyle(node);
+  var borderTop = style.borderTopWidth ? parseInt(style.borderTopWidth, 10) : 0;
+  var borderBottom = style.borderBottomWidth ? parseInt(style.borderBottomWidth, 10) : 0;
+  var lineHeight = style.lineHeight ? parseInt(style.lineHeight, 10) : 0;
+  var paddingTop = style.paddingTop ? parseInt(style.paddingTop, 10) : 0;
+  var paddingBottom = style.paddingBottom ? parseInt(style.paddingBottom, 10) : 0;
+  var minHeight = borderTop + borderBottom + paddingTop + paddingBottom + lineHeight * minRows;
+  var maxHeight = borderTop + borderBottom + paddingTop + paddingBottom + lineHeight * maxRows;
+  var extraRowHeight = extraRow ? lineHeight : 0;
+  var expectedHeight = node.scrollHeight + borderTop + borderBottom + extraRowHeight;
+  return {
+    height: Math.min(Math.max(expectedHeight, minHeight), maxHeight),
+    exceededMaxHeight: expectedHeight > maxHeight + extraRowHeight
+  };
+}

package/components/Textarea/TextareaHelpers/TextareaHelpers.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["TextareaHelpers.tsx"],"names":["globalObject","isBrowser","getTextAreaHeight","params","node","minRows","maxRows","extraRow","style","getComputedStyle","borderTop","borderTopWidth","parseInt","borderBottom","borderBottomWidth","lineHeight","paddingTop","paddingBottom","minHeight","maxHeight","extraRowHeight","expectedHeight","scrollHeight","height","Math","min","max","exceededMaxHeight"],"mappings":"AAAA,SAASA,YAAT,EAAuBC,SAAvB,QAAwC,0BAAxC;;AAEA,OAAO,SAASC,iBAAT,CAA2BC,MAA3B,EAA4D;AACjE,MAAI,CAACF,SAAS,CAACD,YAAD,CAAd,EAA8B;AAC5B,WAAO,IAAP;AACD;AACD,MAAQI,IAAR,GAA6CD,MAA7C,CAAQC,IAAR,CAAcC,OAAd,GAA6CF,MAA7C,CAAcE,OAAd,CAAuBC,OAAvB,GAA6CH,MAA7C,CAAuBG,OAAvB,CAAgCC,QAAhC,GAA6CJ,MAA7C,CAAgCI,QAAhC;AACA,MAAMC,KAAK,GAAGR,YAAY,CAACS,gBAAb,CAA8BL,IAA9B,CAAd;AACA,MAAMM,SAAS,GAAGF,KAAK,CAACG,cAAN,GAAuBC,QAAQ,CAACJ,KAAK,CAACG,cAAP,EAAuB,EAAvB,CAA/B,GAA4D,CAA9E;AACA,MAAME,YAAY,GAAGL,KAAK,CAACM,iBAAN,GAA0BF,QAAQ,CAACJ,KAAK,CAACM,iBAAP,EAA0B,EAA1B,CAAlC,GAAkE,CAAvF;AACA,MAAMC,UAAU,GAAGP,KAAK,CAACO,UAAN,GAAmBH,QAAQ,CAACJ,KAAK,CAACO,UAAP,EAAmB,EAAnB,CAA3B,GAAoD,CAAvE;AACA,MAAMC,UAAU,GAAGR,KAAK,CAACQ,UAAN,GAAmBJ,QAAQ,CAACJ,KAAK,CAACQ,UAAP,EAAmB,EAAnB,CAA3B,GAAoD,CAAvE;AACA,MAAMC,aAAa,GAAGT,KAAK,CAACS,aAAN,GAAsBL,QAAQ,CAACJ,KAAK,CAACS,aAAP,EAAsB,EAAtB,CAA9B,GAA0D,CAAhF;AACA,MAAMC,SAAS,GAAGR,SAAS,GAAGG,YAAZ,GAA2BG,UAA3B,GAAwCC,aAAxC,GAAwDF,UAAU,GAAGV,OAAvF;AACA,MAAMc,SAAS,GAAGT,SAAS,GAAGG,YAAZ,GAA2BG,UAA3B,GAAwCC,aAAxC,GAAwDF,UAAU,GAAGT,OAAvF;AACA,MAAMc,cAAc,GAAGb,QAAQ,GAAGQ,UAAH,GAAgB,CAA/C;AACA,MAAMM,cAAc,GAAGjB,IAAI,CAACkB,YAAL,GAAoBZ,SAApB,GAAgCG,YAAhC,GAA+CO,cAAtE;AACA,SAAO;AACLG,IAAAA,MAAM,EAAEC,IAAI,CAACC,GAAL,CAASD,IAAI,CAACE,GAAL,CAASL,cAAT,EAAyBH,SAAzB,CAAT,EAA8CC,SAA9C,CADH;AAELQ,IAAAA,iBAAiB,EAAEN,cAAc,GAAGF,SAAS,GAAGC,cAF3C,EAAP;;AAID","sourcesContent":["import { globalObject, isBrowser } from '@skbkontur/global-object';\n\nexport function getTextAreaHeight(params: GetTextAreaHeightParams) {\n  if (!isBrowser(globalObject)) {\n    return null;\n  }\n  const { node, minRows, maxRows, extraRow } = params;\n  const style = globalObject.getComputedStyle(node);\n  const borderTop = style.borderTopWidth ? parseInt(style.borderTopWidth, 10) : 0;\n  const borderBottom = style.borderBottomWidth ? parseInt(style.borderBottomWidth, 10) : 0;\n  const lineHeight = style.lineHeight ? parseInt(style.lineHeight, 10) : 0;\n  const paddingTop = style.paddingTop ? parseInt(style.paddingTop, 10) : 0;\n  const paddingBottom = style.paddingBottom ? parseInt(style.paddingBottom, 10) : 0;\n  const minHeight = borderTop + borderBottom + paddingTop + paddingBottom + lineHeight * minRows;\n  const maxHeight = borderTop + borderBottom + paddingTop + paddingBottom + lineHeight * maxRows;\n  const extraRowHeight = extraRow ? lineHeight : 0;\n  const expectedHeight = node.scrollHeight + borderTop + borderBottom + extraRowHeight;\n  return {\n    height: Math.min(Math.max(expectedHeight, minHeight), maxHeight),\n    exceededMaxHeight: expectedHeight > maxHeight + extraRowHeight,\n  };\n}\n\ninterface GetTextAreaHeightParams {\n  node: HTMLTextAreaElement;\n  minRows: number;\n  maxRows: number;\n  extraRow: boolean;\n}\n"]}

package/components/Textarea/TextareaHelpers/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/Textarea/TextareaHelpers.js",
+  "module": "TextareaHelpers",
+  "types": "../TextareaHelpers.d.ts",
+  "sideEffects": false
+}

package/components/Textarea/TextareaHelpers.d.ts

@@ -1,4 +1,11 @@
-export declare function getTextAreaHeight(node: HTMLTextAreaElement, minRows: number, maxRows: number): {
-    height: number;
-    exceededMaxHeight: boolean;
-};
+export declare function getTextAreaHeight(params: GetTextAreaHeightParams): {
+    height: number;
+    exceededMaxHeight: boolean;
+} | null;
+interface GetTextAreaHeightParams {
+    node: HTMLTextAreaElement;
+    minRows: number;
+    maxRows: number;
+    extraRow: boolean;
+}
+export {};

package/components/Textarea/TextareaWithSafari17Workaround/TextareaWithSafari17Workaround.js

@@ -0,0 +1,21 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import React from 'react';
+import { forwardRefAndName } from "../../../lib/forwardRefAndName";
+/**
+ * React textarea behaves incorrectly on first rendered in Safari version 17.*
+ * Reproduce: https://codesandbox.io/p/sandbox/textarea-and-textarea-safari-bug-9v95vz
+ */
+
+export var TextareaWithSafari17Workaround = forwardRefAndName('TextareaWithSafari17Workaround', function (props, ref) {
+  var _React$useState = React.useState(true),
+      firstRender = _React$useState[0],
+      setFirstRender = _React$useState[1];
+
+  React.useEffect(function () {
+    firstRender && setFirstRender(false);
+  }, []);
+  return /*#__PURE__*/React.createElement("textarea", _extends({}, props, {
+    value: firstRender ? '' : props.value,
+    ref: ref
+  }));
+});

package/components/Textarea/TextareaWithSafari17Workaround/TextareaWithSafari17Workaround.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["TextareaWithSafari17Workaround.tsx"],"names":["React","forwardRefAndName","TextareaWithSafari17Workaround","props","ref","useState","firstRender","setFirstRender","useEffect","value"],"mappings":"0DAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,iBAAT,QAAkC,6BAAlC;;AAEA;AACA;AACA;AACA;AACA,OAAO,IAAMC,8BAA8B,GAAGD,iBAAiB;;;AAG7D,gCAH6D,EAG3B,UAACE,KAAD,EAAQC,GAAR,EAAgB;AAClD,wBAAsCJ,KAAK,CAACK,QAAN,CAAe,IAAf,CAAtC,CAAOC,WAAP,sBAAoBC,cAApB;;AAEAP,EAAAA,KAAK,CAACQ,SAAN,CAAgB,YAAM;AACpBF,IAAAA,WAAW,IAAIC,cAAc,CAAC,KAAD,CAA7B;AACD,GAFD,EAEG,EAFH;;AAIA,sBAAO,6CAAcJ,KAAd,IAAqB,KAAK,EAAEG,WAAW,GAAG,EAAH,GAAQH,KAAK,CAACM,KAArD,EAA4D,GAAG,EAAEL,GAAjE,IAAP;AACD,CAX8D,CAAxD","sourcesContent":["import React from 'react';\n\nimport { forwardRefAndName } from '../../lib/forwardRefAndName';\n\n/**\n * React textarea behaves incorrectly on first rendered in Safari version 17.*\n * Reproduce: https://codesandbox.io/p/sandbox/textarea-and-textarea-safari-bug-9v95vz\n */\nexport const TextareaWithSafari17Workaround = forwardRefAndName<\n  HTMLTextAreaElement,\n  React.TextareaHTMLAttributes<HTMLTextAreaElement>\n>('TextareaWithSafari17Workaround', (props, ref) => {\n  const [firstRender, setFirstRender] = React.useState(true);\n\n  React.useEffect(() => {\n    firstRender && setFirstRender(false);\n  }, []);\n\n  return <textarea {...props} value={firstRender ? '' : props.value} ref={ref} />;\n});\n"]}

package/components/Textarea/TextareaWithSafari17Workaround/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/Textarea/TextareaWithSafari17Workaround.js",
+  "module": "TextareaWithSafari17Workaround",
+  "types": "../TextareaWithSafari17Workaround.d.ts",
+  "sideEffects": false
+}

package/components/Textarea/TextareaWithSafari17Workaround.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+/**
+ * React textarea behaves incorrectly on first rendered in Safari version 17.*
+ * Reproduce: https://codesandbox.io/p/sandbox/textarea-and-textarea-safari-bug-9v95vz
+ */
+export declare const TextareaWithSafari17Workaround: import("../../lib/forwardRefAndName").ReactUIComponentWithRef<HTMLTextAreaElement, React.TextareaHTMLAttributes<HTMLTextAreaElement>> & Record<never, never>;

package/components/Textarea/index/index.js

@@ -0,0 +1 @@
+export * from "../Textarea";

package/components/Textarea/index/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.tsx"],"names":[],"mappings":"AAAA,cAAc,YAAd","sourcesContent":["export * from './Textarea';\n"]}

package/components/Textarea/index/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/Textarea/index.js",
+  "module": "index",
+  "types": "../index.d.ts",
+  "sideEffects": false
+}

package/components/Textarea/index.d.ts

@@ -1 +1 @@
-export { default, TextareaProps, TextareaState } from './Textarea';
+export * from './Textarea';

package/components/Textarea/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../cjs/components/Textarea/index.js",
+  "module": "index",
+  "types": "index.d.ts",
+  "sideEffects": false
+}

package/components/Toast/Toast/Toast.js

@@ -0,0 +1,204 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+
+var _class, _class2, _temp;
+
+import React from 'react';
+import { CSSTransition, TransitionGroup } from 'react-transition-group';
+import { globalObject } from '@skbkontur/global-object';
+import { ThemeFactory } from "../../../lib/theming/ThemeFactory";
+import { RenderContainer } from "../../../internal/RenderContainer";
+import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { isTestEnv } from "../../../lib/currentEnvironment";
+import { rootNode } from "../../../lib/rootNode";
+import { EmotionConsumer } from "../../../lib/theming/Emotion";
+import { ThemeContext } from "../../../lib/theming/ThemeContext";
+import { getStyles } from "../Toast.styles";
+import { ToastView } from "../ToastView";
+import { ToastStatic } from "../ToastStatic";
+export var ToastDataTids = {
+  toastStatic: 'StaticToast',
+  toastView: 'ToastView__root',
+  action: 'ToastView__action',
+  close: 'ToastView__close'
+};
+/**
+ * Показывает уведомления.
+ *
+ * Доступен статический метод: `Toast.push(notification, action?, showTime?)`.
+ * Однако, при его использовании не работает кастомизация, они не поддерживаются в `React@18`, а также могут быть проблемы с перекрытием уведомления другими элементами страницы.
+ *
+ * Для статических тостов <u>рекомендуется</u> использовать компонент [SingleToast](https://tech.skbkontur.ru/react-ui/#/Components/SingleToast) - в нём исправлены эти проблемы.
+ *
+ */
+
+export var Toast = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Toast, _React$Component);
+
+  Toast.push = function push(notification, action, showTime) {
+    ToastStatic.push(notification, action, showTime);
+  };
+
+  Toast.close = function close() {
+    ToastStatic.close();
+  };
+
+  function Toast(props) {
+    var _this;
+
+    _this = _React$Component.call(this, props) || this;
+    _this.rootRef = /*#__PURE__*/React.createRef();
+
+    _this.close = function () {
+      safelyCall(_this.props.onClose, _this.state.notification, _this.state.action);
+
+      _this.setState({
+        notification: null,
+        action: null
+      });
+    };
+
+    _this.setRootRef = function (element) {
+      _this.setRootNode(element); // @ts-expect-error: See: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/31065.
+
+
+      _this.rootRef.current = element;
+    };
+
+    _this._clearTimer = function () {
+      if (_this._timeout) {
+        globalObject.clearTimeout(_this._timeout);
+        _this._timeout = null;
+      }
+    };
+
+    _this._setTimer = function () {
+      var _this$state$showTime;
+
+      _this._clearTimer();
+
+      var showTime = _this.state.action ? 7000 : 3000;
+      showTime = (_this$state$showTime = _this.state.showTime) != null ? _this$state$showTime : showTime;
+      _this._timeout = globalObject.setTimeout(_this.close, showTime);
+    };
+
+    _this._refToast = function (element) {
+      _this._toast = element;
+    };
+
+    _this.state = {
+      notification: null,
+      action: null,
+      id: 0,
+      showTime: null
+    };
+    return _this;
+  }
+
+  var _proto = Toast.prototype;
+
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    this._clearTimer();
+  };
+
+  _proto.render = function render() {
+    var _this2 = this;
+
+    return /*#__PURE__*/React.createElement(EmotionConsumer, null, function (emotion) {
+      _this2.emotion = emotion;
+      return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
+        _this2.theme = _this2.props.theme ? ThemeFactory.create(_this2.props.theme, theme) : theme;
+        return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
+          value: _this2.theme
+        }, /*#__PURE__*/React.createElement(RenderContainer, null, /*#__PURE__*/React.createElement(TransitionGroup, null, _this2._renderToast())));
+      });
+    });
+  }
+  /**
+  * Показывает тост с `notification` в качестве сообщения.
+  * Тост автоматически скрывается через 3 или 7 секунд,
+  * в зависимости от наличия у него кнопки `action`.
+  * Время показа можно задать вручную, передав `showTime`.
+  *
+  * @public
+  * @param {string} notification
+  * @param {Action} action `action` опциональный параметр формата `{ label: string, handler: function }`
+  * добавляет кнопку в виде ссылки при клике на которую вызывается переданный handler
+  * @param {number} showTime Время существования Toast в миллисекундах
+  */
+  ;
+
+  _proto.push = function push(notification, action, showTime) {
+    if (this.state.notification) {
+      this.close();
+    }
+
+    safelyCall(this.props.onPush, notification, action);
+    this.setState(function (_ref) {
+      var id = _ref.id;
+      return {
+        notification: notification,
+        action: action,
+        id: id + 1,
+        showTime: showTime
+      };
+    }, this._setTimer);
+  }
+  /**
+  * @public
+  */
+  ;
+
+  _proto._renderToast = function _renderToast() {
+    var _this$state = this.state,
+        notification = _this$state.notification,
+        action = _this$state.action,
+        id = _this$state.id;
+
+    if (!notification) {
+      return null;
+    }
+
+    var toastProps = {
+      onMouseEnter: this._clearTimer,
+      onMouseLeave: this._setTimer,
+      onClose: this.close,
+      children: notification,
+      'aria-label': this.props['aria-label'],
+      action: action
+    };
+    var styles = getStyles(this.emotion);
+    return /*#__PURE__*/React.createElement(CSSTransition, {
+      key: id,
+      classNames: {
+        enter: styles.enter(),
+        enterActive: styles.enterActive(),
+        exit: styles.exit(),
+        exitActive: styles.exitActive()
+      },
+      timeout: {
+        enter: 200,
+        exit: 150
+      },
+      enter: !isTestEnv,
+      exit: !isTestEnv,
+      nodeRef: this.rootRef
+    }, /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+      rootNodeRef: this.setRootRef
+    }, this.props), /*#__PURE__*/React.createElement(ToastView, _extends({
+      ref: this._refToast
+    }, toastProps))));
+  };
+
+  return Toast;
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Toast', _class2.displayName = 'Toast', _temp)) || _class;
+
+function safelyCall(fn) {
+  if (fn) {
+    for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+      args[_key - 1] = arguments[_key];
+    }
+
+    fn.apply(void 0, args);
+  }
+}

package/components/Toast/Toast/Toast.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Toast.tsx"],"names":["React","CSSTransition","TransitionGroup","globalObject","ThemeFactory","RenderContainer","CommonWrapper","isTestEnv","rootNode","EmotionConsumer","ThemeContext","getStyles","ToastView","ToastStatic","ToastDataTids","toastStatic","toastView","action","close","Toast","push","notification","showTime","props","rootRef","createRef","safelyCall","onClose","state","setState","setRootRef","element","setRootNode","current","_clearTimer","_timeout","clearTimeout","_setTimer","setTimeout","_refToast","_toast","id","componentWillUnmount","render","emotion","theme","create","_renderToast","onPush","toastProps","onMouseEnter","onMouseLeave","children","styles","enter","enterActive","exit","exitActive","Component","__KONTUR_REACT_UI__","displayName","fn","args"],"mappings":"2JAAA,OAAOA,KAAP,MAAsC,OAAtC;AACA,SAASC,aAAT,EAAwBC,eAAxB,QAA+C,wBAA/C;AACA,SAASC,YAAT,QAAwC,0BAAxC;;;AAGA,SAASC,YAAT,QAA6B,gCAA7B;;AAEA,SAASC,eAAT,QAAgC,gCAAhC;;AAEA,SAAsBC,aAAtB,QAA2C,8BAA3C;AACA,SAASC,SAAT,QAA0B,8BAA1B;AACA,SAASC,QAAT,QAAuC,oBAAvC;AACA,SAASC,eAAT,QAAgC,2BAAhC;AACA,SAASC,YAAT,QAA6B,gCAA7B;;AAEA,SAASC,SAAT,QAA0B,gBAA1B;AACA,SAASC,SAAT,QAA0C,aAA1C;AACA,SAASC,WAAT,QAA4B,eAA5B;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,OAAO,IAAMC,aAAa,GAAG;AAC3BC,EAAAA,WAAW,EAAE,aADc;AAE3BC,EAAAA,SAAS,EAAE,iBAFgB;AAG3BC,EAAAA,MAAM,EAAE,mBAHmB;AAI3BC,EAAAA,KAAK,EAAE,kBAJoB,EAAtB;;;AAOP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,WAAaC,KAAb,GADCX,QACD;;;;;;;;AAQgBY,EAAAA,IARhB,GAQE,cAAmBC,YAAnB,EAAyCJ,MAAzC,EAAoEK,QAApE,EAAuF;AACrFT,IAAAA,WAAW,CAACO,IAAZ,CAAiBC,YAAjB,EAA+BJ,MAA/B,EAAuCK,QAAvC;AACD,GAVH;;AAYgBJ,EAAAA,KAZhB,GAYE,iBAAsB;AACpBL,IAAAA,WAAW,CAACK,KAAZ;AACD,GAdH;;;;;;AAoBE,iBAAYK,KAAZ,EAA+B;AAC7B,wCAAMA,KAAN,UAD6B,MAFvBC,OAEuB,gBAFbxB,KAAK,CAACyB,SAAN,EAEa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+DxBP,IAAAA,KA/DwB,GA+DhB,YAAM;AACnBQ,MAAAA,UAAU,CAAC,MAAKH,KAAL,CAAWI,OAAZ,EAAqB,MAAKC,KAAL,CAAWP,YAAhC,EAA8C,MAAKO,KAAL,CAAWX,MAAzD,CAAV;AACA,YAAKY,QAAL,CAAc,EAAER,YAAY,EAAE,IAAhB,EAAsBJ,MAAM,EAAE,IAA9B,EAAd;AACD,KAlE8B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6GvBa,IAAAA,UA7GuB,GA6GV,UAACC,OAAD,EAAgC;AACnD,YAAKC,WAAL,CAAiBD,OAAjB;AACA;AACA,YAAKP,OAAL,CAAaS,OAAb,GAAuBF,OAAvB;AACD,KAjH8B;;AAmHvBG,IAAAA,WAnHuB,GAmHT,YAAM;AAC1B,UAAI,MAAKC,QAAT,EAAmB;AACjBhC,QAAAA,YAAY,CAACiC,YAAb,CAA0B,MAAKD,QAA/B;AACA,cAAKA,QAAL,GAAgB,IAAhB;AACD;AACF,KAxH8B;;AA0HvBE,IAAAA,SA1HuB,GA0HX,YAAM;AACxB,YAAKH,WAAL;;AAEA,UAAIZ,QAAQ,GAAG,MAAKM,KAAL,CAAWX,MAAX,GAAoB,IAApB,GAA2B,IAA1C;AACAK,MAAAA,QAAQ,2BAAG,MAAKM,KAAL,CAAWN,QAAd,mCAA0BA,QAAlC;AACA,YAAKa,QAAL,GAAgBhC,YAAY,CAACmC,UAAb,CAAwB,MAAKpB,KAA7B,EAAoCI,QAApC,CAAhB;AACD,KAhI8B;;AAkIvBiB,IAAAA,SAlIuB,GAkIX,UAACR,OAAD,EAAwB;AAC1C,YAAKS,MAAL,GAAcT,OAAd;AACD,KApI8B,CAE7B,MAAKH,KAAL,GAAa,EACXP,YAAY,EAAE,IADH,EAEXJ,MAAM,EAAE,IAFG,EAGXwB,EAAE,EAAE,CAHO,EAIXnB,QAAQ,EAAE,IAJC,EAAb,CAF6B,aAQ9B,CA5BH,oCA8BSoB,oBA9BT,GA8BE,gCAA8B,CAC5B,KAAKR,WAAL,GACD,CAhCH,QAkCSS,MAlCT,GAkCE,kBAAgB,mBACd,oBACE,oBAAC,eAAD,QACG,UAACC,OAAD,EAAa,CACZ,MAAI,CAACA,OAAL,GAAeA,OAAf,CACA,oBACE,oBAAC,YAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAa,MAAI,CAACtB,KAAL,CAAWsB,KAAX,GAAmBzC,YAAY,CAAC0C,MAAb,CAAoB,MAAI,CAACvB,KAAL,CAAWsB,KAA/B,EAA+CA,KAA/C,CAAnB,GAA2EA,KAAxF,CACA,oBACE,oBAAC,YAAD,CAAc,QAAd,IAAuB,KAAK,EAAE,MAAI,CAACA,KAAnC,iBACE,oBAAC,eAAD,qBACE,oBAAC,eAAD,QAAkB,MAAI,CAACE,YAAL,EAAlB,CADF,CADF,CADF,CAOD,CAVH,CADF,CAcD,CAjBH,CADF,CAqBD,CAxDH,CA0DE;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KArEA,QAsES3B,IAtET,GAsEE,cAAYC,YAAZ,EAAkCJ,MAAlC,EAA6DK,QAA7D,EAAgF,CAC9E,IAAI,KAAKM,KAAL,CAAWP,YAAf,EAA6B,CAC3B,KAAKH,KAAL,GACD,CAEDQ,UAAU,CAAC,KAAKH,KAAL,CAAWyB,MAAZ,EAAoB3B,YAApB,EAAkCJ,MAAlC,CAAV,CAEA,KAAKY,QAAL,CAAc,qBAAGY,EAAH,QAAGA,EAAH,QAAa,EAAEpB,YAAY,EAAZA,YAAF,EAAgBJ,MAAM,EAANA,MAAhB,EAAwBwB,EAAE,EAAEA,EAAE,GAAG,CAAjC,EAAoCnB,QAAQ,EAARA,QAApC,EAAb,EAAd,EAA4E,KAAKe,SAAjF,EACD,CA9EH,CAgFE;AACF;AACA,KAlFA,QAwFUU,YAxFV,GAwFE,wBAAuB,CACrB,kBAAqC,KAAKnB,KAA1C,CAAQP,YAAR,eAAQA,YAAR,CAAsBJ,MAAtB,eAAsBA,MAAtB,CAA8BwB,EAA9B,eAA8BA,EAA9B,CAEA,IAAI,CAACpB,YAAL,EAAmB,CACjB,OAAO,IAAP,CACD,CAED,IAAM4B,UAA0B,GAAG,EACjCC,YAAY,EAAE,KAAKhB,WADc,EAEjCiB,YAAY,EAAE,KAAKd,SAFc,EAGjCV,OAAO,EAAE,KAAKT,KAHmB,EAIjCkC,QAAQ,EAAE/B,YAJuB,EAKjC,cAAc,KAAKE,KAAL,CAAW,YAAX,CALmB,EAMjCN,MAAM,EAANA,MANiC,EAAnC,CAQA,IAAMoC,MAAM,GAAG1C,SAAS,CAAC,KAAKiC,OAAN,CAAxB,CAEA,oBACE,oBAAC,aAAD,IACE,GAAG,EAAEH,EADP,EAEE,UAAU,EAAE,EACVa,KAAK,EAAED,MAAM,CAACC,KAAP,EADG,EAEVC,WAAW,EAAEF,MAAM,CAACE,WAAP,EAFH,EAGVC,IAAI,EAAEH,MAAM,CAACG,IAAP,EAHI,EAIVC,UAAU,EAAEJ,MAAM,CAACI,UAAP,EAJF,EAFd,EAQE,OAAO,EAAE,EACPH,KAAK,EAAE,GADA,EAEPE,IAAI,EAAE,GAFC,EARX,EAYE,KAAK,EAAE,CAACjD,SAZV,EAaE,IAAI,EAAE,CAACA,SAbT,EAcE,OAAO,EAAE,KAAKiB,OAdhB,iBAgBE,oBAAC,aAAD,aAAe,WAAW,EAAE,KAAKM,UAAjC,IAAiD,KAAKP,KAAtD,gBACE,oBAAC,SAAD,aAAW,GAAG,EAAE,KAAKgB,SAArB,IAAoCU,UAApC,EADF,CAhBF,CADF,CAsBD,CA/HH,gBAA2BjD,KAAK,CAAC0D,SAAjC,WACgBC,mBADhB,GACsC,OADtC,UAEgBC,WAFhB,GAE8B,OAF9B,oBA2JA,SAASlC,UAAT,CAAoBmC,EAApB,EAAoE,CAClE,IAAIA,EAAJ,EAAQ,mCAD6CC,IAC7C,uEAD6CA,IAC7C,8BACND,EAAE,MAAF,SAAMC,IAAN,EACD,CACF","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport { CSSTransition, TransitionGroup } from 'react-transition-group';\nimport { globalObject, SafeTimer } from '@skbkontur/global-object';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { Theme, ThemeIn } from '../../lib/theming/Theme';\nimport { RenderContainer } from '../../internal/RenderContainer';\nimport { Nullable } from '../../typings/utility-types';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport { getStyles } from './Toast.styles';\nimport { ToastView, ToastViewProps } from './ToastView';\nimport { ToastStatic } from './ToastStatic';\n\nexport interface Action {\n  label: string;\n  handler: () => void;\n  'aria-label'?: string;\n}\n\nexport interface ToastState {\n  notification: Nullable<string>;\n  action: Nullable<Action>;\n  id: number;\n  showTime: Nullable<number>;\n}\n\nexport interface ToastProps extends Pick<AriaAttributes, 'aria-label'>, CommonProps {\n  onPush?: (notification: string, action?: Action) => void;\n  onClose?: (notification: string, action?: Action) => void;\n  /**\n   * Обычный объект с переменными темы.\n   * Он будет объединён с темой из контекста.\n   */\n  theme?: ThemeIn;\n}\n\nexport const ToastDataTids = {\n  toastStatic: 'StaticToast',\n  toastView: 'ToastView__root',\n  action: 'ToastView__action',\n  close: 'ToastView__close',\n} as const;\n\n/**\n * Показывает уведомления.\n *\n * Доступен статический метод: `Toast.push(notification, action?, showTime?)`.\n * Однако, при его использовании не работает кастомизация, они не поддерживаются в `React@18`, а также могут быть проблемы с перекрытием уведомления другими элементами страницы.\n *\n * Для статических тостов <u>рекомендуется</u> использовать компонент [SingleToast](https://tech.skbkontur.ru/react-ui/#/Components/SingleToast) - в нём исправлены эти проблемы.\n *\n */\n@rootNode\nexport class Toast extends React.Component<ToastProps, ToastState> {\n  public static __KONTUR_REACT_UI__ = 'Toast';\n  public static displayName = 'Toast';\n\n  private setRootNode!: TSetRootNode;\n  private theme!: Theme;\n  private emotion!: Emotion;\n\n  public static push(notification: string, action?: Nullable<Action>, showTime?: number) {\n    ToastStatic.push(notification, action, showTime);\n  }\n\n  public static close() {\n    ToastStatic.close();\n  }\n\n  public _toast: Nullable<ToastView>;\n  private _timeout: SafeTimer;\n  private rootRef = React.createRef<HTMLElement>();\n\n  constructor(props: ToastProps) {\n    super(props);\n    this.state = {\n      notification: null,\n      action: null,\n      id: 0,\n      showTime: null,\n    };\n  }\n\n  public componentWillUnmount() {\n    this._clearTimer();\n  }\n\n  public render() {\n    return (\n      <EmotionConsumer>\n        {(emotion) => {\n          this.emotion = emotion;\n          return (\n            <ThemeContext.Consumer>\n              {(theme) => {\n                this.theme = this.props.theme ? ThemeFactory.create(this.props.theme as Theme, theme) : theme;\n                return (\n                  <ThemeContext.Provider value={this.theme}>\n                    <RenderContainer>\n                      <TransitionGroup>{this._renderToast()}</TransitionGroup>\n                    </RenderContainer>\n                  </ThemeContext.Provider>\n                );\n              }}\n            </ThemeContext.Consumer>\n          );\n        }}\n      </EmotionConsumer>\n    );\n  }\n\n  /**\n   * Показывает тост с `notification` в качестве сообщения.\n   * Тост автоматически скрывается через 3 или 7 секунд,\n   * в зависимости от наличия у него кнопки `action`.\n   * Время показа можно задать вручную, передав `showTime`.\n   *\n   * @public\n   * @param {string} notification\n   * @param {Action} action `action` опциональный параметр формата `{ label: string, handler: function }`\n   * добавляет кнопку в виде ссылки при клике на которую вызывается переданный handler\n   * @param {number} showTime Время существования Toast в миллисекундах\n   */\n  public push(notification: string, action?: Nullable<Action>, showTime?: number) {\n    if (this.state.notification) {\n      this.close();\n    }\n\n    safelyCall(this.props.onPush, notification, action);\n\n    this.setState(({ id }) => ({ notification, action, id: id + 1, showTime }), this._setTimer);\n  }\n\n  /**\n   * @public\n   */\n  public close = () => {\n    safelyCall(this.props.onClose, this.state.notification, this.state.action);\n    this.setState({ notification: null, action: null });\n  };\n\n  private _renderToast() {\n    const { notification, action, id } = this.state;\n\n    if (!notification) {\n      return null;\n    }\n\n    const toastProps: ToastViewProps = {\n      onMouseEnter: this._clearTimer,\n      onMouseLeave: this._setTimer,\n      onClose: this.close,\n      children: notification,\n      'aria-label': this.props['aria-label'],\n      action,\n    };\n    const styles = getStyles(this.emotion);\n\n    return (\n      <CSSTransition\n        key={id}\n        classNames={{\n          enter: styles.enter(),\n          enterActive: styles.enterActive(),\n          exit: styles.exit(),\n          exitActive: styles.exitActive(),\n        }}\n        timeout={{\n          enter: 200,\n          exit: 150,\n        }}\n        enter={!isTestEnv}\n        exit={!isTestEnv}\n        nodeRef={this.rootRef}\n      >\n        <CommonWrapper rootNodeRef={this.setRootRef} {...this.props}>\n          <ToastView ref={this._refToast} {...toastProps} />\n        </CommonWrapper>\n      </CSSTransition>\n    );\n  }\n\n  private setRootRef = (element: Nullable<Element>) => {\n    this.setRootNode(element);\n    // @ts-expect-error: See: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/31065.\n    this.rootRef.current = element;\n  };\n\n  private _clearTimer = () => {\n    if (this._timeout) {\n      globalObject.clearTimeout(this._timeout);\n      this._timeout = null;\n    }\n  };\n\n  private _setTimer = () => {\n    this._clearTimer();\n\n    let showTime = this.state.action ? 7000 : 3000;\n    showTime = this.state.showTime ?? showTime;\n    this._timeout = globalObject.setTimeout(this.close, showTime);\n  };\n\n  private _refToast = (element: ToastView) => {\n    this._toast = element;\n  };\n}\n\nfunction safelyCall(fn: Nullable<(a?: any) => any>, ...args: any[]) {\n  if (fn) {\n    fn(...args);\n  }\n}\n"]}

package/components/Toast/Toast/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/Toast/Toast.js",
+  "module": "Toast",
+  "types": "../Toast.d.ts",
+  "sideEffects": false
+}