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

package/components/PasswordInput/PasswordInput/PasswordInput.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","PropTypes","globalObject","isBrowser","locale","RenderLayer","isNonNullable","isKeyCapsLock","KeyboardEventCodes","Codes","Input","isIE11","CommonWrapper","ThemeContext","cx","rootNode","createPropsGetter","styles","PasswordInputIcon","PasswordInputLocaleHelper","PasswordInputDataTids","root","capsLockDetector","eyeIcon","PasswordInput","_dec","_class","_PasswordInput","_React$PureComponent","_this","_len","arguments","length","args","Array","_key","call","apply","concat","getProps","defaultProps","state","visible","capsLockEnabled","focus","input","blur","handleBlur","handleKeyPress","e","_this$props","props","onKeyPress","detectCapsLock","getModifierState","CapsLock","setState","handleKeydown","_this2","_this2$props","onKeyDown","handleToggleVisibility","prevState","handleFocus","renderEye","createElement","className","iconWrapper","toggleVisibility","theme","getEyeWrapperClassname","disabled","type","eyeClosedAriaLabel","eyeOpenedAriaLabel","onClick","icon","size","refInput","element","hideSymbols","renderMain","rest","_objectWithoutPropertiesLoose","_excluded","inputProps","_extends","rightIcon","onFocusOutside","onClickOutside","ref","_inheritsLoose","_proto","prototype","componentDidMount","document","msCapsLockWarningOff","getDerivedStateFromProps","render","_this3","Consumer","rootNodeRef","setRootNode","eyeWrapperLarge","eyeWrapperMedium","eyeWrapperSmall","PureComponent","__KONTUR_REACT_UI__","displayName","propTypes","bool"],"sources":["PasswordInput.tsx"],"sourcesContent":["import React, { AriaAttributes } from 'react';\nimport PropTypes from 'prop-types';\nimport { globalObject, isBrowser } from '@skbkontur/global-object';\n\nimport { locale } from '../../lib/locale/decorators';\nimport { RenderLayer } from '../../internal/RenderLayer';\nimport { isNonNullable } from '../../lib/utils';\nimport { isKeyCapsLock } from '../../lib/events/keyboard/identifiers';\nimport { KeyboardEventCodes as Codes } from '../../lib/events/keyboard/KeyboardEventCodes';\nimport { Input, InputProps } from '../Input';\nimport { Nullable } from '../../typings/utility-types';\nimport { isIE11 } from '../../lib/client';\nimport { CommonWrapper, CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { styles } from './PasswordInput.styles';\nimport { PasswordInputIcon } from './PasswordInputIcon';\nimport { PasswordInputLocale, PasswordInputLocaleHelper } from './locale';\n\nexport interface PasswordInputProps extends Pick<AriaAttributes, 'aria-label'>, CommonProps, InputProps {\n  /** Включает CapsLock детектор. */\n  detectCapsLock?: boolean;\n}\n\nexport interface PasswordInputState {\n  visible: boolean;\n  capsLockEnabled?: boolean | null;\n}\n\nexport const PasswordInputDataTids = {\n  root: 'PasswordInput',\n  capsLockDetector: 'PasswordInputCapsLockDetector',\n  eyeIcon: 'PasswordInputEyeIcon',\n} as const;\n\ntype DefaultProps = Required<Pick<PasswordInputProps, 'size'>>;\n\n/**\n * `PasswordInput` — однострочное поле для ввода пароля, в котором символы заменяются на точки.\n *\n * Не используйте такое поле для ввода одноразовых кодов из смс. У них короткий срок действия и используются они только один раз.\n */\n@rootNode\n@locale('PasswordInput', PasswordInputLocaleHelper)\nexport class PasswordInput extends React.PureComponent<PasswordInputProps, PasswordInputState> {\n  public static __KONTUR_REACT_UI__ = 'PasswordInput';\n  public static displayName = 'PasswordInput';\n\n  public static propTypes = {\n    /**\n     * Включает CapsLock детектор\n     */\n    detectCapsLock: PropTypes.bool,\n  };\n\n  public static defaultProps: DefaultProps = {\n    size: 'small',\n  };\n\n  private getProps = createPropsGetter(PasswordInput.defaultProps);\n\n  public state: PasswordInputState = {\n    visible: false,\n    capsLockEnabled: false,\n  };\n\n  private theme!: Theme;\n\n  private input: Nullable<Input>;\n  private setRootNode!: TSetRootNode;\n  private readonly locale!: PasswordInputLocale;\n\n  public componentDidMount() {\n    if (this.props.detectCapsLock) {\n      this.setState({ capsLockEnabled: null });\n    }\n\n    // @ts-expect-error: IE-specific API.\n    if (isIE11 && isBrowser(globalObject) && !globalObject.document.msCapsLockWarningOff) {\n      // @ts-expect-error: Read the comment above.\n      // turns off default ie capslock warning\n      globalObject.document.msCapsLockWarningOff = true;\n    }\n  }\n\n  public static getDerivedStateFromProps(props: PasswordInputProps, state: PasswordInputState) {\n    if (props.disabled) {\n      return { visible: false };\n    }\n\n    return state;\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n              {this.renderMain(this.props)}\n            </CommonWrapper>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  /**\n   * @public\n   */\n  public focus = () => {\n    if (this.input) {\n      this.input.focus();\n    }\n  };\n\n  /**\n   * @public\n   */\n  public blur = () => {\n    this.handleBlur();\n  };\n\n  private handleKeyPress = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    const { onKeyPress, detectCapsLock } = this.props;\n\n    if (onKeyPress) {\n      onKeyPress(e);\n    }\n\n    if (!detectCapsLock) {\n      return;\n    }\n\n    const capsLockEnabled = e.getModifierState(Codes.CapsLock);\n\n    this.setState({ capsLockEnabled });\n  };\n\n  private handleKeydown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    const {\n      props: { detectCapsLock, onKeyDown },\n      state: { capsLockEnabled },\n    } = this;\n\n    if (onKeyDown) {\n      onKeyDown(e);\n    }\n\n    if (!detectCapsLock) {\n      return;\n    }\n\n    if (isKeyCapsLock(e) && isNonNullable(capsLockEnabled)) {\n      this.setState({ capsLockEnabled: !capsLockEnabled });\n    }\n  };\n\n  private handleToggleVisibility = () => {\n    this.setState((prevState) => ({ visible: !prevState.visible }), this.handleFocus);\n  };\n\n  private handleFocus = () => {\n    if (this.input) {\n      this.input.focus();\n    }\n  };\n\n  private handleBlur = () => {\n    if (this.input) {\n      this.input.blur();\n    }\n  };\n\n  private getEyeWrapperClassname() {\n    switch (this.getProps().size) {\n      case 'large':\n        return styles.eyeWrapperLarge(this.theme);\n      case 'medium':\n        return styles.eyeWrapperMedium(this.theme);\n      case 'small':\n      default:\n        return styles.eyeWrapperSmall(this.theme);\n    }\n  }\n\n  private renderEye = () => {\n    const { capsLockEnabled } = this.state;\n\n    return (\n      <span className={styles.iconWrapper()}>\n        {capsLockEnabled && (\n          <span className={styles.capsLockDetector()} data-tid={PasswordInputDataTids.capsLockDetector} />\n        )}\n        <span className={cx(styles.toggleVisibility(this.theme), this.getEyeWrapperClassname())}>\n          {!this.props.disabled && (\n            <button\n              type=\"button\"\n              aria-label={this.state.visible ? this.locale.eyeClosedAriaLabel : this.locale.eyeOpenedAriaLabel}\n              onClick={this.handleToggleVisibility}\n              className={styles.icon()}\n              data-tid={PasswordInputDataTids.eyeIcon}\n            >\n              <PasswordInputIcon size={this.props.size} visible={this.state.visible} />\n            </button>\n          )}\n        </span>\n      </span>\n    );\n  };\n\n  private refInput = (element: Input) => {\n    this.input = element;\n  };\n\n  private hideSymbols = () => {\n    this.setState({ visible: false });\n  };\n\n  private renderMain = (props: CommonWrapperRestProps<PasswordInputProps>) => {\n    const { detectCapsLock, ...rest } = props;\n    const inputProps = {\n      ...rest,\n      onKeyDown: this.handleKeydown,\n      onKeyPress: this.handleKeyPress,\n      rightIcon: this.renderEye(),\n    };\n\n    return (\n      <RenderLayer onFocusOutside={this.hideSymbols} onClickOutside={this.hideSymbols}>\n        <div data-tid={PasswordInputDataTids.root} className={styles.root()}>\n          <Input ref={this.refInput} type={this.state.visible ? 'text' : 'password'} {...inputProps} />\n        </div>\n      </RenderLayer>\n    );\n  };\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","PropTypes","globalObject","isBrowser","locale","RenderLayer","isNonNullable","isKeyCapsLock","KeyboardEventCodes","Codes","Input","isIE11","CommonWrapper","ThemeContext","cx","rootNode","createPropsGetter","styles","PasswordInputIcon","PasswordInputLocaleHelper","PasswordInputDataTids","root","capsLockDetector","eyeIcon","PasswordInput","_dec","_class","_PasswordInput","_React$PureComponent","_this","_len","arguments","length","args","Array","_key","call","apply","concat","getProps","defaultProps","state","visible","focused","capsLockEnabled","focus","input","blur","handleKeyPress","e","_this$props","props","onKeyPress","detectCapsLock","getModifierState","CapsLock","setState","handleKeydown","_this2","_this2$props","onKeyDown","handleToggleVisibility","prevState","focusOnInput","handleFocus","event","onFocus","handleFocusOutside","hideSymbols","renderEye","createElement","className","iconWrapper","toggleVisibility","theme","getEyeWrapperClassname","disabled","type","eyeClosedAriaLabel","eyeOpenedAriaLabel","onClick","icon","size","refInput","element","renderMain","rest","_objectWithoutPropertiesLoose","_excluded","inputProps","_extends","rightIcon","active","onFocusOutside","onClickOutside","ref","_inheritsLoose","_proto","prototype","componentDidMount","document","msCapsLockWarningOff","getDerivedStateFromProps","render","_this3","Consumer","rootNodeRef","setRootNode","eyeWrapperLarge","eyeWrapperMedium","eyeWrapperSmall","PureComponent","__KONTUR_REACT_UI__","displayName","propTypes","bool"],"sources":["PasswordInput.tsx"],"sourcesContent":["import React, { AriaAttributes } from 'react';\nimport PropTypes from 'prop-types';\nimport { globalObject, isBrowser } from '@skbkontur/global-object';\n\nimport { locale } from '../../lib/locale/decorators';\nimport { RenderLayer } from '../../internal/RenderLayer';\nimport { isNonNullable } from '../../lib/utils';\nimport { isKeyCapsLock } from '../../lib/events/keyboard/identifiers';\nimport { KeyboardEventCodes as Codes } from '../../lib/events/keyboard/KeyboardEventCodes';\nimport { Input, InputProps } from '../Input';\nimport { Nullable } from '../../typings/utility-types';\nimport { isIE11 } from '../../lib/client';\nimport { CommonWrapper, CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { styles } from './PasswordInput.styles';\nimport { PasswordInputIcon } from './PasswordInputIcon';\nimport { PasswordInputLocale, PasswordInputLocaleHelper } from './locale';\n\nexport interface PasswordInputProps extends Pick<AriaAttributes, 'aria-label'>, CommonProps, InputProps {\n  /** Включает CapsLock детектор. */\n  detectCapsLock?: boolean;\n}\n\nexport interface PasswordInputState {\n  visible: boolean;\n  focused: boolean;\n  capsLockEnabled?: boolean | null;\n}\n\nexport const PasswordInputDataTids = {\n  root: 'PasswordInput',\n  capsLockDetector: 'PasswordInputCapsLockDetector',\n  eyeIcon: 'PasswordInputEyeIcon',\n} as const;\n\ntype DefaultProps = Required<Pick<PasswordInputProps, 'size'>>;\n\n/**\n * `PasswordInput` — однострочное поле для ввода пароля, в котором символы заменяются на точки.\n *\n * Не используйте такое поле для ввода одноразовых кодов из смс. У них короткий срок действия и используются они только один раз.\n */\n@rootNode\n@locale('PasswordInput', PasswordInputLocaleHelper)\nexport class PasswordInput extends React.PureComponent<PasswordInputProps, PasswordInputState> {\n  public static __KONTUR_REACT_UI__ = 'PasswordInput';\n  public static displayName = 'PasswordInput';\n\n  public static propTypes = {\n    /**\n     * Включает CapsLock детектор\n     */\n    detectCapsLock: PropTypes.bool,\n  };\n\n  public static defaultProps: DefaultProps = {\n    size: 'small',\n  };\n\n  private getProps = createPropsGetter(PasswordInput.defaultProps);\n\n  public state: PasswordInputState = {\n    visible: false,\n    focused: false,\n    capsLockEnabled: false,\n  };\n\n  private theme!: Theme;\n\n  private input: Nullable<Input>;\n  private setRootNode!: TSetRootNode;\n  private readonly locale!: PasswordInputLocale;\n\n  public componentDidMount() {\n    if (this.props.detectCapsLock) {\n      this.setState({ capsLockEnabled: null });\n    }\n\n    // @ts-expect-error: IE-specific API.\n    if (isIE11 && isBrowser(globalObject) && !globalObject.document.msCapsLockWarningOff) {\n      // @ts-expect-error: Read the comment above.\n      // turns off default ie capslock warning\n      globalObject.document.msCapsLockWarningOff = true;\n    }\n  }\n\n  public static getDerivedStateFromProps(props: PasswordInputProps, state: PasswordInputState) {\n    if (props.disabled) {\n      return { visible: false };\n    }\n\n    return state;\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n              {this.renderMain}\n            </CommonWrapper>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  /**\n   * @public\n   */\n  public focus = () => {\n    if (this.input) {\n      this.input.focus();\n    }\n  };\n\n  /**\n   * @public\n   */\n  public blur = () => {\n    if (this.input) {\n      this.input.blur();\n    }\n  };\n\n  private handleKeyPress = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    const { onKeyPress, detectCapsLock } = this.props;\n\n    if (onKeyPress) {\n      onKeyPress(e);\n    }\n\n    if (!detectCapsLock) {\n      return;\n    }\n\n    const capsLockEnabled = e.getModifierState(Codes.CapsLock);\n\n    this.setState({ capsLockEnabled });\n  };\n\n  private handleKeydown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    const {\n      props: { detectCapsLock, onKeyDown },\n      state: { capsLockEnabled },\n    } = this;\n\n    if (onKeyDown) {\n      onKeyDown(e);\n    }\n\n    if (!detectCapsLock) {\n      return;\n    }\n\n    if (isKeyCapsLock(e) && isNonNullable(capsLockEnabled)) {\n      this.setState({ capsLockEnabled: !capsLockEnabled });\n    }\n  };\n\n  private handleToggleVisibility = () => {\n    this.setState((prevState) => ({ visible: !prevState.visible }), this.focusOnInput);\n  };\n\n  private focusOnInput = () => {\n    if (this.input) {\n      this.input.focus();\n    }\n  };\n\n  private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n    if (this.state.focused) {\n      return;\n    }\n\n    this.setState({ focused: true });\n\n    if (this.props.onFocus) {\n      this.props.onFocus(event);\n    }\n  };\n\n  private handleFocusOutside = () => {\n    this.hideSymbols();\n\n    if (this.state.focused) {\n      this.setState({ focused: false });\n    }\n  };\n\n  private getEyeWrapperClassname() {\n    switch (this.getProps().size) {\n      case 'large':\n        return styles.eyeWrapperLarge(this.theme);\n      case 'medium':\n        return styles.eyeWrapperMedium(this.theme);\n      case 'small':\n      default:\n        return styles.eyeWrapperSmall(this.theme);\n    }\n  }\n\n  private renderEye = () => {\n    const { capsLockEnabled } = this.state;\n\n    return (\n      <span className={styles.iconWrapper()}>\n        {capsLockEnabled && (\n          <span className={styles.capsLockDetector()} data-tid={PasswordInputDataTids.capsLockDetector} />\n        )}\n        <span className={cx(styles.toggleVisibility(this.theme), this.getEyeWrapperClassname())}>\n          {!this.props.disabled && (\n            <button\n              type=\"button\"\n              aria-label={this.state.visible ? this.locale.eyeClosedAriaLabel : this.locale.eyeOpenedAriaLabel}\n              onClick={this.handleToggleVisibility}\n              className={styles.icon()}\n              data-tid={PasswordInputDataTids.eyeIcon}\n            >\n              <PasswordInputIcon size={this.props.size} visible={this.state.visible} />\n            </button>\n          )}\n        </span>\n      </span>\n    );\n  };\n\n  private refInput = (element: Input) => {\n    this.input = element;\n  };\n\n  private hideSymbols = () => {\n    this.setState({ visible: false });\n  };\n\n  private renderMain = (props: CommonWrapperRestProps<PasswordInputProps>) => {\n    const { detectCapsLock, ...rest } = props;\n    const inputProps = {\n      ...rest,\n      onKeyDown: this.handleKeydown,\n      onKeyPress: this.handleKeyPress,\n      rightIcon: this.renderEye(),\n      onFocus: this.handleFocus,\n    };\n\n    return (\n      <RenderLayer\n        active={this.state.focused}\n        onFocusOutside={this.handleFocusOutside}\n        onClickOutside={this.handleFocusOutside}\n      >\n        <div data-tid={PasswordInputDataTids.root} className={styles.root()}>\n          <Input ref={this.refInput} type={this.state.visible ? 'text' : 'password'} {...inputProps} />\n        </div>\n      </RenderLayer>\n    );\n  };\n}\n"],"mappings":"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","ignoreList":[]}

package/components/PasswordInput/PasswordInput.d.ts

@@ -8,6 +8,7 @@ export interface PasswordInputProps extends Pick<AriaAttributes, 'aria-label'>,
 }
 export interface PasswordInputState {
     visible: boolean;
+    focused: boolean;
     capsLockEnabled?: boolean | null;
 }
 export declare const PasswordInputDataTids: {
@@ -38,7 +39,9 @@ export declare class PasswordInput extends React.PureComponent<PasswordInputProp
     private setRootNode;
     private readonly locale;
     componentDidMount(): void;
-    static getDerivedStateFromProps(props: PasswordInputProps, state: PasswordInputState): PasswordInputState;
+    static getDerivedStateFromProps(props: PasswordInputProps, state: PasswordInputState): PasswordInputState | {
+        visible: boolean;
+    };
     render(): React.JSX.Element;
     /**
      * @public
@@ -51,8 +54,9 @@ export declare class PasswordInput extends React.PureComponent<PasswordInputProp
     private handleKeyPress;
     private handleKeydown;
     private handleToggleVisibility;
+    private focusOnInput;
     private handleFocus;
-    private handleBlur;
+    private handleFocusOutside;
     private getEyeWrapperClassname;
     private renderEye;
     private refInput;

package/components/PasswordInput/PasswordInput.styles/PasswordInput.styles.js

@@ -1,29 +1,58 @@
-import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
+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, memoizeStyle } from "../../../lib/theming/Emotion";
 export var styles = memoizeStyle({
   root: function root() {
-    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      position: relative;\n      display: inline-block;\n      line-height: normal;\n\n      input::-ms-clear,\n      input::-ms-reveal {\n        display: none;\n      }\n    "])));
+    return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? {
+      name: "15ycz3z",
+      styles: "position:relative;display:inline-block;line-height:normal;input::-ms-clear,input::-ms-reveal{display:none;}"
+    } : {
+      name: "d9254w-root",
+      styles: "position:relative;display:inline-block;line-height:normal;input::-ms-clear,input::-ms-reveal{display:none;};label:root;",
+      toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+    });
   },
   toggleVisibility: function toggleVisibility(t) {
-    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n      cursor: pointer;\n      opacity: ", ";\n      user-select: none;\n\n      &:hover {\n        color: ", ";\n        opacity: ", ";\n      }\n    "])), t.passwordInputVisibilityIconColor, t.passwordInputVisibilityIconOpacity, t.passwordInputVisibilityIconHoverColor, t.passwordInputVisibilityIconHoverOpacity);
+    return /*#__PURE__*/css("color:", t.passwordInputVisibilityIconColor, ";cursor:pointer;opacity:", t.passwordInputVisibilityIconOpacity, ";user-select:none;&:hover{color:", t.passwordInputVisibilityIconHoverColor, ";opacity:", t.passwordInputVisibilityIconHoverOpacity, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:toggleVisibility;"));
   },
   capsLockDetector: function capsLockDetector() {
-    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      font-size: 9px;\n      margin-right: 8px;\n      color: #fff;\n      cursor: default;\n      background: #999;\n      padding: 2px 5px;\n      border-radius: 3px;\n      z-index: 9;\n      box-sizing: border-box;\n      line-height: normal;\n\n      &::before {\n        content: 'CapsLock';\n      }\n    "])));
+    return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? {
+      name: "u3bhmh",
+      styles: "display:inline-block;font-size:9px;margin-right:8px;color:#fff;cursor:default;background:#999;padding:2px 5px;border-radius:3px;z-index:9;box-sizing:border-box;line-height:normal;&::before{content:'CapsLock';}"
+    } : {
+      name: "1e3dvv2-capsLockDetector",
+      styles: "display:inline-block;font-size:9px;margin-right:8px;color:#fff;cursor:default;background:#999;padding:2px 5px;border-radius:3px;z-index:9;box-sizing:border-box;line-height:normal;&::before{content:'CapsLock';};label:capsLockDetector;",
+      toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+    });
   },
   iconWrapper: function iconWrapper() {
-    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      display: flex;\n      align-items: center;\n      justify-content: flex-end;\n    "])));
+    return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? {
+      name: "19mh0x6",
+      styles: "display:flex;align-items:center;justify-content:flex-end"
+    } : {
+      name: "1lfmniz-iconWrapper",
+      styles: "display:flex;align-items:center;justify-content:flex-end;label:iconWrapper;",
+      toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+    });
   },
   eyeWrapperSmall: function eyeWrapperSmall(t) {
-    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      min-width: ", ";\n    "])), t.inputIconSizeSmall);
+    return /*#__PURE__*/css("min-width:", t.inputIconSizeSmall, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:eyeWrapperSmall;"));
   },
   eyeWrapperMedium: function eyeWrapperMedium(t) {
-    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      min-width: ", ";\n    "])), t.inputIconSizeMedium);
+    return /*#__PURE__*/css("min-width:", t.inputIconSizeMedium, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:eyeWrapperMedium;"));
   },
   eyeWrapperLarge: function eyeWrapperLarge(t) {
-    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      min-width: ", ";\n    "])), t.inputIconSizeLarge);
+    return /*#__PURE__*/css("min-width:", t.inputIconSizeLarge, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:eyeWrapperLarge;"));
   },
   icon: function icon() {
-    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      padding: 0;\n      border: none;\n      font: inherit;\n      color: inherit;\n      background-color: transparent;\n      cursor: pointer;\n    "])));
+    return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? {
+      name: "1ymgc3r",
+      styles: "padding:0;border:none;font:inherit;color:inherit;background-color:transparent;cursor:pointer"
+    } : {
+      name: "11kdt5n-icon",
+      styles: "padding:0;border:none;font:inherit;color:inherit;background-color:transparent;cursor:pointer;label:icon;",
+      toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+    });
   }
 });

package/components/PasswordInput/PasswordInput.styles/PasswordInput.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["css","memoizeStyle","styles","root","_templateObject","_taggedTemplateLiteralLoose","toggleVisibility","t","_templateObject2","passwordInputVisibilityIconColor","passwordInputVisibilityIconOpacity","passwordInputVisibilityIconHoverColor","passwordInputVisibilityIconHoverOpacity","capsLockDetector","_templateObject3","iconWrapper","_templateObject4","eyeWrapperSmall","_templateObject5","inputIconSizeSmall","eyeWrapperMedium","_templateObject6","inputIconSizeMedium","eyeWrapperLarge","_templateObject7","inputIconSizeLarge","icon","_templateObject8"],"sources":["PasswordInput.styles.ts"],"sourcesContent":["import { Theme } from '../../lib/theming/Theme';\nimport { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n  root() {\n    return css`\n      position: relative;\n      display: inline-block;\n      line-height: normal;\n\n      input::-ms-clear,\n      input::-ms-reveal {\n        display: none;\n      }\n    `;\n  },\n  toggleVisibility(t: Theme) {\n    return css`\n      color: ${t.passwordInputVisibilityIconColor};\n      cursor: pointer;\n      opacity: ${t.passwordInputVisibilityIconOpacity};\n      user-select: none;\n\n      &:hover {\n        color: ${t.passwordInputVisibilityIconHoverColor};\n        opacity: ${t.passwordInputVisibilityIconHoverOpacity};\n      }\n    `;\n  },\n  capsLockDetector() {\n    return css`\n      display: inline-block;\n      font-size: 9px;\n      margin-right: 8px;\n      color: #fff;\n      cursor: default;\n      background: #999;\n      padding: 2px 5px;\n      border-radius: 3px;\n      z-index: 9;\n      box-sizing: border-box;\n      line-height: normal;\n\n      &::before {\n        content: 'CapsLock';\n      }\n    `;\n  },\n  iconWrapper() {\n    return css`\n      display: flex;\n      align-items: center;\n      justify-content: flex-end;\n    `;\n  },\n\n  eyeWrapperSmall(t: Theme) {\n    return css`\n      min-width: ${t.inputIconSizeSmall};\n    `;\n  },\n\n  eyeWrapperMedium(t: Theme) {\n    return css`\n      min-width: ${t.inputIconSizeMedium};\n    `;\n  },\n\n  eyeWrapperLarge(t: Theme) {\n    return css`\n      min-width: ${t.inputIconSizeLarge};\n    `;\n  },\n  icon() {\n    return css`\n      padding: 0;\n      border: none;\n      font: inherit;\n      color: inherit;\n      background-color: transparent;\n      cursor: pointer;\n    `;\n  },\n});\n"],"mappings":";AACA,SAASA,GAAG,EAAEC,YAAY,QAAQ,2BAA2B;;AAE7D,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;EACjCE,IAAI,WAAAA,KAAA,EAAG;IACL,OAAOH,GAAG,CAAAI,eAAA,KAAAA,eAAA,GAAAC,2BAAA;;;;;;;;;;EAUZ,CAAC;EACDC,gBAAgB,WAAAA,iBAACC,CAAQ,EAAE;IACzB,OAAOP,GAAG,CAAAQ,gBAAA,KAAAA,gBAAA,GAAAH,2BAAA;IACCE,CAAC,CAACE,gCAAgC;;IAEhCF,CAAC,CAACG,kCAAkC;;;;IAIpCH,CAAC,CAACI,qCAAqC;IACrCJ,CAAC,CAACK,uCAAuC;;;EAG1D,CAAC;EACDC,gBAAgB,WAAAA,iBAAA,EAAG;IACjB,OAAOb,GAAG,CAAAc,gBAAA,KAAAA,gBAAA,GAAAT,2BAAA;;;;;;;;;;;;;;;;;EAiBZ,CAAC;EACDU,WAAW,WAAAA,YAAA,EAAG;IACZ,OAAOf,GAAG,CAAAgB,gBAAA,KAAAA,gBAAA,GAAAX,2BAAA;;;;;EAKZ,CAAC;;EAEDY,eAAe,WAAAA,gBAACV,CAAQ,EAAE;IACxB,OAAOP,GAAG,CAAAkB,gBAAA,KAAAA,gBAAA,GAAAb,2BAAA;IACKE,CAAC,CAACY,kBAAkB;;EAErC,CAAC;;EAEDC,gBAAgB,WAAAA,iBAACb,CAAQ,EAAE;IACzB,OAAOP,GAAG,CAAAqB,gBAAA,KAAAA,gBAAA,GAAAhB,2BAAA;IACKE,CAAC,CAACe,mBAAmB;;EAEtC,CAAC;;EAEDC,eAAe,WAAAA,gBAAChB,CAAQ,EAAE;IACxB,OAAOP,GAAG,CAAAwB,gBAAA,KAAAA,gBAAA,GAAAnB,2BAAA;IACKE,CAAC,CAACkB,kBAAkB;;EAErC,CAAC;EACDC,IAAI,WAAAA,KAAA,EAAG;IACL,OAAO1B,GAAG,CAAA2B,gBAAA,KAAAA,gBAAA,GAAAtB,2BAAA;;;;;;;;EAQZ;AACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["css","memoizeStyle","styles","root","process","env","NODE_ENV","name","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","toggleVisibility","t","passwordInputVisibilityIconColor","passwordInputVisibilityIconOpacity","passwordInputVisibilityIconHoverColor","passwordInputVisibilityIconHoverOpacity","capsLockDetector","iconWrapper","eyeWrapperSmall","inputIconSizeSmall","eyeWrapperMedium","inputIconSizeMedium","eyeWrapperLarge","inputIconSizeLarge","icon"],"sources":["PasswordInput.styles.ts"],"sourcesContent":["import { Theme } from '../../lib/theming/Theme';\nimport { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n  root() {\n    return css`\n      position: relative;\n      display: inline-block;\n      line-height: normal;\n\n      input::-ms-clear,\n      input::-ms-reveal {\n        display: none;\n      }\n    `;\n  },\n  toggleVisibility(t: Theme) {\n    return css`\n      color: ${t.passwordInputVisibilityIconColor};\n      cursor: pointer;\n      opacity: ${t.passwordInputVisibilityIconOpacity};\n      user-select: none;\n\n      &:hover {\n        color: ${t.passwordInputVisibilityIconHoverColor};\n        opacity: ${t.passwordInputVisibilityIconHoverOpacity};\n      }\n    `;\n  },\n  capsLockDetector() {\n    return css`\n      display: inline-block;\n      font-size: 9px;\n      margin-right: 8px;\n      color: #fff;\n      cursor: default;\n      background: #999;\n      padding: 2px 5px;\n      border-radius: 3px;\n      z-index: 9;\n      box-sizing: border-box;\n      line-height: normal;\n\n      &::before {\n        content: 'CapsLock';\n      }\n    `;\n  },\n  iconWrapper() {\n    return css`\n      display: flex;\n      align-items: center;\n      justify-content: flex-end;\n    `;\n  },\n\n  eyeWrapperSmall(t: Theme) {\n    return css`\n      min-width: ${t.inputIconSizeSmall};\n    `;\n  },\n\n  eyeWrapperMedium(t: Theme) {\n    return css`\n      min-width: ${t.inputIconSizeMedium};\n    `;\n  },\n\n  eyeWrapperLarge(t: Theme) {\n    return css`\n      min-width: ${t.inputIconSizeLarge};\n    `;\n  },\n  icon() {\n    return css`\n      padding: 0;\n      border: none;\n      font: inherit;\n      color: inherit;\n      background-color: transparent;\n      cursor: pointer;\n    `;\n  },\n});\n"],"mappings":";AACA,SAASA,GAAG,EAAEC,YAAY,QAAQ,2BAA2B;;AAE7D,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;EACjCE,IAAI,WAAAA,KAAA,EAAG;IACL,oBAAOH,GAAG,CAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,sBAAAC,IAAA,aAAAL,MAAA,sHAAAK,IAAA,iBAAAL,MAAA,6HAAAM,QAAA,EAAAC,gCAAA;;;;;;;;;;EAUZ,CAAC;EACDC,gBAAgB,WAAAA,iBAACC,CAAQ,EAAE;IACzB,oBAAOX,GAAG;IACCW,CAAC,CAACC,gCAAgC;;IAEhCD,CAAC,CAACE,kCAAkC;;;;IAIpCF,CAAC,CAACG,qCAAqC;IACrCH,CAAC,CAACI,uCAAuC,UAAAX,OAAA,CAAAC,GAAA,CAAAC,QAAA;;;EAG1D,CAAC;EACDU,gBAAgB,WAAAA,iBAAA,EAAG;IACjB,oBAAOhB,GAAG,CAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,sBAAAC,IAAA,YAAAL,MAAA,4NAAAK,IAAA,8BAAAL,MAAA,+OAAAM,QAAA,EAAAC,gCAAA;;;;;;;;;;;;;;;;;EAiBZ,CAAC;EACDQ,WAAW,WAAAA,YAAA,EAAG;IACZ,oBAAOjB,GAAG,CAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,sBAAAC,IAAA,aAAAL,MAAA,mEAAAK,IAAA,yBAAAL,MAAA,iFAAAM,QAAA,EAAAC,gCAAA;;;;;EAKZ,CAAC;;EAEDS,eAAe,WAAAA,gBAACP,CAAQ,EAAE;IACxB,oBAAOX,GAAG;IACKW,CAAC,CAACQ,kBAAkB,SAAAf,OAAA,CAAAC,GAAA,CAAAC,QAAA;;EAErC,CAAC;;EAEDc,gBAAgB,WAAAA,iBAACT,CAAQ,EAAE;IACzB,oBAAOX,GAAG;IACKW,CAAC,CAACU,mBAAmB,SAAAjB,OAAA,CAAAC,GAAA,CAAAC,QAAA;;EAEtC,CAAC;;EAEDgB,eAAe,WAAAA,gBAACX,CAAQ,EAAE;IACxB,oBAAOX,GAAG;IACKW,CAAC,CAACY,kBAAkB,SAAAnB,OAAA,CAAAC,GAAA,CAAAC,QAAA;;EAErC,CAAC;EACDkB,IAAI,WAAAA,KAAA,EAAG;IACL,oBAAOxB,GAAG,CAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,sBAAAC,IAAA,aAAAL,MAAA,uGAAAK,IAAA,kBAAAL,MAAA,8GAAAM,QAAA,EAAAC,gCAAA;;;;;;;;EAQZ;AACF,CAAC,CAAC","ignoreList":[]}

