@elastic/eui
Version:
Elastic UI Component Library
55 lines (54 loc) • 3.65 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.euiSplitButtonStyles = exports.euiSplitButtonDividerStyles = exports.euiSplitButtonActionStyles = void 0;
var _react = require("@emotion/react");
var _global_styling = require("../../../global_styling");
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)."; } /*
* 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.
*/
var euiSplitButtonStyles = exports.euiSplitButtonStyles = function euiSplitButtonStyles(euiThemeContext) {
var euiTheme = euiThemeContext.euiTheme;
var primaryDisabledSelector = ".euiSplitButtonActionPrimary:is(".concat(_global_styling.euiDisabledSelector, ")");
var secondaryDisabledSelector = ".euiSplitButtonActionSecondary:is(".concat(_global_styling.euiDisabledSelector, ")");
var dividerSelector = ".euiSplitButton__divider";
return {
euiSplitButton: /*#__PURE__*/(0, _react.css)("display:inline-flex;flex-wrap:nowrap;&:has(", primaryDisabledSelector, "):has(", secondaryDisabledSelector, "){", dividerSelector, "{", (0, _global_styling.highContrastModeStyles)(euiThemeContext, {
// When both buttons are disabled set as visual gap
none: "\n border-color: transparent;\n ",
// When both buttons are disabled set a disabled divider color
preferred: "\n border-color: ".concat(euiTheme.colors.borderBaseDisabled, ";\n ")
}), ";}};label:euiSplitButton;"),
// When both buttons are enabled set as visual gap
fill: /*#__PURE__*/(0, _react.css)("&:not(:has(", primaryDisabledSelector, ")):not(\n :has(", secondaryDisabledSelector, ")\n ){", dividerSelector, "{border-color:transparent;}};label:fill;")
};
};
var euiSplitButtonActionStyles = exports.euiSplitButtonActionStyles = {
euiSplitButtonActionPrimary: process.env.NODE_ENV === "production" ? {
name: "12txneb-euiSplitButtonActionPrimary",
styles: "z-index:0;border-inline-end:none;border-start-end-radius:0;border-end-end-radius:0;label:euiSplitButtonActionPrimary;"
} : {
name: "12txneb-euiSplitButtonActionPrimary",
styles: "z-index:0;border-inline-end:none;border-start-end-radius:0;border-end-end-radius:0;label:euiSplitButtonActionPrimary;",
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
},
euiSplitButtonActionSecondary: process.env.NODE_ENV === "production" ? {
name: "5uh4vx-euiSplitButtonActionSecondary",
styles: "border-inline-start:none;border-start-start-radius:0;border-end-start-radius:0;label:euiSplitButtonActionSecondary;"
} : {
name: "5uh4vx-euiSplitButtonActionSecondary",
styles: "border-inline-start:none;border-start-start-radius:0;border-end-start-radius:0;label:euiSplitButtonActionSecondary;",
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
}
};
var euiSplitButtonDividerStyles = exports.euiSplitButtonDividerStyles = function euiSplitButtonDividerStyles(euiThemeContext, color) {
var euiTheme = euiThemeContext.euiTheme;
return {
divider: /*#__PURE__*/(0, _react.css)("border-inline-start:", euiTheme.border.width.thin, " solid ", color, ";;label:divider;")
};
};