@skbkontur/react-ui 0.0.0-5a76463ffc → 0.0.0-60bf3b9da8

package/cjs/components/Textarea/Textarea.styles.js

@@ -1,9 +1,9 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.jsStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");function _templateObject11() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      transition: none;\n    "]);_templateObject11 = function _templateObject11() {return data;};return data;}function _templateObject10() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-left: 4px;\n      cursor: pointer;\n    "]);_templateObject10 = function _templateObject10() {return data;};return data;}function _templateObject9() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", " !important;\n    "]);_templateObject9 = function _templateObject9() {return data;};return data;}function _templateObject8() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: absolute;\n      z-index: 3;\n      text-align: right;\n      background: ", ";\n      color: ", ";\n      border-radius: 2px;\n      right: ", ";\n      bottom: ", ";\n    "]);_templateObject8 = function _templateObject8() {return data;};return data;}function _templateObject7() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: absolute;\n      top: 0;\n      border: ", " solid transparent;\n      box-sizing: content-box;\n    "]);_templateObject7 = function _templateObject7() {return data;};return data;}function _templateObject6() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      -ms-user-select: none;\n      color: #aaa;\n      left: 12px;\n      overflow: hidden;\n      position: absolute;\n      right: 12px;\n      top: 9px;\n      user-select: none;\n      z-index: 3;\n    "]);_templateObject6 = function _templateObject6() {return data;};return data;}function _templateObject5() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      height: 0;\n      left: 0;\n      position: absolute;\n      top: 0;\n      visibility: hidden;\n      width: 100%;\n    "]);_templateObject5 = function _templateObject5() {return data;};return data;}function _templateObject4() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "& {\n        border-color: ", ";\n        box-shadow: 0 0 0 ", " ", ";\n      }\n      ", "&:focus {\n        border-color: ", ";\n        box-shadow: 0 0 0 ", " ", ";\n      }\n    "]);_templateObject4 = function _templateObject4() {return data;};return data;}function _templateObject3() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "& {\n        border-color: ", ";\n        box-shadow: 0 0 0 ", " ", ";\n      }\n      ", "&:focus {\n        border-color: ", ";\n        box-shadow: 0 0 0 ", " ", ";\n      }\n    "]);_templateObject3 = function _templateObject3() {return data;};return data;}function _templateObject2() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      -webkit-appearance: none;\n      background-clip: padding-box;\n      background: ", ";\n      border: ", " solid ", ";\n      border-top-color: ", ";\n      box-shadow: ", ";\n      box-sizing: border-box;\n      color: ", ";\n      font-family: inherit;\n      font-size: inherit;\n      line-height: inherit;\n      max-width: 100%;\n      min-width: ", ";\n      min-height: ", ";\n      outline: none;\n      padding: ", " ", ";\n      transition: height 0.2s ease-out;\n      vertical-align: middle;\n      width: 100%;\n      border-radius: ", ";\n      white-space: pre-wrap;\n\n      &:focus {\n        border-color: ", ";\n        box-shadow: 0 0 0 ", " ", ";\n        position: relative;\n        z-index: 2;\n\n        &::placeholder {\n          color: ", ";\n        }\n      }\n      &:disabled {\n        color: ", ";\n        background: ", ";\n        border-color: ", ";\n        box-shadow: none;\n      }\n\n      &::placeholder {\n        color: ", ";\n      }\n\n      &:-moz-placeholder {\n        color: ", ";\n      }\n\n      &::-moz-placeholder {\n        color: ", ";\n      }\n    "]);_templateObject2 = function _templateObject2() {return data;};return data;}function _templateObject() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      font-size: ", ";\n      line-height: ", ";\n      position: relative;\n    "]);_templateObject = function _templateObject() {return data;};return data;}
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
 
 
-var styles = {
+var styles = (0, _Emotion.memoizeStyle)({
   root: function root(t) {
-    return (0, _Emotion.css)(_templateObject(),
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      font-size: ", ";\n      line-height: ", ";\n      position: relative;\n    "])),
 
     t.textareaFontSize,
     t.textareaLineHeight);
@@ -12,10 +12,10 @@ var styles = {
   },
 
   textarea: function textarea(t) {
-    return (0, _Emotion.css)(_templateObject2(),
-
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      -webkit-appearance: none;\n      background: ", ";\n      background-clip: ", ";\n      border: ", " solid ", ";\n      border-top-color: ", ";\n      box-shadow: ", ";\n      box-sizing: border-box;\n      color: ", ";\n      font-family: inherit;\n      font-size: inherit;\n      line-height: inherit;\n      max-width: 100%;\n      min-width: ", ";\n      min-height: ", ";\n      outline: none;\n      padding: ", " ", ";\n      transition: border-color ", " ", ", height 0.2s ease-out;\n      vertical-align: middle;\n      width: 100%;\n      border-radius: ", ";\n      white-space: pre-wrap;\n\n      &:focus {\n        border-color: ", ";\n        box-shadow: 0 0 0 ", " ", ";\n        position: relative;\n        z-index: 2;\n\n        &::placeholder {\n          color: ", ";\n        }\n      }\n\n      &::placeholder {\n        color: ", ";\n      }\n\n      &:-moz-placeholder {\n        color: ", ";\n      }\n\n      &::-moz-placeholder {\n        color: ", ";\n      }\n    "])),
 
     t.textareaBg,
+    t.textareaBackgroundClip,
     t.textareaBorderWidth, t.textareaBorderColor,
     t.textareaBorderTopColor,
     t.textareaShadow,
@@ -29,7 +29,7 @@ var styles = {
     t.textareaMinHeight,
 
     t.textareaPaddingY, t.textareaPaddingX,
-
+    t.transitionDuration, t.transitionTimingFunction,
 
 
     t.textareaBorderRadius,
@@ -46,10 +46,8 @@ var styles = {
 
 
 
-    t.textareaTextColorDisabled,
-    t.textareaDisabledBg,
-    t.textareaDisabledBorderColor,
 
+    t.textareaPlaceholderColor,
 
 
 
@@ -57,22 +55,25 @@ var styles = {
 
 
 
-    t.textareaPlaceholderColor,
+    t.textareaPlaceholderColor);
 
 
+  },
 
-    t.textareaPlaceholderColor);
+  hovering: function hovering(t) {
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:enabled:hover:not(:focus) {\n        border-color: ", ";\n      }\n    "])),
+
+    t.textareaBorderColorHover);
 
 
   },
 
   error: function error(t) {
-    return (0, _Emotion.css)(_templateObject3(),
-    (0, _Emotion.cssName)(styles.textarea(t)),
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border-color: ", ";\n      box-shadow: 0 0 0 ", " ", ";\n\n      &:focus {\n        border-color: ", ";\n        box-shadow: 0 0 0 ", " ", ";\n      }\n    "])),
     t.textareaBorderColorError,
     t.textareaBorderWidth, t.textareaBorderColorError,
 
-    (0, _Emotion.cssName)(styles.textarea(t)),
+
     t.textareaBorderColorError,
     t.textareaOutlineWidth, t.textareaBorderColorError);
 
@@ -80,20 +81,32 @@ var styles = {
   },
 
   warning: function warning(t) {
-    return (0, _Emotion.css)(_templateObject4(),
-    (0, _Emotion.cssName)(styles.textarea(t)),
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border-color: ", ";\n      box-shadow: 0 0 0 ", " ", ";\n\n      &:focus {\n        border-color: ", ";\n        box-shadow: 0 0 0 ", " ", ";\n      }\n    "])),
     t.textareaBorderColorWarning,
     t.textareaOutlineWidth, t.textareaBorderColorWarning,
 
-    (0, _Emotion.cssName)(styles.textarea(t)),
+
     t.textareaBorderColorWarning,
     t.textareaOutlineWidth, t.textareaBorderColorWarning);
 
 
+  },
+
+  disabled: function disabled(t) {
+    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      background: ", ";\n      border-color: ", ";\n      box-shadow: none;\n\n      &::placeholder {\n        color: ", ";\n      }\n    "])),
+    t.textareaTextColorDisabled,
+    t.textareaDisabledBg,
+    t.textareaDisabledBorderColor,
+
+
+
+    t.textareaPlaceholderColorDisabled);
+
+
   },
 
   fake: function fake() {
-    return (0, _Emotion.css)(_templateObject5());
+    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      height: 0;\n      left: 0;\n      position: absolute;\n      top: 0;\n      visibility: hidden;\n      width: 100%;\n    "])));
 
 
 
@@ -104,7 +117,7 @@ var styles = {
   },
 
   placeholder: function placeholder() {
-    return (0, _Emotion.css)(_templateObject6());
+    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      -ms-user-select: none;\n      color: #aaa;\n      left: 12px;\n      overflow: hidden;\n      position: absolute;\n      right: 12px;\n      top: 9px;\n      user-select: none;\n      z-index: 3;\n    "])));
 
 
 
@@ -118,7 +131,7 @@ var styles = {
   },
 
   counterContainer: function counterContainer(t) {
-    return (0, _Emotion.css)(_templateObject7(),
+    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: absolute;\n      top: 0;\n      border: ", " solid transparent;\n      box-sizing: content-box;\n    "])),
 
 
     t.textareaBorderWidth);
@@ -127,7 +140,7 @@ var styles = {
   },
 
   counter: function counter(t) {
-    return (0, _Emotion.css)(_templateObject8(),
+    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: absolute;\n      z-index: 3;\n      text-align: right;\n      background: ", ";\n      color: ", ";\n      border-radius: 2px;\n      right: ", ";\n      bottom: ", ";\n    "])),
 
 
 
@@ -140,23 +153,20 @@ var styles = {
   },
 
   counterError: function counterError(t) {
-    return (0, _Emotion.css)(_templateObject9(),
+    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n    "])),
     t.textareaCounterErrorColor);
 
   },
 
   counterHelp: function counterHelp() {
-    return (0, _Emotion.css)(_templateObject10());
+    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-left: 4px;\n      cursor: pointer;\n    "])));
 
 
 
   },
 
   disableAnimations: function disableAnimations() {
-    return (0, _Emotion.css)(_templateObject11());
-
-
-  } };
+    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      transition: none;\n    "])));
 
 
-var jsStyles = (0, _Emotion.memoizeStyle)(styles);exports.jsStyles = jsStyles;
+  } });exports.styles = styles;

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

@@ -1 +1 @@
-{"version":3,"sources":["Textarea.styles.ts"],"names":["styles","root","t","css","textareaFontSize","textareaLineHeight","textarea","textareaBg","textareaBorderWidth","textareaBorderColor","textareaBorderTopColor","textareaShadow","textareaColor","textareaWidth","textareaMinHeight","textareaPaddingY","textareaPaddingX","textareaBorderRadius","textareaBorderColorFocus","textareaOutlineWidth","textareaPlaceholderColorLight","textareaTextColorDisabled","textareaDisabledBg","textareaDisabledBorderColor","textareaPlaceholderColor","error","textareaBorderColorError","warning","textareaBorderColorWarning","fake","placeholder","counterContainer","counter","textareaCounterBg","textareaCounterColor","counterError","textareaCounterErrorColor","counterHelp","disableAnimations","jsStyles"],"mappings":"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","sourcesContent":["import { css, cssName, memoizeStyle } from '../../lib/theming/Emotion';\r\nimport { Theme } from '../../lib/theming/Theme';\r\n\r\nconst styles = {\r\n  root(t: Theme) {\r\n    return css`\r\n      display: inline-block;\r\n      font-size: ${t.textareaFontSize};\r\n      line-height: ${t.textareaLineHeight};\r\n      position: relative;\r\n    `;\r\n  },\r\n\r\n  textarea(t: Theme) {\r\n    return css`\r\n      -webkit-appearance: none;\r\n      background-clip: padding-box;\r\n      background: ${t.textareaBg};\r\n      border: ${t.textareaBorderWidth} solid ${t.textareaBorderColor};\r\n      border-top-color: ${t.textareaBorderTopColor};\r\n      box-shadow: ${t.textareaShadow};\r\n      box-sizing: border-box;\r\n      color: ${t.textareaColor};\r\n      font-family: inherit;\r\n      font-size: inherit;\r\n      line-height: inherit;\r\n      max-width: 100%;\r\n      min-width: ${t.textareaWidth};\r\n      min-height: ${t.textareaMinHeight};\r\n      outline: none;\r\n      padding: ${t.textareaPaddingY} ${t.textareaPaddingX};\r\n      transition: height 0.2s ease-out;\r\n      vertical-align: middle;\r\n      width: 100%;\r\n      border-radius: ${t.textareaBorderRadius};\r\n      white-space: pre-wrap;\r\n\r\n      &:focus {\r\n        border-color: ${t.textareaBorderColorFocus};\r\n        box-shadow: 0 0 0 ${t.textareaOutlineWidth} ${t.textareaBorderColorFocus};\r\n        position: relative;\r\n        z-index: 2;\r\n\r\n        &::placeholder {\r\n          color: ${t.textareaPlaceholderColorLight};\r\n        }\r\n      }\r\n      &:disabled {\r\n        color: ${t.textareaTextColorDisabled};\r\n        background: ${t.textareaDisabledBg};\r\n        border-color: ${t.textareaDisabledBorderColor};\r\n        box-shadow: none;\r\n      }\r\n\r\n      &::placeholder {\r\n        color: ${t.textareaPlaceholderColor};\r\n      }\r\n\r\n      &:-moz-placeholder {\r\n        color: ${t.textareaPlaceholderColor};\r\n      }\r\n\r\n      &::-moz-placeholder {\r\n        color: ${t.textareaPlaceholderColor};\r\n      }\r\n    `;\r\n  },\r\n\r\n  error(t: Theme) {\r\n    return css`\r\n      ${cssName(styles.textarea(t))}& {\r\n        border-color: ${t.textareaBorderColorError};\r\n        box-shadow: 0 0 0 ${t.textareaBorderWidth} ${t.textareaBorderColorError};\r\n      }\r\n      ${cssName(styles.textarea(t))}&:focus {\r\n        border-color: ${t.textareaBorderColorError};\r\n        box-shadow: 0 0 0 ${t.textareaOutlineWidth} ${t.textareaBorderColorError};\r\n      }\r\n    `;\r\n  },\r\n\r\n  warning(t: Theme) {\r\n    return css`\r\n      ${cssName(styles.textarea(t))}& {\r\n        border-color: ${t.textareaBorderColorWarning};\r\n        box-shadow: 0 0 0 ${t.textareaOutlineWidth} ${t.textareaBorderColorWarning};\r\n      }\r\n      ${cssName(styles.textarea(t))}&:focus {\r\n        border-color: ${t.textareaBorderColorWarning};\r\n        box-shadow: 0 0 0 ${t.textareaOutlineWidth} ${t.textareaBorderColorWarning};\r\n      }\r\n    `;\r\n  },\r\n\r\n  fake() {\r\n    return css`\r\n      height: 0;\r\n      left: 0;\r\n      position: absolute;\r\n      top: 0;\r\n      visibility: hidden;\r\n      width: 100%;\r\n    `;\r\n  },\r\n\r\n  placeholder() {\r\n    return css`\r\n      -ms-user-select: none;\r\n      color: #aaa;\r\n      left: 12px;\r\n      overflow: hidden;\r\n      position: absolute;\r\n      right: 12px;\r\n      top: 9px;\r\n      user-select: none;\r\n      z-index: 3;\r\n    `;\r\n  },\r\n\r\n  counterContainer(t: Theme) {\r\n    return css`\r\n      position: absolute;\r\n      top: 0;\r\n      border: ${t.textareaBorderWidth} solid transparent;\r\n      box-sizing: content-box;\r\n    `;\r\n  },\r\n\r\n  counter(t: Theme) {\r\n    return css`\r\n      position: absolute;\r\n      z-index: 3;\r\n      text-align: right;\r\n      background: ${t.textareaCounterBg};\r\n      color: ${t.textareaCounterColor};\r\n      border-radius: 2px;\r\n      right: ${t.textareaPaddingX};\r\n      bottom: ${t.textareaPaddingY};\r\n    `;\r\n  },\r\n\r\n  counterError(t: Theme) {\r\n    return css`\r\n      color: ${t.textareaCounterErrorColor} !important;\r\n    `;\r\n  },\r\n\r\n  counterHelp() {\r\n    return css`\r\n      margin-left: 4px;\r\n      cursor: pointer;\r\n    `;\r\n  },\r\n\r\n  disableAnimations() {\r\n    return css`\r\n      transition: none;\r\n    `;\r\n  },\r\n};\r\n\r\nexport const jsStyles = memoizeStyle(styles);\r\n"]}
+{"version":3,"sources":["Textarea.styles.ts"],"names":["styles","root","t","css","textareaFontSize","textareaLineHeight","textarea","textareaBg","textareaBackgroundClip","textareaBorderWidth","textareaBorderColor","textareaBorderTopColor","textareaShadow","textareaColor","textareaWidth","textareaMinHeight","textareaPaddingY","textareaPaddingX","transitionDuration","transitionTimingFunction","textareaBorderRadius","textareaBorderColorFocus","textareaOutlineWidth","textareaPlaceholderColorLight","textareaPlaceholderColor","hovering","textareaBorderColorHover","error","textareaBorderColorError","warning","textareaBorderColorWarning","disabled","textareaTextColorDisabled","textareaDisabledBg","textareaDisabledBorderColor","textareaPlaceholderColorDisabled","fake","placeholder","counterContainer","counter","textareaCounterBg","textareaCounterColor","counterError","textareaCounterErrorColor","counterHelp","disableAnimations"],"mappings":"4QAAA,oD;;;AAGO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,eAAOC,YAAP;;AAEeD,IAAAA,CAAC,CAACE,gBAFjB;AAGiBF,IAAAA,CAAC,CAACG,kBAHnB;;;AAMD,GARgC;;AAUjCC,EAAAA,QAViC,oBAUxBJ,CAVwB,EAUd;AACjB,eAAOC,YAAP;;AAEgBD,IAAAA,CAAC,CAACK,UAFlB;AAGqBL,IAAAA,CAAC,CAACM,sBAHvB;AAIYN,IAAAA,CAAC,CAACO,mBAJd,EAI2CP,CAAC,CAACQ,mBAJ7C;AAKsBR,IAAAA,CAAC,CAACS,sBALxB;AAMgBT,IAAAA,CAAC,CAACU,cANlB;;AAQWV,IAAAA,CAAC,CAACW,aARb;;;;;AAaeX,IAAAA,CAAC,CAACY,aAbjB;AAcgBZ,IAAAA,CAAC,CAACa,iBAdlB;;AAgBab,IAAAA,CAAC,CAACc,gBAhBf,EAgBmCd,CAAC,CAACe,gBAhBrC;AAiB6Bf,IAAAA,CAAC,CAACgB,kBAjB/B,EAiBqDhB,CAAC,CAACiB,wBAjBvD;;;AAoBmBjB,IAAAA,CAAC,CAACkB,oBApBrB;;;;AAwBoBlB,IAAAA,CAAC,CAACmB,wBAxBtB;AAyBwBnB,IAAAA,CAAC,CAACoB,oBAzB1B,EAyBkDpB,CAAC,CAACmB,wBAzBpD;;;;;AA8BenB,IAAAA,CAAC,CAACqB,6BA9BjB;;;;;AAmCarB,IAAAA,CAAC,CAACsB,wBAnCf;;;;AAuCatB,IAAAA,CAAC,CAACsB,wBAvCf;;;;AA2CatB,IAAAA,CAAC,CAACsB,wBA3Cf;;;AA8CD,GAzDgC;;AA2DjCC,EAAAA,QA3DiC,oBA2DxBvB,CA3DwB,EA2Dd;AACjB,eAAOC,YAAP;;AAEoBD,IAAAA,CAAC,CAACwB,wBAFtB;;;AAKD,GAjEgC;;AAmEjCC,EAAAA,KAnEiC,iBAmE3BzB,CAnE2B,EAmEjB;AACd,eAAOC,YAAP;AACkBD,IAAAA,CAAC,CAAC0B,wBADpB;AAEsB1B,IAAAA,CAAC,CAACO,mBAFxB,EAE+CP,CAAC,CAAC0B,wBAFjD;;;AAKoB1B,IAAAA,CAAC,CAAC0B,wBALtB;AAMwB1B,IAAAA,CAAC,CAACoB,oBAN1B,EAMkDpB,CAAC,CAAC0B,wBANpD;;;AASD,GA7EgC;;AA+EjCC,EAAAA,OA/EiC,mBA+EzB3B,CA/EyB,EA+Ef;AAChB,eAAOC,YAAP;AACkBD,IAAAA,CAAC,CAAC4B,0BADpB;AAEsB5B,IAAAA,CAAC,CAACoB,oBAFxB,EAEgDpB,CAAC,CAAC4B,0BAFlD;;;AAKoB5B,IAAAA,CAAC,CAAC4B,0BALtB;AAMwB5B,IAAAA,CAAC,CAACoB,oBAN1B,EAMkDpB,CAAC,CAAC4B,0BANpD;;;AASD,GAzFgC;;AA2FjCC,EAAAA,QA3FiC,oBA2FxB7B,CA3FwB,EA2Fd;AACjB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAAC8B,yBADb;AAEgB9B,IAAAA,CAAC,CAAC+B,kBAFlB;AAGkB/B,IAAAA,CAAC,CAACgC,2BAHpB;;;;AAOahC,IAAAA,CAAC,CAACiC,gCAPf;;;AAUD,GAtGgC;;AAwGjCC,EAAAA,IAxGiC,kBAwG1B;AACL,eAAOjC,YAAP;;;;;;;;AAQD,GAjHgC;;AAmHjCkC,EAAAA,WAnHiC,yBAmHnB;AACZ,eAAOlC,YAAP;;;;;;;;;;;AAWD,GA/HgC;;AAiIjCmC,EAAAA,gBAjIiC,4BAiIhBpC,CAjIgB,EAiIN;AACzB,eAAOC,YAAP;;;AAGYD,IAAAA,CAAC,CAACO,mBAHd;;;AAMD,GAxIgC;;AA0IjC8B,EAAAA,OA1IiC,mBA0IzBrC,CA1IyB,EA0If;AAChB,eAAOC,YAAP;;;;AAIgBD,IAAAA,CAAC,CAACsC,iBAJlB;AAKWtC,IAAAA,CAAC,CAACuC,oBALb;;AAOWvC,IAAAA,CAAC,CAACe,gBAPb;AAQYf,IAAAA,CAAC,CAACc,gBARd;;AAUD,GArJgC;;AAuJjC0B,EAAAA,YAvJiC,wBAuJpBxC,CAvJoB,EAuJV;AACrB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACyC,yBADb;;AAGD,GA3JgC;;AA6JjCC,EAAAA,WA7JiC,yBA6JnB;AACZ,eAAOzC,YAAP;;;;AAID,GAlKgC;;AAoKjC0C,EAAAA,iBApKiC,+BAoKb;AAClB,eAAO1C,YAAP;;;AAGD,GAxKgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      display: inline-block;\n      font-size: ${t.textareaFontSize};\n      line-height: ${t.textareaLineHeight};\n      position: relative;\n    `;\n  },\n\n  textarea(t: Theme) {\n    return css`\n      -webkit-appearance: none;\n      background: ${t.textareaBg};\n      background-clip: ${t.textareaBackgroundClip};\n      border: ${t.textareaBorderWidth} solid ${t.textareaBorderColor};\n      border-top-color: ${t.textareaBorderTopColor};\n      box-shadow: ${t.textareaShadow};\n      box-sizing: border-box;\n      color: ${t.textareaColor};\n      font-family: inherit;\n      font-size: inherit;\n      line-height: inherit;\n      max-width: 100%;\n      min-width: ${t.textareaWidth};\n      min-height: ${t.textareaMinHeight};\n      outline: none;\n      padding: ${t.textareaPaddingY} ${t.textareaPaddingX};\n      transition: border-color ${t.transitionDuration} ${t.transitionTimingFunction}, height 0.2s ease-out;\n      vertical-align: middle;\n      width: 100%;\n      border-radius: ${t.textareaBorderRadius};\n      white-space: pre-wrap;\n\n      &:focus {\n        border-color: ${t.textareaBorderColorFocus};\n        box-shadow: 0 0 0 ${t.textareaOutlineWidth} ${t.textareaBorderColorFocus};\n        position: relative;\n        z-index: 2;\n\n        &::placeholder {\n          color: ${t.textareaPlaceholderColorLight};\n        }\n      }\n\n      &::placeholder {\n        color: ${t.textareaPlaceholderColor};\n      }\n\n      &:-moz-placeholder {\n        color: ${t.textareaPlaceholderColor};\n      }\n\n      &::-moz-placeholder {\n        color: ${t.textareaPlaceholderColor};\n      }\n    `;\n  },\n\n  hovering(t: Theme) {\n    return css`\n      &:enabled:hover:not(:focus) {\n        border-color: ${t.textareaBorderColorHover};\n      }\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      border-color: ${t.textareaBorderColorError};\n      box-shadow: 0 0 0 ${t.textareaBorderWidth} ${t.textareaBorderColorError};\n\n      &:focus {\n        border-color: ${t.textareaBorderColorError};\n        box-shadow: 0 0 0 ${t.textareaOutlineWidth} ${t.textareaBorderColorError};\n      }\n    `;\n  },\n\n  warning(t: Theme) {\n    return css`\n      border-color: ${t.textareaBorderColorWarning};\n      box-shadow: 0 0 0 ${t.textareaOutlineWidth} ${t.textareaBorderColorWarning};\n\n      &:focus {\n        border-color: ${t.textareaBorderColorWarning};\n        box-shadow: 0 0 0 ${t.textareaOutlineWidth} ${t.textareaBorderColorWarning};\n      }\n    `;\n  },\n\n  disabled(t: Theme) {\n    return css`\n      color: ${t.textareaTextColorDisabled};\n      background: ${t.textareaDisabledBg};\n      border-color: ${t.textareaDisabledBorderColor};\n      box-shadow: none;\n\n      &::placeholder {\n        color: ${t.textareaPlaceholderColorDisabled};\n      }\n    `;\n  },\n\n  fake() {\n    return css`\n      height: 0;\n      left: 0;\n      position: absolute;\n      top: 0;\n      visibility: hidden;\n      width: 100%;\n    `;\n  },\n\n  placeholder() {\n    return css`\n      -ms-user-select: none;\n      color: #aaa;\n      left: 12px;\n      overflow: hidden;\n      position: absolute;\n      right: 12px;\n      top: 9px;\n      user-select: none;\n      z-index: 3;\n    `;\n  },\n\n  counterContainer(t: Theme) {\n    return css`\n      position: absolute;\n      top: 0;\n      border: ${t.textareaBorderWidth} solid transparent;\n      box-sizing: content-box;\n    `;\n  },\n\n  counter(t: Theme) {\n    return css`\n      position: absolute;\n      z-index: 3;\n      text-align: right;\n      background: ${t.textareaCounterBg};\n      color: ${t.textareaCounterColor};\n      border-radius: 2px;\n      right: ${t.textareaPaddingX};\n      bottom: ${t.textareaPaddingY};\n    `;\n  },\n\n  counterError(t: Theme) {\n    return css`\n      color: ${t.textareaCounterErrorColor};\n    `;\n  },\n\n  counterHelp() {\n    return css`\n      margin-left: 4px;\n      cursor: pointer;\n    `;\n  },\n\n  disableAnimations() {\n    return css`\n      transition: none;\n    `;\n  },\n});\n"]}

package/cjs/components/Textarea/TextareaCounter.d.ts

@@ -1,13 +1,12 @@
-import React from 'react';
 import { TextareaProps } from './Textarea';
-export declare type TextareaCounterProps = {
+export interface TextareaCounterProps {
     value: TextareaProps['value'];
     length: number;
     help: TextareaProps['counterHelp'];
     onCloseHelp: () => void;
     textarea: HTMLTextAreaElement;
-};
+}
 export interface TextareaCounterRef {
     reflow: () => void;
 }
-export declare const TextareaCounter: React.ForwardRefExoticComponent<TextareaCounterProps & React.RefAttributes<TextareaCounterRef>>;
+export declare const TextareaCounter: import("../../lib/forwardRefAndName").ReactUIComponentWithRef<TextareaCounterRef, TextareaCounterProps>;

package/cjs/components/Textarea/TextareaCounter.js

@@ -1,13 +1,18 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");exports.__esModule = true;exports.TextareaCounter = void 0;var _react = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.TextareaCounter = void 0;var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
+var _SSRSafe = require("../../lib/SSRSafe");
+var _forwardRefAndName = require("../../lib/forwardRefAndName");
 var _px = require("../../internal/icons/16px");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _utils = require("../../lib/utils");
 var _Tooltip = require("../Tooltip");
+var _Emotion = require("../../lib/theming/Emotion");
+var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
+var _QuestionCircleIcon16Solid = require("../../internal/icons2022/QuestionCircleIcon/QuestionCircleIcon16Solid");
 
-
-var _Textarea = require("./Textarea.styles");
+var _Textarea = require("./Textarea");
+var _Textarea2 = require("./Textarea.styles");function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
 
 
 
@@ -23,41 +28,58 @@ var _Textarea = require("./Textarea.styles");
 
 var handleHelpMouseDown = function handleHelpMouseDown(e) {return e.preventDefault();};
 
-var TextareaCounter = /*#__PURE__*/_react.default.forwardRef(function TextareaCounter(_ref,
-
-ref)
-{var _cn;var length = _ref.length,value = _ref.value,help = _ref.help,onCloseHelp = _ref.onCloseHelp,textarea = _ref.textarea;
-  var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);var _useState =
-  (0, _react.useState)(textarea.clientWidth),width = _useState[0],setWidth = _useState[1];var _useState2 =
-  (0, _react.useState)(textarea.clientHeight),height = _useState2[0],setHeight = _useState2[1];
-  var reflow = function reflow() {var
-    clientWidth = textarea.clientWidth,clientHeight = textarea.clientHeight;
+var TextareaCounter = (0, _forwardRefAndName.forwardRefAndName)(
+'TextareaCounter',
+function (_ref, ref) {var _cx;var length = _ref.length,value = _ref.value,help = _ref.help,onCloseHelp = _ref.onCloseHelp,textarea = _ref.textarea;
+  var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
+  var _useState = (0, _react.useState)(textarea.clientWidth),width = _useState[0],setWidth = _useState[1];
+  var _useState2 = (0, _react.useState)(textarea.clientHeight),height = _useState2[0],setHeight = _useState2[1];
+  var reflow = (0, _react.useCallback)(function () {
+    var clientWidth = textarea.clientWidth,clientHeight = textarea.clientHeight;
     setWidth(clientWidth);
     setHeight(clientHeight);
-  };
-  (0, _react.useEffect)(reflow, [textarea]);
-  (0, _react.useImperativeHandle)(ref, function () {return { reflow: reflow };}, [ref]);
+  }, [textarea]);
+  (0, _react.useImperativeHandle)(ref, function () {return { reflow: reflow };}, [reflow]);
   var renderTooltipContent = (0, _react.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': _Textarea.TextareaDataTids.helpIcon };
+
+  var helpIcon = (0, _ThemeHelpers.isTheme2022)(theme) ? /*#__PURE__*/
+  _react.default.createElement(_QuestionCircleIcon16Solid.QuestionCircleIcon16Solid, helpIconProps) : /*#__PURE__*/
+
+  _react.default.createElement(_px.HelpDotIcon, helpIconProps);
+
   var counterHelp = (0, _utils.isFunction)(help) ?
   help() : /*#__PURE__*/
 
-  _react.default.createElement(_Tooltip.Tooltip, { pos: 'right bottom', trigger: 'click', render: renderTooltipContent, onCloseClick: onCloseHelp }, /*#__PURE__*/
-  _react.default.createElement(_px.HelpDotIcon, { onMouseDown: handleHelpMouseDown, color: theme.textareaCounterHelpIconColor }));
+  _react.default.createElement(_Tooltip.Tooltip, { pos: 'right bottom', trigger: 'click', render: renderTooltipContent, onCloseClick: onCloseHelp },
+  helpIcon);
 
 
 
   return /*#__PURE__*/(
-    _react.default.createElement("div", { className: _Textarea.jsStyles.counterContainer(theme), style: { width: width, height: height } }, /*#__PURE__*/
+    _react.default.createElement("div", { "data-tid": _Textarea.TextareaDataTids.counter, className: _Textarea2.styles.counterContainer(theme), style: { width: width, height: height } }, /*#__PURE__*/
     _react.default.createElement("span", {
-      className: (0, _classnames.default)(_Textarea.jsStyles.counter(theme), (_cn = {}, _cn[
-      _Textarea.jsStyles.counterError(theme)] = counterValue < 0, _cn)) },
+      className: (0, _Emotion.cx)(_Textarea2.styles.counter(theme), (_cx = {}, _cx[
+      _Textarea2.styles.counterError(theme)] = counterValue < 0, _cx)) },
 
 
     counterValue,
-    help && /*#__PURE__*/_react.default.createElement("span", { className: _Textarea.jsStyles.counterHelp() }, counterHelp))));
+    help && /*#__PURE__*/_react.default.createElement("span", { className: _Textarea2.styles.counterHelp() }, counterHelp))));
+
+
 
+});exports.TextareaCounter = TextareaCounter;
 
 
-});exports.TextareaCounter = TextareaCounter;
+TextareaCounter.propTypes = {
+  length: _propTypes.default.number.isRequired,
+  value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
+  help: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
+  onCloseHelp: _propTypes.default.func.isRequired,
+  textarea: (0, _SSRSafe.safePropTypesInstanceOf)(function () {return HTMLElement;}).isRequired };

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

@@ -1 +1 @@
-{"version":3,"sources":["TextareaCounter.tsx"],"names":["handleHelpMouseDown","e","preventDefault","TextareaCounter","React","forwardRef","ref","length","value","help","onCloseHelp","textarea","theme","ThemeContext","clientWidth","width","setWidth","clientHeight","height","setHeight","reflow","renderTooltipContent","textareaValue","toString","counterValue","counterHelp","textareaCounterHelpIconColor","jsStyles","counterContainer","counter","counterError"],"mappings":"oPAAA;AACA;;AAEA;AACA;AACA;AACA;;;AAGA;;;;;;;;;;;;;;AAcA,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAsB,CAACC,CAAD,UAAuBA,CAAC,CAACC,cAAF,EAAvB,EAA5B;;AAEO,IAAMC,eAAe,gBAAGC,eAAMC,UAAN,CAA2D,SAASF,eAAT;;AAExFG,GAFwF;AAGxF,aAFEC,MAEF,QAFEA,MAEF,CAFUC,KAEV,QAFUA,KAEV,CAFiBC,IAEjB,QAFiBA,IAEjB,CAFuBC,WAEvB,QAFuBA,WAEvB,CAFoCC,QAEpC,QAFoCA,QAEpC;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd,CADA;AAE0B,uBAASF,QAAQ,CAACG,WAAlB,CAF1B,CAEOC,KAFP,gBAEcC,QAFd;AAG4B,uBAASL,QAAQ,CAACM,YAAlB,CAH5B,CAGOC,MAHP,iBAGeC,SAHf;AAIA,MAAMC,MAAM,GAAG,SAATA,MAAS,GAAM;AACXN,IAAAA,WADW,GACmBH,QADnB,CACXG,WADW,CACEG,YADF,GACmBN,QADnB,CACEM,YADF;AAEnBD,IAAAA,QAAQ,CAACF,WAAD,CAAR;AACAK,IAAAA,SAAS,CAACF,YAAD,CAAT;AACD,GAJD;AAKA,wBAAUG,MAAV,EAAkB,CAACT,QAAD,CAAlB;AACA,kCAAoBL,GAApB,EAAyB,oBAAO,EAAEc,MAAM,EAANA,MAAF,EAAP,EAAzB,EAA6C,CAACd,GAAD,CAA7C;AACA,MAAMe,oBAAoB,GAAG,wBAAY,oBAAMZ,IAAN,EAAZ,EAAwB,CAACA,IAAD,CAAxB,CAA7B;AACA,MAAMa,aAAa,GAAGd,KAAK,GAAGA,KAAK,CAACe,QAAN,GAAiBhB,MAApB,GAA6B,CAAxD;AACA,MAAMiB,YAAY,GAAGjB,MAAM,GAAGe,aAA9B;AACA,MAAMG,WAAW,GAAG,uBAAWhB,IAAX;AAClBA,EAAAA,IAAI,EADc;;AAGlB,+BAAC,gBAAD,IAAS,GAAG,EAAE,cAAd,EAA8B,OAAO,EAAE,OAAvC,EAAgD,MAAM,EAAEY,oBAAxD,EAA8E,YAAY,EAAEX,WAA5F;AACE,+BAAC,eAAD,IAAa,WAAW,EAAEV,mBAA1B,EAA+C,KAAK,EAAEY,KAAK,CAACc,4BAA5D,GADF,CAHF;;;;AAQA;AACE,0CAAK,SAAS,EAAEC,mBAASC,gBAAT,CAA0BhB,KAA1B,CAAhB,EAAkD,KAAK,EAAE,EAAEG,KAAK,EAALA,KAAF,EAASG,MAAM,EAANA,MAAT,EAAzD;AACE;AACE,MAAA,SAAS,EAAE,yBAAGS,mBAASE,OAAT,CAAiBjB,KAAjB,CAAH;AACRe,yBAASG,YAAT,CAAsBlB,KAAtB,CADQ,IACuBY,YAAY,GAAG,CADtC,OADb;;;AAKGA,IAAAA,YALH;AAMGf,IAAAA,IAAI,iBAAI,uCAAM,SAAS,EAAEkB,mBAASF,WAAT,EAAjB,IAA0CA,WAA1C,CANX,CADF,CADF;;;;AAYD,CArC8B,CAAxB,C","sourcesContent":["import React, { SyntheticEvent, useEffect, useContext, useCallback, useImperativeHandle, useState } from 'react';\r\nimport cn from 'classnames';\r\n\r\nimport { HelpDotIcon } from '../../internal/icons/16px';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { isFunction } from '../../lib/utils';\r\nimport { Tooltip } from '../Tooltip';\r\n\r\nimport { TextareaProps } from './Textarea';\r\nimport { jsStyles } from './Textarea.styles';\r\n\r\nexport type TextareaCounterProps = {\r\n  value: TextareaProps['value'];\r\n  length: number;\r\n  help: TextareaProps['counterHelp'];\r\n  onCloseHelp: () => void;\r\n  textarea: HTMLTextAreaElement;\r\n};\r\n\r\nexport interface TextareaCounterRef {\r\n  reflow: () => void;\r\n}\r\n\r\nconst handleHelpMouseDown = (e: SyntheticEvent) => e.preventDefault();\r\n\r\nexport const TextareaCounter = React.forwardRef<TextareaCounterRef, TextareaCounterProps>(function TextareaCounter(\r\n  { length, value, help, onCloseHelp, textarea },\r\n  ref,\r\n) {\r\n  const theme = useContext(ThemeContext);\r\n  const [width, setWidth] = useState(textarea.clientWidth);\r\n  const [height, setHeight] = useState(textarea.clientHeight);\r\n  const reflow = () => {\r\n    const { clientWidth, clientHeight } = textarea;\r\n    setWidth(clientWidth);\r\n    setHeight(clientHeight);\r\n  };\r\n  useEffect(reflow, [textarea]);\r\n  useImperativeHandle(ref, () => ({ reflow }), [ref]);\r\n  const renderTooltipContent = useCallback(() => help, [help]);\r\n  const textareaValue = value ? value.toString().length : 0;\r\n  const counterValue = length - textareaValue;\r\n  const counterHelp = isFunction(help) ? (\r\n    help()\r\n  ) : (\r\n    <Tooltip pos={'right bottom'} trigger={'click'} render={renderTooltipContent} onCloseClick={onCloseHelp}>\r\n      <HelpDotIcon onMouseDown={handleHelpMouseDown} color={theme.textareaCounterHelpIconColor} />\r\n    </Tooltip>\r\n  );\r\n\r\n  return (\r\n    <div className={jsStyles.counterContainer(theme)} style={{ width, height }}>\r\n      <span\r\n        className={cn(jsStyles.counter(theme), {\r\n          [jsStyles.counterError(theme)]: counterValue < 0,\r\n        })}\r\n      >\r\n        {counterValue}\r\n        {help && <span className={jsStyles.counterHelp()}>{counterHelp}</span>}\r\n      </span>\r\n    </div>\r\n  );\r\n});\r\n"]}
+{"version":3,"sources":["TextareaCounter.tsx"],"names":["handleHelpMouseDown","e","preventDefault","TextareaCounter","ref","length","value","help","onCloseHelp","textarea","theme","ThemeContext","clientWidth","width","setWidth","clientHeight","height","setHeight","reflow","renderTooltipContent","textareaValue","toString","counterValue","helpIconProps","onMouseDown","color","textareaCounterHelpIconColor","TextareaDataTids","helpIcon","counterHelp","counter","styles","counterContainer","counterError","propTypes","number","isRequired","oneOfType","string","node","func","HTMLElement"],"mappings":"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","sourcesContent":["import React, { SyntheticEvent, useContext, useCallback, useImperativeHandle, useState } from 'react';\nimport propTypes from 'prop-types';\n\nimport { safePropTypesInstanceOf } from '../../lib/SSRSafe';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName';\nimport { HelpDotIcon } from '../../internal/icons/16px';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { isFunction } from '../../lib/utils';\nimport { Tooltip } from '../Tooltip';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { QuestionCircleIcon16Solid } from '../../internal/icons2022/QuestionCircleIcon/QuestionCircleIcon16Solid';\n\nimport { TextareaDataTids, TextareaProps } from './Textarea';\nimport { styles } 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}\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 }, ref) => {\n    const theme = useContext(ThemeContext);\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\n    return (\n      <div data-tid={TextareaDataTids.counter} className={styles.counterContainer(theme)} style={{ width, height }}>\n        <span\n          className={cx(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(() => HTMLElement).isRequired,\n};\n"]}

package/cjs/components/Textarea/TextareaHelpers.js

@@ -1,6 +1,8 @@
-"use strict";exports.__esModule = true;exports.getTextAreaHeight = getTextAreaHeight;function getTextAreaHeight(params) {var
-  node = params.node,minRows = params.minRows,maxRows = params.maxRows,extraRow = params.extraRow;
-  var style = getComputedStyle(node);
+"use strict";exports.__esModule = true;exports.getTextAreaHeight = getTextAreaHeight;var _SSRSafe = require("../../lib/SSRSafe");
+
+function getTextAreaHeight(params) {
+  var node = params.node,minRows = params.minRows,maxRows = params.maxRows,extraRow = params.extraRow;
+  var style = _SSRSafe.globalThat.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;

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

@@ -1 +1 @@
-{"version":3,"sources":["TextareaHelpers.tsx"],"names":["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":"qFAAO,SAASA,iBAAT,CAA2BC,MAA3B,EAA4D;AACzDC,EAAAA,IADyD,GACpBD,MADoB,CACzDC,IADyD,CACnDC,OADmD,GACpBF,MADoB,CACnDE,OADmD,CAC1CC,OAD0C,GACpBH,MADoB,CAC1CG,OAD0C,CACjCC,QADiC,GACpBJ,MADoB,CACjCI,QADiC;AAEjE,MAAMC,KAA0B,GAAGC,gBAAgB,CAACL,IAAD,CAAnD;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":["export function getTextAreaHeight(params: GetTextAreaHeightParams) {\r\n  const { node, minRows, maxRows, extraRow } = params;\r\n  const style: CSSStyleDeclaration = getComputedStyle(node);\r\n  const borderTop = style.borderTopWidth ? parseInt(style.borderTopWidth, 10) : 0;\r\n  const borderBottom = style.borderBottomWidth ? parseInt(style.borderBottomWidth, 10) : 0;\r\n  const lineHeight = style.lineHeight ? parseInt(style.lineHeight, 10) : 0;\r\n  const paddingTop = style.paddingTop ? parseInt(style.paddingTop, 10) : 0;\r\n  const paddingBottom = style.paddingBottom ? parseInt(style.paddingBottom, 10) : 0;\r\n  const minHeight = borderTop + borderBottom + paddingTop + paddingBottom + lineHeight * minRows;\r\n  const maxHeight = borderTop + borderBottom + paddingTop + paddingBottom + lineHeight * maxRows;\r\n  const extraRowHeight = extraRow ? lineHeight : 0;\r\n  const expectedHeight = node.scrollHeight + borderTop + borderBottom + extraRowHeight;\r\n  return {\r\n    height: Math.min(Math.max(expectedHeight, minHeight), maxHeight),\r\n    exceededMaxHeight: expectedHeight > maxHeight + extraRowHeight,\r\n  };\r\n}\r\n\r\ninterface GetTextAreaHeightParams {\r\n  node: HTMLTextAreaElement;\r\n  minRows: number;\r\n  maxRows: number;\r\n  extraRow: boolean;\r\n}\r\n"]}
+{"version":3,"sources":["TextareaHelpers.tsx"],"names":["getTextAreaHeight","params","node","minRows","maxRows","extraRow","style","globalThat","getComputedStyle","borderTop","borderTopWidth","parseInt","borderBottom","borderBottomWidth","lineHeight","paddingTop","paddingBottom","minHeight","maxHeight","extraRowHeight","expectedHeight","scrollHeight","height","Math","min","max","exceededMaxHeight"],"mappings":"qFAAA;;AAEO,SAASA,iBAAT,CAA2BC,MAA3B,EAA4D;AACjE,MAAQC,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,KAA0B,GAAGC,oBAAWC,gBAAX,CAA4BN,IAA5B,CAAnC;AACA,MAAMO,SAAS,GAAGH,KAAK,CAACI,cAAN,GAAuBC,QAAQ,CAACL,KAAK,CAACI,cAAP,EAAuB,EAAvB,CAA/B,GAA4D,CAA9E;AACA,MAAME,YAAY,GAAGN,KAAK,CAACO,iBAAN,GAA0BF,QAAQ,CAACL,KAAK,CAACO,iBAAP,EAA0B,EAA1B,CAAlC,GAAkE,CAAvF;AACA,MAAMC,UAAU,GAAGR,KAAK,CAACQ,UAAN,GAAmBH,QAAQ,CAACL,KAAK,CAACQ,UAAP,EAAmB,EAAnB,CAA3B,GAAoD,CAAvE;AACA,MAAMC,UAAU,GAAGT,KAAK,CAACS,UAAN,GAAmBJ,QAAQ,CAACL,KAAK,CAACS,UAAP,EAAmB,EAAnB,CAA3B,GAAoD,CAAvE;AACA,MAAMC,aAAa,GAAGV,KAAK,CAACU,aAAN,GAAsBL,QAAQ,CAACL,KAAK,CAACU,aAAP,EAAsB,EAAtB,CAA9B,GAA0D,CAAhF;AACA,MAAMC,SAAS,GAAGR,SAAS,GAAGG,YAAZ,GAA2BG,UAA3B,GAAwCC,aAAxC,GAAwDF,UAAU,GAAGX,OAAvF;AACA,MAAMe,SAAS,GAAGT,SAAS,GAAGG,YAAZ,GAA2BG,UAA3B,GAAwCC,aAAxC,GAAwDF,UAAU,GAAGV,OAAvF;AACA,MAAMe,cAAc,GAAGd,QAAQ,GAAGS,UAAH,GAAgB,CAA/C;AACA,MAAMM,cAAc,GAAGlB,IAAI,CAACmB,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 { globalThat } from '../../lib/SSRSafe';\n\nexport function getTextAreaHeight(params: GetTextAreaHeightParams) {\n  const { node, minRows, maxRows, extraRow } = params;\n  const style: CSSStyleDeclaration = globalThat.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/cjs/components/Textarea/index.js.map

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

package/cjs/components/Toast/Toast.d.ts

@@ -10,43 +10,57 @@ export interface ToastState {
     notification: Nullable<string>;
     action: Nullable<Action>;
     id: number;
+    showTime: Nullable<number>;
 }
 export interface ToastProps extends CommonProps {
     onPush?: (notification: string, action?: Action) => void;
     onClose?: (notification: string, action?: Action) => void;
 }
+export declare const ToastDataTids: {
+    readonly toastStatic: "StaticToast";
+    readonly toastView: "ToastView__root";
+    readonly action: "ToastView__action";
+    readonly close: "ToastView__close";
+};
 /**
- * Toast manages notifications
- * method `push` is sending notification,
- * then automatically hides it after 3 or 7 seconds,
- * depending on if this notification contains action or not.
+ * Показывает уведомления.
  *
- * Can be used like `Toast.push('message')` or
- * `Toast.push('message', {label: 'Cancel', handler: cancelHandler})`
+ * Доступен статический метод: `Toast.push(notification, action?, showTime?)`.
+ * Однако, при его использовании не работает кастомизация и могут быть проблемы
+ * с перекрытием уведомления другими элементами страницы.
+ *
+ * Рекомендуется использовать Toast через `ref` (см. примеры).
  */
 export declare class Toast extends React.Component<ToastProps, ToastState> {
     static __KONTUR_REACT_UI__: string;
-    static push(notification: string, action?: Action): void;
+    private setRootNode;
+    static push(notification: string, action?: Nullable<Action>, showTime?: number): void;
     static close(): void;
     _toast: Nullable<ToastView>;
     private _timeout;
+    private rootRef;
     constructor(props: ToastProps);
     componentWillUnmount(): void;
     render(): JSX.Element;
     /**
      * Показывает тост с `notification` в качестве сообщения.
+     * Тост автоматически скрывается через 3 или 7 секунд,
+     * в зависимости от наличия у него кнопки `action`.
+     * Время показа можно задать вручную, передав `showTime`.
      *
-     * `action` опциональный параметр формата `{ label: string, handler: function }` добавляет кнопку в виде ссылки при клике на которую вызывается переданный handler
      * @public
-     * @param notification
-     * @param action
+     * @param {string} notification
+     * @param {Action} action `action` опциональный параметр формата `{ label: string, handler: function }`
+     * добавляет кнопку в виде ссылки при клике на которую вызывается переданный handler
+     * @param {number} showTime Время существования Toast в миллисекундах
      */
-    push(notification: string, action?: Action): void;
+    push(notification: string, action?: Nullable<Action>, showTime?: number): void;
     /**
      * @public
      */
     close: () => void;
     private _renderToast;
+    private setRootRef;
     private _clearTimer;
     private _setTimer;
     private _refToast;