@kiwicom/orbit-components/es/FormLabel/index.js

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.

import * as React from "react";
import styled, { css } from "styled-components";
import defaultTheme from "../defaultTheme";
import AlertCircle from "../icons/AlertCircle";
import InformationCircle from "../icons/InformationCircle";
import { rtlSpacing } from "../utils/rtl";
var StyledAsterisk = styled.span.withConfig({
  displayName: "FormLabel__StyledAsterisk",
  componentId: "sc-qbinms-0"
})(["", ""], function (_ref) {
  var theme = _ref.theme,
      filled = _ref.filled;
  return css(["font-weight:", ";color:", ";font-size:", ";vertical-align:top;"], theme.orbit.fontWeightBold, !filled ? theme.orbit.colorTextError : theme.orbit.colorFormLabelFilled, theme.orbit.fontSizeFormLabel);
}); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198

StyledAsterisk.defaultProps = {
  theme: defaultTheme
};
var StyledInputErrorIcWrapper = styled.span.withConfig({
  displayName: "FormLabel__StyledInputErrorIcWrapper",
  componentId: "sc-qbinms-1"
})(["margin:", ";display:inline-flex;align-items:center;"], function (_ref2) {
  var theme = _ref2.theme;
  return rtlSpacing("0 ".concat(theme.orbit.spaceXXSmall, " 0 0"));
}); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198

StyledInputErrorIcWrapper.defaultProps = {
  theme: defaultTheme
};
var FormLabel = styled(function (_ref3) {
  var className = _ref3.className,
      children = _ref3.children,
      required = _ref3.required,
      filled = _ref3.filled,
      dataTest = _ref3.dataTest,
      id = _ref3.id,
      error = _ref3.error,
      help = _ref3.help,
      onMouseEnter = _ref3.onMouseEnter,
      onMouseLeave = _ref3.onMouseLeave,
      iconRef = _ref3.iconRef,
      inlineLabel = _ref3.inlineLabel,
      labelRef = _ref3.labelRef;
  return /*#__PURE__*/React.createElement("span", {
    className: className,
    "data-test": dataTest,
    id: id,
    ref: labelRef
  }, !inlineLabel && (error || help) && /*#__PURE__*/React.createElement(StyledInputErrorIcWrapper, {
    ref: iconRef,
    onMouseEnter: onMouseEnter,
    onMouseLeave: onMouseLeave
  }, error && /*#__PURE__*/React.createElement(AlertCircle, {
    ariaLabel: "error",
    color: "critical",
    size: "small"
  }), !error && help && /*#__PURE__*/React.createElement(InformationCircle, {
    ariaLabel: "help",
    color: "secondary",
    size: "small"
  })), required && !error && /*#__PURE__*/React.createElement(StyledAsterisk, {
    "aria-hidden": "true",
    filled: filled
  }, "*"), /*#__PURE__*/React.createElement("span", null, children));
}).withConfig({
  displayName: "FormLabel",
  componentId: "sc-qbinms-2"
})(["", ""], function (_ref4) {
  var theme = _ref4.theme,
      filled = _ref4.filled,
      disabled = _ref4.disabled;
  return css(["display:flex;font-family:", ";font-size:", ";color:", ";line-height:", ";margin-bottom:", ";"], theme.orbit.fontFamily, theme.orbit.fontSizeFormLabel, !filled || disabled ? theme.orbit.colorFormLabel : theme.orbit.colorFormLabelFilled, theme.orbit.lineHeightTextSmall, theme.orbit.spaceXXSmall);
}); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198

FormLabel.defaultProps = {
  theme: defaultTheme
};
export default FormLabel;