@esportsplus/ui 0.56.4 → 0.57.0

package/storage/svg/zoom-in.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="7" cy="7" r="4.25"/><path d="m10.25 10.25 3 3M7 5.25v3.5M5.25 7h3.5"/></svg>

package/storage/svg/zoom-out.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="7" cy="7" r="4.25"/><path d="m10.25 10.25 3 3M5.25 7h3.5"/></svg>

package/tokens.scss

@@ -1,2 +1,2 @@
 // Dart sass doesn't support changing root directory for the package to 'src'
-@forward './src/tokens';
+@forward './src/tokens/scss';

package/vite.config.ts

@@ -1,9 +1,49 @@
 import { glob } from 'glob';
-import { defineConfig } from 'vite';
+import { defineConfig, type Plugin } from 'vite';
+import { resolve } from 'path';
 import autoprefixer from 'autoprefixer';
 import shelljs from 'shelljs';
 
 
+const BACKSLASHES = /\\/g;
+
+
+// Every stylesheet compiled from the library's source sits in the cascade layer its top-level folder names, in the
+// order 'layer.scss' declares. Wrapped as it compiles rather than once bundled, so the docs, which build from source,
+// layer exactly as the published files do; their own styles, outside it, stay unlayered and override the library.
+const LAYERS = ['components', 'css-utilities', 'normalize', 'themes'];
+
+// Minification only keeps '/*! ... */' license comments at the top level, so they stay outside the layer.
+const LICENSE = /^(?:\s*\/\*![\s\S]*?\*\/)+/;
+
+// These imports get the file's source or address as a module (the docs show source with '?raw'), not compiled CSS.
+const NOT_CSS = /[?&](?:raw|sharedworker|url|worker)\b/;
+
+const SOURCE = resolve(import.meta.dirname, 'src').replace(BACKSLASHES, '/') + '/';
+
+
+const layers: Plugin = {
+    name: '@esportsplus/ui-layers',
+    transform(code, id) {
+        let path = id.split('?')[0].replace(BACKSLASHES, '/');
+
+        if (!path.endsWith('.scss') || !path.startsWith(SOURCE) || NOT_CSS.test(id)) {
+            return;
+        }
+
+        let layer = path.slice(SOURCE.length).split('/')[0];
+
+        if (!LAYERS.includes(layer)) {
+            return;
+        }
+
+        let license = code.match(LICENSE)?.[0] ?? '';
+
+        return { code: `${license}@layer ${layer} {${code.slice(license.length)}}`, map: null };
+    }
+};
+
+
 export default defineConfig(() => {
     return {
         base: './',
@@ -27,57 +67,12 @@ export default defineConfig(() => {
                     },
                 },
                 plugins: [
-                    {
-                        name: '@esportsplus/ui-layers',
-                        generateBundle(_, bundle) {
-                            for (let filename in bundle) {
-                                let file = bundle[filename];
-
-                                if (
-                                    !filename.endsWith('.scss') ||
-                                    file.type !== 'asset' ||
-                                    typeof file.source !== 'string'
-                                ) {
-                                    continue;
-                                }
-
-                                let layer: string,
-                                    segments = file.source.split('\n'),
-                                    // Vite appends a value on bundle
-                                    vite = segments.pop();
-
-                                if (filename.startsWith('css-utilities')) {
-                                    layer = 'css-utilities';
-                                }
-                                else if (filename.startsWith('components')) {
-                                    layer = 'components';
-                                }
-                                else if (filename.startsWith('themes')) {
-                                    layer = 'themes';
-                                }
-                                else if (filename.startsWith('normalize')) {
-                                    layer = 'normalize';
-                                }
-                                else {
-                                    continue;
-                                }
-
-                                file.source = `@layer ${layer} {${segments.join('\n')}}\n${vite}`;
-                            }
-                        }
-                    },
                     {
                         name: '@esportsplus/ui-assets-copy',
                         writeBundle() {
-                            let directories = glob.sync('./src/components/*/svg/');
-
                             for (let license of glob.sync('./src/css-utilities/font/*/OFL.txt')) {
                                 shelljs.cp(license, license.replace('src', 'build'));
                             }
-
-                            for (let dir of directories) {
-                                shelljs.cp('-rf', dir, dir.replace('src', 'build'));
-                            }
                         }
                     }
                 ]
@@ -91,5 +86,11 @@ export default defineConfig(() => {
             },
             transformer: 'lightningcss'
         },
+        plugins: [
+            layers
+        ]
     };
 });
