diff --git a/examples/expressions_explorer/kibana.json b/examples/expressions_explorer/kibana.json index 770ce91143d9..dea706d02494 100644 --- a/examples/expressions_explorer/kibana.json +++ b/examples/expressions_explorer/kibana.json @@ -10,5 +10,5 @@ }, "requiredPlugins": ["expressions", "inspector", "uiActions", "developerExamples"], "optionalPlugins": [], - "requiredBundles": [] + "requiredBundles": ["kibanaReact"] } diff --git a/examples/expressions_explorer/public/app.tsx b/examples/expressions_explorer/public/app.tsx index 260c529650bd..631b60f4dc56 100644 --- a/examples/expressions_explorer/public/app.tsx +++ b/examples/expressions_explorer/public/app.tsx @@ -18,7 +18,7 @@ import { EuiText, EuiLink, } from '@elastic/eui'; -import { AppMountParameters } from '../../../src/core/public'; +import { AppMountParameters, IUiSettingsClient } from '../../../src/core/public'; import { ExpressionsStart } from '../../../src/plugins/expressions/public'; import { Start as InspectorStart } from '../../../src/plugins/inspector/public'; import { RunExpressionsExample } from './run_expressions'; @@ -26,53 +26,58 @@ import { RenderExpressionsExample } from './render_expressions'; import { ActionsExpressionsExample } from './actions_and_expressions'; import { UiActionsStart } from '../../../src/plugins/ui_actions/public'; import { ActionsExpressionsExample2 } from './actions_and_expressions2'; +import { createKibanaReactContext } from '../../../src/plugins/kibana_react/public'; interface Props { expressions: ExpressionsStart; inspector: InspectorStart; actions: UiActionsStart; + uiSettings: IUiSettingsClient; } -const ExpressionsExplorer = ({ expressions, inspector, actions }: Props) => { +const ExpressionsExplorer = ({ expressions, inspector, actions, uiSettings }: Props) => { + const { Provider: KibanaReactContextProvider } = createKibanaReactContext({ uiSettings }); return ( - - - Expressions Explorer - - - -

- There are a couple of ways to run the expressions. Below some of the options are - demonstrated. You can read more about it{' '} - - here - -

- + + + + Expressions Explorer + + + +

+ There are a couple of ways to run the expressions. Below some of the options are + demonstrated. You can read more about it{' '} + + here + +

+ - + - + - + - + - + - + - + - - - - - + + + + + + ); }; diff --git a/examples/expressions_explorer/public/editor/expression_editor.tsx b/examples/expressions_explorer/public/editor/expression_editor.tsx index 16370c2ece28..79c5a296981d 100644 --- a/examples/expressions_explorer/public/editor/expression_editor.tsx +++ b/examples/expressions_explorer/public/editor/expression_editor.tsx @@ -7,7 +7,7 @@ */ import React from 'react'; -import { EuiCodeEditor } from '@elastic/eui'; +import { CodeEditor } from '../../../../src/plugins/kibana_react/public'; interface Props { value: string; @@ -16,19 +16,17 @@ interface Props { export function ExpressionEditor({ value, onChange }: Props) { return ( - {}} aria-label="Code Editor" /> ); diff --git a/examples/expressions_explorer/public/plugin.tsx b/examples/expressions_explorer/public/plugin.tsx index 329dcfbb11d4..07f0526c3461 100644 --- a/examples/expressions_explorer/public/plugin.tsx +++ b/examples/expressions_explorer/public/plugin.tsx @@ -59,6 +59,7 @@ export class ExpressionsExplorerPlugin implements Plugin = ({ filter, stateContainer }) => { <>
- + All - + Completed @@ -76,7 +76,7 @@ const TodoApp: React.FC = ({ filter, stateContainer }) => { to={{ ...location, pathname: '/not-completed' }} data-test-subj={'filterLinkNotCompleted'} > - + Not Completed diff --git a/package.json b/package.json index ca2cb27076c7..c15bb092f17d 100644 --- a/package.json +++ b/package.json @@ -103,7 +103,7 @@ "@elastic/datemath": "link:bazel-bin/packages/elastic-datemath", "@elastic/elasticsearch": "npm:@elastic/elasticsearch-canary@^8.0.0-canary.35", "@elastic/ems-client": "8.0.0", - "@elastic/eui": "40.1.0", + "@elastic/eui": "41.0.0", "@elastic/filesaver": "1.1.2", "@elastic/maki": "6.3.0", "@elastic/node-crypto": "1.2.1", diff --git a/packages/kbn-ui-shared-deps-npm/BUILD.bazel b/packages/kbn-ui-shared-deps-npm/BUILD.bazel index 416a4d4799b7..490aa91f3068 100644 --- a/packages/kbn-ui-shared-deps-npm/BUILD.bazel +++ b/packages/kbn-ui-shared-deps-npm/BUILD.bazel @@ -46,6 +46,7 @@ RUNTIME_DEPS = [ "@npm//moment-timezone", "@npm//moment", "@npm//raw-loader", + "@npm//react-ace", "@npm//react-dom", "@npm//react-intl", "@npm//react-is", diff --git a/packages/kbn-ui-shared-deps-npm/webpack.config.js b/packages/kbn-ui-shared-deps-npm/webpack.config.js index 80043bd0857e..a6e7180e8812 100644 --- a/packages/kbn-ui-shared-deps-npm/webpack.config.js +++ b/packages/kbn-ui-shared-deps-npm/webpack.config.js @@ -82,6 +82,7 @@ module.exports = (_, argv) => { 'moment-timezone/moment-timezone', 'moment-timezone/data/packed/latest.json', 'moment', + 'react-ace', 'react-beautiful-dnd', 'react-dom', 'react-dom/server', diff --git a/src/core/public/core_app/status/components/__snapshots__/server_status.test.tsx.snap b/src/core/public/core_app/status/components/__snapshots__/server_status.test.tsx.snap index 0ed784ef680f..7682a848b0b1 100644 --- a/src/core/public/core_app/status/components/__snapshots__/server_status.test.tsx.snap +++ b/src/core/public/core_app/status/components/__snapshots__/server_status.test.tsx.snap @@ -3,7 +3,7 @@ exports[`ServerStatus renders correctly for green state 2`] = ` @@ -36,7 +36,7 @@ exports[`ServerStatus renders correctly for green state 2`] = ` exports[`ServerStatus renders correctly for red state 2`] = ` diff --git a/src/core/public/core_app/status/components/__snapshots__/status_table.test.tsx.snap b/src/core/public/core_app/status/components/__snapshots__/status_table.test.tsx.snap index 5b0e831286aa..c30637ed85a5 100644 --- a/src/core/public/core_app/status/components/__snapshots__/status_table.test.tsx.snap +++ b/src/core/public/core_app/status/components/__snapshots__/status_table.test.tsx.snap @@ -30,7 +30,7 @@ exports[`StatusTable renders when statuses is provided 1`] = ` "id": "available", "message": "Ready", "title": "green", - "uiColor": "secondary", + "uiColor": "success", }, }, ] diff --git a/src/core/public/core_app/status/components/server_status.test.tsx b/src/core/public/core_app/status/components/server_status.test.tsx index 3aa41827ff40..e4fa84d317dd 100644 --- a/src/core/public/core_app/status/components/server_status.test.tsx +++ b/src/core/public/core_app/status/components/server_status.test.tsx @@ -14,7 +14,7 @@ import { FormattedStatus } from '../lib'; const getStatus = (parts: Partial = {}): FormattedStatus['state'] => ({ id: 'available', title: 'Green', - uiColor: 'secondary', + uiColor: 'success', message: '', ...parts, }); diff --git a/src/core/public/core_app/status/components/status_table.test.tsx b/src/core/public/core_app/status/components/status_table.test.tsx index af7d33bee5ed..3cb5d1126ef3 100644 --- a/src/core/public/core_app/status/components/status_table.test.tsx +++ b/src/core/public/core_app/status/components/status_table.test.tsx @@ -12,7 +12,7 @@ import { StatusTable } from './status_table'; const state = { id: 'available' as const, - uiColor: 'secondary', + uiColor: 'success', message: 'Ready', title: 'green', }; diff --git a/src/core/public/core_app/status/lib/load_status.test.ts b/src/core/public/core_app/status/lib/load_status.test.ts index 73c697c3d55a..b6e7ba9b91e9 100644 --- a/src/core/public/core_app/status/lib/load_status.test.ts +++ b/src/core/public/core_app/status/lib/load_status.test.ts @@ -174,7 +174,7 @@ describe('response processing', () => { id: 'available', title: 'Green', message: 'Elasticsearch is available', - uiColor: 'secondary', + uiColor: 'success', }, }, { @@ -183,12 +183,12 @@ describe('response processing', () => { id: 'available', title: 'Green', message: 'SavedObjects service has completed migrations and is available', - uiColor: 'secondary', + uiColor: 'success', }, }, { id: 'plugin:1', - state: { id: 'available', title: 'Green', message: 'Ready', uiColor: 'secondary' }, + state: { id: 'available', title: 'Green', message: 'Ready', uiColor: 'success' }, }, { id: 'plugin:2', diff --git a/src/core/public/core_app/status/lib/load_status.ts b/src/core/public/core_app/status/lib/load_status.ts index e65764771f0f..0baa67d4e793 100644 --- a/src/core/public/core_app/status/lib/load_status.ts +++ b/src/core/public/core_app/status/lib/load_status.ts @@ -128,7 +128,7 @@ const STATUS_LEVEL_UI_ATTRS: Record = { title: i18n.translate('core.status.greenTitle', { defaultMessage: 'Green', }), - uiColor: 'secondary', + uiColor: 'success', }, }; diff --git a/src/core/public/i18n/__snapshots__/i18n_service.test.tsx.snap b/src/core/public/i18n/__snapshots__/i18n_service.test.tsx.snap index 197714df7f20..e93ef34c3802 100644 --- a/src/core/public/i18n/__snapshots__/i18n_service.test.tsx.snap +++ b/src/core/public/i18n/__snapshots__/i18n_service.test.tsx.snap @@ -26,10 +26,6 @@ exports[`#start() returns \`Context\` component 1`] = ` "euiCodeBlock.copyButton": "Copy", "euiCodeBlock.fullscreenCollapse": "Collapse", "euiCodeBlock.fullscreenExpand": "Expand", - "euiCodeEditor.startEditing": "Press Enter to start editing.", - "euiCodeEditor.startInteracting": "Press Enter to start interacting with the code.", - "euiCodeEditor.stopEditing": "When you're done, press Escape to stop editing.", - "euiCodeEditor.stopInteracting": "When you're done, press Escape to stop interacting with the code.", "euiCollapsedItemActions.allActions": "All actions", "euiColorPicker.alphaLabel": "Alpha channel (opacity) value", "euiColorPicker.closeLabel": "Press the down key to open a popover containing color options", diff --git a/src/core/public/i18n/i18n_eui_mapping.tsx b/src/core/public/i18n/i18n_eui_mapping.tsx index f28add25056e..79180575129e 100644 --- a/src/core/public/i18n/i18n_eui_mapping.tsx +++ b/src/core/public/i18n/i18n_eui_mapping.tsx @@ -127,22 +127,6 @@ export const getEuiContextMapping = (): EuiTokensObject => { defaultMessage: 'Expand', description: 'ARIA label for a button that enters fullscreen view', }), - 'euiCodeEditor.startEditing': i18n.translate('core.euiCodeEditor.startEditing', { - defaultMessage: 'Press Enter to start editing.', - description: 'Screen reader text to prompt editing', - }), - 'euiCodeEditor.startInteracting': i18n.translate('core.euiCodeEditor.startInteracting', { - defaultMessage: 'Press Enter to start interacting with the code.', - description: 'Screen reader text to prompt interaction', - }), - 'euiCodeEditor.stopEditing': i18n.translate('core.euiCodeEditor.stopEditing', { - defaultMessage: "When you're done, press Escape to stop editing.", - description: 'Screen reader text to describe ending editing', - }), - 'euiCodeEditor.stopInteracting': i18n.translate('core.euiCodeEditor.stopInteracting', { - defaultMessage: "When you're done, press Escape to stop interacting with the code.", - description: 'Screen reader text to describe ending interactions', - }), 'euiCollapsedItemActions.allActions': i18n.translate( 'core.euiCollapsedItemActions.allActions', { diff --git a/src/core/server/status/legacy_status.test.ts b/src/core/server/status/legacy_status.test.ts index 8f1193cfcbd3..61c356e514e5 100644 --- a/src/core/server/status/legacy_status.test.ts +++ b/src/core/server/status/legacy_status.test.ts @@ -37,7 +37,7 @@ describe('calculateLegacyStatus', () => { title: 'Green', nickname: 'Looking good', icon: 'success', - uiColor: 'secondary', + uiColor: 'success', since: expect.any(String), }); }); @@ -80,7 +80,7 @@ describe('calculateLegacyStatus', () => { message: 'Available', since: expect.any(String), state: 'green', - uiColor: 'secondary', + uiColor: 'success', }, { icon: 'danger', diff --git a/src/core/server/status/legacy_status.ts b/src/core/server/status/legacy_status.ts index 1b3d139b1345..654427781ba9 100644 --- a/src/core/server/status/legacy_status.ts +++ b/src/core/server/status/legacy_status.ts @@ -37,7 +37,7 @@ interface LegacyStatusOverall { type LegacyStatusState = 'green' | 'yellow' | 'red'; type LegacyStatusIcon = 'danger' | 'warning' | 'success'; -type LegacyStatusUiColor = 'secondary' | 'warning' | 'danger'; +type LegacyStatusUiColor = 'success' | 'warning' | 'danger'; interface LegacyStateAttr { id: LegacyStatusState; @@ -141,7 +141,7 @@ const STATUS_LEVEL_LEGACY_ATTRS = deepFreeze>({ defaultMessage: 'Green', }), icon: 'success', - uiColor: 'secondary', + uiColor: 'success', nickname: 'Looking good', }, }); diff --git a/src/core/server/status/routes/integration_tests/status.test.ts b/src/core/server/status/routes/integration_tests/status.test.ts index df840f5d7c05..df203675725a 100644 --- a/src/core/server/status/routes/integration_tests/status.test.ts +++ b/src/core/server/status/routes/integration_tests/status.test.ts @@ -164,7 +164,7 @@ describe('GET /api/status', () => { since: expect.any(String), state: 'green', title: 'Green', - uiColor: 'secondary', + uiColor: 'success', }, statuses: [ { @@ -173,7 +173,7 @@ describe('GET /api/status', () => { message: 'Service is working', since: expect.any(String), state: 'green', - uiColor: 'secondary', + uiColor: 'success', }, { icon: 'success', @@ -181,7 +181,7 @@ describe('GET /api/status', () => { message: 'Service is working', since: expect.any(String), state: 'green', - uiColor: 'secondary', + uiColor: 'success', }, { icon: 'success', @@ -189,7 +189,7 @@ describe('GET /api/status', () => { message: 'a is available', since: expect.any(String), state: 'green', - uiColor: 'secondary', + uiColor: 'success', }, { icon: 'warning', diff --git a/src/dev/license_checker/config.ts b/src/dev/license_checker/config.ts index f23456bbaca0..078786abb8c6 100644 --- a/src/dev/license_checker/config.ts +++ b/src/dev/license_checker/config.ts @@ -75,6 +75,6 @@ export const LICENSE_OVERRIDES = { 'jsts@1.6.2': ['Eclipse Distribution License - v 1.0'], // cf. https://github.com/bjornharrtell/jsts '@mapbox/jsonlint-lines-primitives@2.0.2': ['MIT'], // license in readme https://github.com/tmcw/jsonlint '@elastic/ems-client@8.0.0': ['Elastic License 2.0'], - '@elastic/eui@40.1.0': ['SSPL-1.0 OR Elastic License 2.0'], + '@elastic/eui@41.0.0': ['SSPL-1.0 OR Elastic License 2.0'], 'language-subtag-registry@0.3.21': ['CC-BY-4.0'], // retired ODC‑By license https://github.com/mattcg/language-subtag-registry }; diff --git a/src/plugins/advanced_settings/public/management_app/components/field/field.tsx b/src/plugins/advanced_settings/public/management_app/components/field/field.tsx index 745452a31ff9..5e4d047b2c70 100644 --- a/src/plugins/advanced_settings/public/management_app/components/field/field.tsx +++ b/src/plugins/advanced_settings/public/management_app/components/field/field.tsx @@ -8,6 +8,7 @@ import React, { PureComponent, Fragment } from 'react'; import classNames from 'classnames'; +import 'react-ace'; import 'brace/theme/textmate'; import 'brace/mode/markdown'; import 'brace/mode/json'; diff --git a/src/plugins/advanced_settings/public/management_app/components/form/form.tsx b/src/plugins/advanced_settings/public/management_app/components/form/form.tsx index 0b08a317e87c..2356cc7690c7 100644 --- a/src/plugins/advanced_settings/public/management_app/components/form/form.tsx +++ b/src/plugins/advanced_settings/public/management_app/components/form/form.tsx @@ -368,7 +368,7 @@ export class Form extends PureComponent { { } if (statusCode <= 299) { - return 'secondary'; + return 'success'; } if (statusCode <= 399) { diff --git a/src/plugins/dashboard/public/application/top_nav/dashboard_top_nav.tsx b/src/plugins/dashboard/public/application/top_nav/dashboard_top_nav.tsx index 8391edd30d8e..8e24e9ea595d 100644 --- a/src/plugins/dashboard/public/application/top_nav/dashboard_top_nav.tsx +++ b/src/plugins/dashboard/public/application/top_nav/dashboard_top_nav.tsx @@ -502,7 +502,7 @@ export function DashboardTopNav({ { 'data-test-subj': 'dashboardUnsavedChangesBadge', badgeText: unsavedChangesBadge.getUnsavedChangedBadgeText(), - color: 'secondary', + color: 'success', }, ] : undefined; diff --git a/src/plugins/data/public/ui/typeahead/_suggestion.scss b/src/plugins/data/public/ui/typeahead/_suggestion.scss index 67ff17d01705..345c7493dc29 100644 --- a/src/plugins/data/public/ui/typeahead/_suggestion.scss +++ b/src/plugins/data/public/ui/typeahead/_suggestion.scss @@ -1,7 +1,7 @@ // These are the various types in the dropdown, they each get a color $kbnTypeaheadTypes: ( field: $euiColorWarning, - value: $euiColorSecondary, + value: $euiColorSuccess, operator: $euiColorPrimary, conjunction: $euiColorVis3, ); diff --git a/src/plugins/discover/public/application/main/components/sidebar/discover_field_bucket.tsx b/src/plugins/discover/public/application/main/components/sidebar/discover_field_bucket.tsx index 9b0134bf1940..54c5bccaf604 100644 --- a/src/plugins/discover/public/application/main/components/sidebar/discover_field_bucket.tsx +++ b/src/plugins/discover/public/application/main/components/sidebar/discover_field_bucket.tsx @@ -55,7 +55,7 @@ export function DiscoverFieldBucket({ field, bucket, onAddFilter }: Props) { - + {bucket.percent}% diff --git a/src/plugins/discover/public/application/main/components/sidebar/string_progress_bar.tsx b/src/plugins/discover/public/application/main/components/sidebar/string_progress_bar.tsx index a3f6c70c23a6..34bcbfcaf113 100644 --- a/src/plugins/discover/public/application/main/components/sidebar/string_progress_bar.tsx +++ b/src/plugins/discover/public/application/main/components/sidebar/string_progress_bar.tsx @@ -18,7 +18,5 @@ interface Props { export function StringFieldProgressBar({ value, percent, count }: Props) { const ariaLabel = `${value}: ${count} (${percent}%)`; - return ( - - ); + return ; } diff --git a/src/plugins/discover/public/components/discover_grid/discover_grid_expand_button.tsx b/src/plugins/discover/public/components/discover_grid/discover_grid_expand_button.tsx index 3453a535f98d..372fe03666d0 100644 --- a/src/plugins/discover/public/components/discover_grid/discover_grid_expand_button.tsx +++ b/src/plugins/discover/public/components/discover_grid/discover_grid_expand_button.tsx @@ -50,7 +50,7 @@ export const ExpandButton = ({ rowIndex, setCellProps }: EuiDataGridCellValueEle aria-label={buttonLabel} data-test-subj="docTableExpandToggleColumn" onClick={() => setExpanded(isCurrentRowExpanded ? undefined : current)} - color={isCurrentRowExpanded ? 'primary' : 'subdued'} + color={isCurrentRowExpanded ? 'primary' : 'text'} iconType={isCurrentRowExpanded ? 'minimize' : 'expand'} isSelected={isCurrentRowExpanded} /> diff --git a/src/plugins/es_ui_shared/public/components/code_editor/code_editor.tsx b/src/plugins/es_ui_shared/public/components/code_editor/code_editor.tsx index 6299b473f68d..5f172d010b83 100644 --- a/src/plugins/es_ui_shared/public/components/code_editor/code_editor.tsx +++ b/src/plugins/es_ui_shared/public/components/code_editor/code_editor.tsx @@ -9,9 +9,7 @@ import React, { Component, AriaAttributes } from 'react'; import classNames from 'classnames'; import AceEditor, { IAceEditorProps } from 'react-ace'; -import { EuiI18n } from '@elastic/eui'; -// @ts-ignore -import { htmlIdGenerator, keys } from '@elastic/eui/lib/services'; +import { EuiI18n, htmlIdGenerator, keys } from '@elastic/eui'; import './_index.scss'; diff --git a/src/plugins/es_ui_shared/static/forms/components/index.ts b/src/plugins/es_ui_shared/static/forms/components/index.ts index 95b92d205c8c..7dc1ce16a682 100644 --- a/src/plugins/es_ui_shared/static/forms/components/index.ts +++ b/src/plugins/es_ui_shared/static/forms/components/index.ts @@ -9,7 +9,7 @@ /* @TODO -The brace/mode/json import below is loaded eagerly - before this plugin is explicitly loaded by users. This makes +The react-ace and brace/mode/json imports below are loaded eagerly - before this plugin is explicitly loaded by users. This makes the brace JSON mode, used for JSON syntax highlighting and grammar checking, available across all of Kibana plugins. This is not ideal because we are loading JS that is not necessary for Kibana to start, but the alternative @@ -19,6 +19,7 @@ EuiCodeEditor (for instance, explicitly). Importing here is a way of preventing a more sophisticated solution to this problem since we want to, eventually, migrate all code editors over to Monaco. Once that is done, we should remove this import. */ +import 'react-ace'; import 'brace/mode/json'; export * from './field'; diff --git a/src/plugins/home/public/application/components/__snapshots__/synopsis.test.js.snap b/src/plugins/home/public/application/components/__snapshots__/synopsis.test.js.snap index 8e04e70ed92b..68bb6022d093 100644 --- a/src/plugins/home/public/application/components/__snapshots__/synopsis.test.js.snap +++ b/src/plugins/home/public/application/components/__snapshots__/synopsis.test.js.snap @@ -2,7 +2,11 @@ exports[`props iconType 1`] = ` diff --git a/src/plugins/home/public/application/components/synopsis.js b/src/plugins/home/public/application/components/synopsis.js index b450ec8d15d2..73113c48107d 100644 --- a/src/plugins/home/public/application/components/synopsis.js +++ b/src/plugins/home/public/application/components/synopsis.js @@ -22,7 +22,7 @@ export function Synopsis({ id, description, iconUrl, iconType, title, url, onCli return ( `; exports[`Table should render the boolean template (true) 1`] = ` `; diff --git a/src/plugins/index_pattern_management/public/components/edit_index_pattern/indexed_fields_table/components/table/table.tsx b/src/plugins/index_pattern_management/public/components/edit_index_pattern/indexed_fields_table/components/table/table.tsx index e3e59a409333..aed985f062cd 100644 --- a/src/plugins/index_pattern_management/public/components/edit_index_pattern/indexed_fields_table/components/table/table.tsx +++ b/src/plugins/index_pattern_management/public/components/edit_index_pattern/indexed_fields_table/components/table/table.tsx @@ -225,7 +225,7 @@ export const renderFieldName = (field: IndexedFieldItem, timeFieldName?: string) export class Table extends PureComponent { renderBooleanTemplate(value: string, arialLabel: string) { - return value ? : ; + return value ? : ; } renderFieldType(type: string, isConflict: boolean) { diff --git a/src/plugins/inspector/public/views/requests/components/request_selector.tsx b/src/plugins/inspector/public/views/requests/components/request_selector.tsx index 04fac0bd93b7..539abd3d1437 100644 --- a/src/plugins/inspector/public/views/requests/components/request_selector.tsx +++ b/src/plugins/inspector/public/views/requests/components/request_selector.tsx @@ -114,7 +114,7 @@ export class RequestSelector extends Component { } > ); diff --git a/src/plugins/kibana_react/public/code_editor/editor_theme.ts b/src/plugins/kibana_react/public/code_editor/editor_theme.ts index 6c2727b123de..517fe4cf61a0 100644 --- a/src/plugins/kibana_react/public/code_editor/editor_theme.ts +++ b/src/plugins/kibana_react/public/code_editor/editor_theme.ts @@ -35,7 +35,7 @@ export function createTheme( { token: 'strong', fontStyle: 'bold' }, { token: 'variable', foreground: euiTheme.euiColorPrimary }, - { token: 'variable.predefined', foreground: euiTheme.euiColorSecondary }, + { token: 'variable.predefined', foreground: euiTheme.euiColorSuccess }, { token: 'constant', foreground: euiTheme.euiColorAccent }, { token: 'comment', foreground: euiTheme.euiColorMediumShade }, { token: 'number', foreground: euiTheme.euiColorAccent }, @@ -52,7 +52,7 @@ export function createTheme( { token: 'tag.id.jade', foreground: euiTheme.euiColorPrimary }, { token: 'tag.class.jade', foreground: euiTheme.euiColorPrimary }, { token: 'meta.scss', foreground: euiTheme.euiColorAccent }, - { token: 'metatag', foreground: euiTheme.euiColorSecondary }, + { token: 'metatag', foreground: euiTheme.euiColorSuccess }, { token: 'metatag.content.html', foreground: euiTheme.euiColorDanger }, { token: 'metatag.html', foreground: euiTheme.euiColorMediumShade }, { token: 'metatag.xml', foreground: euiTheme.euiColorMediumShade }, @@ -63,7 +63,7 @@ export function createTheme( { token: 'string.value.json', foreground: euiTheme.euiColorPrimary }, { token: 'attribute.name', foreground: euiTheme.euiColorDanger }, - { token: 'attribute.name.css', foreground: euiTheme.euiColorSecondary }, + { token: 'attribute.name.css', foreground: euiTheme.euiColorSuccess }, { token: 'attribute.value', foreground: euiTheme.euiColorPrimary }, { token: 'attribute.value.number', foreground: euiTheme.euiColorWarning }, { token: 'attribute.value.unit', foreground: euiTheme.euiColorWarning }, diff --git a/src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/__snapshots__/elastic_agent_card.test.tsx.snap b/src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/__snapshots__/elastic_agent_card.test.tsx.snap index 8e1d0cb92e00..f6dcf46b27d8 100644 --- a/src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/__snapshots__/elastic_agent_card.test.tsx.snap +++ b/src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/__snapshots__/elastic_agent_card.test.tsx.snap @@ -13,6 +13,11 @@ exports[`ElasticAgentCard props button 1`] = ` } > = ({ description={i18n.translate('kibana-react.noDataPage.elasticAgentCard.description', { defaultMessage: `Use Elastic Agent for a simple, unified way to collect data from your machines.`, })} - betaBadgeLabel={recommended ? NO_DATA_RECOMMENDED : undefined} + betaBadgeProps={{ label: recommended ? NO_DATA_RECOMMENDED : undefined }} footer={footer} layout={layout as 'vertical' | undefined} {...cardRest} diff --git a/src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/no_data_card.tsx b/src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/no_data_card.tsx index 9cc38cc5f603..2d7335a1740a 100644 --- a/src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/no_data_card.tsx +++ b/src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/no_data_card.tsx @@ -33,7 +33,7 @@ export const NoDataCard: FunctionComponent = ({ description={i18n.translate('kibana-react.noDataPage.noDataCard.description', { defaultMessage: `Proceed without collecting data`, })} - betaBadgeLabel={recommended ? NO_DATA_RECOMMENDED : undefined} + betaBadgeProps={{ label: recommended ? NO_DATA_RECOMMENDED : undefined }} footer={footer} layout={layout as 'vertical' | undefined} {...cardRest} diff --git a/src/plugins/presentation_util/public/components/controls/control_group/component/control_group_component.tsx b/src/plugins/presentation_util/public/components/controls/control_group/component/control_group_component.tsx index 22b97b6f6b0d..9b5e5588373d 100644 --- a/src/plugins/presentation_util/public/components/controls/control_group/component/control_group_component.tsx +++ b/src/plugins/presentation_util/public/components/controls/control_group/component/control_group_component.tsx @@ -174,7 +174,7 @@ export const ControlGroup = () => { { const flyoutInstance = openFlyout( diff --git a/src/plugins/presentation_util/public/components/controls/control_types/options_list/options_list_popover_component.tsx b/src/plugins/presentation_util/public/components/controls/control_types/options_list/options_list_popover_component.tsx index 90f92e30c32c..a84d0460e929 100644 --- a/src/plugins/presentation_util/public/components/controls/control_types/options_list/options_list_popover_component.tsx +++ b/src/plugins/presentation_util/public/components/controls/control_types/options_list/options_list_popover_component.tsx @@ -92,7 +92,7 @@ export const OptionsListPopover = ({ size="s" iconType="list" aria-pressed={showOnlySelected} - color={showOnlySelected ? 'primary' : 'subdued'} + color={showOnlySelected ? 'primary' : 'text'} display={showOnlySelected ? 'base' : 'empty'} aria-label={OptionsListStrings.popover.getClearAllSelectionsButtonTitle()} onClick={() => setShowOnlySelected(!showOnlySelected)} diff --git a/src/plugins/presentation_util/public/components/labs/project_list_item.scss b/src/plugins/presentation_util/public/components/labs/project_list_item.scss index 898770f7811a..75c0018989fa 100644 --- a/src/plugins/presentation_util/public/components/labs/project_list_item.scss +++ b/src/plugins/presentation_util/public/components/labs/project_list_item.scss @@ -10,7 +10,7 @@ left: 4px; bottom: $euiSizeL; width: 4px; - background: $euiColorSecondary; + background: $euiColorSuccess; content: ''; } diff --git a/src/plugins/presentation_util/public/components/labs/project_list_item.tsx b/src/plugins/presentation_util/public/components/labs/project_list_item.tsx index 994059c9789e..909e8434f77f 100644 --- a/src/plugins/presentation_util/public/components/labs/project_list_item.tsx +++ b/src/plugins/presentation_util/public/components/labs/project_list_item.tsx @@ -58,7 +58,7 @@ export const ProjectListItem = ({ project, onStatusChange }: Props) => { content={strings.getOverriddenIconTipLabel()} position="top" type="dot" - color="secondary" + color="success" /> ) : null} diff --git a/src/plugins/visualizations/public/wizard/agg_based_selection/agg_based_selection.tsx b/src/plugins/visualizations/public/wizard/agg_based_selection/agg_based_selection.tsx index ff3b05f0bd99..acbe22615539 100644 --- a/src/plugins/visualizations/public/wizard/agg_based_selection/agg_based_selection.tsx +++ b/src/plugins/visualizations/public/wizard/agg_based_selection/agg_based_selection.tsx @@ -137,7 +137,7 @@ class AggBasedSelection extends React.Component} + icon={} className="aggBasedDialog__card" /> diff --git a/src/plugins/visualizations/public/wizard/group_selection/group_selection.tsx b/src/plugins/visualizations/public/wizard/group_selection/group_selection.tsx index b28d980424eb..3866bce796c2 100644 --- a/src/plugins/visualizations/public/wizard/group_selection/group_selection.tsx +++ b/src/plugins/visualizations/public/wizard/group_selection/group_selection.tsx @@ -110,7 +110,7 @@ function GroupSelection(props: GroupSelectionProps) { 'Use our classic visualize library to create charts based on aggregations.', } )} - icon={} + icon={} className="visNewVisDialog__groupsCard" > { } layout="horizontal" - icon={} + icon={} className="visNewVisDialog__groupsCard" /> diff --git a/x-pack/examples/alerting_example/public/components/view_alert.tsx b/x-pack/examples/alerting_example/public/components/view_alert.tsx index 5f3581871e2b..0269654806c5 100644 --- a/x-pack/examples/alerting_example/public/components/view_alert.tsx +++ b/x-pack/examples/alerting_example/public/components/view_alert.tsx @@ -9,7 +9,7 @@ import React, { useState, useEffect, Fragment } from 'react'; import { EuiText, - EuiLoadingKibana, + EuiLoadingLogo, EuiCallOut, EuiTextColor, EuiDescriptionList, @@ -106,6 +106,6 @@ export const ViewAlertPage = withRouter(({ http, id }: Props) => { )} ) : ( - + ); }); diff --git a/x-pack/examples/alerting_example/public/components/view_astros_alert.tsx b/x-pack/examples/alerting_example/public/components/view_astros_alert.tsx index 1bab422c2bcf..44ca8f624c19 100644 --- a/x-pack/examples/alerting_example/public/components/view_astros_alert.tsx +++ b/x-pack/examples/alerting_example/public/components/view_astros_alert.tsx @@ -9,7 +9,7 @@ import React, { useState, useEffect, Fragment } from 'react'; import { EuiText, - EuiLoadingKibana, + EuiLoadingLogo, EuiCallOut, EuiTextColor, EuiDescriptionList, @@ -114,6 +114,6 @@ export const ViewPeopleInSpaceAlertPage = withRouter(({ http, id }: Props) => { )} ) : ( - + ); }); diff --git a/x-pack/examples/ui_actions_enhanced_examples/public/containers/drilldowns_without_embeddable_example/drilldowns_without_embeddable_example.tsx b/x-pack/examples/ui_actions_enhanced_examples/public/containers/drilldowns_without_embeddable_example/drilldowns_without_embeddable_example.tsx index a0e1f38543c2..0941c1e2c814 100644 --- a/x-pack/examples/ui_actions_enhanced_examples/public/containers/drilldowns_without_embeddable_example/drilldowns_without_embeddable_example.tsx +++ b/x-pack/examples/ui_actions_enhanced_examples/public/containers/drilldowns_without_embeddable_example/drilldowns_without_embeddable_example.tsx @@ -101,7 +101,7 @@ export const DrilldownsWithoutEmbeddableExample: React.FC = () => { {openManagerButton} { = { line: { strokeWidth: 1, - stroke: euiLightVars.euiColorSecondary, + stroke: euiLightVars.euiColorSuccess, opacity: 1, }, }; diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/render_option.tsx b/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/render_option.tsx index 4a4d8e9d3e19..3293760ef712 100644 --- a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/render_option.tsx +++ b/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/render_option.tsx @@ -11,7 +11,7 @@ import styled from 'styled-components'; import { euiLightVars } from '@kbn/ui-shared-deps-src/theme'; const StyledSpan = styled.span` - color: ${euiLightVars.euiColorSecondaryText}; + color: ${euiLightVars.euiColorSuccessText}; font-weight: 500; :not(:last-of-type)::after { content: '•'; diff --git a/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/SettingsPage/SettingsPage.tsx b/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/SettingsPage/SettingsPage.tsx index 7623e467aaa2..8789bbd77231 100644 --- a/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/SettingsPage/SettingsPage.tsx +++ b/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/SettingsPage/SettingsPage.tsx @@ -224,7 +224,7 @@ export function SettingsPage({ fill isLoading={isSaving} isDisabled={!isFormValid} - color="secondary" + color="success" iconType="check" > {i18n.translate( diff --git a/x-pack/plugins/apm/public/components/app/service_map/Popover/service_contents.tsx b/x-pack/plugins/apm/public/components/app/service_map/Popover/service_contents.tsx index f320123ce072..5c41a1b4db7e 100644 --- a/x-pack/plugins/apm/public/components/app/service_map/Popover/service_contents.tsx +++ b/x-pack/plugins/apm/public/components/app/service_map/Popover/service_contents.tsx @@ -97,7 +97,7 @@ export function ServiceContents({ - + {i18n.translate('xpack.apm.serviceMap.focusMapButtonText', { defaultMessage: 'Focus map', })} diff --git a/x-pack/plugins/apm/public/components/shared/charts/breakdown_chart/index.tsx b/x-pack/plugins/apm/public/components/shared/charts/breakdown_chart/index.tsx index 7f7c163ff1ea..78bfd8911c35 100644 --- a/x-pack/plugins/apm/public/components/shared/charts/breakdown_chart/index.tsx +++ b/x-pack/plugins/apm/public/components/shared/charts/breakdown_chart/index.tsx @@ -81,7 +81,7 @@ export function BreakdownChart({ const xFormatter = niceTimeFormatter([min, max]); - const annotationColor = theme.eui.euiColorSecondary; + const annotationColor = theme.eui.euiColorSuccess; const isEmpty = isTimeseriesEmpty(timeseries); diff --git a/x-pack/plugins/apm/public/components/shared/charts/timeseries_chart.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeseries_chart.tsx index bcdfff2678cd..29ef524508b0 100644 --- a/x-pack/plugins/apm/public/components/shared/charts/timeseries_chart.tsx +++ b/x-pack/plugins/apm/public/components/shared/charts/timeseries_chart.tsx @@ -105,7 +105,7 @@ export function TimeseriesChart({ const xFormatter = niceTimeFormatter([min, max]); const isEmpty = isTimeseriesEmpty(timeseries); - const annotationColor = theme.eui.euiColorSecondary; + const annotationColor = theme.eui.euiColorSuccess; const allSeries = [...timeseries, ...(anomalyTimeseries?.boundaries ?? [])]; const xDomain = isEmpty ? { min: 0, max: 1 } : { min, max }; diff --git a/x-pack/plugins/apm/public/components/shared/license_prompt/index.tsx b/x-pack/plugins/apm/public/components/shared/license_prompt/index.tsx index 0950cff5127f..5d643614ba4d 100644 --- a/x-pack/plugins/apm/public/components/shared/license_prompt/index.tsx +++ b/x-pack/plugins/apm/public/components/shared/license_prompt/index.tsx @@ -27,21 +27,19 @@ export function LicensePrompt({ {i18n.translate( diff --git a/x-pack/plugins/canvas/public/components/arg_form/arg_simple_form.tsx b/x-pack/plugins/canvas/public/components/arg_form/arg_simple_form.tsx index 84b87373c1c5..df73c149a911 100644 --- a/x-pack/plugins/canvas/public/components/arg_form/arg_simple_form.tsx +++ b/x-pack/plugins/canvas/public/components/arg_form/arg_simple_form.tsx @@ -52,7 +52,7 @@ export const ArgSimpleForm: React.FunctionComponent = ({ {!required && ( = (props) => { diff --git a/x-pack/plugins/canvas/public/components/datasource/__stories__/__snapshots__/datasource_component.stories.storyshot b/x-pack/plugins/canvas/public/components/datasource/__stories__/__snapshots__/datasource_component.stories.storyshot index 6e665f48b3e9..7a34ee2b5aaa 100644 --- a/x-pack/plugins/canvas/public/components/datasource/__stories__/__snapshots__/datasource_component.stories.storyshot +++ b/x-pack/plugins/canvas/public/components/datasource/__stories__/__snapshots__/datasource_component.stories.storyshot @@ -118,7 +118,7 @@ exports[`Storyshots components/datasource/DatasourceComponent simple datasource className="euiFlexItem euiFlexItem--flexGrowZero" >
); diff --git a/x-pack/plugins/index_management/public/application/sections/home/data_stream_list/data_stream_table/data_stream_table.tsx b/x-pack/plugins/index_management/public/application/sections/home/data_stream_list/data_stream_table/data_stream_table.tsx index aa6ed7ae910f..cbfe133b2909 100644 --- a/x-pack/plugins/index_management/public/application/sections/home/data_stream_list/data_stream_table/data_stream_table.tsx +++ b/x-pack/plugins/index_management/public/application/sections/home/data_stream_list/data_stream_table/data_stream_table.tsx @@ -183,7 +183,7 @@ export const DataStreamTable: React.FunctionComponent = ({ ) : undefined, toolsRight: [ { loadIndices(); }} diff --git a/x-pack/plugins/index_management/public/application/sections/home/template_list/template_list.tsx b/x-pack/plugins/index_management/public/application/sections/home/template_list/template_list.tsx index 57f18134be5d..2df312771ca1 100644 --- a/x-pack/plugins/index_management/public/application/sections/home/template_list/template_list.tsx +++ b/x-pack/plugins/index_management/public/application/sections/home/template_list/template_list.tsx @@ -162,7 +162,7 @@ export const TemplateList: React.FunctionComponent = (props) => { } )} iconSize="s" - color={'subdued'} + color="text" iconType={'crossInACircleFilled'} onClick={toggleWarningThreshold} /> diff --git a/x-pack/plugins/infra/public/alerting/inventory/components/metric.tsx b/x-pack/plugins/infra/public/alerting/inventory/components/metric.tsx index 7f8bcd6ae419..3d9116905fb2 100644 --- a/x-pack/plugins/infra/public/alerting/inventory/components/metric.tsx +++ b/x-pack/plugins/infra/public/alerting/inventory/components/metric.tsx @@ -186,7 +186,7 @@ export const MetricExpression = ({ onClick={() => { setPopoverOpen(true); }} - color={errors.metric?.length ? 'danger' : 'secondary'} + color={errors.metric?.length ? 'danger' : 'success'} /> } isOpen={popoverOpen} diff --git a/x-pack/plugins/infra/public/alerting/log_threshold/components/expression_editor/criterion.tsx b/x-pack/plugins/infra/public/alerting/log_threshold/components/expression_editor/criterion.tsx index 47ba580c272b..3dd092fa48b9 100644 --- a/x-pack/plugins/infra/public/alerting/log_threshold/components/expression_editor/criterion.tsx +++ b/x-pack/plugins/infra/public/alerting/log_threshold/components/expression_editor/criterion.tsx @@ -176,7 +176,7 @@ export const Criterion: React.FC = ({ uppercase={true} value={criterion.field ?? 'a chosen field'} isActive={isFieldPopoverOpen} - color={errors.field.length === 0 ? 'secondary' : 'danger'} + color={errors.field.length === 0 ? 'success' : 'danger'} onClick={(e) => { e.stopPropagation(); setIsFieldPopoverOpen(!isFieldPopoverOpen); @@ -227,7 +227,7 @@ export const Criterion: React.FC = ({ isActive={isComparatorPopoverOpen} color={ errors.comparator.length === 0 && errors.value.length === 0 - ? 'secondary' + ? 'success' : 'danger' } onClick={(e) => { diff --git a/x-pack/plugins/infra/public/alerting/log_threshold/components/expression_editor/editor.tsx b/x-pack/plugins/infra/public/alerting/log_threshold/components/expression_editor/editor.tsx index 2664a0d6aa2b..02b827d5915d 100644 --- a/x-pack/plugins/infra/public/alerting/log_threshold/components/expression_editor/editor.tsx +++ b/x-pack/plugins/infra/public/alerting/log_threshold/components/expression_editor/editor.tsx @@ -339,7 +339,7 @@ export default ExpressionEditor; // components. export const ExpressionLike = ({ text }: { text: string }) => { return ( -
+
{text}
); diff --git a/x-pack/plugins/infra/public/alerting/metric_threshold/components/expression_row.tsx b/x-pack/plugins/infra/public/alerting/metric_threshold/components/expression_row.tsx index 4dd191313261..b4472b90efdb 100644 --- a/x-pack/plugins/infra/public/alerting/metric_threshold/components/expression_row.tsx +++ b/x-pack/plugins/infra/public/alerting/metric_threshold/components/expression_row.tsx @@ -276,7 +276,7 @@ export const ExpressionRow: React.FC = (props) => { } )} iconSize="s" - color={'subdued'} + color="text" iconType={'crossInACircleFilled'} onClick={toggleWarningThreshold} /> diff --git a/x-pack/plugins/infra/public/components/logging/log_analysis_setup/setup_flyout/module_list_card.tsx b/x-pack/plugins/infra/public/components/logging/log_analysis_setup/setup_flyout/module_list_card.tsx index 5931e1cbe49e..4424410f552c 100644 --- a/x-pack/plugins/infra/public/components/logging/log_analysis_setup/setup_flyout/module_list_card.tsx +++ b/x-pack/plugins/infra/public/components/logging/log_analysis_setup/setup_flyout/module_list_card.tsx @@ -65,7 +65,7 @@ export const LogAnalysisModuleListCard: React.FC<{ moduleStatus.type === 'required' ? ( ) : ( - + ); const moduleSetupButton = diff --git a/x-pack/plugins/infra/public/pages/logs/log_entry_categories/sections/top_categories/single_metric_comparison.tsx b/x-pack/plugins/infra/public/pages/logs/log_entry_categories/sections/top_categories/single_metric_comparison.tsx index 8eed47c1a833..fe9297b9409c 100644 --- a/x-pack/plugins/infra/public/pages/logs/log_entry_categories/sections/top_categories/single_metric_comparison.tsx +++ b/x-pack/plugins/infra/public/pages/logs/log_entry_categories/sections/top_categories/single_metric_comparison.tsx @@ -29,14 +29,14 @@ export const SingleMetricComparison: React.FunctionComponent<{ return ( - {formatPercentage(changeFactor)} + {formatPercentage(changeFactor)} ); } else if (changeFactor > 0 && !Number.isFinite(changeFactor)) { return ( - {newCategoryTrendLabel} + {newCategoryTrendLabel} ); } diff --git a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/processes/processes_table.tsx b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/processes/processes_table.tsx index 427f67ec7a21..8c51fbf9d805 100644 --- a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/processes/processes_table.tsx +++ b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/processes/processes_table.tsx @@ -202,7 +202,7 @@ const ProcessesTableBody = ({ items, currentTime }: TableBodyProps) => ( const cells = columns.map((column) => ( diff --git a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/processes/state_badge.tsx b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/processes/state_badge.tsx index c354ddcd55d7..47049c7d9c89 100644 --- a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/processes/state_badge.tsx +++ b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/processes/state_badge.tsx @@ -12,7 +12,7 @@ import { STATE_NAMES } from './states'; export const StateBadge = ({ state }: { state: string }) => { switch (state) { case 'running': - return {STATE_NAMES.running}; + return {STATE_NAMES.running}; case 'sleeping': return {STATE_NAMES.sleeping}; case 'dead': diff --git a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/properties/table.tsx b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/properties/table.tsx index 053e50ff8704..996e90c03f3d 100644 --- a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/properties/table.tsx +++ b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/properties/table.tsx @@ -65,7 +65,7 @@ export const Table = (props: Props) => { )} > = memo( const disabled = isEditorNotInIdleMode && !isMovingThisProcessor; const moveButton = ( = ({ onAddDocuments }) => - + - + {i18nTexts.addDocumentSuccessMessage} diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_form/pipeline_form.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_form/pipeline_form.tsx index 02fd7ec65957..eeda40c96418 100644 --- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_form/pipeline_form.tsx +++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_form/pipeline_form.tsx @@ -138,7 +138,7 @@ export const PipelineForm: React.FunctionComponent = ({ = ({ diff --git a/x-pack/plugins/logstash/kibana.json b/x-pack/plugins/logstash/kibana.json index 2ff4aac9ba55..48391c9bc68c 100644 --- a/x-pack/plugins/logstash/kibana.json +++ b/x-pack/plugins/logstash/kibana.json @@ -11,5 +11,5 @@ "optionalPlugins": ["home", "monitoring", "security"], "server": true, "ui": true, - "requiredBundles": ["home"] + "requiredBundles": ["esUiShared", "home"] } diff --git a/x-pack/plugins/logstash/public/application/components/pipeline_editor/pipeline_editor.js b/x-pack/plugins/logstash/public/application/components/pipeline_editor/pipeline_editor.js index 334c7d0322a8..9d5f3b2d4af0 100644 --- a/x-pack/plugins/logstash/public/application/components/pipeline_editor/pipeline_editor.js +++ b/x-pack/plugins/logstash/public/application/components/pipeline_editor/pipeline_editor.js @@ -15,10 +15,10 @@ import 'brace/theme/github'; import { isEmpty } from 'lodash'; import { TOOLTIPS } from '../../../../common/constants/tooltips'; +import { EuiCodeEditor } from '../../../../../../../src/plugins/es_ui_shared/public'; import { EuiButton, EuiButtonEmpty, - EuiCodeEditor, EuiFlexGroup, EuiFieldNumber, EuiFlexItem, diff --git a/x-pack/plugins/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_color_property.test.tsx.snap b/x-pack/plugins/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_color_property.test.tsx.snap index 58af4d009e43..dba9fa59dd42 100644 --- a/x-pack/plugins/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_color_property.test.tsx.snap +++ b/x-pack/plugins/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_color_property.test.tsx.snap @@ -91,7 +91,7 @@ exports[`renderLegendDetailRow categorical Should render categorical legend with isPointsOnly={true} label={ Other diff --git a/x-pack/plugins/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_icon_property.test.tsx.snap b/x-pack/plugins/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_icon_property.test.tsx.snap index 11a4fafda29e..a3f23536326a 100644 --- a/x-pack/plugins/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_icon_property.test.tsx.snap +++ b/x-pack/plugins/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_icon_property.test.tsx.snap @@ -71,7 +71,7 @@ exports[`renderLegendDetailRow Should render categorical legend with breaks 1`] isPointsOnly={true} label={ Other diff --git a/x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_color_property.tsx b/x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_color_property.tsx index cfb5d54720ce..03800fa03827 100644 --- a/x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_color_property.tsx +++ b/x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_color_property.tsx @@ -425,7 +425,7 @@ export class DynamicColorProperty extends DynamicStyleProperty{getOtherCategoryLabel()}, + label: {getOtherCategoryLabel()}, symbolId, }); } diff --git a/x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_icon_property.tsx b/x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_icon_property.tsx index 15672bda941b..b5d5e90efa45 100644 --- a/x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_icon_property.tsx +++ b/x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_icon_property.tsx @@ -129,7 +129,7 @@ export class DynamicIconProperty extends DynamicStyleProperty{getOtherCategoryLabel()}, + label: {getOtherCategoryLabel()}, symbolId: fallbackSymbolId, }); } diff --git a/x-pack/plugins/maps/public/components/tooltip_selector/tooltip_selector.tsx b/x-pack/plugins/maps/public/components/tooltip_selector/tooltip_selector.tsx index dc3ad26b48e8..1a4c8e36b345 100644 --- a/x-pack/plugins/maps/public/components/tooltip_selector/tooltip_selector.tsx +++ b/x-pack/plugins/maps/public/components/tooltip_selector/tooltip_selector.tsx @@ -217,7 +217,7 @@ export class TooltipSelector extends Component { { { = ({ isDisabled }) => { aria-label={i18n.translate('xpack.ml.importExport.importFlyout.deleteButtonAria', { defaultMessage: 'Delete', })} - color={deleteDisabled ? 'subdued' : 'danger'} + color={deleteDisabled ? 'text' : 'danger'} disabled={deleteDisabled} onClick={() => deleteJob(index)} /> diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/job_map/components/cytoscape_options.tsx b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/job_map/components/cytoscape_options.tsx index 4cd76b4e410c..b7dc4d617427 100644 --- a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/job_map/components/cytoscape_options.tsx +++ b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/job_map/components/cytoscape_options.tsx @@ -65,7 +65,7 @@ function borderColorForNode(el: cytoscape.NodeSingular, theme: EuiThemeType) { switch (type) { case JOB_MAP_NODE_TYPES.ANALYTICS: - return theme.euiColorSecondary; + return theme.euiColorSuccess; case JOB_MAP_NODE_TYPES.TRANSFORM: return theme.euiColorVis1; case JOB_MAP_NODE_TYPES.INDEX: diff --git a/x-pack/plugins/ml/public/application/explorer/anomaly_context_menu.tsx b/x-pack/plugins/ml/public/application/explorer/anomaly_context_menu.tsx index d40e9cae1a04..c32745f8bce8 100644 --- a/x-pack/plugins/ml/public/application/explorer/anomaly_context_menu.tsx +++ b/x-pack/plugins/ml/public/application/explorer/anomaly_context_menu.tsx @@ -75,7 +75,7 @@ export const AnomalyContextMenu: FC = ({ aria-label={i18n.translate('xpack.ml.explorer.anomalies.actionsAriaLabel', { defaultMessage: 'Actions', })} - color="subdued" + color="text" iconType="boxesHorizontal" onClick={setIsMenuOpen.bind(null, !isMenuOpen)} data-test-subj="mlExplorerAnomalyPanelMenu" diff --git a/x-pack/plugins/ml/public/application/explorer/anomaly_timeline.tsx b/x-pack/plugins/ml/public/application/explorer/anomaly_timeline.tsx index 6091ab22692a..c8006292f8e0 100644 --- a/x-pack/plugins/ml/public/application/explorer/anomaly_timeline.tsx +++ b/x-pack/plugins/ml/public/application/explorer/anomaly_timeline.tsx @@ -184,7 +184,7 @@ export const AnomalyTimeline: FC = React.memo( aria-label={i18n.translate('xpack.ml.explorer.swimlaneActions', { defaultMessage: 'Actions', })} - color="subdued" + color="text" iconType="boxesHorizontal" onClick={setIsMenuOpen.bind(null, !isMenuOpen)} data-test-subj="mlAnomalyTimelinePanelMenu" diff --git a/x-pack/plugins/ml/public/application/jobs/jobs_list/components/ml_job_editor/ml_job_editor.tsx b/x-pack/plugins/ml/public/application/jobs/jobs_list/components/ml_job_editor/ml_job_editor.tsx index 96708e83dd8b..9ee583ba2d3e 100644 --- a/x-pack/plugins/ml/public/application/jobs/jobs_list/components/ml_job_editor/ml_job_editor.tsx +++ b/x-pack/plugins/ml/public/application/jobs/jobs_list/components/ml_job_editor/ml_job_editor.tsx @@ -7,8 +7,12 @@ import React, { FC } from 'react'; -import { EuiCodeEditor, EuiCodeEditorProps } from '@elastic/eui'; -import { expandLiteralStrings, XJsonMode } from '../../../../../../shared_imports'; +import { + expandLiteralStrings, + XJsonMode, + EuiCodeEditor, + EuiCodeEditorProps, +} from '../../../../../../shared_imports'; export const ML_EDITOR_MODE = { TEXT: 'text', JSON: 'json', XJSON: new XJsonMode() }; diff --git a/x-pack/plugins/ml/public/application/jobs/new_job/recognize/components/job_item.tsx b/x-pack/plugins/ml/public/application/jobs/new_job/recognize/components/job_item.tsx index 39d3eb634e9c..53ffa593830e 100644 --- a/x-pack/plugins/ml/public/application/jobs/new_job/recognize/components/job_item.tsx +++ b/x-pack/plugins/ml/public/application/jobs/new_job/recognize/components/job_item.tsx @@ -53,7 +53,7 @@ export const JobItem: FC = memo( - + {jobPrefix} {id} @@ -118,7 +118,7 @@ export const JobItem: FC = memo( = memo( = memo( - + {title} {success === false && error !== undefined && ( diff --git a/x-pack/plugins/ml/public/application/timeseriesexplorer/_timeseriesexplorer.scss b/x-pack/plugins/ml/public/application/timeseriesexplorer/_timeseriesexplorer.scss index cfd521c882fb..63cb8a57adba 100644 --- a/x-pack/plugins/ml/public/application/timeseriesexplorer/_timeseriesexplorer.scss +++ b/x-pack/plugins/ml/public/application/timeseriesexplorer/_timeseriesexplorer.scss @@ -10,7 +10,7 @@ } .entity-count-text { - color: $euiColorSecondary; + color: $euiColorSuccess; font-size: $euiFontSizeS; } } diff --git a/x-pack/plugins/ml/shared_imports.ts b/x-pack/plugins/ml/shared_imports.ts index 255a1e3c20d6..e70410c99a8f 100644 --- a/x-pack/plugins/ml/shared_imports.ts +++ b/x-pack/plugins/ml/shared_imports.ts @@ -5,6 +5,9 @@ * 2.0. */ +export { EuiCodeEditor } from '../../../src/plugins/es_ui_shared/public'; +export type { EuiCodeEditorProps } from '../../../src/plugins/es_ui_shared/public'; + import { XJson } from '../../../src/plugins/es_ui_shared/public'; const { collapseLiteralStrings, expandLiteralStrings } = XJson; diff --git a/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/components/__snapshots__/shard.test.js.snap b/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/components/__snapshots__/shard.test.js.snap index dcad0937066d..5c0294ffdc8d 100644 --- a/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/components/__snapshots__/shard.test.js.snap +++ b/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/components/__snapshots__/shard.test.js.snap @@ -27,7 +27,7 @@ exports[`Shard should show for assigned replica shards 1`] = ` onMouseLeave={[Function]} > 0 diff --git a/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/components/shard.js b/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/components/shard.js index a81e1f8db5ec..6676b71b4bf1 100644 --- a/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/components/shard.js +++ b/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/components/shard.js @@ -39,7 +39,7 @@ function getColor(classes) { } if (classList.includes('replica')) { - return 'secondary'; + return 'success'; } } diff --git a/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/shard_allocation.js b/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/shard_allocation.js index 7ca24853a9cc..1c9021aeedf7 100644 --- a/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/shard_allocation.js +++ b/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/shard_allocation.js @@ -24,7 +24,7 @@ export const ShardAllocation = (props) => { label: i18n.translate('xpack.monitoring.elasticsearch.shardAllocation.replicaLabel', { defaultMessage: 'Replica', }), - color: 'secondary', + color: 'success', }, { label: i18n.translate('xpack.monitoring.elasticsearch.shardAllocation.relocatingLabel', { diff --git a/x-pack/plugins/monitoring/public/components/setup_mode/__snapshots__/tooltip.test.js.snap b/x-pack/plugins/monitoring/public/components/setup_mode/__snapshots__/tooltip.test.js.snap index 2a3a27cbc7c1..2edd5c1ab0cf 100644 --- a/x-pack/plugins/monitoring/public/components/setup_mode/__snapshots__/tooltip.test.js.snap +++ b/x-pack/plugins/monitoring/public/components/setup_mode/__snapshots__/tooltip.test.js.snap @@ -127,7 +127,7 @@ exports[`setupMode SetupModeTooltip allMonitoredByMetricbeat should render for a position="top" > () => `generated-id`); describe('Summary Status Component', () => { it('should render metrics in a summary bar', () => { diff --git a/x-pack/plugins/observability/public/components/app/cases/callout/callout.test.tsx b/x-pack/plugins/observability/public/components/app/cases/callout/callout.test.tsx index 25d32d0cae88..6f48d429071c 100644 --- a/x-pack/plugins/observability/public/components/app/cases/callout/callout.test.tsx +++ b/x-pack/plugins/observability/public/components/app/cases/callout/callout.test.tsx @@ -60,7 +60,7 @@ describe('Callout', () => { const className = wrapper.find(`button[data-test-subj="calloutDismiss-md5-hex"]`).first().prop('className') ?? ''; - expect(className.includes('euiButton--secondary')).toBeTruthy(); + expect(className.includes('euiButton--success')).toBeTruthy(); }); it('transform the button color correctly - warning', () => { diff --git a/x-pack/plugins/observability/public/components/app/cases/callout/callout.tsx b/x-pack/plugins/observability/public/components/app/cases/callout/callout.tsx index 15bd250c6ceb..25c9643a22af 100644 --- a/x-pack/plugins/observability/public/components/app/cases/callout/callout.tsx +++ b/x-pack/plugins/observability/public/components/app/cases/callout/callout.tsx @@ -39,7 +39,7 @@ function CallOutComponent({ {i18n.DISMISS_CALLOUT} diff --git a/x-pack/plugins/observability/public/components/shared/field_value_suggestions/field_value_selection.test.tsx b/x-pack/plugins/observability/public/components/shared/field_value_suggestions/field_value_selection.test.tsx index c142e50400e5..3b9f6264c773 100644 --- a/x-pack/plugins/observability/public/components/shared/field_value_suggestions/field_value_selection.test.tsx +++ b/x-pack/plugins/observability/public/components/shared/field_value_suggestions/field_value_selection.test.tsx @@ -9,6 +9,7 @@ import React from 'react'; import { mount, render } from 'enzyme'; import { FieldValueSelection } from './field_value_selection'; import { EuiButton, EuiSelectableList } from '@elastic/eui'; +import { EuiThemeProvider } from '../../../../../../../src/plugins/kibana_react/common'; const values = [ { label: 'elastic co frontend', count: 1 }, @@ -32,16 +33,19 @@ describe('FieldValueSelection', () => { expect(btn.text()).toBe('Service name'); }); + it('renders a list on click', async () => { const wrapper = mount( - {}} - selectedValue={[]} - loading={false} - setQuery={() => {}} - /> + + {}} + selectedValue={[]} + loading={false} + setQuery={() => {}} + /> + ); const btn = wrapper.find(EuiButton); diff --git a/x-pack/plugins/osquery/public/action_results/services/agent_status.tsx b/x-pack/plugins/osquery/public/action_results/services/agent_status.tsx index 39a033f49ec9..1a2c9f370bc3 100644 --- a/x-pack/plugins/osquery/public/action_results/services/agent_status.tsx +++ b/x-pack/plugins/osquery/public/action_results/services/agent_status.tsx @@ -14,7 +14,7 @@ const visColors = euiPaletteColorBlindBehindText(); const colorToHexMap = { default: '#d3dae6', primary: visColors[1], - secondary: visColors[0], + success: visColors[0], accent: visColors[2], warning: visColors[5], danger: visColors[9], @@ -25,7 +25,7 @@ export const AGENT_STATUSES: ActionAgentStatus[] = ['success', 'pending', 'faile export function getColorForAgentStatus(agentStatus: ActionAgentStatus): string { switch (agentStatus) { case 'success': - return colorToHexMap.secondary; + return colorToHexMap.success; case 'pending': return colorToHexMap.default; case 'failed': diff --git a/x-pack/plugins/osquery/public/editor/index.tsx b/x-pack/plugins/osquery/public/editor/index.tsx index 7d6823acec2c..df78d45d0cc9 100644 --- a/x-pack/plugins/osquery/public/editor/index.tsx +++ b/x-pack/plugins/osquery/public/editor/index.tsx @@ -6,10 +6,11 @@ */ import React, { useEffect, useState } from 'react'; -import { EuiCodeEditor } from '@elastic/eui'; import useDebounce from 'react-use/lib/useDebounce'; import 'brace/theme/tomorrow'; +import { EuiCodeEditor } from '../shared_imports'; + import './osquery_mode.ts'; const EDITOR_SET_OPTIONS = { diff --git a/x-pack/plugins/osquery/public/shared_imports.ts b/x-pack/plugins/osquery/public/shared_imports.ts index 227a276c41f1..c0f9d35ba51a 100644 --- a/x-pack/plugins/osquery/public/shared_imports.ts +++ b/x-pack/plugins/osquery/public/shared_imports.ts @@ -40,3 +40,6 @@ export { } from '../../../../src/plugins/es_ui_shared/static/forms/components'; export { fieldValidators } from '../../../../src/plugins/es_ui_shared/static/forms/helpers'; export type { ERROR_CODE } from '../../../../src/plugins/es_ui_shared/static/forms/helpers/field_validators/types'; + +export { EuiCodeEditor } from '../../../../src/plugins/es_ui_shared/public'; +export type { EuiCodeEditorProps } from '../../../../src/plugins/es_ui_shared/public'; diff --git a/x-pack/plugins/painless_lab/public/application/components/output_pane/output_pane.tsx b/x-pack/plugins/painless_lab/public/application/components/output_pane/output_pane.tsx index 258c6bcdb1be..8391ccbbe7ef 100644 --- a/x-pack/plugins/painless_lab/public/application/components/output_pane/output_pane.tsx +++ b/x-pack/plugins/painless_lab/public/application/components/output_pane/output_pane.tsx @@ -34,7 +34,7 @@ export const OutputPane: FunctionComponent = ({ isLoading, response }) => ) : response && response.error ? ( ) : ( - + )} diff --git a/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/remote_cluster_form.tsx b/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/remote_cluster_form.tsx index 766f12fedc81..fdcbf220331d 100644 --- a/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/remote_cluster_form.tsx +++ b/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/remote_cluster_form.tsx @@ -20,7 +20,7 @@ import { EuiForm, EuiFormRow, EuiLink, - EuiLoadingKibana, + EuiLoadingLogo, EuiLoadingSpinner, EuiOverlayMask, EuiSpacer, @@ -348,7 +348,7 @@ export class RemoteClusterForm extends Component { { if (this.props.isSaving) { return ( - + ); } diff --git a/x-pack/plugins/remote_clusters/public/application/sections/remote_cluster_list/remote_cluster_list.js b/x-pack/plugins/remote_clusters/public/application/sections/remote_cluster_list/remote_cluster_list.js index b94ae8f7edbc..b6881aa02e0b 100644 --- a/x-pack/plugins/remote_clusters/public/application/sections/remote_cluster_list/remote_cluster_list.js +++ b/x-pack/plugins/remote_clusters/public/application/sections/remote_cluster_list/remote_cluster_list.js @@ -13,7 +13,7 @@ import { EuiButton, EuiButtonEmpty, EuiEmptyPrompt, - EuiLoadingKibana, + EuiLoadingLogo, EuiOverlayMask, EuiPageContent, EuiSpacer, @@ -80,7 +80,7 @@ export class RemoteClusterList extends Component { if (isCopyingCluster || isRemovingCluster) { return ( - + ); } diff --git a/x-pack/plugins/rollup/public/crud_app/sections/job_create/job_create.js b/x-pack/plugins/rollup/public/crud_app/sections/job_create/job_create.js index 6f22345dc1ce..22d6f74c0aee 100644 --- a/x-pack/plugins/rollup/public/crud_app/sections/job_create/job_create.js +++ b/x-pack/plugins/rollup/public/crud_app/sections/job_create/job_create.js @@ -16,7 +16,7 @@ import { withKibana } from '../../../../../../../src/plugins/kibana_react/public import { EuiCallOut, - EuiLoadingKibana, + EuiLoadingLogo, EuiOverlayMask, EuiPageContentBody, EuiPageHeader, @@ -494,7 +494,7 @@ export class JobCreateUi extends Component { if (isSaving) { savingFeedback = ( - + ); } diff --git a/x-pack/plugins/rollup/public/crud_app/sections/job_create/navigation/navigation.js b/x-pack/plugins/rollup/public/crud_app/sections/job_create/navigation/navigation.js index 6afb864fedbe..e9c324cd5f87 100644 --- a/x-pack/plugins/rollup/public/crud_app/sections/job_create/navigation/navigation.js +++ b/x-pack/plugins/rollup/public/crud_app/sections/job_create/navigation/navigation.js @@ -79,7 +79,7 @@ export const Navigation = ({ const saveButton = ( +

{ render: (creation: string, item: ApiKey) => ( {item.id === createdApiKey?.id ? ( - + { return ( - + diff --git a/x-pack/plugins/security/public/management/role_mappings/edit_role_mapping/rule_editor_panel/json_rule_editor.tsx b/x-pack/plugins/security/public/management/role_mappings/edit_role_mapping/rule_editor_panel/json_rule_editor.tsx index 86f7892e49d2..176d66049ead 100644 --- a/x-pack/plugins/security/public/management/role_mappings/edit_role_mapping/rule_editor_panel/json_rule_editor.tsx +++ b/x-pack/plugins/security/public/management/role_mappings/edit_role_mapping/rule_editor_panel/json_rule_editor.tsx @@ -5,6 +5,7 @@ * 2.0. */ +import 'react-ace'; import 'brace/mode/json'; import 'brace/theme/github'; diff --git a/x-pack/plugins/security/public/management/role_mappings/role_mappings_grid/role_mappings_grid_page.tsx b/x-pack/plugins/security/public/management/role_mappings/role_mappings_grid/role_mappings_grid_page.tsx index 373f3366f36c..c983f2c704f4 100644 --- a/x-pack/plugins/security/public/management/role_mappings/role_mappings_grid/role_mappings_grid_page.tsx +++ b/x-pack/plugins/security/public/management/role_mappings/role_mappings_grid/role_mappings_grid_page.tsx @@ -255,7 +255,7 @@ export class RoleMappingsGridPage extends Component { ) : undefined, toolsRight: ( this.reloadRoleMappings()} data-test-subj="reloadButton" diff --git a/x-pack/plugins/security_solution/public/cases/components/callout/callout.test.tsx b/x-pack/plugins/security_solution/public/cases/components/callout/callout.test.tsx index 0a0caa40a878..01c581f5401b 100644 --- a/x-pack/plugins/security_solution/public/cases/components/callout/callout.test.tsx +++ b/x-pack/plugins/security_solution/public/cases/components/callout/callout.test.tsx @@ -60,7 +60,7 @@ describe('Callout', () => { const className = wrapper.find(`button[data-test-subj="callout-dismiss-md5-hex"]`).first().prop('className') ?? ''; - expect(className.includes('euiButton--secondary')).toBeTruthy(); + expect(className.includes('euiButton--success')).toBeTruthy(); }); it('transform the button color correctly - warning', () => { diff --git a/x-pack/plugins/security_solution/public/cases/components/callout/callout.tsx b/x-pack/plugins/security_solution/public/cases/components/callout/callout.tsx index f00fa84c6ff0..d0493ec7acb9 100644 --- a/x-pack/plugins/security_solution/public/cases/components/callout/callout.tsx +++ b/x-pack/plugins/security_solution/public/cases/components/callout/callout.tsx @@ -37,11 +37,7 @@ const CallOutComponent = ({ return showCallOut && !isEmpty(messages) ? ( - + {i18n.DISMISS_CALLOUT} diff --git a/x-pack/plugins/security_solution/public/common/components/callouts/callout_dismiss_button.tsx b/x-pack/plugins/security_solution/public/common/components/callouts/callout_dismiss_button.tsx index c657ee243b74..b00072be6cc5 100644 --- a/x-pack/plugins/security_solution/public/common/components/callouts/callout_dismiss_button.tsx +++ b/x-pack/plugins/security_solution/public/common/components/callouts/callout_dismiss_button.tsx @@ -23,7 +23,7 @@ export const CallOutDismissButton: FC = ({ onClick = noop, }) => { const { type } = message; - const buttonColor = type === 'success' ? 'secondary' : type; + const buttonColor = type; const buttonText = text ?? i18n.DISMISS_BUTTON; const handleClick = useCallback(() => onClick(message), [onClick, message]); diff --git a/x-pack/plugins/security_solution/public/common/components/header_page/editable_title.tsx b/x-pack/plugins/security_solution/public/common/components/header_page/editable_title.tsx index 487e0fe4981f..3744297ded56 100644 --- a/x-pack/plugins/security_solution/public/common/components/header_page/editable_title.tsx +++ b/x-pack/plugins/security_solution/public/common/components/header_page/editable_title.tsx @@ -77,7 +77,7 @@ const EditableTitleComponent: React.FC = ({ - secondary + success { {'primary'} - - {'secondary'} + + {'success'} {'danger'} diff --git a/x-pack/plugins/security_solution/public/common/components/item_details_card/index.test.tsx b/x-pack/plugins/security_solution/public/common/components/item_details_card/index.test.tsx index 12264e28d40c..7fce50284d0d 100644 --- a/x-pack/plugins/security_solution/public/common/components/item_details_card/index.test.tsx +++ b/x-pack/plugins/security_solution/public/common/components/item_details_card/index.test.tsx @@ -60,8 +60,8 @@ describe('item_details_card', () => { {'primary'} - - {'secondary'} + + {'success'} {'danger'} diff --git a/x-pack/plugins/security_solution/public/common/components/paginated_table/__snapshots__/index.test.tsx.snap b/x-pack/plugins/security_solution/public/common/components/paginated_table/__snapshots__/index.test.tsx.snap index 3440e5f4488c..a2fffc32be46 100644 --- a/x-pack/plugins/security_solution/public/common/components/paginated_table/__snapshots__/index.test.tsx.snap +++ b/x-pack/plugins/security_solution/public/common/components/paginated_table/__snapshots__/index.test.tsx.snap @@ -22,28 +22,36 @@ exports[`Paginated Table Component rendering it renders the default load more ta Array [ Object { "field": "node.host.name", - "hideForMobile": false, + "mobileOptions": Object { + "show": true, + }, "name": "Host", "render": [Function], "truncateText": false, }, Object { "field": "node.host.firstSeen", - "hideForMobile": false, + "mobileOptions": Object { + "show": true, + }, "name": "First seen", "render": [Function], "truncateText": false, }, Object { "field": "node.host.os", - "hideForMobile": false, + "mobileOptions": Object { + "show": true, + }, "name": "OS", "render": [Function], "truncateText": false, }, Object { "field": "node.host.version", - "hideForMobile": false, + "mobileOptions": Object { + "show": true, + }, "name": "Version", "render": [Function], "truncateText": false, diff --git a/x-pack/plugins/security_solution/public/common/components/paginated_table/index.mock.tsx b/x-pack/plugins/security_solution/public/common/components/paginated_table/index.mock.tsx index 070c8a8d53b4..2d728ffa915f 100644 --- a/x-pack/plugins/security_solution/public/common/components/paginated_table/index.mock.tsx +++ b/x-pack/plugins/security_solution/public/common/components/paginated_table/index.mock.tsx @@ -57,28 +57,28 @@ export const getHostsColumns = (): [ field: 'node.host.name', name: 'Host', truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (name: string) => getOrEmptyTagFromValue(name), }, { field: 'node.host.firstSeen', name: 'First seen', truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (firstSeen: string) => getOrEmptyTagFromValue(firstSeen), }, { field: 'node.host.os', name: 'OS', truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (os: string) => getOrEmptyTagFromValue(os), }, { field: 'node.host.version', name: 'Version', truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (version: string) => getOrEmptyTagFromValue(version), }, ]; diff --git a/x-pack/plugins/security_solution/public/common/components/paginated_table/index.tsx b/x-pack/plugins/security_solution/public/common/components/paginated_table/index.tsx index f5828c9f65db..ef49c8e2a5e8 100644 --- a/x-pack/plugins/security_solution/public/common/components/paginated_table/index.tsx +++ b/x-pack/plugins/security_solution/public/common/components/paginated_table/index.tsx @@ -17,6 +17,7 @@ import { EuiLoadingContent, EuiPagination, EuiPopover, + EuiTableRowCellProps, } from '@elastic/eui'; import { noop } from 'lodash/fp'; import React, { FC, memo, useState, useMemo, useEffect, ComponentType } from 'react'; @@ -126,8 +127,7 @@ type Func = (arg: T) => string | number; export interface Columns { align?: string; field?: string; - hideForMobile?: boolean; - isMobileHeader?: boolean; + mobileOptions?: EuiTableRowCellProps['mobileOptions']; name: string | React.ReactNode; render?: (item: T, node: U) => React.ReactNode; sortable?: boolean | Func; diff --git a/x-pack/plugins/security_solution/public/common/components/progress_inline/__snapshots__/index.test.tsx.snap b/x-pack/plugins/security_solution/public/common/components/progress_inline/__snapshots__/index.test.tsx.snap index e1fc1becd018..bf36bf1afeef 100644 --- a/x-pack/plugins/security_solution/public/common/components/progress_inline/__snapshots__/index.test.tsx.snap +++ b/x-pack/plugins/security_solution/public/common/components/progress_inline/__snapshots__/index.test.tsx.snap @@ -13,7 +13,7 @@ exports[`ProgressInline it renders 1`] = ` className="siemProgressInline__bar" > diff --git a/x-pack/plugins/security_solution/public/common/components/progress_inline/index.tsx b/x-pack/plugins/security_solution/public/common/components/progress_inline/index.tsx index bbea27f5a705..7b7e24bf8707 100644 --- a/x-pack/plugins/security_solution/public/common/components/progress_inline/index.tsx +++ b/x-pack/plugins/security_solution/public/common/components/progress_inline/index.tsx @@ -38,7 +38,7 @@ export const ProgressInline = React.memo(

{children}
- +
diff --git a/x-pack/plugins/security_solution/public/detections/components/rules/description_step/ml_job_description.tsx b/x-pack/plugins/security_solution/public/detections/components/rules/description_step/ml_job_description.tsx index 27afe847f761..4b61504ec997 100644 --- a/x-pack/plugins/security_solution/public/detections/components/rules/description_step/ml_job_description.tsx +++ b/x-pack/plugins/security_solution/public/detections/components/rules/description_step/ml_job_description.tsx @@ -51,7 +51,7 @@ export const AuditIcon = React.memo(AuditIconComponent); const JobStatusBadgeComponent: React.FC<{ job: MlSummaryJob }> = ({ job }) => { const isStarted = isJobStarted(job.jobState, job.datafeedState); - const color = isStarted ? 'secondary' : 'danger'; + const color = isStarted ? 'success' : 'danger'; const text = isStarted ? ML_JOB_STARTED : ML_JOB_STOPPED; return ( diff --git a/x-pack/plugins/security_solution/public/hosts/components/authentications_table/index.tsx b/x-pack/plugins/security_solution/public/hosts/components/authentications_table/index.tsx index 23e5da28a355..65357b15036e 100644 --- a/x-pack/plugins/security_solution/public/hosts/components/authentications_table/index.tsx +++ b/x-pack/plugins/security_solution/public/hosts/components/authentications_table/index.tsx @@ -140,7 +140,7 @@ const getAuthenticationColumns = (): AuthTableColumns => [ { name: i18n.USER, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => getRowItemDraggables({ rowItems: node.user.name, @@ -151,7 +151,7 @@ const getAuthenticationColumns = (): AuthTableColumns => [ { name: i18n.SUCCESSES, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => { const id = escapeDataProviderId( `authentications-table-${node._id}-node-successes-${node.successes}` @@ -189,7 +189,7 @@ const getAuthenticationColumns = (): AuthTableColumns => [ { name: i18n.FAILURES, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => { const id = escapeDataProviderId( `authentications-table-${node._id}-failures-${node.failures}` @@ -227,7 +227,7 @@ const getAuthenticationColumns = (): AuthTableColumns => [ { name: i18n.LAST_SUCCESSFUL_TIME, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => has('lastSuccess.timestamp', node) && node.lastSuccess?.timestamp != null ? ( @@ -238,7 +238,7 @@ const getAuthenticationColumns = (): AuthTableColumns => [ { name: i18n.LAST_SUCCESSFUL_SOURCE, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => getRowItemDraggables({ rowItems: node.lastSuccess?.source?.ip || null, @@ -250,7 +250,7 @@ const getAuthenticationColumns = (): AuthTableColumns => [ { name: i18n.LAST_SUCCESSFUL_DESTINATION, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => getRowItemDraggables({ rowItems: node.lastSuccess?.host?.name ?? null, @@ -262,7 +262,7 @@ const getAuthenticationColumns = (): AuthTableColumns => [ { name: i18n.LAST_FAILED_TIME, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => has('lastFailure.timestamp', node) && node.lastFailure?.timestamp != null ? ( @@ -273,7 +273,7 @@ const getAuthenticationColumns = (): AuthTableColumns => [ { name: i18n.LAST_FAILED_SOURCE, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => getRowItemDraggables({ rowItems: node.lastFailure?.source?.ip || null, @@ -285,7 +285,7 @@ const getAuthenticationColumns = (): AuthTableColumns => [ { name: i18n.LAST_FAILED_DESTINATION, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => getRowItemDraggables({ rowItems: node.lastFailure?.host?.name || null, diff --git a/x-pack/plugins/security_solution/public/hosts/components/hosts_table/columns.tsx b/x-pack/plugins/security_solution/public/hosts/components/hosts_table/columns.tsx index d6c51b2bfe05..95f88da0a24a 100644 --- a/x-pack/plugins/security_solution/public/hosts/components/hosts_table/columns.tsx +++ b/x-pack/plugins/security_solution/public/hosts/components/hosts_table/columns.tsx @@ -31,7 +31,7 @@ export const getHostsColumns = (): HostsTableColumns => [ field: 'node.host.name', name: i18n.NAME, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: true, render: (hostName) => { if (hostName != null && hostName.length > 0) { @@ -75,7 +75,7 @@ export const getHostsColumns = (): HostsTableColumns => [ ), truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: true, render: (lastSeen: Maybe | undefined) => { if (lastSeen != null && lastSeen.length > 0) { @@ -92,7 +92,7 @@ export const getHostsColumns = (): HostsTableColumns => [ field: 'node.host.os.name', name: i18n.OS, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: false, render: (hostOsName) => { if (hostOsName != null) { @@ -109,7 +109,7 @@ export const getHostsColumns = (): HostsTableColumns => [ field: 'node.host.os.version', name: i18n.VERSION, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: false, render: (hostOsVersion) => { if (hostOsVersion != null) { diff --git a/x-pack/plugins/security_solution/public/hosts/components/uncommon_process_table/index.tsx b/x-pack/plugins/security_solution/public/hosts/components/uncommon_process_table/index.tsx index 0541f2f1d403..0af27bdb0ba1 100644 --- a/x-pack/plugins/security_solution/public/hosts/components/uncommon_process_table/index.tsx +++ b/x-pack/plugins/security_solution/public/hosts/components/uncommon_process_table/index.tsx @@ -144,7 +144,7 @@ const getUncommonColumns = (): UncommonProcessTableColumns => [ { name: i18n.NAME, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => getRowItemDraggables({ rowItems: node.process.name, @@ -157,7 +157,7 @@ const getUncommonColumns = (): UncommonProcessTableColumns => [ align: 'right', name: i18n.NUMBER_OF_HOSTS, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => <>{node.hosts != null ? node.hosts.length : getEmptyValue()}, width: '8%', }, @@ -165,14 +165,14 @@ const getUncommonColumns = (): UncommonProcessTableColumns => [ align: 'right', name: i18n.NUMBER_OF_INSTANCES, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => defaultToEmptyTag(node.instances), width: '8%', }, { name: i18n.HOSTS, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => getRowItemDraggables({ rowItems: getHostNames(node), @@ -185,7 +185,7 @@ const getUncommonColumns = (): UncommonProcessTableColumns => [ { name: i18n.LAST_COMMAND, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => getRowItemDraggables({ rowItems: node.process != null ? node.process.args : null, @@ -198,7 +198,7 @@ const getUncommonColumns = (): UncommonProcessTableColumns => [ { name: i18n.LAST_USER, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: ({ node }) => getRowItemDraggables({ rowItems: node.user != null ? node.user.name : null, diff --git a/x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/view/host_constants.ts b/x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/view/host_constants.ts index 8e0e4fd969c2..8fa4a9388e08 100644 --- a/x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/view/host_constants.ts +++ b/x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/view/host_constants.ts @@ -11,7 +11,7 @@ import { HostStatus, HostPolicyResponseActionStatus } from '../../../../../commo export const HOST_STATUS_TO_BADGE_COLOR = Object.freeze<{ [key in HostStatus]: string; }>({ - [HostStatus.HEALTHY]: 'secondary', + [HostStatus.HEALTHY]: 'success', [HostStatus.UNHEALTHY]: 'warning', [HostStatus.UPDATING]: 'primary', [HostStatus.OFFLINE]: 'default', @@ -22,7 +22,7 @@ export const HOST_STATUS_TO_BADGE_COLOR = Object.freeze<{ export const POLICY_STATUS_TO_HEALTH_COLOR = Object.freeze<{ [key in keyof typeof HostPolicyResponseActionStatus]: string; }>({ - success: 'secondary', + success: 'success', warning: 'warning', failure: 'danger', unsupported: 'default', @@ -31,7 +31,7 @@ export const POLICY_STATUS_TO_HEALTH_COLOR = Object.freeze<{ export const POLICY_STATUS_TO_BADGE_COLOR = Object.freeze<{ [key in keyof typeof HostPolicyResponseActionStatus]: string; }>({ - success: 'secondary', + success: 'success', warning: 'warning', failure: 'danger', unsupported: 'default', diff --git a/x-pack/plugins/security_solution/public/management/pages/policy/view/policy_forms/locked_card.tsx b/x-pack/plugins/security_solution/public/management/pages/policy/view/policy_forms/locked_card.tsx index 150ae5e82ef5..cd13e2f93352 100644 --- a/x-pack/plugins/security_solution/public/management/pages/policy/view/policy_forms/locked_card.tsx +++ b/x-pack/plugins/security_solution/public/management/pages/policy/view/policy_forms/locked_card.tsx @@ -35,9 +35,11 @@ export const LockedPolicyCard = memo(({ title }: { title: string }) => { } title={ diff --git a/x-pack/plugins/security_solution/public/network/components/network_dns_table/columns.tsx b/x-pack/plugins/security_solution/public/network/components/network_dns_table/columns.tsx index 03c2442982fc..4dcdc9298316 100644 --- a/x-pack/plugins/security_solution/public/network/components/network_dns_table/columns.tsx +++ b/x-pack/plugins/security_solution/public/network/components/network_dns_table/columns.tsx @@ -34,7 +34,7 @@ export const getNetworkDnsColumns = (): NetworkDnsColumns => [ field: `node.${NetworkDnsFields.dnsName}`, name: i18n.REGISTERED_DOMAIN, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: true, render: (dnsName) => { if (dnsName != null) { @@ -77,7 +77,7 @@ export const getNetworkDnsColumns = (): NetworkDnsColumns => [ name: i18n.TOTAL_QUERIES, sortable: true, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (queryCount) => { if (queryCount != null) { return numeral(queryCount).format('0'); @@ -92,7 +92,7 @@ export const getNetworkDnsColumns = (): NetworkDnsColumns => [ name: i18n.UNIQUE_DOMAINS, sortable: true, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (uniqueDomains) => { if (uniqueDomains != null) { return numeral(uniqueDomains).format('0'); @@ -107,7 +107,7 @@ export const getNetworkDnsColumns = (): NetworkDnsColumns => [ name: i18n.DNS_BYTES_IN, sortable: true, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (dnsBytesIn) => { if (dnsBytesIn != null) { return ; @@ -122,7 +122,7 @@ export const getNetworkDnsColumns = (): NetworkDnsColumns => [ name: i18n.DNS_BYTES_OUT, sortable: true, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (dnsBytesOut) => { if (dnsBytesOut != null) { return ; diff --git a/x-pack/plugins/security_solution/public/network/components/tls_table/columns.tsx b/x-pack/plugins/security_solution/public/network/components/tls_table/columns.tsx index 7a45c418a4ff..6641927082b6 100644 --- a/x-pack/plugins/security_solution/public/network/components/tls_table/columns.tsx +++ b/x-pack/plugins/security_solution/public/network/components/tls_table/columns.tsx @@ -32,7 +32,7 @@ export const getTlsColumns = (tableId: string): TlsColumns => [ field: 'node', name: i18n.ISSUER, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: false, render: ({ _id, issuers }) => getRowItemDraggables({ @@ -45,7 +45,7 @@ export const getTlsColumns = (tableId: string): TlsColumns => [ field: 'node', name: i18n.SUBJECT, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: false, render: ({ _id, subjects }) => getRowItemDraggables({ @@ -58,7 +58,7 @@ export const getTlsColumns = (tableId: string): TlsColumns => [ field: 'node._id', name: i18n.SHA1_FINGERPRINT, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: true, render: (sha1) => getRowItemDraggable({ @@ -71,7 +71,7 @@ export const getTlsColumns = (tableId: string): TlsColumns => [ field: 'node', name: i18n.JA3_FINGERPRINT, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: false, render: ({ _id, ja3 }) => getRowItemDraggables({ @@ -84,7 +84,7 @@ export const getTlsColumns = (tableId: string): TlsColumns => [ field: 'node', name: i18n.VALID_UNTIL, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: false, render: ({ _id, notAfter }) => getRowItemDraggables({ diff --git a/x-pack/plugins/security_solution/public/network/components/users_table/columns.tsx b/x-pack/plugins/security_solution/public/network/components/users_table/columns.tsx index 473d01468679..4068c616228f 100644 --- a/x-pack/plugins/security_solution/public/network/components/users_table/columns.tsx +++ b/x-pack/plugins/security_solution/public/network/components/users_table/columns.tsx @@ -28,7 +28,7 @@ export const getUsersColumns = (flowTarget: FlowTarget, tableId: string): UsersC field: 'node.user.name', name: i18n.USER_NAME, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: true, render: (userName) => getRowItemDraggable({ @@ -41,7 +41,7 @@ export const getUsersColumns = (flowTarget: FlowTarget, tableId: string): UsersC field: 'node.user.id', name: i18n.USER_ID, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: false, render: (userIds) => getRowItemDraggables({ @@ -54,7 +54,7 @@ export const getUsersColumns = (flowTarget: FlowTarget, tableId: string): UsersC field: 'node.user.groupName', name: i18n.GROUP_NAME, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: false, render: (groupNames) => getRowItemDraggables({ @@ -67,7 +67,7 @@ export const getUsersColumns = (flowTarget: FlowTarget, tableId: string): UsersC field: 'node.user.groupId', name: i18n.GROUP_ID, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: false, render: (groupId) => getRowItemDraggables({ @@ -81,7 +81,7 @@ export const getUsersColumns = (flowTarget: FlowTarget, tableId: string): UsersC field: 'node.user.count', name: i18n.DOCUMENT_COUNT, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: true, render: (docCount) => defaultToEmptyTag(docCount), }, diff --git a/x-pack/plugins/security_solution/public/timelines/components/open_timeline/note_previews/index.tsx b/x-pack/plugins/security_solution/public/timelines/components/open_timeline/note_previews/index.tsx index 1016a430807b..7693efad0730 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/open_timeline/note_previews/index.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/open_timeline/note_previews/index.tsx @@ -66,7 +66,7 @@ const ToggleEventDetailsButtonComponent: React.FC diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/footer/index.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/footer/index.tsx index 80a682293dbb..c11aaa3b1737 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/footer/index.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/footer/index.tsx @@ -387,7 +387,7 @@ export const FooterComponent = ({ {i18n.AUTO_REFRESH_ACTIVE}{' '} [ field: `node.${HostRulesFields.ruleName}`, name: i18n.NAME, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (ruleName) => { if (ruleName != null && ruleName.length > 0) { const id = escapeDataProviderId(`ueba-table-ruleName-${ruleName}`); @@ -63,7 +63,7 @@ export const getHostRulesColumns = (): HostRulesColumns => [ field: `node.${HostRulesFields.ruleType}`, name: i18n.RULE_TYPE, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (ruleType) => { if (ruleType != null && ruleType.length > 0) { const id = escapeDataProviderId(`ueba-table-ruleType-${ruleType}`); @@ -102,7 +102,7 @@ export const getHostRulesColumns = (): HostRulesColumns => [ field: `node.${HostRulesFields.riskScore}`, name: i18n.RISK_SCORE, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (riskScore) => { if (riskScore != null) { const id = escapeDataProviderId(`ueba-table-riskScore-${riskScore}`); @@ -141,7 +141,7 @@ export const getHostRulesColumns = (): HostRulesColumns => [ field: `node.${HostRulesFields.hits}`, name: i18n.HITS, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: false, render: (hits) => { if (hits != null) { diff --git a/x-pack/plugins/security_solution/public/ueba/components/host_tactics_table/columns.tsx b/x-pack/plugins/security_solution/public/ueba/components/host_tactics_table/columns.tsx index 19516ad6fcaf..68e1195a9c7e 100644 --- a/x-pack/plugins/security_solution/public/ueba/components/host_tactics_table/columns.tsx +++ b/x-pack/plugins/security_solution/public/ueba/components/host_tactics_table/columns.tsx @@ -24,7 +24,7 @@ export const getHostTacticsColumns = (): HostTacticsColumns => [ field: `node.${HostTacticsFields.tactic}`, name: i18n.TACTIC, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (tactic) => { if (tactic != null && tactic.length > 0) { const id = escapeDataProviderId(`ueba-table-tactic-${tactic}`); @@ -63,7 +63,7 @@ export const getHostTacticsColumns = (): HostTacticsColumns => [ field: `node.${HostTacticsFields.technique}`, name: i18n.TECHNIQUE, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (technique) => { if (technique != null && technique.length > 0) { const id = escapeDataProviderId(`ueba-table-technique-${technique}`); @@ -102,7 +102,7 @@ export const getHostTacticsColumns = (): HostTacticsColumns => [ field: `node.${HostTacticsFields.riskScore}`, name: i18n.RISK_SCORE, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (riskScore) => { if (riskScore != null) { const id = escapeDataProviderId(`ueba-table-riskScore-${riskScore}`); @@ -141,7 +141,7 @@ export const getHostTacticsColumns = (): HostTacticsColumns => [ field: `node.${HostTacticsFields.hits}`, name: i18n.HITS, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: false, render: (hits) => { if (hits != null) { diff --git a/x-pack/plugins/security_solution/public/ueba/components/risk_score_table/columns.tsx b/x-pack/plugins/security_solution/public/ueba/components/risk_score_table/columns.tsx index b751521001fe..43512d671736 100644 --- a/x-pack/plugins/security_solution/public/ueba/components/risk_score_table/columns.tsx +++ b/x-pack/plugins/security_solution/public/ueba/components/risk_score_table/columns.tsx @@ -27,7 +27,7 @@ export const getRiskScoreColumns = (): RiskScoreColumns => [ field: 'node.host_name', name: i18n.NAME, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: true, render: (hostName) => { if (hostName != null && hostName.length > 0) { @@ -63,7 +63,7 @@ export const getRiskScoreColumns = (): RiskScoreColumns => [ field: 'node.risk_keyword', name: i18n.CURRENT_RISK, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, sortable: false, render: (riskKeyword) => { if (riskKeyword != null) { diff --git a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/policy_form.tsx b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/policy_form.tsx index f3ce07cd732c..185d3bb90bae 100644 --- a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/policy_form.tsx +++ b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/policy_form.tsx @@ -193,7 +193,7 @@ export const PolicyForm: React.FunctionComponent = ({ savePolicy()} isLoading={isSaving} diff --git a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/step_two.tsx b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/step_two.tsx index 011b8e883316..a985a6dee0ba 100644 --- a/x-pack/plugins/snapshot_restore/public/application/components/repository_form/step_two.tsx +++ b/x-pack/plugins/snapshot_restore/public/application/components/repository_form/step_two.tsx @@ -143,7 +143,7 @@ export const RepositoryFormStepTwo: React.FunctionComponent = ({ )} = ({ executeRestore()} isLoading={isSaving} diff --git a/x-pack/plugins/snapshot_restore/public/application/sections/home/policy_list/policy_details/policy_details.tsx b/x-pack/plugins/snapshot_restore/public/application/sections/home/policy_list/policy_details/policy_details.tsx index 0a283d406e5a..33f83ca30c04 100644 --- a/x-pack/plugins/snapshot_restore/public/application/sections/home/policy_list/policy_details/policy_details.tsx +++ b/x-pack/plugins/snapshot_restore/public/application/sections/home/policy_list/policy_details/policy_details.tsx @@ -307,7 +307,7 @@ export const PolicyDetails: React.FunctionComponent = ({ {policyName}{' '} = ({ toolsRight: [ = ({ toolsRight: [ { data-test-subj={`cts-summary-success-count`} title={summarizedResults.successCount} titleSize="s" - titleColor={initialCopyFinished ? 'secondary' : 'subdued'} + titleColor={initialCopyFinished ? 'success' : 'subdued'} isLoading={!initialCopyFinished} textAlign="center" description={ diff --git a/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_mode_control.tsx b/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_mode_control.tsx index 2740533e5271..45a2d3f4964b 100644 --- a/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_mode_control.tsx +++ b/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_mode_control.tsx @@ -139,7 +139,7 @@ export const ShareModeControl = (props: Props) => { onChange(updatedSpaceIds); }} legend={buttonGroupLegend} - color="secondary" + color="success" isFullWidth={true} isDisabled={!canShareToAllSpaces} /> diff --git a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression.test.tsx b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression.test.tsx index 51c2f0471d48..ad624c345272 100644 --- a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression.test.tsx +++ b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression.test.tsx @@ -22,7 +22,6 @@ import { useKibana } from '../../../../../../src/plugins/kibana_react/public'; import { EsQueryAlertParams } from './types'; jest.mock('../../../../../../src/plugins/kibana_react/public'); -jest.mock('../../../../../../src/plugins/es_ui_shared/public'); jest.mock('../../../../../../src/plugins/es_ui_shared/public', () => ({ XJson: { useXJsonMode: jest.fn().mockReturnValue({ @@ -31,26 +30,18 @@ jest.mock('../../../../../../src/plugins/es_ui_shared/public', () => ({ xJson: jest.fn(), }), }, + // Mocking EuiCodeEditor, which uses React Ace under the hood + // eslint-disable-next-line @typescript-eslint/no-explicit-any + EuiCodeEditor: (props: any) => ( + { + props.onChange(syntheticEvent.jsonString); + }} + /> + ), })); -jest.mock(''); -jest.mock('@elastic/eui', () => { - const original = jest.requireActual('@elastic/eui'); - - return { - ...original, - // Mocking EuiCodeEditor, which uses React Ace under the hood - // eslint-disable-next-line @typescript-eslint/no-explicit-any - EuiCodeEditor: (props: any) => ( - { - props.onChange(syntheticEvent.jsonString); - }} - /> - ), - }; -}); jest.mock('../../../../triggers_actions_ui/public', () => { const original = jest.requireActual('../../../../triggers_actions_ui/public'); return { diff --git a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression.tsx b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression.tsx index 4cba80a9a541..b98df85e0b8a 100644 --- a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression.tsx +++ b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression.tsx @@ -9,12 +9,11 @@ import React, { useState, Fragment, useEffect } from 'react'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; -import 'brace/theme/github'; import { XJsonMode } from '@kbn/ace'; +import 'brace/theme/github'; import { EuiButtonEmpty, - EuiCodeEditor, EuiSpacer, EuiFormRow, EuiCallOut, @@ -25,7 +24,7 @@ import { import { DocLinksStart, HttpSetup } from 'kibana/public'; import type * as estypes from '@elastic/elasticsearch/lib/api/typesWithBodyKey'; -import { XJson } from '../../../../../../src/plugins/es_ui_shared/public'; +import { XJson, EuiCodeEditor } from '../../../../../../src/plugins/es_ui_shared/public'; import { useKibana } from '../../../../../../src/plugins/kibana_react/public'; import { getFields, diff --git a/x-pack/plugins/timelines/public/components/t_grid/event_rendered_view/index.tsx b/x-pack/plugins/timelines/public/components/t_grid/event_rendered_view/index.tsx index 6267c9d3a495..3caa53988c00 100644 --- a/x-pack/plugins/timelines/public/components/t_grid/event_rendered_view/index.tsx +++ b/x-pack/plugins/timelines/public/components/t_grid/event_rendered_view/index.tsx @@ -115,7 +115,7 @@ const EventRenderedViewComponent = ({ field: 'actions', name: ActionTitle, truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (name: unknown, item: unknown) => { const alertId = get(item, '_id'); const rowIndex = events.findIndex((evt) => evt._id === alertId); @@ -147,7 +147,7 @@ const EventRenderedViewComponent = ({ defaultMessage: 'Timestamp', }), truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (name: unknown, item: TimelineItem) => { const timestamp = get(item, `ecs.timestamp`); return ; @@ -159,7 +159,7 @@ const EventRenderedViewComponent = ({ defaultMessage: 'Rule', }), truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (name: unknown, item: TimelineItem) => { const ruleName = get(item, `ecs.signal.rule.name`); /* `ecs.${ALERT_RULE_NAME}`*/ const ruleId = get(item, `ecs.signal.rule.id`); /* `ecs.${ALERT_RULE_ID}`*/ @@ -172,7 +172,7 @@ const EventRenderedViewComponent = ({ defaultMessage: 'Event Summary', }), truncateText: false, - hideForMobile: false, + mobileOptions: { show: true }, render: (name: unknown, item: TimelineItem) => { const ecsData = get(item, 'ecs'); const reason = get(item, `ecs.signal.reason`); /* `ecs.${ALERT_REASON}`*/ diff --git a/x-pack/plugins/transform/public/app/sections/transform_management/components/refresh_transform_list_button/refresh_transform_list_button.tsx b/x-pack/plugins/transform/public/app/sections/transform_management/components/refresh_transform_list_button/refresh_transform_list_button.tsx index f9f5f79bf462..183847362851 100644 --- a/x-pack/plugins/transform/public/app/sections/transform_management/components/refresh_transform_list_button/refresh_transform_list_button.tsx +++ b/x-pack/plugins/transform/public/app/sections/transform_management/components/refresh_transform_list_button/refresh_transform_list_button.tsx @@ -19,7 +19,7 @@ export const RefreshTransformListButton: FC = ({ isLoading, }) => ( = ({ {onTestConnector && ( = ({ { @@ -408,7 +408,7 @@ const ConnectorEditFlyout = ({ = ({
= ({ {filteredDeprecations.length === 0 ? ( - + {i18nTexts.noDeprecationsMessage} diff --git a/x-pack/plugins/uptime/public/components/common/charts/monitor_bar_series.tsx b/x-pack/plugins/uptime/public/components/common/charts/monitor_bar_series.tsx index 08cac07250fe..145ec5f199db 100644 --- a/x-pack/plugins/uptime/public/components/common/charts/monitor_bar_series.tsx +++ b/x-pack/plugins/uptime/public/components/common/charts/monitor_bar_series.tsx @@ -114,7 +114,7 @@ export const MonitorBarSeries = ({ histogramSeries, minInterval }: MonitorBarSer /> } > - -- + -- ); }; diff --git a/x-pack/plugins/uptime/public/components/monitor/ping_list/columns/ping_status.tsx b/x-pack/plugins/uptime/public/components/monitor/ping_list/columns/ping_status.tsx index 3a4ee53f6322..dcf3fdb9163d 100644 --- a/x-pack/plugins/uptime/public/components/monitor/ping_list/columns/ping_status.tsx +++ b/x-pack/plugins/uptime/public/components/monitor/ping_list/columns/ping_status.tsx @@ -50,7 +50,7 @@ export const PingStatusColumn = ({ pingStatus, item }: Props) => {
{getPingStatusLabel(pingStatus, item)} diff --git a/x-pack/plugins/uptime/public/components/monitor/ping_list/ping_redirects.tsx b/x-pack/plugins/uptime/public/components/monitor/ping_list/ping_redirects.tsx index b1a36b1c0d61..01e0cb5be2b0 100644 --- a/x-pack/plugins/uptime/public/components/monitor/ping_list/ping_redirects.tsx +++ b/x-pack/plugins/uptime/public/components/monitor/ping_list/ping_redirects.tsx @@ -37,7 +37,7 @@ export const PingRedirects: React.FC = ({ monitorStatus, showTitle }) => size: 's', target: '_blank', extraAction: { - color: 'subdued', + color: 'text', iconType: 'popout', iconSize: 's', alwaysShow: true, @@ -56,7 +56,7 @@ export const PingRedirects: React.FC = ({ monitorStatus, showTitle }) => size: 's', target: '_blank', extraAction: { - color: 'subdued', + color: 'text', iconType: 'popout', iconSize: 's', 'aria-label': i18n.translate('xpack.uptime.monitorList.redirects.openWindow', { diff --git a/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/__snapshots__/tag_label.test.tsx.snap b/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/__snapshots__/tag_label.test.tsx.snap index 2e55e7024f44..345a8f2786d4 100644 --- a/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/__snapshots__/tag_label.test.tsx.snap +++ b/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/__snapshots__/tag_label.test.tsx.snap @@ -36,7 +36,7 @@ exports[`TagLabel component renders correctly against snapshot 1`] = ` exports[`TagLabel component shallow render correctly against snapshot 1`] = ` US-East diff --git a/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/tag_label.tsx b/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/tag_label.tsx index a53beb60ab41..6bf73b9609e5 100644 --- a/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/tag_label.tsx +++ b/x-pack/plugins/uptime/public/components/monitor/status_details/availability_reporting/tag_label.tsx @@ -23,7 +23,7 @@ const BadgeItem = styled.div` export const TagLabel: React.FC = ({ color, label, status }) => { return ( - {label} + {label} ); }; diff --git a/x-pack/plugins/uptime/public/components/monitor/synthetics/waterfall/components/middle_truncated_text.tsx b/x-pack/plugins/uptime/public/components/monitor/synthetics/waterfall/components/middle_truncated_text.tsx index 311a496bd58a..3e3b08f49d70 100644 --- a/x-pack/plugins/uptime/public/components/monitor/synthetics/waterfall/components/middle_truncated_text.tsx +++ b/x-pack/plugins/uptime/public/components/monitor/synthetics/waterfall/components/middle_truncated_text.tsx @@ -145,7 +145,7 @@ export const MiddleTruncatedText = ({ { +): 'primary' | 'success' | 'subdued' | 'danger' => { if (isInvalid === true) return 'danger'; if (isEnabled === false) return 'subdued'; - return isOpen ? 'primary' : 'secondary'; + return isOpen ? 'primary' : 'success'; }; export const AlertExpressionPopover: React.FC = ({ diff --git a/x-pack/plugins/uptime/public/components/overview/alerts/alert_tls.tsx b/x-pack/plugins/uptime/public/components/overview/alerts/alert_tls.tsx index e2de834a379b..f7cd341e04da 100644 --- a/x-pack/plugins/uptime/public/components/overview/alerts/alert_tls.tsx +++ b/x-pack/plugins/uptime/public/components/overview/alerts/alert_tls.tsx @@ -23,7 +23,7 @@ export const AlertTlsComponent: React.FC = (props) => ( diff --git a/x-pack/plugins/uptime/public/components/overview/alerts/monitor_expressions/__snapshots__/down_number_select.test.tsx.snap b/x-pack/plugins/uptime/public/components/overview/alerts/monitor_expressions/__snapshots__/down_number_select.test.tsx.snap index bf56ebd0de23..f9e169b976d1 100644 --- a/x-pack/plugins/uptime/public/components/overview/alerts/monitor_expressions/__snapshots__/down_number_select.test.tsx.snap +++ b/x-pack/plugins/uptime/public/components/overview/alerts/monitor_expressions/__snapshots__/down_number_select.test.tsx.snap @@ -10,7 +10,7 @@ exports[`DownNoExpressionSelect component should renders against props 1`] = ` > = button={ setIsOpen(!isOpen)} diff --git a/x-pack/plugins/uptime/public/components/overview/monitor_list/columns/monitor_status_column.tsx b/x-pack/plugins/uptime/public/components/overview/monitor_list/columns/monitor_status_column.tsx index f5581f75b375..6960bb563285 100644 --- a/x-pack/plugins/uptime/public/components/overview/monitor_list/columns/monitor_status_column.tsx +++ b/x-pack/plugins/uptime/public/components/overview/monitor_list/columns/monitor_status_column.tsx @@ -162,7 +162,7 @@ export const MonitorListStatusColumn = ({ {getHealthMessage(status)} diff --git a/x-pack/plugins/uptime/public/components/overview/monitor_list/monitor_list_drawer/monitor_status_row.tsx b/x-pack/plugins/uptime/public/components/overview/monitor_list/monitor_list_drawer/monitor_status_row.tsx index 03655d11c983..15e40773ae6d 100644 --- a/x-pack/plugins/uptime/public/components/overview/monitor_list/monitor_list_drawer/monitor_status_row.tsx +++ b/x-pack/plugins/uptime/public/components/overview/monitor_list/monitor_list_drawer/monitor_status_row.tsx @@ -23,7 +23,7 @@ interface MonitorStatusRowProps { } export const MonitorStatusRow = ({ locationNames, status }: MonitorStatusRowProps) => { - const color = status === STATUS.UP ? 'secondary' : 'danger'; + const color = status === STATUS.UP ? 'success' : 'danger'; let checkListArray = [...locationNames]; // If un-named location exists, move it to end diff --git a/x-pack/plugins/watcher/public/application/components/watch_status.tsx b/x-pack/plugins/watcher/public/application/components/watch_status.tsx index 5c1fd39b5b48..8c6ea0e01b35 100644 --- a/x-pack/plugins/watcher/public/application/components/watch_status.tsx +++ b/x-pack/plugins/watcher/public/application/components/watch_status.tsx @@ -17,7 +17,7 @@ function StatusIcon({ status }: { status: string }) { case WATCH_STATES.OK: case ACTION_STATES.OK: case ACTION_STATES.ACKNOWLEDGED: - return ; + return ; case ACTION_STATES.THROTTLED: return ; case WATCH_STATES.DISABLED: diff --git a/x-pack/plugins/watcher/public/application/sections/watch_edit/components/json_watch_edit/json_watch_edit_form.tsx b/x-pack/plugins/watcher/public/application/sections/watch_edit/components/json_watch_edit/json_watch_edit_form.tsx index b19d97f67d2e..c59147d7e7ce 100644 --- a/x-pack/plugins/watcher/public/application/sections/watch_edit/components/json_watch_edit/json_watch_edit_form.tsx +++ b/x-pack/plugins/watcher/public/application/sections/watch_edit/components/json_watch_edit/json_watch_edit_form.tsx @@ -197,7 +197,7 @@ export const JsonWatchEditForm = () => { { onClick={() => { setAggFieldPopoverOpen(true); }} - color={watch.aggField ? 'secondary' : 'danger'} + color={watch.aggField ? 'success' : 'danger'} /> } isOpen={aggFieldPopoverOpen} @@ -617,7 +617,7 @@ export const ThresholdWatchEdit = ({ pageTitle }: { pageTitle: string }) => { }} color={ watch.groupBy === 'all' || (watch.termSize && watch.termField) - ? 'secondary' + ? 'success' : 'danger' } /> @@ -730,7 +730,7 @@ export const ThresholdWatchEdit = ({ pageTitle }: { pageTitle: string }) => { color={ errors.threshold0.length || (errors.threshold1 && errors.threshold1.length) ? 'danger' - : 'secondary' + : 'success' } /> } @@ -816,7 +816,7 @@ export const ThresholdWatchEdit = ({ pageTitle }: { pageTitle: string }) => { onClick={() => { setWatchDurationPopoverOpen(true); }} - color={watch.timeWindowSize ? 'secondary' : 'danger'} + color={watch.timeWindowSize ? 'success' : 'danger'} /> } isOpen={watchDurationPopoverOpen} @@ -890,7 +890,7 @@ export const ThresholdWatchEdit = ({ pageTitle }: { pageTitle: string }) => {