feat(svelte): add tag and wrapperTag props

fixes #6181
nolimits4web · Nov 7, 2022 · 71e7f5a · 71e7f5a
1 parent b57aa4e
commit 71e7f5a
Showing 1 changed file with 8 additions and 4 deletions.
diff --git a/src/svelte/swiper.svelte b/src/svelte/swiper.svelte
@@ -18,6 +18,9 @@
   let className = undefined;
   export { className as class };
 
+  export let tag = 'div';
+  export let wrapperTag = 'div';
+
   let containerClasses = 'swiper';
   let breakpointChanged = false;
   let swiperInstance = null;
@@ -148,17 +151,18 @@
   });
 </script>
 
-<div
+<svelte:element
+  this={tag}
   bind:this={swiperEl}
   class={uniqueClasses(`${containerClasses}${className ? ` ${className}` : ''}`)}
   {...restProps}
 >
   <slot name="container-start" />
-  <div class="swiper-wrapper">
+  <svelte:element this={wrapperTag} class="swiper-wrapper">
     <slot name="wrapper-start" />
     <slot {virtualData} />
     <slot name="wrapper-end" />
-  </div>
+  </svelte:element>
   {#if needsNavigation(swiperParams)}
     <div bind:this={prevEl} class="swiper-button-prev" />
     <div bind:this={nextEl} class="swiper-button-next" />
@@ -170,4 +174,4 @@
     <div bind:this={paginationEl} class="swiper-pagination" />
   {/if}
   <slot name="container-end" />
-</div>
+</svelte:element>