fix(switch): activeAction

koory1st · Mar 9, 2024 · b318429 · b318429
1 parent 27294ba
commit b318429
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 6 deletions.
diff --git a/docs/src/routes/component/switch/+page.svelte b/docs/src/routes/component/switch/+page.svelte
@@ -188,8 +188,8 @@
 
 <Example
   code={`
-  <SvelSwitch bind:value={value5} loading />
-  <SvelSwitch class="ml-2" loading />
+<SvelSwitch bind:value={value5} loading />
+<SvelSwitch class="ml-2" loading />
 `}
 >
   <SvelSwitch bind:value={value5} loading />
@@ -226,8 +226,8 @@
     });
   };
 @@@/>
-  <SvelSwitch beforeChange={beforeChange1} bind:value={value6} loading={loading1} />
-  <SvelSwitch beforeChange={beforeChange2} bind:value={value7} loading={loading2} />
+<SvelSwitch beforeChange={beforeChange1} bind:value={value6} loading={loading1} />
+<SvelSwitch beforeChange={beforeChange2} bind:value={value7} loading={loading2} />
 `}
 >
   <SvelSwitch beforeChange={beforeChange1} bind:value={value6} loading={loading1} />
@@ -239,12 +239,21 @@
 
 <Example
   code={`
+<SvelSwitch>
+  <View slot="activeActionIcon" />
+  <Hide slot="inactiveActionIcon" />
+</SvelSwitch>
 `}
 >
   <SvelSwitch>
     <View slot="activeActionIcon" />
     <Hide slot="inactiveActionIcon" />
   </SvelSwitch>
+
+  <SvelSwitch>
+    <span slot="activeAction">T</span>
+    <span slot="inactiveAction">F</span>
+  </SvelSwitch>
 </Example>
 
 <style>

diff --git a/packages/switch/src/lib/switch.svelte b/packages/switch/src/lib/switch.svelte
@@ -165,10 +165,14 @@
         <SvelIcon>
           <slot name="activeActionIcon" />
         </SvelIcon>
+      {:else if $$slots.activeAction && checked}
+        <slot name="activeAction" />
       {:else if $$slots.inactiveActionIcon && !checked}
         <SvelIcon>
           <slot name="inactiveActionIcon" />
         </SvelIcon>
+      {:else if $$slots.inactiveAction && !checked}
+        <slot name="inactiveAction" />
       {/if}
     </div>
   </span>

diff --git a/packages/switch/src/routes/+page.svelte b/packages/switch/src/routes/+page.svelte
@@ -87,8 +87,8 @@
 
 <div />
 <SvelSwitch bind:value>
-  <span slot="activeActionIcon">T</span>
-  <span slot="inactiveActionIcon">F</span>
+  <span slot="activeAction">T</span>
+  <span slot="inactiveAction">F</span>
 </SvelSwitch>
 
 <SvelSwitch bind:focus bind:value />