@elastic/eui
Version:
Elastic UI Component Library
37 lines (36 loc) • 2.23 kB
JavaScript
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["fontWeight"];
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/
import { css } from '@emotion/react';
import { serializeStyles } from '@emotion/serialize';
import { euiCanAnimate, euiTextBreakWord } from '../../../global_styling';
import { euiTitle } from '../../title/title.styles';
export var euiFormLabel = function euiFormLabel(euiThemeContext) {
var euiTheme = euiThemeContext.euiTheme;
// Exclude the fontWeight from the title, since we're setting our own later
var _euiTitle = euiTitle(euiThemeContext, 'xxxs'),
_ = _euiTitle.fontWeight,
_titleStyles = _objectWithoutProperties(_euiTitle, _excluded);
// Since we're not returning a css`` string (to avoid generating an extra Emotion
// className), we need to manually serialize the style object into a string
var titleStyles = serializeStyles([_titleStyles]).styles;
return "\n ".concat(titleStyles, "\n font-weight: ").concat(euiTheme.font.weight.semiBold, ";\n ").concat(euiTextBreakWord(), "\n ");
};
export var euiFormLabelStyles = function euiFormLabelStyles(euiThemeContext) {
var euiTheme = euiThemeContext.euiTheme;
return {
euiFormLabel: /*#__PURE__*/css(euiFormLabel(euiThemeContext), " display:inline-block;", euiCanAnimate, "{transition:color ", euiTheme.animation.fast, " ", euiTheme.animation.resistance, ";};label:euiFormLabel;"),
// Skip css`` to avoid generating an extra Emotion className
// Use :where to reduce specificity & make the CSS easier to override by prepend/append nodes
notDisabled: "\n &:where([for]) {\n cursor: pointer;\n }\n ",
invalid: /*#__PURE__*/css("color:", euiTheme.colors.danger, ";;label:invalid;"),
// Focused state should override invalid state
focused: /*#__PURE__*/css("color:", euiTheme.colors.primary, ";;label:focused;")
};
};