fix(slider): add tooltip stop

koory1st · Jan 28, 2024 · e5e7c66 · e5e7c66
1 parent 74c683f
commit e5e7c66
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/packages/slider/src/lib/button.svelte b/packages/slider/src/lib/button.svelte
@@ -21,6 +21,8 @@
   export let showTooltip = true;
   export let formatTooltip = null;
   $: tooltipValue = formatTooltip ? formatTooltip(value) : value;
+  /** @type {'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end'} */
+  export let placement = 'top';
 
   let button;
   $: hovering = false;
@@ -183,7 +185,7 @@
 
 <!-- svelte-ignore a11y-no-noninteractive-tabindex -->
 <!-- svelte-ignore a11y-no-static-element-interactions -->
-<SvelTooltip bind:updatePopper content={tooltipValue} placement="top" visible={tooltipVisible}>
+<SvelTooltip bind:updatePopper content={tooltipValue} {placement} visible={tooltipVisible}>
   <div
     bind:this={button}
     class={wrapperClass}

diff --git a/packages/slider/src/lib/slider.svelte b/packages/slider/src/lib/slider.svelte
@@ -26,6 +26,8 @@
   let slider;
   let firstButton;
   export let formatTooltip = null;
+  /** @type {'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end'} */
+  export let placement = 'top';
 
   onMount(async () => {
     if (range) {
@@ -262,6 +264,7 @@
       bind:value={firstValue}
       disabled={sliderDisabled}
       {formatTooltip}
+      {placement}
       {resetSize}
       {showTooltip}
       {sliderSize}
@@ -288,6 +291,7 @@
         {vertical}
         {showTooltip}
         {formatTooltip}
+        {placement}
       />
     {/if}
     {#if showStops}