mirror of
https://github.com/elastic/kibana.git
synced 2025-07-02 04:53:22 -04:00
17 commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
Kibana Machine
|
76b896fbb0
|
[8.x] [kbn-grid-layout] Allow rows to be reordered (#213166) (#215217)
# Backport This will backport the following commits from `main` to `8.x`: - [[kbn-grid-layout] Allow rows to be reordered (#213166)](https://github.com/elastic/kibana/pull/213166) <!--- Backport version: 9.6.6 --> ### 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-03-19T17:12:35Z","message":"[kbn-grid-layout] Allow rows to be reordered (#213166)\n\nCloses https://github.com/elastic/kibana/issues/190381\n\n## Summary\n\nThis PR adds the ability to drag and drop rows by their headers in order\nto reorder them:\n\n\n\nIt can be a bit confusing dragging section headers around when other\nsections are expanded - it is easy to lose track of them, especially\nwhen the expanded sections are very large. I experimented with\nauto-collapsing all sections on drag, but this felt extremely\ndisorienting because you instantly lost all of your context - so, to\nimprove the UI here, I added a \"scroll to\" effect on drop like so:\n\n\n\nhttps://github.com/user-attachments/assets/0b519783-a4f5-4590-9a1c-580df66a2f66\n\nReminder that, to test this feature, you need to run Kibana with\nexamples via `yarn start --run-examples` and navigate to the grid\nexamples app via `Analytics > Developer examples > Grid Example`.\n\n### Checklist\n\n- [x] [Unit or functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere updated or added to match the most common scenarios\n- [x] The PR description includes the appropriate Release Notes section,\nand the correct `release_note:*` label is applied per the\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\n\n### Identify risks\n\nCollapsible sections are not available on Dashboard yet and so there is\nno user-facing risk to this PR.","sha":"05db9e9597ad874e6db5a6fd203a089752007b79","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Team:Presentation","loe:large","release_note:skip","impact:high","Project:Collapsable Panels","backport:version","v9.1.0","v8.19.0"],"title":"[kbn-grid-layout] Allow rows to be reordered","number":213166,"url":"https://github.com/elastic/kibana/pull/213166","mergeCommit":{"message":"[kbn-grid-layout] Allow rows to be reordered (#213166)\n\nCloses https://github.com/elastic/kibana/issues/190381\n\n## Summary\n\nThis PR adds the ability to drag and drop rows by their headers in order\nto reorder them:\n\n\n\nIt can be a bit confusing dragging section headers around when other\nsections are expanded - it is easy to lose track of them, especially\nwhen the expanded sections are very large. I experimented with\nauto-collapsing all sections on drag, but this felt extremely\ndisorienting because you instantly lost all of your context - so, to\nimprove the UI here, I added a \"scroll to\" effect on drop like so:\n\n\n\nhttps://github.com/user-attachments/assets/0b519783-a4f5-4590-9a1c-580df66a2f66\n\nReminder that, to test this feature, you need to run Kibana with\nexamples via `yarn start --run-examples` and navigate to the grid\nexamples app via `Analytics > Developer examples > Grid Example`.\n\n### Checklist\n\n- [x] [Unit or functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere updated or added to match the most common scenarios\n- [x] The PR description includes the appropriate Release Notes section,\nand the correct `release_note:*` label is applied per the\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\n\n### Identify risks\n\nCollapsible sections are not available on Dashboard yet and so there is\nno user-facing risk to this PR.","sha":"05db9e9597ad874e6db5a6fd203a089752007b79"}},"sourceBranch":"main","suggestedTargetBranches":["8.x"],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/213166","number":213166,"mergeCommit":{"message":"[kbn-grid-layout] Allow rows to be reordered (#213166)\n\nCloses https://github.com/elastic/kibana/issues/190381\n\n## Summary\n\nThis PR adds the ability to drag and drop rows by their headers in order\nto reorder them:\n\n\n\nIt can be a bit confusing dragging section headers around when other\nsections are expanded - it is easy to lose track of them, especially\nwhen the expanded sections are very large. I experimented with\nauto-collapsing all sections on drag, but this felt extremely\ndisorienting because you instantly lost all of your context - so, to\nimprove the UI here, I added a \"scroll to\" effect on drop like so:\n\n\n\nhttps://github.com/user-attachments/assets/0b519783-a4f5-4590-9a1c-580df66a2f66\n\nReminder that, to test this feature, you need to run Kibana with\nexamples via `yarn start --run-examples` and navigate to the grid\nexamples app via `Analytics > Developer examples > Grid Example`.\n\n### Checklist\n\n- [x] [Unit or functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere updated or added to match the most common scenarios\n- [x] The PR description includes the appropriate Release Notes section,\nand the correct `release_note:*` label is applied per the\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\n\n### Identify risks\n\nCollapsible sections are not available on Dashboard yet and so there is\nno user-facing risk to this PR.","sha":"05db9e9597ad874e6db5a6fd203a089752007b79"}},{"branch":"8.x","label":"v8.19.0","branchLabelMappingKey":"^v8.19.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}] BACKPORT--> Co-authored-by: Hannah Mudge <Heenawter@users.noreply.github.com> |
||
|
Kibana Machine
|
4850d36455
|
[8.x] [kbn-grid-layout] Store rows in object instead of array (#212965) (#213162)
# Backport This will backport the following commits from `main` to `8.x`: - [[kbn-grid-layout] Store rows in object instead of array (#212965)](https://github.com/elastic/kibana/pull/212965) <!--- Backport version: 9.6.6 --> ### 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-03-04T20:34:39Z","message":"[kbn-grid-layout] Store rows in object instead of array (#212965)\n\nCloses https://github.com/elastic/kibana/issues/211930\n\n## Summary\n\nThis PR makes it so that `kbn-grid-layout` stores its rows as an object\n/ dictionary (`{ [key: string]: GridRowData }`) rather than an array\n(`Array<GridRowData>`). This is a prerequisite for\nhttps://github.com/elastic/kibana/issues/190381 , since it allows us to\nre-order rows without re-rendering their contents. It also means that\ndeleting a row will no longer cause the rows below it to re-render,\nsince re-rendering is now dependant on the row's **ID** rather than the\nrow's order.\n\n**Before**\n\n\n |
||
|
Kibana Machine
|
bc829efd2e
|
[8.x] [kbn-grid-layout] Add ability to create, edit, and delete rows (#209193) (#212307)
# Backport This will backport the following commits from `main` to `8.x`: - [[kbn-grid-layout] Add ability to create, edit, and delete rows (#209193)](https://github.com/elastic/kibana/pull/209193) <!--- Backport version: 9.6.6 --> ### 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-02-24T18:29:00Z","message":"[kbn-grid-layout] Add ability to create, edit, and delete rows (#209193)\n\nCloses https://github.com/elastic/kibana/issues/204849\n\n## Summary\n\nThis PR adds the ability to create, edit, and delete sections / rows to\n`kbn-grid-layout`:\n\n\n\nhttps://github.com/user-attachments/assets/4831b289-2c71-42fb-851d-0925560e233a\n\n\n\nNote that sections are still statically placed - dragging rows around\nwill be added in a follow-up PR, because it's a larger undertaking.\nSince this feature is not available to users yet, it is okay to\nimplement this in stages like this.\n\n### Checklist\n\n- [x] Any text added follows [EUI's writing\nguidelines](https://elastic.github.io/eui/#/guidelines/writing), uses\nsentence case text and includes [i18n\nsupport](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)\n- [x] [Unit or functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere updated or added to match the most common scenarios\n- [x] The PR description includes the appropriate Release Notes section,\nand the correct `release_note:*` label is applied per the\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\n\n### Identify risks\n\nCollapsible sections are not available on Dashboard yet and so there is\nno user-facing risk to this PR.\n\n---------\n\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>\nCo-authored-by: Marta Bondyra <4283304+mbondyra@users.noreply.github.com>","sha":"e587187ffcf14bb92d4d30cacbdc13d9380e4025","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Team:Presentation","loe:large","release_note:skip","impact:high","Project:Collapsable Panels","backport:version","v9.1.0","v8.19.0"],"title":"[kbn-grid-layout] Add ability to create, edit, and delete rows","number":209193,"url":"https://github.com/elastic/kibana/pull/209193","mergeCommit":{"message":"[kbn-grid-layout] Add ability to create, edit, and delete rows (#209193)\n\nCloses https://github.com/elastic/kibana/issues/204849\n\n## Summary\n\nThis PR adds the ability to create, edit, and delete sections / rows to\n`kbn-grid-layout`:\n\n\n\nhttps://github.com/user-attachments/assets/4831b289-2c71-42fb-851d-0925560e233a\n\n\n\nNote that sections are still statically placed - dragging rows around\nwill be added in a follow-up PR, because it's a larger undertaking.\nSince this feature is not available to users yet, it is okay to\nimplement this in stages like this.\n\n### Checklist\n\n- [x] Any text added follows [EUI's writing\nguidelines](https://elastic.github.io/eui/#/guidelines/writing), uses\nsentence case text and includes [i18n\nsupport](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)\n- [x] [Unit or functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere updated or added to match the most common scenarios\n- [x] The PR description includes the appropriate Release Notes section,\nand the correct `release_note:*` label is applied per the\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\n\n### Identify risks\n\nCollapsible sections are not available on Dashboard yet and so there is\nno user-facing risk to this PR.\n\n---------\n\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>\nCo-authored-by: Marta Bondyra <4283304+mbondyra@users.noreply.github.com>","sha":"e587187ffcf14bb92d4d30cacbdc13d9380e4025"}},"sourceBranch":"main","suggestedTargetBranches":["8.x"],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/209193","number":209193,"mergeCommit":{"message":"[kbn-grid-layout] Add ability to create, edit, and delete rows (#209193)\n\nCloses https://github.com/elastic/kibana/issues/204849\n\n## Summary\n\nThis PR adds the ability to create, edit, and delete sections / rows to\n`kbn-grid-layout`:\n\n\n\nhttps://github.com/user-attachments/assets/4831b289-2c71-42fb-851d-0925560e233a\n\n\n\nNote that sections are still statically placed - dragging rows around\nwill be added in a follow-up PR, because it's a larger undertaking.\nSince this feature is not available to users yet, it is okay to\nimplement this in stages like this.\n\n### Checklist\n\n- [x] Any text added follows [EUI's writing\nguidelines](https://elastic.github.io/eui/#/guidelines/writing), uses\nsentence case text and includes [i18n\nsupport](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)\n- [x] [Unit or functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere updated or added to match the most common scenarios\n- [x] The PR description includes the appropriate Release Notes section,\nand the correct `release_note:*` label is applied per the\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\n\n### Identify risks\n\nCollapsible sections are not available on Dashboard yet and so there is\nno user-facing risk to this PR.\n\n---------\n\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>\nCo-authored-by: Marta Bondyra <4283304+mbondyra@users.noreply.github.com>","sha":"e587187ffcf14bb92d4d30cacbdc13d9380e4025"}},{"branch":"8.x","label":"v8.19.0","branchLabelMappingKey":"^v8.19.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}] BACKPORT--> Co-authored-by: Hannah Mudge <Heenawter@users.noreply.github.com> |
||
|
Kibana Machine
|
b3ed78406c
|
[8.x] [kbn-grid-layout] Add `useCustomDragHandle` prop (#210463) (#211115)
# Backport This will backport the following commits from `main` to `8.x`: - [[kbn-grid-layout] Add `useCustomDragHandle` prop (#210463)](https://github.com/elastic/kibana/pull/210463) <!--- Backport version: 9.4.3 --> ### 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-02-13T22:18:00Z","message":"[kbn-grid-layout] Add `useCustomDragHandle` prop (#210463)\n\nThis PR **might** resolve\r\nhttps://github.com/elastic/kibana/issues/207011 but we will need time\r\nfor the telemetry metrics to settle before we know for sure.\r\n\r\n## Summary\r\n\r\nThis PR removes the conditional rendering of the default drag handle in\r\n`kbn-grid-layout`, which has two benefits:\r\n\r\n1. It removes the double render of `GridPanel` that was caused by\r\nrelying on the `dragHandleCount` to be updated in order to determine\r\nwhether the default drag handle should be rendered\r\n2. The default drag handle no longer \"flashes\" when Dashboards are\r\nloading and waiting for `dragHandleCount` to update\r\n \r\n - **Before:**\r\n \r\n\r\nhttps://github.com/user-attachments/assets/30a032fc-4df3-42ce-9494-dd7f69637c03\r\n \r\n - **After:**\r\n \r\n\r\nhttps://github.com/user-attachments/assets/db447911-cbe2-40dd-9a07-405d1e35a75d\r\n\r\n\r\nInstead, the consumer of `kbn-grid-layout` is responsible for setting\r\nthe `useCustomDragHandle` prop to `true` when they want to use a drag\r\nhandle other than the default one.\r\n\r\n\r\nWhen adding the `useCustomDragHandle` prop, I got annoyed that I had to\r\npass this prop all the way down to `grid_panel` - so I decided to swap\r\nto using React context in this PR, as well. The API for the grid layout\r\ncomponent will most likely continue to grow, so this should make it\r\neasier to manage the props.\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)","sha":"200922a5124d20c2d7ff6826a2c62a36befaa56c","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Dashboard","release_note:fix","Team:Presentation","loe:small","impact:high","Project:Collapsable Panels","backport:version","v9.1.0","v8.19.0"],"title":"[kbn-grid-layout] Add `useCustomDragHandle` prop","number":210463,"url":"https://github.com/elastic/kibana/pull/210463","mergeCommit":{"message":"[kbn-grid-layout] Add `useCustomDragHandle` prop (#210463)\n\nThis PR **might** resolve\r\nhttps://github.com/elastic/kibana/issues/207011 but we will need time\r\nfor the telemetry metrics to settle before we know for sure.\r\n\r\n## Summary\r\n\r\nThis PR removes the conditional rendering of the default drag handle in\r\n`kbn-grid-layout`, which has two benefits:\r\n\r\n1. It removes the double render of `GridPanel` that was caused by\r\nrelying on the `dragHandleCount` to be updated in order to determine\r\nwhether the default drag handle should be rendered\r\n2. The default drag handle no longer \"flashes\" when Dashboards are\r\nloading and waiting for `dragHandleCount` to update\r\n \r\n - **Before:**\r\n \r\n\r\nhttps://github.com/user-attachments/assets/30a032fc-4df3-42ce-9494-dd7f69637c03\r\n \r\n - **After:**\r\n \r\n\r\nhttps://github.com/user-attachments/assets/db447911-cbe2-40dd-9a07-405d1e35a75d\r\n\r\n\r\nInstead, the consumer of `kbn-grid-layout` is responsible for setting\r\nthe `useCustomDragHandle` prop to `true` when they want to use a drag\r\nhandle other than the default one.\r\n\r\n\r\nWhen adding the `useCustomDragHandle` prop, I got annoyed that I had to\r\npass this prop all the way down to `grid_panel` - so I decided to swap\r\nto using React context in this PR, as well. The API for the grid layout\r\ncomponent will most likely continue to grow, so this should make it\r\neasier to manage the props.\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)","sha":"200922a5124d20c2d7ff6826a2c62a36befaa56c"}},"sourceBranch":"main","suggestedTargetBranches":["8.x"],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/210463","number":210463,"mergeCommit":{"message":"[kbn-grid-layout] Add `useCustomDragHandle` prop (#210463)\n\nThis PR **might** resolve\r\nhttps://github.com/elastic/kibana/issues/207011 but we will need time\r\nfor the telemetry metrics to settle before we know for sure.\r\n\r\n## Summary\r\n\r\nThis PR removes the conditional rendering of the default drag handle in\r\n`kbn-grid-layout`, which has two benefits:\r\n\r\n1. It removes the double render of `GridPanel` that was caused by\r\nrelying on the `dragHandleCount` to be updated in order to determine\r\nwhether the default drag handle should be rendered\r\n2. The default drag handle no longer \"flashes\" when Dashboards are\r\nloading and waiting for `dragHandleCount` to update\r\n \r\n - **Before:**\r\n \r\n\r\nhttps://github.com/user-attachments/assets/30a032fc-4df3-42ce-9494-dd7f69637c03\r\n \r\n - **After:**\r\n \r\n\r\nhttps://github.com/user-attachments/assets/db447911-cbe2-40dd-9a07-405d1e35a75d\r\n\r\n\r\nInstead, the consumer of `kbn-grid-layout` is responsible for setting\r\nthe `useCustomDragHandle` prop to `true` when they want to use a drag\r\nhandle other than the default one.\r\n\r\n\r\nWhen adding the `useCustomDragHandle` prop, I got annoyed that I had to\r\npass this prop all the way down to `grid_panel` - so I decided to swap\r\nto using React context in this PR, as well. The API for the grid layout\r\ncomponent will most likely continue to grow, so this should make it\r\neasier to manage the props.\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)","sha":"200922a5124d20c2d7ff6826a2c62a36befaa56c"}},{"branch":"8.x","label":"v8.19.0","branchLabelMappingKey":"^v8.19.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}] BACKPORT--> Co-authored-by: Hannah Mudge <Heenawter@users.noreply.github.com> |
||
Nathan Reese
|
c39e129298
|
[8.x] [embeddable] make presentation interface names consistent (#205279) (#207881)
# Backport This will backport the following commits from `main` to `8.x`: - [[embeddable] make presentation interface names consistent (#205279)](https://github.com/elastic/kibana/pull/205279) <!--- Backport version: 9.6.4 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT [{"author":{"name":"Nathan Reese","email":"reese.nathan@elastic.co"},"sourceCommit":{"committedDate":"2025-01-22T16:46:01Z","message":"[embeddable] make presentation interface names consistent (#205279)\n\nPR cleans up presentation interface names for consistentency\r\n* adds `# Backport This will backport the following commits from `main` to `8.x`: - [[embeddable] make presentation interface names consistent (#205279)](https://github.com/elastic/kibana/pull/205279) <!--- Backport version: 9.6.4 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT suffix to all observables. For example, `dataLoading` =>\r\n`dataLoading# Backport This will backport the following commits from `main` to `8.x`: - [[embeddable] make presentation interface names consistent (#205279)](https://github.com/elastic/kibana/pull/205279) <!--- Backport version: 9.6.4 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT \r\n* removes `Panel` naming convention from interface names since an api\r\nmay not be a panel, an api may be a dashboard. For example,\r\n`PublisesPanelTitle` => `PublishesTitle`\r\n\r\n#### Note to Reviewers\r\nPay special attention to any place where your application creates an\r\nuntyped API. In the example below, there is no typescript violation when\r\nthe parent returns `dataLoading` instead of `dataLoading# Backport This will backport the following commits from `main` to `8.x`: - [[embeddable] make presentation interface names consistent (#205279)](https://github.com/elastic/kibana/pull/205279) <!--- Backport version: 9.6.4 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT since the\r\nparent is not typed as `PublishesDataLoading`. Please check for\r\ninstances like these.\r\n\r\n```\r\n<ReactEmbeddableRenderer\r\n getParentApi={() => {\r\n dataLoading: new BehaviorSubject()\r\n }}\r\n/>\r\n```\r\n\r\n---------\r\n\r\nCo-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"05916056cdc84c0f59392046aa4ffc7d16e083f9","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Embedding","Team:Presentation","release_note:skip","Feature:Drilldowns","v9.0.0","Team:obs-ux-infra_services","Team:obs-ux-management","project:embeddableRebuild","backport:version","v8.18.0"],"title":"[embeddable] make presentation interface names consistent","number":205279,"url":"https://github.com/elastic/kibana/pull/205279","mergeCommit":{"message":"[embeddable] make presentation interface names consistent (#205279)\n\nPR cleans up presentation interface names for consistentency\r\n* adds `# Backport This will backport the following commits from `main` to `8.x`: - [[embeddable] make presentation interface names consistent (#205279)](https://github.com/elastic/kibana/pull/205279) <!--- Backport version: 9.6.4 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT suffix to all observables. For example, `dataLoading` =>\r\n`dataLoading# Backport This will backport the following commits from `main` to `8.x`: - [[embeddable] make presentation interface names consistent (#205279)](https://github.com/elastic/kibana/pull/205279) <!--- Backport version: 9.6.4 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT \r\n* removes `Panel` naming convention from interface names since an api\r\nmay not be a panel, an api may be a dashboard. For example,\r\n`PublisesPanelTitle` => `PublishesTitle`\r\n\r\n#### Note to Reviewers\r\nPay special attention to any place where your application creates an\r\nuntyped API. In the example below, there is no typescript violation when\r\nthe parent returns `dataLoading` instead of `dataLoading# Backport This will backport the following commits from `main` to `8.x`: - [[embeddable] make presentation interface names consistent (#205279)](https://github.com/elastic/kibana/pull/205279) <!--- Backport version: 9.6.4 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT since the\r\nparent is not typed as `PublishesDataLoading`. Please check for\r\ninstances like these.\r\n\r\n```\r\n<ReactEmbeddableRenderer\r\n getParentApi={() => {\r\n dataLoading: new BehaviorSubject()\r\n }}\r\n/>\r\n```\r\n\r\n---------\r\n\r\nCo-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"05916056cdc84c0f59392046aa4ffc7d16e083f9"}},"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/205279","number":205279,"mergeCommit":{"message":"[embeddable] make presentation interface names consistent (#205279)\n\nPR cleans up presentation interface names for consistentency\r\n* adds `# Backport This will backport the following commits from `main` to `8.x`: - [[embeddable] make presentation interface names consistent (#205279)](https://github.com/elastic/kibana/pull/205279) <!--- Backport version: 9.6.4 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT suffix to all observables. For example, `dataLoading` =>\r\n`dataLoading# Backport This will backport the following commits from `main` to `8.x`: - [[embeddable] make presentation interface names consistent (#205279)](https://github.com/elastic/kibana/pull/205279) <!--- Backport version: 9.6.4 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT \r\n* removes `Panel` naming convention from interface names since an api\r\nmay not be a panel, an api may be a dashboard. For example,\r\n`PublisesPanelTitle` => `PublishesTitle`\r\n\r\n#### Note to Reviewers\r\nPay special attention to any place where your application creates an\r\nuntyped API. In the example below, there is no typescript violation when\r\nthe parent returns `dataLoading` instead of `dataLoading# Backport This will backport the following commits from `main` to `8.x`: - [[embeddable] make presentation interface names consistent (#205279)](https://github.com/elastic/kibana/pull/205279) <!--- Backport version: 9.6.4 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT since the\r\nparent is not typed as `PublishesDataLoading`. Please check for\r\ninstances like these.\r\n\r\n```\r\n<ReactEmbeddableRenderer\r\n getParentApi={() => {\r\n dataLoading: new BehaviorSubject()\r\n }}\r\n/>\r\n```\r\n\r\n---------\r\n\r\nCo-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"05916056cdc84c0f59392046aa4ffc7d16e083f9"}},{"branch":"8.x","label":"v8.18.0","branchLabelMappingKey":"^v8.18.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}] BACKPORT--> |
||
Hannah Mudge
|
b060301d45
|
[8.x] [Dashboard][kbn-grid-layout] Update styles (#206503) (#207446)
# Backport This will backport the following commits from `main` to `8.x`: - [[Dashboard][`kbn-grid-layout`] Update styles (#206503)](https://github.com/elastic/kibana/pull/206503) <!--- 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-21T19:52:39Z","message":"[Dashboard][`kbn-grid-layout`] Update styles (#206503)\n\nCloses https://github.com/elastic/kibana/issues/204060\r\n\r\n## Summary\r\n\r\nThis PR updates the styles used for `kbn-grid-layout` in Dashboard as\r\nshown below.\r\n\r\n- **Dragging**\r\n\r\n | Before | After |\r\n |--------|--------|\r\n|\r\n (#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)](https://github.com/elastic/kibana/pull/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| \r\n| \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| \r\n| \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| \r\n| \r\n|\r\n\r\n- Better performance when dragging and resizing (see\r\nhttps://github.com/elastic/kibana/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| \r\n| \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| \r\n| \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| \r\n| \r\n|\r\n\r\n- Better performance when dragging and resizing (see\r\nhttps://github.com/elastic/kibana/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| \r\n| \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| \r\n| \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| \r\n| \r\n|\r\n\r\n- Better performance when dragging and resizing (see\r\nhttps://github.com/elastic/kibana/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--> |
||
Gerard Soldevila
|
935d2e1444
|
[8.x] SKA: Categorise remaining packages (#205875) (#205973)
# Backport This will backport the following commits from `main` to `8.x`: - [SKA: Categorise remaining packages (#205875)](https://github.com/elastic/kibana/pull/205875) <!--- Backport version: 8.9.8 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport) <!--BACKPORT [{"author":{"name":"Gerard Soldevila","email":"gerard.soldevila@elastic.co"},"sourceCommit":{"committedDate":"2025-01-08T21:20:14Z","message":"SKA: Categorise remaining packages (#205875)\n\n## Summary\r\n\r\n* Delete unused package `@kbn/formatters`\r\n* Delete unused package `@kbn/response-ops-feature-flag-service`\r\n* Flag `@kbn/generate-console-definitions` as `devOnly: true`\r\n* Flag `@kbn/plugin-check` as `devOnly: true`\r\n* Flag `@kbn/set-map` as `devOnly: true`\r\n* Flag `@kbn/synthetics-private-location` as `devOnly: true`\r\n* Categorise `@kbn/calculate-auto` as `platform/shared`\r\n* Categorise `@kbn/charts-theme` as `platform/shared`\r\n* Categorise `@kbn/saved-search-component` as `platform/shared`\r\n* Categorise `@kbn/use-tracked-promise` as `platform/shared`\r\n* Categorise `@kbn/charts-theme` as `platform/shared`\r\n* Categorise `@kbn/response-ops-rule-form` as `platform/shared`","sha":"2be928c489601fac46ce1e5136ed9ecc63fd4e22","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Team:Core","release_note:skip","v9.0.0","backport:prev-minor","Team:obs-ux-management"],"number":205875,"url":"https://github.com/elastic/kibana/pull/205875","mergeCommit":{"message":"SKA: Categorise remaining packages (#205875)\n\n## Summary\r\n\r\n* Delete unused package `@kbn/formatters`\r\n* Delete unused package `@kbn/response-ops-feature-flag-service`\r\n* Flag `@kbn/generate-console-definitions` as `devOnly: true`\r\n* Flag `@kbn/plugin-check` as `devOnly: true`\r\n* Flag `@kbn/set-map` as `devOnly: true`\r\n* Flag `@kbn/synthetics-private-location` as `devOnly: true`\r\n* Categorise `@kbn/calculate-auto` as `platform/shared`\r\n* Categorise `@kbn/charts-theme` as `platform/shared`\r\n* Categorise `@kbn/saved-search-component` as `platform/shared`\r\n* Categorise `@kbn/use-tracked-promise` as `platform/shared`\r\n* Categorise `@kbn/charts-theme` as `platform/shared`\r\n* Categorise `@kbn/response-ops-rule-form` as `platform/shared`","sha":"2be928c489601fac46ce1e5136ed9ecc63fd4e22"}},"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/205875","number":205875,"mergeCommit":{"message":"SKA: Categorise remaining packages (#205875)\n\n## Summary\r\n\r\n* Delete unused package `@kbn/formatters`\r\n* Delete unused package `@kbn/response-ops-feature-flag-service`\r\n* Flag `@kbn/generate-console-definitions` as `devOnly: true`\r\n* Flag `@kbn/plugin-check` as `devOnly: true`\r\n* Flag `@kbn/set-map` as `devOnly: true`\r\n* Flag `@kbn/synthetics-private-location` as `devOnly: true`\r\n* Categorise `@kbn/calculate-auto` as `platform/shared`\r\n* Categorise `@kbn/charts-theme` as `platform/shared`\r\n* Categorise `@kbn/saved-search-component` as `platform/shared`\r\n* Categorise `@kbn/use-tracked-promise` as `platform/shared`\r\n* Categorise `@kbn/charts-theme` as `platform/shared`\r\n* Categorise `@kbn/response-ops-rule-form` as `platform/shared`","sha":"2be928c489601fac46ce1e5136ed9ecc63fd4e22"}}]}] BACKPORT--> |
||
|
Hannah Mudge
|
1ab448126b
|
[8.x] [Dashboard][Collapsable Panels] New collision resolution algorithm (#204134) (#205509)
# Backport This will backport the following commits from `main` to `8.x`: - [[Dashboard][Collapsable Panels] New collision resolution algorithm](https://github.com/elastic/kibana/pull/204134) <!--- Backport version: 8.9.8 --> |
||
|
Kibana Machine
|
6e12acb428
|
[8.x] Preparation for High Contrast Mode, Analytics Experience domains (#202608) (#204120)
# Backport This will backport the following commits from `main` to `8.x`: - [Preparation for High Contrast Mode, Analytics Experience domains (#202608)](https://github.com/elastic/kibana/pull/202608) <!--- Backport version: 9.4.3 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport) <!--BACKPORT [{"author":{"name":"Tim Sullivan","email":"tsullivan@users.noreply.github.com"},"sourceCommit":{"committedDate":"2024-12-12T19:16:07Z","message":"Preparation for High Contrast Mode, Analytics Experience domains (#202608)\n\n## Summary\r\n\r\n**Reviewers: Please test the code paths affected by this PR. See the\r\n\"Risks\" section below.**\r\n\r\nPart of work for enabling \"high contrast mode\" in Kibana. See\r\nhttps://github.com/elastic/kibana/issues/176219.\r\n\r\n**Background:**\r\nKibana will soon have a user profile setting to allow users to enable\r\n\"high contrast mode.\" This setting will activate a flag with\r\n`<EuiProvider>` that causes EUI components to render with higher\r\ncontrast visual elements. Consumer plugins and packages need to be\r\nupdated selected places where `<EuiProvider>` is wrapped, to pass the\r\n`UserProfileService` service dependency from the CoreStart contract.\r\n\r\n**NOTE:** **EUI currently does not yet support the high-contrast mode\r\nflag**, but support for that is expected to come in around 2 weeks.\r\nThese first PRs are simply preparing the code by wiring up the\r\n`UserProvideService`.\r\n\r\n### Checklist\r\n\r\nCheck the PR satisfies following conditions. \r\n\r\nReviewers should verify this PR satisfies this list as well.\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### Risks\r\n\r\nDoes this PR introduce any risks? For example, consider risks like hard\r\nto test bugs, performance regression, potential of data loss.\r\n\r\nDescribe the risk, its severity, and mitigation for each identified\r\nrisk. Invite stakeholders and evaluate how to proceed before merging.\r\n\r\n- [ ] [medium/high] The implementor of this change did not manually test\r\nthe affected code paths and relied on type-checking and functional tests\r\nto drive the changes. Code owners for this PR need to manually test the\r\naffected code paths.\r\n- [ ] [medium] The `UserProfileService` dependency comes from the\r\nCoreStart contract. If acquiring the service causes synchronous code to\r\nbecome asynchronous, check for race conditions or errors in rendering\r\nReact components. Code owners for this PR need to manually test the\r\naffected code paths.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"99aa884fa08beafd801588c0b38194ec03039008","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Team:Presentation","Team:Visualizations","release_note:skip","v9.0.0","Team:DataDiscovery","backport:prev-minor","v8.18.0"],"title":"Preparation for High Contrast Mode, Analytics Experience domains","number":202608,"url":"https://github.com/elastic/kibana/pull/202608","mergeCommit":{"message":"Preparation for High Contrast Mode, Analytics Experience domains (#202608)\n\n## Summary\r\n\r\n**Reviewers: Please test the code paths affected by this PR. See the\r\n\"Risks\" section below.**\r\n\r\nPart of work for enabling \"high contrast mode\" in Kibana. See\r\nhttps://github.com/elastic/kibana/issues/176219.\r\n\r\n**Background:**\r\nKibana will soon have a user profile setting to allow users to enable\r\n\"high contrast mode.\" This setting will activate a flag with\r\n`<EuiProvider>` that causes EUI components to render with higher\r\ncontrast visual elements. Consumer plugins and packages need to be\r\nupdated selected places where `<EuiProvider>` is wrapped, to pass the\r\n`UserProfileService` service dependency from the CoreStart contract.\r\n\r\n**NOTE:** **EUI currently does not yet support the high-contrast mode\r\nflag**, but support for that is expected to come in around 2 weeks.\r\nThese first PRs are simply preparing the code by wiring up the\r\n`UserProvideService`.\r\n\r\n### Checklist\r\n\r\nCheck the PR satisfies following conditions. \r\n\r\nReviewers should verify this PR satisfies this list as well.\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### Risks\r\n\r\nDoes this PR introduce any risks? For example, consider risks like hard\r\nto test bugs, performance regression, potential of data loss.\r\n\r\nDescribe the risk, its severity, and mitigation for each identified\r\nrisk. Invite stakeholders and evaluate how to proceed before merging.\r\n\r\n- [ ] [medium/high] The implementor of this change did not manually test\r\nthe affected code paths and relied on type-checking and functional tests\r\nto drive the changes. Code owners for this PR need to manually test the\r\naffected code paths.\r\n- [ ] [medium] The `UserProfileService` dependency comes from the\r\nCoreStart contract. If acquiring the service causes synchronous code to\r\nbecome asynchronous, check for race conditions or errors in rendering\r\nReact components. Code owners for this PR need to manually test the\r\naffected code paths.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"99aa884fa08beafd801588c0b38194ec03039008"}},"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/202608","number":202608,"mergeCommit":{"message":"Preparation for High Contrast Mode, Analytics Experience domains (#202608)\n\n## Summary\r\n\r\n**Reviewers: Please test the code paths affected by this PR. See the\r\n\"Risks\" section below.**\r\n\r\nPart of work for enabling \"high contrast mode\" in Kibana. See\r\nhttps://github.com/elastic/kibana/issues/176219.\r\n\r\n**Background:**\r\nKibana will soon have a user profile setting to allow users to enable\r\n\"high contrast mode.\" This setting will activate a flag with\r\n`<EuiProvider>` that causes EUI components to render with higher\r\ncontrast visual elements. Consumer plugins and packages need to be\r\nupdated selected places where `<EuiProvider>` is wrapped, to pass the\r\n`UserProfileService` service dependency from the CoreStart contract.\r\n\r\n**NOTE:** **EUI currently does not yet support the high-contrast mode\r\nflag**, but support for that is expected to come in around 2 weeks.\r\nThese first PRs are simply preparing the code by wiring up the\r\n`UserProvideService`.\r\n\r\n### Checklist\r\n\r\nCheck the PR satisfies following conditions. \r\n\r\nReviewers should verify this PR satisfies this list as well.\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### Risks\r\n\r\nDoes this PR introduce any risks? For example, consider risks like hard\r\nto test bugs, performance regression, potential of data loss.\r\n\r\nDescribe the risk, its severity, and mitigation for each identified\r\nrisk. Invite stakeholders and evaluate how to proceed before merging.\r\n\r\n- [ ] [medium/high] The implementor of this change did not manually test\r\nthe affected code paths and relied on type-checking and functional tests\r\nto drive the changes. Code owners for this PR need to manually test the\r\naffected code paths.\r\n- [ ] [medium] The `UserProfileService` dependency comes from the\r\nCoreStart contract. If acquiring the service causes synchronous code to\r\nbecome asynchronous, check for race conditions or errors in rendering\r\nReact components. Code owners for this PR need to manually test the\r\naffected code paths.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"99aa884fa08beafd801588c0b38194ec03039008"}},{"branch":"8.x","label":"v8.18.0","branchLabelMappingKey":"^v8.18.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}] BACKPORT--> Co-authored-by: Tim Sullivan <tsullivan@users.noreply.github.com> |
||
|
Kibana Machine
|
d223cd7df5
|
[8.x] [Dashboard] [Collapsable Panels] Add embeddable support (#198413) (#203652)
# Backport This will backport the following commits from `main` to `8.x`: - [[Dashboard] [Collapsable Panels] Add embeddable support (#198413)](https://github.com/elastic/kibana/pull/198413) <!--- Backport version: 9.4.3 --> ### 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":"2024-12-10T17:14:31Z","message":"[Dashboard] [Collapsable Panels] Add embeddable support (#198413)\n\nCloses https://github.com/elastic/kibana/issues/190379\r\n\r\n## Summary\r\n\r\nThis PR switches the example grid layout app to render embeddables as\r\npanels rather than the simplified mock panel we were using previously.\r\nIn doing so, I had to add the ability for custom panels to add a custom\r\ndrag handle via the `renderPanelContents` callback - this required\r\nadding a `setDragHandles` callback to the `ReactEmbeddableRenderer` that\r\ncould be passed down to the `PresentationPanel` component.\r\n\r\n\r\n\r\n\r\nhttps://github.com/user-attachments/assets/9e2c68f9-34af-4360-a978-9113701a5ea2\r\n\r\n\r\n\r\n#### New scroll behaviour\r\n\r\nIn https://github.com/elastic/kibana/pull/201867, I introduced a small\r\n\"ease\" to the auto-scroll effect that happens when you drag a panel to\r\nthe top or bottom of the window. However, in that PR, I was using the\r\n`smooth` scrolling behaviour, which unfortunately became **very**\r\njittery once I switched to embeddables rather than simple panels\r\n(specifically in Chrome - it worked fine in Firefox).\r\n\r\nThe only way to prevent this jittery scroll was to switch to the default\r\nscroll behaviour, but this lead to a very **abrupt** stop when the\r\nscrollbar reached the top and/or bottom of the page - so, to give the\r\nsame \"gentle\" stop that the `smooth` scroll had, I decided to recreate\r\nthis effect by adding a slow down \"ease\" when close to the top or bottom\r\nof the page:\r\n\r\n\r\nhttps://github.com/user-attachments/assets/cb7bf03f-4a9e-4446-be4f-8f54c0bc88ac\r\n\r\nThis effect is accomplished via the parabola formula `y = a(x-h)2 + k`\r\nand can be roughly visualized with the following, which shows that the\r\n\"speed up\" ease happens at a much slower pace than the \"slow down\" ease:\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n#### Notes about parent changes\r\nAs I investigated improving the efficiency of the grid layout with\r\nembeddables, one of the main things I noticed was that the grid panel\r\nwas **always** remounted when moving a panel from one collapsible\r\nsection to another. This lead me (and @ThomThomson) down a rabbit hole\r\nof React-reparenting, and we explored a few different options to see if\r\nwe could change the parent of a component **without** having it remount.\r\n\r\nIn summary, after various experiments and a whole bunch of research, we\r\ndetermined that, due to the reconciliation of the React tree, this is\r\nunfortunately impossible. So our priorities will instead have to move to\r\nmaking the remount of `ReactEmbeddableRenderer` **as efficient as\r\npossible** via caching, since the remount is inevitable.\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 this PR, since the most significant work is\r\ncontained in the `examples` plugin. Some changes were made to the\r\npresentation panel to allow for custom drag handles, but this isn't\r\nactually used in Dashboard - so for now, this code is only called in the\r\nexample plugin, as well.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"2a76fe3ee432d0b6746eae660cfe31fc71d15547","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Dashboard","Feature:Embedding","Team:Presentation","loe:medium","release_note:skip","impact:high","v9.0.0","backport:prev-minor","Project:Collapsable Panels"],"title":"[Dashboard] [Collapsable Panels] Add embeddable support","number":198413,"url":"https://github.com/elastic/kibana/pull/198413","mergeCommit":{"message":"[Dashboard] [Collapsable Panels] Add embeddable support (#198413)\n\nCloses https://github.com/elastic/kibana/issues/190379\r\n\r\n## Summary\r\n\r\nThis PR switches the example grid layout app to render embeddables as\r\npanels rather than the simplified mock panel we were using previously.\r\nIn doing so, I had to add the ability for custom panels to add a custom\r\ndrag handle via the `renderPanelContents` callback - this required\r\nadding a `setDragHandles` callback to the `ReactEmbeddableRenderer` that\r\ncould be passed down to the `PresentationPanel` component.\r\n\r\n\r\n\r\n\r\nhttps://github.com/user-attachments/assets/9e2c68f9-34af-4360-a978-9113701a5ea2\r\n\r\n\r\n\r\n#### New scroll behaviour\r\n\r\nIn https://github.com/elastic/kibana/pull/201867, I introduced a small\r\n\"ease\" to the auto-scroll effect that happens when you drag a panel to\r\nthe top or bottom of the window. However, in that PR, I was using the\r\n`smooth` scrolling behaviour, which unfortunately became **very**\r\njittery once I switched to embeddables rather than simple panels\r\n(specifically in Chrome - it worked fine in Firefox).\r\n\r\nThe only way to prevent this jittery scroll was to switch to the default\r\nscroll behaviour, but this lead to a very **abrupt** stop when the\r\nscrollbar reached the top and/or bottom of the page - so, to give the\r\nsame \"gentle\" stop that the `smooth` scroll had, I decided to recreate\r\nthis effect by adding a slow down \"ease\" when close to the top or bottom\r\nof the page:\r\n\r\n\r\nhttps://github.com/user-attachments/assets/cb7bf03f-4a9e-4446-be4f-8f54c0bc88ac\r\n\r\nThis effect is accomplished via the parabola formula `y = a(x-h)2 + k`\r\nand can be roughly visualized with the following, which shows that the\r\n\"speed up\" ease happens at a much slower pace than the \"slow down\" ease:\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n#### Notes about parent changes\r\nAs I investigated improving the efficiency of the grid layout with\r\nembeddables, one of the main things I noticed was that the grid panel\r\nwas **always** remounted when moving a panel from one collapsible\r\nsection to another. This lead me (and @ThomThomson) down a rabbit hole\r\nof React-reparenting, and we explored a few different options to see if\r\nwe could change the parent of a component **without** having it remount.\r\n\r\nIn summary, after various experiments and a whole bunch of research, we\r\ndetermined that, due to the reconciliation of the React tree, this is\r\nunfortunately impossible. So our priorities will instead have to move to\r\nmaking the remount of `ReactEmbeddableRenderer` **as efficient as\r\npossible** via caching, since the remount is inevitable.\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 this PR, since the most significant work is\r\ncontained in the `examples` plugin. Some changes were made to the\r\npresentation panel to allow for custom drag handles, but this isn't\r\nactually used in Dashboard - so for now, this code is only called in the\r\nexample plugin, as well.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"2a76fe3ee432d0b6746eae660cfe31fc71d15547"}},"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/198413","number":198413,"mergeCommit":{"message":"[Dashboard] [Collapsable Panels] Add embeddable support (#198413)\n\nCloses https://github.com/elastic/kibana/issues/190379\r\n\r\n## Summary\r\n\r\nThis PR switches the example grid layout app to render embeddables as\r\npanels rather than the simplified mock panel we were using previously.\r\nIn doing so, I had to add the ability for custom panels to add a custom\r\ndrag handle via the `renderPanelContents` callback - this required\r\nadding a `setDragHandles` callback to the `ReactEmbeddableRenderer` that\r\ncould be passed down to the `PresentationPanel` component.\r\n\r\n\r\n\r\n\r\nhttps://github.com/user-attachments/assets/9e2c68f9-34af-4360-a978-9113701a5ea2\r\n\r\n\r\n\r\n#### New scroll behaviour\r\n\r\nIn https://github.com/elastic/kibana/pull/201867, I introduced a small\r\n\"ease\" to the auto-scroll effect that happens when you drag a panel to\r\nthe top or bottom of the window. However, in that PR, I was using the\r\n`smooth` scrolling behaviour, which unfortunately became **very**\r\njittery once I switched to embeddables rather than simple panels\r\n(specifically in Chrome - it worked fine in Firefox).\r\n\r\nThe only way to prevent this jittery scroll was to switch to the default\r\nscroll behaviour, but this lead to a very **abrupt** stop when the\r\nscrollbar reached the top and/or bottom of the page - so, to give the\r\nsame \"gentle\" stop that the `smooth` scroll had, I decided to recreate\r\nthis effect by adding a slow down \"ease\" when close to the top or bottom\r\nof the page:\r\n\r\n\r\nhttps://github.com/user-attachments/assets/cb7bf03f-4a9e-4446-be4f-8f54c0bc88ac\r\n\r\nThis effect is accomplished via the parabola formula `y = a(x-h)2 + k`\r\nand can be roughly visualized with the following, which shows that the\r\n\"speed up\" ease happens at a much slower pace than the \"slow down\" ease:\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n#### Notes about parent changes\r\nAs I investigated improving the efficiency of the grid layout with\r\nembeddables, one of the main things I noticed was that the grid panel\r\nwas **always** remounted when moving a panel from one collapsible\r\nsection to another. This lead me (and @ThomThomson) down a rabbit hole\r\nof React-reparenting, and we explored a few different options to see if\r\nwe could change the parent of a component **without** having it remount.\r\n\r\nIn summary, after various experiments and a whole bunch of research, we\r\ndetermined that, due to the reconciliation of the React tree, this is\r\nunfortunately impossible. So our priorities will instead have to move to\r\nmaking the remount of `ReactEmbeddableRenderer` **as efficient as\r\npossible** via caching, since the remount is inevitable.\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 this PR, since the most significant work is\r\ncontained in the `examples` plugin. Some changes were made to the\r\npresentation panel to allow for custom drag handles, but this isn't\r\nactually used in Dashboard - so for now, this code is only called in the\r\nexample plugin, as well.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"2a76fe3ee432d0b6746eae660cfe31fc71d15547"}}]}] BACKPORT--> Co-authored-by: Hannah Mudge <Heenawter@users.noreply.github.com> |
||
|
Kibana Machine
|
d10a3ce459
|
[8.x] [Dashboard][Collapsable Panels] Responsive layout (#200771) (#202225)
# Backport This will backport the following commits from `main` to `8.x`: - [[Dashboard][Collapsable Panels] Responsive layout (#200771)](https://github.com/elastic/kibana/pull/200771) <!--- Backport version: 9.4.3 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport) <!--BACKPORT [{"author":{"name":"Marta Bondyra","email":"4283304+mbondyra@users.noreply.github.com"},"sourceCommit":{"committedDate":"2024-11-28T18:31:09Z","message":"[Dashboard][Collapsable Panels] Responsive layout (#200771)\n\n## Summary\r\n\r\nFixes https://github.com/elastic/kibana/issues/197714\r\n\r\n### Key Features\r\n\r\n#### Responsiveness\r\n\r\n1. Adds a responsive view controlled by the `accessMode` prop. \r\n2. For the responsive version (in the `VIEW` mode), panels retain height\r\nand are arranged based on screen order (left-to-right, top-to-bottom).\r\n3. Interactivity (drag/resize) is disabled in `view` mode.\r\n\r\n<img width=\"514\" alt=\"Screenshot 2024-11-25 at 17 34 56\"\r\nsrc=\"https://github.com/user-attachments/assets/6a5a97aa-de9b-495a-b1de-301bc935a5ab\">\r\n\r\n#### Maximization\r\n1. Supports expanded panel view using the `expandedPanelId` prop.\r\n2. Interactivity (drag/resize) is disabled when a panel is expanded.\r\n\r\n<img width=\"1254\" alt=\"Screenshot 2024-11-25 at 17 35 05\"\r\nsrc=\"https://github.com/user-attachments/assets/c83014f6-18ad-435b-a59d-1d3ba3f80d84\">\r\n\r\n#### Considerations\r\n1. CSS elements naming convention: Main component uses `kbnGrid` class,\r\nwith modifiers like `kbnGrid--nonInteractive`. For the drag handle of\r\n`GridPanel` I used `kbnGridPanel__dragHandle` classname.\r\n2. Classes vs. Inline Styles: I opted for using\r\n`kbnGrid--nonInteractive` instead of adding one more subscription to\r\n`GridPanel` to modify the styles inline. It's the first time in this\r\npackage that I used classes instead of inline styles for no-initial\r\nstyles setting.\r\n3. Naming Convention: I opted for using the `expanded` word to describe\r\nan expanded panel. Another one could be `maximized` as it's more used in\r\nUI, but less in the legacy code.\r\n4. Interactivity (drag/resize) is disabled in responsive mode but we\r\ncould consider to limit this to small viewports only (<768px).\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"d92aa91c3a8329057a2156ea7f1ecdc94a7a3cc2","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Team:Presentation","loe:medium","release_note:skip","v9.0.0","backport:prev-minor","Project:Collapsable Panels"],"title":"[Dashboard][Collapsable Panels] Responsive layout","number":200771,"url":"https://github.com/elastic/kibana/pull/200771","mergeCommit":{"message":"[Dashboard][Collapsable Panels] Responsive layout (#200771)\n\n## Summary\r\n\r\nFixes https://github.com/elastic/kibana/issues/197714\r\n\r\n### Key Features\r\n\r\n#### Responsiveness\r\n\r\n1. Adds a responsive view controlled by the `accessMode` prop. \r\n2. For the responsive version (in the `VIEW` mode), panels retain height\r\nand are arranged based on screen order (left-to-right, top-to-bottom).\r\n3. Interactivity (drag/resize) is disabled in `view` mode.\r\n\r\n<img width=\"514\" alt=\"Screenshot 2024-11-25 at 17 34 56\"\r\nsrc=\"https://github.com/user-attachments/assets/6a5a97aa-de9b-495a-b1de-301bc935a5ab\">\r\n\r\n#### Maximization\r\n1. Supports expanded panel view using the `expandedPanelId` prop.\r\n2. Interactivity (drag/resize) is disabled when a panel is expanded.\r\n\r\n<img width=\"1254\" alt=\"Screenshot 2024-11-25 at 17 35 05\"\r\nsrc=\"https://github.com/user-attachments/assets/c83014f6-18ad-435b-a59d-1d3ba3f80d84\">\r\n\r\n#### Considerations\r\n1. CSS elements naming convention: Main component uses `kbnGrid` class,\r\nwith modifiers like `kbnGrid--nonInteractive`. For the drag handle of\r\n`GridPanel` I used `kbnGridPanel__dragHandle` classname.\r\n2. Classes vs. Inline Styles: I opted for using\r\n`kbnGrid--nonInteractive` instead of adding one more subscription to\r\n`GridPanel` to modify the styles inline. It's the first time in this\r\npackage that I used classes instead of inline styles for no-initial\r\nstyles setting.\r\n3. Naming Convention: I opted for using the `expanded` word to describe\r\nan expanded panel. Another one could be `maximized` as it's more used in\r\nUI, but less in the legacy code.\r\n4. Interactivity (drag/resize) is disabled in responsive mode but we\r\ncould consider to limit this to small viewports only (<768px).\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"d92aa91c3a8329057a2156ea7f1ecdc94a7a3cc2"}},"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/200771","number":200771,"mergeCommit":{"message":"[Dashboard][Collapsable Panels] Responsive layout (#200771)\n\n## Summary\r\n\r\nFixes https://github.com/elastic/kibana/issues/197714\r\n\r\n### Key Features\r\n\r\n#### Responsiveness\r\n\r\n1. Adds a responsive view controlled by the `accessMode` prop. \r\n2. For the responsive version (in the `VIEW` mode), panels retain height\r\nand are arranged based on screen order (left-to-right, top-to-bottom).\r\n3. Interactivity (drag/resize) is disabled in `view` mode.\r\n\r\n<img width=\"514\" alt=\"Screenshot 2024-11-25 at 17 34 56\"\r\nsrc=\"https://github.com/user-attachments/assets/6a5a97aa-de9b-495a-b1de-301bc935a5ab\">\r\n\r\n#### Maximization\r\n1. Supports expanded panel view using the `expandedPanelId` prop.\r\n2. Interactivity (drag/resize) is disabled when a panel is expanded.\r\n\r\n<img width=\"1254\" alt=\"Screenshot 2024-11-25 at 17 35 05\"\r\nsrc=\"https://github.com/user-attachments/assets/c83014f6-18ad-435b-a59d-1d3ba3f80d84\">\r\n\r\n#### Considerations\r\n1. CSS elements naming convention: Main component uses `kbnGrid` class,\r\nwith modifiers like `kbnGrid--nonInteractive`. For the drag handle of\r\n`GridPanel` I used `kbnGridPanel__dragHandle` classname.\r\n2. Classes vs. Inline Styles: I opted for using\r\n`kbnGrid--nonInteractive` instead of adding one more subscription to\r\n`GridPanel` to modify the styles inline. It's the first time in this\r\npackage that I used classes instead of inline styles for no-initial\r\nstyles setting.\r\n3. Naming Convention: I opted for using the `expanded` word to describe\r\nan expanded panel. Another one could be `maximized` as it's more used in\r\nUI, but less in the legacy code.\r\n4. Interactivity (drag/resize) is disabled in responsive mode but we\r\ncould consider to limit this to small viewports only (<768px).\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"d92aa91c3a8329057a2156ea7f1ecdc94a7a3cc2"}}]}] BACKPORT--> Co-authored-by: Marta Bondyra <4283304+mbondyra@users.noreply.github.com> Co-authored-by: Hannah Mudge <Heenawter@users.noreply.github.com> |
||
|
Kibana Machine
|
8f11c13df9
|
[8.x] [Dashboard] [Collapsable Panels] Switch to using props (#200793) (#201253)
# Backport This will backport the following commits from `main` to `8.x`: - [[Dashboard] [Collapsable Panels] Switch to using props (#200793)](https://github.com/elastic/kibana/pull/200793) <!--- Backport version: 9.4.3 --> ### 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":"2024-11-21T17:27:56Z","message":"[Dashboard] [Collapsable Panels] Switch to using props (#200793)\n\nCloses https://github.com/elastic/kibana/issues/200090\r\n\r\n## Summary\r\n\r\nThis PR migrates the `GridLayout` component a more traditional React\r\ndesign using **props** rather than providing an API. This change serves\r\ntwo purposes:\r\n1. It makes the eventual Dashboard migration easier, since it is more\r\nsimilar to `react-grid-layout`'s implementation\r\n3. It makes the `GridLayout` component less opinionated by moving the\r\nlogic for panel management (i.e. panel placement, etc) to the parent\r\ncomponent.\r\n\r\nI tried to keep efficiency in mind for this comparison, and ensured that\r\nwe are still keeping the number of rerenders **o a minimum**. This PR\r\nshould not introduce **any** extra renders in comparison to the API\r\nversion.\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 this PR, since all work is contained in the\r\n`examples` plugin.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"549532240cd8bc271a78b74846021c9023e2da64","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Dashboard","Team:Presentation","loe:medium","release_note:skip","impact:high","v9.0.0","backport:prev-minor","Project:Collapsable Panels"],"title":"[Dashboard] [Collapsable Panels] Switch to using props","number":200793,"url":"https://github.com/elastic/kibana/pull/200793","mergeCommit":{"message":"[Dashboard] [Collapsable Panels] Switch to using props (#200793)\n\nCloses https://github.com/elastic/kibana/issues/200090\r\n\r\n## Summary\r\n\r\nThis PR migrates the `GridLayout` component a more traditional React\r\ndesign using **props** rather than providing an API. This change serves\r\ntwo purposes:\r\n1. It makes the eventual Dashboard migration easier, since it is more\r\nsimilar to `react-grid-layout`'s implementation\r\n3. It makes the `GridLayout` component less opinionated by moving the\r\nlogic for panel management (i.e. panel placement, etc) to the parent\r\ncomponent.\r\n\r\nI tried to keep efficiency in mind for this comparison, and ensured that\r\nwe are still keeping the number of rerenders **o a minimum**. This PR\r\nshould not introduce **any** extra renders in comparison to the API\r\nversion.\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 this PR, since all work is contained in the\r\n`examples` plugin.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"549532240cd8bc271a78b74846021c9023e2da64"}},"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/200793","number":200793,"mergeCommit":{"message":"[Dashboard] [Collapsable Panels] Switch to using props (#200793)\n\nCloses https://github.com/elastic/kibana/issues/200090\r\n\r\n## Summary\r\n\r\nThis PR migrates the `GridLayout` component a more traditional React\r\ndesign using **props** rather than providing an API. This change serves\r\ntwo purposes:\r\n1. It makes the eventual Dashboard migration easier, since it is more\r\nsimilar to `react-grid-layout`'s implementation\r\n3. It makes the `GridLayout` component less opinionated by moving the\r\nlogic for panel management (i.e. panel placement, etc) to the parent\r\ncomponent.\r\n\r\nI tried to keep efficiency in mind for this comparison, and ensured that\r\nwe are still keeping the number of rerenders **o a minimum**. This PR\r\nshould not introduce **any** extra renders in comparison to the API\r\nversion.\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 this PR, since all work is contained in the\r\n`examples` plugin.\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"549532240cd8bc271a78b74846021c9023e2da64"}}]}] BACKPORT--> Co-authored-by: Hannah Mudge <Heenawter@users.noreply.github.com> |
||
|
Kibana Machine
|
ee77e0387b
|
[8.x] [Dashboard] [Collapsable Panels] Add panel management API (#195513) (#199040)
# Backport This will backport the following commits from `main` to `8.x`: - [[Dashboard] [Collapsable Panels] Add panel management API (#195513)](https://github.com/elastic/kibana/pull/195513) <!--- Backport version: 9.4.3 --> ### 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":"2024-11-05T18:11:11Z","message":"[Dashboard] [Collapsable Panels] Add panel management API (#195513)\n\nCloses https://github.com/elastic/kibana/issues/190445\r\n\r\n## Summary\r\n\r\nThis PR adds the first steps of a panel management API to the\r\n`GridLayout` component:\r\n- A method to delete a panel\r\n- A method to replace a panel\r\n- A method to add a panel with a given size and placement technique\r\n(`'placeAtTop' | 'findTopLeftMostOpenSpace'`)\r\n- Currently, we only support adding a panel to the first row, since this\r\nis all that is necessary for parity with the current Dashboard layout\r\nengine - we can revisit this decision as part of the [row\r\nAPI](https://github.com/elastic/kibana/issues/195807).\r\n- A method to get panel count\r\n- This might not be necessary for the dashboard (we'll see), but I\r\nneeded it for the example plugin to be able to generate suggested panel\r\nIDs. It's possible this will get removed 🤷\r\n- The ability to serialize the grid layout state\r\n\r\nI only included the bare minimum here that I know will be necessary for\r\na dashboard integration, but it's possible I missed some things and so\r\nthis API will most likely expand in the future.\r\n\r\n\r\n\r\nhttps://github.com/user-attachments/assets/28df844c-5c12-40fd-b4f4-8fbd1a8abc20\r\n\r\n\r\n\r\n\r\n\r\n### Serialization\r\n\r\nWith respect to serialization, there are still some open questions about\r\nhow we want to handle it from the Dashboard side - therefore, in this\r\nPR, I opted to keep the serialization as simple as possible (i.e. both\r\nthe input and serialized output take identical forms for the\r\n`GridLayout` component).\r\n\r\nOur goal is to keep `kbn-grid-layout` as **generic** as possible so,\r\nwhile I considered making the serialize method return the form that the\r\nDashboard expects, I ultimately decided against that; instead, I think\r\nDashboard should be responsible for taking the grid layout's serialized\r\nform and turning it into a dashboard-specific serialization of a grid\r\nlayout and vice-versa for deserializing and sending the initial layout\r\nto the `GridLayout` component.\r\n\r\nThe dashboard grid layout serialization will be tackled as part of\r\nhttps://github.com/elastic/kibana/issues/190446, where it's possible my\r\nopinion might change :) This is just a first draft of the\r\n`kbn-grid-layout` API, after all.\r\n\r\n### Example Grid Layout\r\n\r\nIn the grid layout example plugin, I integrated the API by adding some\r\npretty bare-bones buttons to each panel in order to ensure the API works\r\nas expected - that being said, I didn't worry too much about the design\r\nof these things and so it looks pretty ugly 😆 My next step is\r\nhttps://github.com/elastic/kibana/issues/190379, where I will have to\r\nintegrate the grid layout API with the embeddable actions, at which\r\npoint the design will be improved - so this is a very temporary state\r\n🙇\r\n\r\n### Checklist\r\n\r\n- [x] Any text added follows [EUI's writing\r\nguidelines](https://elastic.github.io/eui/#/guidelines/writing), uses\r\nsentence case text and includes [i18n\r\nsupport](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)\r\n- [x] This was checked for [cross-browser\r\ncompatibility](https://www.elastic.co/support/matrix#matrix_browsers)\r\n\r\n\r\n### For maintainers\r\n\r\n- [ ] This was checked for breaking API changes and was [labeled\r\nappropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"a91427d71bfab9d6a47c3dcdfd5e1a08b8e3ee6f","branchLabelMapping":{"^v9.0.0$":"main","^v8.17.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Dashboard","Team:Presentation","loe:medium","release_note:skip","impact:high","v9.0.0","backport:prev-minor","Project:Collapsable Panels"],"title":"[Dashboard] [Collapsable Panels] Add panel management API","number":195513,"url":"https://github.com/elastic/kibana/pull/195513","mergeCommit":{"message":"[Dashboard] [Collapsable Panels] Add panel management API (#195513)\n\nCloses https://github.com/elastic/kibana/issues/190445\r\n\r\n## Summary\r\n\r\nThis PR adds the first steps of a panel management API to the\r\n`GridLayout` component:\r\n- A method to delete a panel\r\n- A method to replace a panel\r\n- A method to add a panel with a given size and placement technique\r\n(`'placeAtTop' | 'findTopLeftMostOpenSpace'`)\r\n- Currently, we only support adding a panel to the first row, since this\r\nis all that is necessary for parity with the current Dashboard layout\r\nengine - we can revisit this decision as part of the [row\r\nAPI](https://github.com/elastic/kibana/issues/195807).\r\n- A method to get panel count\r\n- This might not be necessary for the dashboard (we'll see), but I\r\nneeded it for the example plugin to be able to generate suggested panel\r\nIDs. It's possible this will get removed 🤷\r\n- The ability to serialize the grid layout state\r\n\r\nI only included the bare minimum here that I know will be necessary for\r\na dashboard integration, but it's possible I missed some things and so\r\nthis API will most likely expand in the future.\r\n\r\n\r\n\r\nhttps://github.com/user-attachments/assets/28df844c-5c12-40fd-b4f4-8fbd1a8abc20\r\n\r\n\r\n\r\n\r\n\r\n### Serialization\r\n\r\nWith respect to serialization, there are still some open questions about\r\nhow we want to handle it from the Dashboard side - therefore, in this\r\nPR, I opted to keep the serialization as simple as possible (i.e. both\r\nthe input and serialized output take identical forms for the\r\n`GridLayout` component).\r\n\r\nOur goal is to keep `kbn-grid-layout` as **generic** as possible so,\r\nwhile I considered making the serialize method return the form that the\r\nDashboard expects, I ultimately decided against that; instead, I think\r\nDashboard should be responsible for taking the grid layout's serialized\r\nform and turning it into a dashboard-specific serialization of a grid\r\nlayout and vice-versa for deserializing and sending the initial layout\r\nto the `GridLayout` component.\r\n\r\nThe dashboard grid layout serialization will be tackled as part of\r\nhttps://github.com/elastic/kibana/issues/190446, where it's possible my\r\nopinion might change :) This is just a first draft of the\r\n`kbn-grid-layout` API, after all.\r\n\r\n### Example Grid Layout\r\n\r\nIn the grid layout example plugin, I integrated the API by adding some\r\npretty bare-bones buttons to each panel in order to ensure the API works\r\nas expected - that being said, I didn't worry too much about the design\r\nof these things and so it looks pretty ugly 😆 My next step is\r\nhttps://github.com/elastic/kibana/issues/190379, where I will have to\r\nintegrate the grid layout API with the embeddable actions, at which\r\npoint the design will be improved - so this is a very temporary state\r\n🙇\r\n\r\n### Checklist\r\n\r\n- [x] Any text added follows [EUI's writing\r\nguidelines](https://elastic.github.io/eui/#/guidelines/writing), uses\r\nsentence case text and includes [i18n\r\nsupport](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)\r\n- [x] This was checked for [cross-browser\r\ncompatibility](https://www.elastic.co/support/matrix#matrix_browsers)\r\n\r\n\r\n### For maintainers\r\n\r\n- [ ] This was checked for breaking API changes and was [labeled\r\nappropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"a91427d71bfab9d6a47c3dcdfd5e1a08b8e3ee6f"}},"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/195513","number":195513,"mergeCommit":{"message":"[Dashboard] [Collapsable Panels] Add panel management API (#195513)\n\nCloses https://github.com/elastic/kibana/issues/190445\r\n\r\n## Summary\r\n\r\nThis PR adds the first steps of a panel management API to the\r\n`GridLayout` component:\r\n- A method to delete a panel\r\n- A method to replace a panel\r\n- A method to add a panel with a given size and placement technique\r\n(`'placeAtTop' | 'findTopLeftMostOpenSpace'`)\r\n- Currently, we only support adding a panel to the first row, since this\r\nis all that is necessary for parity with the current Dashboard layout\r\nengine - we can revisit this decision as part of the [row\r\nAPI](https://github.com/elastic/kibana/issues/195807).\r\n- A method to get panel count\r\n- This might not be necessary for the dashboard (we'll see), but I\r\nneeded it for the example plugin to be able to generate suggested panel\r\nIDs. It's possible this will get removed 🤷\r\n- The ability to serialize the grid layout state\r\n\r\nI only included the bare minimum here that I know will be necessary for\r\na dashboard integration, but it's possible I missed some things and so\r\nthis API will most likely expand in the future.\r\n\r\n\r\n\r\nhttps://github.com/user-attachments/assets/28df844c-5c12-40fd-b4f4-8fbd1a8abc20\r\n\r\n\r\n\r\n\r\n\r\n### Serialization\r\n\r\nWith respect to serialization, there are still some open questions about\r\nhow we want to handle it from the Dashboard side - therefore, in this\r\nPR, I opted to keep the serialization as simple as possible (i.e. both\r\nthe input and serialized output take identical forms for the\r\n`GridLayout` component).\r\n\r\nOur goal is to keep `kbn-grid-layout` as **generic** as possible so,\r\nwhile I considered making the serialize method return the form that the\r\nDashboard expects, I ultimately decided against that; instead, I think\r\nDashboard should be responsible for taking the grid layout's serialized\r\nform and turning it into a dashboard-specific serialization of a grid\r\nlayout and vice-versa for deserializing and sending the initial layout\r\nto the `GridLayout` component.\r\n\r\nThe dashboard grid layout serialization will be tackled as part of\r\nhttps://github.com/elastic/kibana/issues/190446, where it's possible my\r\nopinion might change :) This is just a first draft of the\r\n`kbn-grid-layout` API, after all.\r\n\r\n### Example Grid Layout\r\n\r\nIn the grid layout example plugin, I integrated the API by adding some\r\npretty bare-bones buttons to each panel in order to ensure the API works\r\nas expected - that being said, I didn't worry too much about the design\r\nof these things and so it looks pretty ugly 😆 My next step is\r\nhttps://github.com/elastic/kibana/issues/190379, where I will have to\r\nintegrate the grid layout API with the embeddable actions, at which\r\npoint the design will be improved - so this is a very temporary state\r\n🙇\r\n\r\n### Checklist\r\n\r\n- [x] Any text added follows [EUI's writing\r\nguidelines](https://elastic.github.io/eui/#/guidelines/writing), uses\r\nsentence case text and includes [i18n\r\nsupport](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)\r\n- [x] This was checked for [cross-browser\r\ncompatibility](https://www.elastic.co/support/matrix#matrix_browsers)\r\n\r\n\r\n### For maintainers\r\n\r\n- [ ] This was checked for breaking API changes and was [labeled\r\nappropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"a91427d71bfab9d6a47c3dcdfd5e1a08b8e3ee6f"}}]}] BACKPORT--> Co-authored-by: Hannah Mudge <Heenawter@users.noreply.github.com> |
||
Luke Elmers
|
b6287708f6
|
Adds AGPL 3.0 license (#192025)
Updates files outside of x-pack to be triple-licensed under Elastic License 2.0, AGPL 3.0, or SSPL 1.0. |
||
Devon Thomson
|
b02f6dbcc5
|
[Collapsable Panels] Better Scrolling for kbn grid layout (#191120)
changes `kbn grid layout` to allow better scrolling behaviour. |
||
|
Devon Thomson
|
7290824e74
|
[Dashboard] New layout engine (#174132)
Introduces a new performant and simple drag & drop layout engine for Kibana which uses HTML5 and CSS and and has **no external dependencies**. |