@skbkontur/react-ui 0.0.0-d4e280859d → 0.0.0-d99038a7ec

package/components/Hint/__creevey__/Hint.creevey.mts

@@ -0,0 +1,68 @@
+import { story, kind, test } from 'creevey';
+
+import { delay } from '../../../lib/delay';
+
+kind('Hint', () => {
+  story('SetManualAndOpenedPropOnClick', () => {
+    test('click on hint', async (context) => {
+      await context.webdriver
+        .actions()
+        .click(context.webdriver.findElement({ css: '#main' }))
+        .perform();
+      await delay(1000);
+      await context.matchImage(await context.webdriver.takeScreenshot(), 'click on hint');
+    });
+  });
+
+  story('WithSVGIcon', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: {
+        'internal logic being tested and not something UI related': {
+          in: [
+            'chromeDark',
+            'chrome8px',
+            'firefox8px',
+            'firefox',
+            'firefoxFlat8px',
+            'firefoxDark',
+            'ie118px',
+            'ie11',
+            'ie11Dark',
+          ],
+        },
+      },
+    });
+
+    test('idle', async (context) => {
+      await context.matchImage(await context.takeScreenshot(), 'idle');
+    });
+
+    test('hover', async (context) => {
+      await context.webdriver
+        .actions()
+        .move({
+          origin: context.webdriver.findElement({ css: '[data-tid="icon"]' }),
+        })
+        .perform();
+      await delay(1000);
+      await context.matchImage(await context.webdriver.takeScreenshot(), 'open');
+    });
+  });
+  story('top bottom center', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: { "themes don't affect logic": { in: /^(?!\bchrome2022\b)/ } },
+    });
+  });
+  story('HintNearScreenEdge', ({ setStoryParameters }) => {
+    setStoryParameters({
+      captureElement: 'body',
+      skip: { 'no themes': { in: /^(?!\b(chrome2022|firefox2022)\b)/ } },
+    });
+  });
+
+  story('HintWithoutPortal', () => {
+    test('opened', async (context) => {
+      await context.matchImage(await context.webdriver.takeScreenshot(), 'open');
+    });
+  });
+});

package/components/Input/Input.styles/Input.styles.js

