From a9d57659fbececf5cd59b68c9c5b1ccdfbcefa6e Mon Sep 17 00:00:00 2001
From: Ryan Gossiaux <ryan.gossiaux@gmail.com>
Date: Thu, 30 Dec 2021 11:17:25 -1000
Subject: [PATCH] Migrate Description to <Render> and pass slot props

---
 .../components/description/Description.svelte | 24 ++++++++++++++++---
 .../description/DescriptionProvider.svelte    |  2 +-
 src/lib/components/dialog/Dialog.svelte       |  6 ++++-
 3 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/src/lib/components/description/Description.svelte b/src/lib/components/description/Description.svelte
index 5558d98..80c1ea6 100644
--- a/src/lib/components/description/Description.svelte
+++ b/src/lib/components/description/Description.svelte
@@ -1,7 +1,18 @@
 <script lang="ts">
+  import type { HTMLActionArray } from "$lib/hooks/use-actions";
+
   import { useId } from "$lib/hooks/use-id";
+  import type { SupportedAs } from "$lib/internal/elements";
+  import { forwardEventsBuilder } from "$lib/internal/forwardEventsBuilder";
+  import Render from "$lib/utils/Render.svelte";
   import { onMount } from "svelte";
+  import { get_current_component } from "svelte/internal";
   import { useDescriptionContext } from "./DescriptionProvider.svelte";
+  const forwardEvents = forwardEventsBuilder(get_current_component());
+  export let as: SupportedAs = "p";
+  export let use: HTMLActionArray = [];
+
+  $: slotProps = $contextStore?.props?.slotProps ?? {};
   const id = `headlessui-description-${useId()}`;
   let contextStore = useDescriptionContext();
   if (!contextStore) {
@@ -13,6 +24,13 @@
   onMount(() => $contextStore?.register(id));
 </script>
 
-<p {...$$restProps} {...$contextStore?.props} {id}>
-  <slot />
-</p>
+<Render
+  name={"Description"}
+  {...$$restProps}
+  {as}
+  {...$contextStore?.props}
+  {id}
+  use={[...use, forwardEvents]}
+>
+  <slot {...slotProps} />
+</Render>
diff --git a/src/lib/components/description/DescriptionProvider.svelte b/src/lib/components/description/DescriptionProvider.svelte
index ae54d52..1a4c3ef 100644
--- a/src/lib/components/description/DescriptionProvider.svelte
+++ b/src/lib/components/description/DescriptionProvider.svelte
@@ -1,7 +1,7 @@
 <script lang="ts" context="module">
   export interface DescriptionContext {
     name?: string;
-    props?: object;
+    props?: { slotProps?: object };
     register: (value: string) => void;
     descriptionIds?: string;
   }
diff --git a/src/lib/components/dialog/Dialog.svelte b/src/lib/components/dialog/Dialog.svelte
index 5977347..c438e7a 100644
--- a/src/lib/components/dialog/Dialog.svelte
+++ b/src/lib/components/dialog/Dialog.svelte
@@ -266,7 +266,11 @@
     <Portal>
       <PortalGroup target={internalDialogRef}>
         <ForcePortalRootContext force={false}>
-          <DescriptionProvider name={"Dialog.Description"} let:describedby>
+          <DescriptionProvider
+            name={"DialogDescription"}
+            {slotProps}
+            let:describedby
+          >
             <Render
               {...{ ...$$restProps, ...propsWeControl }}
               {as}