@esportsplus/ui 0.49.4 → 0.49.6

package/build/components/loader/index.js

@@ -1,56 +1,78 @@
-import * as template_b5a9a3f5040540948313f36934d7b05b1 from '@esportsplus/frontend';
-import { reactive } from '@esportsplus/frontend';
+import * as template_2a7920412bac4009b37c4d0863a6596e1 from '@esportsplus/template';
+import * as reactivity_2a7920412bac4009b37c4d0863a6596e0 from '@esportsplus/reactivity';
 import { omit } from '@esportsplus/utilities';
 import template from '../../components/template/index.js';
 import './scss/index.scss';
-const template_b5a9a3f5040540948313f36934d7b05b2l = template_b5a9a3f5040540948313f36934d7b05b1.template(`<div class='loader-content'><div class='loader-logo text --flex-center --text-uppercase --text-600' style='color: var(--color-grey-500);'><!--$--></div></div>`);
-const template_b5a9a3f5040540948313f36934d7b05b2s = template_b5a9a3f5040540948313f36934d7b05b1.template(`<div class='loader '><div class='loader '><!--$--></div></div>`);
+const template_2a7920412bac4009b37c4d0863a6596e2v = template_2a7920412bac4009b37c4d0863a6596e1.template(`<div class='loader-content'><div class='loader-logo text --flex-center --text-uppercase --text-600' style='color: var(--color-grey-500);'><!--$--></div></div>`);
+const template_2a7920412bac4009b37c4d0863a6596e32 = template_2a7920412bac4009b37c4d0863a6596e1.template(`<div class='loader '><div class='loader '><!--$--></div></div>`);
+class ReactiveObject_2a7920412bac4009b37c4d0863a6596e2t extends reactivity_2a7920412bac4009b37c4d0863a6596e0.ReactiveObject {
+    #load = this[reactivity_2a7920412bac4009b37c4d0863a6596e0.SIGNAL](false);
+    #remove = this[reactivity_2a7920412bac4009b37c4d0863a6596e0.SIGNAL](false);
+    #scale = this[reactivity_2a7920412bac4009b37c4d0863a6596e0.SIGNAL](false);
+    constructor() {
+        super(null);
+    }
+    get load() {
+        return reactivity_2a7920412bac4009b37c4d0863a6596e0.read(this.#load);
+    }
+    set load(_v0) {
+        reactivity_2a7920412bac4009b37c4d0863a6596e0.write(this.#load, _v0);
+    }
+    get remove() {
+        return reactivity_2a7920412bac4009b37c4d0863a6596e0.read(this.#remove);
+    }
+    set remove(_v1) {
+        reactivity_2a7920412bac4009b37c4d0863a6596e0.write(this.#remove, _v1);
+    }
+    get scale() {
+        return reactivity_2a7920412bac4009b37c4d0863a6596e0.read(this.#scale);
+    }
+    set scale(_v2) {
+        reactivity_2a7920412bac4009b37c4d0863a6596e0.write(this.#scale, _v2);
+    }
+}
 const OMIT = ['loader-content', 'loader-logo'];
 export default template.factory((attributes, content) => {
-    let state = reactive({
-        load: false,
-        remove: false,
-        scale: false
-    });
+    let state = new ReactiveObject_2a7920412bac4009b37c4d0863a6596e2t();
     return () => {
         if (state.remove) {
             return;
         }
         let i = 0;
         return (() => {
-            let root_b5a9a3f5040540948313f36934d7b05b2r = template_b5a9a3f5040540948313f36934d7b05b2s(), element_b5a9a3f5040540948313f36934d7b05b2t = root_b5a9a3f5040540948313f36934d7b05b2r.firstChild, element_b5a9a3f5040540948313f36934d7b05b2u = element_b5a9a3f5040540948313f36934d7b05b2t.firstElementChild, element_b5a9a3f5040540948313f36934d7b05b2v = element_b5a9a3f5040540948313f36934d7b05b2u.firstChild, attributes_b5a9a3f5040540948313f36934d7b05b2w = { "class": "loader" }, attributes_b5a9a3f5040540948313f36934d7b05b2x = { "class": "loader" };
-            template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b2t, 'class', () => state.load && 'loader--load', attributes_b5a9a3f5040540948313f36934d7b05b2w);
-            template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b2t, 'animationend', (e) => {
+            let root_2a7920412bac4009b37c4d0863a6596e31 = template_2a7920412bac4009b37c4d0863a6596e32(), element_2a7920412bac4009b37c4d0863a6596e33 = root_2a7920412bac4009b37c4d0863a6596e31.firstChild, element_2a7920412bac4009b37c4d0863a6596e34 = element_2a7920412bac4009b37c4d0863a6596e33.firstElementChild, element_2a7920412bac4009b37c4d0863a6596e35 = element_2a7920412bac4009b37c4d0863a6596e34.firstChild, attributes_2a7920412bac4009b37c4d0863a6596e36 = { "class": "loader" }, attributes_2a7920412bac4009b37c4d0863a6596e37 = { "class": "loader" };
+            template_2a7920412bac4009b37c4d0863a6596e1.setList(element_2a7920412bac4009b37c4d0863a6596e33, 'class', () => state.load && 'loader--load', attributes_2a7920412bac4009b37c4d0863a6596e36);
+            template_2a7920412bac4009b37c4d0863a6596e1.delegate(element_2a7920412bac4009b37c4d0863a6596e33, 'animationend', (e) => {
                 i++;
                 if (e.animationName === 'move' && i > 1) {
                     state.remove = true;
                 }
             });
-            template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b2t, omit(attributes, OMIT), attributes_b5a9a3f5040540948313f36934d7b05b2w);
-            template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b2u, 'class', () => state.load && 'loader--load', attributes_b5a9a3f5040540948313f36934d7b05b2x);
-            template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b2u, !content && {
+            template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e33, omit(attributes, OMIT), attributes_2a7920412bac4009b37c4d0863a6596e36);
+            template_2a7920412bac4009b37c4d0863a6596e1.setList(element_2a7920412bac4009b37c4d0863a6596e34, 'class', () => state.load && 'loader--load', attributes_2a7920412bac4009b37c4d0863a6596e37);
+            template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e34, !content && {
                 onconnect: () => {
                     state.load = true;
                 }
-            }, attributes_b5a9a3f5040540948313f36934d7b05b2x);
-            template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b2u, attributes.loader, attributes_b5a9a3f5040540948313f36934d7b05b2x);
-            template_b5a9a3f5040540948313f36934d7b05b1.slot(element_b5a9a3f5040540948313f36934d7b05b2v, content && (() => {
-                let root_b5a9a3f5040540948313f36934d7b05b2k = template_b5a9a3f5040540948313f36934d7b05b2l(), element_b5a9a3f5040540948313f36934d7b05b2m = root_b5a9a3f5040540948313f36934d7b05b2k.firstChild, element_b5a9a3f5040540948313f36934d7b05b2n = element_b5a9a3f5040540948313f36934d7b05b2m.firstElementChild, element_b5a9a3f5040540948313f36934d7b05b2o = element_b5a9a3f5040540948313f36934d7b05b2n.firstChild, attributes_b5a9a3f5040540948313f36934d7b05b2p = { "class": "loader-content" }, attributes_b5a9a3f5040540948313f36934d7b05b2q = { "class": "loader-logo text --flex-center --text-uppercase --text-600", "style": "color:;var(--color-grey-500);" };
-                template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b2m, attributes['loader-content'], attributes_b5a9a3f5040540948313f36934d7b05b2p);
-                template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b2n, attributes['loader-logo'], attributes_b5a9a3f5040540948313f36934d7b05b2q);
-                template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b2n, 'class', () => state.scale && 'loader-logo--scale', attributes_b5a9a3f5040540948313f36934d7b05b2q);
-                template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b2n, 'animationend', ({ animationName: name }) => {
+            }, attributes_2a7920412bac4009b37c4d0863a6596e37);
+            template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e34, attributes.loader, attributes_2a7920412bac4009b37c4d0863a6596e37);
+            template_2a7920412bac4009b37c4d0863a6596e1.slot(element_2a7920412bac4009b37c4d0863a6596e35, content && (() => {
+                let root_2a7920412bac4009b37c4d0863a6596e2u = template_2a7920412bac4009b37c4d0863a6596e2v(), element_2a7920412bac4009b37c4d0863a6596e2w = root_2a7920412bac4009b37c4d0863a6596e2u.firstChild, element_2a7920412bac4009b37c4d0863a6596e2x = element_2a7920412bac4009b37c4d0863a6596e2w.firstElementChild, element_2a7920412bac4009b37c4d0863a6596e2y = element_2a7920412bac4009b37c4d0863a6596e2x.firstChild, attributes_2a7920412bac4009b37c4d0863a6596e2z = { "class": "loader-content" }, attributes_2a7920412bac4009b37c4d0863a6596e30 = { "class": "loader-logo text --flex-center --text-uppercase --text-600", "style": "color:;var(--color-grey-500);" };
+                template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e2w, attributes['loader-content'], attributes_2a7920412bac4009b37c4d0863a6596e2z);
+                template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e2x, attributes['loader-logo'], attributes_2a7920412bac4009b37c4d0863a6596e30);
+                template_2a7920412bac4009b37c4d0863a6596e1.setList(element_2a7920412bac4009b37c4d0863a6596e2x, 'class', () => state.scale && 'loader-logo--scale', attributes_2a7920412bac4009b37c4d0863a6596e30);
+                template_2a7920412bac4009b37c4d0863a6596e1.delegate(element_2a7920412bac4009b37c4d0863a6596e2x, 'animationend', ({ animationName: name }) => {
                     if (name === 'scale') {
                         state.load = true;
                     }
                 });
-                template_b5a9a3f5040540948313f36934d7b05b1.onconnect(element_b5a9a3f5040540948313f36934d7b05b2n, () => {
+                template_2a7920412bac4009b37c4d0863a6596e1.onconnect(element_2a7920412bac4009b37c4d0863a6596e2x, () => {
                     state.scale = true;
                 });
-                template_b5a9a3f5040540948313f36934d7b05b1.slot(element_b5a9a3f5040540948313f36934d7b05b2o, content);
-                return root_b5a9a3f5040540948313f36934d7b05b2k;
+                template_2a7920412bac4009b37c4d0863a6596e1.slot(element_2a7920412bac4009b37c4d0863a6596e2y, content);
+                return root_2a7920412bac4009b37c4d0863a6596e2u;
             })());
-            return root_b5a9a3f5040540948313f36934d7b05b2r;
+            return root_2a7920412bac4009b37c4d0863a6596e31;
         })();
     };
 });

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

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

