@esportsplus/ui 0.56.3 → 0.57.0

package/build/components/sticky-stack/index.js

@@ -1,184 +0,0 @@
-import * as template_u1 from '@esportsplus/template';
-import { component } from '@esportsplus/template';
-import * as reactivity_u0 from '@esportsplus/reactivity';
-import './scss/index.scss';
-const template_1g3h60x2 = template_u1.template(`<div class='sticky-stack'><div class='sticky-stack-scroller' role='region' tabindex='0'><div class='sticky-stack-track'><div class='sticky-stack-header'></div></div></div><nav aria-label='Jump to card' class='sticky-stack-nav'>`);
-const template_1g3h60x9 = template_u1.template(`<article class='sticky-stack-card'><span class='sticky-stack-number'></span><div class='sticky-stack-body'><h3 class='sticky-stack-title'></h3><p class='sticky-stack-text'></p></div><div aria-hidden='true' class='sticky-stack-shade'>`);
-const template_1g3h60xf = template_u1.template(`<button class='sticky-stack-dot' type='button'><span class='sticky-stack-bar'><span class='sticky-stack-fill'>`);
-class ReactiveObject_1g3h60x0 extends reactivity_u0.ReactiveObject {
-    #active = this[reactivity_u0.SIGNAL](0);
-    constructor() {
-        super(null);
-    }
-    get active() {
-        return reactivity_u0.read(this.#active);
-    }
-    set active(_v0) {
-        reactivity_u0.write(this.#active, _v0);
-    }
-}
-const STICKY_STACK_CARD = Symbol.for('@esportsplus/ui/sticky-stack.card');
-const STICKY_STACK_DOT = Symbol.for('@esportsplus/ui/sticky-stack.dot');
-function covered(layout, i, s) {
-    let [start, end] = cover(layout, i);
-    return Math.min(Math.max((s - start) / (end - start), 0), 1);
-}
-function cover(layout, i) {
-    return [
-        natural(layout, i + 1) - top(layout, i) - layout.card,
-        natural(layout, i + 1) - top(layout, i + 1)
-    ];
-}
-function depth(layout, i, last, s) {
-    let value = 0;
-    for (let j = i; j < last; j++) {
-        value += covered(layout, j, s);
-    }
-    return value;
-}
-function measure(root) {
-    let computed = getComputedStyle(root), read = (name) => parseFloat(computed.getPropertyValue(name));
-    return {
-        card: read('--card-height'),
-        dim: read('--dim-per-card'),
-        first: read('--first-top'),
-        gap: read('--card-gap'),
-        header: read('--header-height'),
-        max: read('--max-dim'),
-        scale: read('--scale-per-card'),
-        step: read('--step')
-    };
-}
-function natural(layout, i) {
-    return layout.header + i * (layout.card + layout.gap);
-}
-function reduced() {
-    return matchMedia('(prefers-reduced-motion: reduce)').matches;
-}
-function timeline(element, points, range, source, frame) {
-    let offsets = [...new Set([0, range, ...points].map((s) => Math.min(Math.max(s, 0), range)))].sort((a, b) => a - b);
-    return element.animate(offsets.map((s) => ({ ...frame(s), offset: s / range })), { fill: 'both', timeline: source });
-}
-function top(layout, i) {
-    return layout.first + i * layout.step;
-}
-export default Object.assign(component(function ({ items, label, state = new ReactiveObject_1g3h60x0(), ...attributes }, heading) {
-    let animations = [], cards = [], dots = [], fills = [], frame = 0, last = items.length - 1, layout, scroller, shades = [];
-    function goTo(i) {
-        if (!layout || !scroller) {
-            return;
-        }
-        scroller.scrollTo({
-            behavior: reduced() ? 'auto' : 'smooth',
-            top: i === 0 ? 0 : natural(layout, i) - top(layout, i)
-        });
-    }
-    function onscroll() {
-        if (!frame) {
-            frame = requestAnimationFrame(update);
-        }
-    }
-    function scrollDriven() {
-        if (!layout || !scroller || typeof ScrollTimeline !== 'function') {
-            return;
-        }
-        let range = scroller.scrollHeight - scroller.clientHeight;
-        if (range <= 0) {
-            return;
-        }
-        let l = layout, motion = !reduced(), source = new ScrollTimeline({ axis: 'block', source: scroller });
-        for (let i = 0; i <= last; i++) {
-            if (i > 0) {
-                animations.push(timeline(fills[i], cover(l, i - 1), range, source, (s) => ({ transform: `scaleY(${covered(l, i - 1, s)})` })));
-            }
-            if (!motion) {
-                continue;
-            }
-            let cap = l.max / l.dim, points = [];
-            for (let j = i; j < last; j++) {
-                points.push(...cover(l, j));
-            }
-            let j = i + Math.floor(cap);
-            if (j < last) {
-                let [start, end] = cover(l, j);
-                points.push(start + (cap % 1) * (end - start));
-            }
-            animations.push(timeline(cards[i], points, range, source, (s) => ({ transform: `scale(${1 - depth(l, i, last, s) * l.scale})` })), timeline(shades[i], points, range, source, (s) => ({ opacity: Math.min(depth(l, i, last, s) * l.dim, l.max) })));
-        }
-    }
-    function update() {
-        frame = 0;
-        if (!layout || !scroller) {
-            return;
-        }
-        let front = 0, s = scroller.scrollTop;
-        for (let i = 0; i < last; i++) {
-            if (covered(layout, i, s) >= 0.5) {
-                front++;
-            }
-        }
-        if (front !== state.active) {
-            dots[state.active]?.removeAttribute('aria-current');
-            state.active = front;
-        }
-        dots[front]?.setAttribute('aria-current', 'step');
-        if (animations.length) {
-            return;
-        }
-        let motion = !reduced();
-        for (let i = 0; i <= last; i++) {
-            let d = depth(layout, i, last, s);
-            cards[i].style.transform = motion ? `scale(${1 - d * layout.scale})` : '';
-            fills[i].style.transform = `scaleY(${i === 0 ? 1 : covered(layout, i - 1, s)})`;
-            shades[i].style.opacity = motion ? String(Math.min(d * layout.dim, layout.max)) : '0';
-        }
-    }
-    return (() => {
-        let root_1g3h60x1 = template_1g3h60x2(), element_1g3h60x3 = root_1g3h60x1.firstChild, element_1g3h60x4 = element_1g3h60x3.firstElementChild, element_1g3h60x5 = element_1g3h60x4.firstElementChild, element_1g3h60x6 = element_1g3h60x5.firstElementChild, element_1g3h60x7 = element_1g3h60x4.nextElementSibling;
-        template_u1.setProperties(element_1g3h60x3, this?.attributes);
-        template_u1.setProperties(element_1g3h60x3, attributes);
-        template_u1.onconnect(element_1g3h60x3, (root) => {
-            cards = [...root.querySelectorAll('.sticky-stack-card')];
-            dots = [...root.querySelectorAll('.sticky-stack-dot')];
-            fills = [...root.querySelectorAll('.sticky-stack-fill')];
-            layout = measure(root);
-            shades = [...root.querySelectorAll('.sticky-stack-shade')];
-            scrollDriven();
-            update();
-        });
-        template_u1.ondisconnect(element_1g3h60x3, () => {
-            cancelAnimationFrame(frame);
-            for (let i = 0, n = animations.length; i < n; i++) {
-                animations[i].cancel();
-            }
-            animations = [];
-        });
-        template_u1.setProperty(element_1g3h60x4, 'aria-label', label);
-        template_u1.onrender(element_1g3h60x4, (el) => {
-            scroller = el;
-        });
-        template_u1.on(element_1g3h60x4, 'scroll', onscroll);
-        template_u1.setList(element_1g3h60x5, 'style', `--last: ${last};`);
-        template_u1.slot(element_1g3h60x6, heading, 1);
-        template_u1.slot(element_1g3h60x5, items.map((item, i) => {
-            let root_1g3h60x8 = template_1g3h60x9(), element_1g3h60xa = root_1g3h60x8.firstChild, element_1g3h60xb = element_1g3h60xa.firstElementChild, element_1g3h60xc = element_1g3h60xb.nextElementSibling.firstElementChild, element_1g3h60xd = element_1g3h60xc.nextElementSibling;
-            template_u1.setList(element_1g3h60xa, 'style', `--index: ${i};`);
-            template_u1.setProperties(element_1g3h60xa, this?.attributes?.[STICKY_STACK_CARD]);
-            template_u1.setProperties(element_1g3h60xa, attributes[STICKY_STACK_CARD]);
-            template_u1.slot(element_1g3h60xb, String(i + 1).padStart(2, '0'), 1);
-            template_u1.slot(element_1g3h60xc, item.title, 1);
-            template_u1.slot(element_1g3h60xd, item.text, 1);
-            return root_1g3h60x8;
-        }), 2);
-        template_u1.slot(element_1g3h60x7, items.map((item, i) => {
-            let root_1g3h60xe = template_1g3h60xf(), element_1g3h60xg = root_1g3h60xe.firstChild, element_1g3h60xh = element_1g3h60xg.firstElementChild.firstElementChild;
-            template_u1.setProperty(element_1g3h60xg, 'aria-label', `${i + 1}. ${item.title}`);
-            template_u1.delegate(element_1g3h60xg, 'click', () => goTo(i));
-            template_u1.setProperties(element_1g3h60xg, this?.attributes?.[STICKY_STACK_DOT]);
-            template_u1.setProperties(element_1g3h60xg, attributes[STICKY_STACK_DOT]);
-            template_u1.setList(element_1g3h60xh, 'style', `transform: scaleY(${i === 0 ? 1 : 0});`);
-            return root_1g3h60xe;
-        }), 1);
-        return root_1g3h60x1;
-    })();
-}), { card: STICKY_STACK_CARD, dot: STICKY_STACK_DOT });

package/build/components/sticky-stack/scss/index.scss

@@ -1,2 +0,0 @@
-@layer components {.sticky-stack{--background:var(--color-grey-400);--bar-color:var(--color-border-300);--bar-height:28px;--bar-width:3px;--box-shadow:0 0 0 var(--border-width-400) oklch(from var(--color-black-300) l c h / .06), 0 1px 2px oklch(from var(--color-black-300) l c h / .06), 0 6px 16px -6px oklch(from var(--color-black-300) l c h / .12);--card-background:var(--color-white-300);--card-border-radius:var(--border-radius-700);--card-gap:80px;--card-height:280px;--card-padding:var(--size-600);--color:var(--color-text-500);--dim-per-card:.12;--fill-color:var(--color);--first-top:20px;--focus-color:var(--color);--header-height:112px;--max-dim:.4;--muted-color:var(--color-text-300);--pressed-scale:.96;--radius:24px;--scale-per-card:.04;--shade-color:var(--color-black-500);--step:14px;--transition-duration:.15s;--transition-timing-function:ease-out;--viewport-height:480px;--width:min(480px, 100%)}.sticky-stack--compact{--card-gap:56px;--card-height:200px;--header-height:88px;--step:10px;--viewport-height:360px}.sticky-stack--flat{--dim-per-card:0;--max-dim:0;--scale-per-card:0}.sticky-stack{gap:var(--size-200);width:var(--width);display:flex}.sticky-stack-bar{background:var(--bar-color);height:var(--bar-height);transition:scale var(--transition-duration) var(--transition-timing-function);width:var(--bar-width);border-radius:999px;overflow:hidden}.sticky-stack-body{gap:var(--size-200);flex-direction:column;display:flex}.sticky-stack-card{background:var(--card-background);border-radius:var(--card-border-radius);box-shadow:var(--box-shadow);box-sizing:border-box;color:var(--color);height:var(--card-height);padding:var(--card-padding);top:calc(var(--first-top) + var(--index) * var(--step));transform-origin:top;will-change:transform;flex-direction:column;justify-content:space-between;display:flex;position:sticky}.sticky-stack-card+.sticky-stack-card{margin-top:var(--card-gap)}.sticky-stack-dot{cursor:pointer;touch-action:manipulation;height:40px;transition:scale var(--transition-duration) var(--transition-timing-function);background:0 0;border:0;border-radius:999px;outline:none;justify-content:center;align-items:center;width:24px;padding:0;display:flex}.sticky-stack-dot:active{scale:var(--pressed-scale)}.sticky-stack-dot:focus-visible{outline:var(--border-width-500) solid var(--focus-color)}@media (hover:hover){.sticky-stack-dot:hover .sticky-stack-bar{scale:1.5 1}}.sticky-stack-fill{background:var(--fill-color);transform-origin:top;width:100%;height:100%;display:block}.sticky-stack-header{gap:var(--size-100);height:var(--header-height);padding:0 var(--size-200);flex-direction:column;justify-content:center;display:flex}.sticky-stack-nav{flex-direction:column;justify-content:center;display:flex}.sticky-stack-number{color:var(--muted-color);font-variant-numeric:tabular-nums;font-family:ui-monospace,monospace;font-size:14px}.sticky-stack-scroller{background:var(--background);border-radius:var(--radius);box-sizing:border-box;height:var(--viewport-height);overscroll-behavior:contain;min-width:0;padding:0 var(--size-400);scrollbar-width:none;outline:none;flex:1;overflow-y:auto}.sticky-stack-scroller::-webkit-scrollbar{display:none}.sticky-stack-scroller:focus-visible{outline:var(--border-width-500) solid var(--focus-color);outline-offset:2px}.sticky-stack-shade{background:var(--shade-color);border-radius:inherit;opacity:0;pointer-events:none;position:absolute;inset:0}.sticky-stack-text{color:var(--muted-color);text-wrap:pretty;margin:0;font-size:15px;line-height:1.625}.sticky-stack-title{font-size:var(--font-size-600);font-weight:var(--font-weight-600);letter-spacing:-.025em;text-wrap:balance;margin:0}.sticky-stack-track{padding-bottom:calc(var(--viewport-height) - var(--card-height) - var(--first-top) - var(--last) * var(--step))}@media (prefers-reduced-motion:reduce){.sticky-stack-bar,.sticky-stack-dot{transition:none}.sticky-stack-card{will-change:auto}}}
-/*$vite$:1*/

package/build/components/story-progress/index.d.ts

@@ -1,26 +0,0 @@
-import { type Attributes } from '@esportsplus/template';
-import './scss/index.scss';
-declare const STORY_PROGRESS_TOGGLE: unique symbol;
-type A = Attributes & {
-    [STORY_PROGRESS_TOGGLE]?: Attributes;
-    duration?: number;
-    label?: string;
-    state?: State;
-    stories: Story[];
-};
-type State = {
-    index: number;
-    paused: boolean;
-};
-type Story = {
-    caption: string;
-    value: string;
-};
-declare function template(this: {
-    attributes?: Partial<A>;
-} | void, { duration, label, state, stories, ...attributes }: A): DocumentFragment | Text;
-declare const _default: typeof template & {
-    readonly toggle: typeof STORY_PROGRESS_TOGGLE;
-};
-export default _default;
-export type { State as StoryProgressState, Story as StoryProgressStory };

package/build/components/story-progress/index.js

@@ -1,196 +0,0 @@
-import * as template_u1 from '@esportsplus/template';
-import * as reactivity_u0 from '@esportsplus/reactivity';
-import { effect } from '@esportsplus/reactivity';
-import './scss/index.scss';
-const template_1iqg61i3 = template_u1.template(`<div aria-roledescription='stories' class='story-progress' role='region' tabindex='0'><div aria-hidden='true' class='story-progress-bars'></div><div class='story-progress-header'><span class='story-progress-count'></span><button class='story-progress-toggle ' type='button'><svg aria-hidden='true' class='story-progress-pause' fill='currentColor' viewBox='0 0 16 16'><rect height='10' rx='1' width='2.5' x='4' y='3' /><rect height='10' rx='1' width='2.5' x='9.5' y='3' /></svg><svg aria-hidden='true' class='story-progress-play' fill='currentColor' viewBox='0 0 16 16'><path d='M5.5 3.4v9.2a.6.6 0 0 0 .9.5l7-4.6a.6.6 0 0 0 0-1L6.4 2.9a.6.6 0 0 0-.9.5Z' /></svg></button></div><div class='story-progress-stories '><!--$--><p class='story-progress-sr'></p></div><div class='story-progress-zones'><button aria-label='Previous story' tabindex='-1' type='button'></button><button aria-label='Next story' tabindex='-1' type='button'>`);
-const template_1iqg61ie = template_u1.template(`<span class='story-progress-bar'><span class='story-progress-fill'>`);
-const template_1iqg61ih = template_u1.template(`<div aria-hidden='true' class='story-progress-story '><span class='story-progress-value'></span><span class='story-progress-caption'>`);
-class ReactiveObject_1iqg61i0 extends reactivity_u0.ReactiveObject {
-    #index = this[reactivity_u0.SIGNAL](0);
-    #paused = this[reactivity_u0.SIGNAL](false);
-    constructor() {
-        super(null);
-    }
-    get index() {
-        return reactivity_u0.read(this.#index);
-    }
-    set index(_v0) {
-        reactivity_u0.write(this.#index, _v0);
-    }
-    get paused() {
-        return reactivity_u0.read(this.#paused);
-    }
-    set paused(_v1) {
-        reactivity_u0.write(this.#paused, _v1);
-    }
-}
-class ReactiveObject_1iqg61i1 extends reactivity_u0.ReactiveObject {
-    #held = this[reactivity_u0.SIGNAL](false);
-    #hidden = this[reactivity_u0.SIGNAL](false);
-    #manual = this[reactivity_u0.SIGNAL](false);
-    #pressing = this[reactivity_u0.SIGNAL](false);
-    constructor() {
-        super(null);
-    }
-    get held() {
-        return reactivity_u0.read(this.#held);
-    }
-    set held(_v0) {
-        reactivity_u0.write(this.#held, _v0);
-    }
-    get hidden() {
-        return reactivity_u0.read(this.#hidden);
-    }
-    set hidden(_v1) {
-        reactivity_u0.write(this.#hidden, _v1);
-    }
-    get manual() {
-        return reactivity_u0.read(this.#manual);
-    }
-    set manual(_v2) {
-        reactivity_u0.write(this.#manual, _v2);
-    }
-    get pressing() {
-        return reactivity_u0.read(this.#pressing);
-    }
-    set pressing(_v3) {
-        reactivity_u0.write(this.#pressing, _v3);
-    }
-}
-const STORY_PROGRESS_TOGGLE = Symbol.for('@esportsplus/ui/story-progress.toggle');
-const DURATION = 4000;
-const HOLD = 200;
-function template({ duration = DURATION, label = 'Stories', state = new ReactiveObject_1iqg61i0(), stories, ...attributes }) {
-    let bound = this?.attributes, count = stories.length, fills = [], hold, stopPause, stopTimer, timer, view = new ReactiveObject_1iqg61i1();
-    function go(step) {
-        view.manual = true;
-        state.index = (state.index + step + count) % count;
-    }
-    function keydown(e) {
-        if (e.key === 'ArrowRight') {
-            go(1);
-        }
-        else if (e.key === 'ArrowLeft') {
-            go(-1);
-        }
-        else if (e.key === ' ' && !e.repeat) {
-            state.paused = !state.paused;
-        }
-        else {
-            return;
-        }
-        e.preventDefault();
-    }
-    function paused() {
-        return view.pressing || state.paused || view.hidden;
-    }
-    function release(navigate, e) {
-        clearTimeout(hold);
-        view.pressing = false;
-        if (view.held) {
-            view.held = false;
-            return;
-        }
-        if (!navigate || !e) {
-            return;
-        }
-        let box = e.currentTarget.getBoundingClientRect();
-        go(e.clientX < box.left + box.width / 2 ? -1 : 1);
-    }
-    return (() => {
-        let root_1iqg61i2 = template_1iqg61i3(), element_1iqg61i4 = root_1iqg61i2.firstChild, element_1iqg61i5 = element_1iqg61i4.firstElementChild, element_1iqg61i6 = element_1iqg61i5.nextElementSibling.firstElementChild, element_1iqg61i7 = element_1iqg61i6.nextElementSibling, element_1iqg61i8 = element_1iqg61i5.nextElementSibling.nextElementSibling, element_1iqg61i9 = element_1iqg61i8.firstChild, element_1iqg61ia = element_1iqg61i8.firstElementChild, element_1iqg61ib = element_1iqg61i8.nextElementSibling.firstElementChild, element_1iqg61ic = element_1iqg61ib.nextElementSibling;
-        template_u1.setProperty(element_1iqg61i4, 'aria-label', label);
-        template_u1.setProperties(element_1iqg61i4, bound);
-        template_u1.setProperties(element_1iqg61i4, attributes);
-        template_u1.onconnect(element_1iqg61i4, (element) => {
-            fills = Array.from(element.querySelectorAll('.story-progress-fill'));
-            stopTimer = effect(() => {
-                let fill = fills[state.index];
-                timer?.cancel();
-                if (!fill) {
-                    return;
-                }
-                let animation = fill.animate([{ transform: 'scaleX(0)' }, { transform: 'scaleX(1)' }], { duration, easing: 'linear', fill: 'forwards' });
-                if (paused()) {
-                    animation.pause();
-                }
-                animation.onfinish = () => {
-                    view.manual = false;
-                    state.index = (state.index + 1) % count;
-                };
-                timer = animation;
-            });
-            stopPause = effect(() => {
-                let stop = paused();
-                if (!timer) {
-                    return;
-                }
-                if (stop) {
-                    timer.pause();
-                }
-                else if (timer.playState === 'paused') {
-                    timer.play();
-                }
-            });
-        });
-        template_u1.delegate(element_1iqg61i4, 'contextmenu', (e) => {
-            e.preventDefault();
-        });
-        template_u1.ondisconnect(element_1iqg61i4, () => {
-            clearTimeout(hold);
-            stopPause?.();
-            stopTimer?.();
-            timer?.cancel();
-        });
-        template_u1.ondocument(element_1iqg61i4, 'visibilitychange', () => {
-            view.hidden = document.hidden;
-        });
-        template_u1.delegate(element_1iqg61i4, 'keydown', keydown);
-        template_u1.delegate(element_1iqg61i4, 'pointercancel', () => release(false));
-        template_u1.delegate(element_1iqg61i4, 'pointerdown', (e) => {
-            if (e.button !== 0) {
-                return;
-            }
-            e.currentTarget.setPointerCapture(e.pointerId);
-            view.pressing = true;
-            hold = setTimeout(() => {
-                view.held = true;
-            }, HOLD);
-        });
-        template_u1.delegate(element_1iqg61i4, 'pointerup', (e) => release(true, e));
-        template_u1.slot(element_1iqg61i5, stories.map((_, i) => {
-            let root_1iqg61id = template_1iqg61ie(), element_1iqg61if = root_1iqg61id.firstChild.firstElementChild;
-            template_u1.setList(element_1iqg61if, 'style', () => `transform: scaleX(${i < state.index ? 1 : 0})`);
-            return root_1iqg61id;
-        }), 1);
-        new template_u1.EffectSlot(element_1iqg61i6, () => `${state.index + 1} / ${count}`, 1);
-        template_u1.setProperty(element_1iqg61i7, 'aria-label', () => state.paused ? 'Play' : 'Pause');
-        template_u1.setList(element_1iqg61i7, 'class', () => (view.held || state.paused) && '--paused');
-        template_u1.setProperties(element_1iqg61i7, bound?.[STORY_PROGRESS_TOGGLE]);
-        template_u1.setProperties(element_1iqg61i7, attributes[STORY_PROGRESS_TOGGLE]);
-        template_u1.delegate(element_1iqg61i7, 'click', () => {
-            state.paused = !state.paused;
-        });
-        template_u1.delegate(element_1iqg61i7, 'keydown', (e) => {
-            if (e.key !== ' ' && e.key !== 'Enter') {
-                keydown(e);
-            }
-        });
-        template_u1.delegate(element_1iqg61i7, 'pointerdown', () => { });
-        template_u1.delegate(element_1iqg61i7, 'pointerup', () => { });
-        template_u1.setList(element_1iqg61i8, 'class', () => (view.held || state.paused) && '--dimmed');
-        template_u1.slot(element_1iqg61i9, stories.map((story, i) => {
-            let root_1iqg61ig = template_1iqg61ih(), element_1iqg61ii = root_1iqg61ig.firstChild, element_1iqg61ij = element_1iqg61ii.firstElementChild, element_1iqg61ik = element_1iqg61ij.nextElementSibling;
-            template_u1.setList(element_1iqg61ii, 'class', () => state.index === i && '--active');
-            template_u1.slot(element_1iqg61ij, story.value, 1);
-            template_u1.slot(element_1iqg61ik, story.caption, 1);
-            return root_1iqg61ig;
-        }));
-        template_u1.setProperty(element_1iqg61ia, 'aria-live', () => view.manual ? 'polite' : 'off');
-        new template_u1.EffectSlot(element_1iqg61ia, () => `${stories[state.index].value}. ${stories[state.index].caption}`, 1);
-        template_u1.delegate(element_1iqg61ib, 'click', (e) => e.detail === 0 && go(-1));
-        template_u1.delegate(element_1iqg61ic, 'click', (e) => e.detail === 0 && go(1));
-        return root_1iqg61i2;
-    })();
-}
-export default Object.assign(template, { toggle: STORY_PROGRESS_TOGGLE });

package/build/components/story-progress/scss/index.scss

@@ -1,2 +0,0 @@
-@layer components {.story-progress{--background:var(--color-grey-400);--bar-color:oklch(from var(--color-text-500) l c h / .15);--bar-height:3px;--box-shadow:0 0 0 var(--border-width-400) oklch(from var(--color-black-500) l c h / .06), 0 1px 2px oklch(from var(--color-black-500) l c h / .06), 0 6px 16px -6px oklch(from var(--color-black-500) l c h / .12);--color:var(--color-text-500);--dim-opacity:.6;--ease-out:cubic-bezier(.23, 1, .32, 1);--fill-color:var(--color-text-500);--focus-ring-color:oklch(from var(--color-text-500) l c h / .38);--height:480px;--max-width:320px;--muted-color:var(--color-text-300);--radius:24px;--spring:linear(0, .0575, .1803, .3208, .4551, .5729, .6711, .7501, .8122, .8601, .8966, .924, .9445, .9596, .9708, .9789, .9848, .9891, .9922, .9944, .996, .9972, .998, .9986, 1);--value-font-size:72px;background:var(--background);border-radius:var(--radius);box-shadow:var(--box-shadow);color:var(--color);height:var(--height);touch-action:manipulation;-webkit-user-select:none;user-select:none;width:min(var(--max-width), 100%);outline:none;flex-direction:column;display:flex;position:relative;overflow:hidden}.story-progress:focus-visible{outline:2px solid var(--focus-ring-color);outline-offset:2px}.story-progress-bar{background:var(--bar-color);height:var(--bar-height);border-radius:999px;flex:1;overflow:hidden}.story-progress-bars{gap:4px;padding:12px 12px 0;display:flex}.story-progress-caption{color:var(--muted-color);text-wrap:pretty;font-size:15px}.story-progress-count{color:var(--muted-color);font-variant-numeric:tabular-nums;font-size:12px}.story-progress-fill{background:var(--fill-color);transform-origin:0;border-radius:999px;height:100%;display:block}.story-progress-header{justify-content:space-between;align-items:center;height:44px;padding:0 16px;display:flex}.story-progress-pause,.story-progress-play{height:16px;transition:filter .3s var(--spring), opacity .3s var(--spring), scale .3s var(--spring);grid-area:1/1;width:16px}.story-progress-play,.story-progress-toggle.--paused .story-progress-pause{filter:blur(4px);opacity:0;scale:.25}.story-progress-toggle.--paused .story-progress-play{filter:blur();opacity:1;scale:1}.story-progress-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:0;position:absolute;overflow:hidden}.story-progress-stories{flex:1;transition:opacity .2s ease-out;position:relative}.story-progress-stories.--dimmed{opacity:var(--dim-opacity)}.story-progress-story{filter:blur(4px);opacity:0;transition:filter .15s var(--ease-out), opacity .15s var(--ease-out);flex-direction:column;justify-content:flex-end;gap:8px;padding:24px;display:flex;position:absolute;inset:0}.story-progress-story.--active{filter:blur();opacity:1;transition:filter .25s var(--ease-out), opacity .25s var(--ease-out)}.story-progress-toggle{color:var(--muted-color);cursor:pointer;background:0 0;border:0;border-radius:999px;outline:none;place-items:center;width:40px;height:40px;margin-right:-8px;padding:0;transition:color .15s ease-out,scale .15s ease-out;display:grid}.story-progress-toggle:active{scale:.96}.story-progress-toggle:focus-visible{outline:2px solid var(--focus-ring-color)}.story-progress-toggle:hover{color:var(--color)}.story-progress-value{font-size:var(--value-font-size);font-variant-numeric:tabular-nums;letter-spacing:-.025em;font-weight:500;line-height:1}.story-progress-zones{display:flex;position:absolute;inset:60px 0 0}.story-progress-zones button{background:0 0;border:0;outline:none;flex:1;padding:0}@media (prefers-reduced-motion:reduce){.story-progress-play,.story-progress-toggle.--paused .story-progress-pause,.story-progress-story{filter:none}.story-progress-pause,.story-progress-play{transition:opacity .3s var(--spring)}.story-progress-toggle{transition:color .15s ease-out}}}
-/*$vite$:1*/

package/build/components/swipe-deck/index.d.ts

@@ -1,19 +0,0 @@
-import { type Attributes, type Renderable } from '@esportsplus/template';
-import './scss/index.scss';
-type Choice = 'left' | 'right';
-export default _default;
-declare function _default<T>({ emptyLabel, flick, itemLabel, items, label, leftLabel, onDecide, onUndo, peek, rightLabel, steps, threshold, undoLabel, ...attributes }: Attributes & {
-    emptyLabel?: string;
-    flick?: number;
-    itemLabel: (item: T) => string;
-    items: readonly T[];
-    label?: string;
-    leftLabel?: string;
-    onDecide?: (item: T, choice: Choice) => void;
-    onUndo?: (item: T) => void;
-    peek?: number;
-    rightLabel?: string;
-    steps?: number;
-    threshold?: number;
-    undoLabel?: string;
-}, content: (item: T) => Renderable<unknown>): DocumentFragment | Text;