Upgrade EUI to 12.1.0 (#39601)

* eui@12.1.0

* jest regenerator-runtime babel-polyfill

* TS Toast -> EuiGlobalToastListToast

* EuiBadge

* EuiCopy

* snapshot updates

* simplify toast interface usage

* misc review cleanup

* remove eui core-js resolution
This commit is contained in:
Greg Thompson 2019-06-26 11:00:27 -05:00 committed by GitHub
parent 51ae0f45af
commit c59875573e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
58 changed files with 198 additions and 187 deletions

View file

@ -79,8 +79,7 @@
"resolutions": {
"**/@types/node": "10.12.27",
"**/@types/hapi": "^17.0.18",
"**/typescript": "^3.3.3333",
"**/@elastic/eui/**/core-js": "2.6.9"
"**/typescript": "^3.3.3333"
},
"workspaces": {
"packages": [
@ -104,7 +103,7 @@
"@babel/register": "7.4.4",
"@elastic/charts": "^7.0.1",
"@elastic/datemath": "5.0.2",
"@elastic/eui": "11.3.2",
"@elastic/eui": "12.1.0",
"@elastic/filesaver": "1.1.2",
"@elastic/good": "8.1.1-kibana2",
"@elastic/numeral": "2.3.3",

View file

@ -17,7 +17,7 @@
* under the License.
*/
import { EuiGlobalToastList, Toast } from '@elastic/eui';
import { EuiGlobalToastList, EuiGlobalToastListToast as Toast } from '@elastic/eui';
import React from 'react';
import * as Rx from 'rxjs';

View file

@ -19,4 +19,4 @@
export { ToastsService, ToastsSetup, ToastsStart } from './toasts_service';
export { ErrorToastOptions, ToastsApi, ToastInput } from './toasts_api';
export { Toast } from '@elastic/eui';
export { EuiGlobalToastListToast as Toast } from '@elastic/eui';

View file

@ -17,7 +17,7 @@
* under the License.
*/
import { Toast } from '@elastic/eui';
import { EuiGlobalToastListToast as Toast } from '@elastic/eui';
import React from 'react';
import * as Rx from 'rxjs';

View file

@ -20,7 +20,7 @@
import React from 'react';
import { render, unmountComponentAtNode } from 'react-dom';
import { Toast } from '@elastic/eui';
import { EuiGlobalToastListToast as Toast } from '@elastic/eui';
import { I18nStart } from '../../i18n';
import { UiSettingsSetup } from '../../ui_settings';
import { GlobalToastList } from './global_toast_list';

View file

@ -8,7 +8,7 @@ import { IconType } from '@elastic/eui';
import { Observable } from 'rxjs';
import React from 'react';
import * as Rx from 'rxjs';
import { Toast } from '@elastic/eui';
import { EuiGlobalToastListToast as Toast } from '@elastic/eui';
// @public (undocumented)
export interface ApplicationSetup {

View file

@ -21,3 +21,5 @@
// include the necessary polyfills when using `@babel/preset-env`, but for some
// reason it did not work. See https://github.com/elastic/kibana/issues/14506
import '../../../setup_node_env/babel_register/polyfill';
// Required for EUI
import 'regenerator-runtime/runtime';

View file

@ -28,7 +28,7 @@ interface Props {
[propName: string]: any;
}
export const FilterView: SFC<Props> = ({ filter, ...rest }: Props) => {
export const FilterView: SFC<Props> = ({ filter, iconOnClick, onClick, ...rest }: Props) => {
let title = `Filter: ${getFilterDisplayText(filter)}. ${i18n.translate(
'data.filter.filterBar.moreFilterActionsMessage',
{
@ -51,16 +51,17 @@ export const FilterView: SFC<Props> = ({ filter, ...rest }: Props) => {
<EuiBadge
title={title}
iconType="cross"
// @ts-ignore
iconSide="right"
closeButtonProps={{
// Removing tab focus on close button because the same option can be optained through the context menu
// Also, we may want to add a `DEL` keyboard press functionality
tabIndex: '-1',
tabIndex: -1,
}}
iconOnClick={iconOnClick}
iconOnClickAriaLabel={i18n.translate('data.filter.filterBar.filterItemBadgeIconAriaLabel', {
defaultMessage: 'Delete',
})}
onClick={onClick}
onClickAriaLabel={i18n.translate('data.filter.filterBar.filterItemBadgeAriaLabel', {
defaultMessage: 'Filter actions',
})}

View file

@ -105,7 +105,6 @@ exports[`props isBeta 1`] = `
 
<EuiBetaBadge
label="Beta"
tooltipPosition="top"
/>
</h2>
</EuiTitle>

View file

@ -16,7 +16,6 @@ exports[`Header should render a different name, prompt, and beta tag if provided
<EuiBetaBadge
label="Beta"
tooltipPosition="top"
/>
</h1>
</EuiTitle>

View file

@ -22,7 +22,6 @@ exports[`render 1`] = `
Object {
"kibanaStatus": <EuiBadge
color="secondary"
iconSide="left"
>
Green
</EuiBadge>,

View file

@ -12,6 +12,7 @@ exports[`ScriptingHelpFlyout should render normally 1`] = `
>
<EuiFlyoutBody>
<EuiTabbedContent
autoFocus="initial"
initialSelectedTab={
Object {
"content": <ScriptingSyntax />,

View file

@ -51,7 +51,6 @@ exports[`render 1`] = `
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="Snapshot URLs encode the current state of the {objectType} in the URL itself. Edits to the saved {objectType} won't be visible via this URL."
@ -64,7 +63,6 @@ exports[`render 1`] = `
/>
}
position="bottom"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>,
@ -87,7 +85,6 @@ exports[`render 1`] = `
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="You can share this URL with people to let them load the most recent saved version of this {objectType}."
@ -100,7 +97,6 @@ exports[`render 1`] = `
/>
}
position="bottom"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>,
@ -137,7 +133,6 @@ exports[`render 1`] = `
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="We recommend sharing shortened snapshot URLs for maximum compatibility. Internet Explorer has URL length restrictions, and some wiki and markup parsers don't do well with the full-length version of the snapshot URL, but the short URL should work great."
@ -146,7 +141,6 @@ exports[`render 1`] = `
/>
}
position="bottom"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>
@ -201,7 +195,6 @@ exports[`should enable saved object export option when objectId is provided 1`]
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="Snapshot URLs encode the current state of the {objectType} in the URL itself. Edits to the saved {objectType} won't be visible via this URL."
@ -214,7 +207,6 @@ exports[`should enable saved object export option when objectId is provided 1`]
/>
}
position="bottom"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>,
@ -237,7 +229,6 @@ exports[`should enable saved object export option when objectId is provided 1`]
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="You can share this URL with people to let them load the most recent saved version of this {objectType}."
@ -250,7 +241,6 @@ exports[`should enable saved object export option when objectId is provided 1`]
/>
}
position="bottom"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>,
@ -287,7 +277,6 @@ exports[`should enable saved object export option when objectId is provided 1`]
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="We recommend sharing shortened snapshot URLs for maximum compatibility. Internet Explorer has URL length restrictions, and some wiki and markup parsers don't do well with the full-length version of the snapshot URL, but the short URL should work great."
@ -296,7 +285,6 @@ exports[`should enable saved object export option when objectId is provided 1`]
/>
}
position="bottom"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>
@ -351,7 +339,6 @@ exports[`should hide short url section when allowShortUrl is false 1`] = `
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="Snapshot URLs encode the current state of the {objectType} in the URL itself. Edits to the saved {objectType} won't be visible via this URL."
@ -364,7 +351,6 @@ exports[`should hide short url section when allowShortUrl is false 1`] = `
/>
}
position="bottom"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>,
@ -387,7 +373,6 @@ exports[`should hide short url section when allowShortUrl is false 1`] = `
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="You can share this URL with people to let them load the most recent saved version of this {objectType}."
@ -400,7 +385,6 @@ exports[`should hide short url section when allowShortUrl is false 1`] = `
/>
}
position="bottom"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>,

View file

@ -100,7 +100,10 @@ class UrlPanelContentUI extends Component<Props, State> {
{this.renderShortUrlSwitch()}
<EuiCopy textToCopy={this.state.url} anchorClassName="kbnShareContextMenu__copyAnchor">
<EuiCopy
textToCopy={this.state.url || ''}
anchorClassName="kbnShareContextMenu__copyAnchor"
>
{(copy: () => void) => (
<EuiButton
fill

View file

@ -7,7 +7,7 @@
},
"license": "Apache-2.0",
"dependencies": {
"@elastic/eui": "11.3.2",
"@elastic/eui": "12.1.0",
"react": "^16.8.0",
"react-dom": "^16.8.0"
}

View file

@ -7,7 +7,7 @@
},
"license": "Apache-2.0",
"dependencies": {
"@elastic/eui": "11.3.2",
"@elastic/eui": "12.1.0",
"react": "^16.8.0"
}
}

View file

@ -8,7 +8,7 @@
},
"license": "Apache-2.0",
"dependencies": {
"@elastic/eui": "11.3.2",
"@elastic/eui": "12.1.0",
"react": "^16.8.0"
},
"scripts": {

View file

@ -8,7 +8,7 @@
},
"license": "Apache-2.0",
"dependencies": {
"@elastic/eui": "11.3.2",
"@elastic/eui": "12.1.0",
"react": "^16.8.0"
},
"scripts": {

View file

@ -7,7 +7,7 @@
},
"license": "Apache-2.0",
"dependencies": {
"@elastic/eui": "11.3.2",
"@elastic/eui": "12.1.0",
"react": "^16.8.0",
"react-dom": "^16.8.0"
}

View file

@ -22,7 +22,6 @@ import { Direction } from '@elastic/eui/src/services/sort/sort_direction';
declare module '@elastic/eui' {
export const EuiWrappingPopover: React.SFC<any>;
export const EuiCopy: React.SFC<any>;
export const EuiOutsideClickDetector: React.SFC<any>;
export const EuiSideNav: React.SFC<any>;

View file

@ -515,6 +515,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
<a
className="euiLink euiLink--primary c0"
href="#/opbeans-python/errors/a0ce2c8978ef92cdf2ff163ae28576ee?rangeFrom=now-24h&rangeTo=now&refreshPaused=true&refreshInterval=0"
rel="noreferrer"
>
a0ce2
</a>
@ -546,6 +547,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
href="#/opbeans-python/errors/a0ce2c8978ef92cdf2ff163ae28576ee?rangeFrom=now-24h&rangeTo=now&refreshPaused=true&refreshInterval=0"
onBlur={[Function]}
onFocus={[Function]}
rel="noreferrer"
>
About to blow up!
</a>
@ -622,6 +624,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
<a
className="euiLink euiLink--primary c0"
href="#/opbeans-python/errors/f3ac95493913cc7a3cfec30a19d2120a?rangeFrom=now-24h&rangeTo=now&refreshPaused=true&refreshInterval=0"
rel="noreferrer"
>
f3ac9
</a>
@ -653,6 +656,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
href="#/opbeans-python/errors/f3ac95493913cc7a3cfec30a19d2120a?rangeFrom=now-24h&rangeTo=now&refreshPaused=true&refreshInterval=0"
onBlur={[Function]}
onFocus={[Function]}
rel="noreferrer"
>
AssertionError:
</a>
@ -729,6 +733,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
<a
className="euiLink euiLink--primary c0"
href="#/opbeans-python/errors/e90863d04b7a692435305f09bbe8c840?rangeFrom=now-24h&rangeTo=now&refreshPaused=true&refreshInterval=0"
rel="noreferrer"
>
e9086
</a>
@ -760,6 +765,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
href="#/opbeans-python/errors/e90863d04b7a692435305f09bbe8c840?rangeFrom=now-24h&rangeTo=now&refreshPaused=true&refreshInterval=0"
onBlur={[Function]}
onFocus={[Function]}
rel="noreferrer"
>
AssertionError: Bad luck!
</a>
@ -836,6 +842,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
<a
className="euiLink euiLink--primary c0"
href="#/opbeans-python/errors/8673d8bf7a032e387c101bafbab0d2bc?rangeFrom=now-24h&rangeTo=now&refreshPaused=true&refreshInterval=0"
rel="noreferrer"
>
8673d
</a>
@ -867,6 +874,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
href="#/opbeans-python/errors/8673d8bf7a032e387c101bafbab0d2bc?rangeFrom=now-24h&rangeTo=now&refreshPaused=true&refreshInterval=0"
onBlur={[Function]}
onFocus={[Function]}
rel="noreferrer"
>
Customer with ID 8517 not found
</a>

View file

@ -80,6 +80,7 @@ NodeList [
<a
class="euiLink euiLink--primary"
href="/app/kibana#/management/elasticsearch/upgrade_assistant"
rel="noreferrer"
>
Learn more by visiting the Kibana Upgrade Assistant
</a>
@ -96,6 +97,7 @@ NodeList [
<a
class="euiLink euiLink--primary"
href="/app/kibana#/home/tutorial/apm"
rel="noreferrer"
>
<button
class="euiButton euiButton--primary euiButton--small euiButton--fill"
@ -164,6 +166,7 @@ NodeList [
aria-describedby="service-name-tooltip"
class="euiLink euiLink--primary sc-bdVaJa eQDnXY"
href="#/My Go Service/transactions?rangeFrom=now-24h&rangeTo=now&refreshPaused=true&refreshInterval=0"
rel="noreferrer"
>
My Go Service
</a>
@ -262,6 +265,7 @@ NodeList [
aria-describedby="service-name-tooltip"
class="euiLink euiLink--primary sc-bdVaJa eQDnXY"
href="#/My Python Service/transactions?rangeFrom=now-24h&rangeTo=now&refreshPaused=true&refreshInterval=0"
rel="noreferrer"
>
My Python Service
</a>

View file

@ -4,17 +4,14 @@
* you may not use this file except in compliance with the Elastic License.
*/
import { EuiBadge } from '@elastic/eui';
import { EuiBadge, EuiBadgeProps } from '@elastic/eui';
import React from 'react';
import { TABLE_CONFIG } from '../../../common/constants';
interface TagBadgeProps {
iconType?: any;
onClick?: () => void;
onClickAriaLabel?: string;
type TagBadgeProps = EuiBadgeProps & {
maxIdRenderSize?: number;
tag: { name: string; color: string; disabled?: boolean; id: string };
}
};
export const TagBadge = (props: TagBadgeProps) => {
const { iconType, onClick, onClickAriaLabel, tag } = props;
@ -23,14 +20,28 @@ export const TagBadge = (props: TagBadgeProps) => {
tag.name.length > maxIdRenderSize ? '...' : ''
}`;
return (
<EuiBadge
color={tag.disabled ? 'default' : tag.color || 'primary'}
iconType={tag.disabled ? 'cross' : iconType}
onClick={tag.disabled ? undefined : onClick}
onClickAriaLabel={tag.disabled ? undefined : onClickAriaLabel}
>
{idToRender}
</EuiBadge>
);
if (tag.disabled) {
return (
<EuiBadge color="default" iconType="cross">
{idToRender}
</EuiBadge>
);
} else if (onClick && onClickAriaLabel) {
return (
<EuiBadge
color={tag.color || 'primary'}
iconType={iconType}
onClick={onClick}
onClickAriaLabel={onClickAriaLabel}
>
{idToRender}
</EuiBadge>
);
} else {
return (
<EuiBadge color={tag.color || 'primary'} iconType={iconType}>
{idToRender}
</EuiBadge>
);
}
};

View file

@ -139,9 +139,7 @@ exports[`render symbol item 1`] = `
className="codeSearch-suggestion__token"
>
<EuiToken
displayOptions={Object {}}
iconType="tokenClass"
size="s"
>
<div
className="euiToken euiToken--tokenTint01 euiToken--circle euiToken--small"

View file

@ -155,9 +155,7 @@ exports[`render full suggestions component 1`] = `
className="euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
>
<EuiToken
displayOptions={Object {}}
iconType="tokenSymbol"
size="s"
>
<div
className="euiToken euiToken--tokenTint07 euiToken--rectangle euiToken--small euiToken--fill"
@ -236,9 +234,7 @@ exports[`render full suggestions component 1`] = `
className="codeSearch-suggestion__token"
>
<EuiToken
displayOptions={Object {}}
iconType="tokenClass"
size="s"
>
<div
className="euiToken euiToken--tokenTint01 euiToken--circle euiToken--small"
@ -311,9 +307,7 @@ exports[`render full suggestions component 1`] = `
className="euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
>
<EuiToken
displayOptions={Object {}}
iconType="tokenFile"
size="s"
>
<div
className="euiToken euiToken--tokenTint12 euiToken--rectangle euiToken--small euiToken--fill"
@ -429,9 +423,7 @@ exports[`render full suggestions component 1`] = `
className="euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
>
<EuiToken
displayOptions={Object {}}
iconType="tokenRepo"
size="s"
>
<div
className="euiToken euiToken--tokenTint05 euiToken--rectangle euiToken--small euiToken--fill"

View file

@ -383,6 +383,7 @@ exports[`ilm summary extension should return extension when index has lifecycle
<a
className="euiLink euiLink--primary"
href="#/management/elasticsearch/index_lifecycle_management/policies/edit/testy"
rel="noreferrer"
>
testy
</a>
@ -748,6 +749,7 @@ exports[`ilm summary extension should return extension when index has lifecycle
<a
className="euiLink euiLink--primary"
href="#/management/elasticsearch/index_lifecycle_management/policies/edit/testy"
rel="noreferrer"
>
testy
</a>

View file

@ -99,6 +99,7 @@ exports[`policy table should show empty state when there are not any policies 1`
class="euiButton euiButton--primary euiButton--fill"
data-test-subj="createPolicyButton"
href="#/management/elasticsearch/index_lifecycle_management/policies/edit"
rel="noreferrer"
>
<span
class="euiButton__content"

View file

@ -1,5 +1,5 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`AddLicense component when license is active should display correct verbiage 1`] = `"<div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\" id=\\"generated-idTitle\\">Update your license</span><div class=\\"euiText euiText--small euiCard__description\\" id=\\"generated-idDescription\\"><p>If you already have a new license, upload it now.</p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"#/management/elasticsearch/license_management/upload_license\\" data-test-subj=\\"updateLicenseButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Update license</span></span></a></span></div>"`;
exports[`AddLicense component when license is active should display correct verbiage 1`] = `"<div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\" id=\\"generated-idTitle\\">Update your license</span><div class=\\"euiText euiText--small euiCard__description\\" id=\\"generated-idDescription\\"><p>If you already have a new license, upload it now.</p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"#/management/elasticsearch/license_management/upload_license\\" rel=\\"noreferrer\\" data-test-subj=\\"updateLicenseButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Update license</span></span></a></span></div>"`;
exports[`AddLicense component when license is expired should display with correct verbiage 1`] = `"<div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\" id=\\"generated-idTitle\\">Update your license</span><div class=\\"euiText euiText--small euiCard__description\\" id=\\"generated-idDescription\\"><p>If you already have a new license, upload it now.</p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"#/management/elasticsearch/license_management/upload_license\\" data-test-subj=\\"updateLicenseButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Update license</span></span></a></span></div>"`;
exports[`AddLicense component when license is expired should display with correct verbiage 1`] = `"<div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\" id=\\"generated-idTitle\\">Update your license</span><div class=\\"euiText euiText--small euiCard__description\\" id=\\"generated-idDescription\\"><p>If you already have a new license, upload it now.</p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"#/management/elasticsearch/license_management/upload_license\\" rel=\\"noreferrer\\" data-test-subj=\\"updateLicenseButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Update license</span></span></a></span></div>"`;

View file

@ -980,6 +980,7 @@ exports[`UploadLicense should display a modal when license requires acknowledgem
<a
className="euiButtonEmpty euiButtonEmpty--primary"
href="#/management/elasticsearch/license_management/home"
rel="noreferrer"
>
<span
className="euiButtonEmpty__content"
@ -1437,6 +1438,7 @@ exports[`UploadLicense should display an error when ES says license is expired 1
<a
className="euiButtonEmpty euiButtonEmpty--primary"
href="#/management/elasticsearch/license_management/home"
rel="noreferrer"
>
<span
className="euiButtonEmpty__content"
@ -1894,6 +1896,7 @@ exports[`UploadLicense should display an error when ES says license is invalid 1
<a
className="euiButtonEmpty euiButtonEmpty--primary"
href="#/management/elasticsearch/license_management/home"
rel="noreferrer"
>
<span
className="euiButtonEmpty__content"
@ -2347,6 +2350,7 @@ exports[`UploadLicense should display an error when submitting invalid JSON 1`]
<a
className="euiButtonEmpty euiButtonEmpty--primary"
href="#/management/elasticsearch/license_management/home"
rel="noreferrer"
>
<span
className="euiButtonEmpty__content"
@ -2804,6 +2808,7 @@ exports[`UploadLicense should display error when ES returns error 1`] = `
<a
className="euiButtonEmpty euiButtonEmpty--primary"
href="#/management/elasticsearch/license_management/home"
rel="noreferrer"
>
<span
className="euiButtonEmpty__content"

View file

@ -7,7 +7,6 @@ exports[`FormLabelWithIconTip component renders as expected 1`] = `
</span>
 
<EuiIconTip
aria-label="Info"
content="tooltip text"
size="s"
type="questionInCircle"

View file

@ -6,9 +6,7 @@ exports[`JsonTooltip Initialization with a non-existing tooltip attribute doesn'
className="ml-info-icon"
>
<EuiIconTip
aria-label="Info"
content=""
type="questionInCircle"
/>
<span
className="ml-info-tooltip-text"
@ -23,9 +21,7 @@ exports[`JsonTooltip Initialize with existing tooltip attribute 1`] = `
className="ml-info-icon"
>
<EuiIconTip
aria-label="Info"
content="Unique identifier for job, can use lowercase alphanumeric and underscores."
type="questionInCircle"
/>
<span
className="ml-info-tooltip-text"
@ -42,9 +38,7 @@ exports[`JsonTooltip Plain initialization doesn't throw an error 1`] = `
className="ml-info-icon"
>
<EuiIconTip
aria-label="Info"
content=""
type="questionInCircle"
/>
<span
className="ml-info-tooltip-text"

View file

@ -42,7 +42,6 @@ exports[`ActionsSection renders with no actions selected 1`] = `
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="The result will not be created."
@ -52,7 +51,6 @@ exports[`ActionsSection renders with no actions selected 1`] = `
}
position="right"
size="s"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>
@ -87,7 +85,6 @@ exports[`ActionsSection renders with no actions selected 1`] = `
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="The value for that series will not be used to update the model."
@ -97,7 +94,6 @@ exports[`ActionsSection renders with no actions selected 1`] = `
}
position="right"
size="s"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>
@ -146,7 +142,6 @@ exports[`ActionsSection renders with skip_result and skip_model_update selected
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="The result will not be created."
@ -156,7 +151,6 @@ exports[`ActionsSection renders with skip_result and skip_model_update selected
}
position="right"
size="s"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>
@ -191,7 +185,6 @@ exports[`ActionsSection renders with skip_result and skip_model_update selected
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="The value for that series will not be used to update the model."
@ -201,7 +194,6 @@ exports[`ActionsSection renders with skip_result and skip_model_update selected
}
position="right"
size="s"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>
@ -250,7 +242,6 @@ exports[`ActionsSection renders with skip_result selected 1`] = `
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="The result will not be created."
@ -260,7 +251,6 @@ exports[`ActionsSection renders with skip_result selected 1`] = `
}
position="right"
size="s"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>
@ -295,7 +285,6 @@ exports[`ActionsSection renders with skip_result selected 1`] = `
grow={false}
>
<EuiIconTip
aria-label="Info"
content={
<FormattedMessage
defaultMessage="The value for that series will not be used to update the model."
@ -305,7 +294,6 @@ exports[`ActionsSection renders with skip_result selected 1`] = `
}
position="right"
size="s"
type="questionInCircle"
/>
</EuiFlexItem>
</EuiFlexGroup>

View file

@ -25,7 +25,6 @@ exports[`Data Frame: Job List <Page /> Minimal initialization 1`] = `
<EuiBetaBadge
label="Beta"
tooltipContent="Data frames are a beta feature. We'd love to hear your feedback."
tooltipPosition="top"
/>
</h1>
</EuiTitle>

View file

@ -2,6 +2,7 @@
exports[`Data Frame: Job List <ExpandedRow /> Minimal initialization 1`] = `
<EuiTabbedContent
autoFocus="initial"
expand={false}
initialSelectedTab={
Object {

View file

@ -26,7 +26,6 @@ exports[`ExplorerChartLabelBadge Render the chart label in one line. 1`] = `
className="ml-explorer-chart-info-icon"
>
<EuiIconTip
aria-label="Info"
className="ml-explorer-chart-eui-icon-tip"
content={
<InjectIntl(ExplorerChartInfoTooltip)
@ -45,7 +44,6 @@ exports[`ExplorerChartLabelBadge Render the chart label in one line. 1`] = `
}
position="top"
size="s"
type="questionInCircle"
/>
</span>
</span>
@ -67,7 +65,6 @@ exports[`ExplorerChartLabelBadge Render the chart label in two lines. 1`] = `
className="ml-explorer-chart-info-icon"
>
<EuiIconTip
aria-label="Info"
className="ml-explorer-chart-eui-icon-tip"
content={
<InjectIntl(ExplorerChartInfoTooltip)
@ -86,7 +83,6 @@ exports[`ExplorerChartLabelBadge Render the chart label in two lines. 1`] = `
}
position="top"
size="s"
type="questionInCircle"
/>
</span>
</span>

View file

@ -7,7 +7,6 @@ exports[`ExplorerChartLabelBadge Render entity label badge. 1`] = `
<EuiBadge
className="ml-reset-font-weight"
color="hollow"
iconSide="left"
>
nginx.access.remote_ip

View file

@ -11,7 +11,6 @@ exports[`Shard should show for assigned primary shards 1`] = `
>
<EuiBadge
color="primary"
iconSide="left"
>
0
</EuiBadge>
@ -29,7 +28,6 @@ exports[`Shard should show for assigned replica shards 1`] = `
>
<EuiBadge
color="secondary"
iconSide="left"
>
0
</EuiBadge>
@ -47,7 +45,6 @@ exports[`Shard should show for initializing shards 1`] = `
>
<EuiBadge
color="default"
iconSide="left"
>
0
</EuiBadge>
@ -65,7 +62,6 @@ exports[`Shard should show for relocating shards 1`] = `
>
<EuiBadge
color="accent"
iconSide="left"
>
0
</EuiBadge>
@ -83,7 +79,6 @@ exports[`Shard should show unassigned primary shards 1`] = `
>
<EuiBadge
color="danger"
iconSide="left"
>
0
</EuiBadge>
@ -101,7 +96,6 @@ exports[`Shard should show unassigned replica shards 1`] = `
>
<EuiBadge
color="warning"
iconSide="left"
>
0
</EuiBadge>

View file

@ -452,10 +452,7 @@ exports[`DetailDrawer component Plugin vertices Plugin has explicit ID shows bas
id="xpack.monitoring.logstash.pipeline.detailDrawer.vertexIdDescription"
values={
Object {
"vertexId": <EuiBadge
color="default"
iconSide="left"
>
"vertexId": <EuiBadge>
parse_apache_logline
</EuiBadge>,
"vertexType": "plugin",

View file

@ -25,7 +25,6 @@ exports[`Metric component renders warning badge 1`] = `
<EuiBadge
className="metricClass"
color="warning"
iconSide="left"
>
220
</EuiBadge>

View file

@ -38,8 +38,6 @@ exports[`PluginStatement component adds warning highlight for cpu time 1`] = `
grow={false}
>
<EuiBadge
color="default"
iconSide="left"
onClick={[Function]}
onClickAriaLabel="View details"
>
@ -114,8 +112,6 @@ exports[`PluginStatement component adds warning highlight for event millis 1`] =
grow={false}
>
<EuiBadge
color="default"
iconSide="left"
onClick={[Function]}
onClickAriaLabel="View details"
>
@ -242,8 +238,6 @@ exports[`PluginStatement component renders input metrics and explicit id fields
grow={false}
>
<EuiBadge
color="default"
iconSide="left"
onClick={[Function]}
onClickAriaLabel="View details"
>
@ -306,8 +300,6 @@ exports[`PluginStatement component renders processor statement metrics 1`] = `
grow={false}
>
<EuiBadge
color="default"
iconSide="left"
onClick={[Function]}
onClickAriaLabel="View details"
>

View file

@ -4,19 +4,7 @@
* you may not use this file except in compliance with the Elastic License.
*/
// TODO: Remove once typescript definitions are in EUI
declare module '@elastic/eui' {
export const EuiCopy: React.SFC<any>;
}
import {
EuiButton,
EuiCopy as EuiCopyTyped,
EuiForm,
EuiFormRow,
EuiSpacer,
EuiText,
} from '@elastic/eui';
import { EuiButton, EuiCopy, EuiForm, EuiFormRow, EuiSpacer, EuiText } from '@elastic/eui';
import { FormattedMessage, InjectedIntl, injectI18n } from '@kbn/i18n/react';
import React, { Component, ReactElement } from 'react';
import { KFetchError } from 'ui/kfetch/kfetch_error';
@ -138,11 +126,11 @@ class ReportingPanelContentUi extends Component<Props, State> {
</EuiText>
<EuiSpacer size="s" />
<EuiCopyTyped
<EuiCopy
textToCopy={this.state.absoluteUrl}
anchorClassName="kbnShareContextMenu__copyAnchor"
>
{(copy: () => void) => (
{copy => (
<EuiButton className="kbnShareContextMenu__copyButton" onClick={copy} size="s">
<FormattedMessage
id="xpack.reporting.panelContent.copyUrlButtonLabel"
@ -150,7 +138,7 @@ class ReportingPanelContentUi extends Component<Props, State> {
/>
</EuiButton>
)}
</EuiCopyTyped>
</EuiCopy>
</EuiForm>
);
}

View file

@ -36,8 +36,12 @@ const RoundedBadge = styled(EuiBadge)`
export type AndOr = 'and' | 'or';
/** Displays AND / OR in a round badge */
export const AndOrBadge = pure<{ type: AndOr }>(({ type }) => (
<RoundedBadge data-test-subj="and-or-badge" color="hollow">
{type === 'and' ? i18n.AND : i18n.OR}
</RoundedBadge>
));
export const AndOrBadge = pure<{ type: AndOr }>(({ type }) => {
return (
// Ref: https://github.com/elastic/eui/issues/1655
// @ts-ignore
<RoundedBadge data-test-subj="and-or-badge" color="hollow">
{type === 'and' ? i18n.AND : i18n.OR}
</RoundedBadge>
);
});

View file

@ -4,10 +4,9 @@
* you may not use this file except in compliance with the Elastic License.
*/
import { EuiBadge, EuiToolTip, IconType } from '@elastic/eui';
import { EuiBadge, EuiBadgeProps, EuiToolTip, IconType } from '@elastic/eui';
import * as React from 'react';
import { pure } from 'recompose';
import styled from 'styled-components';
import { Omit } from '../../../common/utility_types';
import { DragEffects, DraggableWrapper } from '../drag_and_drop/draggable_wrapper';
@ -117,9 +116,13 @@ export const DefaultDraggable = pure<DefaultDraggableType>(
) : null
);
const Badge = styled(EuiBadge)`
vertical-align: top;
`;
// Ref: https://github.com/elastic/eui/issues/1655
// const Badge = styled(EuiBadge)`
// vertical-align: top;
// `;
export const Badge = (props: EuiBadgeProps) => (
<EuiBadge {...props} style={{ verticalAlign: 'top' }} />
);
export type BadgeDraggableType = Omit<DefaultDraggableType, 'id'> & {
contextId: string;

View file

@ -4,7 +4,7 @@
* you may not use this file except in compliance with the Elastic License.
*/
import { EuiBadge, EuiPanel, EuiText } from '@elastic/eui';
import { EuiBadge, EuiBadgeProps, EuiPanel, EuiText } from '@elastic/eui';
import * as React from 'react';
import { pure } from 'recompose';
import styled from 'styled-components';
@ -57,13 +57,26 @@ export const Text = styled(EuiText)`
user-select: none;
`;
export const Badge = styled(EuiBadge)`
border-radius: 5px;
min-width: 25px;
padding: 0px;
transform: translateY(10px);
z-index: 10;
`;
// Ref: https://github.com/elastic/eui/issues/1655
// export const Badge = styled(EuiBadge)`
// border-radius: 5px;
// min-width: 25px;
// padding: 0px;
// transform: translateY(10px);
// z-index: 10;
// `;
export const Badge = (props: EuiBadgeProps) => (
<EuiBadge
{...props}
style={{
borderRadius: '5px',
minWidth: '25px',
padding: '0px',
transform: 'translateY(10px)',
zIndex: 10,
}}
/>
);
interface FlyoutButtonProps {
dataProviders: DataProvider[];
onOpen: () => void;

View file

@ -4,7 +4,8 @@
* you may not use this file except in compliance with the Elastic License.
*/
import { EuiBadge, EuiFlexGroup, EuiIcon, EuiPage } from '@elastic/eui';
import React from 'react';
import { EuiBadge, EuiBadgeProps, EuiFlexGroup, EuiIcon, EuiPage } from '@elastic/eui';
import styled, { injectGlobal } from 'styled-components';
import { getOr } from 'lodash/fp';
@ -92,17 +93,25 @@ export const Pane1FlexContent = styled.div`
height: 100%;
`;
export const CountBadge = styled(EuiBadge)`
margin-left: 5px;
`;
// Ref: https://github.com/elastic/eui/issues/1655
// const Badge = styled(EuiBadge)`
// margin-left: 5px;
// `;
export const CountBadge = (props: EuiBadgeProps) => (
<EuiBadge {...props} style={{ marginLeft: '5px' }} />
);
export const Spacer = styled.span`
margin-left: 5px;
`;
export const Badge = styled(EuiBadge)`
vertical-align: top;
`;
// Ref: https://github.com/elastic/eui/issues/1655
// export const Badge = styled(EuiBadge)`
// vertical-align: top;
// `;
export const Badge = (props: EuiBadgeProps) => (
<EuiBadge {...props} style={{ verticalAlign: 'top' }} />
);
export const MoreRowItems = styled(EuiIcon)`
margin-left: 5px;

View file

@ -8,7 +8,7 @@ exports[`Stat Items Component disable charts it renders the default widget 1`] =
"getState": [Function],
"replaceReducer": [Function],
"subscribe": [Function],
Symbol(Symbol.observable): [Function],
Symbol(observable): [Function],
}
}
>
@ -123,7 +123,7 @@ exports[`Stat Items Component disable charts it renders the default widget 2`] =
"getState": [Function],
"replaceReducer": [Function],
"subscribe": [Function],
Symbol(Symbol.observable): [Function],
Symbol(observable): [Function],
}
}
>
@ -241,7 +241,7 @@ exports[`Stat Items Component rendering kpis with charts it renders the default
"getState": [Function],
"replaceReducer": [Function],
"subscribe": [Function],
Symbol(Symbol.observable): [Function],
Symbol(observable): [Function],
}
}
>

View file

@ -4,7 +4,12 @@
* you may not use this file except in compliance with the Elastic License.
*/
import { EuiButton, EuiFlexGroup, EuiFlexItem, Toast } from '@elastic/eui';
import {
EuiButton,
EuiFlexGroup,
EuiFlexItem,
EuiGlobalToastListToast as Toast,
} from '@elastic/eui';
import { getOr } from 'lodash/fp';
import { pure } from 'recompose';
import * as React from 'react';

View file

@ -4,7 +4,7 @@
* you may not use this file except in compliance with the Elastic License.
*/
import { EuiBadge, EuiFlexGroup, EuiFlexItem, EuiToolTip } from '@elastic/eui';
import { EuiBadge, EuiBadgeProps, EuiFlexGroup, EuiFlexItem, EuiToolTip } from '@elastic/eui';
import * as React from 'react';
import { pure } from 'recompose';
import styled from 'styled-components';
@ -27,9 +27,11 @@ const SignatureFlexItem = styled(EuiFlexItem)`
min-width: 77px;
`;
const Badge = styled(EuiBadge)`
vertical-align: top;
`;
// Ref: https://github.com/elastic/eui/issues/1655
// const Badge = styled(EuiBadge)`
// vertical-align: top;
// `;
const Badge = (props: EuiBadgeProps) => <EuiBadge {...props} style={{ verticalAlign: 'top' }} />;
const LinkFlexItem = styled(EuiFlexItem)`
margin-left: 6px;

View file

@ -4,7 +4,7 @@
* you may not use this file except in compliance with the Elastic License.
*/
import { EuiBadge, EuiFlexGroup, EuiFlexItem, EuiToolTip } from '@elastic/eui';
import { EuiBadge, EuiBadgeProps, EuiFlexGroup, EuiFlexItem, EuiToolTip } from '@elastic/eui';
import { get } from 'lodash/fp';
import * as React from 'react';
import { pure } from 'recompose';
@ -20,9 +20,11 @@ import { IS_OPERATOR } from '../../../data_providers/data_provider';
import * as i18n from './translations';
const Badge = styled(EuiBadge)`
vertical-align: top;
`;
// Ref: https://github.com/elastic/eui/issues/1655
// const Badge = styled(EuiBadge)`
// vertical-align: top;
// `;
const Badge = (props: EuiBadgeProps) => <EuiBadge {...props} style={{ verticalAlign: 'top' }} />;
const TokensFlexItem = styled(EuiFlexItem)`
margin-left: 3px;

View file

@ -4,7 +4,7 @@
* you may not use this file except in compliance with the Elastic License.
*/
import { EuiBadge, EuiText } from '@elastic/eui';
import { EuiBadge, EuiBadgeProps, EuiText } from '@elastic/eui';
import * as React from 'react';
import { pure } from 'recompose';
import styled from 'styled-components';
@ -20,12 +20,24 @@ const Text = styled(EuiText)`
white-space: nowrap;
`;
const BadgeHighlighted = styled(EuiBadge)`
height: 20px;
margin: 0 5px 0 5px;
max-width: 70px;
min-width: 70px;
`;
// Ref: https://github.com/elastic/eui/issues/1655
// const BadgeHighlighted = styled(EuiBadge)`
// height: 20px;
// margin: 0 5px 0 5px;
// max-width: 70px;
// min-width: 70px;
// `;
const BadgeHighlighted = (props: EuiBadgeProps) => (
<EuiBadge
{...props}
style={{
height: '20px',
margin: '0 5px 0 5px',
maxWidth: '70px',
minWidth: '70px',
}}
/>
);
const EmptyContainer = styled.div<{ showSmallMsg: boolean }>`
width: ${props => (props.showSmallMsg ? '60px' : 'auto')}

View file

@ -69,6 +69,8 @@ export const ProviderBadge = pure<ProviderBadgeProps>(
const title = `${field}: "${formattedValue}"`;
return (
// Ref: https://github.com/elastic/eui/issues/1655
// @ts-ignore
<ProviderBadgeStyled
id={`${providerId}-${field}-${val}`}
className={classes}
@ -83,7 +85,7 @@ export const ProviderBadge = pure<ProviderBadgeProps>(
closeButtonProps={{
// Removing tab focus on close button because the same option can be obtained through the context menu
// TODO: add a `DEL` keyboard press functionality
tabIndex: '-1',
tabIndex: -1,
}}
data-test-subj="providerBadge"
>

View file

@ -4,7 +4,7 @@
* you may not use this file except in compliance with the Elastic License.
*/
import { EuiBadge, EuiFlexGroup, EuiFlexItem, EuiText } from '@elastic/eui';
import { EuiBadge, EuiBadgeProps, EuiFlexGroup, EuiFlexItem, EuiText } from '@elastic/eui';
import * as React from 'react';
import { pure } from 'recompose';
import styled from 'styled-components';
@ -49,9 +49,13 @@ const DropAndTargetDataProviders = styled.div<{ hasAndItem: boolean }>`
cursor: ${({ hasAndItem }) => (!hasAndItem ? `default` : 'inherit')};
`;
const NumberProviderAndBadge = styled(EuiBadge)`
margin: 0px 5px;
`;
// Ref: https://github.com/elastic/eui/issues/1655
// const NumberProviderAndBadge = styled(EuiBadge)`
// margin: 0px 5px;
// `;
const NumberProviderAndBadge = (props: EuiBadgeProps) => (
<EuiBadge {...props} style={{ margin: '0px 5px' }} />
);
interface ProviderItemDropProps {
browserFields: BrowserFields;

View file

@ -6,6 +6,7 @@
import {
EuiBadge,
EuiBadgeProps,
EuiButton,
EuiButtonEmpty,
EuiFieldText,
@ -19,7 +20,6 @@ import {
import * as React from 'react';
import { pure } from 'recompose';
import uuid from 'uuid';
import styled from 'styled-components';
import { Note } from '../../../lib/note';
import { Notes } from '../../notes';
@ -40,9 +40,13 @@ export const historyToolTip = 'The chronological history of actions related to t
export const streamLiveToolTip = 'Update the Timeline as new data arrives';
export const newTimelineToolTip = 'Create a new timeline';
const NotesCountBadge = styled(EuiBadge)`
margin-left: 5px;
`;
// Ref: https://github.com/elastic/eui/issues/1655
// const NotesCountBadge = styled(EuiBadge)`
// margin-left: 5px;
// `;
const NotesCountBadge = (props: EuiBadgeProps) => (
<EuiBadge {...props} style={{ marginLeft: '5px' }} />
);
type CreateTimeline = ({ id, show }: { id: string; show?: boolean }) => void;
type UpdateIsFavorite = ({ id, isFavorite }: { id: string; isFavorite: boolean }) => void;

View file

@ -4,7 +4,7 @@
* you may not use this file except in compliance with the Elastic License.
*/
import { EuiGlobalToastList, Toast, EuiButton } from '@elastic/eui';
import { EuiGlobalToastList, EuiGlobalToastListToast as Toast, EuiButton } from '@elastic/eui';
import { noop } from 'lodash/fp';
import React, { createContext, Dispatch, useReducer, useContext, useState } from 'react';
import styled from 'styled-components';

View file

@ -4,7 +4,7 @@
* you may not use this file except in compliance with the Elastic License.
*/
import { Toast, EuiButtonIcon } from '@elastic/eui';
import { EuiGlobalToastListToast as Toast, EuiButtonIcon } from '@elastic/eui';
import copy from 'copy-to-clipboard';
import * as React from 'react';
import uuid from 'uuid';

View file

@ -27,7 +27,6 @@ exports[`PingList component renders sorted list without errors 1`] = `
>
<EuiBadge
color="hollow"
iconSide="left"
>
9231
</EuiBadge>

View file

@ -169,7 +169,7 @@
"@babel/register": "7.4.4",
"@babel/runtime": "7.4.5",
"@elastic/datemath": "5.0.2",
"@elastic/eui": "11.3.2",
"@elastic/eui": "12.1.0",
"@elastic/javascript-typescript-langserver": "^0.2.0",
"@elastic/lsp-extension": "^0.1.2",
"@elastic/node-crypto": "^1.0.0",

View file

@ -1607,16 +1607,15 @@
tabbable "^1.1.0"
uuid "^3.1.0"
"@elastic/eui@11.3.2":
version "11.3.2"
resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-11.3.2.tgz#d578ab2d6ebe9c85a445376fad190564d43bcdb4"
integrity sha512-lnf7ZCEI443uwXJX9rWD/nK10asBTFOmd8HiH1Mn6iggOBchk4QCrI8XDqfJRp2bUqMetBGI6Az7WgqF4uZsEw==
"@elastic/eui@12.1.0":
version "12.1.0"
resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-12.1.0.tgz#bc826bca75035464b2a60582ec0e2d36bd7820e9"
integrity sha512-HjIWQNkCFSNHyoU9nSeM+YPs+B1uD7cwRJnZ7Xc8LlBQOWX10nQ8MSdA4RcKdhvFpf5B9fjtfv1Q8/UiOVXP7w==
dependencies:
"@types/lodash" "^4.14.116"
"@types/numeral" "^0.0.25"
"@types/react-beautiful-dnd" "^10.1.0"
classnames "^2.2.5"
core-js "^2.5.1"
highlight.js "^9.12.0"
html "^1.0.0"
keymirror "^0.1.1"