Rename slot to slotProps in <Render>

Conflicted with Svelte's use of the `slot` attribute

src/lib/components/listbox/Listbox.svelte

@@ -216,16 +216,16 @@
       $buttonRef?.focus({ preventScroll: true });
     }
   }
-  $: slot = { open: listboxState === ListboxStates.Open };
+  $: slotProps = { open: listboxState === ListboxStates.Open };
 </script>
 
 <svelte:window on:mousedown={handleMousedown} />
 <Render
   {...$$restProps}
   {as}
-  {slot}
+  {slotProps}
   use={[...use, forwardEvents]}
   name={"Listbox"}
 >
-  <slot {...slot} />
+  <slot {...slotProps} />
 </Render>

src/lib/components/listbox/ListboxButton.svelte

@@ -82,7 +82,7 @@
     disabled: $api.disabled === true ? true : undefined,
   };
 
-  $: slot = {
+  $: slotProps = {
     open: $api.listboxState === ListboxStates.Open,
     disabled: $api.disabled,
   };
@@ -92,7 +92,7 @@
   {...$$restProps}
   {...propsWeControl}
   {as}
-  {slot}
+  {slotProps}
   use={[...use, forwardEvents]}
   name={"ListboxButton"}
   bind:el={$buttonRef}
@@ -100,5 +100,5 @@
   on:keydown={handleKeyDown}
   on:keyup={handleKeyUp}
 >
-  <slot {...slot} />
+  <slot {...slotProps} />
 </Render>

src/lib/components/listbox/ListboxLabel.svelte

@@ -21,7 +21,7 @@
     $buttonRef?.focus({ preventScroll: true });
   }
 
-  $: slot = {
+  $: slotProps = {
     open: $api.listboxState === ListboxStates.Open,
     disabled: $api.disabled,
   };
@@ -31,11 +31,11 @@
   {...$$restProps}
   {id}
   {as}
-  {slot}
+  {slotProps}
   use={[...use, forwardEvents]}
   name={"ListboxLabel"}
   bind:el={$labelRef}
   on:click={handleClick}
 >
-  <slot {...slot} />
+  <slot {...slotProps} />
 </Render>

src/lib/components/listbox/ListboxOption.svelte

@@ -103,14 +103,14 @@
     "aria-selected": selected === true ? selected : undefined,
   };
 
-  $: slot = { active, selected, disabled };
+  $: slotProps = { active, selected, disabled };
 </script>
 
 <Render
   {...$$restProps}
   {...propsWeControl}
   {as}
-  {slot}
+  {slotProps}
   use={[...use, forwardEvents]}
   name={"ListboxOption"}
   on:click={handleClick}
@@ -120,5 +120,5 @@
   on:pointerleave={handleLeave}
   on:mouseleave={handleLeave}
 >
-  <slot {...slot} />
+  <slot {...slotProps} />
 </Render>

src/lib/components/listbox/ListboxOptions.svelte

@@ -117,7 +117,7 @@
       ? $usesOpenClosedState === State.Open
       : $api.listboxState === ListboxStates.Open;
 
-  $: slot = { open: $api.listboxState === ListboxStates.Open };
+  $: slotProps = { open: $api.listboxState === ListboxStates.Open };
 </script>
 
 {#if visible}
@@ -125,12 +125,12 @@
     {...$$restProps}
     {...propsWeControl}
     {as}
-    {slot}
+    {slotProps}
     use={[...use, forwardEvents]}
     name={"ListboxOptions"}
     bind:el={$optionsRef}
     on:keydown={handleKeyDown}
   >
-    <slot {...slot} />
+    <slot {...slotProps} />
   </Render>
 {/if}

src/lib/components/menu/MenuButton.svelte

@@ -81,13 +81,13 @@
     "aria-expanded": disabled ? undefined : $api.menuState === MenuStates.Open,
   };
 
