fix(scroll): add setScrollTop and setScrollLeft

docs/src/routes/component/scrollbar/+page.svelte

@@ -39,6 +39,8 @@
   function scroll({ detail }) {
     value = detail.scrollTop;
   }
+
+  let setScrollTop;
 </script>
 
 <h1>{$langFn('cscrollbar01010')}</h1>
@@ -143,17 +145,53 @@
 
 <Example
   code={`
+<script>
+let list4 = [];
+for (let i = 0; i < 20; i++) {
+  list4.push(i);
+}
+let value = 0;
+let innerRef;
+$: max = innerRef ? innerRef.clientHeight - 380 : 0;
+
+function scroll({ detail }) {
+  value = detail.scrollTop;
+}
+
+let setScrollTop;
+@@@/script>
+<SvelScrollbar always bind:setScrollTop height="400px" on:scroll={scroll}>
+  <div bind:this={innerRef}>
+    {#each list4 as item}
+      <p class="scrollbar-demo-item">{item}</p>
+    {/each}
+  </div>
+</SvelScrollbar>
+
+<SvelSlider
+  bind:value
+  {max}
+  on:input={() => {
+    setScrollTop(value);
+  }}
+/>
 `}
 >
-  <SvelScrollbar always height="400px" on:scroll={scroll}>
+  <SvelScrollbar always bind:setScrollTop height="400px" on:scroll={scroll}>
     <div bind:this={innerRef}>
       {#each list4 as item}
         <p class="scrollbar-demo-item">{item}</p>
       {/each}
     </div>
   </SvelScrollbar>
 
-  <SvelSlider bind:value {max} />
+  <SvelSlider
+    bind:value
+    {max}
+    on:input={() => {
+      setScrollTop(value);
+    }}
+  />
 </Example>
 
 <style>

packages/scrollbar/src/lib/scrollbar.svelte

@@ -23,6 +23,15 @@
   export let noresize = false;
   export let always = false;
   export let minSize = 20;
+
+  export function setScrollTop(v) {
+    wrapRef.scrollTop = v;
+  }
+
+  export function setScrollLeft(v) {
+    wrapRef.scrollLeft = v;
+  }
+
   $: scrollbarClass = a2s(['svel-scrollbar', $$props.class]);
 
   $: wrapClass = a2s(['svel-scrollbar__wrap', ['svel-scrollbar__wrap--hidden-default', !native]]);