package/build/components/loading/index.js

@@ -1,10 +1,10 @@
-import * as template_b5a9a3f5040540948313f36934d7b05b1 from '@esportsplus/frontend';
+import * as template_2a7920412bac4009b37c4d0863a6596e1 from '@esportsplus/template';
 import './scss/index.scss';
-const template_b5a9a3f5040540948313f36934d7b05b2z = template_b5a9a3f5040540948313f36934d7b05b1.template(`<div class='loading --border-width-700 --size-800' style='--border-color: var(--color-border-500);'></div>`);
+const template_2a7920412bac4009b37c4d0863a6596e39 = template_2a7920412bac4009b37c4d0863a6596e1.template(`<div class='loading --border-width-700 --size-800' style='--border-color: var(--color-border-500);'></div>`);
 export default (attributes) => {
     return (() => {
-        let root_b5a9a3f5040540948313f36934d7b05b2y = template_b5a9a3f5040540948313f36934d7b05b2z(), element_b5a9a3f5040540948313f36934d7b05b30 = root_b5a9a3f5040540948313f36934d7b05b2y.firstChild, attributes_b5a9a3f5040540948313f36934d7b05b31 = { "class": "loading --border-width-700 --size-800", "style": "--border-color:;var(--color-border-500);" };
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b30, attributes, attributes_b5a9a3f5040540948313f36934d7b05b31);
-        return root_b5a9a3f5040540948313f36934d7b05b2y;
+        let root_2a7920412bac4009b37c4d0863a6596e38 = template_2a7920412bac4009b37c4d0863a6596e39(), element_2a7920412bac4009b37c4d0863a6596e3a = root_2a7920412bac4009b37c4d0863a6596e38.firstChild, attributes_2a7920412bac4009b37c4d0863a6596e3b = { "class": "loading --border-width-700 --size-800", "style": "--border-color:;var(--color-border-500);" };
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3a, attributes, attributes_2a7920412bac4009b37c4d0863a6596e3b);
+        return root_2a7920412bac4009b37c4d0863a6596e38;
     })();
 };

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

