diff --git a/examples/expressions_explorer/kibana.json b/examples/expressions_explorer/kibana.json index 770ce91143d99..dea706d024941 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 260c529650bdb..631b60f4dc566 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 16370c2ece281..79c5a296981db 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 329dcfbb11d45..07f0526c3461d 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 ca2cb27076c7a..c15bb092f17d8 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 416a4d4799b7b..490aa91f30680 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 80043bd0857ee..a6e7180e88123 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 0ed784ef680f7..7682a848b0b17 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 5b0e831286aad..c30637ed85a57 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 3aa41827ff40f..e4fa84d317dd6 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 af7d33bee5ed6..3cb5d1126ef31 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 73c697c3d55aa..b6e7ba9b91e97 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 e65764771f0fc..0baa67d4e793c 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 197714df7f207..e93ef34c38025 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 f28add25056ee..79180575129ea 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 8f1193cfcbd33..61c356e514e5f 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 1b3d139b1345e..654427781ba9e 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 df840f5d7c059..df203675725a8 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 f23456bbaca07..078786abb8c64 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 745452a31ff9c..5e4d047b2c701 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 0b08a317e87c9..2356cc7690c7c 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 8391edd30d8ee..8e24e9ea595dc 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 67ff17d017053..345c7493dc293 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 9b0134bf19406..54c5bccaf6041 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 a3f6c70c23a6e..34bcbfcaf113e 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 3453a535f98dd..372fe03666d03 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 6299b473f68df..5f172d010b836 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 95b92d205c8cd..7dc1ce16a6824 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 8e04e70ed92b6..68bb6022d093b 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 b450ec8d15d2a..73113c48107d2 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 e3e59a4093334..aed985f062cd9 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 04fac0bd93b7e..539abd3d14372 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 6c2727b123de8..517fe4cf61a08 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 8e1d0cb92e006..f6dcf46b27d8c 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 9cc38cc5f6038..2d7335a1740a0 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 22b97b6f6b0da..9b5e5588373db 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 90f92e30c32c9..a84d0460e9299 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 898770f7811a1..75c0018989fa0 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 994059c9789ec..909e8434f77f1 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 ff3b05f0bd994..acbe226155397 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 b28d980424ebf..3866bce796c22 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 5f3581871e2bd..0269654806c51 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 1bab422c2bcf0..44ca8f624c197 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 a0e1f38543c29..0941c1e2c8148 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 4a4d8e9d3e191..3293760ef7128 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 7623e467aaa2d..8789bbd772319 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 f320123ce0723..5c41a1b4db7e6 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 7f7c163ff1ea1..78bfd8911c351 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 bcdfff2678cda..29ef524508b02 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 0950cff5127fc..5d643614ba4d3 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 84b87373c1c5a..df73c149a9111 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 6e665f48b3e9a..7a34ee2b5aaad 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 aa6ed7ae910f8..cbfe133b2909d 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 57f18134be5d6..2df312771ca12 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 7f8bcd6ae419b..3d9116905fb25 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 47ba580c272bd..3dd092fa48b99 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 2664a0d6aa2b0..02b827d5915dd 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 4dd191313261b..b4472b90efdb2 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 5931e1cbe49ee..4424410f552c6 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 8eed47c1a833e..fe9297b9409c7 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 427f67ec7a211..8c51fbf9d805b 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 c354ddcd55d71..47049c7d9c893 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 053e50ff87049..996e90c03f3db 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 02fd7ec65957d..eeda40c96418c 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 2ff4aac9ba55b..48391c9bc68c4 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 334c7d0322a84..9d5f3b2d4af06 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 58af4d009e43a..dba9fa59dd424 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 11a4fafda29e1..a3f23536326aa 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 cfb5d54720ce7..03800fa03827e 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 15672bda941be..b5d5e90efa45f 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 dc3ad26b48e84..1a4c8e36b3457 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 4cd76b4e410c7..b7dc4d617427d 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 d40e9cae1a04f..c32745f8bce8c 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 6091ab22692af..c8006292f8e09 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 96708e83dd8be..9ee583ba2d3e7 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 39d3eb634e9ce..53ffa593830e0 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 cfd521c882fb7..63cb8a57adba6 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 255a1e3c20d60..e70410c99a8f4 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 dcad0937066d5..5c0294ffdc8d8 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 a81e1f8db5ec8..6676b71b4bf13 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 7ca24853a9ccb..1c9021aeedf74 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 2a3a27cbc7c12..2edd5c1ab0cf2 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 25d32d0cae884..6f48d429071ca 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 15bd250c6ceb6..25c9643a22af9 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 c142e50400e5f..3b9f6264c773a 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 39a033f49ec90..1a2c9f370bc31 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 7d6823acec2cd..df78d45d0cc93 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 227a276c41f18..c0f9d35ba51a8 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 258c6bcdb1beb..8391ccbbe7ef4 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 766f12fedc81c..fdcbf220331d7 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 b94ae8f7edbc0..b6881aa02e0b9 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 6f22345dc1cec..22d6f74c0aee5 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 6afb864fedbe4..e9c324cd5f87e 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 86f7892e49d24..176d66049eade 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 373f3366f36c8..c983f2c704f4a 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 0a0caa40a8783..01c581f5401ba 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 f00fa84c6ff0a..d0493ec7acb9c 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 c657ee243b74b..b00072be6cc5f 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 487e0fe4981f1..3744297ded56a 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 12264e28d40c9..7fce50284d0d9 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 3440e5f4488c6..a2fffc32be46d 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 070c8a8d53b43..2d728ffa915fc 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 f5828c9f65db9..ef49c8e2a5e8c 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 e1fc1becd0188..bf36bf1afeef3 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 bbea27f5a705a..7b7e24bf8707b 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 27afe847f7612..4b61504ec997a 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 23e5da28a3559..65357b15036ea 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 d6c51b2bfe05e..95f88da0a24ac 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 0541f2f1d403d..0af27bdb0ba18 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 8e0e4fd969c22..8fa4a9388e08e 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 150ae5e82ef55..cd13e2f933526 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 03c2442982fc9..4dcdc92983168 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 7a45c418a4ff0..6641927082b6b 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 473d014686795..4068c616228f2 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 1016a430807be..7693efad0730d 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 80a682293dbba..c11aaa3b17370 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 19516ad6fcafa..68e1195a9c7eb 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 b751521001fe5..43512d6717363 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 f3ce07cd732ca..185d3bb90bae5 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 011b8e883316c..a985a6dee0bae 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 0a283d406e5aa..33f83ca30c04e 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 2740533e52715..45a2d3f4964b1 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 51c2f0471d486..ad624c345272d 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 4cba80a9a541a..b98df85e0b8a0 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 6267c9d3a4953..3caa53988c005 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 f9f5f79bf4620..183847362851b 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 08cac07250fea..145ec5f199db4 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 3a4ee53f63223..dcf3fdb9163db 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 b1a36b1c0d61b..01e0cb5be2b0f 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 2e55e7024f444..345a8f2786d41 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 a53beb60ab410..6bf73b9609e58 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 311a496bd58a3..3e3b08f49d705 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 e2de834a379b5..f7cd341e04dae 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 bf56ebd0de236..f9e169b976d1d 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 f5581f75b3759..6960bb5632852 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 03655d11c983d..15e40773ae6df 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 5c1fd39b5b486..8c6ea0e01b357 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 b19d97f67d2e0..c59147d7e7ce6 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 }) => {