docs(portal): add examples

Author: metonym

docs/src/pages/components/Portal.svx

@@ -0,0 +1,18 @@
+<script>
+  import { Portal } from "carbon-components-svelte";
+  import Preview from "../../components/Preview.svelte";
+</script>
+
+The `Portal` component renders its content into a fixed container appended to `document.body`, allowing you to escape parent overflow constraints and z-index stacking contexts.
+
+## Default Portal
+
+Render content in a portal container. This is useful for modals, tooltips, and menus that need to escape parent containers.
+
+<FileSource src="/framed/Portal/BasicPortal" />
+
+## Multiple Portals
+
+Multiple portal instances share the same container, which is automatically cleaned up when all instances are removed.
+
+<FileSource src="/framed/Portal/MultiplePortals" />

docs/src/pages/framed/Portal/BasicPortal.svelte

@@ -0,0 +1,6 @@
+<script>
+  import { Portal } from "carbon-components-svelte";
+</script>
+
+<Portal>Hello world</Portal>
+<Portal>Another portal</Portal>

docs/src/pages/framed/Portal/MultiplePortals.svelte

@@ -0,0 +1,18 @@
+<script>
+  import { Button, Portal } from "carbon-components-svelte";
+</script>
+
+<Button>Button 1</Button>
+<Portal>
+  <div style="position: absolute; top: 100px; left: 20px; padding: 1rem; background: var(--cds-layer-01); border: 1px solid var(--cds-border-subtle-01);">
+    Portal content 1
+  </div>
+</Portal>
+
+<Button>Button 2</Button>
+<Portal>
+  <div style="position: absolute; top: 150px; left: 20px; padding: 1rem; background: var(--cds-layer-01); border: 1px solid var(--cds-border-subtle-01);">
+    Portal content 2
+  </div>
+</Portal>
+