@skbkontur/react-ui 0.0.0-69a6fa606f → 0.0.0-6fbd9fadb2

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

@@ -1,117 +1,143 @@
-"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;
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.getStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
 
+var _Emotion = require("../../lib/theming/Emotion");
 
-var styles = (0, _Emotion.memoizeStyle)({
-  root: function root(t) {
-    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);
+var _Textarea = require("./Textarea.mixins");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22;
 
+var getStyles = function getStyles(emotion) {return (
+    (0, _Emotion.memoizeStyle)({
+      root: function root() {
+        return emotion.css(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n        display: inline-block;\n        position: relative;\n      "])));
 
-  },
 
-  textarea: function textarea(t) {
-    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (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\n      &::placeholder {\n        color: ", ";\n      }\n\n      &:-moz-placeholder {\n        color: ", ";\n      }\n\n      &::-moz-placeholder {\n        color: ", ";\n      }\n    "])),
 
+      },
+      rootSmall: function rootSmall(t) {
+        return emotion.css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", ";\n      "])),
+        (0, _Textarea.rootTextareaSizeMixin)(emotion)(t.textareaFontSizeSmall, t.textareaLineHeightSmall));
 
-    t.textareaBg,
-    t.textareaBorderWidth, t.textareaBorderColor,
-    t.textareaBorderTopColor,
-    t.textareaShadow,
+      },
+      rootMedium: function rootMedium(t) {
+        return emotion.css(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", ";\n      "])),
+        (0, _Textarea.rootTextareaSizeMixin)(emotion)(t.textareaFontSizeMedium, t.textareaLineHeightMedium));
 
-    t.textareaColor,
+      },
+      rootLarge: function rootLarge(t) {
+        return emotion.css(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", ";\n      "])),
+        (0, _Textarea.rootTextareaSizeMixin)(emotion)(t.textareaFontSizeLarge, t.textareaLineHeightLarge));
 
+      },
 
+      textarea: function textarea(t) {
+        return emotion.css(_templateObject5 || (_templateObject5 = (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        outline: none;\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,
 
-    t.textareaWidth,
-    t.textareaMinHeight,
+        t.textareaColor,
 
-    t.textareaPaddingY, t.textareaPaddingX,
 
 
 
-    t.textareaBorderRadius,
+        t.textareaWidth,
 
+        t.transitionDuration, t.transitionTimingFunction,
 
 
-    t.textareaBorderColorFocus,
-    t.textareaOutlineWidth, t.textareaBorderColorFocus,
+        t.textareaBorderRadius,
 
 
 
+        t.textareaBorderColorFocus,
+        t.textareaOutlineWidth, t.textareaBorderColorFocus,
 
-    t.textareaPlaceholderColorLight,
 
 
 
+        t.textareaPlaceholderColorLight,
 
-    t.textareaPlaceholderColor,
 
 
 
-    t.textareaPlaceholderColor,
+        t.textareaPlaceholderColor,
 
 
 
-    t.textareaPlaceholderColor);
+        t.textareaPlaceholderColor,
 
 
-  },
 
-  error: function error(t) {
-    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (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,
+        t.textareaPlaceholderColor);
 
 
-    t.textareaBorderColorError,
-    t.textareaOutlineWidth, t.textareaBorderColorError);
+      },
+      textareaSmall: function textareaSmall(t) {
+        return emotion.css(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", ";\n      "])),
+        (0, _Textarea.textareaSizeMixin)(emotion)(t.textareaPaddingYSmall, t.textareaPaddingXSmall, t.textareaMinHeightSmall));
 
+      },
+      textareaMedium: function textareaMedium(t) {
+        return emotion.css(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", ";\n      "])),
+        (0, _Textarea.textareaSizeMixin)(emotion)(t.textareaPaddingYMedium, t.textareaPaddingXMedium, t.textareaMinHeightMedium));
 
-  },
+      },
+      textareaLarge: function textareaLarge(t) {
+        return emotion.css(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", ";\n      "])),
+        (0, _Textarea.textareaSizeMixin)(emotion)(t.textareaPaddingYLarge, t.textareaPaddingXLarge, t.textareaMinHeightLarge));
 
-  warning: function warning(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.textareaBorderColorWarning,
-    t.textareaOutlineWidth, t.textareaBorderColorWarning,
+      },
 
+      hovering: function hovering(t) {
+        return emotion.css(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n        &:enabled:hover:not(:focus) {\n          border-color: ", ";\n        }\n      "])),
 
-    t.textareaBorderColorWarning,
-    t.textareaOutlineWidth, t.textareaBorderColorWarning);
+        t.textareaBorderColorHover);
 
 
-  },
+      },
 
-  disabled: function disabled(t) {
-    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (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,
+      error: function error(t) {
+        return emotion.css(_templateObject10 || (_templateObject10 = (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,
 
 
+        t.textareaBorderColorError,
+        t.textareaOutlineWidth, t.textareaBorderColorError);
 
-    t.textareaPlaceholderColorDisabled);
 
+      },
 
-  },
+      warning: function warning(t) {
+        return emotion.css(_templateObject11 || (_templateObject11 = (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,
 
-  fake: function fake() {
-    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      height: 0;\n      left: 0;\n      position: absolute;\n      top: 0;\n      visibility: hidden;\n      width: 100%;\n    "])));
 
+        t.textareaBorderColorWarning,
+        t.textareaOutlineWidth, t.textareaBorderColorWarning);
 
 
+      },
 
+      disabled: function disabled(t) {
+        return emotion.css(_templateObject12 || (_templateObject12 = (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);
 
-  placeholder: function placeholder() {
-    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (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    "])));
 
+      },
 
+      fake: function fake() {
+        return emotion.css(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n        height: 0;\n        left: 0;\n        position: absolute;\n        top: 0;\n        visibility: hidden;\n        width: 100%;\n      "])));
 
 
 
@@ -119,46 +145,72 @@ var styles = (0, _Emotion.memoizeStyle)({
 
 
 
+      },
 
-  },
+      placeholder: function placeholder() {
+        return emotion.css(_templateObject14 || (_templateObject14 = (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      "])));
 
-  counterContainer: function counterContainer(t) {
-    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: absolute;\n      top: 0;\n      border: ", " solid transparent;\n      box-sizing: content-box;\n    "])),
 
 
-    t.textareaBorderWidth);
 
 
-  },
 
-  counter: function counter(t) {
-    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (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    "])),
 
 
 
-    t.textareaCounterBg,
-    t.textareaCounterColor,
 
-    t.textareaPaddingX,
-    t.textareaPaddingY);
+      },
 
-  },
+      counterContainer: function counterContainer(t) {
+        return emotion.css(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n        position: absolute;\n        top: 0;\n        border: ", " solid transparent;\n        box-sizing: content-box;\n      "])),
 
-  counterError: function counterError(t) {
-    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n    "])),
-    t.textareaCounterErrorColor);
 
-  },
+        t.textareaBorderWidth);
 
-  counterHelp: function counterHelp() {
-    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-left: 4px;\n      cursor: pointer;\n    "])));
 
+      },
 
+      counter: function counter(t) {
+        return emotion.css(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n        position: absolute;\n        z-index: 3;\n        text-align: right;\n        background: ", ";\n        color: ", ";\n        border-radius: 2px;\n      "])),
 
-  },
 
-  disableAnimations: function disableAnimations() {
-    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      transition: none;\n    "])));
 
+        t.textareaCounterBg,
+        t.textareaCounterColor);
 
-  } });exports.styles = styles;
+
+      },
+      counterSmall: function counterSmall(t) {
+        return emotion.css(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", ";\n      "])),
+        (0, _Textarea.counterSizeMixin)(emotion)(t.textareaPaddingYSmall, t.textareaPaddingXSmall));
+
+      },
+      counterMedium: function counterMedium(t) {
+        return emotion.css(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", ";\n      "])),
+        (0, _Textarea.counterSizeMixin)(emotion)(t.textareaPaddingYMedium, t.textareaPaddingXMedium));
+
+      },
+      counterLarge: function counterLarge(t) {
+        return emotion.css(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", ";\n      "])),
+        (0, _Textarea.counterSizeMixin)(emotion)(t.textareaPaddingYLarge, t.textareaPaddingXLarge));
+
+      },
+
+      counterError: function counterError(t) {
+        return emotion.css(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteralLoose2.default)(["\n        color: ", ";\n      "])),
+        t.textareaCounterErrorColor);
+
+      },
+
+      counterHelp: function counterHelp() {
+        return emotion.css(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteralLoose2.default)(["\n        margin-left: 4px;\n        cursor: pointer;\n      "])));
+
+
+
+      },
+
+      disableAnimations: function disableAnimations() {
+        return emotion.css(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteralLoose2.default)(["\n        transition: none;\n      "])));
+
+
+      } }));};exports.getStyles = getStyles;

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","textareaPlaceholderColor","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;;;AAGgBD,IAAAA,CAAC,CAACK,UAHlB;AAIYL,IAAAA,CAAC,CAACM,mBAJd,EAI2CN,CAAC,CAACO,mBAJ7C;AAKsBP,IAAAA,CAAC,CAACQ,sBALxB;AAMgBR,IAAAA,CAAC,CAACS,cANlB;;AAQWT,IAAAA,CAAC,CAACU,aARb;;;;;AAaeV,IAAAA,CAAC,CAACW,aAbjB;AAcgBX,IAAAA,CAAC,CAACY,iBAdlB;;AAgBaZ,IAAAA,CAAC,CAACa,gBAhBf,EAgBmCb,CAAC,CAACc,gBAhBrC;;;;AAoBmBd,IAAAA,CAAC,CAACe,oBApBrB;;;;AAwBoBf,IAAAA,CAAC,CAACgB,wBAxBtB;AAyBwBhB,IAAAA,CAAC,CAACiB,oBAzB1B,EAyBkDjB,CAAC,CAACgB,wBAzBpD;;;;;AA8BehB,IAAAA,CAAC,CAACkB,6BA9BjB;;;;;AAmCalB,IAAAA,CAAC,CAACmB,wBAnCf;;;;AAuCanB,IAAAA,CAAC,CAACmB,wBAvCf;;;;AA2CanB,IAAAA,CAAC,CAACmB,wBA3Cf;;;AA8CD,GAzDgC;;AA2DjCC,EAAAA,KA3DiC,iBA2D3BpB,CA3D2B,EA2DjB;AACd,eAAOC,YAAP;AACkBD,IAAAA,CAAC,CAACqB,wBADpB;AAEsBrB,IAAAA,CAAC,CAACM,mBAFxB,EAE+CN,CAAC,CAACqB,wBAFjD;;;AAKoBrB,IAAAA,CAAC,CAACqB,wBALtB;AAMwBrB,IAAAA,CAAC,CAACiB,oBAN1B,EAMkDjB,CAAC,CAACqB,wBANpD;;;AASD,GArEgC;;AAuEjCC,EAAAA,OAvEiC,mBAuEzBtB,CAvEyB,EAuEf;AAChB,eAAOC,YAAP;AACkBD,IAAAA,CAAC,CAACuB,0BADpB;AAEsBvB,IAAAA,CAAC,CAACiB,oBAFxB,EAEgDjB,CAAC,CAACuB,0BAFlD;;;AAKoBvB,IAAAA,CAAC,CAACuB,0BALtB;AAMwBvB,IAAAA,CAAC,CAACiB,oBAN1B,EAMkDjB,CAAC,CAACuB,0BANpD;;;AASD,GAjFgC;;AAmFjCC,EAAAA,QAnFiC,oBAmFxBxB,CAnFwB,EAmFd;AACjB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACyB,yBADb;AAEgBzB,IAAAA,CAAC,CAAC0B,kBAFlB;AAGkB1B,IAAAA,CAAC,CAAC2B,2BAHpB;;;;AAOa3B,IAAAA,CAAC,CAAC4B,gCAPf;;;AAUD,GA9FgC;;AAgGjCC,EAAAA,IAhGiC,kBAgG1B;AACL,eAAO5B,YAAP;;;;;;;;AAQD,GAzGgC;;AA2GjC6B,EAAAA,WA3GiC,yBA2GnB;AACZ,eAAO7B,YAAP;;;;;;;;;;;AAWD,GAvHgC;;AAyHjC8B,EAAAA,gBAzHiC,4BAyHhB/B,CAzHgB,EAyHN;AACzB,eAAOC,YAAP;;;AAGYD,IAAAA,CAAC,CAACM,mBAHd;;;AAMD,GAhIgC;;AAkIjC0B,EAAAA,OAlIiC,mBAkIzBhC,CAlIyB,EAkIf;AAChB,eAAOC,YAAP;;;;AAIgBD,IAAAA,CAAC,CAACiC,iBAJlB;AAKWjC,IAAAA,CAAC,CAACkC,oBALb;;AAOWlC,IAAAA,CAAC,CAACc,gBAPb;AAQYd,IAAAA,CAAC,CAACa,gBARd;;AAUD,GA7IgC;;AA+IjCsB,EAAAA,YA/IiC,wBA+IpBnC,CA/IoB,EA+IV;AACrB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACoC,yBADb;;AAGD,GAnJgC;;AAqJjCC,EAAAA,WArJiC,yBAqJnB;AACZ,eAAOpC,YAAP;;;;AAID,GA1JgC;;AA4JjCqC,EAAAA,iBA5JiC,+BA4Jb;AAClB,eAAOrC,YAAP;;;AAGD,GAhKgC,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-clip: padding-box;\n      background: ${t.textareaBg};\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: 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  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"]}
+{"version":3,"sources":["Textarea.styles.ts"],"names":["getStyles","emotion","root","css","rootSmall","t","textareaFontSizeSmall","textareaLineHeightSmall","rootMedium","textareaFontSizeMedium","textareaLineHeightMedium","rootLarge","textareaFontSizeLarge","textareaLineHeightLarge","textarea","textareaBg","textareaBackgroundClip","textareaBorderWidth","textareaBorderColor","textareaBorderTopColor","textareaShadow","textareaColor","textareaWidth","transitionDuration","transitionTimingFunction","textareaBorderRadius","textareaBorderColorFocus","textareaOutlineWidth","textareaPlaceholderColorLight","textareaPlaceholderColor","textareaSmall","textareaPaddingYSmall","textareaPaddingXSmall","textareaMinHeightSmall","textareaMedium","textareaPaddingYMedium","textareaPaddingXMedium","textareaMinHeightMedium","textareaLarge","textareaPaddingYLarge","textareaPaddingXLarge","textareaMinHeightLarge","hovering","textareaBorderColorHover","error","textareaBorderColorError","warning","textareaBorderColorWarning","disabled","textareaTextColorDisabled","textareaDisabledBg","textareaDisabledBorderColor","textareaPlaceholderColorDisabled","fake","placeholder","counterContainer","counter","textareaCounterBg","textareaCounterColor","counterSmall","counterMedium","counterLarge","counterError","textareaCounterErrorColor","counterHelp","disableAnimations"],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nimport { counterSizeMixin, rootTextareaSizeMixin, textareaSizeMixin } from './Textarea.mixins';\n\nexport const getStyles = (emotion: Emotion) =>\n  memoizeStyle({\n    root() {\n      return emotion.css`\n        display: inline-block;\n        position: relative;\n      `;\n    },\n    rootSmall(t: Theme) {\n      return emotion.css`\n        ${rootTextareaSizeMixin(emotion)(t.textareaFontSizeSmall, t.textareaLineHeightSmall)};\n      `;\n    },\n    rootMedium(t: Theme) {\n      return emotion.css`\n        ${rootTextareaSizeMixin(emotion)(t.textareaFontSizeMedium, t.textareaLineHeightMedium)};\n      `;\n    },\n    rootLarge(t: Theme) {\n      return emotion.css`\n        ${rootTextareaSizeMixin(emotion)(t.textareaFontSizeLarge, t.textareaLineHeightLarge)};\n      `;\n    },\n\n    textarea(t: Theme) {\n      return emotion.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        outline: none;\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    textareaSmall(t: Theme) {\n      return emotion.css`\n        ${textareaSizeMixin(emotion)(t.textareaPaddingYSmall, t.textareaPaddingXSmall, t.textareaMinHeightSmall)};\n      `;\n    },\n    textareaMedium(t: Theme) {\n      return emotion.css`\n        ${textareaSizeMixin(emotion)(t.textareaPaddingYMedium, t.textareaPaddingXMedium, t.textareaMinHeightMedium)};\n      `;\n    },\n    textareaLarge(t: Theme) {\n      return emotion.css`\n        ${textareaSizeMixin(emotion)(t.textareaPaddingYLarge, t.textareaPaddingXLarge, t.textareaMinHeightLarge)};\n      `;\n    },\n\n    hovering(t: Theme) {\n      return emotion.css`\n        &:enabled:hover:not(:focus) {\n          border-color: ${t.textareaBorderColorHover};\n        }\n      `;\n    },\n\n    error(t: Theme) {\n      return emotion.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 emotion.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 emotion.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 emotion.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 emotion.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 emotion.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 emotion.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      `;\n    },\n    counterSmall(t: Theme) {\n      return emotion.css`\n        ${counterSizeMixin(emotion)(t.textareaPaddingYSmall, t.textareaPaddingXSmall)};\n      `;\n    },\n    counterMedium(t: Theme) {\n      return emotion.css`\n        ${counterSizeMixin(emotion)(t.textareaPaddingYMedium, t.textareaPaddingXMedium)};\n      `;\n    },\n    counterLarge(t: Theme) {\n      return emotion.css`\n        ${counterSizeMixin(emotion)(t.textareaPaddingYLarge, t.textareaPaddingXLarge)};\n      `;\n    },\n\n    counterError(t: Theme) {\n      return emotion.css`\n        color: ${t.textareaCounterErrorColor};\n      `;\n    },\n\n    counterHelp() {\n      return emotion.css`\n        margin-left: 4px;\n        cursor: pointer;\n      `;\n    },\n\n    disableAnimations() {\n      return emotion.css`\n        transition: none;\n      `;\n    },\n  });\n"]}

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

@@ -1,12 +1,14 @@
+import { SizeProp } from '../../lib/types/props';
 import { TextareaProps } from './Textarea';
-export declare type TextareaCounterProps = {
+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>;
+export declare const TextareaCounter: import("../../lib/forwardRefAndName").ReactUIComponentWithRef<TextareaCounterRef, TextareaCounterProps> & Record<never, never>;

package/cjs/components/Textarea/TextareaCounter.js

@@ -1,15 +1,21 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.TextareaCounter = void 0;var _react = _interopRequireWildcard(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.TextareaCounter = void 0;var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
+var _globalObject = require("@skbkontur/global-object");
 
+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 _useTheme = require("../../lib/theming/useTheme");
 
 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;}
+var _Textarea2 = require("./Textarea.styles");
+
 
 
 
@@ -27,8 +33,10 @@ var handleHelpMouseDown = function handleHelpMouseDown(e) {return e.preventDefau
 
 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);
+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 = (0, _useTheme.useTheme)();
+  var emotion = (0, _Emotion.useEmotion)();
+
   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 () {
@@ -40,23 +48,50 @@ function (_ref, ref) {var _cx;var length = _ref.length,value = _ref.value,help =
   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);
 
 
+  var styles = (0, _Textarea2.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.default.createElement("div", { "data-tid": _Textarea.TextareaDataTids.counter, className: _Textarea2.styles.counterContainer(theme), style: { width: width, height: height } }, /*#__PURE__*/
+    _react.default.createElement("div", {
+      "data-tid": _Textarea.TextareaDataTids.counter,
+      className: emotion.cx(styles.counterContainer(theme)),
+      style: { width: width, height: height } }, /*#__PURE__*/
+
     _react.default.createElement("span", {
-      className: (0, _Emotion.cx)(_Textarea2.styles.counter(theme), (_cx = {}, _cx[
-      _Textarea2.styles.counterError(theme)] = counterValue < 0, _cx)) },
+      className: emotion.cx(getCounterSizeClassName(), styles.counter(theme), (_emotion$cx = {}, _emotion$cx[
+      styles.counterError(theme)] = counterValue < 0, _emotion$cx)) },
 
 
     counterValue,
-    help && /*#__PURE__*/_react.default.createElement("span", { className: _Textarea2.styles.counterHelp() }, counterHelp))));
+    help && /*#__PURE__*/_react.default.createElement("span", { className: styles.counterHelp() }, counterHelp))));
 
 
 
@@ -65,7 +100,7 @@ function (_ref, ref) {var _cx;var length = _ref.length,value = _ref.value,help =
 
 TextareaCounter.propTypes = {
   length: _propTypes.default.number.isRequired,
-  value: _propTypes.default.oneOf([_propTypes.default.string, _propTypes.default.number]),
-  help: _propTypes.default.oneOf([_propTypes.default.node, _propTypes.default.func]),
+  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: _propTypes.default.node.isRequired };
+  textarea: (0, _SSRSafe.safePropTypesInstanceOf)(_globalObject.globalObject.HTMLElement).isRequired };

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

@@ -1 +1 @@
-{"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","counterHelp","textareaCounterHelpIconColor","TextareaDataTids","counter","styles","counterContainer","counterError","propTypes","number","isRequired","oneOf","string","node","func"],"mappings":"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","sourcesContent":["import React, { SyntheticEvent, useContext, useCallback, useImperativeHandle, useState } from 'react';\nimport propTypes from 'prop-types';\n\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';\n\nimport { TextareaDataTids, TextareaProps } from './Textarea';\nimport { styles } from './Textarea.styles';\n\nexport type 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    const counterHelp = isFunction(help) ? (\n      help()\n    ) : (\n      <Tooltip pos={'right bottom'} trigger={'click'} render={renderTooltipContent} onCloseClick={onCloseHelp}>\n        <HelpDotIcon onMouseDown={handleHelpMouseDown} color={theme.textareaCounterHelpIconColor} />\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.oneOf([propTypes.string, propTypes.number]),\n  help: propTypes.oneOf([propTypes.node, propTypes.func]),\n  onCloseHelp: propTypes.func.isRequired,\n  textarea: propTypes.node.isRequired,\n};\n"]}
+{"version":3,"sources":["TextareaCounter.tsx"],"names":["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","TextareaDataTids","helpIcon","counterHelp","styles","getCounterSizeClassName","counterLarge","counterMedium","counterSmall","counter","cx","counterContainer","counterError","propTypes","number","isRequired","oneOfType","string","node","func","globalObject","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/cjs/components/Textarea/TextareaHelpers.d.ts

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

package/cjs/components/Textarea/TextareaHelpers.js

@@ -1,6 +1,11 @@
-"use strict";exports.__esModule = true;exports.getTextAreaHeight = getTextAreaHeight;function getTextAreaHeight(params) {
+"use strict";exports.__esModule = true;exports.getTextAreaHeight = getTextAreaHeight;var _globalObject = require("@skbkontur/global-object");
+
+function getTextAreaHeight(params) {
+  if (!(0, _globalObject.isBrowser)(_globalObject.globalObject)) {
+    return null;
+  }
   var node = params.node,minRows = params.minRows,maxRows = params.maxRows,extraRow = params.extraRow;
-  var style = getComputedStyle(node);
+  var style = _globalObject.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;

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;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,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) {\n  const { node, minRows, maxRows, extraRow } = params;\n  const style: CSSStyleDeclaration = 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"]}
+{"version":3,"sources":["TextareaHelpers.tsx"],"names":["getTextAreaHeight","params","globalObject","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":"qFAAA;;AAEO,SAASA,iBAAT,CAA2BC,MAA3B,EAA4D;AACjE,MAAI,CAAC,6BAAUC,0BAAV,CAAL,EAA8B;AAC5B,WAAO,IAAP;AACD;AACD,MAAQC,IAAR,GAA6CF,MAA7C,CAAQE,IAAR,CAAcC,OAAd,GAA6CH,MAA7C,CAAcG,OAAd,CAAuBC,OAAvB,GAA6CJ,MAA7C,CAAuBI,OAAvB,CAAgCC,QAAhC,GAA6CL,MAA7C,CAAgCK,QAAhC;AACA,MAAMC,KAAK,GAAGL,2BAAaM,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/cjs/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/cjs/components/Textarea/TextareaWithSafari17Workaround.js

@@ -0,0 +1,20 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.TextareaWithSafari17Workaround = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react = _interopRequireDefault(require("react"));
+
+var _forwardRefAndName = require("../../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
+ */
+var TextareaWithSafari17Workaround = (0, _forwardRefAndName.forwardRefAndName)(
+
+
+'TextareaWithSafari17Workaround', function (props, ref) {
+  var _React$useState = _react.default.useState(true),firstRender = _React$useState[0],setFirstRender = _React$useState[1];
+
+  _react.default.useEffect(function () {
+    firstRender && setFirstRender(false);
+  }, []);
+
+  return /*#__PURE__*/_react.default.createElement("textarea", (0, _extends2.default)({}, props, { value: firstRender ? '' : props.value, ref: ref }));
+});exports.TextareaWithSafari17Workaround = TextareaWithSafari17Workaround;

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

@@ -0,0 +1 @@
+{"version":3,"sources":["TextareaWithSafari17Workaround.tsx"],"names":["TextareaWithSafari17Workaround","props","ref","React","useState","firstRender","setFirstRender","useEffect","value"],"mappings":"sQAAA;;AAEA;;AAEA;AACA;AACA;AACA;AACO,IAAMA,8BAA8B,GAAG;;;AAG5C,gCAH4C,EAGV,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAClD,wBAAsCC,eAAMC,QAAN,CAAe,IAAf,CAAtC,CAAOC,WAAP,sBAAoBC,cAApB;;AAEAH,iBAAMI,SAAN,CAAgB,YAAM;AACpBF,IAAAA,WAAW,IAAIC,cAAc,CAAC,KAAD,CAA7B;AACD,GAFD,EAEG,EAFH;;AAIA,sBAAO,oEAAcL,KAAd,IAAqB,KAAK,EAAEI,WAAW,GAAG,EAAH,GAAQJ,KAAK,CAACO,KAArD,EAA4D,GAAG,EAAEN,GAAjE,IAAP;AACD,CAX6C,CAAvC,C","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"]}