diff --git a/packages/dialog/README.md b/packages/dialog/README.md
index 2a02d13f7..b5f19b3e9 100644
--- a/packages/dialog/README.md
+++ b/packages/dialog/README.md
@@ -9,6 +9,7 @@ Its purpose is to make it easy to use our Overlay System declaratively.
 import { html } from 'lit-html';
 import demoStyle from './docs/demo-dialog-style.js';
 import './docs/styled-dialog-content.js';
+import './docs/slots-dialog-content.js';
 import './lion-dialog.js';
 
 export default {
@@ -100,6 +101,20 @@ export const stylingContent = () => html`
 `;
 ```
 
+### Content with slots
+
+```js preview-story
+export const slotsContent = () => html`
+  <style>
+    ${demoStyle}
+  </style>
+  <lion-dialog .config=${{ hidesOnOutsideClick: true, hidesOnEsc: true }}>
+    <button slot="invoker">Dialog with content with slots</button>
+    <slots-dialog-content slot="content"></slots-dialog-content>
+  </lion-dialog>
+`;
+```
+
 ### Close overlay from component slotted as content
 
 The overlay cannot be closed by dispatching the `close-overlay` from a button in a styled component that is slotted in as content, because it will not cross the shadow boundary of the component. A method should be created that will dispatch the `close-overlay` event from the component.
diff --git a/packages/dialog/docs/slots-dialog-content.js b/packages/dialog/docs/slots-dialog-content.js
new file mode 100644
index 000000000..c5aa064c1
--- /dev/null
+++ b/packages/dialog/docs/slots-dialog-content.js
@@ -0,0 +1,14 @@
+import { LitElement, html } from '@lion/core';
+
+class SlotsDialogContent extends LitElement {
+  render() {
+    return html`
+      <button>shadow button</button>
+      <slot name="actions">
+        <button>slot button</button>
+      </slot>
+    `;
+  }
+}
+
+customElements.define('slots-dialog-content', SlotsDialogContent);
diff --git a/packages/overlays/src/utils/get-focusable-elements.js b/packages/overlays/src/utils/get-focusable-elements.js
index 033206f77..b4d0fd11b 100644
--- a/packages/overlays/src/utils/get-focusable-elements.js
+++ b/packages/overlays/src/utils/get-focusable-elements.js
@@ -42,7 +42,7 @@ function getChildNodes(element) {
   if (element.localName === 'slot') {
     /** @type {HTMLSlotElement} */
     const slot = element;
-    return slot.assignedNodes();
+    return slot.assignedNodes({ flatten: true });
   }
 
   const { children } = element.shadowRoot || element;