package/components/PasswordInput/__creevey__/PasswordInput.creevey.mts

@@ -0,0 +1,38 @@
+import { story, kind, test } from 'creevey';
+
+kind('PasswordInput', () => {
+  story('Plain', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: {
+        'flickering screenshot': { in: ['chrome2022'], tests: ['With typed password'] },
+      },
+    });
+
+    test('Plain', async (context) => {
+      await context.matchImage(await context.takeScreenshot(), 'Plain');
+    });
+
+    test('With typed password', async (context) => {
+      await context.webdriver
+        .actions({
+          bridge: true,
+        })
+        .click(context.webdriver.findElement({ css: '[type="password"]' }))
+        .sendKeys('Test...')
+        .perform();
+      await context.matchImage(await context.takeScreenshot(), 'With typed password');
+    });
+
+    test('With visible password', async (context) => {
+      await context.webdriver
+        .actions({
+          bridge: true,
+        })
+        .click(context.webdriver.findElement({ css: '[type="password"]' }))
+        .sendKeys('Test...')
+        .click(context.webdriver.findElement({ css: '[data-tid="PasswordInputEyeIcon"]' }))
+        .perform();
+      await context.matchImage(await context.takeScreenshot(), 'With visible password');
+    });
+  });
+});

package/components/Radio/Radio.mixins/Radio.mixins.js

