https://waterdrop.rs/cdn/shop/t/5/assets/scroll-shadow-DPgU7TnC.js

1var a=`
2    <style>
3      :host {
4        display: inline-block;
5        contain: layout;
6        position: relative;
7      }
8
9      :host([hidden]) {
10        display: none;
11      }
12
13      s {
14        position: absolute;
15        top: 0;
16        bottom: 0;
17        left: 0;
18        right: 0;
19        pointer-events: none;
20        background-image:
21          var(--scroll-shadow-top, radial-gradient(farthest-side at 50% 0%, rgba(0,0,0,.2), rgba(0,0,0,0))),
22          var(--scroll-shadow-bottom, radial-gradient(farthest-side at 50% 100%, rgba(0,0,0,.2), rgba(0,0,0,0))),
23          var(--scroll-shadow-left, radial-gradient(farthest-side at 0%, rgba(0,0,0,.2), rgba(0,0,0,0))),
24          var(--scroll-shadow-right, radial-gradient(farthest-side at 100%, rgba(0,0,0,.2), rgba(0,0,0,0)));
25        background-position: top, bottom, left, right;
26        background-repeat: no-repeat;
27        background-size: 100% var(--top, 0), 100% var(--bottom, 0), var(--left, 0) 100%, var(--right, 0) 100%;
28      }
29    </style>
30    <slot></slot>
31    <s></s>
32  `,i=class{constructor(t){this.scheduleUpdate=throttle(()=>this.update(t,getComputedStyle(t))),this.resizeObserver=new ResizeObserver(this.scheduleUpdate.bind(this))}start(t){this.element&&this.stop(),t&&(t.addEventListener("scroll",this.scheduleUpdate),this.resizeObserver.observe(t),this.element=t)}stop(){this.element&&(this.element.removeEventListener("scroll",this.scheduleUpdate),this.resizeObserver.unobserve(this.element),this.element=null)}update(t,s){if(!this.element)return;const r=s.getPropertyValue("--scroll-shadow-size")?parseInt(s.getPropertyValue("--scroll-shadow-size")):0,o={top:Math.max(this.element.scrollTop,0),bottom:Math.max(this.element.scrollHeight-this.element.offsetHeight-this.element.scrollTop,0),left:Math.max(this.element.scrollLeft,0),right:Math.max(this.element.scrollWidth-this.element.offsetWidth-this.element.scrollLeft,0)};requestAnimationFrame(()=>{for(const e of["top","bottom","left","right"])t.style.setProperty(`--${e}`,`${o[e]>r?r:o[e]}px`)})}},l=class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=a,this.updater=new i(this.shadowRoot.lastElementChild)}connectedCallback(){this.shadowRoot.querySelector("slot").addEventListener("slotchange",()=>this.start()),this.start()}disconnectedCallback(){this.updater.stop()}start(){this.updater.start(this.firstElementChild)}};!window.customElements.get("scroll-shadow")&&"ResizeObserver"in window&&window.customElements.define("scroll-shadow",l);