@@ -1,83 +1,107 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26;
+var _templateObject;
+function _EMOTION_STRINGIFIED_CSS_ERROR__() {
+  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
+}
 import { css, keyframes, memoizeStyle } from "../../../lib/theming/Emotion";
 import { shift } from "../../../lib/styles/DimensionFunctions";
 import { resetText } from "../../../lib/styles/Mixins";
 export var styles = memoizeStyle({
   wrapper: function wrapper() {
-    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      align-items: center;\n      display: flex;\n      margin: 0;\n      min-width: 0;\n      overflow: hidden;\n      position: relative;\n      text-overflow: clip;\n      white-space: nowrap;\n      width: 100%;\n\n      &::before {\n        content: '\\A0';\n        display: inline-block;\n        width: 0;\n      }\n    "], ["\n      align-items: center;\n      display: flex;\n      margin: 0;\n      min-width: 0;\n      overflow: hidden;\n      position: relative;\n      text-overflow: clip;\n      white-space: nowrap;\n      width: 100%;\n\n      &::before {\n        content: '\\\\A0';\n        display: inline-block;\n        width: 0;\n      }\n    "])));
+    return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? {
+      name: "1mfoplr",
+      styles: "align-items:center;display:flex;margin:0;min-width:0;overflow:hidden;position:relative;text-overflow:clip;white-space:nowrap;width:100%;&::before{content:'\\A0';display:inline-block;width:0;}"
+    } : {
+      name: "9havev-wrapper",
+      styles: "align-items:center;display:flex;margin:0;min-width:0;overflow:hidden;position:relative;text-overflow:clip;white-space:nowrap;width:100%;&::before{content:'\\A0';display:inline-block;width:0;};label:wrapper;",
+      toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+    });
   },
   root: function root(t) {
-    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      ", ";\n\n      align-items: center;\n      background-clip: ", ";\n      background-color: ", ";\n      border: ", " solid ", ";\n      border-top-color: ", ";\n      transition: border-color ", " ", ";\n      box-shadow: ", ";\n      box-sizing: border-box;\n      color: ", ";\n      cursor: text;\n      display: inline-flex;\n      outline: none;\n      position: relative;\n      width: ", ";\n\n      & * {\n        box-sizing: border-box;\n      }\n    "])), resetText(), t.inputBackgroundClip, t.inputBg, t.inputBorderWidth, t.inputBorderColor, t.inputBorderTopColor, t.transitionDuration, t.transitionTimingFunction, t.inputShadow, t.inputColor, t.inputWidth);
+    return /*#__PURE__*/css(resetText(), ";align-items:center;background-clip:", t.inputBackgroundClip, ";background-color:", t.inputBg, ";border:", t.inputBorderWidth, " solid ", t.inputBorderColor, ";border-top-color:", t.inputBorderTopColor, ";transition:border-color ", t.transitionDuration, " ", t.transitionTimingFunction, ";box-shadow:", t.inputShadow, ";box-sizing:border-box;color:", t.inputColor, ";cursor:text;display:inline-flex;outline:none;position:relative;width:", t.inputWidth, ";& *{box-sizing:border-box;}" + (process.env.NODE_ENV === "production" ? "" : ";label:root;"));
   },
   hovering: function hovering(t) {
-    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      &:hover {\n        border-color: ", ";\n      }\n    "])), t.inputBorderColorHover);
+    return /*#__PURE__*/css("&:hover{border-color:", t.inputBorderColorHover, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:hovering;"));
   },
   borderless: function borderless() {
-    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      box-shadow: none;\n      border-color: transparent;\n      background-clip: padding-box;\n    "])));
+    return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? {
+      name: "109wacj",
+      styles: "box-shadow:none;border-color:transparent;background-clip:padding-box"
+    } : {
+      name: "g17v7j-borderless",
+      styles: "box-shadow:none;border-color:transparent;background-clip:padding-box;label:borderless;",
+      toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+    });
   },
   focus: function focus(t) {
-    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      background-color: ", ";\n      border-color: ", ";\n      box-shadow: ", ";\n      outline: none;\n      z-index: 2;\n    "])), t.inputFocusedBg, t.inputBorderColorFocus, t.inputFocusShadow);
+    return /*#__PURE__*/css("background-color:", t.inputFocusedBg, ";border-color:", t.inputBorderColorFocus, ";box-shadow:", t.inputFocusShadow, ";outline:none;z-index:2;" + (process.env.NODE_ENV === "production" ? "" : ";label:focus;"));
   },
   focusFallback: function focusFallback(t) {
-    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      box-shadow: none;\n      outline: ", " solid ", ";\n    "])), t.inputOutlineWidth, t.inputFocusOutline);
+    return /*#__PURE__*/css("box-shadow:none;outline:", t.inputOutlineWidth, " solid ", t.inputFocusOutline, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:focusFallback;"));
   },
   placeholder: function placeholder(t) {
-    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      -ms-user-select: none;\n      color: ", ";\n      cursor: text;\n      font-size: inherit;\n      height: 100%;\n      left: 0;\n      overflow: hidden;\n      pointer-events: none;\n      position: absolute;\n      top: 0;\n      user-select: none;\n      white-space: nowrap;\n      width: 100%;\n    "])), t.inputPlaceholderColor);
+    return /*#__PURE__*/css("-ms-user-select:none;color:", t.inputPlaceholderColor, ";cursor:text;font-size:inherit;height:100%;left:0;overflow:hidden;pointer-events:none;position:absolute;top:0;user-select:none;white-space:nowrap;width:100%;" + (process.env.NODE_ENV === "production" ? "" : ";label:placeholder;"));
   },
   placeholderFocus: function placeholderFocus(t) {
-    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputPlaceholderColorLight);
+    return /*#__PURE__*/css("color:", t.inputPlaceholderColorLight, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:placeholderFocus;"));
   },
   placeholderDisabled: function placeholderDisabled(t) {
-    return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputPlaceholderColorDisabled);
+    return /*#__PURE__*/css("color:", t.inputPlaceholderColorDisabled, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:placeholderDisabled;"));
   },
   input: function input(t) {
-    return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n      -webkit-appearance: none;\n      background: transparent;\n      border: 0 none;\n      color: ", ";\n      font: inherit;\n      line-height: inherit;\n      margin: 0;\n      outline: none;\n      padding: 0;\n      text-overflow: clip;\n      white-space: nowrap;\n      width: 100%;\n      color-scheme: ", ";\n\n      &:-moz-placeholder {\n        opacity: 1;\n      }\n      &::-moz-placeholder {\n        opacity: 1;\n      }\n      &::-ms-clear {\n        display: none;\n      }\n      &:-moz-placeholder {\n        color: ", ";\n      }\n      &::-moz-placeholder {\n        color: ", ";\n      }\n      &::placeholder {\n        color: ", ";\n      }\n    "])), t.inputTextColor, t.inputColorScheme, t.inputPlaceholderColor, t.inputPlaceholderColor, t.inputPlaceholderColor);
+    return /*#__PURE__*/css("-webkit-appearance:none;background:transparent;border:0 none;color:", t.inputTextColor, ";font:inherit;line-height:inherit;margin:0;outline:none;padding:0;text-overflow:clip;white-space:nowrap;width:100%;color-scheme:", t.inputColorScheme, ";&:-moz-placeholder{opacity:1;}&::-moz-placeholder{opacity:1;}&::-ms-clear{display:none;}&:-moz-placeholder{color:", t.inputPlaceholderColor, ";}&::-moz-placeholder{color:", t.inputPlaceholderColor, ";}&::placeholder{color:", t.inputPlaceholderColor, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:input;"));
   },
   inputFocus: function inputFocus(t) {
-    return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n      &:-moz-placeholder {\n        color: ", ";\n      }\n      &::-moz-placeholder {\n        color: ", ";\n      }\n      &::placeholder {\n        color: ", ";\n      }\n    "])), t.inputPlaceholderColorLight, t.inputPlaceholderColorLight, t.inputPlaceholderColorLight);
+    return /*#__PURE__*/css("&:-moz-placeholder{color:", t.inputPlaceholderColorLight, ";}&::-moz-placeholder{color:", t.inputPlaceholderColorLight, ";}&::placeholder{color:", t.inputPlaceholderColorLight, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:inputFocus;"));
   },
   inputDisabled: function inputDisabled(t) {
-    return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n      /* fix text color in safari https://bugs.webkit.org/show_bug.cgi?id=115510 */\n      -webkit-text-fill-color: ", ";\n\n      &:-moz-placeholder {\n        -webkit-text-fill-color: ", ";\n      }\n      &::-moz-placeholder {\n        -webkit-text-fill-color: ", ";\n      }\n      &::placeholder {\n        -webkit-text-fill-color: ", ";\n      }\n    "])), t.inputTextColorDisabled, t.inputTextColorDisabled, t.inputPlaceholderColorDisabled, t.inputPlaceholderColorDisabled, t.inputPlaceholderColorDisabled);
+    return /*#__PURE__*/css("color:", t.inputTextColorDisabled, ";-webkit-text-fill-color:", t.inputTextColorDisabled, ";&:-moz-placeholder{-webkit-text-fill-color:", t.inputPlaceholderColorDisabled, ";}&::-moz-placeholder{-webkit-text-fill-color:", t.inputPlaceholderColorDisabled, ";}&::placeholder{-webkit-text-fill-color:", t.inputPlaceholderColorDisabled, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:inputDisabled;"));
   },
   warning: function warning(t) {
-    return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n      border-color: ", ";\n      box-shadow: 0 0 0 ", " ", ";\n      z-index: 2;\n    "])), t.inputBorderColorWarning, t.inputOutlineWidth, t.inputBorderColorWarning);
+    return /*#__PURE__*/css("border-color:", t.inputBorderColorWarning, ";box-shadow:0 0 0 ", t.inputOutlineWidth, " ", t.inputBorderColorWarning, ";z-index:2;" + (process.env.NODE_ENV === "production" ? "" : ";label:warning;"));
   },
   warningFallback: function warningFallback(t) {
-    return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n      box-shadow: none;\n      outline: ", " solid ", ";\n    "])), t.inputBorderWidth, t.inputBorderColorWarning);
+    return /*#__PURE__*/css("box-shadow:none;outline:", t.inputBorderWidth, " solid ", t.inputBorderColorWarning, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:warningFallback;"));
   },
   error: function error(t) {
-    return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n      border-color: ", ";\n      box-shadow: 0 0 0 ", " ", ";\n      z-index: 2;\n    "])), t.inputBorderColorError, t.inputOutlineWidth, t.inputBorderColorError);
+    return /*#__PURE__*/css("border-color:", t.inputBorderColorError, ";box-shadow:0 0 0 ", t.inputOutlineWidth, " ", t.inputBorderColorError, ";z-index:2;" + (process.env.NODE_ENV === "production" ? "" : ";label:error;"));
   },
   errorFallback: function errorFallback(t) {
-    return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n      box-shadow: none;\n      outline: ", " solid ", ";\n    "])), t.inputBorderWidth, t.inputBorderColorError);
+    return /*#__PURE__*/css("box-shadow:none;outline:", t.inputBorderWidth, " solid ", t.inputBorderColorError, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:errorFallback;"));
   },
   disabled: function disabled(t) {
-    return css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteralLoose(["\n      background-color: ", ";\n      border-color: ", ";\n      box-shadow: none;\n    "])), t.inputDisabledBg, t.inputDisabledBorderColor);
+    return /*#__PURE__*/css("background-color:", t.inputDisabledBg, ";border-color:", t.inputDisabledBorderColor, ";box-shadow:none;" + (process.env.NODE_ENV === "production" ? "" : ";label:disabled;"));
   },
   blink: function blink(t) {
-    var blinkAnimation = keyframes(_templateObject18 || (_templateObject18 = _taggedTemplateLiteralLoose(["\n    0% {\n      background-color: ", ";\n    }\n  "])), t.inputBlinkColor);
-    return css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteralLoose(["\n      animation: ", " 0.15s ease-in;\n    "])), blinkAnimation);
+    var blinkAnimation = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n    0% {\n      background-color: ", ";\n    }\n  "])), t.inputBlinkColor);
+    return /*#__PURE__*/css("animation:", blinkAnimation, " 0.15s ease-in;" + (process.env.NODE_ENV === "production" ? "" : ";label:blink;"));
   },
   sizeSmall: function sizeSmall(t) {
-    return css(_templateObject20 || (_templateObject20 = _taggedTemplateLiteralLoose(["\n      font-size: ", ";\n      line-height: ", ";\n      padding-top: ", ";\n      padding-bottom: ", ";\n      padding-left: ", ";\n      padding-right: ", ";\n      height: ", ";\n      border-radius: ", ";\n    "])), t.inputFontSizeSmall, t.inputLineHeightSmall, t.inputPaddingYSmall, t.inputPaddingYSmall, t.inputPaddingXSmall, t.inputPaddingXSmall, t.inputHeightSmall, t.inputBorderRadiusSmall);
+    return /*#__PURE__*/css("font-size:", t.inputFontSizeSmall, ";line-height:", t.inputLineHeightSmall, ";padding-top:", t.inputPaddingYSmall, ";padding-bottom:", t.inputPaddingYSmall, ";padding-left:", t.inputPaddingXSmall, ";padding-right:", t.inputPaddingXSmall, ";height:", t.inputHeightSmall, ";border-radius:", t.inputBorderRadiusSmall, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:sizeSmall;"));
   },
   sizeSmallFallback: function sizeSmallFallback(t) {
-    return css(_templateObject21 || (_templateObject21 = _taggedTemplateLiteralLoose(["\n      padding-top: ", ";\n      padding-bottom: ", ";\n      padding-left: ", ";\n      padding-right: ", ";\n      line-height: normal;\n    "])), shift(t.inputPaddingYSmall, '0'), shift(t.inputPaddingYSmall, '0'), t.inputPaddingXSmall, t.inputPaddingXSmall);
+    return /*#__PURE__*/css("padding-top:", shift(t.inputPaddingYSmall, '0'), ";padding-bottom:", shift(t.inputPaddingYSmall, '0'), ";padding-left:", t.inputPaddingXSmall, ";padding-right:", t.inputPaddingXSmall, ";line-height:normal;" + (process.env.NODE_ENV === "production" ? "" : ";label:sizeSmallFallback;"));
   },
   sizeMedium: function sizeMedium(t) {
-    return css(_templateObject22 || (_templateObject22 = _taggedTemplateLiteralLoose(["\n      font-size: ", ";\n      line-height: ", ";\n      padding-top: ", ";\n      padding-bottom: ", ";\n      padding-left: ", ";\n      padding-right: ", ";\n      height: ", ";\n      border-radius: ", ";\n    "])), t.inputFontSizeMedium, t.inputLineHeightMedium, t.inputPaddingYMedium, t.inputPaddingYMedium, t.inputPaddingXMedium, t.inputPaddingXMedium, t.inputHeightMedium, t.inputBorderRadiusMedium);
+    return /*#__PURE__*/css("font-size:", t.inputFontSizeMedium, ";line-height:", t.inputLineHeightMedium, ";padding-top:", t.inputPaddingYMedium, ";padding-bottom:", t.inputPaddingYMedium, ";padding-left:", t.inputPaddingXMedium, ";padding-right:", t.inputPaddingXMedium, ";height:", t.inputHeightMedium, ";border-radius:", t.inputBorderRadiusMedium, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:sizeMedium;"));
   },
   sizeMediumFallback: function sizeMediumFallback(t) {
-    return css(_templateObject23 || (_templateObject23 = _taggedTemplateLiteralLoose(["\n      padding-top: ", ";\n      padding-bottom: ", ";\n      padding-left: ", ";\n      padding-right: ", ";\n      line-height: normal;\n    "])), shift(t.inputPaddingYMedium, '0'), shift(t.inputPaddingYMedium, '0'), t.inputPaddingXMedium, t.inputPaddingXMedium);
+    return /*#__PURE__*/css("padding-top:", shift(t.inputPaddingYMedium, '0'), ";padding-bottom:", shift(t.inputPaddingYMedium, '0'), ";padding-left:", t.inputPaddingXMedium, ";padding-right:", t.inputPaddingXMedium, ";line-height:normal;" + (process.env.NODE_ENV === "production" ? "" : ";label:sizeMediumFallback;"));
   },
   sizeLarge: function sizeLarge(t) {
-    return css(_templateObject24 || (_templateObject24 = _taggedTemplateLiteralLoose(["\n      font-size: ", ";\n      line-height: ", ";\n      height: ", ";\n      padding-top: ", ";\n      padding-bottom: ", ";\n      padding-left: ", ";\n      padding-right: ", ";\n      border-radius: ", ";\n    "])), t.inputFontSizeLarge, t.inputLineHeightLarge, t.inputHeightLarge, shift(t.inputPaddingYLarge, '0'), shift(t.inputPaddingYLarge, '0'), t.inputPaddingXLarge, t.inputPaddingXLarge, t.inputBorderRadiusLarge);
+    return /*#__PURE__*/css("font-size:", t.inputFontSizeLarge, ";line-height:", t.inputLineHeightLarge, ";height:", t.inputHeightLarge, ";padding-top:", shift(t.inputPaddingYLarge, '0'), ";padding-bottom:", shift(t.inputPaddingYLarge, '0'), ";padding-left:", t.inputPaddingXLarge, ";padding-right:", t.inputPaddingXLarge, ";border-radius:", t.inputBorderRadiusLarge, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:sizeLarge;"));
   },
   sizeLargeFallback: function sizeLargeFallback(t) {
-    return css(_templateObject25 || (_templateObject25 = _taggedTemplateLiteralLoose(["\n      padding-top: ", ";\n      padding-bottom: ", ";\n      padding-left: ", ";\n      padding-right: ", ";\n      line-height: normal;\n    "])), shift(t.inputPaddingYLarge, '0'), shift(t.inputPaddingYLarge, '0'), t.inputPaddingXLarge, t.inputPaddingXLarge);
+    return /*#__PURE__*/css("padding-top:", shift(t.inputPaddingYLarge, '0'), ";padding-bottom:", shift(t.inputPaddingYLarge, '0'), ";padding-left:", t.inputPaddingXLarge, ";padding-right:", t.inputPaddingXLarge, ";line-height:normal;" + (process.env.NODE_ENV === "production" ? "" : ";label:sizeLargeFallback;"));
   },
   hideBlinkingCursor: function hideBlinkingCursor() {
-    return css(_templateObject26 || (_templateObject26 = _taggedTemplateLiteralLoose(["\n      caret-color: transparent;\n    "])));
+    return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? {
+      name: "xep7y6",
+      styles: "caret-color:transparent"
+    } : {
+      name: "16zl1j7-hideBlinkingCursor",
+      styles: "caret-color:transparent;label:hideBlinkingCursor;",
+      toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+    });
   }
 });

package/components/Input/Input.styles/Input.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["css","keyframes","memoizeStyle","shift","resetText","styles","wrapper","_templateObject","_taggedTemplateLiteralLoose","root","t","_templateObject2","inputBackgroundClip","inputBg","inputBorderWidth","inputBorderColor","inputBorderTopColor","transitionDuration","transitionTimingFunction","inputShadow","inputColor","inputWidth","hovering","_templateObject3","inputBorderColorHover","borderless","_templateObject4","focus","_templateObject5","inputFocusedBg","inputBorderColorFocus","inputFocusShadow","focusFallback","_templateObject6","inputOutlineWidth","inputFocusOutline","placeholder","_templateObject7","inputPlaceholderColor","placeholderFocus","_templateObject8","inputPlaceholderColorLight","placeholderDisabled","_templateObject9","inputPlaceholderColorDisabled","input","_templateObject10","inputTextColor","inputColorScheme","inputFocus","_templateObject11","inputDisabled","_templateObject12","inputTextColorDisabled","warning","_templateObject13","inputBorderColorWarning","warningFallback","_templateObject14","error","_templateObject15","inputBorderColorError","errorFallback","_templateObject16","disabled","_templateObject17","inputDisabledBg","inputDisabledBorderColor","blink","blinkAnimation","_templateObject18","inputBlinkColor","_templateObject19","sizeSmall","_templateObject20","inputFontSizeSmall","inputLineHeightSmall","inputPaddingYSmall","inputPaddingXSmall","inputHeightSmall","inputBorderRadiusSmall","sizeSmallFallback","_templateObject21","sizeMedium","_templateObject22","inputFontSizeMedium","inputLineHeightMedium","inputPaddingYMedium","inputPaddingXMedium","inputHeightMedium","inputBorderRadiusMedium","sizeMediumFallback","_templateObject23","sizeLarge","_templateObject24","inputFontSizeLarge","inputLineHeightLarge","inputHeightLarge","inputPaddingYLarge","inputPaddingXLarge","inputBorderRadiusLarge","sizeLargeFallback","_templateObject25","hideBlinkingCursor","_templateObject26"],"sources":["Input.styles.ts"],"sourcesContent":["import { css, keyframes, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { shift } from '../../lib/styles/DimensionFunctions';\nimport { resetText } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n  wrapper() {\n    return css`\n      align-items: center;\n      display: flex;\n      margin: 0;\n      min-width: 0;\n      overflow: hidden;\n      position: relative;\n      text-overflow: clip;\n      white-space: nowrap;\n      width: 100%;\n\n      &::before {\n        content: '\\\\A0';\n        display: inline-block;\n        width: 0;\n      }\n    `;\n  },\n\n  root(t: Theme) {\n    return css`\n      ${resetText()};\n\n      align-items: center;\n      background-clip: ${t.inputBackgroundClip};\n      background-color: ${t.inputBg};\n      border: ${t.inputBorderWidth} solid ${t.inputBorderColor};\n      border-top-color: ${t.inputBorderTopColor};\n      transition: border-color ${t.transitionDuration} ${t.transitionTimingFunction};\n      box-shadow: ${t.inputShadow};\n      box-sizing: border-box;\n      color: ${t.inputColor};\n      cursor: text;\n      display: inline-flex;\n      outline: none;\n      position: relative;\n      width: ${t.inputWidth};\n\n      & * {\n        box-sizing: border-box;\n      }\n    `;\n  },\n\n  hovering(t: Theme) {\n    return css`\n      &:hover {\n        border-color: ${t.inputBorderColorHover};\n      }\n    `;\n  },\n\n  borderless() {\n    return css`\n      box-shadow: none;\n      border-color: transparent;\n      background-clip: padding-box;\n    `;\n  },\n\n  focus(t: Theme) {\n    return css`\n      background-color: ${t.inputFocusedBg};\n      border-color: ${t.inputBorderColorFocus};\n      box-shadow: ${t.inputFocusShadow};\n      outline: none;\n      z-index: 2;\n    `;\n  },\n\n  focusFallback(t: Theme) {\n    return css`\n      box-shadow: none;\n      outline: ${t.inputOutlineWidth} solid ${t.inputFocusOutline};\n    `;\n  },\n\n  placeholder(t: Theme) {\n    return css`\n      -ms-user-select: none;\n      color: ${t.inputPlaceholderColor};\n      cursor: text;\n      font-size: inherit;\n      height: 100%;\n      left: 0;\n      overflow: hidden;\n      pointer-events: none;\n      position: absolute;\n      top: 0;\n      user-select: none;\n      white-space: nowrap;\n      width: 100%;\n    `;\n  },\n\n  placeholderFocus(t: Theme) {\n    return css`\n      color: ${t.inputPlaceholderColorLight};\n    `;\n  },\n\n  placeholderDisabled(t: Theme) {\n    return css`\n      color: ${t.inputPlaceholderColorDisabled};\n    `;\n  },\n\n  input(t: Theme) {\n    return css`\n      -webkit-appearance: none;\n      background: transparent;\n      border: 0 none;\n      color: ${t.inputTextColor};\n      font: inherit;\n      line-height: inherit;\n      margin: 0;\n      outline: none;\n      padding: 0;\n      text-overflow: clip;\n      white-space: nowrap;\n      width: 100%;\n      color-scheme: ${t.inputColorScheme};\n\n      &:-moz-placeholder {\n        opacity: 1;\n      }\n      &::-moz-placeholder {\n        opacity: 1;\n      }\n      &::-ms-clear {\n        display: none;\n      }\n      &:-moz-placeholder {\n        color: ${t.inputPlaceholderColor};\n      }\n      &::-moz-placeholder {\n        color: ${t.inputPlaceholderColor};\n      }\n      &::placeholder {\n        color: ${t.inputPlaceholderColor};\n      }\n    `;\n  },\n\n  inputFocus(t: Theme) {\n    return css`\n      &:-moz-placeholder {\n        color: ${t.inputPlaceholderColorLight};\n      }\n      &::-moz-placeholder {\n        color: ${t.inputPlaceholderColorLight};\n      }\n      &::placeholder {\n        color: ${t.inputPlaceholderColorLight};\n      }\n    `;\n  },\n\n  inputDisabled(t: Theme) {\n    return css`\n      color: ${t.inputTextColorDisabled};\n      /* fix text color in safari https://bugs.webkit.org/show_bug.cgi?id=115510 */\n      -webkit-text-fill-color: ${t.inputTextColorDisabled};\n\n      &:-moz-placeholder {\n        -webkit-text-fill-color: ${t.inputPlaceholderColorDisabled};\n      }\n      &::-moz-placeholder {\n        -webkit-text-fill-color: ${t.inputPlaceholderColorDisabled};\n      }\n      &::placeholder {\n        -webkit-text-fill-color: ${t.inputPlaceholderColorDisabled};\n      }\n    `;\n  },\n\n  warning(t: Theme) {\n    return css`\n      border-color: ${t.inputBorderColorWarning};\n      box-shadow: 0 0 0 ${t.inputOutlineWidth} ${t.inputBorderColorWarning};\n      z-index: 2;\n    `;\n  },\n\n  warningFallback(t: Theme) {\n    return css`\n      box-shadow: none;\n      outline: ${t.inputBorderWidth} solid ${t.inputBorderColorWarning};\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      border-color: ${t.inputBorderColorError};\n      box-shadow: 0 0 0 ${t.inputOutlineWidth} ${t.inputBorderColorError};\n      z-index: 2;\n    `;\n  },\n\n  errorFallback(t: Theme) {\n    return css`\n      box-shadow: none;\n      outline: ${t.inputBorderWidth} solid ${t.inputBorderColorError};\n    `;\n  },\n\n  disabled(t: Theme) {\n    return css`\n      background-color: ${t.inputDisabledBg};\n      border-color: ${t.inputDisabledBorderColor};\n      box-shadow: none;\n    `;\n  },\n\n  blink(t: Theme) {\n    const blinkAnimation = keyframes`\n    0% {\n      background-color: ${t.inputBlinkColor};\n    }\n  `;\n    return css`\n      animation: ${blinkAnimation} 0.15s ease-in;\n    `;\n  },\n\n  sizeSmall(t: Theme) {\n    return css`\n      font-size: ${t.inputFontSizeSmall};\n      line-height: ${t.inputLineHeightSmall};\n      padding-top: ${t.inputPaddingYSmall};\n      padding-bottom: ${t.inputPaddingYSmall};\n      padding-left: ${t.inputPaddingXSmall};\n      padding-right: ${t.inputPaddingXSmall};\n      height: ${t.inputHeightSmall};\n      border-radius: ${t.inputBorderRadiusSmall};\n    `;\n  },\n\n  sizeSmallFallback(t: Theme) {\n    return css`\n      padding-top: ${shift(t.inputPaddingYSmall, '0')};\n      padding-bottom: ${shift(t.inputPaddingYSmall, '0')};\n      padding-left: ${t.inputPaddingXSmall};\n      padding-right: ${t.inputPaddingXSmall};\n      line-height: normal;\n    `;\n  },\n\n  sizeMedium(t: Theme) {\n    return css`\n      font-size: ${t.inputFontSizeMedium};\n      line-height: ${t.inputLineHeightMedium};\n      padding-top: ${t.inputPaddingYMedium};\n      padding-bottom: ${t.inputPaddingYMedium};\n      padding-left: ${t.inputPaddingXMedium};\n      padding-right: ${t.inputPaddingXMedium};\n      height: ${t.inputHeightMedium};\n      border-radius: ${t.inputBorderRadiusMedium};\n    `;\n  },\n\n  sizeMediumFallback(t: Theme) {\n    return css`\n      padding-top: ${shift(t.inputPaddingYMedium, '0')};\n      padding-bottom: ${shift(t.inputPaddingYMedium, '0')};\n      padding-left: ${t.inputPaddingXMedium};\n      padding-right: ${t.inputPaddingXMedium};\n      line-height: normal;\n    `;\n  },\n\n  sizeLarge(t: Theme) {\n    return css`\n      font-size: ${t.inputFontSizeLarge};\n      line-height: ${t.inputLineHeightLarge};\n      height: ${t.inputHeightLarge};\n      padding-top: ${shift(t.inputPaddingYLarge, '0')};\n      padding-bottom: ${shift(t.inputPaddingYLarge, '0')};\n      padding-left: ${t.inputPaddingXLarge};\n      padding-right: ${t.inputPaddingXLarge};\n      border-radius: ${t.inputBorderRadiusLarge};\n    `;\n  },\n\n  sizeLargeFallback(t: Theme) {\n    return css`\n      padding-top: ${shift(t.inputPaddingYLarge, '0')};\n      padding-bottom: ${shift(t.inputPaddingYLarge, '0')};\n      padding-left: ${t.inputPaddingXLarge};\n      padding-right: ${t.inputPaddingXLarge};\n      line-height: normal;\n    `;\n  },\n\n  hideBlinkingCursor() {\n    return css`\n      caret-color: transparent;\n    `;\n  },\n});\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["css","keyframes","memoizeStyle","shift","resetText","styles","wrapper","process","env","NODE_ENV","name","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","root","t","inputBackgroundClip","inputBg","inputBorderWidth","inputBorderColor","inputBorderTopColor","transitionDuration","transitionTimingFunction","inputShadow","inputColor","inputWidth","hovering","inputBorderColorHover","borderless","focus","inputFocusedBg","inputBorderColorFocus","inputFocusShadow","focusFallback","inputOutlineWidth","inputFocusOutline","placeholder","inputPlaceholderColor","placeholderFocus","inputPlaceholderColorLight","placeholderDisabled","inputPlaceholderColorDisabled","input","inputTextColor","inputColorScheme","inputFocus","inputDisabled","inputTextColorDisabled","warning","inputBorderColorWarning","warningFallback","error","inputBorderColorError","errorFallback","disabled","inputDisabledBg","inputDisabledBorderColor","blink","blinkAnimation","_templateObject","_taggedTemplateLiteralLoose","inputBlinkColor","sizeSmall","inputFontSizeSmall","inputLineHeightSmall","inputPaddingYSmall","inputPaddingXSmall","inputHeightSmall","inputBorderRadiusSmall","sizeSmallFallback","sizeMedium","inputFontSizeMedium","inputLineHeightMedium","inputPaddingYMedium","inputPaddingXMedium","inputHeightMedium","inputBorderRadiusMedium","sizeMediumFallback","sizeLarge","inputFontSizeLarge","inputLineHeightLarge","inputHeightLarge","inputPaddingYLarge","inputPaddingXLarge","inputBorderRadiusLarge","sizeLargeFallback","hideBlinkingCursor"],"sources":["Input.styles.ts"],"sourcesContent":["import { css, keyframes, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { shift } from '../../lib/styles/DimensionFunctions';\nimport { resetText } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n  wrapper() {\n    return css`\n      align-items: center;\n      display: flex;\n      margin: 0;\n      min-width: 0;\n      overflow: hidden;\n      position: relative;\n      text-overflow: clip;\n      white-space: nowrap;\n      width: 100%;\n\n      &::before {\n        content: '\\\\A0';\n        display: inline-block;\n        width: 0;\n      }\n    `;\n  },\n\n  root(t: Theme) {\n    return css`\n      ${resetText()};\n\n      align-items: center;\n      background-clip: ${t.inputBackgroundClip};\n      background-color: ${t.inputBg};\n      border: ${t.inputBorderWidth} solid ${t.inputBorderColor};\n      border-top-color: ${t.inputBorderTopColor};\n      transition: border-color ${t.transitionDuration} ${t.transitionTimingFunction};\n      box-shadow: ${t.inputShadow};\n      box-sizing: border-box;\n      color: ${t.inputColor};\n      cursor: text;\n      display: inline-flex;\n      outline: none;\n      position: relative;\n      width: ${t.inputWidth};\n\n      & * {\n        box-sizing: border-box;\n      }\n    `;\n  },\n\n  hovering(t: Theme) {\n    return css`\n      &:hover {\n        border-color: ${t.inputBorderColorHover};\n      }\n    `;\n  },\n\n  borderless() {\n    return css`\n      box-shadow: none;\n      border-color: transparent;\n      background-clip: padding-box;\n    `;\n  },\n\n  focus(t: Theme) {\n    return css`\n      background-color: ${t.inputFocusedBg};\n      border-color: ${t.inputBorderColorFocus};\n      box-shadow: ${t.inputFocusShadow};\n      outline: none;\n      z-index: 2;\n    `;\n  },\n\n  focusFallback(t: Theme) {\n    return css`\n      box-shadow: none;\n      outline: ${t.inputOutlineWidth} solid ${t.inputFocusOutline};\n    `;\n  },\n\n  placeholder(t: Theme) {\n    return css`\n      -ms-user-select: none;\n      color: ${t.inputPlaceholderColor};\n      cursor: text;\n      font-size: inherit;\n      height: 100%;\n      left: 0;\n      overflow: hidden;\n      pointer-events: none;\n      position: absolute;\n      top: 0;\n      user-select: none;\n      white-space: nowrap;\n      width: 100%;\n    `;\n  },\n\n  placeholderFocus(t: Theme) {\n    return css`\n      color: ${t.inputPlaceholderColorLight};\n    `;\n  },\n\n  placeholderDisabled(t: Theme) {\n    return css`\n      color: ${t.inputPlaceholderColorDisabled};\n    `;\n  },\n\n  input(t: Theme) {\n    return css`\n      -webkit-appearance: none;\n      background: transparent;\n      border: 0 none;\n      color: ${t.inputTextColor};\n      font: inherit;\n      line-height: inherit;\n      margin: 0;\n      outline: none;\n      padding: 0;\n      text-overflow: clip;\n      white-space: nowrap;\n      width: 100%;\n      color-scheme: ${t.inputColorScheme};\n\n      &:-moz-placeholder {\n        opacity: 1;\n      }\n      &::-moz-placeholder {\n        opacity: 1;\n      }\n      &::-ms-clear {\n        display: none;\n      }\n      &:-moz-placeholder {\n        color: ${t.inputPlaceholderColor};\n      }\n      &::-moz-placeholder {\n        color: ${t.inputPlaceholderColor};\n      }\n      &::placeholder {\n        color: ${t.inputPlaceholderColor};\n      }\n    `;\n  },\n\n  inputFocus(t: Theme) {\n    return css`\n      &:-moz-placeholder {\n        color: ${t.inputPlaceholderColorLight};\n      }\n      &::-moz-placeholder {\n        color: ${t.inputPlaceholderColorLight};\n      }\n      &::placeholder {\n        color: ${t.inputPlaceholderColorLight};\n      }\n    `;\n  },\n\n  inputDisabled(t: Theme) {\n    return css`\n      color: ${t.inputTextColorDisabled};\n      /* fix text color in safari https://bugs.webkit.org/show_bug.cgi?id=115510 */\n      -webkit-text-fill-color: ${t.inputTextColorDisabled};\n\n      &:-moz-placeholder {\n        -webkit-text-fill-color: ${t.inputPlaceholderColorDisabled};\n      }\n      &::-moz-placeholder {\n        -webkit-text-fill-color: ${t.inputPlaceholderColorDisabled};\n      }\n      &::placeholder {\n        -webkit-text-fill-color: ${t.inputPlaceholderColorDisabled};\n      }\n    `;\n  },\n\n  warning(t: Theme) {\n    return css`\n      border-color: ${t.inputBorderColorWarning};\n      box-shadow: 0 0 0 ${t.inputOutlineWidth} ${t.inputBorderColorWarning};\n      z-index: 2;\n    `;\n  },\n\n  warningFallback(t: Theme) {\n    return css`\n      box-shadow: none;\n      outline: ${t.inputBorderWidth} solid ${t.inputBorderColorWarning};\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      border-color: ${t.inputBorderColorError};\n      box-shadow: 0 0 0 ${t.inputOutlineWidth} ${t.inputBorderColorError};\n      z-index: 2;\n    `;\n  },\n\n  errorFallback(t: Theme) {\n    return css`\n      box-shadow: none;\n      outline: ${t.inputBorderWidth} solid ${t.inputBorderColorError};\n    `;\n  },\n\n  disabled(t: Theme) {\n    return css`\n      background-color: ${t.inputDisabledBg};\n      border-color: ${t.inputDisabledBorderColor};\n      box-shadow: none;\n    `;\n  },\n\n  blink(t: Theme) {\n    const blinkAnimation = keyframes`\n    0% {\n      background-color: ${t.inputBlinkColor};\n    }\n  `;\n    return css`\n      animation: ${blinkAnimation} 0.15s ease-in;\n    `;\n  },\n\n  sizeSmall(t: Theme) {\n    return css`\n      font-size: ${t.inputFontSizeSmall};\n      line-height: ${t.inputLineHeightSmall};\n      padding-top: ${t.inputPaddingYSmall};\n      padding-bottom: ${t.inputPaddingYSmall};\n      padding-left: ${t.inputPaddingXSmall};\n      padding-right: ${t.inputPaddingXSmall};\n      height: ${t.inputHeightSmall};\n      border-radius: ${t.inputBorderRadiusSmall};\n    `;\n  },\n\n  sizeSmallFallback(t: Theme) {\n    return css`\n      padding-top: ${shift(t.inputPaddingYSmall, '0')};\n      padding-bottom: ${shift(t.inputPaddingYSmall, '0')};\n      padding-left: ${t.inputPaddingXSmall};\n      padding-right: ${t.inputPaddingXSmall};\n      line-height: normal;\n    `;\n  },\n\n  sizeMedium(t: Theme) {\n    return css`\n      font-size: ${t.inputFontSizeMedium};\n      line-height: ${t.inputLineHeightMedium};\n      padding-top: ${t.inputPaddingYMedium};\n      padding-bottom: ${t.inputPaddingYMedium};\n      padding-left: ${t.inputPaddingXMedium};\n      padding-right: ${t.inputPaddingXMedium};\n      height: ${t.inputHeightMedium};\n      border-radius: ${t.inputBorderRadiusMedium};\n    `;\n  },\n\n  sizeMediumFallback(t: Theme) {\n    return css`\n      padding-top: ${shift(t.inputPaddingYMedium, '0')};\n      padding-bottom: ${shift(t.inputPaddingYMedium, '0')};\n      padding-left: ${t.inputPaddingXMedium};\n      padding-right: ${t.inputPaddingXMedium};\n      line-height: normal;\n    `;\n  },\n\n  sizeLarge(t: Theme) {\n    return css`\n      font-size: ${t.inputFontSizeLarge};\n      line-height: ${t.inputLineHeightLarge};\n      height: ${t.inputHeightLarge};\n      padding-top: ${shift(t.inputPaddingYLarge, '0')};\n      padding-bottom: ${shift(t.inputPaddingYLarge, '0')};\n      padding-left: ${t.inputPaddingXLarge};\n      padding-right: ${t.inputPaddingXLarge};\n      border-radius: ${t.inputBorderRadiusLarge};\n    `;\n  },\n\n  sizeLargeFallback(t: Theme) {\n    return css`\n      padding-top: ${shift(t.inputPaddingYLarge, '0')};\n      padding-bottom: ${shift(t.inputPaddingYLarge, '0')};\n      padding-left: ${t.inputPaddingXLarge};\n      padding-right: ${t.inputPaddingXLarge};\n      line-height: normal;\n    `;\n  },\n\n  hideBlinkingCursor() {\n    return css`\n      caret-color: transparent;\n    `;\n  },\n});\n"],"mappings":"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","ignoreList":[]}

package/components/Input/InputLayout/InputLayout.styles/InputLayout.styles.js

@@ -1,5 +1,6 @@
-import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+function _EMOTION_STRINGIFIED_CSS_ERROR__() {
+  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
+}
 import { ZERO_WIDTH_SPACE_CSS } from "../../../../lib/chars";
 import { css, memoizeStyle } from "../../../../lib/theming/Emotion";
 import { styles } from "../../Input.styles";
@@ -8,24 +9,31 @@ export var stylesLayout = memoizeStyle({
     return styles.root(t);
   },
   input: function input() {
-    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      min-width: 0;\n      overflow: hidden;\n      position: relative;\n      width: 100%;\n      display: flex;\n    "])));
+    return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? {
+      name: "6i3eih",
+      styles: "min-width:0;overflow:hidden;position:relative;width:100%;display:flex"
+    } : {
+      name: "1x17fv-input",
+      styles: "min-width:0;overflow:hidden;position:relative;width:100%;display:flex;label:input;",
+      toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+    });
   },
   aside: function aside() {
-    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      display: inline-flex;\n      align-items: center;\n      flex-shrink: 0;\n\n      &::before {\n        content: '", "';\n      }\n    "])), ZERO_WIDTH_SPACE_CSS);
+    return /*#__PURE__*/css("display:inline-flex;align-items:center;flex-shrink:0;&::before{content:'", ZERO_WIDTH_SPACE_CSS, "';}" + (process.env.NODE_ENV === "production" ? "" : ";label:aside;"));
   },
   icon: function icon(t) {
-    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputIconColor);
+    return /*#__PURE__*/css("color:", t.inputIconColor, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:icon;"));
   },
   iconFocus: function iconFocus(t) {
-    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputFocusedIconColor);
+    return /*#__PURE__*/css("color:", t.inputFocusedIconColor, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:iconFocus;"));
   },
   iconDisabled: function iconDisabled(t) {
-    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      cursor: default;\n      color: ", ";\n    "])), t.inputIconColorDisabled);
+    return /*#__PURE__*/css("cursor:default;color:", t.inputIconColorDisabled, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:iconDisabled;"));
   },
   text: function text(t) {
-    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputPlaceholderColor);
+    return /*#__PURE__*/css("color:", t.inputPlaceholderColor, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:text;"));
   },
   textDisabled: function textDisabled(t) {
-    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputPlaceholderColorDisabled);
+    return /*#__PURE__*/css("color:", t.inputPlaceholderColorDisabled, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:textDisabled;"));
   }
 });

package/components/Input/InputLayout/InputLayout.styles/InputLayout.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["ZERO_WIDTH_SPACE_CSS","css","memoizeStyle","styles","stylesLayout","root","t","input","_templateObject","_taggedTemplateLiteralLoose","aside","_templateObject2","icon","_templateObject3","inputIconColor","iconFocus","_templateObject4","inputFocusedIconColor","iconDisabled","_templateObject5","inputIconColorDisabled","text","_templateObject6","inputPlaceholderColor","textDisabled","_templateObject7","inputPlaceholderColorDisabled"],"sources":["InputLayout.styles.ts"],"sourcesContent":["import { ZERO_WIDTH_SPACE_CSS } from '../../../lib/chars';\nimport { css, memoizeStyle } from '../../../lib/theming/Emotion';\nimport { Theme } from '../../../lib/theming/Theme';\nimport { styles } from '../Input.styles';\n\nexport const stylesLayout = memoizeStyle({\n  root(t: Theme) {\n    return styles.root(t);\n  },\n  input() {\n    return css`\n      min-width: 0;\n      overflow: hidden;\n      position: relative;\n      width: 100%;\n      display: flex;\n    `;\n  },\n  aside() {\n    return css`\n      display: inline-flex;\n      align-items: center;\n      flex-shrink: 0;\n\n      &::before {\n        content: '${ZERO_WIDTH_SPACE_CSS}';\n      }\n    `;\n  },\n  icon(t: Theme) {\n    return css`\n      color: ${t.inputIconColor};\n    `;\n  },\n  iconFocus(t: Theme) {\n    return css`\n      color: ${t.inputFocusedIconColor};\n    `;\n  },\n  iconDisabled(t: Theme) {\n    return css`\n      cursor: default;\n      color: ${t.inputIconColorDisabled};\n    `;\n  },\n  text(t: Theme) {\n    return css`\n      color: ${t.inputPlaceholderColor};\n    `;\n  },\n  textDisabled(t: Theme) {\n    return css`\n      color: ${t.inputPlaceholderColorDisabled};\n    `;\n  },\n});\n"],"mappings":"gOAAA,SAASA,oBAAoB,QAAQ,oBAAoB;AACzD,SAASC,GAAG,EAAEC,YAAY,QAAQ,8BAA8B;;AAEhE,SAASC,MAAM,QAAQ,iBAAiB;;AAExC,OAAO,IAAMC,YAAY,GAAGF,YAAY,CAAC;EACvCG,IAAI,WAAAA,KAACC,CAAQ,EAAE;IACb,OAAOH,MAAM,CAACE,IAAI,CAACC,CAAC,CAAC;EACvB,CAAC;EACDC,KAAK,WAAAA,MAAA,EAAG;IACN,OAAON,GAAG,CAAAO,eAAA,KAAAA,eAAA,GAAAC,2BAAA;;;;;;;EAOZ,CAAC;EACDC,KAAK,WAAAA,MAAA,EAAG;IACN,OAAOT,GAAG,CAAAU,gBAAA,KAAAA,gBAAA,GAAAF,2BAAA;;;;;;IAMMT,oBAAoB;;;EAGtC,CAAC;EACDY,IAAI,WAAAA,KAACN,CAAQ,EAAE;IACb,OAAOL,GAAG,CAAAY,gBAAA,KAAAA,gBAAA,GAAAJ,2BAAA;IACCH,CAAC,CAACQ,cAAc;;EAE7B,CAAC;EACDC,SAAS,WAAAA,UAACT,CAAQ,EAAE;IAClB,OAAOL,GAAG,CAAAe,gBAAA,KAAAA,gBAAA,GAAAP,2BAAA;IACCH,CAAC,CAACW,qBAAqB;;EAEpC,CAAC;EACDC,YAAY,WAAAA,aAACZ,CAAQ,EAAE;IACrB,OAAOL,GAAG,CAAAkB,gBAAA,KAAAA,gBAAA,GAAAV,2BAAA;;IAECH,CAAC,CAACc,sBAAsB;;EAErC,CAAC;EACDC,IAAI,WAAAA,KAACf,CAAQ,EAAE;IACb,OAAOL,GAAG,CAAAqB,gBAAA,KAAAA,gBAAA,GAAAb,2BAAA;IACCH,CAAC,CAACiB,qBAAqB;;EAEpC,CAAC;EACDC,YAAY,WAAAA,aAAClB,CAAQ,EAAE;IACrB,OAAOL,GAAG,CAAAwB,gBAAA,KAAAA,gBAAA,GAAAhB,2BAAA;IACCH,CAAC,CAACoB,6BAA6B;;EAE5C;AACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["ZERO_WIDTH_SPACE_CSS","css","memoizeStyle","styles","stylesLayout","root","t","input","process","env","NODE_ENV","name","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","aside","icon","inputIconColor","iconFocus","inputFocusedIconColor","iconDisabled","inputIconColorDisabled","text","inputPlaceholderColor","textDisabled","inputPlaceholderColorDisabled"],"sources":["InputLayout.styles.ts"],"sourcesContent":["import { ZERO_WIDTH_SPACE_CSS } from '../../../lib/chars';\nimport { css, memoizeStyle } from '../../../lib/theming/Emotion';\nimport { Theme } from '../../../lib/theming/Theme';\nimport { styles } from '../Input.styles';\n\nexport const stylesLayout = memoizeStyle({\n  root(t: Theme) {\n    return styles.root(t);\n  },\n  input() {\n    return css`\n      min-width: 0;\n      overflow: hidden;\n      position: relative;\n      width: 100%;\n      display: flex;\n    `;\n  },\n  aside() {\n    return css`\n      display: inline-flex;\n      align-items: center;\n      flex-shrink: 0;\n\n      &::before {\n        content: '${ZERO_WIDTH_SPACE_CSS}';\n      }\n    `;\n  },\n  icon(t: Theme) {\n    return css`\n      color: ${t.inputIconColor};\n    `;\n  },\n  iconFocus(t: Theme) {\n    return css`\n      color: ${t.inputFocusedIconColor};\n    `;\n  },\n  iconDisabled(t: Theme) {\n    return css`\n      cursor: default;\n      color: ${t.inputIconColorDisabled};\n    `;\n  },\n  text(t: Theme) {\n    return css`\n      color: ${t.inputPlaceholderColor};\n    `;\n  },\n  textDisabled(t: Theme) {\n    return css`\n      color: ${t.inputPlaceholderColorDisabled};\n    `;\n  },\n});\n"],"mappings":"uRAAA,SAASA,oBAAoB,QAAQ,oBAAoB;AACzD,SAASC,GAAG,EAAEC,YAAY,QAAQ,8BAA8B;;AAEhE,SAASC,MAAM,QAAQ,iBAAiB;;AAExC,OAAO,IAAMC,YAAY,GAAGF,YAAY,CAAC;EACvCG,IAAI,WAAAA,KAACC,CAAQ,EAAE;IACb,OAAOH,MAAM,CAACE,IAAI,CAACC,CAAC,CAAC;EACvB,CAAC;EACDC,KAAK,WAAAA,MAAA,EAAG;IACN,oBAAON,GAAG,CAAAO,OAAA,CAAAC,GAAA,CAAAC,QAAA,sBAAAC,IAAA,YAAAR,MAAA,gFAAAQ,IAAA,kBAAAR,MAAA,wFAAAS,QAAA,EAAAC,gCAAA;;;;;;;EAOZ,CAAC;EACDC,KAAK,WAAAA,MAAA,EAAG;IACN,oBAAOb,GAAG;;;;;;IAMMD,oBAAoB,WAAAQ,OAAA,CAAAC,GAAA,CAAAC,QAAA;;;EAGtC,CAAC;EACDK,IAAI,WAAAA,KAACT,CAAQ,EAAE;IACb,oBAAOL,GAAG;IACCK,CAAC,CAACU,cAAc,SAAAR,OAAA,CAAAC,GAAA,CAAAC,QAAA;;EAE7B,CAAC;EACDO,SAAS,WAAAA,UAACX,CAAQ,EAAE;IAClB,oBAAOL,GAAG;IACCK,CAAC,CAACY,qBAAqB,SAAAV,OAAA,CAAAC,GAAA,CAAAC,QAAA;;EAEpC,CAAC;EACDS,YAAY,WAAAA,aAACb,CAAQ,EAAE;IACrB,oBAAOL,GAAG;;IAECK,CAAC,CAACc,sBAAsB,SAAAZ,OAAA,CAAAC,GAAA,CAAAC,QAAA;;EAErC,CAAC;EACDW,IAAI,WAAAA,KAACf,CAAQ,EAAE;IACb,oBAAOL,GAAG;IACCK,CAAC,CAACgB,qBAAqB,SAAAd,OAAA,CAAAC,GAAA,CAAAC,QAAA;;EAEpC,CAAC;EACDa,YAAY,WAAAA,aAACjB,CAAQ,EAAE;IACrB,oBAAOL,GAAG;IACCK,CAAC,CAACkB,6BAA6B,SAAAhB,OAAA,CAAAC,GAAA,CAAAC,QAAA;;EAE5C;AACF,CAAC,CAAC","ignoreList":[]}

package/components/Input/__creevey__/Input.creevey.mts

@@ -0,0 +1,239 @@
+import { story, kind, test } from 'creevey';
+
+import { delay } from '../../../lib/delay';
+
+const differentStatesTest = () => {
+  test('Plain', async (context) => {
+    const element = await context.webdriver.findElement({ css: '#input' });
+    await context.matchImage(await element.takeScreenshot(), 'Plain');
+  });
+
+  test('Focused', async (context) => {
+    const element = await context.webdriver.findElement({ css: '#input' });
+    await context.webdriver
+      .actions({
+        bridge: true,
+      })
+      .click(context.webdriver.findElement({ css: '#input input' }))
+      .pause(500)
+      .perform();
+    await context.matchImage(await element.takeScreenshot(), 'Focused');
+  });
+
+  test('With typed text', async (context) => {
+    const element = await context.webdriver.findElement({ css: '#input' });
+    await context.webdriver
+      .actions({
+        bridge: true,
+      })
+      .click(context.webdriver.findElement({ css: '#input input' }))
+      .sendKeys('Test...')
+      .pause(500)
+      .perform();
+    await context.matchImage(await element.takeScreenshot(), 'With typed text');
+  });
+
+  test('With long typed text', async (context) => {
+    const element = await context.webdriver.findElement({ css: '#input' });
+    await context.webdriver
+      .actions({
+        bridge: true,
+      })
+      .click(context.webdriver.findElement({ css: '#input input' }))
+      .sendKeys('Test...')
+      .sendKeys('aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa')
+      .pause(500)
+      .perform();
+    await context.matchImage(await element.takeScreenshot(), 'With long typed text');
+  });
+};
+
+const testMaskedInput = () => {
+  test('idle, focus, edit, blur', async (context) => {
+    const click = (css: string) => {
+      return context.webdriver
+        .actions({
+          bridge: true,
+        })
+        .click(context.webdriver.findElement({ css }));
+    };
+    const idle = await context.takeScreenshot();
+    await click('input').pause(500).perform();
+    const focused = await context.takeScreenshot();
+    await click('input').sendKeys('953').perform();
+    const edited = await context.takeScreenshot();
+    await click('body').perform();
+    const blured = await context.takeScreenshot();
+    await context.matchImages({ idle, focused, edited, blured });
+  });
+};
+
+kind('Input', () => {
+  story('Default', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: { "themes don't affect logic": { in: /^(?!\b(chrome2022|firefox2022)\b)/ } },
+    });
+    differentStatesTest();
+  });
+
+  story('WithMask', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: { "themes don't affect logic": { in: /^(?!\b(chrome2022|firefox2022)\b)/ } },
+    });
+    testMaskedInput();
+  });
+
+  story('WithMaskAndCustomUnmaskedValue', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: {
+        "themes don't affect logic": { in: /^(?!\bchrome2022\b)/ },
+      },
+    });
+
+    testMaskedInput();
+  });
+
+  story('SelectAllByProp', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: { "themes don't affect logic": { in: /^(?!\b(chrome2022|firefox2022)\b)/ } },
+    });
+    test('Plain', async (context) => {
+      await context.matchImage(await context.takeScreenshot(), 'Plain');
+    });
+
+    test('Focused', async (context) => {
+      await context.webdriver
+        .actions({
+          bridge: true,
+        })
+        .click(context.webdriver.findElement({ css: 'label' }))
+        .perform();
+      await context.matchImage(await context.takeScreenshot(), 'Focused');
+    });
+  });
+
+  story('SelectAllByButton', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: { "themes don't affect logic": { in: /^(?!\b(chrome2022|firefox2022)\b)/ } },
+    });
+    test('Plain', async (context) => {
+      await context.matchImage(await context.takeScreenshot(), 'Plain');
+    });
+
+    test('Selected', async (context) => {
+      await context.webdriver
+        .actions({
+          bridge: true,
+        })
+        .click(context.webdriver.findElement({ css: '[data-tid~="select-all"]' }))
+        .perform();
+      await context.matchImage(await context.takeScreenshot(), 'Selected');
+    });
+  });
+
+  story('MaxLength', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: {
+        "themes don't affect logic": { in: /^(?!\b(chrome2022|firefox2022)\b)/ },
+        flaky: {
+          in: ['chrome2022'],
+          tests: ['With long typed text'],
+        },
+      },
+    });
+    differentStatesTest();
+  });
+
+  story('UncontrolledInputWithPlaceholder', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: { "themes don't affect logic": { in: /^(?!\b(chrome2022|firefox2022)\b)/ } },
+    });
+    test('PlainAndTyped', async (context) => {
+      const plain = await context.takeScreenshot();
+      await context.webdriver
+        .actions({
+          bridge: true,
+        })
+        .click(context.webdriver.findElement({ css: 'input' }))
+        .sendKeys('text')
+        .perform();
+      const typed = await context.takeScreenshot();
+      await context.matchImages({ plain, typed });
+    });
+  });
+
+  story('WithMaskAndSelectAllProp', ({ setStoryParameters }) => {
+    setStoryParameters({ skip: { "themes don't affect logic": { in: /^(?!\bchrome2022\b)/ } } });
+
+    test('PlainAndSelected', async (context) => {
+      const plain = await context.takeScreenshot();
+      await context.webdriver
+        .actions({
+          bridge: true,
+        })
+        .click(context.webdriver.findElement({ css: 'input' }))
+        .pause(500)
+        .perform();
+      const selectAllHalfFilledInput = await context.takeScreenshot();
+      await context.webdriver
+        .actions({
+          bridge: true,
+        })
+        .click(context.webdriver.findElement({ css: 'input' }))
+        .sendKeys('1111')
+        .click(context.webdriver.findElement({ css: 'body' }))
+        .click(context.webdriver.findElement({ css: 'input' }))
+        .pause(500)
+        .perform();
+      const selectAllFilledInput = await context.takeScreenshot();
+      await context.matchImages({ plain, selectAllHalfFilledInput, selectAllFilledInput });
+    });
+  });
+
+  story('SearchTypeApi', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: {
+        'tests only stable in chrome': { in: /^(?!\bchrome2022\b|\bchrome2022Dark\b)/ },
+      },
+    });
+
+    test('Focused', async (context) => {
+      await context.webdriver
+        .actions({
+          bridge: true,
+        })
+        .click(context.webdriver.findElement({ css: 'label' }))
+        .perform();
+      await delay(1000);
+      await context.matchImage(await context.takeScreenshot(), 'Focused');
+    });
+  });
+
+  story('InputTypeApi', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: {
+        "themes don't affect logic": { in: /^(?!\b(chrome|firefox)(2022).*\b)/ },
+      },
+    });
+
+    test('Focused', async (context) => {
+      await context.webdriver
+        .actions({
+          bridge: true,
+        })
+        .click(context.webdriver.findElement({ css: 'label' }))
+        .perform();
+      await context.matchImage(await context.takeScreenshot(), 'Focused');
+    });
+  });
+  story('Type', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: { 'no themes': { in: /^(?!\b(chrome2022)\b)/ } },
+    });
+  });
+  story('TypeApi', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: { 'no themes': { in: /^(?!\b(chrome2022)\b)/ } },
+    });
+  });
+});