@@ -1,10 +1,8 @@
-import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 import { css } from "../../../lib/theming/Emotion";
 import { getLabGrotesqueBaselineCompensation } from "../../../lib/styles/getLabGrotesqueBaselineCompensation";
 import { isChrome, isFirefox } from "../../../lib/client";
 export var radioSizeMixin = function radioSizeMixin(fontSize, lineHeight, paddingY, radioSize) {
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n    font-size: ", ";\n    line-height: ", ";\n    padding: ", " 0;\n    &::before {\n      width: ", ";\n    }\n  "])), fontSize, lineHeight, paddingY, radioSize);
+  return /*#__PURE__*/css("font-size:", fontSize, ";line-height:", lineHeight, ";padding:", paddingY, " 0;&::before{width:", radioSize, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:radioSizeMixin;"));
 };
 export var circleSizeMixin = function circleSizeMixin(labGrotesqueBaselineCompensation, fontSize, radioSize, radioBorderWidthCompensation, radioCircleOffsetY) {
   var labGrotesqueCompenstation = parseInt(labGrotesqueBaselineCompensation);
@@ -13,14 +11,14 @@ export var circleSizeMixin = function circleSizeMixin(labGrotesqueBaselineCompen
   var circleSize = "calc(" + radioSize + " - 2 * " + radioBorderWidthCompensation + ")";
   var circleOffsetY = "calc(" + radioCircleOffsetY + " + " + radioBorderWidthCompensation + " + " + baselineCompensation + "px)";
   var circleMarginX = radioBorderWidthCompensation;
-  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n    height: ", ";\n    width: ", ";\n    margin: ", " ", " 0;\n  "])), circleSize, circleSize, circleOffsetY, circleMarginX);
+  return /*#__PURE__*/css("height:", circleSize, ";width:", circleSize, ";margin:", circleOffsetY, " ", circleMarginX, " 0;" + (process.env.NODE_ENV === "production" ? "" : ";label:circleSizeMixin;"));
 };
 export var radioCheckedMixin = function radioCheckedMixin(bulletSize) {
-  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n    &::before {\n      height: ", ";\n      width: ", ";\n    }\n  "])), bulletSize, bulletSize);
+  return /*#__PURE__*/css("&::before{height:", bulletSize, ";width:", bulletSize, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:radioCheckedMixin;"));
 };
 export var afterOutlineMixin = function afterOutlineMixin(radioOutlineWidth) {
-  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n    content: ' ';\n    position: absolute;\n    top: -", ";\n    bottom: -", ";\n    left: -", ";\n    right: -", ";\n    border-width: ", ";\n    border-style: solid;\n    border-radius: 50%;\n    box-sizing: border-box;\n  "])), radioOutlineWidth, radioOutlineWidth, radioOutlineWidth, radioOutlineWidth, radioOutlineWidth);
+  return /*#__PURE__*/css("content:' ';position:absolute;top:-", radioOutlineWidth, ";bottom:-", radioOutlineWidth, ";left:-", radioOutlineWidth, ";right:-", radioOutlineWidth, ";border-width:", radioOutlineWidth, ";border-style:solid;border-radius:50%;box-sizing:border-box;" + (process.env.NODE_ENV === "production" ? "" : ";label:afterOutlineMixin;"));
 };
 export var outlineColorMixin = function outlineColorMixin(shadow, borderColor) {
-  return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n    box-shadow: ", ";\n    border-color: ", ";\n  "])), shadow, borderColor);
+  return /*#__PURE__*/css("box-shadow:", shadow, ";border-color:", borderColor, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:outlineColorMixin;"));
 };

package/components/Radio/Radio.mixins/Radio.mixins.js.map

@@ -1 +1 @@
-{"version":3,"names":["css","getLabGrotesqueBaselineCompensation","isChrome","isFirefox","radioSizeMixin","fontSize","lineHeight","paddingY","radioSize","_templateObject","_taggedTemplateLiteralLoose","circleSizeMixin","labGrotesqueBaselineCompensation","radioBorderWidthCompensation","radioCircleOffsetY","labGrotesqueCompenstation","parseInt","radioFontSize","baselineCompensation","circleSize","circleOffsetY","circleMarginX","_templateObject2","radioCheckedMixin","bulletSize","_templateObject3","afterOutlineMixin","radioOutlineWidth","_templateObject4","outlineColorMixin","shadow","borderColor","_templateObject5"],"sources":["Radio.mixins.ts"],"sourcesContent":["import { css } from '../../lib/theming/Emotion';\nimport { getLabGrotesqueBaselineCompensation } from '../../lib/styles/getLabGrotesqueBaselineCompensation';\nimport { isChrome, isFirefox } from '../../lib/client';\n\nexport const radioSizeMixin = (fontSize: string, lineHeight: string, paddingY: string, radioSize: string) => {\n  return css`\n    font-size: ${fontSize};\n    line-height: ${lineHeight};\n    padding: ${paddingY} 0;\n    &::before {\n      width: ${radioSize};\n    }\n  `;\n};\n\nexport const circleSizeMixin = (\n  labGrotesqueBaselineCompensation: string,\n  fontSize: string,\n  radioSize: string,\n  radioBorderWidthCompensation: string,\n  radioCircleOffsetY: string,\n) => {\n  const labGrotesqueCompenstation = parseInt(labGrotesqueBaselineCompensation);\n  const radioFontSize = parseInt(fontSize);\n\n  const baselineCompensation = getLabGrotesqueBaselineCompensation(\n    radioFontSize,\n    labGrotesqueCompenstation,\n    isChrome,\n    isFirefox,\n  );\n  const circleSize = `calc(${radioSize} - 2 * ${radioBorderWidthCompensation})`;\n  const circleOffsetY = `calc(${radioCircleOffsetY} + ${radioBorderWidthCompensation} + ${baselineCompensation}px)`;\n  const circleMarginX = radioBorderWidthCompensation;\n  return css`\n    height: ${circleSize};\n    width: ${circleSize};\n    margin: ${circleOffsetY} ${circleMarginX} 0;\n  `;\n};\n\nexport const radioCheckedMixin = (bulletSize: string) => {\n  return css`\n    &::before {\n      height: ${bulletSize};\n      width: ${bulletSize};\n    }\n  `;\n};\n\nexport const afterOutlineMixin = (radioOutlineWidth: string) => {\n  return css`\n    content: ' ';\n    position: absolute;\n    top: -${radioOutlineWidth};\n    bottom: -${radioOutlineWidth};\n    left: -${radioOutlineWidth};\n    right: -${radioOutlineWidth};\n    border-width: ${radioOutlineWidth};\n    border-style: solid;\n    border-radius: 50%;\n    box-sizing: border-box;\n  `;\n};\n\nexport const outlineColorMixin = (shadow: string, borderColor: string) => {\n  return css`\n    box-shadow: ${shadow};\n    border-color: ${borderColor};\n  `;\n};\n"],"mappings":"4LAAA,SAASA,GAAG,QAAQ,2BAA2B;AAC/C,SAASC,mCAAmC,QAAQ,sDAAsD;AAC1G,SAASC,QAAQ,EAAEC,SAAS,QAAQ,kBAAkB;;AAEtD,OAAO,IAAMC,cAAc,GAAG,SAAjBA,cAAcA,CAAIC,QAAgB,EAAEC,UAAkB,EAAEC,QAAgB,EAAEC,SAAiB,EAAK;EAC3G,OAAOR,GAAG,CAAAS,eAAA,KAAAA,eAAA,GAAAC,2BAAA;EACKL,QAAQ;EACNC,UAAU;EACdC,QAAQ;;EAERC,SAAS;;;AAGxB,CAAC;;AAED,OAAO,IAAMG,eAAe,GAAG,SAAlBA,eAAeA;AAC1BC,gCAAwC;AACxCP,QAAgB;AAChBG,SAAiB;AACjBK,4BAAoC;AACpCC,kBAA0B;AACvB;EACH,IAAMC,yBAAyB,GAAGC,QAAQ,CAACJ,gCAAgC,CAAC;EAC5E,IAAMK,aAAa,GAAGD,QAAQ,CAACX,QAAQ,CAAC;;EAExC,IAAMa,oBAAoB,GAAGjB,mCAAmC;IAC9DgB,aAAa;IACbF,yBAAyB;IACzBb,QAAQ;IACRC;EACF,CAAC;EACD,IAAMgB,UAAU,aAAWX,SAAS,eAAUK,4BAA4B,MAAG;EAC7E,IAAMO,aAAa,aAAWN,kBAAkB,WAAMD,4BAA4B,WAAMK,oBAAoB,QAAK;EACjH,IAAMG,aAAa,GAAGR,4BAA4B;EAClD,OAAOb,GAAG,CAAAsB,gBAAA,KAAAA,gBAAA,GAAAZ,2BAAA;EACES,UAAU;EACXA,UAAU;EACTC,aAAa,EAAIC,aAAa;;AAE5C,CAAC;;AAED,OAAO,IAAME,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIC,UAAkB,EAAK;EACvD,OAAOxB,GAAG,CAAAyB,gBAAA,KAAAA,gBAAA,GAAAf,2BAAA;;EAEIc,UAAU;EACXA,UAAU;;;AAGzB,CAAC;;AAED,OAAO,IAAME,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIC,iBAAyB,EAAK;EAC9D,OAAO3B,GAAG,CAAA4B,gBAAA,KAAAA,gBAAA,GAAAlB,2BAAA;;;EAGAiB,iBAAiB;EACdA,iBAAiB;EACnBA,iBAAiB;EAChBA,iBAAiB;EACXA,iBAAiB;;;;;AAKrC,CAAC;;AAED,OAAO,IAAME,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIC,MAAc,EAAEC,WAAmB,EAAK;EACxE,OAAO/B,GAAG,CAAAgC,gBAAA,KAAAA,gBAAA,GAAAtB,2BAAA;EACMoB,MAAM;EACJC,WAAW;;AAE/B,CAAC","ignoreList":[]}
+{"version":3,"names":["css","getLabGrotesqueBaselineCompensation","isChrome","isFirefox","radioSizeMixin","fontSize","lineHeight","paddingY","radioSize","process","env","NODE_ENV","circleSizeMixin","labGrotesqueBaselineCompensation","radioBorderWidthCompensation","radioCircleOffsetY","labGrotesqueCompenstation","parseInt","radioFontSize","baselineCompensation","circleSize","circleOffsetY","circleMarginX","radioCheckedMixin","bulletSize","afterOutlineMixin","radioOutlineWidth","outlineColorMixin","shadow","borderColor"],"sources":["Radio.mixins.ts"],"sourcesContent":["import { css } from '../../lib/theming/Emotion';\nimport { getLabGrotesqueBaselineCompensation } from '../../lib/styles/getLabGrotesqueBaselineCompensation';\nimport { isChrome, isFirefox } from '../../lib/client';\n\nexport const radioSizeMixin = (fontSize: string, lineHeight: string, paddingY: string, radioSize: string) => {\n  return css`\n    font-size: ${fontSize};\n    line-height: ${lineHeight};\n    padding: ${paddingY} 0;\n    &::before {\n      width: ${radioSize};\n    }\n  `;\n};\n\nexport const circleSizeMixin = (\n  labGrotesqueBaselineCompensation: string,\n  fontSize: string,\n  radioSize: string,\n  radioBorderWidthCompensation: string,\n  radioCircleOffsetY: string,\n) => {\n  const labGrotesqueCompenstation = parseInt(labGrotesqueBaselineCompensation);\n  const radioFontSize = parseInt(fontSize);\n\n  const baselineCompensation = getLabGrotesqueBaselineCompensation(\n    radioFontSize,\n    labGrotesqueCompenstation,\n    isChrome,\n    isFirefox,\n  );\n  const circleSize = `calc(${radioSize} - 2 * ${radioBorderWidthCompensation})`;\n  const circleOffsetY = `calc(${radioCircleOffsetY} + ${radioBorderWidthCompensation} + ${baselineCompensation}px)`;\n  const circleMarginX = radioBorderWidthCompensation;\n  return css`\n    height: ${circleSize};\n    width: ${circleSize};\n    margin: ${circleOffsetY} ${circleMarginX} 0;\n  `;\n};\n\nexport const radioCheckedMixin = (bulletSize: string) => {\n  return css`\n    &::before {\n      height: ${bulletSize};\n      width: ${bulletSize};\n    }\n  `;\n};\n\nexport const afterOutlineMixin = (radioOutlineWidth: string) => {\n  return css`\n    content: ' ';\n    position: absolute;\n    top: -${radioOutlineWidth};\n    bottom: -${radioOutlineWidth};\n    left: -${radioOutlineWidth};\n    right: -${radioOutlineWidth};\n    border-width: ${radioOutlineWidth};\n    border-style: solid;\n    border-radius: 50%;\n    box-sizing: border-box;\n  `;\n};\n\nexport const outlineColorMixin = (shadow: string, borderColor: string) => {\n  return css`\n    box-shadow: ${shadow};\n    border-color: ${borderColor};\n  `;\n};\n"],"mappings":"AAAA,SAASA,GAAG,QAAQ,2BAA2B;AAC/C,SAASC,mCAAmC,QAAQ,sDAAsD;AAC1G,SAASC,QAAQ,EAAEC,SAAS,QAAQ,kBAAkB;;AAEtD,OAAO,IAAMC,cAAc,GAAG,SAAjBA,cAAcA,CAAIC,QAAgB,EAAEC,UAAkB,EAAEC,QAAgB,EAAEC,SAAiB,EAAK;EAC3G,oBAAOR,GAAG;EACKK,QAAQ;EACNC,UAAU;EACdC,QAAQ;;EAERC,SAAS,UAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;;;AAGxB,CAAC;;AAED,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAeA;AAC1BC,gCAAwC;AACxCR,QAAgB;AAChBG,SAAiB;AACjBM,4BAAoC;AACpCC,kBAA0B;AACvB;EACH,IAAMC,yBAAyB,GAAGC,QAAQ,CAACJ,gCAAgC,CAAC;EAC5E,IAAMK,aAAa,GAAGD,QAAQ,CAACZ,QAAQ,CAAC;;EAExC,IAAMc,oBAAoB,GAAGlB,mCAAmC;IAC9DiB,aAAa;IACbF,yBAAyB;IACzBd,QAAQ;IACRC;EACF,CAAC;EACD,IAAMiB,UAAU,aAAWZ,SAAS,eAAUM,4BAA4B,MAAG;EAC7E,IAAMO,aAAa,aAAWN,kBAAkB,WAAMD,4BAA4B,WAAMK,oBAAoB,QAAK;EACjH,IAAMG,aAAa,GAAGR,4BAA4B;EAClD,oBAAOd,GAAG;EACEoB,UAAU;EACXA,UAAU;EACTC,aAAa,OAAIC,aAAa,WAAAb,OAAA,CAAAC,GAAA,CAAAC,QAAA;;AAE5C,CAAC;;AAED,OAAO,IAAMY,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIC,UAAkB,EAAK;EACvD,oBAAOxB,GAAG;;EAEIwB,UAAU;EACXA,UAAU,UAAAf,OAAA,CAAAC,GAAA,CAAAC,QAAA;;;AAGzB,CAAC;;AAED,OAAO,IAAMc,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIC,iBAAyB,EAAK;EAC9D,oBAAO1B,GAAG;;;EAGA0B,iBAAiB;EACdA,iBAAiB;EACnBA,iBAAiB;EAChBA,iBAAiB;EACXA,iBAAiB,oEAAAjB,OAAA,CAAAC,GAAA,CAAAC,QAAA;;;;;AAKrC,CAAC;;AAED,OAAO,IAAMgB,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIC,MAAc,EAAEC,WAAmB,EAAK;EACxE,oBAAO7B,GAAG;EACM4B,MAAM;EACJC,WAAW,SAAApB,OAAA,CAAAC,GAAA,CAAAC,QAAA;;AAE/B,CAAC","ignoreList":[]}

package/components/Radio/Radio.styles/Radio.styles.js

@@ -1,5 +1,6 @@
-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;
+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, memoizeStyle, prefix } from "../../../lib/theming/Emotion";
 import { afterOutlineMixin, circleSizeMixin, outlineColorMixin, radioCheckedMixin, radioSizeMixin } from "../Radio.mixins";
 export var globalClasses = prefix('radio')({
@@ -7,75 +8,103 @@ export var globalClasses = prefix('radio')({
 });
 export var styles = memoizeStyle({
   root: function root(t) {
-    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      cursor: pointer;\n      position: relative;\n      white-space: nowrap;\n      display: inline-flex;\n      align-items: baseline;\n\n      .", " {\n        transition: background ", " ", ";\n      }\n\n      &:hover .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n      &:active .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned circle,\n        // and also height and baseline for radio without caption.\n        content: '\\00A0';\n        display: inline-block;\n        flex: 0 0 auto;\n      }\n    "], ["\n      cursor: pointer;\n      position: relative;\n      white-space: nowrap;\n      display: inline-flex;\n      align-items: baseline;\n\n      .", " {\n        transition: background ", " ", ";\n      }\n\n      &:hover .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n      &:active .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned circle,\n        // and also height and baseline for radio without caption.\n        content: '\\\\00A0';\n        display: inline-block;\n        flex: 0 0 auto;\n      }\n    "])), globalClasses.circle, t.transitionDuration, t.transitionTimingFunction, globalClasses.circle, t.radioHoverBg, t.radioHoverShadow, globalClasses.circle, t.radioActiveBg, t.radioActiveShadow);
+    return /*#__PURE__*/css("cursor:pointer;position:relative;white-space:nowrap;display:inline-flex;align-items:baseline;.", globalClasses.circle, "{transition:background ", t.transitionDuration, " ", t.transitionTimingFunction, ";}&:hover .", globalClasses.circle, "{background:", t.radioHoverBg, ";box-shadow:", t.radioHoverShadow, ";}&:active .", globalClasses.circle, "{background:", t.radioActiveBg, ";box-shadow:", t.radioActiveShadow, ";}&::before{content:'\\00A0';display:inline-block;flex:0 0 auto;}" + (process.env.NODE_ENV === "production" ? "" : ";label:root;"));
   },
   rootSmall: function rootSmall(t) {
-    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), radioSizeMixin(t.radioFontSizeSmall, t.radioLineHeightSmall, t.radioPaddingYSmall, t.radioSizeSmall));
+    return /*#__PURE__*/css(radioSizeMixin(t.radioFontSizeSmall, t.radioLineHeightSmall, t.radioPaddingYSmall, t.radioSizeSmall), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:rootSmall;"));
   },
   rootMedium: function rootMedium(t) {
-    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), radioSizeMixin(t.radioFontSizeMedium, t.radioLineHeightMedium, t.radioPaddingYMedium, t.radioSizeMedium));
+    return /*#__PURE__*/css(radioSizeMixin(t.radioFontSizeMedium, t.radioLineHeightMedium, t.radioPaddingYMedium, t.radioSizeMedium), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:rootMedium;"));
   },
   rootLarge: function rootLarge(t) {
-    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), radioSizeMixin(t.radioFontSizeLarge, t.radioLineHeightLarge, t.radioPaddingYLarge, t.radioSizeLarge));
+    return /*#__PURE__*/css(radioSizeMixin(t.radioFontSizeLarge, t.radioLineHeightLarge, t.radioPaddingYLarge, t.radioSizeLarge), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:rootLarge;"));
   },
   rootIE11: function rootIE11() {
-    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      display: inline-table;\n    "])));
+    return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? {
+      name: "1aaxyil",
+      styles: "display:inline-table"
+    } : {
+      name: "1ix27nk-rootIE11",
+      styles: "display:inline-table;label:rootIE11;",
+      toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+    });
   },
   rootChecked: function rootChecked(t) {
-    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      &:hover .", " {\n        background: ", ";\n      }\n    "])), globalClasses.circle, t.radioCheckedHoverBgColor);
+    return /*#__PURE__*/css("&:hover .", globalClasses.circle, "{background:", t.radioCheckedHoverBgColor, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:rootChecked;"));
   },
   circle: function circle(t) {
-    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      background-image: ", ";\n      border-radius: 50%;\n      border: ", ";\n      box-shadow: ", ";\n      box-sizing: border-box;\n      display: inline-block;\n      position: absolute;\n      left: 0;\n      background-color: ", ";\n    "])), t.radioBgImage, t.radioBorder, t.radioBoxShadow, t.radioBgColor);
+    return /*#__PURE__*/css("background-image:", t.radioBgImage, ";border-radius:50%;border:", t.radioBorder, ";box-shadow:", t.radioBoxShadow, ";box-sizing:border-box;display:inline-block;position:absolute;left:0;background-color:", t.radioBgColor, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:circle;"));
   },
   circleSmall: function circleSmall(t) {
-    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), circleSizeMixin(t.labGrotesqueBaselineCompensation, t.radioFontSizeSmall, t.radioSizeSmall, t.radioBorderWidthCompensation, t.radioCircleOffsetY));
+    return /*#__PURE__*/css(circleSizeMixin(t.labGrotesqueBaselineCompensation, t.radioFontSizeSmall, t.radioSizeSmall, t.radioBorderWidthCompensation, t.radioCircleOffsetY), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:circleSmall;"));
   },
   circleMedium: function circleMedium(t) {
-    return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), circleSizeMixin(t.labGrotesqueBaselineCompensation, t.radioFontSizeMedium, t.radioSizeMedium, t.radioBorderWidthCompensation, t.radioCircleOffsetY));
+    return /*#__PURE__*/css(circleSizeMixin(t.labGrotesqueBaselineCompensation, t.radioFontSizeMedium, t.radioSizeMedium, t.radioBorderWidthCompensation, t.radioCircleOffsetY), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:circleMedium;"));
   },
   circleLarge: function circleLarge(t) {
-    return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), circleSizeMixin(t.labGrotesqueBaselineCompensation, t.radioFontSizeLarge, t.radioSizeLarge, t.radioBorderWidthCompensation, t.radioCircleOffsetY));
+    return /*#__PURE__*/css(circleSizeMixin(t.labGrotesqueBaselineCompensation, t.radioFontSizeLarge, t.radioSizeLarge, t.radioBorderWidthCompensation, t.radioCircleOffsetY), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:circleLarge;"));
   },
   focus: function focus(t) {
-    return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n      &::after {\n        ", ";\n        ", ";\n      }\n    "])), afterOutlineMixin(t.radioOutlineWidth), outlineColorMixin(t.radioFocusShadow, t.radioBorderColorFocus));
+    return /*#__PURE__*/css("&::after{", afterOutlineMixin(t.radioOutlineWidth), ";", outlineColorMixin(t.radioFocusShadow, t.radioBorderColorFocus), ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:focus;"));
   },
   warning: function warning(t) {
-    return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n      &::after {\n        ", ";\n        ", ";\n      }\n    "])), afterOutlineMixin(t.radioOutlineWidth), outlineColorMixin(t.radioFocusShadow, t.radioBorderColorWarning));
+    return /*#__PURE__*/css("&::after{", afterOutlineMixin(t.radioOutlineWidth), ";", outlineColorMixin(t.radioFocusShadow, t.radioBorderColorWarning), ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:warning;"));
   },
   error: function error(t) {
-    return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n      &::after {\n        ", ";\n        ", ";\n      }\n    "])), afterOutlineMixin(t.radioOutlineWidth), outlineColorMixin(t.radioFocusShadow, t.radioBorderColorError));
+    return /*#__PURE__*/css("&::after{", afterOutlineMixin(t.radioOutlineWidth), ";", outlineColorMixin(t.radioFocusShadow, t.radioBorderColorError), ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:error;"));
   },
   checked: function checked(t) {
-    return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n      background-color: ", ";\n      border-color: ", ";\n\n      &::before {\n        content: ' ';\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n        margin: auto;\n        border-radius: 50%;\n        background: ", ";\n      }\n    "])), t.radioCheckedBgColor, t.radioCheckedBorderColor, t.radioCheckedBulletColor);
+    return /*#__PURE__*/css("background-color:", t.radioCheckedBgColor, ";border-color:", t.radioCheckedBorderColor, ";&::before{content:' ';position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;border-radius:50%;background:", t.radioCheckedBulletColor, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:checked;"));
   },
   checkedSmall: function checkedSmall(t) {
-    return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), radioCheckedMixin(t.radioBulletSizeSmall));
+    return /*#__PURE__*/css(radioCheckedMixin(t.radioBulletSizeSmall), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:checkedSmall;"));
   },
   checkedMedium: function checkedMedium(t) {
-    return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), radioCheckedMixin(t.radioBulletSizeMedium));
+    return /*#__PURE__*/css(radioCheckedMixin(t.radioBulletSizeMedium), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:checkedMedium;"));
   },
   checkedLarge: function checkedLarge(t) {
-    return css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), radioCheckedMixin(t.radioBulletSizeLarge));
+    return /*#__PURE__*/css(radioCheckedMixin(t.radioBulletSizeLarge), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:checkedLarge;"));
   },
   checkedDisabled: function checkedDisabled(t) {
-    return css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteralLoose(["\n      &::before {\n        background: ", ";\n      }\n    "])), t.radioCheckedDisabledBulletBg);
+    return /*#__PURE__*/css("&::before{background:", t.radioCheckedDisabledBulletBg, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:checkedDisabled;"));
   },
   input: function input() {
-    return css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      height: 0;\n      opacity: 0;\n      position: absolute;\n      width: 0;\n      z-index: -1;\n    "])));
+    return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? {
+      name: "15o93rn",
+      styles: "display:inline-block;height:0;opacity:0;position:absolute;width:0;z-index:-1"
+    } : {
+      name: "osppzj-input",
+      styles: "display:inline-block;height:0;opacity:0;position:absolute;width:0;z-index:-1;label:input;",
+      toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+    });
   },
   disabled: function disabled(t) {
-    return css(_templateObject20 || (_templateObject20 = _taggedTemplateLiteralLoose(["\n      background: ", " !important; // override root hover/active styles\n      border-color: transparent !important; // override root hover/active styles\n      box-shadow: ", " !important; // override root hover/active styles\n    "])), t.radioDisabledBg, t.radioDisabledShadow);
+    return /*#__PURE__*/css("background:", t.radioDisabledBg, "!important;border-color:transparent!important;box-shadow:", t.radioDisabledShadow, "!important;" + (process.env.NODE_ENV === "production" ? "" : ";label:disabled;"));
   },
   caption: function caption(t) {
-    return css(_templateObject21 || (_templateObject21 = _taggedTemplateLiteralLoose(["\n      display: ", ";\n      padding-left: ", ";\n      white-space: normal;\n      color: ", ";\n    "])), t.radioCaptionDisplay, t.radioCaptionGap, t.radioTextColor);
+    return /*#__PURE__*/css("display:", t.radioCaptionDisplay, ";padding-left:", t.radioCaptionGap, ";white-space:normal;color:", t.radioTextColor, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:caption;"));
   },
   captionIE11: function captionIE11() {
-    return css(_templateObject22 || (_templateObject22 = _taggedTemplateLiteralLoose(["\n      display: table-cell;\n    "])));
+    return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? {
+      name: "plv82s",
+      styles: "display:table-cell"
+    } : {
+      name: "1toe8o8-captionIE11",
+      styles: "display:table-cell;label:captionIE11;",
+      toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+    });
   },
   captionDisabled: function captionDisabled(t) {
-    return css(_templateObject23 || (_templateObject23 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.textColorDisabled);
+    return /*#__PURE__*/css("color:", t.textColorDisabled, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:captionDisabled;"));
   },
   placeholder: function placeholder() {
-    return css(_templateObject24 || (_templateObject24 = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n    "])));
+    return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? {
+      name: "1r5gb7q",
+      styles: "display:inline-block"
+    } : {
+      name: "1lk2av-placeholder",
+      styles: "display:inline-block;label:placeholder;",
+      toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+    });
   }
 });

package/components/Radio/Radio.styles/Radio.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["css","memoizeStyle","prefix","afterOutlineMixin","circleSizeMixin","outlineColorMixin","radioCheckedMixin","radioSizeMixin","globalClasses","circle","styles","root","t","_templateObject","_taggedTemplateLiteralLoose","transitionDuration","transitionTimingFunction","radioHoverBg","radioHoverShadow","radioActiveBg","radioActiveShadow","rootSmall","_templateObject2","radioFontSizeSmall","radioLineHeightSmall","radioPaddingYSmall","radioSizeSmall","rootMedium","_templateObject3","radioFontSizeMedium","radioLineHeightMedium","radioPaddingYMedium","radioSizeMedium","rootLarge","_templateObject4","radioFontSizeLarge","radioLineHeightLarge","radioPaddingYLarge","radioSizeLarge","rootIE11","_templateObject5","rootChecked","_templateObject6","radioCheckedHoverBgColor","_templateObject7","radioBgImage","radioBorder","radioBoxShadow","radioBgColor","circleSmall","_templateObject8","labGrotesqueBaselineCompensation","radioBorderWidthCompensation","radioCircleOffsetY","circleMedium","_templateObject9","circleLarge","_templateObject10","focus","_templateObject11","radioOutlineWidth","radioFocusShadow","radioBorderColorFocus","warning","_templateObject12","radioBorderColorWarning","error","_templateObject13","radioBorderColorError","checked","_templateObject14","radioCheckedBgColor","radioCheckedBorderColor","radioCheckedBulletColor","checkedSmall","_templateObject15","radioBulletSizeSmall","checkedMedium","_templateObject16","radioBulletSizeMedium","checkedLarge","_templateObject17","radioBulletSizeLarge","checkedDisabled","_templateObject18","radioCheckedDisabledBulletBg","input","_templateObject19","disabled","_templateObject20","radioDisabledBg","radioDisabledShadow","caption","_templateObject21","radioCaptionDisplay","radioCaptionGap","radioTextColor","captionIE11","_templateObject22","captionDisabled","_templateObject23","textColorDisabled","placeholder","_templateObject24"],"sources":["Radio.styles.ts"],"sourcesContent":["import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nimport {\n  afterOutlineMixin,\n  circleSizeMixin,\n  outlineColorMixin,\n  radioCheckedMixin,\n  radioSizeMixin,\n} from './Radio.mixins';\n\nexport const globalClasses = prefix('radio')({\n  circle: 'circle',\n});\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      cursor: pointer;\n      position: relative;\n      white-space: nowrap;\n      display: inline-flex;\n      align-items: baseline;\n\n      .${globalClasses.circle} {\n        transition: background ${t.transitionDuration} ${t.transitionTimingFunction};\n      }\n\n      &:hover .${globalClasses.circle} {\n        background: ${t.radioHoverBg};\n        box-shadow: ${t.radioHoverShadow};\n      }\n      &:active .${globalClasses.circle} {\n        background: ${t.radioActiveBg};\n        box-shadow: ${t.radioActiveShadow};\n      }\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned circle,\n        // and also height and baseline for radio without caption.\n        content: '\\\\00A0';\n        display: inline-block;\n        flex: 0 0 auto;\n      }\n    `;\n  },\n  rootSmall(t: Theme) {\n    return css`\n      ${radioSizeMixin(t.radioFontSizeSmall, t.radioLineHeightSmall, t.radioPaddingYSmall, t.radioSizeSmall)};\n    `;\n  },\n  rootMedium(t: Theme) {\n    return css`\n      ${radioSizeMixin(t.radioFontSizeMedium, t.radioLineHeightMedium, t.radioPaddingYMedium, t.radioSizeMedium)};\n    `;\n  },\n  rootLarge(t: Theme) {\n    return css`\n      ${radioSizeMixin(t.radioFontSizeLarge, t.radioLineHeightLarge, t.radioPaddingYLarge, t.radioSizeLarge)};\n    `;\n  },\n\n  rootIE11() {\n    return css`\n      display: inline-table;\n    `;\n  },\n\n  rootChecked(t: Theme) {\n    return css`\n      &:hover .${globalClasses.circle} {\n        background: ${t.radioCheckedHoverBgColor};\n      }\n    `;\n  },\n\n  circle(t: Theme) {\n    return css`\n      background-image: ${t.radioBgImage};\n      border-radius: 50%;\n      border: ${t.radioBorder};\n      box-shadow: ${t.radioBoxShadow};\n      box-sizing: border-box;\n      display: inline-block;\n      position: absolute;\n      left: 0;\n      background-color: ${t.radioBgColor};\n    `;\n  },\n  circleSmall(t: Theme) {\n    return css`\n      ${circleSizeMixin(\n        t.labGrotesqueBaselineCompensation,\n        t.radioFontSizeSmall,\n        t.radioSizeSmall,\n        t.radioBorderWidthCompensation,\n        t.radioCircleOffsetY,\n      )};\n    `;\n  },\n  circleMedium(t: Theme) {\n    return css`\n      ${circleSizeMixin(\n        t.labGrotesqueBaselineCompensation,\n        t.radioFontSizeMedium,\n        t.radioSizeMedium,\n        t.radioBorderWidthCompensation,\n        t.radioCircleOffsetY,\n      )};\n    `;\n  },\n  circleLarge(t: Theme) {\n    return css`\n      ${circleSizeMixin(\n        t.labGrotesqueBaselineCompensation,\n        t.radioFontSizeLarge,\n        t.radioSizeLarge,\n        t.radioBorderWidthCompensation,\n        t.radioCircleOffsetY,\n      )};\n    `;\n  },\n\n  focus(t: Theme) {\n    return css`\n      &::after {\n        ${afterOutlineMixin(t.radioOutlineWidth)};\n        ${outlineColorMixin(t.radioFocusShadow, t.radioBorderColorFocus)};\n      }\n    `;\n  },\n\n  warning(t: Theme) {\n    return css`\n      &::after {\n        ${afterOutlineMixin(t.radioOutlineWidth)};\n        ${outlineColorMixin(t.radioFocusShadow, t.radioBorderColorWarning)};\n      }\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      &::after {\n        ${afterOutlineMixin(t.radioOutlineWidth)};\n        ${outlineColorMixin(t.radioFocusShadow, t.radioBorderColorError)};\n      }\n    `;\n  },\n\n  checked(t: Theme) {\n    return css`\n      background-color: ${t.radioCheckedBgColor};\n      border-color: ${t.radioCheckedBorderColor};\n\n      &::before {\n        content: ' ';\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n        margin: auto;\n        border-radius: 50%;\n        background: ${t.radioCheckedBulletColor};\n      }\n    `;\n  },\n  checkedSmall(t: Theme) {\n    return css`\n      ${radioCheckedMixin(t.radioBulletSizeSmall)};\n    `;\n  },\n  checkedMedium(t: Theme) {\n    return css`\n      ${radioCheckedMixin(t.radioBulletSizeMedium)};\n    `;\n  },\n  checkedLarge(t: Theme) {\n    return css`\n      ${radioCheckedMixin(t.radioBulletSizeLarge)};\n    `;\n  },\n\n  checkedDisabled(t: Theme) {\n    return css`\n      &::before {\n        background: ${t.radioCheckedDisabledBulletBg};\n      }\n    `;\n  },\n\n  input() {\n    return css`\n      display: inline-block;\n      height: 0;\n      opacity: 0;\n      position: absolute;\n      width: 0;\n      z-index: -1;\n    `;\n  },\n\n  disabled(t: Theme) {\n    return css`\n      background: ${t.radioDisabledBg} !important; // override root hover/active styles\n      border-color: transparent !important; // override root hover/active styles\n      box-shadow: ${t.radioDisabledShadow} !important; // override root hover/active styles\n    `;\n  },\n\n  caption(t: Theme) {\n    return css`\n      display: ${t.radioCaptionDisplay};\n      padding-left: ${t.radioCaptionGap};\n      white-space: normal;\n      color: ${t.radioTextColor};\n    `;\n  },\n\n  captionIE11() {\n    return css`\n      display: table-cell;\n    `;\n  },\n\n  captionDisabled(t: Theme) {\n    return css`\n      color: ${t.textColorDisabled};\n    `;\n  },\n\n  placeholder() {\n    return css`\n      display: inline-block;\n    `;\n  },\n});\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["css","memoizeStyle","prefix","afterOutlineMixin","circleSizeMixin","outlineColorMixin","radioCheckedMixin","radioSizeMixin","globalClasses","circle","styles","root","t","transitionDuration","transitionTimingFunction","radioHoverBg","radioHoverShadow","radioActiveBg","radioActiveShadow","process","env","NODE_ENV","rootSmall","radioFontSizeSmall","radioLineHeightSmall","radioPaddingYSmall","radioSizeSmall","rootMedium","radioFontSizeMedium","radioLineHeightMedium","radioPaddingYMedium","radioSizeMedium","rootLarge","radioFontSizeLarge","radioLineHeightLarge","radioPaddingYLarge","radioSizeLarge","rootIE11","name","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","rootChecked","radioCheckedHoverBgColor","radioBgImage","radioBorder","radioBoxShadow","radioBgColor","circleSmall","labGrotesqueBaselineCompensation","radioBorderWidthCompensation","radioCircleOffsetY","circleMedium","circleLarge","focus","radioOutlineWidth","radioFocusShadow","radioBorderColorFocus","warning","radioBorderColorWarning","error","radioBorderColorError","checked","radioCheckedBgColor","radioCheckedBorderColor","radioCheckedBulletColor","checkedSmall","radioBulletSizeSmall","checkedMedium","radioBulletSizeMedium","checkedLarge","radioBulletSizeLarge","checkedDisabled","radioCheckedDisabledBulletBg","input","disabled","radioDisabledBg","radioDisabledShadow","caption","radioCaptionDisplay","radioCaptionGap","radioTextColor","captionIE11","captionDisabled","textColorDisabled","placeholder"],"sources":["Radio.styles.ts"],"sourcesContent":["import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nimport {\n  afterOutlineMixin,\n  circleSizeMixin,\n  outlineColorMixin,\n  radioCheckedMixin,\n  radioSizeMixin,\n} from './Radio.mixins';\n\nexport const globalClasses = prefix('radio')({\n  circle: 'circle',\n});\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      cursor: pointer;\n      position: relative;\n      white-space: nowrap;\n      display: inline-flex;\n      align-items: baseline;\n\n      .${globalClasses.circle} {\n        transition: background ${t.transitionDuration} ${t.transitionTimingFunction};\n      }\n\n      &:hover .${globalClasses.circle} {\n        background: ${t.radioHoverBg};\n        box-shadow: ${t.radioHoverShadow};\n      }\n      &:active .${globalClasses.circle} {\n        background: ${t.radioActiveBg};\n        box-shadow: ${t.radioActiveShadow};\n      }\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned circle,\n        // and also height and baseline for radio without caption.\n        content: '\\\\00A0';\n        display: inline-block;\n        flex: 0 0 auto;\n      }\n    `;\n  },\n  rootSmall(t: Theme) {\n    return css`\n      ${radioSizeMixin(t.radioFontSizeSmall, t.radioLineHeightSmall, t.radioPaddingYSmall, t.radioSizeSmall)};\n    `;\n  },\n  rootMedium(t: Theme) {\n    return css`\n      ${radioSizeMixin(t.radioFontSizeMedium, t.radioLineHeightMedium, t.radioPaddingYMedium, t.radioSizeMedium)};\n    `;\n  },\n  rootLarge(t: Theme) {\n    return css`\n      ${radioSizeMixin(t.radioFontSizeLarge, t.radioLineHeightLarge, t.radioPaddingYLarge, t.radioSizeLarge)};\n    `;\n  },\n\n  rootIE11() {\n    return css`\n      display: inline-table;\n    `;\n  },\n\n  rootChecked(t: Theme) {\n    return css`\n      &:hover .${globalClasses.circle} {\n        background: ${t.radioCheckedHoverBgColor};\n      }\n    `;\n  },\n\n  circle(t: Theme) {\n    return css`\n      background-image: ${t.radioBgImage};\n      border-radius: 50%;\n      border: ${t.radioBorder};\n      box-shadow: ${t.radioBoxShadow};\n      box-sizing: border-box;\n      display: inline-block;\n      position: absolute;\n      left: 0;\n      background-color: ${t.radioBgColor};\n    `;\n  },\n  circleSmall(t: Theme) {\n    return css`\n      ${circleSizeMixin(\n        t.labGrotesqueBaselineCompensation,\n        t.radioFontSizeSmall,\n        t.radioSizeSmall,\n        t.radioBorderWidthCompensation,\n        t.radioCircleOffsetY,\n      )};\n    `;\n  },\n  circleMedium(t: Theme) {\n    return css`\n      ${circleSizeMixin(\n        t.labGrotesqueBaselineCompensation,\n        t.radioFontSizeMedium,\n        t.radioSizeMedium,\n        t.radioBorderWidthCompensation,\n        t.radioCircleOffsetY,\n      )};\n    `;\n  },\n  circleLarge(t: Theme) {\n    return css`\n      ${circleSizeMixin(\n        t.labGrotesqueBaselineCompensation,\n        t.radioFontSizeLarge,\n        t.radioSizeLarge,\n        t.radioBorderWidthCompensation,\n        t.radioCircleOffsetY,\n      )};\n    `;\n  },\n\n  focus(t: Theme) {\n    return css`\n      &::after {\n        ${afterOutlineMixin(t.radioOutlineWidth)};\n        ${outlineColorMixin(t.radioFocusShadow, t.radioBorderColorFocus)};\n      }\n    `;\n  },\n\n  warning(t: Theme) {\n    return css`\n      &::after {\n        ${afterOutlineMixin(t.radioOutlineWidth)};\n        ${outlineColorMixin(t.radioFocusShadow, t.radioBorderColorWarning)};\n      }\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      &::after {\n        ${afterOutlineMixin(t.radioOutlineWidth)};\n        ${outlineColorMixin(t.radioFocusShadow, t.radioBorderColorError)};\n      }\n    `;\n  },\n\n  checked(t: Theme) {\n    return css`\n      background-color: ${t.radioCheckedBgColor};\n      border-color: ${t.radioCheckedBorderColor};\n\n      &::before {\n        content: ' ';\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n        margin: auto;\n        border-radius: 50%;\n        background: ${t.radioCheckedBulletColor};\n      }\n    `;\n  },\n  checkedSmall(t: Theme) {\n    return css`\n      ${radioCheckedMixin(t.radioBulletSizeSmall)};\n    `;\n  },\n  checkedMedium(t: Theme) {\n    return css`\n      ${radioCheckedMixin(t.radioBulletSizeMedium)};\n    `;\n  },\n  checkedLarge(t: Theme) {\n    return css`\n      ${radioCheckedMixin(t.radioBulletSizeLarge)};\n    `;\n  },\n\n  checkedDisabled(t: Theme) {\n    return css`\n      &::before {\n        background: ${t.radioCheckedDisabledBulletBg};\n      }\n    `;\n  },\n\n  input() {\n    return css`\n      display: inline-block;\n      height: 0;\n      opacity: 0;\n      position: absolute;\n      width: 0;\n      z-index: -1;\n    `;\n  },\n\n  disabled(t: Theme) {\n    return css`\n      background: ${t.radioDisabledBg} !important; // override root hover/active styles\n      border-color: transparent !important; // override root hover/active styles\n      box-shadow: ${t.radioDisabledShadow} !important; // override root hover/active styles\n    `;\n  },\n\n  caption(t: Theme) {\n    return css`\n      display: ${t.radioCaptionDisplay};\n      padding-left: ${t.radioCaptionGap};\n      white-space: normal;\n      color: ${t.radioTextColor};\n    `;\n  },\n\n  captionIE11() {\n    return css`\n      display: table-cell;\n    `;\n  },\n\n  captionDisabled(t: Theme) {\n    return css`\n      color: ${t.textColorDisabled};\n    `;\n  },\n\n  placeholder() {\n    return css`\n      display: inline-block;\n    `;\n  },\n});\n"],"mappings":"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","ignoreList":[]}

package/components/Radio/__creevey__/Radio.creevey.mts

@@ -0,0 +1,28 @@
+import { story, kind, test } from 'creevey';
+import { Key } from 'selenium-webdriver';
+
+kind('Radio', () => {
+  story('Highlighted', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: {
+        flaky: { in: /firefox/ },
+      },
+    });
+
+    test('plain', async (context) => {
+      await context.matchImage(await context.takeScreenshot(), 'plain');
+    });
+
+    test('tabPress', async (context) => {
+      await context.webdriver
+        .actions({
+          bridge: true,
+        })
+        .click(context.webdriver.findElement({ css: 'body' }))
+        .sendKeys(Key.TAB)
+        .pause(500)
+        .perform();
+      await context.matchImage(await context.takeScreenshot(), 'tabPress');
+    });
+  });
+});