-  $: slot = { open: $api.menuState === MenuStates.Open };
+  $: slotProps = { open: $api.menuState === MenuStates.Open };
 </script>
 
 <Render
   {...{ ...$$restProps, ...propsWeControl }}
   {as}
-  {slot}
+  {slotProps}
   use={[...use, forwardEvents]}
   name={"MenuButton"}
   bind:el={$buttonStore}
@@ -95,5 +95,5 @@
   on:keydown={handleKeyDown}
   on:keyup={handleKeyUp}
 >
-  <slot {...slot} />
+  <slot {...slotProps} />
 </Render>

src/lib/components/menu/MenuItem.svelte

@@ -72,14 +72,14 @@
     "aria-disabled": disabled === true ? true : undefined,
   };
 
-  $: slot = { active, disabled };
+  $: slotProps = { active, disabled };
 </script>
 
 <Render
   {...{ ...$$restProps, ...propsWeControl }}
   use={[...use, forwardEvents]}
   {as}
-  {slot}
+  {slotProps}
   name={"MenuItem"}
   bind:el={elementRef}
   on:click={handleClick}
@@ -89,5 +89,5 @@
   on:pointerleave={handleLeave}
   on:mouseleave={handleLeave}
 >
-  <slot {...slot} />
+  <slot {...slotProps} />
 </Render>

src/lib/components/menu/MenuItems.svelte

@@ -135,20 +135,20 @@
     role: "menu",
     tabIndex: 0,
   };
-  $: slot = { open: $api.menuState === MenuStates.Open };
+  $: slotProps = { open: $api.menuState === MenuStates.Open };
 </script>
 
 {#if visible}
   <Render
     {...{ ...$$restProps, ...propsWeControl }}
     {as}
-    {slot}
+    {slotProps}
     use={[...use, forwardEvents]}
     bind:el={$itemsStore}
     name={"MenuItems"}
     on:keydown={handleKeyDown}
     on:keyup={handleKeyUp}
   >
-    <slot {...slot} />
+    <slot {...slotProps} />
   </Render>
 {/if}

src/lib/components/switch/Switch.svelte

@@ -55,7 +55,7 @@
     "aria-describedby": $descriptionContext?.descriptionIds,
   };
 
-  $: slot = { checked };
+  $: slotProps = { checked };
 </script>
 
 <!-- TODO: I'm sure there's a better way of doing this -->
@@ -63,7 +63,7 @@
   <Render
     {...{ ...$$restProps, ...propsWeControl }}
     {as}
-    {slot}
+    {slotProps}
     use={[...use, forwardEvents]}
     name={"Switch"}
     bind:el={$switchStore}
@@ -71,13 +71,13 @@
     on:keyup={handleKeyUp}
     on:keypress={handleKeyPress}
   >
-    <slot {...slot} />
+    <slot {...slotProps} />
   </Render>
 {:else}
   <Render
     {...{ ...$$restProps, ...propsWeControl }}
     {as}
-    {slot}
+    {slotProps}
     use={[...use, forwardEvents]}
     name={"Switch"}
     bind:el={$switchStore}
@@ -85,6 +85,6 @@
     on:keyup={handleKeyUp}
     on:keypress={handleKeyPress}
   >
-    <slot {...slot} />
+    <slot {...slotProps} />
   </Render>
 {/if}

src/lib/utils/Render.svelte

@@ -19,7 +19,7 @@
   export let as: SvelteComponent | SupportedElement;
   export let el: HTMLElement | null = null;
   export let use: ActionArray = [];
-  export let slot: unknown = {};
+  export let slotProps: unknown = {};
   const forwardEvents = forwardEventsBuilder(get_current_component());
 
   if (!as) {
@@ -41,7 +41,7 @@
   bind:el
   use={[...use, forwardEvents]}
   {...$$restProps}
-  class={typeof classStyle === "function" ? classStyle(slot) : classStyle}
+  class={typeof classStyle === "function" ? classStyle(slotProps) : classStyle}
 >
   <slot />
 </svelte:component>