Conditional rendering for trigger button (#3223)

Author: phamduylong

.changeset/stale-coats-build.md

@@ -0,0 +1,5 @@
+---
+'@skeletonlabs/skeleton-svelte': patch
+---
+
+bugfix: only render button wrapping around `trigger` if the snippet was provided

packages/skeleton-svelte/src/lib/components/Modal/Modal.svelte

@@ -70,9 +70,11 @@
 
 <span class="{base} {classes}" data-testid="modal">
 	<!-- Trigger -->
-	<button {...triggerProps} class="{triggerBase} {triggerBackground} {triggerClasses}" {disabled} type="button">
-		{@render trigger?.()}
-	</button>
+	{#if trigger}
+		<button {...triggerProps} class="{triggerBase} {triggerBackground} {triggerClasses}" {disabled} type="button">
+			{@render trigger?.()}
+		</button>
+	{/if}
 
 	{#if api.open}
 		<!-- Backdrop -->

packages/skeleton-svelte/src/lib/components/Popover/Popover.svelte

@@ -63,9 +63,11 @@
 
 <span class="{base} {classes}" data-testid="popover">
 	<!-- Snippet: Trigger -->
-	<button {...triggerProps} class="{triggerBase} {triggerBackground} {triggerClasses}" {disabled} type="button">
-		{@render trigger?.()}
-	</button>
+	{#if trigger}
+		<button {...triggerProps} class="{triggerBase} {triggerBackground} {triggerClasses}" {disabled} type="button">
+			{@render trigger?.()}
+		</button>
+	{/if}
 	<!-- Portal -->
 	<div use:portal={{ disabled: !api.portalled }} {...api.getPositionerProps()} class="{positionerBase} {positionerClasses}">
 		<!-- Popover -->

packages/skeleton-svelte/src/lib/components/Tooltip/Tooltip.svelte

@@ -64,9 +64,11 @@
 
 <span class="{base} {classes}" data-testid="tooltip">
 	<!-- Snippet: Trigger -->
-	<button {...triggerProps} class="{triggerBase} {triggerBackground} {triggerClasses}" {disabled} type="button">
-		{@render trigger?.()}
-	</button>
+	{#if trigger}
+		<button {...triggerProps} class="{triggerBase} {triggerBackground} {triggerClasses}" {disabled} type="button">
+			{@render trigger?.()}
+		</button>
+	{/if}
 	<!-- Tooltip Content -->
 	{#if api.open}
 		<div {...api.getPositionerProps()} transition:fade={{ duration: 100 }} class="{positionerBase} {positionerClasses}">