mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 17:59:23 -04:00
[ML] Add padding for custom rule popovers (#141215)
* set popover padding * update jest snapshot * fix scope_expression popover
This commit is contained in:
parent
64294688ad
commit
fe2a089f08
6 changed files with 30 additions and 72 deletions
|
@ -29,15 +29,9 @@ exports[`ConditionExpression renders with appliesTo, operator and value supplied
|
|||
id="appliesToPopover"
|
||||
isOpen={false}
|
||||
ownFocus={true}
|
||||
panelPaddingSize="none"
|
||||
panelPaddingSize="s"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"zIndex": "200",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div>
|
||||
<EuiPopoverTitle>
|
||||
<FormattedMessage
|
||||
defaultMessage="When"
|
||||
|
@ -106,16 +100,10 @@ exports[`ConditionExpression renders with appliesTo, operator and value supplied
|
|||
id="operatorValuePopover"
|
||||
isOpen={false}
|
||||
ownFocus={true}
|
||||
panelPaddingSize="none"
|
||||
panelPaddingSize="s"
|
||||
withTitle={true}
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"zIndex": "200",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div>
|
||||
<EuiPopoverTitle>
|
||||
<FormattedMessage
|
||||
defaultMessage="Is"
|
||||
|
@ -227,15 +215,9 @@ exports[`ConditionExpression renders with only value supplied 1`] = `
|
|||
id="appliesToPopover"
|
||||
isOpen={false}
|
||||
ownFocus={true}
|
||||
panelPaddingSize="none"
|
||||
panelPaddingSize="s"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"zIndex": "200",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div>
|
||||
<EuiPopoverTitle>
|
||||
<FormattedMessage
|
||||
defaultMessage="When"
|
||||
|
@ -303,16 +285,10 @@ exports[`ConditionExpression renders with only value supplied 1`] = `
|
|||
id="operatorValuePopover"
|
||||
isOpen={false}
|
||||
ownFocus={true}
|
||||
panelPaddingSize="none"
|
||||
panelPaddingSize="s"
|
||||
withTitle={true}
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"zIndex": "200",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div>
|
||||
<EuiPopoverTitle>
|
||||
<FormattedMessage
|
||||
defaultMessage="Is"
|
||||
|
|
|
@ -100,15 +100,9 @@ exports[`ScopeExpression renders when enabled set to false 1`] = `
|
|||
id="operatorValuePopover"
|
||||
isOpen={false}
|
||||
ownFocus={true}
|
||||
panelPaddingSize="none"
|
||||
panelPaddingSize="s"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"zIndex": "200",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div>
|
||||
<EuiPopoverTitle>
|
||||
<FormattedMessage
|
||||
defaultMessage="Is"
|
||||
|
@ -251,15 +245,9 @@ exports[`ScopeExpression renders when filter ID and type supplied 1`] = `
|
|||
id="operatorValuePopover"
|
||||
isOpen={false}
|
||||
ownFocus={true}
|
||||
panelPaddingSize="none"
|
||||
panelPaddingSize="s"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"zIndex": "200",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div>
|
||||
<EuiPopoverTitle>
|
||||
<FormattedMessage
|
||||
defaultMessage="Is"
|
||||
|
@ -402,15 +390,9 @@ exports[`ScopeExpression renders when no filter ID or type supplied 1`] = `
|
|||
id="operatorValuePopover"
|
||||
isOpen={false}
|
||||
ownFocus={true}
|
||||
panelPaddingSize="none"
|
||||
panelPaddingSize="s"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"zIndex": "200",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div>
|
||||
<EuiPopoverTitle>
|
||||
<FormattedMessage
|
||||
defaultMessage="Is"
|
||||
|
|
|
@ -28,9 +28,6 @@ import { appliesToText, operatorToText } from './utils';
|
|||
import { i18n } from '@kbn/i18n';
|
||||
import { FormattedMessage } from '@kbn/i18n-react';
|
||||
|
||||
// Raise the popovers above GuidePageSideNav
|
||||
const POPOVER_STYLE = { zIndex: '200' };
|
||||
|
||||
export class ConditionExpression extends Component {
|
||||
static propTypes = {
|
||||
index: PropTypes.number.isRequired,
|
||||
|
@ -102,7 +99,7 @@ export class ConditionExpression extends Component {
|
|||
|
||||
renderAppliesToPopover() {
|
||||
return (
|
||||
<div style={POPOVER_STYLE}>
|
||||
<div>
|
||||
<EuiPopoverTitle>
|
||||
<FormattedMessage
|
||||
id="xpack.ml.ruleEditor.conditionExpression.appliesToPopoverTitle"
|
||||
|
@ -129,7 +126,7 @@ export class ConditionExpression extends Component {
|
|||
|
||||
renderOperatorValuePopover() {
|
||||
return (
|
||||
<div style={POPOVER_STYLE}>
|
||||
<div>
|
||||
<EuiPopoverTitle>
|
||||
<FormattedMessage
|
||||
id="xpack.ml.ruleEditor.conditionExpression.operatorValuePopoverTitle"
|
||||
|
@ -189,7 +186,7 @@ export class ConditionExpression extends Component {
|
|||
}
|
||||
isOpen={this.state.isAppliesToOpen}
|
||||
closePopover={this.closeAppliesTo}
|
||||
panelPaddingSize="none"
|
||||
panelPaddingSize="s"
|
||||
ownFocus
|
||||
anchorPosition="downLeft"
|
||||
>
|
||||
|
@ -216,7 +213,7 @@ export class ConditionExpression extends Component {
|
|||
}
|
||||
isOpen={this.state.isOperatorValueOpen}
|
||||
closePopover={this.closeOperatorValue}
|
||||
panelPaddingSize="none"
|
||||
panelPaddingSize="s"
|
||||
ownFocus
|
||||
withTitle
|
||||
anchorPosition="downLeft"
|
||||
|
|
|
@ -26,9 +26,6 @@ import { FILTER_TYPE } from '../../../../common/constants/detector_rule';
|
|||
import { filterTypeToText } from './utils';
|
||||
import { FormattedMessage } from '@kbn/i18n-react';
|
||||
|
||||
// Raise the popovers above GuidePageSideNav
|
||||
const POPOVER_STYLE = { zIndex: '200' };
|
||||
|
||||
function getFilterListOptions(filterListIds) {
|
||||
return filterListIds.map((filterId) => ({ value: filterId, text: filterId }));
|
||||
}
|
||||
|
@ -76,7 +73,7 @@ export class ScopeExpression extends Component {
|
|||
const { filterId, filterType, filterListIds } = this.props;
|
||||
|
||||
return (
|
||||
<div style={POPOVER_STYLE}>
|
||||
<div>
|
||||
<EuiPopoverTitle>
|
||||
<FormattedMessage
|
||||
id="xpack.ml.ruleEditor.scopeExpression.scopeFilterTypePopoverTitle"
|
||||
|
@ -156,7 +153,7 @@ export class ScopeExpression extends Component {
|
|||
}
|
||||
isOpen={this.state.isFilterListOpen}
|
||||
closePopover={this.closeFilterList}
|
||||
panelPaddingSize="none"
|
||||
panelPaddingSize="s"
|
||||
ownFocus
|
||||
anchorPosition="downLeft"
|
||||
>
|
||||
|
|
|
@ -8,7 +8,9 @@ exports[`EditConditionLink renders for a condition using actual 1`] = `
|
|||
<EuiFlexItem
|
||||
grow={false}
|
||||
>
|
||||
<EuiText>
|
||||
<EuiText
|
||||
size="s"
|
||||
>
|
||||
<FormattedMessage
|
||||
defaultMessage="Update rule condition from {conditionValue} to"
|
||||
id="xpack.ml.ruleEditor.editConditionLink.updateRuleConditionFromText"
|
||||
|
@ -57,7 +59,9 @@ exports[`EditConditionLink renders for a condition using diff from typical 1`] =
|
|||
<EuiFlexItem
|
||||
grow={false}
|
||||
>
|
||||
<EuiText>
|
||||
<EuiText
|
||||
size="s"
|
||||
>
|
||||
<FormattedMessage
|
||||
defaultMessage="Update rule condition from {conditionValue} to"
|
||||
id="xpack.ml.ruleEditor.editConditionLink.updateRuleConditionFromText"
|
||||
|
@ -106,7 +110,9 @@ exports[`EditConditionLink renders for a condition using typical 1`] = `
|
|||
<EuiFlexItem
|
||||
grow={false}
|
||||
>
|
||||
<EuiText>
|
||||
<EuiText
|
||||
size="s"
|
||||
>
|
||||
<FormattedMessage
|
||||
defaultMessage="Update rule condition from {conditionValue} to"
|
||||
id="xpack.ml.ruleEditor.editConditionLink.updateRuleConditionFromText"
|
||||
|
|
|
@ -70,7 +70,7 @@ export class EditConditionLink extends Component {
|
|||
return (
|
||||
<EuiFlexGroup alignItems="center" gutterSize="s">
|
||||
<EuiFlexItem grow={false}>
|
||||
<EuiText>
|
||||
<EuiText size={'s'}>
|
||||
<FormattedMessage
|
||||
id="xpack.ml.ruleEditor.editConditionLink.updateRuleConditionFromText"
|
||||
defaultMessage="Update rule condition from {conditionValue} to"
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue