mirror of
https://github.com/elastic/kibana.git
synced 2025-04-23 17:28:26 -04:00
Closes https://github.com/elastic/kibana/issues/190446 ## Summary This PR swaps out `react-grid-layout` for the new internal `kbn-grid-layout` in the Dashboard plugin. This is the first major step in making collapsible sections possible in Dashboard. - **`react-grid-layout` (before)**: https://github.com/user-attachments/assets/ca6ec059-7f4a-43fb-890e-7b72b781e50b - **`kbn-grid-layout` (after)**: https://github.com/user-attachments/assets/3d3de1f3-1afc-4e6b-93d6-9cc31a46e2cf ### Notable Improvements - Better handling of resizing panels near the bottom of the screen | `react-grid-layout` | `kbn-grid-layout` | |--------|--------| |  |  | - Auto-scroll when dragging / resizing panels near the top and bottom of the screen, making it much easier to move panels around by larger distances | `react-grid-layout` | `kbn-grid-layout` | |--------|--------| |  |  | - More reliable panel positioning due to the use of CSS grid rather than absolute positioning via pixels | `react-grid-layout` | `kbn-grid-layout` | |--------|--------| |  |  | - Better performance when dragging and resizing (see https://github.com/elastic/kibana/pull/204134 for a more thorough explanation) and a smaller bundle size than `react-grid-layout` ### 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 - [x] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) ### Identify risks This PR contains a significant change to the Dashboard layout engine, which means that it carries a decent amount of risk for introducing new, uncaught bugs with dragging / resizing panels and collision resolution. That being said, `kbn-grid-layout` has been built **iteratively** with plenty of testing along the way to reduce this risk. ## Release note Improves Dashboard layout engine by switching to the internally developed `kbn-grid-layout`. --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Marta Bondyra <4283304+mbondyra@users.noreply.github.com> |
||
---|---|---|
.. | ||
content_management_examples | ||
controls_example | ||
data_view_field_editor_example | ||
developer_examples | ||
discover_customization_examples | ||
embeddable_examples | ||
error_boundary | ||
eso_model_version_example | ||
esql_ast_inspector | ||
esql_validation_example | ||
expressions_explorer | ||
feature_control_examples | ||
feature_flags_example | ||
field_formats_example | ||
files_example | ||
grid_example | ||
guided_onboarding_example | ||
hello_world | ||
locator_examples | ||
locator_explorer | ||
partial_results_example | ||
portable_dashboards_example | ||
preboot_example | ||
resizable_layout_examples | ||
response_stream | ||
routing_example | ||
screenshot_mode_example | ||
search_examples | ||
share_examples | ||
state_containers_examples | ||
ui_action_examples | ||
ui_actions_explorer | ||
unified_doc_viewer | ||
unified_field_list_examples | ||
user_profile_examples | ||
v8_profiler_examples | ||
README.asciidoc |
[[example-plugins]] == Example plugins This folder contains example plugins. To run the plugins in this folder, use the `--run-examples` flag (without a basepath), via [source,bash] ---- yarn start --run-examples ----