@@ -2,19 +2,19 @@ import './scss/index.scss';
 declare const _default: {
     (): ReturnType<(this: {
         attributes?: import("../../components/scrollbar/index.js").Attributes | undefined;
-        content?: import("@esportsplus/frontend").Renderable<any>;
-    }, attributes: Readonly<import("../../components/scrollbar/index.js").Attributes>, content: import("@esportsplus/frontend").Renderable<any>) => import("@esportsplus/frontend").Renderable<any>>;
+        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/frontend").Renderable<any>;
-    }, attributes: Readonly<import("../../components/scrollbar/index.js").Attributes>, content: import("@esportsplus/frontend").Renderable<any>) => import("@esportsplus/frontend").Renderable<any>>;
-    <T extends import("@esportsplus/frontend").Renderable<any>>(content: T): ReturnType<(this: {
+        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/frontend").Renderable<any>;
-    }, attributes: Readonly<import("../../components/scrollbar/index.js").Attributes>, content: import("@esportsplus/frontend").Renderable<any>) => import("@esportsplus/frontend").Renderable<any>>;
-    (attributes: import("../../components/scrollbar/index.js").Attributes, content: import("@esportsplus/frontend").Renderable<any>): ReturnType<(this: {
+        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/frontend").Renderable<any>;
-    }, attributes: Readonly<import("../../components/scrollbar/index.js").Attributes>, content: import("@esportsplus/frontend").Renderable<any>) => import("@esportsplus/frontend").Renderable<any>>;
+        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>>;
 };
 export default _default;

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

