@esportsplus/ui 0.49.4 → 0.49.5

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

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

package/build/components/accordion/index.js

@@ -1,32 +1,42 @@
-import * as template_b5a9a3f5040540948313f36934d7b05b1 from '@esportsplus/frontend';
-import { reactive } from '@esportsplus/frontend';
+import * as template_767c0c17891c439fbbf0bdc72f24ab6c1 from '@esportsplus/template';
+import * as reactivity_767c0c17891c439fbbf0bdc72f24ab6c0 from '@esportsplus/reactivity';
 import { omit } from '@esportsplus/utilities';
 import template from '../../components/template/index.js';
 import './scss/index.scss';
-const template_b5a9a3f5040540948313f36934d7b05b3 = template_b5a9a3f5040540948313f36934d7b05b1.template(`<div><!--$--></div>`);
+const template_767c0c17891c439fbbf0bdc72f24ab6c4 = template_767c0c17891c439fbbf0bdc72f24ab6c1.template(`<div><!--$--></div>`);
+class ReactiveObject_767c0c17891c439fbbf0bdc72f24ab6c2 extends reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.ReactiveObject {
+    #active = this[reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.SIGNAL](0);
+    constructor() {
+        super(null);
+    }
+    get active() {
+        return reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.read(this.#active);
+    }
+    set active(_v0) {
+        reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.write(this.#active, _v0);
+    }
+}
 const OMIT = ['state'];
 let key = Symbol();
 export default template.factory(function (attributes, content) {
-    let ref, state = attributes.state || reactive({
-        active: 0
-    });
+    let ref, state = attributes.state || new ReactiveObject_767c0c17891c439fbbf0bdc72f24ab6c2();
     return (() => {
-        let root_b5a9a3f5040540948313f36934d7b05b2 = template_b5a9a3f5040540948313f36934d7b05b3(), element_b5a9a3f5040540948313f36934d7b05b4 = root_b5a9a3f5040540948313f36934d7b05b2.firstChild, element_b5a9a3f5040540948313f36934d7b05b5 = element_b5a9a3f5040540948313f36934d7b05b4.firstChild, attributes_b5a9a3f5040540948313f36934d7b05b6 = {};
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b4, omit(attributes, OMIT), attributes_b5a9a3f5040540948313f36934d7b05b6);
-        template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b4, 'class', () => {
+        let root_767c0c17891c439fbbf0bdc72f24ab6c3 = template_767c0c17891c439fbbf0bdc72f24ab6c4(), element_767c0c17891c439fbbf0bdc72f24ab6c5 = root_767c0c17891c439fbbf0bdc72f24ab6c3.firstChild, element_767c0c17891c439fbbf0bdc72f24ab6c6 = element_767c0c17891c439fbbf0bdc72f24ab6c5.firstChild, attributes_767c0c17891c439fbbf0bdc72f24ab6c7 = {};
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperties(element_767c0c17891c439fbbf0bdc72f24ab6c5, omit(attributes, OMIT), attributes_767c0c17891c439fbbf0bdc72f24ab6c7);
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.setList(element_767c0c17891c439fbbf0bdc72f24ab6c5, 'class', () => {
             return state.active && '--active';
-        }, attributes_b5a9a3f5040540948313f36934d7b05b6);
-        template_b5a9a3f5040540948313f36934d7b05b1.onrender(element_b5a9a3f5040540948313f36934d7b05b4, (element) => {
+        }, attributes_767c0c17891c439fbbf0bdc72f24ab6c7);
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.onrender(element_767c0c17891c439fbbf0bdc72f24ab6c5, (element) => {
             (ref = element)[key] = state;
         });
-        template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b4, 'style', () => {
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.setList(element_767c0c17891c439fbbf0bdc72f24ab6c5, 'style', () => {
             let parent = ref.closest('accordion');
             if (parent && key in parent) {
                 parent[key].active = (+parent[key].active) + 1;
             }
             return state.active && `--max-height: ${ref.scrollHeight}`;
-        }, attributes_b5a9a3f5040540948313f36934d7b05b6);
-        template_b5a9a3f5040540948313f36934d7b05b1.slot(element_b5a9a3f5040540948313f36934d7b05b5, content);
-        return root_b5a9a3f5040540948313f36934d7b05b2;
+        }, attributes_767c0c17891c439fbbf0bdc72f24ab6c7);
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.slot(element_767c0c17891c439fbbf0bdc72f24ab6c6, content);
+        return root_767c0c17891c439fbbf0bdc72f24ab6c3;
     })();
 });

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

@@ -1,6 +1,6 @@
 import '@esportsplus/vite/global.d.ts';
 import { Response } from '@esportsplus/action';
-import { Attributes, Renderable } from '@esportsplus/frontend';
+import { Attributes, Renderable } from '@esportsplus/template';
 import './scss/index.scss';
 declare const _default: (attributes: Attributes & {
     "alert-close"?: Attributes;

package/build/components/alert/index.js

@@ -1,16 +1,52 @@
 import '@esportsplus/vite/global.d.ts';
-import * as template_b5a9a3f5040540948313f36934d7b05b1 from '@esportsplus/frontend';
-import { reactive, svg } from '@esportsplus/frontend';
+import * as template_767c0c17891c439fbbf0bdc72f24ab6c1 from '@esportsplus/template';
+import { svg } from '@esportsplus/template';
+import * as reactivity_767c0c17891c439fbbf0bdc72f24ab6c0 from '@esportsplus/reactivity';
 import { omit } from '@esportsplus/utilities';
 import { icon } from '@esportsplus/ui';
 import check from './svg/check.svg';
 import close from './svg/close.svg';
 import e from './svg/error.svg';
 import './scss/index.scss';
-const template_b5a9a3f5040540948313f36934d7b05b8 = template_b5a9a3f5040540948313f36934d7b05b1.template(`<div class='--flex-vertical'><!--$--></div>`);
-const template_b5a9a3f5040540948313f36934d7b05bd = template_b5a9a3f5040540948313f36934d7b05b1.template(`<p><!--$--></p>`);
-const template_b5a9a3f5040540948313f36934d7b05bi = template_b5a9a3f5040540948313f36934d7b05b1.template(`<div class='--flex-start'><!--$--></div>`);
-const template_b5a9a3f5040540948313f36934d7b05bl = template_b5a9a3f5040540948313f36934d7b05b1.template(`<div class='alert anchor anchor--n  --flex-row'><!--$--><div class='alert-messages --flex-column --flex-fill'><!--$--></div><div class="--flex-vertical"><div class='alert-close button --padding-300'><div class="icon" style='--size: 14px;'><!--$--></div></div></div></div>`);
+const template_767c0c17891c439fbbf0bdc72f24ab6ca = template_767c0c17891c439fbbf0bdc72f24ab6c1.template(`<div class='--flex-vertical'><!--$--></div>`);
+const template_767c0c17891c439fbbf0bdc72f24ab6cf = template_767c0c17891c439fbbf0bdc72f24ab6c1.template(`<p><!--$--></p>`);
+const template_767c0c17891c439fbbf0bdc72f24ab6ck = template_767c0c17891c439fbbf0bdc72f24ab6c1.template(`<div class='--flex-start'><!--$--></div>`);
+const template_767c0c17891c439fbbf0bdc72f24ab6cn = template_767c0c17891c439fbbf0bdc72f24ab6c1.template(`<div class='alert anchor anchor--n  --flex-row'><!--$--><div class='alert-messages --flex-column --flex-fill'><!--$--></div><div class="--flex-vertical"><div class='alert-close button --padding-300'><div class="icon" style='--size: 14px;'><!--$--></div></div></div></div>`);
+class ReactiveObject_767c0c17891c439fbbf0bdc72f24ab6c8 extends reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.ReactiveObject {
+    #active = this[reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.SIGNAL](false);
+    #messages;
+    #rerender = this[reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.SIGNAL](0);
+    #type;
+    constructor(_p0, _p1) {
+        super(null);
+        this.#messages = this[reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.SIGNAL](_p0);
+        this.#type = this[reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.SIGNAL](_p1);
+    }
+    get active() {
+        return reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.read(this.#active);
+    }
+    set active(_v0) {
+        reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.write(this.#active, _v0);
+    }
+    get messages() {
+        return reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.read(this.#messages);
+    }
+    set messages(_v1) {
+        reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.write(this.#messages, _v1);
+    }
+    get rerender() {
+        return reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.read(this.#rerender);
+    }
+    set rerender(_v2) {
+        reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.write(this.#rerender, _v2);
+    }
+    get type() {
+        return reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.read(this.#type);
+    }
+    set type(_v3) {
+        reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.write(this.#type, _v3);
+    }
+}
 const OMIT = ['alert-close', 'alert-messages', 'alert-message'];
 let modifiers = {
     error: 'red',
@@ -57,12 +93,7 @@ function deactivate(state) {
     }, timeout);
 }
 export default (attributes) => {
-    let state = reactive({
-        active: false,
-        messages: new Set(),
-        rerender: 0,
-        type: ''
-    });
+    let state = new ReactiveObject_767c0c17891c439fbbf0bdc72f24ab6c8(new Set(), '');
     const error = (messages, seconds = 0) => activate('error', messages, seconds, state);
     error.response = (response) => {
         if (response.ok) {
@@ -77,41 +108,41 @@ export default (attributes) => {
     };
     return {
         content: (() => {
-            let root_b5a9a3f5040540948313f36934d7b05bk = template_b5a9a3f5040540948313f36934d7b05bl(), element_b5a9a3f5040540948313f36934d7b05bm = root_b5a9a3f5040540948313f36934d7b05bk.firstChild, element_b5a9a3f5040540948313f36934d7b05bn = element_b5a9a3f5040540948313f36934d7b05bm.firstChild, element_b5a9a3f5040540948313f36934d7b05bo = element_b5a9a3f5040540948313f36934d7b05bm.firstElementChild, element_b5a9a3f5040540948313f36934d7b05bp = element_b5a9a3f5040540948313f36934d7b05bo.firstChild, element_b5a9a3f5040540948313f36934d7b05bq = element_b5a9a3f5040540948313f36934d7b05bo.nextElementSibling.firstElementChild, element_b5a9a3f5040540948313f36934d7b05br = element_b5a9a3f5040540948313f36934d7b05bq.firstElementChild.firstChild, attributes_b5a9a3f5040540948313f36934d7b05bs = { "class": "alert anchor anchor--n --flex-row" }, attributes_b5a9a3f5040540948313f36934d7b05bt = { "class": "alert-messages --flex-column --flex-fill" }, attributes_b5a9a3f5040540948313f36934d7b05bu = { "class": "alert-close button --padding-300" };
-            template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05bm, 'class', () => state.active && '--active', attributes_b5a9a3f5040540948313f36934d7b05bs);
-            template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05bm, omit(attributes, OMIT), attributes_b5a9a3f5040540948313f36934d7b05bs);
-            new template_b5a9a3f5040540948313f36934d7b05b1.EffectSlot(element_b5a9a3f5040540948313f36934d7b05bn, () => {
+            let root_767c0c17891c439fbbf0bdc72f24ab6cm = template_767c0c17891c439fbbf0bdc72f24ab6cn(), element_767c0c17891c439fbbf0bdc72f24ab6co = root_767c0c17891c439fbbf0bdc72f24ab6cm.firstChild, element_767c0c17891c439fbbf0bdc72f24ab6cp = element_767c0c17891c439fbbf0bdc72f24ab6co.firstChild, element_767c0c17891c439fbbf0bdc72f24ab6cq = element_767c0c17891c439fbbf0bdc72f24ab6co.firstElementChild, element_767c0c17891c439fbbf0bdc72f24ab6cr = element_767c0c17891c439fbbf0bdc72f24ab6cq.firstChild, element_767c0c17891c439fbbf0bdc72f24ab6cs = element_767c0c17891c439fbbf0bdc72f24ab6cq.nextElementSibling.firstElementChild, element_767c0c17891c439fbbf0bdc72f24ab6ct = element_767c0c17891c439fbbf0bdc72f24ab6cs.firstElementChild.firstChild, attributes_767c0c17891c439fbbf0bdc72f24ab6cu = { "class": "alert anchor anchor--n --flex-row" }, attributes_767c0c17891c439fbbf0bdc72f24ab6cv = { "class": "alert-messages --flex-column --flex-fill" }, attributes_767c0c17891c439fbbf0bdc72f24ab6cw = { "class": "alert-close button --padding-300" };
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.setList(element_767c0c17891c439fbbf0bdc72f24ab6co, 'class', () => state.active && '--active', attributes_767c0c17891c439fbbf0bdc72f24ab6cu);
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperties(element_767c0c17891c439fbbf0bdc72f24ab6co, omit(attributes, OMIT), attributes_767c0c17891c439fbbf0bdc72f24ab6cu);
+            new template_767c0c17891c439fbbf0bdc72f24ab6c1.EffectSlot(element_767c0c17891c439fbbf0bdc72f24ab6cp, () => {
                 let type = state.type;
                 return (() => {
-                    let root_b5a9a3f5040540948313f36934d7b05b7 = template_b5a9a3f5040540948313f36934d7b05b8(), element_b5a9a3f5040540948313f36934d7b05b9 = root_b5a9a3f5040540948313f36934d7b05b7.firstChild, element_b5a9a3f5040540948313f36934d7b05ba = element_b5a9a3f5040540948313f36934d7b05b9.firstChild, attributes_b5a9a3f5040540948313f36934d7b05bb = { "class": "--flex-vertical", "style": "" };
-                    template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b9, 'style', `--color: var(--color-${modifiers[type]}-400);`, attributes_b5a9a3f5040540948313f36934d7b05bb);
-                    template_b5a9a3f5040540948313f36934d7b05b1.slot(element_b5a9a3f5040540948313f36934d7b05ba, icon({ class: '--size-500' }, type === 'error' ? e : check));
-                    return root_b5a9a3f5040540948313f36934d7b05b7;
+                    let root_767c0c17891c439fbbf0bdc72f24ab6c9 = template_767c0c17891c439fbbf0bdc72f24ab6ca(), element_767c0c17891c439fbbf0bdc72f24ab6cb = root_767c0c17891c439fbbf0bdc72f24ab6c9.firstChild, element_767c0c17891c439fbbf0bdc72f24ab6cc = element_767c0c17891c439fbbf0bdc72f24ab6cb.firstChild, attributes_767c0c17891c439fbbf0bdc72f24ab6cd = { "class": "--flex-vertical", "style": "" };
+                    template_767c0c17891c439fbbf0bdc72f24ab6c1.setList(element_767c0c17891c439fbbf0bdc72f24ab6cb, 'style', `--color: var(--color-${modifiers[type]}-400);`, attributes_767c0c17891c439fbbf0bdc72f24ab6cd);
+                    template_767c0c17891c439fbbf0bdc72f24ab6c1.slot(element_767c0c17891c439fbbf0bdc72f24ab6cc, icon({ class: '--size-500' }, type === 'error' ? e : check));
+                    return root_767c0c17891c439fbbf0bdc72f24ab6c9;
                 })();
             });
-            template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05bo, attributes['alert-messages'], attributes_b5a9a3f5040540948313f36934d7b05bt);
-            new template_b5a9a3f5040540948313f36934d7b05b1.EffectSlot(element_b5a9a3f5040540948313f36934d7b05bp, () => {
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperties(element_767c0c17891c439fbbf0bdc72f24ab6cq, attributes['alert-messages'], attributes_767c0c17891c439fbbf0bdc72f24ab6cv);
+            new template_767c0c17891c439fbbf0bdc72f24ab6c1.EffectSlot(element_767c0c17891c439fbbf0bdc72f24ab6cr, () => {
                 let message = attributes['alert-message'];
                 return state.rerender && [...state.messages].map((content) => {
                     if (typeof content === 'string') {
                         return (() => {
-                            let root_b5a9a3f5040540948313f36934d7b05bc = template_b5a9a3f5040540948313f36934d7b05bd(), element_b5a9a3f5040540948313f36934d7b05be = root_b5a9a3f5040540948313f36934d7b05bc.firstChild, element_b5a9a3f5040540948313f36934d7b05bf = element_b5a9a3f5040540948313f36934d7b05be.firstChild, attributes_b5a9a3f5040540948313f36934d7b05bg = {};
-                            template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05be, message, attributes_b5a9a3f5040540948313f36934d7b05bg);
-                            template_b5a9a3f5040540948313f36934d7b05b1.slot(element_b5a9a3f5040540948313f36934d7b05bf, content);
-                            return root_b5a9a3f5040540948313f36934d7b05bc;
+                            let root_767c0c17891c439fbbf0bdc72f24ab6ce = template_767c0c17891c439fbbf0bdc72f24ab6cf(), element_767c0c17891c439fbbf0bdc72f24ab6cg = root_767c0c17891c439fbbf0bdc72f24ab6ce.firstChild, element_767c0c17891c439fbbf0bdc72f24ab6ch = element_767c0c17891c439fbbf0bdc72f24ab6cg.firstChild, attributes_767c0c17891c439fbbf0bdc72f24ab6ci = {};
+                            template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperties(element_767c0c17891c439fbbf0bdc72f24ab6cg, message, attributes_767c0c17891c439fbbf0bdc72f24ab6ci);
+                            template_767c0c17891c439fbbf0bdc72f24ab6c1.slot(element_767c0c17891c439fbbf0bdc72f24ab6ch, content);
+                            return root_767c0c17891c439fbbf0bdc72f24ab6ce;
                         })();
                     }
                     return (() => {
-                        let root_b5a9a3f5040540948313f36934d7b05bh = template_b5a9a3f5040540948313f36934d7b05bi(), element_b5a9a3f5040540948313f36934d7b05bj = root_b5a9a3f5040540948313f36934d7b05bh.firstChild.firstChild;
-                        template_b5a9a3f5040540948313f36934d7b05b1.slot(element_b5a9a3f5040540948313f36934d7b05bj, content);
-                        return root_b5a9a3f5040540948313f36934d7b05bh;
+                        let root_767c0c17891c439fbbf0bdc72f24ab6cj = template_767c0c17891c439fbbf0bdc72f24ab6ck(), element_767c0c17891c439fbbf0bdc72f24ab6cl = root_767c0c17891c439fbbf0bdc72f24ab6cj.firstChild.firstChild;
+                        template_767c0c17891c439fbbf0bdc72f24ab6c1.slot(element_767c0c17891c439fbbf0bdc72f24ab6cl, content);
+                        return root_767c0c17891c439fbbf0bdc72f24ab6cj;
                     })();
                 });
             });
-            template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05bq, 'click', () => deactivate(state));
-            template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05bq, attributes['alert-close'], attributes_b5a9a3f5040540948313f36934d7b05bu);
-            template_b5a9a3f5040540948313f36934d7b05b1.slot(element_b5a9a3f5040540948313f36934d7b05br, svg.sprite(close));
-            return root_b5a9a3f5040540948313f36934d7b05bk;
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.delegate(element_767c0c17891c439fbbf0bdc72f24ab6cs, 'click', () => deactivate(state));
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperties(element_767c0c17891c439fbbf0bdc72f24ab6cs, attributes['alert-close'], attributes_767c0c17891c439fbbf0bdc72f24ab6cw);
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.slot(element_767c0c17891c439fbbf0bdc72f24ab6ct, svg.sprite(close));
+            return root_767c0c17891c439fbbf0bdc72f24ab6cm;
         })(),
         deactivate: () => deactivate(state),
         error,

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

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

package/build/components/back/index.js

@@ -1,16 +1,16 @@
-import * as template_b5a9a3f5040540948313f36934d7b05b1 from '@esportsplus/frontend';
+import * as template_767c0c17891c439fbbf0bdc72f24ab6c1 from '@esportsplus/template';
 import icon from '../../components/icon/index.js';
 import template from '../../components/template/index.js';
 import arrow from './svg/arrow.svg';
 import './scss/index.scss';
-const template_b5a9a3f5040540948313f36934d7b05bw = template_b5a9a3f5040540948313f36934d7b05b1.template(`<a class='back link --padding-0px --flex-vertical'><!--$--><!--$--></a>`);
+const template_767c0c17891c439fbbf0bdc72f24ab6cy = template_767c0c17891c439fbbf0bdc72f24ab6c1.template(`<a class='back link --padding-0px --flex-vertical'><!--$--><!--$--></a>`);
 export default template.factory(function (attributes, content) {
     return (() => {
-        let root_b5a9a3f5040540948313f36934d7b05bv = template_b5a9a3f5040540948313f36934d7b05bw(), element_b5a9a3f5040540948313f36934d7b05bx = root_b5a9a3f5040540948313f36934d7b05bv.firstChild, element_b5a9a3f5040540948313f36934d7b05by = element_b5a9a3f5040540948313f36934d7b05bx.firstChild, element_b5a9a3f5040540948313f36934d7b05bz = element_b5a9a3f5040540948313f36934d7b05by.nextSibling, attributes_b5a9a3f5040540948313f36934d7b05b10 = { "class": "back link --padding-0px --flex-vertical" };
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05bx, this.attributes, attributes_b5a9a3f5040540948313f36934d7b05b10);
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05bx, attributes, attributes_b5a9a3f5040540948313f36934d7b05b10);
-        template_b5a9a3f5040540948313f36934d7b05b1.slot(element_b5a9a3f5040540948313f36934d7b05by, icon({ class: 'back-arrow --margin-right --margin-200' }, arrow));
-        template_b5a9a3f5040540948313f36934d7b05b1.slot(element_b5a9a3f5040540948313f36934d7b05bz, content);
-        return root_b5a9a3f5040540948313f36934d7b05bv;
+        let root_767c0c17891c439fbbf0bdc72f24ab6cx = template_767c0c17891c439fbbf0bdc72f24ab6cy(), element_767c0c17891c439fbbf0bdc72f24ab6cz = root_767c0c17891c439fbbf0bdc72f24ab6cx.firstChild, element_767c0c17891c439fbbf0bdc72f24ab6c10 = element_767c0c17891c439fbbf0bdc72f24ab6cz.firstChild, element_767c0c17891c439fbbf0bdc72f24ab6c11 = element_767c0c17891c439fbbf0bdc72f24ab6c10.nextSibling, attributes_767c0c17891c439fbbf0bdc72f24ab6c12 = { "class": "back link --padding-0px --flex-vertical" };
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperties(element_767c0c17891c439fbbf0bdc72f24ab6cz, this.attributes, attributes_767c0c17891c439fbbf0bdc72f24ab6c12);
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperties(element_767c0c17891c439fbbf0bdc72f24ab6cz, attributes, attributes_767c0c17891c439fbbf0bdc72f24ab6c12);
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.slot(element_767c0c17891c439fbbf0bdc72f24ab6c10, icon({ class: 'back-arrow --margin-right --margin-200' }, arrow));
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.slot(element_767c0c17891c439fbbf0bdc72f24ab6c11, content);
+        return root_767c0c17891c439fbbf0bdc72f24ab6cx;
     })();
 });

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

@@ -1,24 +1,24 @@
-import * as template_b5a9a3f5040540948313f36934d7b05b1 from '@esportsplus/frontend';
-import { Renderable } from '@esportsplus/frontend';
+import * as template_767c0c17891c439fbbf0bdc72f24ab6c1 from '@esportsplus/template';
+import { Renderable } from '@esportsplus/template';
 import './scss/index.scss';
 declare const hold: {
     (): ReturnType<(this: {
-        attributes?: template_b5a9a3f5040540948313f36934d7b05b1.Attributes | undefined;
+        attributes?: template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes | undefined;
         content?: ((state: {
             holding: boolean;
             complete: boolean;
         }) => Renderable<any>) | undefined;
-    }, attributes: Readonly<template_b5a9a3f5040540948313f36934d7b05b1.Attributes>, content: (state: {
+    }, attributes: Readonly<template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes>, content: (state: {
         holding: boolean;
         complete: boolean;
     }) => Renderable<any>) => Renderable<any>>;
-    <T extends template_b5a9a3f5040540948313f36934d7b05b1.Attributes>(attributes: T): ReturnType<(this: {
-        attributes?: template_b5a9a3f5040540948313f36934d7b05b1.Attributes | undefined;
+    <T extends template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes>(attributes: T): ReturnType<(this: {
+        attributes?: template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes | undefined;
         content?: ((state: {
             holding: boolean;
             complete: boolean;
         }) => Renderable<any>) | undefined;
-    }, attributes: Readonly<template_b5a9a3f5040540948313f36934d7b05b1.Attributes>, content: (state: {
+    }, attributes: Readonly<template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes>, content: (state: {
         holding: boolean;
         complete: boolean;
     }) => Renderable<any>) => Renderable<any>>;
@@ -26,25 +26,25 @@ declare const hold: {
         holding: boolean;
         complete: boolean;
     }) => Renderable<any>>(content: T): ReturnType<(this: {
-        attributes?: template_b5a9a3f5040540948313f36934d7b05b1.Attributes | undefined;
+        attributes?: template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes | undefined;
         content?: ((state: {
             holding: boolean;
             complete: boolean;
         }) => Renderable<any>) | undefined;
-    }, attributes: Readonly<template_b5a9a3f5040540948313f36934d7b05b1.Attributes>, content: (state: {
+    }, attributes: Readonly<template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes>, content: (state: {
         holding: boolean;
         complete: boolean;
     }) => Renderable<any>) => Renderable<any>>;
-    (attributes: template_b5a9a3f5040540948313f36934d7b05b1.Attributes, content: (state: {
+    (attributes: template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes, content: (state: {
         holding: boolean;
         complete: boolean;
     }) => Renderable<any>): ReturnType<(this: {
-        attributes?: template_b5a9a3f5040540948313f36934d7b05b1.Attributes | undefined;
+        attributes?: template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes | undefined;
         content?: ((state: {
             holding: boolean;
             complete: boolean;
         }) => Renderable<any>) | undefined;
-    }, attributes: Readonly<template_b5a9a3f5040540948313f36934d7b05b1.Attributes>, content: (state: {
+    }, attributes: Readonly<template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes>, content: (state: {
         holding: boolean;
         complete: boolean;
     }) => Renderable<any>) => Renderable<any>>;
@@ -52,22 +52,22 @@ declare const hold: {
 declare const _default: {
     hold: {
         (): ReturnType<(this: {
-            attributes?: template_b5a9a3f5040540948313f36934d7b05b1.Attributes | undefined;
+            attributes?: template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes | undefined;
             content?: ((state: {
                 holding: boolean;
                 complete: boolean;
             }) => Renderable<any>) | undefined;
-        }, attributes: Readonly<template_b5a9a3f5040540948313f36934d7b05b1.Attributes>, content: (state: {
+        }, attributes: Readonly<template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes>, content: (state: {
             holding: boolean;
             complete: boolean;
         }) => Renderable<any>) => Renderable<any>>;
-        <T extends template_b5a9a3f5040540948313f36934d7b05b1.Attributes>(attributes: T): ReturnType<(this: {
-            attributes?: template_b5a9a3f5040540948313f36934d7b05b1.Attributes | undefined;
+        <T extends template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes>(attributes: T): ReturnType<(this: {
+            attributes?: template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes | undefined;
             content?: ((state: {
                 holding: boolean;
                 complete: boolean;
             }) => Renderable<any>) | undefined;
-        }, attributes: Readonly<template_b5a9a3f5040540948313f36934d7b05b1.Attributes>, content: (state: {
+        }, attributes: Readonly<template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes>, content: (state: {
             holding: boolean;
             complete: boolean;
         }) => Renderable<any>) => Renderable<any>>;
@@ -75,25 +75,25 @@ declare const _default: {
             holding: boolean;
             complete: boolean;
         }) => Renderable<any>>(content: T): ReturnType<(this: {
-            attributes?: template_b5a9a3f5040540948313f36934d7b05b1.Attributes | undefined;
+            attributes?: template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes | undefined;
             content?: ((state: {
                 holding: boolean;
                 complete: boolean;
             }) => Renderable<any>) | undefined;
-        }, attributes: Readonly<template_b5a9a3f5040540948313f36934d7b05b1.Attributes>, content: (state: {
+        }, attributes: Readonly<template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes>, content: (state: {
             holding: boolean;
             complete: boolean;
         }) => Renderable<any>) => Renderable<any>>;
-        (attributes: template_b5a9a3f5040540948313f36934d7b05b1.Attributes, content: (state: {
+        (attributes: template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes, content: (state: {
             holding: boolean;
             complete: boolean;
         }) => Renderable<any>): ReturnType<(this: {
-            attributes?: template_b5a9a3f5040540948313f36934d7b05b1.Attributes | undefined;
+            attributes?: template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes | undefined;
             content?: ((state: {
                 holding: boolean;
                 complete: boolean;
             }) => Renderable<any>) | undefined;
-        }, attributes: Readonly<template_b5a9a3f5040540948313f36934d7b05b1.Attributes>, content: (state: {
+        }, attributes: Readonly<template_767c0c17891c439fbbf0bdc72f24ab6c1.Attributes>, content: (state: {
             holding: boolean;
             complete: boolean;
         }) => Renderable<any>) => Renderable<any>>;

package/build/components/button/index.js

@@ -1,44 +1,60 @@
-import * as template_b5a9a3f5040540948313f36934d7b05b1 from '@esportsplus/frontend';
-import { reactive } from '@esportsplus/frontend';
+import * as template_767c0c17891c439fbbf0bdc72f24ab6c1 from '@esportsplus/template';
+import * as reactivity_767c0c17891c439fbbf0bdc72f24ab6c0 from '@esportsplus/reactivity';
 import template from '../template/index.js';
 import './scss/index.scss';
-const template_b5a9a3f5040540948313f36934d7b05b12 = template_b5a9a3f5040540948313f36934d7b05b1.template(`<div class='button '><!--$--></div>`);
+const template_767c0c17891c439fbbf0bdc72f24ab6c15 = template_767c0c17891c439fbbf0bdc72f24ab6c1.template(`<div class='button '><!--$--></div>`);
+class ReactiveObject_767c0c17891c439fbbf0bdc72f24ab6c13 extends reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.ReactiveObject {
+    #complete = this[reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.SIGNAL](false);
+    #holding = this[reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.SIGNAL](false);
+    constructor() {
+        super(null);
+    }
+    get complete() {
+        return reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.read(this.#complete);
+    }
+    set complete(_v0) {
+        reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.write(this.#complete, _v0);
+    }
+    get holding() {
+        return reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.read(this.#holding);
+    }
+    set holding(_v1) {
+        reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.write(this.#holding, _v1);
+    }
+}
 const hold = template.factory(function (attributes, content) {
     let end = () => {
         if (!state.complete) {
             state.holding = false;
         }
-    }, state = reactive({
-        complete: false,
-        holding: false
-    });
+    }, state = new ReactiveObject_767c0c17891c439fbbf0bdc72f24ab6c13();
     return (() => {
-        let root_b5a9a3f5040540948313f36934d7b05b11 = template_b5a9a3f5040540948313f36934d7b05b12(), element_b5a9a3f5040540948313f36934d7b05b13 = root_b5a9a3f5040540948313f36934d7b05b11.firstChild, element_b5a9a3f5040540948313f36934d7b05b14 = element_b5a9a3f5040540948313f36934d7b05b13.firstChild, attributes_b5a9a3f5040540948313f36934d7b05b15 = { "class": "button" };
-        template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b13, 'class', () => state.holding && 'button--holding', attributes_b5a9a3f5040540948313f36934d7b05b15);
-        template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b13, 'class', () => state.complete && '--active', attributes_b5a9a3f5040540948313f36934d7b05b15);
-        template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b13, 'mousedown', (e) => {
+        let root_767c0c17891c439fbbf0bdc72f24ab6c14 = template_767c0c17891c439fbbf0bdc72f24ab6c15(), element_767c0c17891c439fbbf0bdc72f24ab6c16 = root_767c0c17891c439fbbf0bdc72f24ab6c14.firstChild, element_767c0c17891c439fbbf0bdc72f24ab6c17 = element_767c0c17891c439fbbf0bdc72f24ab6c16.firstChild, attributes_767c0c17891c439fbbf0bdc72f24ab6c18 = { "class": "button" };
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.setList(element_767c0c17891c439fbbf0bdc72f24ab6c16, 'class', () => state.holding && 'button--holding', attributes_767c0c17891c439fbbf0bdc72f24ab6c18);
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.setList(element_767c0c17891c439fbbf0bdc72f24ab6c16, 'class', () => state.complete && '--active', attributes_767c0c17891c439fbbf0bdc72f24ab6c18);
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.delegate(element_767c0c17891c439fbbf0bdc72f24ab6c16, 'mousedown', (e) => {
             e.preventDefault();
             state.holding = true;
         });
-        template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b13, attributes, attributes_b5a9a3f5040540948313f36934d7b05b15);
-        template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b13, 'animationend', (e) => {
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperties(element_767c0c17891c439fbbf0bdc72f24ab6c16, attributes, attributes_767c0c17891c439fbbf0bdc72f24ab6c18);
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.delegate(element_767c0c17891c439fbbf0bdc72f24ab6c16, 'animationend', (e) => {
             if (e.animationName === 'buttonHolding') {
                 state.complete = true;
             }
         });
-        template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b13, 'click', () => { });
-        template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b13, 'mousedown', (e) => {
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.delegate(element_767c0c17891c439fbbf0bdc72f24ab6c16, 'click', () => { });
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.delegate(element_767c0c17891c439fbbf0bdc72f24ab6c16, 'mousedown', (e) => {
             e.preventDefault();
             state.holding = true;
         });
-        template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b13, 'mouseup', end);
-        template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b13, 'touchend', end);
-        template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b13, 'touchstart', (e) => {
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.delegate(element_767c0c17891c439fbbf0bdc72f24ab6c16, 'mouseup', end);
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.delegate(element_767c0c17891c439fbbf0bdc72f24ab6c16, 'touchend', end);
+        template_767c0c17891c439fbbf0bdc72f24ab6c1.delegate(element_767c0c17891c439fbbf0bdc72f24ab6c16, 'touchstart', (e) => {
             e.preventDefault();
             state.holding = true;
         });
-        new template_b5a9a3f5040540948313f36934d7b05b1.EffectSlot(element_b5a9a3f5040540948313f36934d7b05b14, () => content(state));
-        return root_b5a9a3f5040540948313f36934d7b05b11;
+        new template_767c0c17891c439fbbf0bdc72f24ab6c1.EffectSlot(element_767c0c17891c439fbbf0bdc72f24ab6c17, () => content(state));
+        return root_767c0c17891c439fbbf0bdc72f24ab6c14;
     })();
 });
 export default { hold };

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

@@ -1,4 +1,4 @@
-import { Attributes } from '@esportsplus/frontend';
+import { Attributes } from '@esportsplus/template';
 import './scss/index.scss';
 declare const factory: (type: string) => (this: {
     attributes?: Attributes;

package/build/components/checkbox/index.js

@@ -1,34 +1,51 @@
-import * as template_b5a9a3f5040540948313f36934d7b05b1 from '@esportsplus/frontend';
-import { reactive, root } from '@esportsplus/frontend';
+import * as template_767c0c17891c439fbbf0bdc72f24ab6c1 from '@esportsplus/template';
+import * as reactivity_767c0c17891c439fbbf0bdc72f24ab6c0 from '@esportsplus/reactivity';
+import { root } from '@esportsplus/reactivity';
 import { omit } from '@esportsplus/utilities';
 import form from '../../components/form/index.js';
 import './scss/index.scss';
-const template_b5a9a3f5040540948313f36934d7b05b17 = template_b5a9a3f5040540948313f36934d7b05b1.template(`<div><input></div>`);
+const template_767c0c17891c439fbbf0bdc72f24ab6c1b = template_767c0c17891c439fbbf0bdc72f24ab6c1.template(`<div><input></div>`);
+class ReactiveObject_767c0c17891c439fbbf0bdc72f24ab6c19 extends reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.ReactiveObject {
+    #active = this[reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.SIGNAL](false);
+    #error = this[reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.SIGNAL]('');
+    constructor() {
+        super(null);
+    }
+    get active() {
+        return reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.read(this.#active);
+    }
+    set active(_v0) {
+        reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.write(this.#active, _v0);
+    }
+    get error() {
+        return reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.read(this.#error);
+    }
+    set error(_v1) {
+        reactivity_767c0c17891c439fbbf0bdc72f24ab6c0.write(this.#error, _v1);
+    }
+}
 const OMIT = ['checked', 'value'];
 const factory = (type) => {
     function template(attributes) {
-        let state = attributes?.state || reactive({
-            active: false,
-            error: ''
-        });
+        let state = attributes?.state || new ReactiveObject_767c0c17891c439fbbf0bdc72f24ab6c19();
         if (attributes?.checked) {
             state.active = true;
         }
         return (() => {
-            let root_b5a9a3f5040540948313f36934d7b05b16 = template_b5a9a3f5040540948313f36934d7b05b17(), element_b5a9a3f5040540948313f36934d7b05b18 = root_b5a9a3f5040540948313f36934d7b05b16.firstChild, element_b5a9a3f5040540948313f36934d7b05b19 = element_b5a9a3f5040540948313f36934d7b05b18.firstElementChild, attributes_b5a9a3f5040540948313f36934d7b05b1a = { "class": "" }, attributes_b5a9a3f5040540948313f36934d7b05b1b = {};
-            template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b18, 'class', type, attributes_b5a9a3f5040540948313f36934d7b05b1a);
-            template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b18, 'class', () => state.active && '--active', attributes_b5a9a3f5040540948313f36934d7b05b1a);
-            template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b18, this?.attributes && omit(this.attributes, OMIT), attributes_b5a9a3f5040540948313f36934d7b05b1a);
-            template_b5a9a3f5040540948313f36934d7b05b1.setProperties(element_b5a9a3f5040540948313f36934d7b05b18, attributes && omit(attributes, OMIT), attributes_b5a9a3f5040540948313f36934d7b05b1a);
-            template_b5a9a3f5040540948313f36934d7b05b1.setProperty(element_b5a9a3f5040540948313f36934d7b05b19, 'checked', attributes?.checked || root(() => state.active));
-            template_b5a9a3f5040540948313f36934d7b05b1.setList(element_b5a9a3f5040540948313f36934d7b05b19, 'class', `${type}-tag`, attributes_b5a9a3f5040540948313f36934d7b05b1b);
-            template_b5a9a3f5040540948313f36934d7b05b1.delegate(element_b5a9a3f5040540948313f36934d7b05b19, 'change', (e) => {
+            let root_767c0c17891c439fbbf0bdc72f24ab6c1a = template_767c0c17891c439fbbf0bdc72f24ab6c1b(), element_767c0c17891c439fbbf0bdc72f24ab6c1c = root_767c0c17891c439fbbf0bdc72f24ab6c1a.firstChild, element_767c0c17891c439fbbf0bdc72f24ab6c1d = element_767c0c17891c439fbbf0bdc72f24ab6c1c.firstElementChild, attributes_767c0c17891c439fbbf0bdc72f24ab6c1e = { "class": "" }, attributes_767c0c17891c439fbbf0bdc72f24ab6c1f = {};
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.setList(element_767c0c17891c439fbbf0bdc72f24ab6c1c, 'class', type, attributes_767c0c17891c439fbbf0bdc72f24ab6c1e);
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.setList(element_767c0c17891c439fbbf0bdc72f24ab6c1c, 'class', () => state.active && '--active', attributes_767c0c17891c439fbbf0bdc72f24ab6c1e);
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperties(element_767c0c17891c439fbbf0bdc72f24ab6c1c, this?.attributes && omit(this.attributes, OMIT), attributes_767c0c17891c439fbbf0bdc72f24ab6c1e);
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperties(element_767c0c17891c439fbbf0bdc72f24ab6c1c, attributes && omit(attributes, OMIT), attributes_767c0c17891c439fbbf0bdc72f24ab6c1e);
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperty(element_767c0c17891c439fbbf0bdc72f24ab6c1d, 'checked', attributes?.checked || root(() => state.active));
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.setList(element_767c0c17891c439fbbf0bdc72f24ab6c1d, 'class', `${type}-tag`, attributes_767c0c17891c439fbbf0bdc72f24ab6c1f);
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.delegate(element_767c0c17891c439fbbf0bdc72f24ab6c1d, 'change', (e) => {
                 state.active = e.target.checked;
             });
-            template_b5a9a3f5040540948313f36934d7b05b1.onrender(element_b5a9a3f5040540948313f36934d7b05b19, form.input.onrender(state));
-            template_b5a9a3f5040540948313f36934d7b05b1.setProperty(element_b5a9a3f5040540948313f36934d7b05b19, 'type', type === 'radio' ? 'radio' : 'checkbox');
-            template_b5a9a3f5040540948313f36934d7b05b1.setProperty(element_b5a9a3f5040540948313f36934d7b05b19, 'value', attributes?.value || 1);
-            return root_b5a9a3f5040540948313f36934d7b05b16;
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.onrender(element_767c0c17891c439fbbf0bdc72f24ab6c1d, form.input.onrender(state));
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperty(element_767c0c17891c439fbbf0bdc72f24ab6c1d, 'type', type === 'radio' ? 'radio' : 'checkbox');
+            template_767c0c17891c439fbbf0bdc72f24ab6c1.setProperty(element_767c0c17891c439fbbf0bdc72f24ab6c1d, 'value', attributes?.value || 1);
+            return root_767c0c17891c439fbbf0bdc72f24ab6c1a;
         })();
     }
     return template;