@skbkontur/react-ui 5.6.1-9a162.0 → 6.0.0-alpha.0

package/components/Input/Input.d.ts

@@ -1,6 +1,6 @@
-import type { AriaAttributes, HTMLAttributes, ReactElement } from 'react';
+import type { AriaAttributes, HTMLAttributes, JSX, ReactElement } from 'react';
 import React from 'react';
-import type { Nullable, Override } from '../../typings/utility-types';
+import type { Override } from '../../typings/utility-types';
 import type { CommonProps } from '../../internal/CommonWrapper';
 import type { TGetRootNode } from '../../lib/rootNode';
 import type { SizeProp } from '../../lib/types/props';
@@ -12,14 +12,11 @@ export type InputType = (typeof inputTypes)[number];
 export type InputIconType = React.ReactNode | (() => React.ReactNode);
 export declare const selectionAllowedTypes: InputType[];
 export declare const selectionErrorMessage: (type: InputType, allowedTypes?: InputType[]) => string;
-export declare const maskForbiddenTypes: InputType[];
-export declare const maskAllowedTypes: InputType[];
-export declare const maskErrorMessage: (type: InputType, allowedTypes?: InputType[]) => string;
 export declare const calculateClearCrossShowedState: ({ showClearIcon, notEmptyValue, focused, hovered, }: {
     showClearIcon: ShowClearIcon;
     notEmptyValue: boolean;
-    focused?: boolean | undefined;
-    hovered?: boolean | undefined;
+    focused?: boolean;
+    hovered?: boolean;
 }) => boolean;
 export interface InputProps extends CommonProps, Pick<HTMLAttributes<unknown>, 'role'>, Pick<AriaAttributes, 'aria-describedby' | 'aria-controls' | 'aria-label'>, Override<React.InputHTMLAttributes<HTMLInputElement>, {
     /** Показывает иконку очистки значения в заполненном поле.
@@ -41,19 +38,6 @@ export interface InputProps extends CommonProps, Pick<HTMLAttributes<unknown>, '
     borderless?: boolean;
     /** Выравнивает контент внутри поля. */
     align?: InputAlign;
-    /** Задаёт паттерн маски. Доступен для типов `text`, `password`, `email`, `tel`, `search`, `url`
-     * @deprecated Со следующей мажорной версии Input перестанет поддерживать маску. Используйте MaskedInput. */
-    mask?: Nullable<string>;
-    /** Устанавливает символ маски.
-     * @deprecated Со следующей мажорной версии Input перестанет поддерживать маску. Используйте MaskedInput. */
-    maskChar?: Nullable<string>;
-    /** Задаёт словарь символов-регулярок для задания маски
-     * @deprecated Со следующей мажорной версии Input перестанет поддерживать маску. Используйте MaskedInput.
-     * @default { '9': '[0-9]', 'a': '[A-Za-z]', '*': '[A-Za-z0-9]' }. */
-    formatChars?: Record<string, string>;
-    /** Включает показ символов маски.
-     * @deprecated Со следующей мажорной версии Input перестанет поддерживать маску. Используйте MaskedInput. */
-    alwaysShowMask?: boolean;
     /** Задаёт размер.
      * @default small
      */
@@ -70,8 +54,6 @@ export interface InputProps extends CommonProps, Pick<HTMLAttributes<unknown>, '
     type?: InputType;
     /** Задаёт значение внутри поля. */
     value?: string;
-    /** @deprecated Со следующей мажорной версии Input перестанет поддерживать проп `capture`. */
-    capture?: boolean;
     /** Устанавливает префикс `ReactNode` перед значением, но после иконки. */
     prefix?: React.ReactNode;
     /** Устанавливает суффикс `ReactNode` после значения, но перед правой иконкой. */
@@ -92,7 +74,6 @@ export interface InputProps extends CommonProps, Pick<HTMLAttributes<unknown>, '
 export interface InputState {
     focused: boolean;
     hovered: boolean;
-    needsPolyfillPlaceholder: boolean;
     clearCrossShowed: boolean;
 }
 export declare const InputDataTids: {
@@ -110,16 +91,17 @@ export declare class Input extends React.Component<InputProps, InputState> {
     private size;
     private getProps;
     private selectAllId;
+    private globalObject;
+    private emotion;
+    private cx;
+    private styles;
     private theme;
     input: HTMLInputElement | null;
-    labelRef: React.RefObject<HTMLLabelElement>;
+    labelRef: React.RefObject<HTMLLabelElement | null>;
     getRootNode: TGetRootNode;
     private setRootNode;
     private getClearCrossShowed;
     state: InputState;
-    private outputMaskError;
-    componentDidMount(): void;
-    componentDidUpdate(prevProps: Readonly<InputProps>): void;
     componentWillUnmount(): void;
     /** Программно устанавливает фокус на поле.
      * Появляется фокусная рамка, элемент получает клавиатурные события и воспринимается как текущий элемент для чтения скринридерами.
@@ -145,9 +127,7 @@ export declare class Input extends React.Component<InputProps, InputState> {
      * @param {number} end
      */
     setSelectionRange(start: number, end: number): void;
-    get isMaskVisible(): boolean;
     render(): JSX.Element;
-    private get canBeUsedWithMask();
     /**
      * Переводит фокус в поле (если ещё не в фокусе) и выделяет весь текст в нём.
      * Работает с типами `text`, `password`, `tel`, `search`, `url`.
@@ -159,7 +139,6 @@ export declare class Input extends React.Component<InputProps, InputState> {
     private cancelDelayedSelectAll;
     private getInput;
     private renderMain;
-    private renderMaskedInput;
     private getSizeClassName;
     private refInput;
     private handleClearInput;
@@ -169,7 +148,6 @@ export declare class Input extends React.Component<InputProps, InputState> {
     private handleFocus;
     private handleKeyDown;
     private handleKeyPress;
-    private handleMaskedValueChange;
     private handleUnexpectedInput;
     private resetFocus;
     private handleBlur;

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

@@ -1,79 +1,64 @@
 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;
-import { css, memoizeStyle } from "../../../lib/theming/Emotion";
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18;
+import { memoizeGetStyles } 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    "])));
-  },
-  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);
-  },
-  hovering: function hovering(t) {
-    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      &:hover {\n        border-color: ", ";\n      }\n    "])), t.inputBorderColorHover);
-  },
-  borderless: function borderless() {
-    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      box-shadow: none;\n      border-color: transparent;\n      background-clip: padding-box;\n    "])));
-  },
-  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);
-  },
-  focusFallback: function focusFallback(t) {
-    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      box-shadow: none;\n      outline: ", " solid ", ";\n    "])), t.inputOutlineWidth, t.inputFocusOutline);
-  },
-  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);
-  },
-  placeholderFocus: function placeholderFocus(t) {
-    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputPlaceholderColorLight);
-  },
-  placeholderDisabled: function placeholderDisabled(t) {
-    return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputPlaceholderColorDisabled);
-  },
-  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);
-  },
-  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);
-  },
-  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);
-  },
-  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);
-  },
-  warningFallback: function warningFallback(t) {
-    return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n      box-shadow: none;\n      outline: ", " solid ", ";\n    "])), t.inputBorderWidth, t.inputBorderColorWarning);
-  },
-  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);
-  },
-  errorFallback: function errorFallback(t) {
-    return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n      box-shadow: none;\n      outline: ", " solid ", ";\n    "])), t.inputBorderWidth, t.inputBorderColorError);
-  },
-  disabled: function disabled(t) {
-    return css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteralLoose(["\n      background-color: ", ";\n      border-color: ", ";\n      box-shadow: none;\n    "])), t.inputDisabledBg, t.inputDisabledBorderColor);
-  },
-  sizeSmall: function sizeSmall(t) {
-    return css(_templateObject18 || (_templateObject18 = _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);
-  },
-  sizeSmallFallback: function sizeSmallFallback(t) {
-    return css(_templateObject19 || (_templateObject19 = _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);
-  },
-  sizeMedium: function sizeMedium(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.inputFontSizeMedium, t.inputLineHeightMedium, t.inputPaddingYMedium, t.inputPaddingYMedium, t.inputPaddingXMedium, t.inputPaddingXMedium, t.inputHeightMedium, t.inputBorderRadiusMedium);
-  },
-  sizeMediumFallback: function sizeMediumFallback(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.inputPaddingYMedium, '0'), shift(t.inputPaddingYMedium, '0'), t.inputPaddingXMedium, t.inputPaddingXMedium);
-  },
-  sizeLarge: function sizeLarge(t) {
-    return css(_templateObject22 || (_templateObject22 = _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);
-  },
-  sizeLargeFallback: function sizeLargeFallback(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.inputPaddingYLarge, '0'), shift(t.inputPaddingYLarge, '0'), t.inputPaddingXLarge, t.inputPaddingXLarge);
-  },
-  hideBlinkingCursor: function hideBlinkingCursor() {
-    return css(_templateObject24 || (_templateObject24 = _taggedTemplateLiteralLoose(["\n      caret-color: transparent;\n    "])));
-  }
+export var getStyles = memoizeGetStyles(function (_ref) {
+  var css = _ref.css;
+  return {
+    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    "])));
+    },
+    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);
+    },
+    hovering: function hovering(t) {
+      return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      &:hover {\n        border-color: ", ";\n      }\n    "])), t.inputBorderColorHover);
+    },
+    borderless: function borderless() {
+      return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      box-shadow: none;\n      border-color: transparent;\n      background-clip: padding-box;\n    "])));
+    },
+    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);
+    },
+    placeholder: function placeholder(t) {
+      return css(_templateObject6 || (_templateObject6 = _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);
+    },
+    placeholderFocus: function placeholderFocus(t) {
+      return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputPlaceholderColorLight);
+    },
+    placeholderDisabled: function placeholderDisabled(t) {
+      return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputPlaceholderColorDisabled);
+    },
+    input: function input(t) {
+      return css(_templateObject9 || (_templateObject9 = _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);
+    },
+    inputFocus: function inputFocus(t) {
+      return css(_templateObject10 || (_templateObject10 = _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);
+    },
+    inputDisabled: function inputDisabled(t) {
+      return css(_templateObject11 || (_templateObject11 = _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);
+    },
+    warning: function warning(t) {
+      return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n      border-color: ", ";\n      box-shadow: 0 0 0 ", " ", ";\n      z-index: 2;\n    "])), t.inputBorderColorWarning, t.inputOutlineWidth, t.inputBorderColorWarning);
+    },
+    error: function error(t) {
+      return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n      border-color: ", ";\n      box-shadow: 0 0 0 ", " ", ";\n      z-index: 2;\n    "])), t.inputBorderColorError, t.inputOutlineWidth, t.inputBorderColorError);
+    },
+    disabled: function disabled(t) {
+      return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n      background-color: ", ";\n      border-color: ", ";\n      box-shadow: none;\n    "])), t.inputDisabledBg, t.inputDisabledBorderColor);
+    },
+    sizeSmall: function sizeSmall(t) {
+      return css(_templateObject15 || (_templateObject15 = _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);
+    },
+    sizeMedium: function sizeMedium(t) {
+      return css(_templateObject16 || (_templateObject16 = _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);
+    },
+    sizeLarge: function sizeLarge(t) {
+      return css(_templateObject17 || (_templateObject17 = _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);
+    },
+    hideBlinkingCursor: function hideBlinkingCursor() {
+      return css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteralLoose(["\n      caret-color: transparent;\n    "])));
+    }
+  };
 });

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

@@ -1 +1 @@
-{"version":3,"names":["css","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","sizeSmall","_templateObject18","inputFontSizeSmall","inputLineHeightSmall","inputPaddingYSmall","inputPaddingXSmall","inputHeightSmall","inputBorderRadiusSmall","sizeSmallFallback","_templateObject19","sizeMedium","_templateObject20","inputFontSizeMedium","inputLineHeightMedium","inputPaddingYMedium","inputPaddingXMedium","inputHeightMedium","inputBorderRadiusMedium","sizeMediumFallback","_templateObject21","sizeLarge","_templateObject22","inputFontSizeLarge","inputLineHeightLarge","inputHeightLarge","inputPaddingYLarge","inputPaddingXLarge","inputBorderRadiusLarge","sizeLargeFallback","_templateObject23","hideBlinkingCursor","_templateObject24"],"sources":["Input.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport type { 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  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":["memoizeGetStyles","shift","resetText","getStyles","_ref","css","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","placeholder","_templateObject6","inputPlaceholderColor","placeholderFocus","_templateObject7","inputPlaceholderColorLight","placeholderDisabled","_templateObject8","inputPlaceholderColorDisabled","input","_templateObject9","inputTextColor","inputColorScheme","inputFocus","_templateObject10","inputDisabled","_templateObject11","inputTextColorDisabled","warning","_templateObject12","inputBorderColorWarning","inputOutlineWidth","error","_templateObject13","inputBorderColorError","disabled","_templateObject14","inputDisabledBg","inputDisabledBorderColor","sizeSmall","_templateObject15","inputFontSizeSmall","inputLineHeightSmall","inputPaddingYSmall","inputPaddingXSmall","inputHeightSmall","inputBorderRadiusSmall","sizeMedium","_templateObject16","inputFontSizeMedium","inputLineHeightMedium","inputPaddingYMedium","inputPaddingXMedium","inputHeightMedium","inputBorderRadiusMedium","sizeLarge","_templateObject17","inputFontSizeLarge","inputLineHeightLarge","inputHeightLarge","inputPaddingYLarge","inputPaddingXLarge","inputBorderRadiusLarge","hideBlinkingCursor","_templateObject18"],"sources":["Input.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { shift } from '../../lib/styles/DimensionFunctions';\nimport { resetText } from '../../lib/styles/Mixins';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\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  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  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  disabled(t: Theme) {\n    return css`\n      background-color: ${t.inputDisabledBg};\n      border-color: ${t.inputDisabledBorderColor};\n      box-shadow: none;\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  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  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  hideBlinkingCursor() {\n    return css`\n      caret-color: transparent;\n    `;\n  },\n}));\n"],"mappings":"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","ignoreList":[]}

package/components/Input/Input.styles.d.ts

@@ -1,11 +1,10 @@
 import type { Theme } from '../../lib/theming/Theme';
-export declare const styles: {
+export declare const getStyles: import("../../lib/theming/Emotion").StylesGetter<{
     wrapper(): string;
     root(t: Theme): string;
     hovering(t: Theme): string;
     borderless(): string;
     focus(t: Theme): string;
-    focusFallback(t: Theme): string;
     placeholder(t: Theme): string;
     placeholderFocus(t: Theme): string;
     placeholderDisabled(t: Theme): string;
@@ -13,15 +12,10 @@ export declare const styles: {
     inputFocus(t: Theme): string;
     inputDisabled(t: Theme): string;
     warning(t: Theme): string;
-    warningFallback(t: Theme): string;
     error(t: Theme): string;
-    errorFallback(t: Theme): string;
     disabled(t: Theme): string;
     sizeSmall(t: Theme): string;
-    sizeSmallFallback(t: Theme): string;
     sizeMedium(t: Theme): string;
-    sizeMediumFallback(t: Theme): string;
     sizeLarge(t: Theme): string;
-    sizeLargeFallback(t: Theme): string;
     hideBlinkingCursor(): string;
-};
+}>;

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

@@ -1,12 +1,15 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import React from 'react';
+import { useStyles } from "../../../../lib/renderEnvironment";
 import { forwardRefAndName } from "../../../../lib/forwardRefAndName";
 import { InputDataTids } from "../../Input";
 import { CommonWrapper } from "../../../../internal/CommonWrapper";
+import { mergeRefs } from "../../../../lib/mergeRefs";
 import { InputLayoutAside } from "../InputLayoutAside";
 import { InputLayoutContext, InputLayoutContextDefault } from "../InputLayoutContext";
-import { stylesLayout } from "../InputLayout.styles";
+import { getStylesLayout } from "../InputLayout.styles";
 export var InputLayout = forwardRefAndName('InputLayout', function (props, ref) {
+  var stylesLayout = useStyles(getStylesLayout);
   var leftIcon = props.leftIcon,
     rightIcon = props.rightIcon,
     prefix = props.prefix,
@@ -22,12 +25,12 @@ export var InputLayout = forwardRefAndName('InputLayout', function (props, ref)
     React.createElement(InputLayoutContext.Provider, {
       value: _context
     }, /*#__PURE__*/
-    React.createElement(CommonWrapper, _extends({}, props, {
-      ref: ref
-    }), /*#__PURE__*/
+    React.createElement(CommonWrapper, props, /*#__PURE__*/
     React.createElement(Tag, _extends({
       "data-tid": InputDataTids.root
-    }, labelProps), /*#__PURE__*/
+    }, labelProps, {
+      ref: mergeRefs(ref, labelProps.ref)
+    }), /*#__PURE__*/
     React.createElement(InputLayoutAside, {
       icon: leftIcon,
       text: prefix,

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

@@ -1 +1 @@
-{"version":3,"names":["React","forwardRefAndName","InputDataTids","CommonWrapper","InputLayoutAside","InputLayoutContext","InputLayoutContextDefault","stylesLayout","InputLayout","props","ref","leftIcon","rightIcon","prefix","suffix","labelProps","context","children","_props$tag","tag","_context","_extends","Tag","createElement","Provider","value","root","icon","text","side","className","input"],"sources":["InputLayout.tsx"],"sourcesContent":["import React from 'react';\n\nimport { forwardRefAndName } from '../../../lib/forwardRefAndName';\nimport type { InputProps } from '../Input';\nimport { InputDataTids } from '../Input';\nimport type { CommonProps } from '../../../internal/CommonWrapper';\nimport { CommonWrapper } from '../../../internal/CommonWrapper';\n\nimport { InputLayoutAside } from './InputLayoutAside';\nimport type { InputLayoutContextProps } from './InputLayoutContext';\nimport { InputLayoutContext, InputLayoutContextDefault } from './InputLayoutContext';\nimport { stylesLayout } from './InputLayout.styles';\n\ntype InputLayoutRootFromInputProps = Pick<InputProps, 'leftIcon' | 'rightIcon' | 'prefix' | 'suffix'>;\n\nexport interface InputLayoutRootProps extends InputLayoutRootFromInputProps, CommonProps {\n  labelProps: React.LabelHTMLAttributes<HTMLLabelElement>;\n  context: Partial<InputLayoutContextProps>;\n  tag?: 'label' | 'span';\n}\n\nexport const InputLayout = forwardRefAndName<CommonWrapper<CommonProps>, InputLayoutRootProps>(\n  'InputLayout',\n  (props, ref) => {\n    const { leftIcon, rightIcon, prefix, suffix, labelProps, context, children, tag = 'label' } = props;\n    const _context: InputLayoutContextProps = { ...InputLayoutContextDefault, ...context };\n    const Tag = tag;\n\n    return (\n      <InputLayoutContext.Provider value={_context}>\n        <CommonWrapper {...props} ref={ref}>\n          <Tag data-tid={InputDataTids.root} {...labelProps}>\n            <InputLayoutAside icon={leftIcon} text={prefix} side=\"left\" />\n            <span className={stylesLayout.input()}>{children}</span>\n            <InputLayoutAside icon={rightIcon} text={suffix} side=\"right\" />\n          </Tag>\n        </CommonWrapper>\n      </InputLayoutContext.Provider>\n    );\n  },\n);\n"],"mappings":"0DAAA,OAAOA,KAAK,MAAM,OAAO;;AAEzB,SAASC,iBAAiB,QAAQ,gCAAgC;;AAElE,SAASC,aAAa,QAAQ,UAAU;;AAExC,SAASC,aAAa,QAAQ,iCAAiC;;AAE/D,SAASC,gBAAgB,QAAQ,oBAAoB;;AAErD,SAASC,kBAAkB,EAAEC,yBAAyB,QAAQ,sBAAsB;AACpF,SAASC,YAAY,QAAQ,sBAAsB;;;;;;;;;;AAUnD,OAAO,IAAMC,WAAW,GAAGP,iBAAiB;EAC1C,aAAa;EACb,UAACQ,KAAK,EAAEC,GAAG,EAAK;IACd,IAAQC,QAAQ,GAA8EF,KAAK,CAA3FE,QAAQ,CAAEC,SAAS,GAAmEH,KAAK,CAAjFG,SAAS,CAAEC,MAAM,GAA2DJ,KAAK,CAAtEI,MAAM,CAAEC,MAAM,GAAmDL,KAAK,CAA9DK,MAAM,CAAEC,UAAU,GAAuCN,KAAK,CAAtDM,UAAU,CAAEC,OAAO,GAA8BP,KAAK,CAA1CO,OAAO,CAAEC,QAAQ,GAAoBR,KAAK,CAAjCQ,QAAQ,CAAAC,UAAA,GAAoBT,KAAK,CAAvBU,GAAG,CAAHA,GAAG,GAAAD,UAAA,cAAG,OAAO,GAAAA,UAAA;IACzF,IAAME,QAAiC,GAAAC,QAAA,KAAQf,yBAAyB,EAAKU,OAAO,CAAE;IACtF,IAAMM,GAAG,GAAGH,GAAG;;IAEf;MACEnB,KAAA,CAAAuB,aAAA,CAAClB,kBAAkB,CAACmB,QAAQ,IAACC,KAAK,EAAEL,QAAS;MAC3CpB,KAAA,CAAAuB,aAAA,CAACpB,aAAa,EAAAkB,QAAA,KAAKZ,KAAK,IAAEC,GAAG,EAAEA,GAAI;MACjCV,KAAA,CAAAuB,aAAA,CAACD,GAAG,EAAAD,QAAA,GAAC,YAAUnB,aAAa,CAACwB,IAAK,IAAKX,UAAU;MAC/Cf,KAAA,CAAAuB,aAAA,CAACnB,gBAAgB,IAACuB,IAAI,EAAEhB,QAAS,EAACiB,IAAI,EAAEf,MAAO,EAACgB,IAAI,EAAC,MAAM,EAAE,CAAC;MAC9D7B,KAAA,CAAAuB,aAAA,WAAMO,SAAS,EAAEvB,YAAY,CAACwB,KAAK,CAAC,CAAE,IAAEd,QAAe,CAAC;MACxDjB,KAAA,CAAAuB,aAAA,CAACnB,gBAAgB,IAACuB,IAAI,EAAEf,SAAU,EAACgB,IAAI,EAAEd,MAAO,EAACe,IAAI,EAAC,OAAO,EAAE;MAC5D;MACQ;MACY,CAAC;;EAElC;AACF,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useStyles","forwardRefAndName","InputDataTids","CommonWrapper","mergeRefs","InputLayoutAside","InputLayoutContext","InputLayoutContextDefault","getStylesLayout","InputLayout","props","ref","stylesLayout","leftIcon","rightIcon","prefix","suffix","labelProps","context","children","_props$tag","tag","_context","_extends","Tag","createElement","Provider","value","root","icon","text","side","className","input"],"sources":["InputLayout.tsx"],"sourcesContent":["import React from 'react';\n\nimport { useStyles } from '../../../lib/renderEnvironment';\nimport { forwardRefAndName } from '../../../lib/forwardRefAndName';\nimport type { InputProps } from '../Input';\nimport { InputDataTids } from '../Input';\nimport type { CommonProps } from '../../../internal/CommonWrapper';\nimport { CommonWrapper } from '../../../internal/CommonWrapper';\nimport { mergeRefs } from '../../../lib/mergeRefs';\n\nimport { InputLayoutAside } from './InputLayoutAside';\nimport type { InputLayoutContextProps } from './InputLayoutContext';\nimport { InputLayoutContext, InputLayoutContextDefault } from './InputLayoutContext';\nimport { getStylesLayout } from './InputLayout.styles';\n\ntype InputLayoutRootFromInputProps = Pick<InputProps, 'leftIcon' | 'rightIcon' | 'prefix' | 'suffix'>;\n\nexport interface InputLayoutRootProps extends InputLayoutRootFromInputProps, CommonProps {\n  labelProps: React.LabelHTMLAttributes<HTMLLabelElement> & { ref?: React.Ref<HTMLLabelElement> };\n  context: Partial<InputLayoutContextProps>;\n  tag?: 'label' | 'span';\n}\n\nexport const InputLayout = forwardRefAndName<HTMLLabelElement, InputLayoutRootProps>('InputLayout', (props, ref) => {\n  const stylesLayout = useStyles(getStylesLayout);\n  const { leftIcon, rightIcon, prefix, suffix, labelProps, context, children, tag = 'label' } = props;\n  const _context: InputLayoutContextProps = { ...InputLayoutContextDefault, ...context };\n  const Tag = tag;\n\n  return (\n    <InputLayoutContext.Provider value={_context}>\n      <CommonWrapper {...props}>\n        <Tag data-tid={InputDataTids.root} {...labelProps} ref={mergeRefs(ref, labelProps.ref)}>\n          <InputLayoutAside icon={leftIcon} text={prefix} side=\"left\" />\n          <span className={stylesLayout.input()}>{children}</span>\n          <InputLayoutAside icon={rightIcon} text={suffix} side=\"right\" />\n        </Tag>\n      </CommonWrapper>\n    </InputLayoutContext.Provider>\n  );\n});\n"],"mappings":"0DAAA,OAAOA,KAAK,MAAM,OAAO;;AAEzB,SAASC,SAAS,QAAQ,gCAAgC;AAC1D,SAASC,iBAAiB,QAAQ,gCAAgC;;AAElE,SAASC,aAAa,QAAQ,UAAU;;AAExC,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,SAAS,QAAQ,wBAAwB;;AAElD,SAASC,gBAAgB,QAAQ,oBAAoB;;AAErD,SAASC,kBAAkB,EAAEC,yBAAyB,QAAQ,sBAAsB;AACpF,SAASC,eAAe,QAAQ,sBAAsB;;;;;;;;;;AAUtD,OAAO,IAAMC,WAAW,GAAGR,iBAAiB,CAAyC,aAAa,EAAE,UAACS,KAAK,EAAEC,GAAG,EAAK;EAClH,IAAMC,YAAY,GAAGZ,SAAS,CAACQ,eAAe,CAAC;EAC/C,IAAQK,QAAQ,GAA8EH,KAAK,CAA3FG,QAAQ,CAAEC,SAAS,GAAmEJ,KAAK,CAAjFI,SAAS,CAAEC,MAAM,GAA2DL,KAAK,CAAtEK,MAAM,CAAEC,MAAM,GAAmDN,KAAK,CAA9DM,MAAM,CAAEC,UAAU,GAAuCP,KAAK,CAAtDO,UAAU,CAAEC,OAAO,GAA8BR,KAAK,CAA1CQ,OAAO,CAAEC,QAAQ,GAAoBT,KAAK,CAAjCS,QAAQ,CAAAC,UAAA,GAAoBV,KAAK,CAAvBW,GAAG,CAAHA,GAAG,GAAAD,UAAA,cAAG,OAAO,GAAAA,UAAA;EACzF,IAAME,QAAiC,GAAAC,QAAA,KAAQhB,yBAAyB,EAAKW,OAAO,CAAE;EACtF,IAAMM,GAAG,GAAGH,GAAG;;EAEf;IACEtB,KAAA,CAAA0B,aAAA,CAACnB,kBAAkB,CAACoB,QAAQ,IAACC,KAAK,EAAEL,QAAS;IAC3CvB,KAAA,CAAA0B,aAAA,CAACtB,aAAa,EAAKO,KAAK;IACtBX,KAAA,CAAA0B,aAAA,CAACD,GAAG,EAAAD,QAAA,GAAC,YAAUrB,aAAa,CAAC0B,IAAK,IAAKX,UAAU,IAAEN,GAAG,EAAEP,SAAS,CAACO,GAAG,EAAEM,UAAU,CAACN,GAAG,CAAE;IACrFZ,KAAA,CAAA0B,aAAA,CAACpB,gBAAgB,IAACwB,IAAI,EAAEhB,QAAS,EAACiB,IAAI,EAAEf,MAAO,EAACgB,IAAI,EAAC,MAAM,EAAE,CAAC;IAC9DhC,KAAA,CAAA0B,aAAA,WAAMO,SAAS,EAAEpB,YAAY,CAACqB,KAAK,CAAC,CAAE,IAAEd,QAAe,CAAC;IACxDpB,KAAA,CAAA0B,aAAA,CAACpB,gBAAgB,IAACwB,IAAI,EAAEf,SAAU,EAACgB,IAAI,EAAEd,MAAO,EAACe,IAAI,EAAC,OAAO,EAAE;IAC5D;IACQ;IACY,CAAC;;AAElC,CAAC,CAAC","ignoreList":[]}

package/components/Input/InputLayout/InputLayout.d.ts

@@ -1,13 +1,14 @@
 import React from 'react';
 import type { InputProps } from '../Input';
 import type { CommonProps } from '../../../internal/CommonWrapper';
-import { CommonWrapper } from '../../../internal/CommonWrapper';
 import type { InputLayoutContextProps } from './InputLayoutContext';
 type InputLayoutRootFromInputProps = Pick<InputProps, 'leftIcon' | 'rightIcon' | 'prefix' | 'suffix'>;
 export interface InputLayoutRootProps extends InputLayoutRootFromInputProps, CommonProps {
-    labelProps: React.LabelHTMLAttributes<HTMLLabelElement>;
+    labelProps: React.LabelHTMLAttributes<HTMLLabelElement> & {
+        ref?: React.Ref<HTMLLabelElement>;
+    };
     context: Partial<InputLayoutContextProps>;
     tag?: 'label' | 'span';
 }
-export declare const InputLayout: import("../../../lib/forwardRefAndName").ReactUIComponentWithRef<CommonWrapper<CommonProps>, InputLayoutRootProps> & Record<never, never>;
+export declare const InputLayout: import("../../../lib/forwardRefAndName").ReactUIComponentWithRef<HTMLLabelElement, InputLayoutRootProps> & Record<never, never>;
 export {};

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

@@ -1,31 +1,34 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
 import { ZERO_WIDTH_SPACE_CSS } from "../../../../lib/chars";
-import { css, memoizeStyle } from "../../../../lib/theming/Emotion";
-import { styles } from "../../Input.styles";
-export var stylesLayout = memoizeStyle({
-  root: function root(t) {
-    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    "])));
-  },
-  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);
-  },
-  icon: function icon(t) {
-    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputIconColor);
-  },
-  iconFocus: function iconFocus(t) {
-    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputFocusedIconColor);
-  },
-  iconDisabled: function iconDisabled(t) {
-    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      cursor: default;\n      color: ", ";\n    "])), t.inputIconColorDisabled);
-  },
-  text: function text(t) {
-    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputPlaceholderColor);
-  },
-  textDisabled: function textDisabled(t) {
-    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.inputPlaceholderColorDisabled);
-  }
+import { memoizeGetStyles } from "../../../../lib/theming/Emotion";
+import { getStyles } from "../../Input.styles";
+export var getStylesLayout = memoizeGetStyles(function (emotion) {
+  var styles = getStyles(emotion);
+  return {
+    root: function root(t) {
+      return styles.root(t);
+    },
+    input: function input() {
+      return emotion.css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n        min-width: 0;\n        overflow: hidden;\n        position: relative;\n        width: 100%;\n        display: flex;\n      "])));
+    },
+    aside: function aside() {
+      return emotion.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);
+    },
+    icon: function icon(t) {
+      return emotion.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n        color: ", ";\n      "])), t.inputIconColor);
+    },
+    iconFocus: function iconFocus(t) {
+      return emotion.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n        color: ", ";\n      "])), t.inputFocusedIconColor);
+    },
+    iconDisabled: function iconDisabled(t) {
+      return emotion.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n        cursor: default;\n        color: ", ";\n      "])), t.inputIconColorDisabled);
+    },
+    text: function text(t) {
+      return emotion.css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n        color: ", ";\n      "])), t.inputPlaceholderColor);
+    },
+    textDisabled: function textDisabled(t) {
+      return emotion.css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n        color: ", ";\n      "])), t.inputPlaceholderColorDisabled);
+    }
+  };
 });

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 type { 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","memoizeGetStyles","getStyles","getStylesLayout","emotion","styles","root","t","input","css","_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 type { Emotion } from '@emotion/css/types/create-instance';\n\nimport { ZERO_WIDTH_SPACE_CSS } from '../../../lib/chars';\nimport { memoizeGetStyles } from '../../../lib/theming/Emotion';\nimport type { Theme } from '../../../lib/theming/Theme';\nimport { getStyles } from '../Input.styles';\n\nexport const getStylesLayout = memoizeGetStyles((emotion: Emotion) => {\n  const styles = getStyles(emotion);\n\n  return {\n    root(t: Theme) {\n      return styles.root(t);\n    },\n    input() {\n      return emotion.css`\n        min-width: 0;\n        overflow: hidden;\n        position: relative;\n        width: 100%;\n        display: flex;\n      `;\n    },\n    aside() {\n      return emotion.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 emotion.css`\n        color: ${t.inputIconColor};\n      `;\n    },\n    iconFocus(t: Theme) {\n      return emotion.css`\n        color: ${t.inputFocusedIconColor};\n      `;\n    },\n    iconDisabled(t: Theme) {\n      return emotion.css`\n        cursor: default;\n        color: ${t.inputIconColorDisabled};\n      `;\n    },\n    text(t: Theme) {\n      return emotion.css`\n        color: ${t.inputPlaceholderColor};\n      `;\n    },\n    textDisabled(t: Theme) {\n      return emotion.css`\n        color: ${t.inputPlaceholderColorDisabled};\n      `;\n    },\n  };\n});\n"],"mappings":";;AAEA,SAASA,oBAAoB,QAAQ,oBAAoB;AACzD,SAASC,gBAAgB,QAAQ,8BAA8B;;AAE/D,SAASC,SAAS,QAAQ,iBAAiB;;AAE3C,OAAO,IAAMC,eAAe,GAAGF,gBAAgB,CAAC,UAACG,OAAgB,EAAK;EACpE,IAAMC,MAAM,GAAGH,SAAS,CAACE,OAAO,CAAC;;EAEjC,OAAO;IACLE,IAAI,WAAAA,KAACC,CAAQ,EAAE;MACb,OAAOF,MAAM,CAACC,IAAI,CAACC,CAAC,CAAC;IACvB,CAAC;IACDC,KAAK,WAAAA,MAAA,EAAG;MACN,OAAOJ,OAAO,CAACK,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,2BAAA;;;;;;;IAOpB,CAAC;IACDC,KAAK,WAAAA,MAAA,EAAG;MACN,OAAOR,OAAO,CAACK,GAAG,CAAAI,gBAAA,KAAAA,gBAAA,GAAAF,2BAAA;;;;;;MAMFX,oBAAoB;;;IAGtC,CAAC;IACDc,IAAI,WAAAA,KAACP,CAAQ,EAAE;MACb,OAAOH,OAAO,CAACK,GAAG,CAAAM,gBAAA,KAAAA,gBAAA,GAAAJ,2BAAA;MACPJ,CAAC,CAACS,cAAc;;IAE7B,CAAC;IACDC,SAAS,WAAAA,UAACV,CAAQ,EAAE;MAClB,OAAOH,OAAO,CAACK,GAAG,CAAAS,gBAAA,KAAAA,gBAAA,GAAAP,2BAAA;MACPJ,CAAC,CAACY,qBAAqB;;IAEpC,CAAC;IACDC,YAAY,WAAAA,aAACb,CAAQ,EAAE;MACrB,OAAOH,OAAO,CAACK,GAAG,CAAAY,gBAAA,KAAAA,gBAAA,GAAAV,2BAAA;;MAEPJ,CAAC,CAACe,sBAAsB;;IAErC,CAAC;IACDC,IAAI,WAAAA,KAAChB,CAAQ,EAAE;MACb,OAAOH,OAAO,CAACK,GAAG,CAAAe,gBAAA,KAAAA,gBAAA,GAAAb,2BAAA;MACPJ,CAAC,CAACkB,qBAAqB;;IAEpC,CAAC;IACDC,YAAY,WAAAA,aAACnB,CAAQ,EAAE;MACrB,OAAOH,OAAO,CAACK,GAAG,CAAAkB,gBAAA,KAAAA,gBAAA,GAAAhB,2BAAA;MACPJ,CAAC,CAACqB,6BAA6B;;IAE5C;EACF,CAAC;AACH,CAAC,CAAC","ignoreList":[]}

package/components/Input/InputLayout/InputLayout.styles.d.ts

@@ -1,5 +1,5 @@
 import type { Theme } from '../../../lib/theming/Theme';
-export declare const stylesLayout: {
+export declare const getStylesLayout: import("../../../lib/theming/Emotion").StylesGetter<{
     root(t: Theme): string;
     input(): string;
     aside(): string;
@@ -8,4 +8,4 @@ export declare const stylesLayout: {
     iconDisabled(t: Theme): string;
     text(t: Theme): string;
     textDisabled(t: Theme): string;
-};
+}>;

package/components/Input/InputLayout/InputLayoutAside/InputLayoutAside.js

@@ -1,11 +1,13 @@
 import React from 'react';
-import { stylesLayout } from "../InputLayout.styles";
+import { useStyles } from "../../../../lib/renderEnvironment";
+import { getStylesLayout } from "../InputLayout.styles";
 import { InputLayoutAsideIcon } from "../InputLayoutAsideIcon";
 import { InputLayoutAsideText } from "../InputLayoutAsideText";
 export var InputLayoutAside = function InputLayoutAside(_ref) {
   var icon = _ref.icon,
     text = _ref.text,
     side = _ref.side;
+  var stylesLayout = useStyles(getStylesLayout);
   var asideClassName = stylesLayout.aside();
   var _icon = /*#__PURE__*/React.createElement(InputLayoutAsideIcon, {
     key: "icon",

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

@@ -1 +1 @@
-{"version":3,"names":["React","stylesLayout","InputLayoutAsideIcon","InputLayoutAsideText","InputLayoutAside","_ref","icon","text","side","asideClassName","aside","_icon","createElement","key","_text","child","className"],"sources":["InputLayoutAside.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { InputProps } from '../Input';\n\nimport { stylesLayout } from './InputLayout.styles';\nimport { InputLayoutAsideIcon } from './InputLayoutAsideIcon';\nimport { InputLayoutAsideText } from './InputLayoutAsideText';\n\nexport interface InputLayoutAsideProps {\n  icon: InputProps['leftIcon'] | InputProps['rightIcon'];\n  text: InputProps['prefix'] | InputProps['suffix'];\n  side: 'left' | 'right';\n}\n\nexport const InputLayoutAside: React.FunctionComponent<InputLayoutAsideProps> = ({ icon, text, side }) => {\n  const asideClassName = stylesLayout.aside();\n\n  const _icon = <InputLayoutAsideIcon key=\"icon\" icon={icon} side={side} />;\n  const _text = <InputLayoutAsideText key=\"text\" text={text} />;\n\n  const child = side === 'left' ? [_icon, _text] : [_text, _icon];\n\n  return <span className={asideClassName}>{child}</span>;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;;;;AAIzB,SAASC,YAAY,QAAQ,sBAAsB;AACnD,SAASC,oBAAoB,QAAQ,wBAAwB;AAC7D,SAASC,oBAAoB,QAAQ,wBAAwB;;;;;;;;AAQ7D,OAAO,IAAMC,gBAAgE,GAAG,SAAnEA,gBAAgEA,CAAAC,IAAA,EAA6B,KAAvBC,IAAI,GAAAD,IAAA,CAAJC,IAAI,CAAEC,IAAI,GAAAF,IAAA,CAAJE,IAAI,CAAEC,IAAI,GAAAH,IAAA,CAAJG,IAAI;EACjG,IAAMC,cAAc,GAAGR,YAAY,CAACS,KAAK,CAAC,CAAC;;EAE3C,IAAMC,KAAK,gBAAGX,KAAA,CAAAY,aAAA,CAACV,oBAAoB,IAACW,GAAG,EAAC,MAAM,EAACP,IAAI,EAAEA,IAAK,EAACE,IAAI,EAAEA,IAAK,EAAE,CAAC;EACzE,IAAMM,KAAK,gBAAGd,KAAA,CAAAY,aAAA,CAACT,oBAAoB,IAACU,GAAG,EAAC,MAAM,EAACN,IAAI,EAAEA,IAAK,EAAE,CAAC;;EAE7D,IAAMQ,KAAK,GAAGP,IAAI,KAAK,MAAM,GAAG,CAACG,KAAK,EAAEG,KAAK,CAAC,GAAG,CAACA,KAAK,EAAEH,KAAK,CAAC;;EAE/D,oBAAOX,KAAA,CAAAY,aAAA,WAAMI,SAAS,EAAEP,cAAe,IAAEM,KAAY,CAAC;AACxD,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useStyles","getStylesLayout","InputLayoutAsideIcon","InputLayoutAsideText","InputLayoutAside","_ref","icon","text","side","stylesLayout","asideClassName","aside","_icon","createElement","key","_text","child","className"],"sources":["InputLayoutAside.tsx"],"sourcesContent":["import React from 'react';\n\nimport { useStyles } from '../../../lib/renderEnvironment';\nimport type { InputProps } from '../Input';\n\nimport { getStylesLayout } from './InputLayout.styles';\nimport { InputLayoutAsideIcon } from './InputLayoutAsideIcon';\nimport { InputLayoutAsideText } from './InputLayoutAsideText';\n\nexport interface InputLayoutAsideProps {\n  icon: InputProps['leftIcon'] | InputProps['rightIcon'];\n  text: InputProps['prefix'] | InputProps['suffix'];\n  side: 'left' | 'right';\n}\n\nexport const InputLayoutAside: React.FunctionComponent<InputLayoutAsideProps> = ({ icon, text, side }) => {\n  const stylesLayout = useStyles(getStylesLayout);\n  const asideClassName = stylesLayout.aside();\n\n  const _icon = <InputLayoutAsideIcon key=\"icon\" icon={icon} side={side} />;\n  const _text = <InputLayoutAsideText key=\"text\" text={text} />;\n\n  const child = side === 'left' ? [_icon, _text] : [_text, _icon];\n\n  return <span className={asideClassName}>{child}</span>;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;;AAEzB,SAASC,SAAS,QAAQ,gCAAgC;;;AAG1D,SAASC,eAAe,QAAQ,sBAAsB;AACtD,SAASC,oBAAoB,QAAQ,wBAAwB;AAC7D,SAASC,oBAAoB,QAAQ,wBAAwB;;;;;;;;AAQ7D,OAAO,IAAMC,gBAAgE,GAAG,SAAnEA,gBAAgEA,CAAAC,IAAA,EAA6B,KAAvBC,IAAI,GAAAD,IAAA,CAAJC,IAAI,CAAEC,IAAI,GAAAF,IAAA,CAAJE,IAAI,CAAEC,IAAI,GAAAH,IAAA,CAAJG,IAAI;EACjG,IAAMC,YAAY,GAAGT,SAAS,CAACC,eAAe,CAAC;EAC/C,IAAMS,cAAc,GAAGD,YAAY,CAACE,KAAK,CAAC,CAAC;;EAE3C,IAAMC,KAAK,gBAAGb,KAAA,CAAAc,aAAA,CAACX,oBAAoB,IAACY,GAAG,EAAC,MAAM,EAACR,IAAI,EAAEA,IAAK,EAACE,IAAI,EAAEA,IAAK,EAAE,CAAC;EACzE,IAAMO,KAAK,gBAAGhB,KAAA,CAAAc,aAAA,CAACV,oBAAoB,IAACW,GAAG,EAAC,MAAM,EAACP,IAAI,EAAEA,IAAK,EAAE,CAAC;;EAE7D,IAAMS,KAAK,GAAGR,IAAI,KAAK,MAAM,GAAG,CAACI,KAAK,EAAEG,KAAK,CAAC,GAAG,CAACA,KAAK,EAAEH,KAAK,CAAC;;EAE/D,oBAAOb,KAAA,CAAAc,aAAA,WAAMI,SAAS,EAAEP,cAAe,IAAEM,KAAY,CAAC;AACxD,CAAC","ignoreList":[]}