…d-layout` (elastic#205341)

Closes elastic#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` |
  |--------|--------|
| ![Jan-09-2025
09-59-00](https://github.com/user-attachments/assets/75854b76-3ad7-4f06-9745-b03bde15f87a)
| ![Jan-09-2025
09-26-24](https://github.com/user-attachments/assets/f0fbc0bf-9208-4866-b7eb-988c7abc3e50)
|

- 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` |
  |--------|--------|
| ![Jan-09-2025
10-01-30](https://github.com/user-attachments/assets/e3457e5e-3647-4024-b6e6-c594d6d3e1d7)
| ![Jan-09-2025
09-25-35](https://github.com/user-attachments/assets/3252bdec-2bbc-4793-b089-346866d4589b)
|

- More reliable panel positioning due to the use of CSS grid rather than
absolute positioning via pixels

  | `react-grid-layout` | `kbn-grid-layout` |
  |--------|--------|
| ![Screenshot 2025-01-09 at 9 32
52 AM](https://github.com/user-attachments/assets/06bd31a4-0a9f-4561-84c3-4cd96ba297b0)
| ![Screenshot 2025-01-09 at 9 35
14 AM](https://github.com/user-attachments/assets/573dab98-3fb9-4ef6-9f37-c4cf4d03ce52)
|

- Better performance when dragging and resizing (see
elastic#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>
(cherry picked from commit 6865715)

# Conflicts:
#	packages/kbn-grid-layout/grid/grid_panel/resize_handle.tsx
#	packages/kbn-grid-layout/grid/grid_row/grid_row.tsx
#	packages/kbn-grid-layout/grid/use_grid_layout_state.ts

…bn-grid-layout` (#205341) (#206693)

# Backport

This will backport the following commits from `main` to `8.x`:
- [[Dashboard][Collapsable Panels] Swap `react-grid-layout` for
`kbn-grid-layout`
(#205341)](#205341)

<!--- Backport version: 8.9.8 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Hannah
Mudge","email":"Heenawter@users.noreply.github.com"},"sourceCommit":{"committedDate":"2025-01-14T21:51:14Z","message":"[Dashboard][Collapsable
Panels] Swap `react-grid-layout` for `kbn-grid-layout`
(#205341)\n\nCloses
https://github.com/elastic/kibana/issues/190446\r\n\r\n##
Summary\r\n\r\nThis PR swaps out `react-grid-layout` for the new
internal\r\n`kbn-grid-layout` in the Dashboard plugin. This is the first
major step\r\nin making collapsible sections possible in
Dashboard.\r\n\r\n- **`react-grid-layout`
(before)**:\r\n\r\n\r\nhttps://github.com/user-attachments/assets/ca6ec059-7f4a-43fb-890e-7b72b781e50b\r\n\r\n-
**`kbn-grid-layout`
(after)**:\r\n\r\n\r\nhttps://github.com/user-attachments/assets/3d3de1f3-1afc-4e6b-93d6-9cc31a46e2cf\r\n\r\n###
Notable Improvements\r\n\r\n- Better handling of resizing panels near
the bottom of the screen\r\n \r\n | `react-grid-layout` |
`kbn-grid-layout` |\r\n |--------|--------|\r\n|
![Jan-09-2025\r\n09-59-00](https://github.com/user-attachments/assets/75854b76-3ad7-4f06-9745-b03bde15f87a)\r\n|
![Jan-09-2025\r\n09-26-24](https://github.com/user-attachments/assets/f0fbc0bf-9208-4866-b7eb-988c7abc3e50)\r\n|\r\n\r\n\r\n-
Auto-scroll when dragging / resizing panels near the top and bottom
of\r\nthe screen, making it much easier to move panels around by
larger\r\ndistances\r\n\r\n | `react-grid-layout` | `kbn-grid-layout`
|\r\n |--------|--------|\r\n|
![Jan-09-2025\r\n10-01-30](https://github.com/user-attachments/assets/e3457e5e-3647-4024-b6e6-c594d6d3e1d7)\r\n|
![Jan-09-2025\r\n09-25-35](https://github.com/user-attachments/assets/3252bdec-2bbc-4793-b089-346866d4589b)\r\n|\r\n\r\n-
More reliable panel positioning due to the use of CSS grid rather
than\r\nabsolute positioning via pixels\r\n\r\n | `react-grid-layout` |
`kbn-grid-layout` |\r\n |--------|--------|\r\n| ![Screenshot 2025-01-09
at 9
32\r\n52 AM](https://github.com/user-attachments/assets/06bd31a4-0a9f-4561-84c3-4cd96ba297b0)\r\n|
![Screenshot 2025-01-09 at 9
35\r\n14 AM](https://github.com/user-attachments/assets/573dab98-3fb9-4ef6-9f37-c4cf4d03ce52)\r\n|\r\n\r\n-
Better performance when dragging and resizing
(see\r\nhttps://github.com//pull/204134 for a more
thorough\r\nexplanation) and a smaller bundle size than
`react-grid-layout`\r\n\r\n### Checklist\r\n\r\n- [x] [Unit or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated or added to match the most common scenarios\r\n- [x] The PR
description includes the appropriate Release Notes section,\r\nand the
correct `release_note:*` label is applied per
the\r\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\r\n\r\n###
Identify risks\r\n\r\nThis PR contains a significant change to the
Dashboard layout engine,\r\nwhich means that it carries a decent amount
of risk for introducing new,\r\nuncaught bugs with dragging / resizing
panels and collision resolution.\r\nThat being said, `kbn-grid-layout`
has been built **iteratively** with\r\nplenty of testing along the way
to reduce this risk.\r\n\r\n## Release note\r\nImproves Dashboard layout
engine by switching to the internally\r\ndeveloped
`kbn-grid-layout`.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>\r\nCo-authored-by:
Marta Bondyra
<4283304+mbondyra@users.noreply.github.com>","sha":"686571547f82f097d589776733e165466ec518ad","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Dashboard","Team:Presentation","loe:large","impact:critical","v9.0.0","release_note:feature","backport:prev-minor"],"number":205341,"url":"https://github.com/elastic/kibana/pull/205341","mergeCommit":{"message":"[Dashboard][Collapsable
Panels] Swap `react-grid-layout` for `kbn-grid-layout`
(#205341)\n\nCloses
https://github.com/elastic/kibana/issues/190446\r\n\r\n##
Summary\r\n\r\nThis PR swaps out `react-grid-layout` for the new
internal\r\n`kbn-grid-layout` in the Dashboard plugin. This is the first
major step\r\nin making collapsible sections possible in
Dashboard.\r\n\r\n- **`react-grid-layout`
(before)**:\r\n\r\n\r\nhttps://github.com/user-attachments/assets/ca6ec059-7f4a-43fb-890e-7b72b781e50b\r\n\r\n-
**`kbn-grid-layout`
(after)**:\r\n\r\n\r\nhttps://github.com/user-attachments/assets/3d3de1f3-1afc-4e6b-93d6-9cc31a46e2cf\r\n\r\n###
Notable Improvements\r\n\r\n- Better handling of resizing panels near
the bottom of the screen\r\n \r\n | `react-grid-layout` |
`kbn-grid-layout` |\r\n |--------|--------|\r\n|
![Jan-09-2025\r\n09-59-00](https://github.com/user-attachments/assets/75854b76-3ad7-4f06-9745-b03bde15f87a)\r\n|
![Jan-09-2025\r\n09-26-24](https://github.com/user-attachments/assets/f0fbc0bf-9208-4866-b7eb-988c7abc3e50)\r\n|\r\n\r\n\r\n-
Auto-scroll when dragging / resizing panels near the top and bottom
of\r\nthe screen, making it much easier to move panels around by
larger\r\ndistances\r\n\r\n | `react-grid-layout` | `kbn-grid-layout`
|\r\n |--------|--------|\r\n|
![Jan-09-2025\r\n10-01-30](https://github.com/user-attachments/assets/e3457e5e-3647-4024-b6e6-c594d6d3e1d7)\r\n|
![Jan-09-2025\r\n09-25-35](https://github.com/user-attachments/assets/3252bdec-2bbc-4793-b089-346866d4589b)\r\n|\r\n\r\n-
More reliable panel positioning due to the use of CSS grid rather
than\r\nabsolute positioning via pixels\r\n\r\n | `react-grid-layout` |
`kbn-grid-layout` |\r\n |--------|--------|\r\n| ![Screenshot 2025-01-09
at 9
32\r\n52 AM](https://github.com/user-attachments/assets/06bd31a4-0a9f-4561-84c3-4cd96ba297b0)\r\n|
![Screenshot 2025-01-09 at 9
35\r\n14 AM](https://github.com/user-attachments/assets/573dab98-3fb9-4ef6-9f37-c4cf4d03ce52)\r\n|\r\n\r\n-
Better performance when dragging and resizing
(see\r\nhttps://github.com//pull/204134 for a more
thorough\r\nexplanation) and a smaller bundle size than
`react-grid-layout`\r\n\r\n### Checklist\r\n\r\n- [x] [Unit or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated or added to match the most common scenarios\r\n- [x] The PR
description includes the appropriate Release Notes section,\r\nand the
correct `release_note:*` label is applied per
the\r\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\r\n\r\n###
Identify risks\r\n\r\nThis PR contains a significant change to the
Dashboard layout engine,\r\nwhich means that it carries a decent amount
of risk for introducing new,\r\nuncaught bugs with dragging / resizing
panels and collision resolution.\r\nThat being said, `kbn-grid-layout`
has been built **iteratively** with\r\nplenty of testing along the way
to reduce this risk.\r\n\r\n## Release note\r\nImproves Dashboard layout
engine by switching to the internally\r\ndeveloped
`kbn-grid-layout`.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>\r\nCo-authored-by:
Marta Bondyra
<4283304+mbondyra@users.noreply.github.com>","sha":"686571547f82f097d589776733e165466ec518ad"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","labelRegex":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/205341","number":205341,"mergeCommit":{"message":"[Dashboard][Collapsable
Panels] Swap `react-grid-layout` for `kbn-grid-layout`
(#205341)\n\nCloses
https://github.com/elastic/kibana/issues/190446\r\n\r\n##
Summary\r\n\r\nThis PR swaps out `react-grid-layout` for the new
internal\r\n`kbn-grid-layout` in the Dashboard plugin. This is the first
major step\r\nin making collapsible sections possible in
Dashboard.\r\n\r\n- **`react-grid-layout`
(before)**:\r\n\r\n\r\nhttps://github.com/user-attachments/assets/ca6ec059-7f4a-43fb-890e-7b72b781e50b\r\n\r\n-
**`kbn-grid-layout`
(after)**:\r\n\r\n\r\nhttps://github.com/user-attachments/assets/3d3de1f3-1afc-4e6b-93d6-9cc31a46e2cf\r\n\r\n###
Notable Improvements\r\n\r\n- Better handling of resizing panels near
the bottom of the screen\r\n \r\n | `react-grid-layout` |
`kbn-grid-layout` |\r\n |--------|--------|\r\n|
![Jan-09-2025\r\n09-59-00](https://github.com/user-attachments/assets/75854b76-3ad7-4f06-9745-b03bde15f87a)\r\n|
![Jan-09-2025\r\n09-26-24](https://github.com/user-attachments/assets/f0fbc0bf-9208-4866-b7eb-988c7abc3e50)\r\n|\r\n\r\n\r\n-
Auto-scroll when dragging / resizing panels near the top and bottom
of\r\nthe screen, making it much easier to move panels around by
larger\r\ndistances\r\n\r\n | `react-grid-layout` | `kbn-grid-layout`
|\r\n |--------|--------|\r\n|
![Jan-09-2025\r\n10-01-30](https://github.com/user-attachments/assets/e3457e5e-3647-4024-b6e6-c594d6d3e1d7)\r\n|
![Jan-09-2025\r\n09-25-35](https://github.com/user-attachments/assets/3252bdec-2bbc-4793-b089-346866d4589b)\r\n|\r\n\r\n-
More reliable panel positioning due to the use of CSS grid rather
than\r\nabsolute positioning via pixels\r\n\r\n | `react-grid-layout` |
`kbn-grid-layout` |\r\n |--------|--------|\r\n| ![Screenshot 2025-01-09
at 9
32\r\n52 AM](https://github.com/user-attachments/assets/06bd31a4-0a9f-4561-84c3-4cd96ba297b0)\r\n|
![Screenshot 2025-01-09 at 9
35\r\n14 AM](https://github.com/user-attachments/assets/573dab98-3fb9-4ef6-9f37-c4cf4d03ce52)\r\n|\r\n\r\n-
Better performance when dragging and resizing
(see\r\nhttps://github.com//pull/204134 for a more
thorough\r\nexplanation) and a smaller bundle size than
`react-grid-layout`\r\n\r\n### Checklist\r\n\r\n- [x] [Unit or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated or added to match the most common scenarios\r\n- [x] The PR
description includes the appropriate Release Notes section,\r\nand the
correct `release_note:*` label is applied per
the\r\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\r\n\r\n###
Identify risks\r\n\r\nThis PR contains a significant change to the
Dashboard layout engine,\r\nwhich means that it carries a decent amount
of risk for introducing new,\r\nuncaught bugs with dragging / resizing
panels and collision resolution.\r\nThat being said, `kbn-grid-layout`
has been built **iteratively** with\r\nplenty of testing along the way
to reduce this risk.\r\n\r\n## Release note\r\nImproves Dashboard layout
engine by switching to the internally\r\ndeveloped
`kbn-grid-layout`.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>\r\nCo-authored-by:
Marta Bondyra
<4283304+mbondyra@users.noreply.github.com>","sha":"686571547f82f097d589776733e165466ec518ad"}}]}]
BACKPORT-->

Closes #205639

## Summary

Now that #205341 is merged, we can
remove both `react-grid-layout` and `react-resizable` since they are no
longer used in Dashboard (and Dashboard was the only consumer, so they
are no longer used anywhere in Kibana).

### Checklist

- [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
 
There are no risks to removing an unused dependency.

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>

Closes elastic#205639

## Summary

Now that elastic#205341 is merged, we can
remove both `react-grid-layout` and `react-resizable` since they are no
longer used in Dashboard (and Dashboard was the only consumer, so they
are no longer used anywhere in Kibana).

### Checklist

- [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

There are no risks to removing an unused dependency.

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
(cherry picked from commit 364abf7)

# Conflicts:
#	renovate.json

# Backport

This will backport the following commits from `main` to `8.x`:
- [[Presentation] Remove unused dependencies
(#206689)](#206689)

<!--- Backport version: 9.6.4 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Hannah
Mudge","email":"Heenawter@users.noreply.github.com"},"sourceCommit":{"committedDate":"2025-01-15T15:54:54Z","message":"[Presentation]
Remove unused dependencies (#206689)\n\nCloses
https://github.com/elastic/kibana/issues/205639\r\n\r\n##
Summary\r\n\r\nNow that #205341 is
merged, we can\r\nremove both `react-grid-layout` and `react-resizable`
since they are no\r\nlonger used in Dashboard (and Dashboard was the
only consumer, so they\r\nare no longer used anywhere in
Kibana).\r\n\r\n### Checklist\r\n\r\n- [x] The PR description includes
the appropriate Release Notes section,\r\nand the correct
`release_note:*` label is applied per
the\r\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\r\n\r\n###
Identify risks\r\n \r\nThere are no risks to removing an unused
dependency.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"364abf7b09f55f33e84d2f9b635715fc4de9fd92","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Team:Presentation","loe:small","release_note:skip","impact:medium","dependencies","v9.0.0","backport:prev-minor"],"title":"[Presentation]
Remove unused
dependencies","number":206689,"url":"https://github.com/elastic/kibana/pull/206689","mergeCommit":{"message":"[Presentation]
Remove unused dependencies (#206689)\n\nCloses
https://github.com/elastic/kibana/issues/205639\r\n\r\n##
Summary\r\n\r\nNow that #205341 is
merged, we can\r\nremove both `react-grid-layout` and `react-resizable`
since they are no\r\nlonger used in Dashboard (and Dashboard was the
only consumer, so they\r\nare no longer used anywhere in
Kibana).\r\n\r\n### Checklist\r\n\r\n- [x] The PR description includes
the appropriate Release Notes section,\r\nand the correct
`release_note:*` label is applied per
the\r\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\r\n\r\n###
Identify risks\r\n \r\nThere are no risks to removing an unused
dependency.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"364abf7b09f55f33e84d2f9b635715fc4de9fd92"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/206689","number":206689,"mergeCommit":{"message":"[Presentation]
Remove unused dependencies (#206689)\n\nCloses
https://github.com/elastic/kibana/issues/205639\r\n\r\n##
Summary\r\n\r\nNow that #205341 is
merged, we can\r\nremove both `react-grid-layout` and `react-resizable`
since they are no\r\nlonger used in Dashboard (and Dashboard was the
only consumer, so they\r\nare no longer used anywhere in
Kibana).\r\n\r\n### Checklist\r\n\r\n- [x] The PR description includes
the appropriate Release Notes section,\r\nand the correct
`release_note:*` label is applied per
the\r\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\r\n\r\n###
Identify risks\r\n \r\nThere are no risks to removing an unused
dependency.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"364abf7b09f55f33e84d2f9b635715fc4de9fd92"}}]}]
BACKPORT-->

…`kbn-grid-layout` (elastic#205341)"

This reverts commit 6865715.

…reen (#206991)

#205341 removed
`dshDashboardViewportWrapper--isFullscreen` from
"src/platform/plugins/shared/dashboard/public/dashboard_container/component/viewport/_dashboard_viewport.scss".
The PR failed to remove the class from rendered DOM.

…reen (elastic#206991)

elastic#205341 removed
`dshDashboardViewportWrapper--isFullscreen` from
"src/platform/plugins/shared/dashboard/public/dashboard_container/component/viewport/_dashboard_viewport.scss".
The PR failed to remove the class from rendered DOM.

(cherry picked from commit 47226c9)

…Fullscreen (#206991) (#207003)

# Backport

This will backport the following commits from `main` to `8.x`:
- [[dashboard] remove unused class
dshDashboardViewportWrapper--isFullscreen
(#206991)](#206991)

<!--- Backport version: 9.4.3 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Nathan
Reese","email":"reese.nathan@elastic.co"},"sourceCommit":{"committedDate":"2025-01-16T19:52:16Z","message":"[dashboard]
remove unused class dshDashboardViewportWrapper--isFullscreen
(#206991)\n\nhttps://github.com//pull/205341
removed\r\n`dshDashboardViewportWrapper--isFullscreen`
from\r\n\"src/platform/plugins/shared/dashboard/public/dashboard_container/component/viewport/_dashboard_viewport.scss\".\r\nThe
PR failed to remove the class from rendered
DOM.","sha":"47226c998682a2f04ce11ee6b4ab30d401bbd18f","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Team:Presentation","release_note:skip","v9.0.0","backport:version","v8.18.0"],"title":"[dashboard]
remove unused class
dshDashboardViewportWrapper--isFullscreen","number":206991,"url":"https://github.com/elastic/kibana/pull/206991","mergeCommit":{"message":"[dashboard]
remove unused class dshDashboardViewportWrapper--isFullscreen
(#206991)\n\nhttps://github.com//pull/205341
removed\r\n`dshDashboardViewportWrapper--isFullscreen`
from\r\n\"src/platform/plugins/shared/dashboard/public/dashboard_container/component/viewport/_dashboard_viewport.scss\".\r\nThe
PR failed to remove the class from rendered
DOM.","sha":"47226c998682a2f04ce11ee6b4ab30d401bbd18f"}},"sourceBranch":"main","suggestedTargetBranches":["8.x"],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/206991","number":206991,"mergeCommit":{"message":"[dashboard]
remove unused class dshDashboardViewportWrapper--isFullscreen
(#206991)\n\nhttps://github.com//pull/205341
removed\r\n`dshDashboardViewportWrapper--isFullscreen`
from\r\n\"src/platform/plugins/shared/dashboard/public/dashboard_container/component/viewport/_dashboard_viewport.scss\".\r\nThe
PR failed to remove the class from rendered
DOM.","sha":"47226c998682a2f04ce11ee6b4ab30d401bbd18f"}},{"branch":"8.x","label":"v8.18.0","branchLabelMappingKey":"^v8.18.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: Nathan Reese <reese.nathan@elastic.co>

…d-layout` (elastic#205341)

Closes elastic#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` |
  |--------|--------|
| ![Jan-09-2025
09-59-00](https://github.com/user-attachments/assets/75854b76-3ad7-4f06-9745-b03bde15f87a)
| ![Jan-09-2025
09-26-24](https://github.com/user-attachments/assets/f0fbc0bf-9208-4866-b7eb-988c7abc3e50)
|


- 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` |
  |--------|--------|
| ![Jan-09-2025
10-01-30](https://github.com/user-attachments/assets/e3457e5e-3647-4024-b6e6-c594d6d3e1d7)
| ![Jan-09-2025
09-25-35](https://github.com/user-attachments/assets/3252bdec-2bbc-4793-b089-346866d4589b)
|

- More reliable panel positioning due to the use of CSS grid rather than
absolute positioning via pixels

  | `react-grid-layout` | `kbn-grid-layout` |
  |--------|--------|
| ![Screenshot 2025-01-09 at 9 32
52 AM](https://github.com/user-attachments/assets/06bd31a4-0a9f-4561-84c3-4cd96ba297b0)
| ![Screenshot 2025-01-09 at 9 35
14 AM](https://github.com/user-attachments/assets/573dab98-3fb9-4ef6-9f37-c4cf4d03ce52)
|

- Better performance when dragging and resizing (see
elastic#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>

Closes elastic#205639

## Summary

Now that elastic#205341 is merged, we can
remove both `react-grid-layout` and `react-resizable` since they are no
longer used in Dashboard (and Dashboard was the only consumer, so they
are no longer used anywhere in Kibana).

### Checklist

- [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
 
There are no risks to removing an unused dependency.

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>

…reen (elastic#206991)

elastic#205341 removed
`dshDashboardViewportWrapper--isFullscreen` from
"src/platform/plugins/shared/dashboard/public/dashboard_container/component/viewport/_dashboard_viewport.scss".
The PR failed to remove the class from rendered DOM.

## Summary

This PR updates the Dashboards docs to reflect changes introduced with
the new `kbn-grid-layout`.

Rel: #205341,
[#614](elastic/platform-docs-team#614)

Preview: [Move and resize
panels](https://kibana_bk_215809.docs-preview.app.elstc.co/guide/en/kibana/8.x/arrange-panels.html#resizing-containers)

## Summary

This PR updates the Dashboards docs to reflect changes introduced with
the new `kbn-grid-layout`.

Rel: elastic#205341,
[elastic#614](elastic/platform-docs-team#614)

Preview: [Move and resize
panels](https://kibana_bk_215809.docs-preview.app.elstc.co/guide/en/kibana/8.x/arrange-panels.html#resizing-containers)