From 31fc3ad626e662be591f77c0f0953b6c05aed7ae Mon Sep 17 00:00:00 2001 From: Miki Date: Mon, 21 Mar 2022 13:56:44 -0700 Subject: [PATCH] Bumps `@elastic/eui` to v34.6.0 and `@elastic/charts` to v31.1.0 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Bumps the dependencies on @elastic/eui and @elastic/charts to their last Apache-2.0-licensed releases. * Mitigates changes in `@elastic/eui` v29.3.2 → v34.6.0   * v30.0.0: Removal of `EuiButtonToggle`   * v30.0.0: Renaming of `EuiButtonGroupOption`   * v30.0.0: Requiring `legend` and `isSelected` (unless type='multi') props for `EuiButtonGroup`   * v30.0.0: Removal of `EuiNavDrawerGroup`   * v30.0.0: Removal of `compressed` prop from `EuiFormRow`   * v30.0.0: Removal of `displayOnly` prop from `EuiFormRow`   * v30.0.0: Elimination of the `withTitle` prop from `EuiPopover`   * v30.2.0: Addition of indicator icon for external `EuiLink`   * v30.3.0: Test failure due to the restructuring of focus in `EuiPopover`   * v31.6.0: Addition of `uiOverlayMask` directly to `EuiModal`   * v31.9.0: Setting default `size` of “xs” and styling on `EuiButtonIcon` (partial)   * v33.0.0: Removal of `sh` from languages supported by `EuiCodeBlock`   * v34.1.0: Changing of the default component of `EuiPageBody` from `main` to `div` * Mitigates changes in `@elastic/charts` v23.2.2 → v31.1.0   * v29.0.0: Renaming of `AnnotationDomainTypes` to `AnnotationDomainType` * Updates functional tests to use updated selectors. Signed-off-by: Miki --- .../public/components/page/index.tsx | 2 +- .../public/embeddable_panel_example.tsx | 2 +- .../public/hello_world_embeddable_example.tsx | 2 +- .../public/list_container_example.tsx | 2 +- .../public/todo_embeddable_example.tsx | 2 +- examples/routing_example/public/app.tsx | 2 +- .../search_examples/public/components/app.tsx | 2 +- .../public/todo/todo.tsx | 2 +- .../with_data_services/components/app.tsx | 2 +- examples/ui_actions_explorer/public/app.tsx | 2 +- examples/ui_actions_explorer/public/page.tsx | 2 +- .../url_generators_examples/public/app.tsx | 2 +- .../url_generators_explorer/public/app.tsx | 2 +- .../url_generators_explorer/public/page.tsx | 2 +- package.json | 6 +- .../template/public/components/app.tsx.ejs | 4 +- packages/osd-ui-framework/package.json | 2 +- packages/osd-ui-shared-deps/package.json | 4 +- .../application/ui/app_not_found_screen.tsx | 2 +- .../collapsible_nav.test.tsx.snap | 10818 ++++++++-------- .../header/__snapshots__/header.test.tsx.snap | 1164 +- .../public/chrome/ui/header/header.test.tsx | 4 +- src/core/public/chrome/ui/header/header.tsx | 2 +- .../public/chrome/ui/header/recent_links.tsx | 63 - .../core_app/errors/error_application.tsx | 2 +- .../public/core_app/status/status_app.tsx | 2 +- .../fatal_errors_screen.test.tsx.snap | 4 +- .../fatal_errors/fatal_errors_screen.tsx | 2 +- .../flyout_service.test.tsx.snap | 4 +- .../__snapshots__/modal_service.test.tsx.snap | 254 +- .../public/overlays/modal/modal_service.tsx | 22 +- src/core/public/styles/_base.scss | 17 + .../public/static/components/number_input.tsx | 8 +- .../charts/public/static/components/range.tsx | 8 +- .../components/required_number_input.tsx | 8 +- .../public/static/components/select.tsx | 2 +- .../public/static/components/switch.tsx | 2 +- .../public/static/components/text_input.tsx | 2 +- .../application/components/settings_modal.tsx | 181 +- .../dashboard_empty_screen.test.tsx.snap | 38 +- .../application/dashboard_empty_screen.tsx | 2 +- .../__snapshots__/clone_modal.test.js.snap | 112 +- .../application/top_nav/clone_modal.tsx | 117 +- .../data/public/ui/filter_bar/filter_bar.tsx | 1 - .../data/public/ui/filter_bar/filter_item.tsx | 1 - .../public/ui/filter_bar/filter_options.tsx | 1 - .../ui/query_string_input/_query_bar.scss | 12 +- .../query_string_input/language_switcher.tsx | 1 - .../ui/saved_query_form/save_query_form.tsx | 57 +- .../saved_query_list_item.tsx | 60 +- .../data/public/ui/search_bar/search_bar.tsx | 2 +- .../components/action_bar/action_bar.tsx | 2 +- .../__snapshots__/no_results.test.js.snap | 16 +- .../angular/directives/histogram.tsx | 4 +- .../angular/directives/uninitialized.tsx | 2 +- .../doc_table/components/table_row/_open.scss | 26 + .../doc_table/components/table_row/open.html | 4 +- .../components/discover_legacy.tsx | 2 +- .../__snapshots__/field_name.test.tsx.snap | 6 +- .../sidebar/discover_field_bucket.tsx | 2 + .../sidebar/discover_field_search.test.tsx | 31 +- .../components/panel_options_menu/index.tsx | 1 - .../panel/panel_header/panel_options_menu.tsx | 1 - .../sample_data_view_data_button.test.js.snap | 3 +- .../components/feature_directory.js | 2 +- .../saved_objects_installer.test.js.snap | 117 +- .../__snapshots__/tutorial.test.js.snap | 13 +- .../components/tutorial/instruction.js | 2 +- .../components/tutorial/tutorial.js | 5 +- .../components/tutorial/tutorial.test.js | 3 +- .../components/tutorial_directory.js | 2 +- .../header/__snapshots__/header.test.tsx.snap | 2 +- .../__snapshots__/indices_list.test.tsx.snap | 15 +- .../components/indices_list/indices_list.tsx | 1 - .../table/__snapshots__/table.test.tsx.snap | 2 +- .../confirmation_modal.test.tsx.snap | 18 +- .../confirmation_modal/confirmation_modal.tsx | 20 +- .../confirmation_modal.test.tsx.snap | 62 +- .../confirmation_modal/confirmation_modal.tsx | 58 +- .../warning_call_out.test.tsx.snap | 218 +- .../components/field_editor/field_editor.tsx | 71 +- .../__snapshots__/range_control.test.tsx.snap | 2 - .../inspector_panel.test.tsx.snap | 116 +- .../__snapshots__/data_view.test.tsx.snap | 32 +- .../management_app/management_router.tsx | 2 +- .../exit_full_screen_button.test.tsx.snap | 4 +- .../__snapshots__/split_panel.test.tsx.snap | 2 +- .../table_list_view/table_list_view.tsx | 72 +- .../validated_range/validated_dual_range.tsx | 7 +- .../resize_checker/resize_checker.test.ts | 4 +- .../public/resize_checker/resize_checker.ts | 2 +- .../saved_object_save_modal.test.tsx.snap | 179 +- .../save_modal/saved_object_save_modal.tsx | 141 +- .../__snapshots__/header.test.tsx.snap | 21 +- .../__snapshots__/intro.test.tsx.snap | 30 +- .../not_found_errors.test.tsx.snap | 176 +- .../__snapshots__/table.test.tsx.snap | 4 +- .../components/overwrite_modal.tsx | 54 +- .../objects_table/saved_objects_table.tsx | 158 +- .../share_context_menu.test.tsx.snap | 3 + .../public/services/share_menu_manager.tsx | 1 - .../public/context_menu/open_context_menu.tsx | 1 - .../vis_default_editor/public/_sidebar.scss | 20 + .../public/components/agg_select.tsx | 10 +- .../__snapshots__/metric_agg.test.tsx.snap | 3 +- .../controls/__snapshots__/size.test.tsx.snap | 3 +- .../__snapshots__/top_aggregate.test.tsx.snap | 3 +- .../components/controls/auto_precision.tsx | 2 +- .../components/simple_number_list.tsx | 2 +- .../components/controls/date_ranges.tsx | 2 +- .../public/components/controls/field.tsx | 2 +- .../public/components/controls/filter.tsx | 2 +- .../public/components/controls/ip_ranges.tsx | 2 +- .../public/components/controls/max_bars.tsx | 2 +- .../public/components/controls/metric_agg.tsx | 7 +- .../components/controls/number_interval.tsx | 2 +- .../public/components/controls/order.tsx | 2 +- .../public/components/controls/order_by.tsx | 7 +- .../components/controls/percentile_ranks.tsx | 2 +- .../components/controls/percentiles.tsx | 2 +- .../public/components/controls/precision.tsx | 2 +- .../controls/radius_ratio_option.tsx | 2 +- .../public/components/controls/ranges.tsx | 2 +- .../public/components/controls/raw_json.tsx | 2 +- .../components/controls/rows_or_columns.tsx | 2 +- .../public/components/controls/size.tsx | 2 +- .../public/components/controls/string.tsx | 2 +- .../components/controls/time_interval.tsx | 2 +- .../components/controls/top_aggregate.tsx | 2 +- .../components/controls/use_geocentroid.tsx | 2 +- .../public/components/sidebar/controls.tsx | 20 +- .../public/components/tag_cloud_options.tsx | 2 +- .../public/components/timeline_interval.tsx | 2 +- .../components/color_picker.test.tsx | 4 +- .../visualizations/views/timeseries/index.js | 4 +- .../vega_visualization.test.js.snap | 4 +- .../components/common/truncate_labels.tsx | 2 +- .../__snapshots__/y_extents.test.tsx.snap | 3 +- .../options/metrics_axes/y_extents.tsx | 2 +- .../options/point_series/threshold_panel.tsx | 2 +- .../legend/__snapshots__/legend.test.tsx.snap | 4 +- .../vislib/components/legend/legend_item.tsx | 4 +- .../visualization_noresults.test.js.snap | 2 +- .../visualization_requesterror.test.js.snap | 2 +- .../__snapshots__/new_vis_modal.test.tsx.snap | 965 +- .../public/wizard/new_vis_modal.tsx | 4 +- .../page_objects/visual_builder_page.ts | 2 +- .../page_objects/visualize_editor_page.ts | 11 +- test/functional/services/data_grid.ts | 20 +- .../plugins/osd_tp_run_pipeline/package.json | 2 +- .../public/app/components/main.tsx | 2 +- .../core_app_status/public/application.tsx | 2 +- .../core_plugin_a/public/application.tsx | 4 +- .../public/application.tsx | 2 +- .../core_plugin_b/public/application.tsx | 4 +- .../public/application.tsx | 2 +- .../osd_sample_panel_action/package.json | 2 +- .../osd_tp_custom_visualizations/package.json | 2 +- tsconfig.base.json | 3 +- yarn.lock | 452 +- 160 files changed, 8093 insertions(+), 8279 deletions(-) delete mode 100644 src/core/public/chrome/ui/header/recent_links.tsx diff --git a/examples/bfetch_explorer/public/components/page/index.tsx b/examples/bfetch_explorer/public/components/page/index.tsx index d6bb757560bb..245991e75167 100644 --- a/examples/bfetch_explorer/public/components/page/index.tsx +++ b/examples/bfetch_explorer/public/components/page/index.tsx @@ -44,7 +44,7 @@ export interface PageProps { export const Page: React.FC = ({ title = 'Untitled', children }) => { return ( - + diff --git a/examples/embeddable_explorer/public/embeddable_panel_example.tsx b/examples/embeddable_explorer/public/embeddable_panel_example.tsx index 4680c4e47b6b..6ed6e4792927 100644 --- a/examples/embeddable_explorer/public/embeddable_panel_example.tsx +++ b/examples/embeddable_explorer/public/embeddable_panel_example.tsx @@ -138,7 +138,7 @@ export function EmbeddablePanelExample({ embeddableServices, searchListContainer }); return ( - + diff --git a/examples/embeddable_explorer/public/hello_world_embeddable_example.tsx b/examples/embeddable_explorer/public/hello_world_embeddable_example.tsx index 9a073f6d0e13..af304b407ba0 100644 --- a/examples/embeddable_explorer/public/hello_world_embeddable_example.tsx +++ b/examples/embeddable_explorer/public/hello_world_embeddable_example.tsx @@ -51,7 +51,7 @@ interface Props { export function HelloWorldEmbeddableExample({ helloWorldEmbeddableFactory }: Props) { return ( - + diff --git a/examples/embeddable_explorer/public/list_container_example.tsx b/examples/embeddable_explorer/public/list_container_example.tsx index 0cd65ccc3b78..797b87513039 100644 --- a/examples/embeddable_explorer/public/list_container_example.tsx +++ b/examples/embeddable_explorer/public/list_container_example.tsx @@ -126,7 +126,7 @@ export function ListContainerExample({ }; return ( - + diff --git a/examples/embeddable_explorer/public/todo_embeddable_example.tsx b/examples/embeddable_explorer/public/todo_embeddable_example.tsx index db17aa5a1a23..614e570672b1 100644 --- a/examples/embeddable_explorer/public/todo_embeddable_example.tsx +++ b/examples/embeddable_explorer/public/todo_embeddable_example.tsx @@ -83,7 +83,7 @@ export class TodoEmbeddableExample extends React.Component { public render() { return ( - + diff --git a/examples/routing_example/public/app.tsx b/examples/routing_example/public/app.tsx index a570e9be5445..1f784933f535 100644 --- a/examples/routing_example/public/app.tsx +++ b/examples/routing_example/public/app.tsx @@ -57,7 +57,7 @@ function RoutingExplorer({ }: Props) { return ( - + diff --git a/examples/search_examples/public/components/app.tsx b/examples/search_examples/public/components/app.tsx index 20a7c8b94bce..c3c106631a5e 100644 --- a/examples/search_examples/public/components/app.tsx +++ b/examples/search_examples/public/components/app.tsx @@ -224,7 +224,7 @@ export const SearchExamplesApp = ({ indexPatterns={indexPattern ? [indexPattern] : undefined} /> - +

diff --git a/examples/state_containers_examples/public/todo/todo.tsx b/examples/state_containers_examples/public/todo/todo.tsx index e4acf285ac69..263c2b927229 100644 --- a/examples/state_containers_examples/public/todo/todo.tsx +++ b/examples/state_containers_examples/public/todo/todo.tsx @@ -287,7 +287,7 @@ export const TodoAppPage: React.FC<{ - + diff --git a/examples/state_containers_examples/public/with_data_services/components/app.tsx b/examples/state_containers_examples/public/with_data_services/components/app.tsx index 3517b1182a7e..d706790762e9 100644 --- a/examples/state_containers_examples/public/with_data_services/components/app.tsx +++ b/examples/state_containers_examples/public/with_data_services/components/app.tsx @@ -114,7 +114,7 @@ const App = ({ navigation, data, history, osdUrlStateStorage }: StateDemoAppDeps showSaveQuery={true} /> - +

diff --git a/examples/ui_actions_explorer/public/app.tsx b/examples/ui_actions_explorer/public/app.tsx index 8f5ad20cc396..2afc32f3484e 100644 --- a/examples/ui_actions_explorer/public/app.tsx +++ b/examples/ui_actions_explorer/public/app.tsx @@ -60,7 +60,7 @@ const ActionsExplorer = ({ uiActionsApi, openModal }: Props) => { const [confirmationText, setConfirmationText] = useState(''); return ( - + Ui Actions Explorer diff --git a/examples/ui_actions_explorer/public/page.tsx b/examples/ui_actions_explorer/public/page.tsx index 4ffb5d872fc7..b80aa643cb0f 100644 --- a/examples/ui_actions_explorer/public/page.tsx +++ b/examples/ui_actions_explorer/public/page.tsx @@ -46,7 +46,7 @@ interface PageProps { export function Page({ title, children }: PageProps) { return ( - + diff --git a/examples/url_generators_examples/public/app.tsx b/examples/url_generators_examples/public/app.tsx index 4fa181c9eec7..df7e26bfa920 100644 --- a/examples/url_generators_examples/public/app.tsx +++ b/examples/url_generators_examples/public/app.tsx @@ -58,7 +58,7 @@ export const Routes: React.FC<{}> = () => { const query = useQuery(); return ( - + diff --git a/examples/url_generators_explorer/public/app.tsx b/examples/url_generators_explorer/public/app.tsx index 2dd8c4e60c15..19ec73407291 100644 --- a/examples/url_generators_explorer/public/app.tsx +++ b/examples/url_generators_explorer/public/app.tsx @@ -111,7 +111,7 @@ const ActionsExplorer = ({ getLinkGenerator }: Props) => { return ( - + Access links explorer diff --git a/examples/url_generators_explorer/public/page.tsx b/examples/url_generators_explorer/public/page.tsx index 4ffb5d872fc7..b80aa643cb0f 100644 --- a/examples/url_generators_explorer/public/page.tsx +++ b/examples/url_generators_explorer/public/page.tsx @@ -46,7 +46,7 @@ interface PageProps { export function Page({ title, children }: PageProps) { return ( - + diff --git a/package.json b/package.json index 6ec4df5157dc..047d08d60d1c 100644 --- a/package.json +++ b/package.json @@ -107,7 +107,7 @@ }, "dependencies": { "@elastic/datemath": "5.0.3", - "@elastic/eui": "29.3.2", + "@elastic/eui": "34.6.0", "@elastic/good": "^9.0.1-kibana3", "@elastic/numeral": "^2.5.0", "@elastic/request-crypto": "2.0.0", @@ -207,12 +207,13 @@ "yauzl": "^2.10.0" }, "devDependencies": { + "@4lolo/resize-observer-polyfill": "^1.5.2", "@babel/core": "^7.16.5", "@babel/parser": "^7.16.6", "@babel/register": "^7.16.5", "@babel/types": "^7.16.0", "@elastic/apm-rum": "^5.6.1", - "@elastic/charts": "23.2.2", + "@elastic/charts": "31.1.0", "@elastic/ems-client": "7.10.0", "@elastic/eslint-config-kibana": "0.15.0", "@elastic/eslint-plugin-eui": "0.0.2", @@ -426,7 +427,6 @@ "redux": "^4.0.5", "regenerate": "^1.4.0", "reselect": "^4.0.0", - "resize-observer-polyfill": "^1.5.0", "sass-lint": "^1.12.1", "selenium-webdriver": "^4.0.0-alpha.7", "simple-git": "^3.4.0", diff --git a/packages/osd-plugin-generator/template/public/components/app.tsx.ejs b/packages/osd-plugin-generator/template/public/components/app.tsx.ejs index 9f29b4fa6969..876b3f8c5e75 100644 --- a/packages/osd-plugin-generator/template/public/components/app.tsx.ejs +++ b/packages/osd-plugin-generator/template/public/components/app.tsx.ejs @@ -58,7 +58,7 @@ import { CoreStart } from '<%= importFromRoot('src/core/public') %>'; - +

@@ -101,4 +101,4 @@ import { CoreStart } from '<%= importFromRoot('src/core/public') %>'; ); - }; \ No newline at end of file + }; diff --git a/packages/osd-ui-framework/package.json b/packages/osd-ui-framework/package.json index 5ee583ba1295..2ca58fea8d89 100644 --- a/packages/osd-ui-framework/package.json +++ b/packages/osd-ui-framework/package.json @@ -24,7 +24,7 @@ "enzyme-adapter-react-16": "^1.9.1" }, "devDependencies": { - "@elastic/eui": "29.3.2", + "@elastic/eui": "34.6.0", "@osd/babel-preset": "1.0.0", "@osd/optimizer": "1.0.0", "babel-loader": "^8.2.3", diff --git a/packages/osd-ui-shared-deps/package.json b/packages/osd-ui-shared-deps/package.json index 799a8b6bddc6..361b953720b3 100644 --- a/packages/osd-ui-shared-deps/package.json +++ b/packages/osd-ui-shared-deps/package.json @@ -9,8 +9,8 @@ "osd:watch": "node scripts/build --dev --watch" }, "dependencies": { - "@elastic/charts": "23.2.2", - "@elastic/eui": "29.3.2", + "@elastic/charts": "31.1.0", + "@elastic/eui": "34.6.0", "@elastic/numeral": "^2.5.0", "@osd/i18n": "1.0.0", "@osd/monaco": "1.0.0", diff --git a/src/core/public/application/ui/app_not_found_screen.tsx b/src/core/public/application/ui/app_not_found_screen.tsx index 105c52b0d359..ac2b2f80b9c2 100644 --- a/src/core/public/application/ui/app_not_found_screen.tsx +++ b/src/core/public/application/ui/app_not_found_screen.tsx @@ -34,7 +34,7 @@ import { FormattedMessage } from '@osd/i18n/react'; export const AppNotFound = () => ( - + - - - - } - /> - - -
-
+ + +
+ + +
-
-
-
- - - -
+ className="euiListGroupItem__icon" + color="inherit" + data-euiicon-type="home" + /> + + + Home + + + + + +
- -
- - + +
+ + + + + +

+ Recently viewed +

+ + + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" data-test-subj="collapsibleNavGroup-recentlyViewed" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="recentlyViewed" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Recently viewed" + paddingSize="none" > - - - -

- Recently viewed -

- - - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" +
-
- -
-
+ +
+ +
+ + + +
+
+ - -
+
+
-
- - - -
+ recent 2 + + + + + +
- -
+
+
- - - -
- - + + + +
+ + +
-
- + + + + + +

+ OpenSearch Dashboards +

+ + + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="/defaultModeLogo" data-test-subj="collapsibleNavGroup-opensearchDashboards" - iconType="/defaultModeLogo" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="opensearchDashboards" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="OpenSearch Dashboards" + paddingSize="none" > - - - - - - -

- OpenSearch Dashboards -

- - - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
-
- -
-
+ +
+ +
+ + + +
+
+ - -
+
+
-
- - - -
+ dashboard + + + + + +
- -
+
+
- - - + + + + + + + + + +

+ Observability +

+ + + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="logoObservability" data-test-subj="collapsibleNavGroup-observability" - iconType="logoObservability" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="observability" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Observability" + paddingSize="none" > - - - - - - -

- Observability -

- - - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
-
- -
-
+ +
+ +
+ + + +
+
+ - -
+
+
-
- - - -
+ logs + + + + + +
- -
+
+
- - - + + + + + + + + + +

+ Security +

+ + + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="logoSecurity" data-test-subj="collapsibleNavGroup-securitySolution" - iconType="logoSecurity" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="securitySolution" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Security" + paddingSize="none" > - - - - - - -

- Security -

- - - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
-
- -
-
+ +
+ +
+ + + +
+
+ - -
+
+
-
- - - -
+ siem + + + + + +
- -
+
+
- - - + + + + + + + + + +

+ Management +

+ + + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="managementApp" data-test-subj="collapsibleNavGroup-management" - iconType="managementApp" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="management" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Management" + paddingSize="none" > - - - - - - -

- Management -

- - - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
-
- -
-
+ +
+ +
+ + + +
+
+ - -
+
+
-
- - - -
+ monitoring + + + + + +
- -
+
+
- - - + + + +
+
+ + + +
+
+ + +
+ + + Dock navigation + + , + } + } + color="subdued" + data-test-subj="collapsible-nav-lock" + iconType="lockOpen" + label="Dock navigation" onClick={[Function]} - size="s" + size="xs" >
  • - + + + - canvas + Dock navigation - +
    • @@ -1889,157 +1994,11 @@ exports[`CollapsibleNav renders links grouped by category 1`] = `
    - - -
    -
    - -
      - -
      - - Dock navigation - - , - } - } - color="subdued" - data-test-subj="collapsible-nav-lock" - iconType="lockOpen" - label="Dock navigation" - onClick={[Function]} - size="xs" - > -
    • - -
      • - -
    -     -
    -
    -     -     -
    - - - - - - - -
    -     + + + + + `; @@ -2775,42 +2734,57 @@ exports[`CollapsibleNav renders the default nav 3`] = ` isOpen={false} onClose={[Function]} > - - -
    -
    + + + + + +

    + Recently viewed +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" data-test-subj="collapsibleNavGroup-recentlyViewed" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="recentlyViewed" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Recently viewed" + paddingSize="none" > - - - -

    - Recently viewed -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - -
    - -
    -

    - No recently viewed items -

    -
    -     -
    -     -
    +

    + No recently viewed items +

    +
    + +
    +
    -     -
    + + -     -     - -
    -     - + + + +
    +     + +
    -
    - - + +
    -
    - -
      - -
      - - Undock navigation - - , - } - } - color="subdued" - data-test-subj="collapsible-nav-lock" - iconType="lock" - label="Undock navigation" - onClick={[Function]} - size="xs" - > -
    • - -
      • - -
    -     -
    + , + } + } + color="subdued" + data-test-subj="collapsible-nav-lock" + iconType="lock" + label="Undock navigation" + onClick={[Function]} + size="xs" + > +
  • + +
    • + + +
    - - -
    - - - - - - - -
    - +
    + + + +     + + `; @@ -3501,54 +3414,62 @@ exports[`CollapsibleNav renders the nav bar with custom logo in dark mode 1`] = isOpen={true} onClose={[Function]} > - - - - } - /> - - -
    -
    +     + + + + +

    + Recently viewed +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" data-test-subj="collapsibleNavGroup-recentlyViewed" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="recentlyViewed" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Recently viewed" + paddingSize="none" > - - - -

    - Recently viewed -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + recent + + + + + +
    - -
    +
    +
    -     -     - -
    -     - + + + +
    +     + +
    -
    - + + + + + +

    + OpenSearch Dashboards +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="/darkModeLogo" data-test-subj="collapsibleNavGroup-opensearchDashboards" - iconType="/darkModeLogo" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="opensearchDashboards" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="OpenSearch Dashboards" + paddingSize="none" > - - - - - - -

    - OpenSearch Dashboards -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + discover + + + + + +
    - -
    +
    +
    -     -     - + + + + + + + + + +

    + Observability +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="logoObservability" data-test-subj="collapsibleNavGroup-observability" - iconType="logoObservability" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="observability" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Observability" + paddingSize="none" > - - - - - - -

    - Observability -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + discover + + + + + +
    - -
    +
    +
    -     -     - - +
    + + + + +
    -
    - -
      - -
      - - Dock navigation - - , - } - } - color="subdued" - data-test-subj="collapsible-nav-lock" - iconType="lockOpen" - label="Dock navigation" - onClick={[Function]} - size="xs" - > -
    • - -
      • - -
    -     -
    + , + } + } + color="subdued" + data-test-subj="collapsible-nav-lock" + iconType="lockOpen" + label="Dock navigation" + onClick={[Function]} + size="xs" + > +
  • + +
    • + + +
    - - -
    - - - - - - - -
    -     + + + + + + + `; @@ -4702,54 +4568,62 @@ exports[`CollapsibleNav renders the nav bar with custom logo in dark mode 2`] = isOpen={true} onClose={[Function]} > - - - - } - /> - - -
    -
    + + + + + +

    + Recently viewed +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" data-test-subj="collapsibleNavGroup-recentlyViewed" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="recentlyViewed" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Recently viewed" + paddingSize="none" > - - - -

    - Recently viewed -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + recent + + + + + +
    - -
    +
    +
    -     -     - -
    -     - + + + +
    +     + +
    -
    - + + + + + +

    + OpenSearch Dashboards +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="/defaultModeLogo" data-test-subj="collapsibleNavGroup-opensearchDashboards" - iconType="/defaultModeLogo" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="opensearchDashboards" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="OpenSearch Dashboards" + paddingSize="none" > - - - - - - -

    - OpenSearch Dashboards -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + discover + + + + + +
    - -
    +
    +
    -     -     - + + + + + + + + + +

    + Observability +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="logoObservability" data-test-subj="collapsibleNavGroup-observability" - iconType="logoObservability" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="observability" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Observability" + paddingSize="none" > - - - - - - -

    - Observability -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + discover + + + + + +
    - -
    +
    +
    -     -     - - +
    + + + + +
    -
    - -
      - -
      - - Dock navigation - - , - } - } - color="subdued" - data-test-subj="collapsible-nav-lock" - iconType="lockOpen" - label="Dock navigation" - onClick={[Function]} - size="xs" - > -
    • - -
      • - -
    -     -
    -
    - - -
    - - - - - - - -
    -     + , + } + } + color="subdued" + data-test-subj="collapsible-nav-lock" + iconType="lockOpen" + label="Dock navigation" + onClick={[Function]} + size="xs" + > +
  • + +
    • + + + + + + + + + + + `; @@ -5901,54 +5720,62 @@ exports[`CollapsibleNav renders the nav bar with custom logo in dark mode 3`] = isOpen={true} onClose={[Function]} > - - - - } - /> - - -
    -
    + + + + + +

    + Recently viewed +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" data-test-subj="collapsibleNavGroup-recentlyViewed" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="recentlyViewed" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Recently viewed" + paddingSize="none" > - - - -

    - Recently viewed -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + recent + + + + + +
    - -
    +
    +
    -     -     - -
    -     - + + + +
    +     + +
    -
    - + + + + + +

    + OpenSearch Dashboards +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="undefined/opensearch_mark_default_mode.svg" data-test-subj="collapsibleNavGroup-opensearchDashboards" - iconType="undefined/opensearch_mark_default_mode.svg" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="opensearchDashboards" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="OpenSearch Dashboards" + paddingSize="none" > - - - - - - -

    - OpenSearch Dashboards -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + discover + + + + + +
    - -
    +
    +
    -     -     - + + + + + + + + + +

    + Observability +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="logoObservability" data-test-subj="collapsibleNavGroup-observability" - iconType="logoObservability" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="observability" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Observability" + paddingSize="none" > - - - - - - -

    - Observability -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + discover + + + + + +
    - -
    +
    +
    -     -     - - +
    + + + + +
    -
    - -
      - -
      - - Dock navigation - - , - } - } - color="subdued" - data-test-subj="collapsible-nav-lock" - iconType="lockOpen" - label="Dock navigation" - onClick={[Function]} - size="xs" - > -
    • - -
      • - -
    -     -
    + , + } + } + color="subdued" + data-test-subj="collapsible-nav-lock" + iconType="lockOpen" + label="Dock navigation" + onClick={[Function]} + size="xs" + > +
  • + +
    • + + +
    - - -
    - - - - - - - -
    -     + + + + + + + `; @@ -7103,54 +6875,62 @@ exports[`CollapsibleNav renders the nav bar with custom logo in default mode 1`] isOpen={true} onClose={[Function]} > - - - - } - /> - - -
    -
    + + + + + +

    + Recently viewed +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" data-test-subj="collapsibleNavGroup-recentlyViewed" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="recentlyViewed" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Recently viewed" + paddingSize="none" > - - - -

    - Recently viewed -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + recent + + + + + +
    - -
    +
    +
    -     -     - -
    -     - + + + +
    +     + +
    -
    - + + + + + +

    + OpenSearch Dashboards +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="/defaultModeLogo" data-test-subj="collapsibleNavGroup-opensearchDashboards" - iconType="/defaultModeLogo" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="opensearchDashboards" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="OpenSearch Dashboards" + paddingSize="none" > - - - - - - -

    - OpenSearch Dashboards -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + discover + + + + + +
    - -
    +
    +
    -     -     - + + + + + + + + + +

    + Observability +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="logoObservability" data-test-subj="collapsibleNavGroup-observability" - iconType="logoObservability" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="observability" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Observability" + paddingSize="none" > - - - - - - -

    - Observability -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + discover + + + + + +
    - -
    +
    +
    -     -     - - +
    + + + + +
    -
    - -
      - -
      - - Dock navigation - - , - } - } - color="subdued" - data-test-subj="collapsible-nav-lock" - iconType="lockOpen" - label="Dock navigation" - onClick={[Function]} - size="xs" - > -
    • - -
      • - -
    -     -
    + , + } + } + color="subdued" + data-test-subj="collapsible-nav-lock" + iconType="lockOpen" + label="Dock navigation" + onClick={[Function]} + size="xs" + > +
  • + +
    • + + +
    - - -
    - - - - - - - -
    -     + + + + + + + `; @@ -8302,54 +8027,62 @@ exports[`CollapsibleNav renders the nav bar with custom logo in default mode 2`] isOpen={true} onClose={[Function]} > - - - - } - /> - - -
    -
    + + + + + +

    + Recently viewed +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" data-test-subj="collapsibleNavGroup-recentlyViewed" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="recentlyViewed" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Recently viewed" + paddingSize="none" > - - - -

    - Recently viewed -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + recent + + + + + +
    - -
    +
    +
    -     -     - -
    -     - + + + +
    +     + +
    -
    - + + + + + +

    + OpenSearch Dashboards +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="undefined/opensearch_mark_default_mode.svg" data-test-subj="collapsibleNavGroup-opensearchDashboards" - iconType="undefined/opensearch_mark_default_mode.svg" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="opensearchDashboards" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="OpenSearch Dashboards" + paddingSize="none" > - - - - - - -

    - OpenSearch Dashboards -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + discover + + + + + +
    - -
    +
    +
    -     -     - + + + + + + + + + +

    + Observability +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" data-test-opensearch-logo="logoObservability" data-test-subj="collapsibleNavGroup-observability" - iconType="logoObservability" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="observability" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Observability" + paddingSize="none" > - - - - - - -

    - Observability -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + discover + + + + + +
    - -
    +
    +
    -     -     - - +
    + + + + +
    -
    - -
      - -
      - - Dock navigation - - , - } - } - color="subdued" - data-test-subj="collapsible-nav-lock" - iconType="lockOpen" - label="Dock navigation" - onClick={[Function]} - size="xs" - > -
    • - -
      • - -
    -     -
    + , + } + } + color="subdued" + data-test-subj="collapsible-nav-lock" + iconType="lockOpen" + label="Dock navigation" + onClick={[Function]} + size="xs" + > +
  • + +
    • + + +
    - - -
    - - - - - - - -
    -     + + + + + + + `; diff --git a/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap b/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap index 5ad89191b0c9..e75f736fbb15 100644 --- a/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap +++ b/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap @@ -4709,51 +4709,101 @@ exports[`Header renders 1`] = ` panelPaddingSize="m" repositionOnScroll={true} > -
    -
    - + + + + + + + + , + } + } + className="euiHeaderSectionItemButton" + color="text" onClick={[Function]} > - -
    + +
    -     + @@ -4850,26 +4900,90 @@ exports[`Header renders 1`] = ` data-test-subj="toggleNavButton" onClick={[Function]} > - , + } + } + className="euiHeaderSectionItemButton" + color="text" data-test-subj="toggleNavButton" onClick={[Function]} - type="button" > - -
    - - + + + + + + + + + + + + +
    @@ -5493,42 +5607,57 @@ exports[`Header renders 1`] = ` isOpen={false} onClose={[Function]} > - - -
    -
    + + +
    +     + +
    -
    -
    -
    - - - -
    + className="euiListGroupItem__icon" + color="inherit" + data-euiicon-type="home" + /> + + + Home + + + + + +
    -     -
    - - + +
    +     + + + + +

    + Recently viewed +

    +     +     + + } + className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" data-test-subj="collapsibleNavGroup-recentlyViewed" + id="mockId" initialIsOpen={true} - isCollapsible={true} - key="recentlyViewed" + isLoading={false} + isLoadingMessage={false} onToggle={[Function]} - title="Recently viewed" + paddingSize="none" > - - - -

    - Recently viewed -

    -     -     - - } - className="euiCollapsibleNavGroup euiCollapsibleNavGroup--light euiCollapsibleNavGroup--withHeading" +
    -
    - -
    -
    + +
    + +
    + + + +
    +
    + - -
    +
    +
    -
    - - - -
    + dashboard + + + + + +
    - -
    +
    +
    -     -     - -
    -     - + + + +
    +     + +
    -
    - +
    + +
      + +
    • + +
      • +       +
    +     +
    +
    + + +
    + + + Undock navigation + + , + } + } + color="subdued" + data-test-subj="collapsible-nav-lock" + iconType="lock" + label="Undock navigation" onClick={[Function]} - size="s" + size="xs" >
    • @@ -5983,157 +6197,11 @@ exports[`Header renders 1`] = `
    - - -
    -
    - -
      - -
      - - Undock navigation - - , - } - } - color="subdued" - data-test-subj="collapsible-nav-lock" - iconType="lock" - label="Undock navigation" - onClick={[Function]} - size="xs" - > -
    • - -
      • - -
    -     -
    -
    -     -     -
    -     - - - - - - - -     + + + + + diff --git a/src/core/public/chrome/ui/header/header.test.tsx b/src/core/public/chrome/ui/header/header.test.tsx index 32c41036f505..41b9282848b4 100644 --- a/src/core/public/chrome/ui/header/header.test.tsx +++ b/src/core/public/chrome/ui/header/header.test.tsx @@ -115,11 +115,11 @@ describe('Header', () => { act(() => isVisible$.next(true)); component.update(); expect(component.find('EuiHeader').exists()).toBeTruthy(); - expect(component.find('nav[aria-label="Primary"]').exists()).toBeFalsy(); + expect(component.find('EuiFlyout[aria-label="Primary"]').exists()).toBeFalsy(); act(() => isLocked$.next(true)); component.update(); - expect(component.find('nav[aria-label="Primary"]').exists()).toBeTruthy(); + expect(component.find('EuiFlyout[aria-label="Primary"]').exists()).toBeTruthy(); expect(component).toMatchSnapshot(); }); }); diff --git a/src/core/public/chrome/ui/header/header.tsx b/src/core/public/chrome/ui/header/header.tsx index ed4793a497e1..15a78c7350c8 100644 --- a/src/core/public/chrome/ui/header/header.tsx +++ b/src/core/public/chrome/ui/header/header.tsx @@ -106,7 +106,7 @@ export function Header({ return ; } - const toggleCollapsibleNavRef = createRef(); + const toggleCollapsibleNavRef = createRef void }>(); const navId = htmlIdGenerator()(); const className = classnames('hide-for-sharing', 'headerGlobalNav'); diff --git a/src/core/public/chrome/ui/header/recent_links.tsx b/src/core/public/chrome/ui/header/recent_links.tsx deleted file mode 100644 index 5904739403d0..000000000000 --- a/src/core/public/chrome/ui/header/recent_links.tsx +++ /dev/null @@ -1,63 +0,0 @@ -/* - * SPDX-License-Identifier: Apache-2.0 - * - * The OpenSearch Contributors require contributions made to - * this file be licensed under the Apache-2.0 license or a - * compatible open source license. - * - * Any modifications Copyright OpenSearch Contributors. See - * GitHub history for details. - */ - -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { i18n } from '@osd/i18n'; -import { EuiNavDrawerGroup } from '@elastic/eui'; -import { RecentNavLink } from './nav_link'; - -interface Props { - recentNavLinks: RecentNavLink[]; -} - -export function RecentLinks({ recentNavLinks }: Props) { - return ( - - ); -} diff --git a/src/core/public/core_app/errors/error_application.tsx b/src/core/public/core_app/errors/error_application.tsx index 475db53868b6..87bbe3c6a1c3 100644 --- a/src/core/public/core_app/errors/error_application.tsx +++ b/src/core/public/core_app/errors/error_application.tsx @@ -53,7 +53,7 @@ const ErrorPage: React.FC = ({ title, children }) => { return ( - + { return ( - + diff --git a/src/core/public/fatal_errors/__snapshots__/fatal_errors_screen.test.tsx.snap b/src/core/public/fatal_errors/__snapshots__/fatal_errors_screen.test.tsx.snap index 7b7debc128fb..1f86c71d1a9e 100644 --- a/src/core/public/fatal_errors/__snapshots__/fatal_errors_screen.test.tsx.snap +++ b/src/core/public/fatal_errors/__snapshots__/fatal_errors_screen.test.tsx.snap @@ -8,7 +8,9 @@ exports[`FatalErrorsScreen rendering render matches snapshot 1`] = ` } } > - + { public render() { return ( - +
    Flyout content
    "`; +exports[`FlyoutService openFlyout() renders a flyout to the DOM 2`] = `"
    Flyout content
    "`; exports[`FlyoutService openFlyout() with a currently active flyout replaces the current flyout with a new one 1`] = ` Array [ @@ -59,4 +59,4 @@ Array [ ] `; -exports[`FlyoutService openFlyout() with a currently active flyout replaces the current flyout with a new one 2`] = `"
    Flyout content 2
    "`; +exports[`FlyoutService openFlyout() with a currently active flyout replaces the current flyout with a new one 2`] = `"
    Flyout content 2
    "`; diff --git a/src/core/public/overlays/modal/__snapshots__/modal_service.test.tsx.snap b/src/core/public/overlays/modal/__snapshots__/modal_service.test.tsx.snap index a62d94a30c67..ab3a55d432c4 100644 --- a/src/core/public/overlays/modal/__snapshots__/modal_service.test.tsx.snap +++ b/src/core/public/overlays/modal/__snapshots__/modal_service.test.tsx.snap @@ -11,80 +11,72 @@ Array [ exports[`ModalService openConfirm() renders a mountpoint confirm message 1`] = ` Array [ Array [ - - - - - - - , + + + + + ,
    , ], ] `; -exports[`ModalService openConfirm() renders a mountpoint confirm message 2`] = `"
    Modal content
    "`; +exports[`ModalService openConfirm() renders a mountpoint confirm message 2`] = `"
    Modal content
    "`; exports[`ModalService openConfirm() renders a string confirm message 1`] = ` Array [ Array [ - - - - Some message - - - , + + + Some message + + ,
    , ], ] `; -exports[`ModalService openConfirm() renders a string confirm message 2`] = `"

    Some message

    "`; +exports[`ModalService openConfirm() renders a string confirm message 2`] = `"

    Some message

    "`; exports[`ModalService openConfirm() with a currently active confirm replaces the current confirm with the new one 1`] = ` Array [ Array [ - - - - confirm 1 - - - , + + + confirm 1 + + ,
    , ], Array [ - - - - some confirm - - - , + + + some confirm + + ,
    , ], ] @@ -93,33 +85,29 @@ Array [ exports[`ModalService openConfirm() with a currently active modal replaces the current modal with the new confirm 1`] = ` Array [ Array [ - - - - - - - , + + + + + ,
    , ], Array [ - - - - some confirm - - - , + + + some confirm + + ,
    , ], ] @@ -128,55 +116,49 @@ Array [ exports[`ModalService openModal() renders a modal to the DOM 1`] = ` Array [ Array [ - - - - - - - , + + + + + ,
    , ], ] `; -exports[`ModalService openModal() renders a modal to the DOM 2`] = `"
    Modal content
    "`; +exports[`ModalService openModal() renders a modal to the DOM 2`] = `"
    Modal content
    "`; exports[`ModalService openModal() with a currently active confirm replaces the current confirm with the new one 1`] = ` Array [ Array [ - - - - confirm 1 - - - , + + + confirm 1 + + ,
    , ], Array [ - - - - some confirm - - - , + + + some confirm + + ,
    , ], ] @@ -185,33 +167,29 @@ Array [ exports[`ModalService openModal() with a currently active modal replaces the current modal with a new one 1`] = ` Array [ Array [ - - - - - - - , + + + + + ,
    , ], Array [ - - - - - - - , + + + + + ,
    , ], ] diff --git a/src/core/public/overlays/modal/modal_service.tsx b/src/core/public/overlays/modal/modal_service.tsx index a91bb4c74a66..a1f7a7e59cdb 100644 --- a/src/core/public/overlays/modal/modal_service.tsx +++ b/src/core/public/overlays/modal/modal_service.tsx @@ -31,7 +31,7 @@ /* eslint-disable max-classes-per-file */ import { i18n as t } from '@osd/i18n'; -import { EuiModal, EuiConfirmModal, EuiOverlayMask, EuiConfirmModalProps } from '@elastic/eui'; +import { EuiModal, EuiConfirmModal, EuiConfirmModalProps } from '@elastic/eui'; import React from 'react'; import { render, unmountComponentAtNode } from 'react-dom'; import { Subject } from 'rxjs'; @@ -150,13 +150,11 @@ export class ModalService { this.activeModal = modal; render( - - - modal.close()}> - - - - , + + modal.close()}> + + + , targetDomElement ); @@ -212,11 +210,9 @@ export class ModalService { }; render( - - - - - , + + + , targetDomElement ); }); diff --git a/src/core/public/styles/_base.scss b/src/core/public/styles/_base.scss index 37e3447fda8c..3f7b62cafe74 100644 --- a/src/core/public/styles/_base.scss +++ b/src/core/public/styles/_base.scss @@ -1,3 +1,14 @@ +/* + * SPDX-License-Identifier: Apache-2.0 + * + * The OpenSearch Contributors require contributions made to + * this file be licensed under the Apache-2.0 license or a + * compatible open source license. + * + * Modifications Copyright OpenSearch Contributors. See + * GitHub history for details. + */ + // Charts themes available app-wide @import '@elastic/charts/dist/theme'; @import '@elastic/eui/src/themes/charts/theme'; @@ -6,6 +17,7 @@ @import '@elastic/eui/src/components/collapsible_nav/variables'; // Application Layout +$euiCollapsibleNavWidth: $euiSize * 20; .application, .app-container { @@ -51,3 +63,8 @@ .euiBody--collapsibleNavIsDocked .euiBottomBar { margin-left: $euiCollapsibleNavWidth; } + +.euiButtonIcon.euiButtonIcon--auto { + height: auto; + width: auto; +} diff --git a/src/plugins/charts/public/static/components/number_input.tsx b/src/plugins/charts/public/static/components/number_input.tsx index a6249b2d7969..336ec0ac3a9e 100644 --- a/src/plugins/charts/public/static/components/number_input.tsx +++ b/src/plugins/charts/public/static/components/number_input.tsx @@ -65,7 +65,13 @@ function NumberInputOption({ 'data-test-subj': dataTestSubj, }: NumberInputOptionProps) { return ( - + ({ } }; return ( - + ({ ); return ( - + ({ setValue, }: SwitchOptionProps) { return ( - + ({ setValue, }: TextInputOptionProps) { return ( - + - - - - - - + + + + + + + + + + } + > + { + const val = parseInt(e.target.value, 10); + if (!val) return; + setFontSize(val); + }} + /> + - - + } - > - { - const val = parseInt(e.target.value, 10); - if (!val) return; - setFontSize(val); - }} - /> - + onChange={(e) => setWrapMode(e.target.checked)} + /> + - - - } - onChange={(e) => setWrapMode(e.target.checked)} + - - - + } - > - - } - onChange={(e) => setTripleQuotes(e.target.checked)} - /> - + onChange={(e) => setTripleQuotes(e.target.checked)} + /> + - - } - > - { - const { stateSetter, ...rest } = opts; - return rest; - })} - idToSelectedMap={checkboxIdToSelectedMap} - onChange={(e: any) => { - onAutocompleteChange(e as AutocompleteOptions); - }} + - + } + > + { + const { stateSetter, ...rest } = opts; + return rest; + })} + idToSelectedMap={checkboxIdToSelectedMap} + onChange={(e: any) => { + onAutocompleteChange(e as AutocompleteOptions); + }} + /> + - {pollingFields} - + {pollingFields} + - - - - + + + + - - - - - - + + + + + ); } diff --git a/src/plugins/dashboard/public/application/__snapshots__/dashboard_empty_screen.test.tsx.snap b/src/plugins/dashboard/public/application/__snapshots__/dashboard_empty_screen.test.tsx.snap index 8f1d091c0554..04120e429393 100644 --- a/src/plugins/dashboard/public/application/__snapshots__/dashboard_empty_screen.test.tsx.snap +++ b/src/plugins/dashboard/public/application/__snapshots__/dashboard_empty_screen.test.tsx.snap @@ -275,16 +275,18 @@ exports[`DashboardEmptyScreen renders correctly with readonly mode 1`] = ` restrictWidth="500px" >
    - +
    -
    @@ -992,16 +1004,18 @@ exports[`DashboardEmptyScreen renders correctly without visualize paragraph 1`] restrictWidth="500px" >
    - +
    { return ( - + - - - - - - - - -

    - -

    -     - - + + + -     - - - - - + + + + +

    - - - - +

    +     + + +     + + + + + + + + +     `; diff --git a/src/plugins/dashboard/public/application/top_nav/clone_modal.tsx b/src/plugins/dashboard/public/application/top_nav/clone_modal.tsx index 6268ce0ae95f..f56a1e5be14a 100644 --- a/src/plugins/dashboard/public/application/top_nav/clone_modal.tsx +++ b/src/plugins/dashboard/public/application/top_nav/clone_modal.tsx @@ -41,7 +41,6 @@ import { EuiModalFooter, EuiModalHeader, EuiModalHeaderTitle, - EuiOverlayMask, EuiSpacer, EuiText, EuiCallOut, @@ -160,69 +159,67 @@ export class DashboardCloneModal extends React.Component { render() { return ( - - - - - - - - - - -

    - -

    -     - - - - + + + + + - {this.renderDuplicateTitleCallout()} -     - - - + + +

    - - - - - - - - +

    +     + + + + + + {this.renderDuplicateTitleCallout()} +     + + + + + + + + + + +     ); } } diff --git a/src/plugins/data/public/ui/filter_bar/filter_bar.tsx b/src/plugins/data/public/ui/filter_bar/filter_bar.tsx index ba32af354d78..94f9c6590b91 100644 --- a/src/plugins/data/public/ui/filter_bar/filter_bar.tsx +++ b/src/plugins/data/public/ui/filter_bar/filter_bar.tsx @@ -129,7 +129,6 @@ function FilterBarUI(props: Props) { isOpen={isAddFilterPopoverOpen} closePopover={() => setIsAddFilterPopoverOpen(false)} anchorPosition="downLeft" - withTitle panelPaddingSize="none" ownFocus={true} initialFocus=".globalFilterEditor__fieldInput input" diff --git a/src/plugins/data/public/ui/filter_bar/filter_item.tsx b/src/plugins/data/public/ui/filter_bar/filter_item.tsx index bbbdab96eb7e..a0631a52b53e 100644 --- a/src/plugins/data/public/ui/filter_bar/filter_item.tsx +++ b/src/plugins/data/public/ui/filter_bar/filter_item.tsx @@ -362,7 +362,6 @@ export function FilterItem(props: Props) { }} button={badge} anchorPosition="downLeft" - withTitle={true} panelPaddingSize="none" > diff --git a/src/plugins/data/public/ui/filter_bar/filter_options.tsx b/src/plugins/data/public/ui/filter_bar/filter_options.tsx index a1fa382f8c8d..0865f09864dd 100644 --- a/src/plugins/data/public/ui/filter_bar/filter_options.tsx +++ b/src/plugins/data/public/ui/filter_bar/filter_options.tsx @@ -177,7 +177,6 @@ class FilterOptionsUI extends Component { } anchorPosition="rightUp" panelPaddingSize="none" - withTitle repositionOnScroll > diff --git a/src/plugins/data/public/ui/query_string_input/_query_bar.scss b/src/plugins/data/public/ui/query_string_input/_query_bar.scss index 240e92be5141..2531b44cbe0a 100644 --- a/src/plugins/data/public/ui/query_string_input/_query_bar.scss +++ b/src/plugins/data/public/ui/query_string_input/_query_bar.scss @@ -1,3 +1,14 @@ +/* + * SPDX-License-Identifier: Apache-2.0 + * + * The OpenSearch Contributors require contributions made to + * this file be licensed under the Apache-2.0 license or a + * compatible open source license. + * + * Modifications Copyright OpenSearch Contributors. See + * GitHub history for details. + */ + .osdQueryBar__wrap { max-width: 100%; z-index: $euiZContentMenu; @@ -61,7 +72,6 @@ // sass-lint:disable-block no-important flex-grow: 0 !important; flex-basis: auto !important; - margin-right: -$euiSizeXS !important; &.osdQueryBar__datePickerWrapper-isHidden { width: 0; diff --git a/src/plugins/data/public/ui/query_string_input/language_switcher.tsx b/src/plugins/data/public/ui/query_string_input/language_switcher.tsx index ea2b70288413..816c21bc0848 100644 --- a/src/plugins/data/public/ui/query_string_input/language_switcher.tsx +++ b/src/plugins/data/public/ui/query_string_input/language_switcher.tsx @@ -87,7 +87,6 @@ export function QueryLanguageSwitcher(props: Props) { button={button} isOpen={isPopoverOpen} closePopover={() => setIsPopoverOpen(false)} - withTitle repositionOnScroll > diff --git a/src/plugins/data/public/ui/saved_query_form/save_query_form.tsx b/src/plugins/data/public/ui/saved_query_form/save_query_form.tsx index 7aeb5fc95f98..e7e7ca27424a 100644 --- a/src/plugins/data/public/ui/saved_query_form/save_query_form.tsx +++ b/src/plugins/data/public/ui/saved_query_form/save_query_form.tsx @@ -31,7 +31,6 @@ import React, { useEffect, useState, useCallback } from 'react'; import { EuiButtonEmpty, - EuiOverlayMask, EuiModal, EuiButton, EuiModalHeader, @@ -230,37 +229,35 @@ export function SaveQueryForm({ ); return ( - - - - - {i18n.translate('data.search.searchBar.savedQueryFormTitle', { - defaultMessage: 'Save query', - })} - - + + + + {i18n.translate('data.search.searchBar.savedQueryFormTitle', { + defaultMessage: 'Save query', + })} + + - {saveQueryForm} + {saveQueryForm} - - - {i18n.translate('data.search.searchBar.savedQueryFormCancelButtonText', { - defaultMessage: 'Cancel', - })} - + + + {i18n.translate('data.search.searchBar.savedQueryFormCancelButtonText', { + defaultMessage: 'Cancel', + })} + - - {i18n.translate('data.search.searchBar.savedQueryFormSaveButtonText', { - defaultMessage: 'Save', - })} - - - - + + {i18n.translate('data.search.searchBar.savedQueryFormSaveButtonText', { + defaultMessage: 'Save', + })} + + + ); } diff --git a/src/plugins/data/public/ui/saved_query_management/saved_query_list_item.tsx b/src/plugins/data/public/ui/saved_query_management/saved_query_list_item.tsx index 715166d8a833..311089440dea 100644 --- a/src/plugins/data/public/ui/saved_query_management/saved_query_list_item.tsx +++ b/src/plugins/data/public/ui/saved_query_management/saved_query_list_item.tsx @@ -28,7 +28,7 @@ * under the License. */ -import { EuiListGroupItem, EuiConfirmModal, EuiOverlayMask, EuiIconTip } from '@elastic/eui'; +import { EuiListGroupItem, EuiConfirmModal, EuiIconTip } from '@elastic/eui'; import React, { Fragment, useState } from 'react'; import classNames from 'classnames'; @@ -136,36 +136,34 @@ export const SavedQueryListItem = ({ /> {showDeletionConfirmationModal && ( - - { - onDelete(savedQuery); - setShowDeletionConfirmationModal(false); - }} - buttonColor="danger" - onCancel={() => { - setShowDeletionConfirmationModal(false); - }} - /> - + { + onDelete(savedQuery); + setShowDeletionConfirmationModal(false); + }} + buttonColor="danger" + onCancel={() => { + setShowDeletionConfirmationModal(false); + }} + /> )} ); diff --git a/src/plugins/data/public/ui/search_bar/search_bar.tsx b/src/plugins/data/public/ui/search_bar/search_bar.tsx index b05b18b6d64e..a38a49ffd7d5 100644 --- a/src/plugins/data/public/ui/search_bar/search_bar.tsx +++ b/src/plugins/data/public/ui/search_bar/search_bar.tsx @@ -32,7 +32,7 @@ import { compact } from 'lodash'; import { InjectedIntl, injectI18n } from '@osd/i18n/react'; import classNames from 'classnames'; import React, { Component } from 'react'; -import ResizeObserver from 'resize-observer-polyfill'; +import ResizeObserver from '@4lolo/resize-observer-polyfill'; import { get, isEqual } from 'lodash'; import { diff --git a/src/plugins/discover/public/application/angular/context/components/action_bar/action_bar.tsx b/src/plugins/discover/public/application/angular/context/components/action_bar/action_bar.tsx index f747a0aea000..8a4b0b308047 100644 --- a/src/plugins/discover/public/application/angular/context/components/action_bar/action_bar.tsx +++ b/src/plugins/discover/public/application/angular/context/components/action_bar/action_bar.tsx @@ -157,7 +157,7 @@ export function ActionBar({ - + {isSuccessor ? ( -