@esportsplus/ui 0.51.6 → 0.53.0

package/build/components/highlight/index.js

@@ -1,24 +1,24 @@
-import * as template_0ff113fe0a6246fbbfe92857b2a0303c1 from '@esportsplus/template';
-import * as reactivity_0ff113fe0a6246fbbfe92857b2a0303c0 from '@esportsplus/reactivity';
+import * as template_u1 from '@esportsplus/template';
+import { component } from '@esportsplus/template';
+import * as reactivity_u0 from '@esportsplus/reactivity';
 import { omit } from '@esportsplus/utilities';
-import template from '../../components/template/index.js';
 import './scss/index.scss';
-const template_0ff113fe0a6246fbbfe92857b2a0303c1q = template_0ff113fe0a6246fbbfe92857b2a0303c1.template(`<div class='highlight'>`);
-class ReactiveObject_0ff113fe0a6246fbbfe92857b2a0303c1o extends reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.ReactiveObject {
-    #highlight = this[reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.SIGNAL](0);
+const template_0k38r592 = template_u1.template(`<div class='highlight' >`);
+class ReactiveObject_0k38r590 extends reactivity_u0.ReactiveObject {
+    #highlight = this[reactivity_u0.SIGNAL](0);
     constructor() {
         super(null);
     }
     get highlight() {
-        return reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.read(this.#highlight);
+        return reactivity_u0.read(this.#highlight);
     }
     set highlight(_v0) {
-        reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.write(this.#highlight, _v0);
+        reactivity_u0.write(this.#highlight, _v0);
     }
 }
 const OMIT = ['background'];
 let key = Symbol(), observer = null;
-export default template.factory((attributes, content) => {
+export default component((attributes, content) => {
     if (observer === null) {
         observer = new IntersectionObserver((entries) => {
             let disconnected = 0, n = entries.length;
@@ -38,19 +38,19 @@ export default template.factory((attributes, content) => {
             }
         }, { threshold: 1 });
     }
-    let state = new ReactiveObject_0ff113fe0a6246fbbfe92857b2a0303c1o();
+    let state = new ReactiveObject_0k38r590();
     return (() => {
-        let root_0ff113fe0a6246fbbfe92857b2a0303c1p = template_0ff113fe0a6246fbbfe92857b2a0303c1q(), element_0ff113fe0a6246fbbfe92857b2a0303c1r = root_0ff113fe0a6246fbbfe92857b2a0303c1p.firstChild;
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperties(element_0ff113fe0a6246fbbfe92857b2a0303c1r, omit(attributes, OMIT));
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.onrender(element_0ff113fe0a6246fbbfe92857b2a0303c1r, (element) => {
+        let root_0k38r591 = template_0k38r592(), element_0k38r593 = root_0k38r591.firstChild;
+        template_u1.setProperties(element_0k38r593, omit(attributes, OMIT));
+        template_u1.onrender(element_0k38r593, (element) => {
             element[key] = state;
             observer.observe(element);
         });
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setList(element_0ff113fe0a6246fbbfe92857b2a0303c1r, 'style', [
+        template_u1.setList(element_0k38r593, 'style', [
             () => `--highlight: ${state.highlight}`,
             `--background: ${attributes.background}`,
         ]);
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.slot(element_0ff113fe0a6246fbbfe92857b2a0303c1r, content, 1);
-        return root_0ff113fe0a6246fbbfe92857b2a0303c1p;
+        template_u1.slot(element_0k38r593, content, 1);
+        return root_0k38r591;
     })();
 });

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

@@ -1,21 +1,21 @@
-import * as template_0ff113fe0a6246fbbfe92857b2a0303c1 from '@esportsplus/template';
+import * as template_u1 from '@esportsplus/template';
 import './scss/index.scss';
 declare const _default: {
     (): ReturnType<(this: {
-        attributes?: template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes | undefined;
+        attributes?: template_u1.Attributes | undefined;
         content?: string | undefined;
-    }, attributes: Readonly<template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes>, content: string) => template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>>;
-    <T extends template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes>(attributes: T): ReturnType<(this: {
-        attributes?: template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes | undefined;
+    }, attributes: Readonly<template_u1.Attributes>, content: string) => template_u1.Renderable<any>>;
+    <T extends template_u1.Attributes>(attributes: T): ReturnType<(this: {
+        attributes?: template_u1.Attributes | undefined;
         content?: string | undefined;
-    }, attributes: Readonly<template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes>, content: string) => template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>>;
+    }, attributes: Readonly<template_u1.Attributes>, content: string) => template_u1.Renderable<any>>;
     <T extends string>(content: T): ReturnType<(this: {
-        attributes?: template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes | undefined;
+        attributes?: template_u1.Attributes | undefined;
         content?: string | undefined;
-    }, attributes: Readonly<template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes>, content: string) => template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>>;
-    (attributes: template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes, content: string): ReturnType<(this: {
-        attributes?: template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes | undefined;
+    }, attributes: Readonly<template_u1.Attributes>, content: string) => template_u1.Renderable<any>>;
+    (attributes: template_u1.Attributes, content: string): ReturnType<(this: {
+        attributes?: template_u1.Attributes | undefined;
         content?: string | undefined;
-    }, attributes: Readonly<template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes>, content: string) => template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>>;
+    }, attributes: Readonly<template_u1.Attributes>, content: string) => template_u1.Renderable<any>>;
 };
 export default _default;

package/build/components/icon/index.js

@@ -1,15 +1,15 @@
-import * as template_0ff113fe0a6246fbbfe92857b2a0303c1 from '@esportsplus/template';
-import template from '../../components/template/index.js';
+import * as template_u1 from '@esportsplus/template';
+import { component } from '@esportsplus/template';
 import './scss/index.scss';
-const template_0ff113fe0a6246fbbfe92857b2a0303c1t = template_0ff113fe0a6246fbbfe92857b2a0303c1.template(`<div class='icon'><svg><use />`);
-export default template.factory((attributes, href) => {
+const template_1lt0nhw1 = template_u1.template(`<div class='icon' ><svg><use href='' />`);
+export default component((attributes, href) => {
     if (href[0] !== '#') {
         href = '#' + href;
     }
     return (() => {
-        let root_0ff113fe0a6246fbbfe92857b2a0303c1s = template_0ff113fe0a6246fbbfe92857b2a0303c1t(), element_0ff113fe0a6246fbbfe92857b2a0303c1u = root_0ff113fe0a6246fbbfe92857b2a0303c1s.firstChild, element_0ff113fe0a6246fbbfe92857b2a0303c1v = element_0ff113fe0a6246fbbfe92857b2a0303c1u.firstElementChild.firstElementChild;
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperties(element_0ff113fe0a6246fbbfe92857b2a0303c1u, attributes);
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperty(element_0ff113fe0a6246fbbfe92857b2a0303c1v, 'href', href);
-        return root_0ff113fe0a6246fbbfe92857b2a0303c1s;
+        let root_1lt0nhw0 = template_1lt0nhw1(), element_1lt0nhw2 = root_1lt0nhw0.firstChild, element_1lt0nhw3 = element_1lt0nhw2.firstElementChild.firstElementChild;
+        template_u1.setProperties(element_1lt0nhw2, attributes);
+        template_u1.setProperty(element_1lt0nhw3, 'href', href);
+        return root_1lt0nhw0;
     })();
 });

package/build/components/index.d.ts

@@ -1,5 +1,4 @@
 export { default as accordion } from './accordion/index.js';
-export { default as alert } from './alert/index.js';
 export { default as back } from './back/index.js';
 export { default as button } from './button/index.js';
 export { default as checkbox } from './checkbox/index.js';
@@ -21,11 +20,9 @@ export { default as range } from './range/index.js';
 export { default as root } from './root/index.js';
 export { default as select } from './select/index.js';
 export { default as switch } from './switch/index.js';
-export { default as scrollbar } from './scrollbar/index.js';
 export { default as sidebar } from './sidebar/index.js';
-export { default as site } from './site/index.js';
-export { default as template } from './template/index.js';
 export { default as textarea } from './textarea/index.js';
+export { default as toaster, toast } from './toast/index.js';
 export { default as tooltip } from './tooltip/index.js';
 export { default as truncate } from './truncate/index.js';
 export { default as typewriter } from './typewriter/index.js';

package/build/components/index.js

@@ -1,5 +1,4 @@
 export { default as accordion } from './accordion/index.js';
-export { default as alert } from './alert/index.js';
 export { default as back } from './back/index.js';
 export { default as button } from './button/index.js';
 export { default as checkbox } from './checkbox/index.js';
@@ -21,11 +20,9 @@ export { default as range } from './range/index.js';
 export { default as root } from './root/index.js';
 export { default as select } from './select/index.js';
 export { default as switch } from './switch/index.js';
-export { default as scrollbar } from './scrollbar/index.js';
 export { default as sidebar } from './sidebar/index.js';
-export { default as site } from './site/index.js';
-export { default as template } from './template/index.js';
 export { default as textarea } from './textarea/index.js';
+export { default as toaster, toast } from './toast/index.js';
 export { default as tooltip } from './tooltip/index.js';
 export { default as truncate } from './truncate/index.js';
 export { default as typewriter } from './typewriter/index.js';

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

@@ -1,4 +1,4 @@
-import { Attributes } from '@esportsplus/template';
+import { type Attributes } from '@esportsplus/template';
 import './scss/index.scss';
 export default function (this: {
     attributes?: Attributes;

package/build/components/input/index.js

@@ -1,43 +1,43 @@
-import * as template_0ff113fe0a6246fbbfe92857b2a0303c1 from '@esportsplus/template';
-import * as reactivity_0ff113fe0a6246fbbfe92857b2a0303c0 from '@esportsplus/reactivity';
-import form from '../../components/form/index.js';
+import * as template_u1 from '@esportsplus/template';
+import * as reactivity_u0 from '@esportsplus/reactivity';
+import form from '../form/index.js';
 import './scss/index.scss';
-const template_0ff113fe0a6246fbbfe92857b2a0303c1y = template_0ff113fe0a6246fbbfe92857b2a0303c1.template(`<input class='input' />`);
-class ReactiveObject_0ff113fe0a6246fbbfe92857b2a0303c1w extends reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.ReactiveObject {
-    #active = this[reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.SIGNAL](false);
-    #error = this[reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.SIGNAL]('');
+const template_0j57g2t2 = template_u1.template(`<input class='input' />`);
+class ReactiveObject_0j57g2t0 extends reactivity_u0.ReactiveObject {
+    #active = this[reactivity_u0.SIGNAL](false);
+    #error = this[reactivity_u0.SIGNAL]('');
     constructor() {
         super(null);
     }
     get active() {
-        return reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.read(this.#active);
+        return reactivity_u0.read(this.#active);
     }
     set active(_v0) {
-        reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.write(this.#active, _v0);
+        reactivity_u0.write(this.#active, _v0);
     }
     get error() {
-        return reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.read(this.#error);
+        return reactivity_u0.read(this.#error);
     }
     set error(_v1) {
-        reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.write(this.#error, _v1);
+        reactivity_u0.write(this.#error, _v1);
     }
 }
 export default function (attributes) {
-    let state = attributes.state || new ReactiveObject_0ff113fe0a6246fbbfe92857b2a0303c1w();
+    let state = attributes.state || new ReactiveObject_0j57g2t0();
     return (() => {
-        let root_0ff113fe0a6246fbbfe92857b2a0303c1x = template_0ff113fe0a6246fbbfe92857b2a0303c1y(), element_0ff113fe0a6246fbbfe92857b2a0303c1z = root_0ff113fe0a6246fbbfe92857b2a0303c1x.firstChild;
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperties(element_0ff113fe0a6246fbbfe92857b2a0303c1z, this?.attributes);
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperties(element_0ff113fe0a6246fbbfe92857b2a0303c1z, attributes);
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setList(element_0ff113fe0a6246fbbfe92857b2a0303c1z, 'class', () => state.active && '--active');
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.on(element_0ff113fe0a6246fbbfe92857b2a0303c1z, 'focusin', () => {
+        let root_0j57g2t1 = template_0j57g2t2(), element_0j57g2t3 = root_0j57g2t1.firstChild;
+        template_u1.setProperties(element_0j57g2t3, this?.attributes);
+        template_u1.setProperties(element_0j57g2t3, attributes);
+        template_u1.setList(element_0j57g2t3, 'class', () => state.active && '--active');
+        template_u1.on(element_0j57g2t3, 'focusin', () => {
             state.active = true;
         });
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.on(element_0ff113fe0a6246fbbfe92857b2a0303c1z, 'focusout', () => {
+        template_u1.on(element_0j57g2t3, 'focusout', () => {
             state.active = false;
         });
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.onrender(element_0ff113fe0a6246fbbfe92857b2a0303c1z, form.input.onrender(state));
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperty(element_0ff113fe0a6246fbbfe92857b2a0303c1z, 'type', (attributes.type || 'text'));
-        return root_0ff113fe0a6246fbbfe92857b2a0303c1x;
+        template_u1.onrender(element_0j57g2t3, form.input.onrender(state));
+        template_u1.setProperty(element_0j57g2t3, 'type', (attributes.type || 'text'));
+        return root_0j57g2t1;
     })();
 }
 ;

package/build/components/json/download.d.ts

@@ -1,2 +1,2 @@
-declare const _default: (content: any[] | Record<PropertyKey, any>, name: string) => void;
 export default _default;
+declare function _default(content: any[] | Record<PropertyKey, any>, name: string): void;

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

@@ -1,21 +1,22 @@
-import * as template_0ff113fe0a6246fbbfe92857b2a0303c1 from '@esportsplus/template';
+import * as template_u1 from '@esportsplus/template';
+import { type Attributes } from '@esportsplus/template';
 import './scss/index.scss';
 declare const _default: {
     (): ReturnType<(this: {
-        attributes?: template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes | undefined;
-        content?: template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>;
-    }, attributes: Readonly<template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes>, content: template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>) => template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>>;
-    <T extends template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes>(attributes: T): ReturnType<(this: {
-        attributes?: template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes | undefined;
-        content?: template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>;
-    }, attributes: Readonly<template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes>, content: template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>) => template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>>;
-    <T extends template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>>(content: T): ReturnType<(this: {
-        attributes?: template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes | undefined;
-        content?: template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>;
-    }, attributes: Readonly<template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes>, content: template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>) => template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>>;
-    (attributes: template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes, content: template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>): ReturnType<(this: {
-        attributes?: template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes | undefined;
-        content?: template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>;
-    }, attributes: Readonly<template_0ff113fe0a6246fbbfe92857b2a0303c1.Attributes>, content: template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>) => template_0ff113fe0a6246fbbfe92857b2a0303c1.Renderable<any>>;
+        attributes?: Attributes | undefined;
+        content?: template_u1.Renderable<any>;
+    }, attributes: Readonly<Attributes>, content: template_u1.Renderable<any>) => template_u1.Renderable<any>>;
+    <T extends Attributes>(attributes: T): ReturnType<(this: {
+        attributes?: Attributes | undefined;
+        content?: template_u1.Renderable<any>;
+    }, attributes: Readonly<Attributes>, content: template_u1.Renderable<any>) => template_u1.Renderable<any>>;
+    <T extends template_u1.Renderable<any>>(content: T): ReturnType<(this: {
+        attributes?: Attributes | undefined;
+        content?: template_u1.Renderable<any>;
+    }, attributes: Readonly<Attributes>, content: template_u1.Renderable<any>) => template_u1.Renderable<any>>;
+    (attributes: Attributes, content: template_u1.Renderable<any>): ReturnType<(this: {
+        attributes?: Attributes | undefined;
+        content?: template_u1.Renderable<any>;
+    }, attributes: Readonly<Attributes>, content: template_u1.Renderable<any>) => template_u1.Renderable<any>>;
 };
 export default _default;

package/build/components/loader/index.js

@@ -1,78 +1,78 @@
-import * as template_0ff113fe0a6246fbbfe92857b2a0303c1 from '@esportsplus/template';
-import * as reactivity_0ff113fe0a6246fbbfe92857b2a0303c0 from '@esportsplus/reactivity';
+import * as template_u1 from '@esportsplus/template';
+import { component } from '@esportsplus/template';
+import * as reactivity_u0 from '@esportsplus/reactivity';
 import { omit } from '@esportsplus/utilities';
-import template from '../../components/template/index.js';
 import './scss/index.scss';
-const template_0ff113fe0a6246fbbfe92857b2a0303c22 = template_0ff113fe0a6246fbbfe92857b2a0303c1.template(`<div class='loader-content'><div class='loader-logo text --flex-center --text-uppercase --text-600' style='color: var(--color-grey-500);'>`);
-const template_0ff113fe0a6246fbbfe92857b2a0303c26 = template_0ff113fe0a6246fbbfe92857b2a0303c1.template(`<div class='loader '><div class='loader '>`);
-class ReactiveObject_0ff113fe0a6246fbbfe92857b2a0303c20 extends reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.ReactiveObject {
-    #load = this[reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.SIGNAL](false);
-    #remove = this[reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.SIGNAL](false);
-    #scale = this[reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.SIGNAL](false);
+const template_0bvfqbq2 = template_u1.template(`<div class='loader-content' ><div class='loader-logo text --flex-center --text-uppercase --text-600' style='color: var(--color-grey-500);' >`);
+const template_0bvfqbq6 = template_u1.template(`<div class='loader '><div class='loader ' >`);
+class ReactiveObject_0bvfqbq0 extends reactivity_u0.ReactiveObject {
+    #load = this[reactivity_u0.SIGNAL](false);
+    #remove = this[reactivity_u0.SIGNAL](false);
+    #scale = this[reactivity_u0.SIGNAL](false);
     constructor() {
         super(null);
     }
     get load() {
-        return reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.read(this.#load);
+        return reactivity_u0.read(this.#load);
     }
     set load(_v0) {
-        reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.write(this.#load, _v0);
+        reactivity_u0.write(this.#load, _v0);
     }
     get remove() {
-        return reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.read(this.#remove);
+        return reactivity_u0.read(this.#remove);
     }
     set remove(_v1) {
-        reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.write(this.#remove, _v1);
+        reactivity_u0.write(this.#remove, _v1);
     }
     get scale() {
-        return reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.read(this.#scale);
+        return reactivity_u0.read(this.#scale);
     }
     set scale(_v2) {
-        reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.write(this.#scale, _v2);
+        reactivity_u0.write(this.#scale, _v2);
     }
 }
 const OMIT = ['loader-content', 'loader-logo'];
-export default template.factory((attributes, content) => {
-    let state = new ReactiveObject_0ff113fe0a6246fbbfe92857b2a0303c20();
+export default component((attributes, content) => {
+    let state = new ReactiveObject_0bvfqbq0();
     return () => {
         if (state.remove) {
             return;
         }
         let i = 0;
         return (() => {
-            let root_0ff113fe0a6246fbbfe92857b2a0303c25 = template_0ff113fe0a6246fbbfe92857b2a0303c26(), element_0ff113fe0a6246fbbfe92857b2a0303c27 = root_0ff113fe0a6246fbbfe92857b2a0303c25.firstChild, element_0ff113fe0a6246fbbfe92857b2a0303c28 = element_0ff113fe0a6246fbbfe92857b2a0303c27.firstElementChild;
-            template_0ff113fe0a6246fbbfe92857b2a0303c1.setList(element_0ff113fe0a6246fbbfe92857b2a0303c27, 'class', () => state.load && 'loader--load');
-            template_0ff113fe0a6246fbbfe92857b2a0303c1.delegate(element_0ff113fe0a6246fbbfe92857b2a0303c27, 'animationend', (e) => {
+            let root_0bvfqbq5 = template_0bvfqbq6(), element_0bvfqbq7 = root_0bvfqbq5.firstChild, element_0bvfqbq8 = element_0bvfqbq7.firstElementChild;
+            template_u1.setList(element_0bvfqbq7, 'class', () => state.load && 'loader--load');
+            template_u1.delegate(element_0bvfqbq7, 'animationend', ({ animationName: name }) => {
                 i++;
-                if (e.animationName === 'move' && i > 1) {
+                if (name === 'move' && i > 1) {
                     state.remove = true;
                 }
             });
-            template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperties(element_0ff113fe0a6246fbbfe92857b2a0303c27, omit(attributes, OMIT));
-            template_0ff113fe0a6246fbbfe92857b2a0303c1.setList(element_0ff113fe0a6246fbbfe92857b2a0303c28, 'class', () => state.load && 'loader--load');
-            template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperties(element_0ff113fe0a6246fbbfe92857b2a0303c28, !content && {
+            template_u1.setProperties(element_0bvfqbq7, omit(attributes, OMIT));
+            template_u1.setList(element_0bvfqbq8, 'class', () => state.load && 'loader--load');
+            template_u1.setProperties(element_0bvfqbq8, !content && {
                 onconnect: () => {
                     state.load = true;
                 }
             });
-            template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperties(element_0ff113fe0a6246fbbfe92857b2a0303c28, attributes.loader);
-            template_0ff113fe0a6246fbbfe92857b2a0303c1.slot(element_0ff113fe0a6246fbbfe92857b2a0303c28, content && (() => {
-                let root_0ff113fe0a6246fbbfe92857b2a0303c21 = template_0ff113fe0a6246fbbfe92857b2a0303c22(), element_0ff113fe0a6246fbbfe92857b2a0303c23 = root_0ff113fe0a6246fbbfe92857b2a0303c21.firstChild, element_0ff113fe0a6246fbbfe92857b2a0303c24 = element_0ff113fe0a6246fbbfe92857b2a0303c23.firstElementChild;
-                template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperties(element_0ff113fe0a6246fbbfe92857b2a0303c23, attributes['loader-content']);
-                template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperties(element_0ff113fe0a6246fbbfe92857b2a0303c24, attributes['loader-logo']);
-                template_0ff113fe0a6246fbbfe92857b2a0303c1.setList(element_0ff113fe0a6246fbbfe92857b2a0303c24, 'class', () => state.scale && 'loader-logo--scale');
-                template_0ff113fe0a6246fbbfe92857b2a0303c1.delegate(element_0ff113fe0a6246fbbfe92857b2a0303c24, 'animationend', ({ animationName: name }) => {
+            template_u1.setProperties(element_0bvfqbq8, attributes.loader);
+            template_u1.slot(element_0bvfqbq8, content && (() => {
+                let root_0bvfqbq1 = template_0bvfqbq2(), element_0bvfqbq3 = root_0bvfqbq1.firstChild, element_0bvfqbq4 = element_0bvfqbq3.firstElementChild;
+                template_u1.setProperties(element_0bvfqbq3, attributes['loader-content']);
+                template_u1.setProperties(element_0bvfqbq4, attributes['loader-logo']);
+                template_u1.setList(element_0bvfqbq4, 'class', () => state.scale && 'loader-logo--scale');
+                template_u1.delegate(element_0bvfqbq4, 'animationend', ({ animationName: name }) => {
                     if (name === 'scale') {
                         state.load = true;
                     }
                 });
-                template_0ff113fe0a6246fbbfe92857b2a0303c1.onconnect(element_0ff113fe0a6246fbbfe92857b2a0303c24, () => {
+                template_u1.onconnect(element_0bvfqbq4, () => {
                     state.scale = true;
                 });
-                template_0ff113fe0a6246fbbfe92857b2a0303c1.slot(element_0ff113fe0a6246fbbfe92857b2a0303c24, content, 1);
-                return root_0ff113fe0a6246fbbfe92857b2a0303c21;
+                template_u1.slot(element_0bvfqbq4, content, 1);
+                return root_0bvfqbq1;
             })(), 1);
-            return root_0ff113fe0a6246fbbfe92857b2a0303c25;
+            return root_0bvfqbq5;
         })();
     };
 });

package/build/components/loader/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components {.loader-logo{--size:10svh;--translateY:8px}.loader{opacity:1;pointer-events:none;visibility:visible;z-index:9999;background-color:#01020964;transition:all .3s ease-in-out;position:fixed;inset:0}.loader--load{animation:.4s ease-in-out .2s both loaderMove}.loader--load .loader--load{animation:.4s ease-in-out both loaderMove}@keyframes loaderMove{0%{transform:translateY(0)}80%{transform:translateY(-102%)}to{transform:translateY(-102%)}}.loader .loader{background-color:var(--color-black-400)}.loader-content{position:absolute;inset:50% auto auto 50%;transform:translate(-50%)translateY(-50%)}.loader-logo{color:#fff}.loader-logo--scale{animation:.32s both loaderLogoScale}@keyframes loaderLogoScale{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale3d(1.8,1.8,1.8)}}}
+@layer components {.loader-logo{--size:10svh;--translateY:8px}.loader{opacity:1;pointer-events:none;visibility:visible;z-index:9999;background-color:#01020964;transition:opacity .3s ease-in-out,visibility .3s ease-in-out;position:fixed;inset:0}.loader--load{animation:.4s ease-in-out .2s both loaderMove}.loader--load .loader--load{animation:.4s ease-in-out both loaderMove}@keyframes loaderMove{0%{transform:translateY(0)}80%{transform:translateY(-102%)}to{transform:translateY(-102%)}}.loader .loader{background-color:var(--color-black-400)}.loader-content{position:absolute;inset:50% auto auto 50%;transform:translate(-50%)translateY(-50%)}.loader-logo{color:#fff}.loader-logo--scale{animation:.32s both loaderLogoScale}@keyframes loaderLogoScale{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale3d(1.8,1.8,1.8)}}}
 /*$vite$:1*/

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

@@ -1,4 +1,4 @@
 import { Attributes } from '@esportsplus/template';
 import './scss/index.scss';
-declare const _default: (attributes?: Attributes) => DocumentFragment | Text;
 export default _default;
+declare function _default(attributes?: Attributes): DocumentFragment | Text;

package/build/components/loading/index.js

@@ -1,10 +1,10 @@
-import * as template_0ff113fe0a6246fbbfe92857b2a0303c1 from '@esportsplus/template';
+import * as template_u1 from '@esportsplus/template';
 import './scss/index.scss';
-const template_0ff113fe0a6246fbbfe92857b2a0303c2a = template_0ff113fe0a6246fbbfe92857b2a0303c1.template(`<div class='loading --border-width-700 --size-800' style='--border-color: var(--color-border-500);'>`);
+const template_17hj0u91 = template_u1.template(`<div class='loading --border-width-700 --size-800' style='--border-color: var(--color-border-500);' >`);
 export default (attributes) => {
     return (() => {
-        let root_0ff113fe0a6246fbbfe92857b2a0303c29 = template_0ff113fe0a6246fbbfe92857b2a0303c2a(), element_0ff113fe0a6246fbbfe92857b2a0303c2b = root_0ff113fe0a6246fbbfe92857b2a0303c29.firstChild;
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperties(element_0ff113fe0a6246fbbfe92857b2a0303c2b, attributes);
-        return root_0ff113fe0a6246fbbfe92857b2a0303c29;
+        let root_17hj0u90 = template_17hj0u91(), element_17hj0u92 = root_17hj0u90.firstChild;
+        template_u1.setProperties(element_17hj0u92, attributes);
+        return root_17hj0u90;
     })();
 };

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

@@ -1,20 +1,21 @@
+import * as template_u1 from '@esportsplus/template';
 import './scss/index.scss';
 declare const _default: {
     (): ReturnType<(this: {
-        attributes?: import("../../components/scrollbar/index.js").Attributes | undefined;
-        content?: import("@esportsplus/template").Renderable<any>;
-    }, attributes: Readonly<import("../../components/scrollbar/index.js").Attributes>, content: import("@esportsplus/template").Renderable<any>) => import("@esportsplus/template").Renderable<any>>;
-    <T extends import("../../components/scrollbar/index.js").Attributes>(attributes: T): ReturnType<(this: {
-        attributes?: import("../../components/scrollbar/index.js").Attributes | undefined;
-        content?: import("@esportsplus/template").Renderable<any>;
-    }, attributes: Readonly<import("../../components/scrollbar/index.js").Attributes>, content: import("@esportsplus/template").Renderable<any>) => import("@esportsplus/template").Renderable<any>>;
-    <T extends import("@esportsplus/template").Renderable<any>>(content: T): ReturnType<(this: {
-        attributes?: import("../../components/scrollbar/index.js").Attributes | undefined;
-        content?: import("@esportsplus/template").Renderable<any>;
-    }, attributes: Readonly<import("../../components/scrollbar/index.js").Attributes>, content: import("@esportsplus/template").Renderable<any>) => import("@esportsplus/template").Renderable<any>>;
-    (attributes: import("../../components/scrollbar/index.js").Attributes, content: import("@esportsplus/template").Renderable<any>): ReturnType<(this: {
-        attributes?: import("../../components/scrollbar/index.js").Attributes | undefined;
-        content?: import("@esportsplus/template").Renderable<any>;
-    }, attributes: Readonly<import("../../components/scrollbar/index.js").Attributes>, content: import("@esportsplus/template").Renderable<any>) => import("@esportsplus/template").Renderable<any>>;
+        attributes?: template_u1.Attributes | undefined;
+        content?: template_u1.Renderable<any>;
+    }, attributes: Readonly<template_u1.Attributes>, content: template_u1.Renderable<any>) => template_u1.Renderable<any>>;
+    <T extends template_u1.Attributes>(attributes: T): ReturnType<(this: {
+        attributes?: template_u1.Attributes | undefined;
+        content?: template_u1.Renderable<any>;
+    }, attributes: Readonly<template_u1.Attributes>, content: template_u1.Renderable<any>) => template_u1.Renderable<any>>;
+    <T extends template_u1.Renderable<any>>(content: T): ReturnType<(this: {
+        attributes?: template_u1.Attributes | undefined;
+        content?: template_u1.Renderable<any>;
+    }, attributes: Readonly<template_u1.Attributes>, content: template_u1.Renderable<any>) => template_u1.Renderable<any>>;
+    (attributes: template_u1.Attributes, content: template_u1.Renderable<any>): ReturnType<(this: {
+        attributes?: template_u1.Attributes | undefined;
+        content?: template_u1.Renderable<any>;
+    }, attributes: Readonly<template_u1.Attributes>, content: template_u1.Renderable<any>) => template_u1.Renderable<any>>;
 };
 export default _default;

package/build/components/overlay/index.js

@@ -1,7 +1,13 @@
-import scrollbar from '../../components/scrollbar/index.js';
+import * as template_u1 from '@esportsplus/template';
+import { component } from '@esportsplus/template';
 import './scss/index.scss';
-export default scrollbar.bind({
-    attributes: {
-        class: 'overlay'
-    }
+const template_0ip26l11 = template_u1.template(`<div class='overlay --scrollbar' >`);
+export default component(function (attributes, content) {
+    return (() => {
+        let root_0ip26l10 = template_0ip26l11(), element_0ip26l12 = root_0ip26l10.firstChild;
+        template_u1.setProperties(element_0ip26l12, this?.attributes);
+        template_u1.setProperties(element_0ip26l12, attributes);
+        template_u1.slot(element_0ip26l12, content, 1);
+        return root_0ip26l10;
+    })();
 });

package/build/components/overlay/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components {.overlay{cursor:default;z-index:9;flex-wrap:wrap;justify-content:flex-start;display:flex;position:fixed;inset:0;overflow:hidden}.overlay:not(.--active) input[type=password]{display:none}}
+@layer components {.overlay{cursor:default;z-index:9;flex-wrap:wrap;justify-content:flex-start;display:flex;position:fixed;inset:0}.overlay:not(.--active) input[type=password]{display:none}}
 /*$vite$:1*/

package/build/components/page/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components {.page{--gap-horizontal:0px;--gap-vertical:0px}.page-subtitle,.page-suptitle{--color:var(--color-default);--color-default:var(--color-text-400);--font-size:var(--font-size-400);--line-height:var(--line-height-400)}.page-title{--color:var(--color-default);--color-default:var(--color-text-500);--line-height:var(--line-height-400)}.page{gap:var(--gap-vertical) 0px;flex-flow:column;width:100vw;min-height:100svh;display:flex;position:relative}.page-subtitle,.page-suptitle,.page-title{color:var(--color);line-height:var(--line-height);z-index:1;width:100%;display:block;position:relative}.page-subtitle,.page-suptitle{font-size:var(--font-size)}.page-suptitle+.page-title,.page-title+.page-subtitle{margin-top:var(--margin-vertical)}.page-title{text-wrap:balance}}
+@layer components {.page{--gap-horizontal:0px;--gap-vertical:0px}.page-subtitle,.page-suptitle{--color:var(--color-default);--color-default:var(--color-text-400);--font-size:var(--font-size-400);--line-height:var(--line-height-400)}.page-title{--color:var(--color-default);--color-default:var(--color-text-500);--line-height:var(--line-height-400)}.page{gap:var(--gap-vertical) 0px;flex-flow:column;width:100%;min-height:100svh;display:flex;position:relative}.page-subtitle,.page-suptitle,.page-title{color:var(--color);line-height:var(--line-height);z-index:1;width:100%;display:block;position:relative}.page-subtitle,.page-suptitle{font-size:var(--font-size)}.page-suptitle+.page-title,.page-title+.page-subtitle{margin-top:var(--margin-vertical)}.page-title{text-wrap:balance}}
 /*$vite$:1*/

package/build/components/radio/index.js

@@ -1,3 +1,3 @@
-import { factory } from '../../components/checkbox/index.js';
+import { factory } from '../checkbox/index.js';
 import './scss/index.scss';
 export default factory('radio');

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

@@ -1,4 +1,4 @@
-import { Attributes } from '@esportsplus/template';
+import { type Attributes } from '@esportsplus/template';
 import './scss/index.scss';
 export default function (this: {
     attributes?: Attributes;

package/build/components/range/index.js

@@ -1,58 +1,58 @@
-import * as template_0ff113fe0a6246fbbfe92857b2a0303c1 from '@esportsplus/template';
-import * as reactivity_0ff113fe0a6246fbbfe92857b2a0303c0 from '@esportsplus/reactivity';
+import * as template_u1 from '@esportsplus/template';
+import * as reactivity_u0 from '@esportsplus/reactivity';
 import { root } from '@esportsplus/reactivity';
-import form from '../../components/form/index.js';
+import form from '../form/index.js';
 import './scss/index.scss';
-const template_0ff113fe0a6246fbbfe92857b2a0303c2e = template_0ff113fe0a6246fbbfe92857b2a0303c1.template(`<input class='range --border-state --border-black' type='range' />`);
-class ReactiveObject_0ff113fe0a6246fbbfe92857b2a0303c2c extends reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.ReactiveObject {
-    #active = this[reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.SIGNAL](false);
-    #error = this[reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.SIGNAL]('');
-    #value = this[reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.SIGNAL](0);
+const template_0aka2e62 = template_u1.template(`<input class='range --border-state --border-black' type='range' />`);
+class ReactiveObject_0aka2e60 extends reactivity_u0.ReactiveObject {
+    #active = this[reactivity_u0.SIGNAL](false);
+    #error = this[reactivity_u0.SIGNAL]('');
+    #value = this[reactivity_u0.SIGNAL](0);
     constructor() {
         super(null);
     }
     get active() {
-        return reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.read(this.#active);
+        return reactivity_u0.read(this.#active);
     }
     set active(_v0) {
-        reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.write(this.#active, _v0);
+        reactivity_u0.write(this.#active, _v0);
     }
     get error() {
-        return reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.read(this.#error);
+        return reactivity_u0.read(this.#error);
     }
     set error(_v1) {
-        reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.write(this.#error, _v1);
+        reactivity_u0.write(this.#error, _v1);
     }
     get value() {
-        return reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.read(this.#value);
+        return reactivity_u0.read(this.#value);
     }
     set value(_v2) {
-        reactivity_0ff113fe0a6246fbbfe92857b2a0303c0.write(this.#value, _v2);
+        reactivity_u0.write(this.#value, _v2);
     }
 }
 export default function (attributes) {
-    let { max, min } = attributes, state = attributes.state || new ReactiveObject_0ff113fe0a6246fbbfe92857b2a0303c2c();
+    let { max, min } = attributes, state = attributes.state || new ReactiveObject_0aka2e60();
     if (attributes?.value) {
         state.value = Number(attributes.value);
     }
     return (() => {
-        let root_0ff113fe0a6246fbbfe92857b2a0303c2d = template_0ff113fe0a6246fbbfe92857b2a0303c2e(), element_0ff113fe0a6246fbbfe92857b2a0303c2f = root_0ff113fe0a6246fbbfe92857b2a0303c2d.firstChild;
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setList(element_0ff113fe0a6246fbbfe92857b2a0303c2f, 'style', () => `--thumb-position: ${((state.value - min) / (max - min)) * 100}%`);
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperties(element_0ff113fe0a6246fbbfe92857b2a0303c2f, this?.attributes);
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperties(element_0ff113fe0a6246fbbfe92857b2a0303c2f, attributes);
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setList(element_0ff113fe0a6246fbbfe92857b2a0303c2f, 'class', () => state.active && '--active');
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.on(element_0ff113fe0a6246fbbfe92857b2a0303c2f, 'focusin', () => {
+        let root_0aka2e61 = template_0aka2e62(), element_0aka2e63 = root_0aka2e61.firstChild;
+        template_u1.setList(element_0aka2e63, 'style', () => `--thumb-position: ${((state.value - min) / (max - min)) * 100}%`);
+        template_u1.setProperties(element_0aka2e63, this?.attributes);
+        template_u1.setProperties(element_0aka2e63, attributes);
+        template_u1.setList(element_0aka2e63, 'class', () => state.active && '--active');
+        template_u1.on(element_0aka2e63, 'focusin', () => {
             state.active = true;
         });
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.on(element_0ff113fe0a6246fbbfe92857b2a0303c2f, 'focusout', () => {
+        template_u1.on(element_0aka2e63, 'focusout', () => {
             state.active = false;
         });
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.delegate(element_0ff113fe0a6246fbbfe92857b2a0303c2f, 'input', (e) => {
+        template_u1.delegate(element_0aka2e63, 'input', (e) => {
             state.value = Number(e.target.value);
         });
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.onrender(element_0ff113fe0a6246fbbfe92857b2a0303c2f, form.input.onrender(state));
-        template_0ff113fe0a6246fbbfe92857b2a0303c1.setProperty(element_0ff113fe0a6246fbbfe92857b2a0303c2f, 'value', root(() => attributes?.value || state.value || 0));
-        return root_0ff113fe0a6246fbbfe92857b2a0303c2d;
+        template_u1.onrender(element_0aka2e63, form.input.onrender(state));
+        template_u1.setProperty(element_0aka2e63, 'value', root(() => attributes?.value || state.value || 0));
+        return root_0aka2e61;
     })();
 }
 ;