@@ -1,7 +1,7 @@
 import './scss/index.scss';
 declare const _default: (this: {
-    attributes?: import("@esportsplus/frontend").Attributes;
-} | any, attributes?: import("@esportsplus/frontend").Attributes & {
+    attributes?: import("@esportsplus/template").Attributes;
+} | any, attributes?: import("@esportsplus/template").Attributes & {
     state?: {
         active: boolean;
         error: string;

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

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

package/build/components/range/index.js

@@ -1,35 +1,58 @@
-import * as template_b5a9a3f5040540948313f36934d7b05b1 from '@esportsplus/frontend';
-import { reactive, root } from '@esportsplus/frontend';
+import * as template_2a7920412bac4009b37c4d0863a6596e1 from '@esportsplus/template';
+import * as reactivity_2a7920412bac4009b37c4d0863a6596e0 from '@esportsplus/reactivity';
+import { root } from '@esportsplus/reactivity';
 import form from '../../components/form/index.js';
 import './scss/index.scss';
-const template_b5a9a3f5040540948313f36934d7b05b33 = template_b5a9a3f5040540948313f36934d7b05b1.template(`<input class='range --border-state --border-black' type='range'  />`);
+const template_2a7920412bac4009b37c4d0863a6596e3e = template_2a7920412bac4009b37c4d0863a6596e1.template(`<input class='range --border-state --border-black' type='range'  />`);
+class ReactiveObject_2a7920412bac4009b37c4d0863a6596e3c extends reactivity_2a7920412bac4009b37c4d0863a6596e0.ReactiveObject {
+    #active = this[reactivity_2a7920412bac4009b37c4d0863a6596e0.SIGNAL](false);
+    #error = this[reactivity_2a7920412bac4009b37c4d0863a6596e0.SIGNAL]('');
+    #value = this[reactivity_2a7920412bac4009b37c4d0863a6596e0.SIGNAL](0);
+    constructor() {
+        super(null);
+    }
+    get active() {
+        return reactivity_2a7920412bac4009b37c4d0863a6596e0.read(this.#active);
+    }
+    set active(_v0) {
+        reactivity_2a7920412bac4009b37c4d0863a6596e0.write(this.#active, _v0);
+    }
+    get error() {
+        return reactivity_2a7920412bac4009b37c4d0863a6596e0.read(this.#error);
+    }
+    set error(_v1) {
+        reactivity_2a7920412bac4009b37c4d0863a6596e0.write(this.#error, _v1);
+    }
+    get value() {
+        return reactivity_2a7920412bac4009b37c4d0863a6596e0.read(this.#value);
+    }
+    set value(_v2) {
+        reactivity_2a7920412bac4009b37c4d0863a6596e0.write(this.#value, _v2);
+    }
+}
 export default function (attributes) {
-    let { max, min } = attributes, state = attributes.state || reactive({
-        active: false,
-        error: '',
-        value: 0
-    });
+    let { max, min } = attributes, state = attributes.state || new ReactiveObject_2a7920412bac4009b37c4d0863a6596e3c();
     if (attributes?.value) {
         state.value = Number(attributes.value);
     }
     return (() => {
-        let root_b5a9a3f5040540948313f36934d7b05b32 = template_b5a9a3f5040540948313f36934d7b05b33(), element_b5a9a3f5040540948313f36934d7b05b34 = root_b5a9a3f5040540948313f36934d7b05b32.firstChild, attributes_b5a9a3f5040540948313f36934d7b05b35 = { "class": "range --border-state --border-black", "style": "" };
-        template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b34, 'style', () => `--thumb-position: ${((state.value - min) / (max - min)) * 100}%`, attributes_b5a9a3f5040540948313f36934d7b05b35);
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b34, this?.attributes, attributes_b5a9a3f5040540948313f36934d7b05b35);
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b34, attributes, attributes_b5a9a3f5040540948313f36934d7b05b35);
-        template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b34, 'class', () => state.active && '--active', attributes_b5a9a3f5040540948313f36934d7b05b35);
-        template_b5a9a3f5040540948313f36934d7b05b1.on(element_b5a9a3f5040540948313f36934d7b05b34, 'focusin', () => {
+        let root_2a7920412bac4009b37c4d0863a6596e3d = template_2a7920412bac4009b37c4d0863a6596e3e(), element_2a7920412bac4009b37c4d0863a6596e3f = root_2a7920412bac4009b37c4d0863a6596e3d.firstChild, attributes_2a7920412bac4009b37c4d0863a6596e3g = { "class": "range --border-state --border-black", "style": "" };
+        template_2a7920412bac4009b37c4d0863a6596e1.setList(element_2a7920412bac4009b37c4d0863a6596e3f, 'style', () => `--thumb-position: ${((state.value - min) / (max - min)) * 100}%`, attributes_2a7920412bac4009b37c4d0863a6596e3g);
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3f, this?.attributes, attributes_2a7920412bac4009b37c4d0863a6596e3g);
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3f, attributes, attributes_2a7920412bac4009b37c4d0863a6596e3g);
+        template_2a7920412bac4009b37c4d0863a6596e1.setList(element_2a7920412bac4009b37c4d0863a6596e3f, 'class', () => state.active && '--active', attributes_2a7920412bac4009b37c4d0863a6596e3g);
+        template_2a7920412bac4009b37c4d0863a6596e1.on(element_2a7920412bac4009b37c4d0863a6596e3f, 'focusin', () => {
             state.active = true;
         });
-        template_b5a9a3f5040540948313f36934d7b05b1.on(element_b5a9a3f5040540948313f36934d7b05b34, 'focusout', () => {
+        template_2a7920412bac4009b37c4d0863a6596e1.on(element_2a7920412bac4009b37c4d0863a6596e3f, 'focusout', () => {
             state.active = false;
         });
-        template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b34, 'input', (e) => {
+        template_2a7920412bac4009b37c4d0863a6596e1.delegate(element_2a7920412bac4009b37c4d0863a6596e3f, 'input', (e) => {
             state.value = Number(e.target.value);
         });
-        template_b5a9a3f5040540948313f36934d7b05b1.onrender(element_b5a9a3f5040540948313f36934d7b05b34, form.input.onrender(state));
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperty(element_b5a9a3f5040540948313f36934d7b05b34, 'value', root(() => attributes?.value || state.value || 0));
-        return root_b5a9a3f5040540948313f36934d7b05b32;
+        template_2a7920412bac4009b37c4d0863a6596e1.onrender(element_2a7920412bac4009b37c4d0863a6596e3f, form.input.onrender(state));
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperty(element_2a7920412bac4009b37c4d0863a6596e3f, 'value', root(() => attributes?.value || state.value || 0));
+        return root_2a7920412bac4009b37c4d0863a6596e3d;
     })();
 }
 ;

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

@@ -1,5 +1,5 @@
-import * as template_b5a9a3f5040540948313f36934d7b05b1 from '@esportsplus/frontend';
-import { Attributes } from '@esportsplus/frontend';
+import * as template_2a7920412bac4009b37c4d0863a6596e1 from '@esportsplus/template';
+import { Attributes } from '@esportsplus/template';
 import './scss/index.scss';
 type A = Attributes & {
     scrollbar?: Attributes;
@@ -8,20 +8,20 @@ type A = Attributes & {
 declare const _default: {
     (): ReturnType<(this: {
         attributes?: A | undefined;
-        content?: template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>;
-    }, attributes: Readonly<A>, content: template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>) => template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>>;
+        content?: template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>;
+    }, attributes: Readonly<A>, content: template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>) => template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>>;
     <T extends A>(attributes: T): ReturnType<(this: {
         attributes?: A | undefined;
-        content?: template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>;
-    }, attributes: Readonly<A>, content: template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>) => template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>>;
-    <T extends template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>>(content: T): ReturnType<(this: {
+        content?: template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>;
+    }, attributes: Readonly<A>, content: template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>) => template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>>;
+    <T extends template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>>(content: T): ReturnType<(this: {
         attributes?: A | undefined;
-        content?: template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>;
-    }, attributes: Readonly<A>, content: template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>) => template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>>;
-    (attributes: A, content: template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>): ReturnType<(this: {
+        content?: template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>;
+    }, attributes: Readonly<A>, content: template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>) => template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>>;
+    (attributes: A, content: template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>): ReturnType<(this: {
         attributes?: A | undefined;
-        content?: template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>;
-    }, attributes: Readonly<A>, content: template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>) => template_b5a9a3f5040540948313f36934d7b05b1.Renderable<any>>;
+        content?: template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>;
+    }, attributes: Readonly<A>, content: template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>) => template_2a7920412bac4009b37c4d0863a6596e1.Renderable<any>>;
 };
 export default _default;
 export type { A as Attributes };

package/build/components/scrollbar/index.js

@@ -1,23 +1,39 @@
-import * as template_b5a9a3f5040540948313f36934d7b05b1 from '@esportsplus/frontend';
-import { reactive } from '@esportsplus/frontend';
+import * as template_2a7920412bac4009b37c4d0863a6596e1 from '@esportsplus/template';
+import * as reactivity_2a7920412bac4009b37c4d0863a6596e0 from '@esportsplus/reactivity';
 import { omit } from '@esportsplus/utilities';
 import template from '../../components/template/index.js';
 import './scss/index.scss';
-const template_b5a9a3f5040540948313f36934d7b05b37 = template_b5a9a3f5040540948313f36934d7b05b1.template(`<div class='scrollbar-container'><div class='scrollbar-container-content'><!--$--></div><div class='scrollbar'></div></div>`);
+const template_2a7920412bac4009b37c4d0863a6596e3j = template_2a7920412bac4009b37c4d0863a6596e1.template(`<div class='scrollbar-container'><div class='scrollbar-container-content'><!--$--></div><div class='scrollbar'></div></div>`);
+class ReactiveObject_2a7920412bac4009b37c4d0863a6596e3h extends reactivity_2a7920412bac4009b37c4d0863a6596e0.ReactiveObject {
+    #height = this[reactivity_2a7920412bac4009b37c4d0863a6596e0.SIGNAL](100);
+    #translate = this[reactivity_2a7920412bac4009b37c4d0863a6596e0.SIGNAL](0);
+    constructor() {
+        super(null);
+    }
+    get height() {
+        return reactivity_2a7920412bac4009b37c4d0863a6596e0.read(this.#height);
+    }
+    set height(_v0) {
+        reactivity_2a7920412bac4009b37c4d0863a6596e0.write(this.#height, _v0);
+    }
+    get translate() {
+        return reactivity_2a7920412bac4009b37c4d0863a6596e0.read(this.#translate);
+    }
+    set translate(_v1) {
+        reactivity_2a7920412bac4009b37c4d0863a6596e0.write(this.#translate, _v1);
+    }
+}
 const OMIT = ['scrollbar', 'scrollbar-container-content'];
 let root = document.body, width;
 export default template.factory(function (attributes, content) {
-    let state = reactive({
-        height: 100,
-        translate: 0
-    });
+    let state = new ReactiveObject_2a7920412bac4009b37c4d0863a6596e3h();
     return (() => {
-        let root_b5a9a3f5040540948313f36934d7b05b36 = template_b5a9a3f5040540948313f36934d7b05b37(), element_b5a9a3f5040540948313f36934d7b05b38 = root_b5a9a3f5040540948313f36934d7b05b36.firstChild, element_b5a9a3f5040540948313f36934d7b05b39 = element_b5a9a3f5040540948313f36934d7b05b38.firstElementChild, element_b5a9a3f5040540948313f36934d7b05b3a = element_b5a9a3f5040540948313f36934d7b05b39.firstChild, element_b5a9a3f5040540948313f36934d7b05b3b = element_b5a9a3f5040540948313f36934d7b05b39.nextElementSibling, attributes_b5a9a3f5040540948313f36934d7b05b3c = { "class": "scrollbar-container" }, attributes_b5a9a3f5040540948313f36934d7b05b3d = { "class": "scrollbar-container-content" }, attributes_b5a9a3f5040540948313f36934d7b05b3e = { "class": "scrollbar" };
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b38, this?.attributes && omit(this.attributes, OMIT), attributes_b5a9a3f5040540948313f36934d7b05b3c);
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b38, omit(attributes, OMIT), attributes_b5a9a3f5040540948313f36934d7b05b3c);
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b39, this?.attributes?.['scrollbar-container-content'], attributes_b5a9a3f5040540948313f36934d7b05b3d);
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b39, attributes['scrollbar-container-content'], attributes_b5a9a3f5040540948313f36934d7b05b3d);
-        template_b5a9a3f5040540948313f36934d7b05b1.on(element_b5a9a3f5040540948313f36934d7b05b39, 'scroll', function () {
+        let root_2a7920412bac4009b37c4d0863a6596e3i = template_2a7920412bac4009b37c4d0863a6596e3j(), element_2a7920412bac4009b37c4d0863a6596e3k = root_2a7920412bac4009b37c4d0863a6596e3i.firstChild, element_2a7920412bac4009b37c4d0863a6596e3l = element_2a7920412bac4009b37c4d0863a6596e3k.firstElementChild, element_2a7920412bac4009b37c4d0863a6596e3m = element_2a7920412bac4009b37c4d0863a6596e3l.firstChild, element_2a7920412bac4009b37c4d0863a6596e3n = element_2a7920412bac4009b37c4d0863a6596e3l.nextElementSibling, attributes_2a7920412bac4009b37c4d0863a6596e3o = { "class": "scrollbar-container" }, attributes_2a7920412bac4009b37c4d0863a6596e3p = { "class": "scrollbar-container-content" }, attributes_2a7920412bac4009b37c4d0863a6596e3q = { "class": "scrollbar" };
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3k, this?.attributes && omit(this.attributes, OMIT), attributes_2a7920412bac4009b37c4d0863a6596e3o);
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3k, omit(attributes, OMIT), attributes_2a7920412bac4009b37c4d0863a6596e3o);
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3l, this?.attributes?.['scrollbar-container-content'], attributes_2a7920412bac4009b37c4d0863a6596e3p);
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3l, attributes['scrollbar-container-content'], attributes_2a7920412bac4009b37c4d0863a6596e3p);
+        template_2a7920412bac4009b37c4d0863a6596e1.on(element_2a7920412bac4009b37c4d0863a6596e3l, 'scroll', function () {
             if (width === undefined) {
                 width = this.offsetWidth - this.clientWidth;
                 if (width && width !== 17) {
@@ -27,14 +43,14 @@ export default template.factory(function (attributes, content) {
             state.height = (this.clientHeight / this.scrollHeight) * 100;
             state.translate = (this.scrollTop / this.clientHeight) * 100;
         });
-        template_b5a9a3f5040540948313f36934d7b05b1.slot(element_b5a9a3f5040540948313f36934d7b05b3a, content);
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b3b, this?.attributes?.scrollbar, attributes_b5a9a3f5040540948313f36934d7b05b3e);
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b3b, attributes.scrollbar, attributes_b5a9a3f5040540948313f36934d7b05b3e);
-        template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b3b, 'class', () => state.height >= 100 && 'scrollbar--hidden', attributes_b5a9a3f5040540948313f36934d7b05b3e);
-        template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b3b, 'style', () => `
+        template_2a7920412bac4009b37c4d0863a6596e1.slot(element_2a7920412bac4009b37c4d0863a6596e3m, content);
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3n, this?.attributes?.scrollbar, attributes_2a7920412bac4009b37c4d0863a6596e3q);
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3n, attributes.scrollbar, attributes_2a7920412bac4009b37c4d0863a6596e3q);
+        template_2a7920412bac4009b37c4d0863a6596e1.setList(element_2a7920412bac4009b37c4d0863a6596e3n, 'class', () => state.height >= 100 && 'scrollbar--hidden', attributes_2a7920412bac4009b37c4d0863a6596e3q);
+        template_2a7920412bac4009b37c4d0863a6596e1.setList(element_2a7920412bac4009b37c4d0863a6596e3n, 'style', () => `
                             --translate: translate3d(0, ${state.translate}%, 0);
                             --height: ${state.height}%;
-                        `, attributes_b5a9a3f5040540948313f36934d7b05b3e);
-        return root_b5a9a3f5040540948313f36934d7b05b36;
+                        `, attributes_2a7920412bac4009b37c4d0863a6596e3q);
+        return root_2a7920412bac4009b37c4d0863a6596e3i;
     })();
 });

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

@@ -1,4 +1,4 @@
-import { Attributes, Renderable } from '@esportsplus/frontend';
+import { Attributes, Renderable } from '@esportsplus/template';
 import { Attributes as Attr } from '../../components/scrollbar/index.js';
 import './scss/index.scss';
 type A = {

package/build/components/select/index.js

@@ -1,13 +1,47 @@
-import * as template_b5a9a3f5040540948313f36934d7b05b1 from '@esportsplus/frontend';
-import { reactive } from '@esportsplus/frontend';
+import * as template_2a7920412bac4009b37c4d0863a6596e1 from '@esportsplus/template';
+import * as reactivity_2a7920412bac4009b37c4d0863a6596e0 from '@esportsplus/reactivity';
 import { EMPTY_ARRAY, omit, toArray } from '@esportsplus/utilities';
 import form from '../../components/form/index.js';
 import root from '../../components/root/index.js';
 import scrollbar from '../../components/scrollbar/index.js';
 import template from '../../components/template/index.js';
 import './scss/index.scss';
-const template_b5a9a3f5040540948313f36934d7b05b3g = template_b5a9a3f5040540948313f36934d7b05b1.template(`<div class='link select-option '><!--$--></div>`);
-const template_b5a9a3f5040540948313f36934d7b05b3l = template_b5a9a3f5040540948313f36934d7b05b1.template(`<div class='select tooltip '><!--$--><div class='select-arrow'></div><input class='select-tag'  /><!--$--></div>`);
+const template_2a7920412bac4009b37c4d0863a6596e3t = template_2a7920412bac4009b37c4d0863a6596e1.template(`<div class='link select-option '><!--$--></div>`);
+const template_2a7920412bac4009b37c4d0863a6596e3y = template_2a7920412bac4009b37c4d0863a6596e1.template(`<div class='select tooltip '><!--$--><div class='select-arrow'></div><input class='select-tag'  /><!--$--></div>`);
+class ReactiveObject_2a7920412bac4009b37c4d0863a6596e3r extends reactivity_2a7920412bac4009b37c4d0863a6596e0.ReactiveObject {
+    #active = this[reactivity_2a7920412bac4009b37c4d0863a6596e0.SIGNAL](false);
+    #error = this[reactivity_2a7920412bac4009b37c4d0863a6596e0.SIGNAL]('');
+    #render = this[reactivity_2a7920412bac4009b37c4d0863a6596e0.SIGNAL](false);
+    #selected;
+    constructor(_p0) {
+        super(null);
+        this.#selected = this[reactivity_2a7920412bac4009b37c4d0863a6596e0.SIGNAL](_p0);
+    }
+    get active() {
+        return reactivity_2a7920412bac4009b37c4d0863a6596e0.read(this.#active);
+    }
+    set active(_v0) {
+        reactivity_2a7920412bac4009b37c4d0863a6596e0.write(this.#active, _v0);
+    }
+    get error() {
+        return reactivity_2a7920412bac4009b37c4d0863a6596e0.read(this.#error);
+    }
+    set error(_v1) {
+        reactivity_2a7920412bac4009b37c4d0863a6596e0.write(this.#error, _v1);
+    }
+    get render() {
+        return reactivity_2a7920412bac4009b37c4d0863a6596e0.read(this.#render);
+    }
+    set render(_v2) {
+        reactivity_2a7920412bac4009b37c4d0863a6596e0.write(this.#render, _v2);
+    }
+    get selected() {
+        return reactivity_2a7920412bac4009b37c4d0863a6596e0.read(this.#selected);
+    }
+    set selected(_v3) {
+        reactivity_2a7920412bac4009b37c4d0863a6596e0.write(this.#selected, _v3);
+    }
+}
 const OMIT = [
     'arrow',
     'options',
@@ -44,24 +78,19 @@ function set(current, value) {
     }
 }
 const select = template.factory(function (attributes, content) {
-    let { options, option } = attributes, state = attributes.state || reactive({
-        active: false,
-        error: '',
-        render: false,
-        selected: attributes.selected || Object.keys(options)[0]
-    });
+    let { options, option } = attributes, state = attributes.state || new ReactiveObject_2a7920412bac4009b37c4d0863a6596e3r(attributes.selected || Object.keys(options)[0]);
     return (() => {
-        let root_b5a9a3f5040540948313f36934d7b05b3k = template_b5a9a3f5040540948313f36934d7b05b3l(), element_b5a9a3f5040540948313f36934d7b05b3m = root_b5a9a3f5040540948313f36934d7b05b3k.firstChild, element_b5a9a3f5040540948313f36934d7b05b3n = element_b5a9a3f5040540948313f36934d7b05b3m.firstChild, element_b5a9a3f5040540948313f36934d7b05b3o = element_b5a9a3f5040540948313f36934d7b05b3m.firstElementChild, element_b5a9a3f5040540948313f36934d7b05b3p = element_b5a9a3f5040540948313f36934d7b05b3o.nextElementSibling, element_b5a9a3f5040540948313f36934d7b05b3q = element_b5a9a3f5040540948313f36934d7b05b3n.nextSibling.nextSibling.nextSibling, attributes_b5a9a3f5040540948313f36934d7b05b3r = { "class": "select tooltip" }, attributes_b5a9a3f5040540948313f36934d7b05b3s = { "class": "select-arrow" };
-        template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b3m, 'class', () => state.active && '--active', attributes_b5a9a3f5040540948313f36934d7b05b3r);
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b3m, this?.attributes && omit(this.attributes, OMIT), attributes_b5a9a3f5040540948313f36934d7b05b3r);
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b3m, omit(attributes, OMIT), attributes_b5a9a3f5040540948313f36934d7b05b3r);
-        template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b3m, 'click', () => {
+        let root_2a7920412bac4009b37c4d0863a6596e3x = template_2a7920412bac4009b37c4d0863a6596e3y(), element_2a7920412bac4009b37c4d0863a6596e3z = root_2a7920412bac4009b37c4d0863a6596e3x.firstChild, element_2a7920412bac4009b37c4d0863a6596e40 = element_2a7920412bac4009b37c4d0863a6596e3z.firstChild, element_2a7920412bac4009b37c4d0863a6596e41 = element_2a7920412bac4009b37c4d0863a6596e3z.firstElementChild, element_2a7920412bac4009b37c4d0863a6596e42 = element_2a7920412bac4009b37c4d0863a6596e41.nextElementSibling, element_2a7920412bac4009b37c4d0863a6596e43 = element_2a7920412bac4009b37c4d0863a6596e40.nextSibling.nextSibling.nextSibling, attributes_2a7920412bac4009b37c4d0863a6596e44 = { "class": "select tooltip" }, attributes_2a7920412bac4009b37c4d0863a6596e45 = { "class": "select-arrow" };
+        template_2a7920412bac4009b37c4d0863a6596e1.setList(element_2a7920412bac4009b37c4d0863a6596e3z, 'class', () => state.active && '--active', attributes_2a7920412bac4009b37c4d0863a6596e44);
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3z, this?.attributes && omit(this.attributes, OMIT), attributes_2a7920412bac4009b37c4d0863a6596e44);
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3z, omit(attributes, OMIT), attributes_2a7920412bac4009b37c4d0863a6596e44);
+        template_2a7920412bac4009b37c4d0863a6596e1.delegate(element_2a7920412bac4009b37c4d0863a6596e3z, 'click', () => {
             if (state.render) {
                 set(state, !state.active);
             }
             state.render = true;
         });
-        new template_b5a9a3f5040540948313f36934d7b05b1.EffectSlot(element_b5a9a3f5040540948313f36934d7b05b3n, content ? (() => content(state)) : (() => {
+        new template_2a7920412bac4009b37c4d0863a6596e1.EffectSlot(element_2a7920412bac4009b37c4d0863a6596e40, content ? (() => content(state)) : (() => {
             let selected = options[state.selected];
             if (!selected) {
                 return '-';
@@ -71,17 +100,17 @@ const select = template.factory(function (attributes, content) {
             }
             return selected;
         }));
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b3o, this?.attributes?.arrow, attributes_b5a9a3f5040540948313f36934d7b05b3s);
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b3o, attributes.arrow, attributes_b5a9a3f5040540948313f36934d7b05b3s);
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperty(element_b5a9a3f5040540948313f36934d7b05b3p, 'name', attributes.name);
-        template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b3p, 'click', () => { });
-        template_b5a9a3f5040540948313f36934d7b05b1.onrender(element_b5a9a3f5040540948313f36934d7b05b3p, form.input.onrender(state));
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperty(element_b5a9a3f5040540948313f36934d7b05b3p, 'value', () => state.selected);
-        new template_b5a9a3f5040540948313f36934d7b05b1.EffectSlot(element_b5a9a3f5040540948313f36934d7b05b3q, () => {
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e41, this?.attributes?.arrow, attributes_2a7920412bac4009b37c4d0863a6596e45);
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e41, attributes.arrow, attributes_2a7920412bac4009b37c4d0863a6596e45);
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperty(element_2a7920412bac4009b37c4d0863a6596e42, 'name', attributes.name);
+        template_2a7920412bac4009b37c4d0863a6596e1.delegate(element_2a7920412bac4009b37c4d0863a6596e42, 'click', () => { });
+        template_2a7920412bac4009b37c4d0863a6596e1.onrender(element_2a7920412bac4009b37c4d0863a6596e42, form.input.onrender(state));
+        template_2a7920412bac4009b37c4d0863a6596e1.setProperty(element_2a7920412bac4009b37c4d0863a6596e42, 'value', () => state.selected);
+        new template_2a7920412bac4009b37c4d0863a6596e1.EffectSlot(element_2a7920412bac4009b37c4d0863a6596e43, () => {
             if (!state.render) {
                 return;
             }
-            let keys = Object.keys(options), selected = reactive(Object.fromEntries(keys.map(key => [key, false])));
+            let keys = Object.keys(options), selected = reactivity_2a7920412bac4009b37c4d0863a6596e0.reactive(Object.fromEntries(keys.map(key => [key, false])));
             return sb({
                 ...this?.attributes?.['tooltip-content'] || EMPTY_ARRAY,
                 ...attributes['tooltip-content'],
@@ -120,17 +149,17 @@ const select = template.factory(function (attributes, content) {
                     content = content.content;
                 }
                 return (() => {
-                    let root_b5a9a3f5040540948313f36934d7b05b3f = template_b5a9a3f5040540948313f36934d7b05b3g(), element_b5a9a3f5040540948313f36934d7b05b3h = root_b5a9a3f5040540948313f36934d7b05b3f.firstChild, element_b5a9a3f5040540948313f36934d7b05b3i = element_b5a9a3f5040540948313f36934d7b05b3h.firstChild, attributes_b5a9a3f5040540948313f36934d7b05b3j = { "class": "link select-option" };
-                    template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b3h, 'class', () => selected[key] && '--active', attributes_b5a9a3f5040540948313f36934d7b05b3j);
-                    template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b3h, this?.attributes?.option, attributes_b5a9a3f5040540948313f36934d7b05b3j);
-                    template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b3h, option, attributes_b5a9a3f5040540948313f36934d7b05b3j);
-                    template_b5a9a3f5040540948313f36934d7b05b1.setProperty(element_b5a9a3f5040540948313f36934d7b05b3h, 'data-key', key);
-                    template_b5a9a3f5040540948313f36934d7b05b1.slot(element_b5a9a3f5040540948313f36934d7b05b3i, content);
-                    return root_b5a9a3f5040540948313f36934d7b05b3f;
+                    let root_2a7920412bac4009b37c4d0863a6596e3s = template_2a7920412bac4009b37c4d0863a6596e3t(), element_2a7920412bac4009b37c4d0863a6596e3u = root_2a7920412bac4009b37c4d0863a6596e3s.firstChild, element_2a7920412bac4009b37c4d0863a6596e3v = element_2a7920412bac4009b37c4d0863a6596e3u.firstChild, attributes_2a7920412bac4009b37c4d0863a6596e3w = { "class": "link select-option" };
+                    template_2a7920412bac4009b37c4d0863a6596e1.setList(element_2a7920412bac4009b37c4d0863a6596e3u, 'class', () => selected[key] && '--active', attributes_2a7920412bac4009b37c4d0863a6596e3w);
+                    template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3u, this?.attributes?.option, attributes_2a7920412bac4009b37c4d0863a6596e3w);
+                    template_2a7920412bac4009b37c4d0863a6596e1.setProperties(element_2a7920412bac4009b37c4d0863a6596e3u, option, attributes_2a7920412bac4009b37c4d0863a6596e3w);
+                    template_2a7920412bac4009b37c4d0863a6596e1.setProperty(element_2a7920412bac4009b37c4d0863a6596e3u, 'data-key', key);
+                    template_2a7920412bac4009b37c4d0863a6596e1.slot(element_2a7920412bac4009b37c4d0863a6596e3v, content);
+                    return root_2a7920412bac4009b37c4d0863a6596e3s;
                 })();
             }));
         });
-        return root_b5a9a3f5040540948313f36934d7b05b3k;
+        return root_2a7920412bac4009b37c4d0863a6596e3x;
     })();
 });
 export default select;

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

@@ -2,19 +2,19 @@ import './scss/index.scss';
 declare const _default: {
     (): ReturnType<(this: {
         attributes?: import("../../components/scrollbar/index.js").Attributes | undefined;
-        content?: import("@esportsplus/frontend").Renderable<any>;
-    }, attributes: Readonly<import("../../components/scrollbar/index.js").Attributes>, content: import("@esportsplus/frontend").Renderable<any>) => import("@esportsplus/frontend").Renderable<any>>;
+        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/frontend").Renderable<any>;
-    }, attributes: Readonly<import("../../components/scrollbar/index.js").Attributes>, content: import("@esportsplus/frontend").Renderable<any>) => import("@esportsplus/frontend").Renderable<any>>;
-    <T extends import("@esportsplus/frontend").Renderable<any>>(content: T): ReturnType<(this: {
+        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/frontend").Renderable<any>;
-    }, attributes: Readonly<import("../../components/scrollbar/index.js").Attributes>, content: import("@esportsplus/frontend").Renderable<any>) => import("@esportsplus/frontend").Renderable<any>>;
-    (attributes: import("../../components/scrollbar/index.js").Attributes, content: import("@esportsplus/frontend").Renderable<any>): ReturnType<(this: {
+        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/frontend").Renderable<any>;
-    }, attributes: Readonly<import("../../components/scrollbar/index.js").Attributes>, content: import("@esportsplus/frontend").Renderable<any>) => import("@esportsplus/frontend").Renderable<any>>;
+        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>>;
 };
 export default _default;