+
+
+export { layers };

package/build/components/accordion/more.d.ts

@@ -1,20 +0,0 @@
-import * as template_u1 from '@esportsplus/template';
-import { type Attributes, type Renderable } from '@esportsplus/template';
-declare const MORE_TRIGGER: unique symbol;
-type A = Attributes & {
-    [MORE_TRIGGER]?: Attributes;
-    label?: string;
-    less?: Renderable<unknown>;
-    lines?: number;
-    maxHeight?: number;
-    more?: Renderable<unknown>;
-    onconnect?: never;
-    ondisconnect?: never;
-    state?: {
-        active: boolean;
-    };
-};
-declare const _default: template_u1.Factory<A, Renderable<any>, Renderable<any>, {
-    readonly trigger: typeof MORE_TRIGGER;
-}>;
-export default _default;

package/build/components/accordion/more.js

@@ -1,76 +0,0 @@
-import * as reactivity_u0 from '@esportsplus/reactivity';
-import * as template_u1 from '@esportsplus/template';
-import { component } from '@esportsplus/template';
-const template_1u70dx03 = template_u1.template(`<div class='accordion-more   '><div class='accordion-more-content'><div class='accordion-more-body'></div></div><button class='accordion-more-trigger' type='button'><span class='accordion-more-trigger-label'><span></span><span></span></span><svg class='accordion-more-trigger-icon' aria-hidden='true' viewBox='0 0 12 12'><path d='M3 4.5 6 7.5 9 4.5' />`);
-class ReactiveObject_1u70dx00 extends reactivity_u0.ReactiveObject {
-    #active = this[reactivity_u0.SIGNAL](false);
-    constructor() {
-        super(null);
-    }
-    get active() {
-        return reactivity_u0.read(this.#active);
-    }
-    set active(_v0) {
-        reactivity_u0.write(this.#active, _v0);
-    }
-}
-class ReactiveObject_1u70dx01 extends reactivity_u0.ReactiveObject {
-    #clamped = this[reactivity_u0.SIGNAL](false);
-    #height = this[reactivity_u0.SIGNAL](0);
-    constructor() {
-        super(null);
-    }
-    get clamped() {
-        return reactivity_u0.read(this.#clamped);
-    }
-    set clamped(_v0) {
-        reactivity_u0.write(this.#clamped, _v0);
-    }
-    get height() {
-        return reactivity_u0.read(this.#height);
-    }
-    set height(_v1) {
-        reactivity_u0.write(this.#height, _v1);
-    }
-}
-const MORE_TRIGGER = Symbol.for('@esportsplus/ui/accordion.more.trigger');
-export default component(({ label = 'Expanded content', less = 'Show less', lines = 3, maxHeight = 320, more = 'Show more', state = new ReactiveObject_1u70dx00(), ...attributes }, content) => {
-    let id = `accordion-more-${crypto.randomUUID()}`, measured = new ReactiveObject_1u70dx01(), observer, scrollable = () => state.active && measured.height > maxHeight;
-    return (() => {
-        let root_1u70dx02 = template_1u70dx03(), element_1u70dx04 = root_1u70dx02.firstChild, element_1u70dx05 = element_1u70dx04.firstElementChild, element_1u70dx06 = element_1u70dx05.firstElementChild, element_1u70dx07 = element_1u70dx05.nextElementSibling, element_1u70dx08 = element_1u70dx07.firstElementChild.firstElementChild, element_1u70dx09 = element_1u70dx08.nextElementSibling;
-        template_u1.setList(element_1u70dx04, 'class', () => state.active && '--active');
-        template_u1.setList(element_1u70dx04, 'class', () => measured.clamped && '--clamped');
-        template_u1.setList(element_1u70dx04, 'class', () => scrollable() && '--scrollable');
-        template_u1.setProperties(element_1u70dx04, attributes);
-        template_u1.onconnect(element_1u70dx04, (element) => {
-            let body = element.querySelector('.accordion-more-body');
-            observer = new ResizeObserver(() => {
-                let computed = getComputedStyle(body), height = body.offsetHeight, line = parseFloat(computed.lineHeight) || parseFloat(computed.fontSize) * 1.2;
-                measured.clamped = height > Math.ceil(line * lines);
-                measured.height = height;
-            });
-            observer.observe(body);
-        });
-        template_u1.ondisconnect(element_1u70dx04, () => {
-            observer?.disconnect();
-        });
-        template_u1.setList(element_1u70dx04, 'style', () => `${measured.height ? `--height: ${measured.height}px; ` : ''}--lines: ${lines}; --max-height: ${maxHeight}px;`);
-        template_u1.setProperty(element_1u70dx05, 'id', id);
-        template_u1.setProperty(element_1u70dx05, 'aria-label', () => scrollable() && label);
-        template_u1.setProperty(element_1u70dx05, 'role', () => scrollable() && 'region');
-        template_u1.setProperty(element_1u70dx05, 'tabindex', () => scrollable() && '0');
-        template_u1.slot(element_1u70dx06, content, 1);
-        template_u1.setProperty(element_1u70dx07, 'aria-controls', id);
-        template_u1.setProperties(element_1u70dx07, attributes[MORE_TRIGGER]);
-        template_u1.setProperty(element_1u70dx07, 'aria-expanded', () => state.active ? 'true' : 'false');
-        template_u1.setProperty(element_1u70dx07, 'disabled', () => !measured.clamped);
-        template_u1.delegate(element_1u70dx07, 'click', () => {
-            state.active = !state.active;
-        });
-        template_u1.setProperty(element_1u70dx08, 'aria-hidden', () => state.active && 'true');
-        template_u1.slot(element_1u70dx08, more, 1);
-        template_u1.setProperty(element_1u70dx09, 'aria-hidden', () => !state.active && 'true');
-        template_u1.slot(element_1u70dx09, less, 1);
-        return root_1u70dx02;
-    })();
-}, { trigger: MORE_TRIGGER });

package/build/components/anchor/scss/index.scss

@@ -1,2 +0,0 @@
-@layer components {.anchor{--margin-horizontal:var(--size-400);--margin-vertical:var(--size-400);max-height:calc(var(--max-height,100%) - var(--margin-vertical) * 2);max-width:calc(var(--max-width,100%) - var(--margin-horizontal) * 2);transition:opacity var(--transition-duration) var(--transition-timing-function), translate var(--transition-duration) var(--transition-timing-function);z-index:9;position:absolute}.anchor:not(.--active){opacity:0}.anchor:not(.--active),.anchor:not(.--active) *{pointer-events:none}.anchor--n,.anchor--s{right:50%;translate:50%}.anchor--ne,.anchor--nw{top:var(--margin-vertical)}.anchor--se,.anchor--sw{bottom:var(--margin-vertical)}.anchor--ne,.anchor--se{right:var(--margin-horizontal)}.anchor--nw,.anchor--sw{left:var(--margin-horizontal)}.anchor--n{top:var(--margin-vertical)}.anchor--s{bottom:var(--margin-vertical)}}
-/*$vite$:1*/

package/build/components/announcement-banner/index.d.ts

@@ -1,33 +0,0 @@
-import { type Attributes, type Renderable } from '@esportsplus/template';
-import './scss/index.scss';
-type A = Attributes & {
-    [ANNOUNCEMENT_BANNER_CONTENT]?: Attributes;
-    [ANNOUNCEMENT_BANNER_DISMISS]?: Attributes;
-    icon?: Renderable<unknown>;
-    label?: string;
-    link?: {
-        href: string;
-        label: string;
-    };
-    ondismiss?: () => void;
-    state?: State;
-};
-type State = {
-    open: boolean;
-};
-declare const ANNOUNCEMENT_BANNER_CONTENT: unique symbol;
-declare const ANNOUNCEMENT_BANNER_DISMISS: unique symbol;
-declare const _default: {
-    (): Renderable<any>;
-    <T extends A>(attributes: T): Renderable<any>;
-    <T extends Renderable<any>>(content: T): Renderable<any>;
-    (attributes: A, content?: Renderable<any>): Renderable<any>;
-    bind(context: {
-        attributes?: Partial<A> | undefined;
-        content?: Renderable<any>;
-    }): any;
-} & {
-    readonly content: typeof ANNOUNCEMENT_BANNER_CONTENT;
-    readonly dismiss: typeof ANNOUNCEMENT_BANNER_DISMISS;
-};
-export default _default;

package/build/components/announcement-banner/index.js

@@ -1,61 +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_0ei75f92 = template_u1.template(`<div class='announcement-banner'><div class='announcement-banner-clip'><section class='announcement-banner-content' tabindex='-1'><!--$--><p class='announcement-banner-text'></p><!--$--><button aria-label='Dismiss announcement' class='button announcement-banner-dismiss' type='button'><svg viewBox='0 0 16 16'><path d='m4.5 4.5 7 7M11.5 4.5l-7 7' />`);
-const template_0ei75f9a = template_u1.template(`<span aria-hidden='true' class='announcement-banner-icon'>`);
-const template_0ei75f9d = template_u1.template(`<a class='announcement-banner-link'>`);
-class ReactiveObject_0ei75f90 extends reactivity_u0.ReactiveObject {
-    #open = this[reactivity_u0.SIGNAL](true);
-    constructor() {
-        super(null);
-    }
-    get open() {
-        return reactivity_u0.read(this.#open);
-    }
-    set open(_v0) {
-        reactivity_u0.write(this.#open, _v0);
-    }
-}
-const ANNOUNCEMENT_BANNER_CONTENT = Symbol.for('@esportsplus/ui/announcement-banner.content');
-const ANNOUNCEMENT_BANNER_DISMISS = Symbol.for('@esportsplus/ui/announcement-banner.dismiss');
-export default Object.assign(component(function ({ icon, label = 'Announcement', link, ondismiss, state = new ReactiveObject_0ei75f90(), ...attributes }, content) {
-    let opened = false, returning = false;
-    return (() => {
-        let root_0ei75f91 = template_0ei75f92(), element_0ei75f93 = root_0ei75f91.firstChild, element_0ei75f94 = element_0ei75f93.firstElementChild.firstElementChild, element_0ei75f95 = element_0ei75f94.firstChild, element_0ei75f96 = element_0ei75f94.firstElementChild, element_0ei75f97 = element_0ei75f95.nextSibling.nextSibling, element_0ei75f98 = element_0ei75f96.nextElementSibling;
-        template_u1.setProperties(element_0ei75f93, this?.attributes);
-        template_u1.setProperties(element_0ei75f93, attributes);
-        template_u1.setList(element_0ei75f93, 'class', () => {
-            if (state.open) {
-                opened = true;
-            }
-            else if (opened) {
-                returning = true;
-            }
-            return `${state.open ? '--active' : ''} ${returning ? 'announcement-banner--returning' : ''}`;
-        });
-        template_u1.setProperty(element_0ei75f94, 'aria-label', label);
-        template_u1.setProperty(element_0ei75f94, 'inert', () => !state.open);
-        template_u1.setProperties(element_0ei75f94, this?.attributes?.[ANNOUNCEMENT_BANNER_CONTENT]);
-        template_u1.setProperties(element_0ei75f94, attributes[ANNOUNCEMENT_BANNER_CONTENT]);
-        template_u1.slot(element_0ei75f95, icon && (() => {
-            let root_0ei75f99 = template_0ei75f9a(), element_0ei75f9b = root_0ei75f99.firstChild;
-            template_u1.slot(element_0ei75f9b, icon, 1);
-            return root_0ei75f99;
-        })());
-        template_u1.slot(element_0ei75f96, content, 1);
-        template_u1.slot(element_0ei75f97, link && (() => {
-            let root_0ei75f9c = template_0ei75f9d(), element_0ei75f9e = root_0ei75f9c.firstChild;
-            template_u1.setProperty(element_0ei75f9e, 'href', link.href);
-            template_u1.slot(element_0ei75f9e, link.label, 1);
-            return root_0ei75f9c;
-        })());
-        template_u1.delegate(element_0ei75f98, 'click', () => {
-            state.open = false;
-            ondismiss?.();
-        });
-        template_u1.setProperties(element_0ei75f98, this?.attributes?.[ANNOUNCEMENT_BANNER_DISMISS]);
-        template_u1.setProperties(element_0ei75f98, attributes[ANNOUNCEMENT_BANNER_DISMISS]);
-        return root_0ei75f91;
-    })();
-}), { content: ANNOUNCEMENT_BANNER_CONTENT, dismiss: ANNOUNCEMENT_BANNER_DISMISS });

package/build/components/announcement-banner/scss/index.scss

@@ -1,2 +0,0 @@
-@layer components {.announcement-banner{--announcement-banner-background:var(--color-text-500);--announcement-banner-color:var(--color-white-300);--announcement-banner-drawer:cubic-bezier(.32, .72, 0, 1);--announcement-banner-ease:cubic-bezier(.23, 1, .32, 1);--announcement-banner-font-size:14px;--announcement-banner-height:44px;--announcement-banner-icon-size:16px}.announcement-banner--blue{--announcement-banner-background:var(--color-blue-400)}.announcement-banner--purple{--announcement-banner-background:var(--color-purple-400)}.announcement-banner{transition:grid-template-rows .24s var(--announcement-banner-drawer) 80ms;grid-template-rows:0fr;display:grid}.announcement-banner-clip{min-height:0;overflow:hidden}.announcement-banner-content{background:var(--announcement-banner-background);color:var(--announcement-banner-color);filter:blur(2px);font-size:var(--announcement-banner-font-size);height:var(--announcement-banner-height);opacity:0;transition:filter .12s var(--announcement-banner-ease), opacity .12s var(--announcement-banner-ease);outline:none;flex-wrap:nowrap;align-items:center;gap:10px;padding-inline:16px 6px;display:flex;translate:0 -100%}.announcement-banner-dismiss.button{--background-default:transparent;--background-hover:color-mix(in oklab, var(--announcement-banner-color) 15%, transparent);--border-radius:999px;--color-default:color-mix(in oklab, var(--announcement-banner-color) 70%, transparent);--color-hover:var(--announcement-banner-color);--padding-horizontal:0px;--padding-vertical:0px;touch-action:manipulation;-webkit-user-select:none;user-select:none;border:0;outline:none;flex-shrink:0;width:32px;height:32px;margin-inline-start:auto;transition:background-color .15s ease-out,color .15s ease-out,scale .15s ease-out}.announcement-banner-dismiss.button:before{content:"";border-radius:999px;position:absolute;inset:-4px}.announcement-banner-dismiss.button:active{scale:.96}.announcement-banner-dismiss.button:focus-visible{outline:2px solid var(--announcement-banner-color)}.announcement-banner-dismiss.button svg{fill:none;height:var(--announcement-banner-icon-size);stroke:currentColor;stroke-linecap:round;stroke-width:1.5px;width:var(--announcement-banner-icon-size)}.announcement-banner-icon{flex-shrink:0;display:flex}.announcement-banner-icon svg{fill:none;height:var(--announcement-banner-icon-size);stroke:currentColor;stroke-linejoin:round;stroke-width:1.5px;width:var(--announcement-banner-icon-size)}.announcement-banner-link{border-radius:var(--border-radius-100);color:inherit;font-weight:var(--font-weight-500);text-decoration:underline;-webkit-text-decoration-color:color-mix(in oklab, var(--announcement-banner-color) 40%, transparent);-webkit-text-decoration-color:color-mix(in oklab, var(--announcement-banner-color) 40%, transparent);text-decoration-color:color-mix(in oklab, var(--announcement-banner-color) 40%, transparent);text-underline-offset:3px;outline:none;flex-shrink:0;transition:text-decoration-color .15s ease-out}.announcement-banner-link:hover{-webkit-text-decoration-color:var(--announcement-banner-color);-webkit-text-decoration-color:var(--announcement-banner-color);text-decoration-color:var(--announcement-banner-color)}.announcement-banner-link:focus-visible{outline:2px solid var(--announcement-banner-color);outline-offset:2px}.announcement-banner-text{text-overflow:ellipsis;white-space:nowrap;flex:0 auto;width:auto;min-width:0;margin:0;overflow:hidden}.announcement-banner--returning .announcement-banner-content{translate:0}.announcement-banner.--active{transition:grid-template-rows .28s var(--announcement-banner-drawer);grid-template-rows:1fr}.announcement-banner.--active .announcement-banner-content{filter:blur();opacity:1;transition:filter .2s var(--announcement-banner-ease), opacity .2s var(--announcement-banner-ease), translate .28s var(--announcement-banner-drawer);translate:0}.announcement-banner.--active.announcement-banner--returning .announcement-banner-content{transition:filter .2s var(--announcement-banner-ease) .12s, opacity .2s var(--announcement-banner-ease) .12s}@media (prefers-reduced-motion:reduce){.announcement-banner,.announcement-banner.--active{transition:none}.announcement-banner .announcement-banner-content,.announcement-banner.--active .announcement-banner-content,.announcement-banner.--active.announcement-banner--returning .announcement-banner-content{filter:none;transition:opacity .2s var(--announcement-banner-ease);translate:0}.announcement-banner-dismiss.button{transition:background-color .15s ease-out,color .15s ease-out}.announcement-banner-dismiss.button:active{scale:1}}}
-/*$vite$:1*/

package/build/components/autosave/index.d.ts

@@ -1,12 +0,0 @@
-import { type Attributes } from '@esportsplus/template';
-import './scss/index.scss';
-type State = {
-    savedAt: number | null;
-    status: Status;
-};
-type Status = 'saved' | 'saving' | 'unsaved';
-export default _default;
-declare function _default({ state, ...attributes }: Attributes & {
-    state?: State;
-}): DocumentFragment | Text;
-export type { State, Status };

package/build/components/autosave/index.js

@@ -1,140 +0,0 @@
-import * as template_u1 from '@esportsplus/template';
-import * as reactivity_u0 from '@esportsplus/reactivity';
-import { effect, onCleanup } from '@esportsplus/reactivity';
-import './scss/index.scss';
-const template_1lhdjr55 = template_u1.template(`<div class='autosave'><span aria-hidden='true' class='autosave-icon'><span class='autosave-dot' style='--i: 0;'></span><span class='autosave-dot' style='--i: 1;'></span><span class='autosave-dot' style='--i: 2;'></span><svg class='autosave-check' viewBox='0 0 16 16'><path d='M3.75 8.25l2.75 2.75 5.75-6' pathLength='1' /></svg></span><span class='autosave-label'></span><span aria-live='polite' class='autosave-announcement'>`);
-const template_1lhdjr5a = template_u1.template(`<span>`);
-class ReactiveObject_1lhdjr50 extends reactivity_u0.ReactiveObject {
-    #savedAt;
-    #status;
-    constructor(_p0, _p1) {
-        super(null);
-        this.#savedAt = this[reactivity_u0.SIGNAL](_p0);
-        this.#status = this[reactivity_u0.SIGNAL](_p1);
-    }
-    get savedAt() {
-        return reactivity_u0.read(this.#savedAt);
-    }
-    set savedAt(_v0) {
-        reactivity_u0.write(this.#savedAt, _v0);
-    }
-    get status() {
-        return reactivity_u0.read(this.#status);
-    }
-    set status(_v1) {
-        reactivity_u0.write(this.#status, _v1);
-    }
-}
-class ReactiveObject_1lhdjr51 extends reactivity_u0.ReactiveObject {
-    #now;
-    constructor(_p0) {
-        super(null);
-        this.#now = this[reactivity_u0.SIGNAL](_p0);
-    }
-    get now() {
-        return reactivity_u0.read(this.#now);
-    }
-    set now(_v0) {
-        reactivity_u0.write(this.#now, _v0);
-    }
-}
-class ReactiveObject_1lhdjr52 extends reactivity_u0.ReactiveObject {
-    #phase = this[reactivity_u0.SIGNAL]('');
-    #text = this[reactivity_u0.SIGNAL]('');
-    constructor() {
-        super(null);
-    }
-    get phase() {
-        return reactivity_u0.read(this.#phase);
-    }
-    set phase(_v0) {
-        reactivity_u0.write(this.#phase, _v0);
-    }
-    get text() {
-        return reactivity_u0.read(this.#text);
-    }
-    set text(_v1) {
-        reactivity_u0.write(this.#text, _v1);
-    }
-}
-class ReactiveObject_1lhdjr53 extends reactivity_u0.ReactiveObject {
-    #phase = this[reactivity_u0.SIGNAL]('');
-    #text = this[reactivity_u0.SIGNAL]('');
-    constructor() {
-        super(null);
-    }
-    get phase() {
-        return reactivity_u0.read(this.#phase);
-    }
-    set phase(_v0) {
-        reactivity_u0.write(this.#phase, _v0);
-    }
-    get text() {
-        return reactivity_u0.read(this.#text);
-    }
-    set text(_v1) {
-        reactivity_u0.write(this.#text, _v1);
-    }
-}
-const MINUTE = 60_000;
-function text({ savedAt, status }, now) {
-    if (status === 'saving') {
-        return 'Saving';
-    }
-    if (status === 'unsaved') {
-        return 'Unsaved changes';
-    }
-    if (savedAt === null) {
-        return 'Saved';
-    }
-    let ago = now - savedAt;
-    if (ago < 45_000) {
-        return 'Saved just now';
-    }
-    if (ago < 60 * MINUTE) {
-        return `Saved ${Math.max(1, Math.floor(ago / MINUTE))} min ago`;
-    }
-    return `Saved at ${new Date(savedAt).toLocaleTimeString([], { hour: 'numeric', minute: '2-digit' })}`;
-}
-export default ({ state = new ReactiveObject_1lhdjr50(null, 'saved'), ...attributes }) => {
-    let clock = new ReactiveObject_1lhdjr51(Date.now()), current = 0, slots = [
-        new ReactiveObject_1lhdjr52(),
-        new ReactiveObject_1lhdjr53()
-    ], stopLabel = effect(() => text(state, clock.now), (value, previous) => {
-        if (previous === undefined) {
-            slots[current].text = value;
-            return;
-        }
-        if (value === previous) {
-            return;
-        }
-        slots[current].phase = 'exit';
-        current = current === 0 ? 1 : 0;
-        slots[current].phase = 'enter';
-        slots[current].text = value;
-    }), stopTick = effect(() => {
-        if (state.status !== 'saved' || state.savedAt === null) {
-            return;
-        }
-        let timer = setInterval(() => clock.now = Date.now(), MINUTE / 2);
-        onCleanup(() => clearInterval(timer));
-    });
-    onCleanup(() => {
-        stopLabel();
-        stopTick();
-    });
-    return (() => {
-        let root_1lhdjr54 = template_1lhdjr55(), element_1lhdjr56 = root_1lhdjr54.firstChild, element_1lhdjr57 = element_1lhdjr56.firstElementChild.nextElementSibling, element_1lhdjr58 = element_1lhdjr57.nextElementSibling;
-        template_u1.setProperties(element_1lhdjr56, attributes);
-        template_u1.setProperty(element_1lhdjr56, 'data-status', () => state.status);
-        template_u1.slot(element_1lhdjr57, slots.map((slot) => {
-            let root_1lhdjr59 = template_1lhdjr5a(), element_1lhdjr5b = root_1lhdjr59.firstChild;
-            template_u1.setProperty(element_1lhdjr5b, 'aria-hidden', () => slot.phase === 'exit' ? 'true' : 'false');
-            template_u1.setProperty(element_1lhdjr5b, 'data-phase', () => slot.phase);
-            new template_u1.EffectSlot(element_1lhdjr5b, () => slot.text, 1);
-            return root_1lhdjr59;
-        }), 1);
-        new template_u1.EffectSlot(element_1lhdjr58, () => state.status === 'saved' && state.savedAt !== null ? 'All changes saved' : '', 1);
-        return root_1lhdjr54;
-    })();
-};

package/build/components/autosave/scss/index.scss

@@ -1,2 +0,0 @@
-@layer components {.autosave{--blur:3px;--check-color:var(--color-text-500);--check-delay:.12s;--check-duration:.35s;--check-stroke-width:1.6;--color:var(--color-text-300);--dot-gap:calc(var(--icon-size) * .3125);--dot-size:calc(var(--icon-size) / 4);--enter-duration:.22s;--exit-duration:.12s;--font-size:var(--font-size-300);--gap:.5rem;--icon-size:1.25em;--move-duration:.4s;--pulse-duration:1s;--pulse-stagger:.16s;--shift:3px;--timing-function:cubic-bezier(.23, 1, .32, 1);--width:11em;color:var(--color);font-size:var(--font-size);align-items:center;gap:var(--gap);white-space:nowrap;width:var(--width);flex-shrink:0;display:flex}.autosave-announcement{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.autosave-check{fill:none;opacity:0;height:100%;stroke:var(--check-color);stroke-dasharray:1;stroke-dashoffset:1px;stroke-linecap:round;stroke-linejoin:round;stroke-width:var(--check-stroke-width);transition:opacity var(--exit-duration) var(--timing-function), stroke-dashoffset var(--exit-duration) var(--timing-function);width:100%;position:absolute;inset:0}.autosave-dot{height:var(--dot-size);opacity:0;transition:opacity var(--move-duration) var(--timing-function), scale var(--move-duration) var(--timing-function), translate var(--move-duration) var(--timing-function);width:var(--dot-size);position:absolute;scale:.5}.autosave-dot:before{content:"";background:currentColor;border-radius:100%;width:100%;height:100%;display:block}.autosave-icon{height:var(--icon-size);width:var(--icon-size);flex-shrink:0;place-items:center;display:grid;position:relative}.autosave-label{flex:1;min-width:0;display:grid}.autosave-label [data-phase=enter]{animation:autosave-enter var(--enter-duration) var(--timing-function) both}.autosave-label [data-phase=exit]{animation:autosave-exit var(--exit-duration) var(--timing-function) both;opacity:0}.autosave-label span{grid-area:1/1}.autosave[data-status=saved] .autosave-check{opacity:1;stroke-dashoffset:0;transition:opacity var(--check-duration) var(--timing-function) var(--check-delay), stroke-dashoffset var(--check-duration) var(--timing-function) var(--check-delay)}.autosave[data-status=saving] .autosave-dot{opacity:1;scale:1;translate:calc((var(--i) - 1) * var(--dot-gap))}.autosave[data-status=saving] .autosave-dot:before{animation:autosave-pulse var(--pulse-duration) ease-in-out calc(var(--i) * var(--pulse-stagger)) infinite}.autosave[data-status=unsaved] .autosave-dot:nth-child(2){opacity:1;scale:1.5}@media (prefers-reduced-motion:reduce){.autosave-check,.autosave-dot,.autosave[data-status=saved] .autosave-check{transition:none}.autosave-label [data-phase],.autosave[data-status=saving] .autosave-dot:before{animation:none}}@keyframes autosave-enter{0%{filter:blur(var(--blur));opacity:0;translate:0 var(--shift)}}@keyframes autosave-exit{0%{opacity:1}to{filter:blur(var(--blur));opacity:0;translate:0 calc(var(--shift) * -1)}}@keyframes autosave-pulse{0%,to{opacity:.25}40%{opacity:1}}}
-/*$vite$:1*/

package/build/components/back-to-top/index.d.ts

@@ -1,16 +0,0 @@
-import { type Attributes } from '@esportsplus/template';
-import './scss/index.scss';
-type A = Attributes & {
-    showAfter?: number;
-    state?: State;
-    target?: HTMLElement | (() => HTMLElement | null | undefined);
-};
-type State = {
-    jump: number;
-    visible: boolean;
-};
-declare function template(this: {
-    attributes?: Partial<A>;
-} | void, { showAfter, state, target, ...attributes }: A): DocumentFragment | Text;
-export default template;
-export type { State };