mirror of
https://github.com/elastic/kibana.git
synced 2025-04-19 15:35:00 -04:00
748d54ba91
- Closes https://github.com/elastic/kibana/issues/214554 ## Summary This PR: - adds TabPreview component, which is visible when you hover over a particular tab - adds tests for TabPreview component About TabPreview component - EUI doesn't have a component, which would suit for our needs, hence a custom component activated on hover - TabPreview should activate (with 500ms of delay) after hovering over a whole tab - It should hide when we click action button in the tab or we open editing name mode - It shouldn't appear on hover when we have tab context menu open or we're editing a title - For now the data inside is mocked (besides of title), so you can see random queries and statuses each time you hover over the tab - Preview should not overflow the screen if there are a lot of tabs and they're "touching" right side of the screen https://github.com/user-attachments/assets/da0a47dd-b594-4c20-b76c-49e6889f3814 ## Testing Two options are possible: 1. start Storybook with `yarn storybook unified_tabs` and navigate to `http://localhost:9001`. 2. start Kibana with `yarn start --run-examples`. Then navigate to the Unified Tabs example plugin `http://localhost:5601/app/unifiedTabsExamples`. ### Checklist - [x] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios --------- Co-authored-by: Julia Rechkunova <julia.rechkunova@elastic.co> Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com> |
||
|---|---|---|
| .. | ||
| common | ||
| public | ||
| kibana.jsonc | ||
| README.md | ||
| tsconfig.json | ||
unified_tabs_examples
Examples of unified tabs components.
To run this example, ensure you have data to search against (for example, the sample datasets) and start kibana with the --run-examples flag.
yarn start --run-examples