@esportsplus/ui 0.51.1 → 0.51.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/components/accordion/index.d.ts +16 -16
- package/build/components/accordion/index.js +17 -17
- package/build/components/accordion/scss/index.scss +1 -1
- package/build/components/alert/index.js +41 -41
- package/build/components/alert/scss/index.scss +1 -1
- package/build/components/anchor/scss/index.scss +1 -1
- package/build/components/back/index.d.ts +8 -8
- package/build/components/back/index.js +8 -8
- package/build/components/back/scss/index.scss +1 -1
- package/build/components/banner/scss/index.scss +1 -1
- package/build/components/border/scss/index.scss +1 -1
- package/build/components/bubble/scss/index.scss +1 -1
- package/build/components/button/index.d.ts +21 -21
- package/build/components/button/index.js +23 -23
- package/build/components/button/scss/index.scss +1 -1
- package/build/components/card/scss/index.scss +1 -1
- package/build/components/checkbox/index.js +23 -23
- package/build/components/checkbox/scss/index.scss +1 -1
- package/build/components/clipboard/onclick.js +13 -13
- package/build/components/container/scss/index.scss +1 -1
- package/build/components/counter/index.js +34 -34
- package/build/components/counter/scss/index.scss +1 -1
- package/build/components/ellipsis/index.js +5 -5
- package/build/components/ellipsis/scss/index.scss +1 -1
- package/build/components/form/action.js +8 -8
- package/build/components/form/scss/index.scss +1 -1
- package/build/components/frame/scss/index.scss +1 -1
- package/build/components/grid/scss/index.scss +1 -1
- package/build/components/highlight/index.d.ts +16 -16
- package/build/components/highlight/index.js +15 -15
- package/build/components/highlight/scss/index.scss +1 -1
- package/build/components/icon/index.d.ts +11 -11
- package/build/components/icon/index.js +6 -6
- package/build/components/input/index.js +20 -20
- package/build/components/input/scss/index.scss +1 -1
- package/build/components/link/scss/index.scss +1 -1
- package/build/components/loader/index.d.ts +16 -16
- package/build/components/loader/index.js +33 -33
- package/build/components/loading/index.js +5 -5
- package/build/components/loading/scss/index.scss +1 -1
- package/build/components/modal/scss/index.scss +1 -1
- package/build/components/page/scss/index.scss +1 -1
- package/build/components/radio/scss/index.scss +1 -1
- package/build/components/range/index.js +25 -25
- package/build/components/range/scss/index.scss +1 -1
- package/build/components/root/scss/index.scss +1 -1
- package/build/components/scrollbar/index.d.ts +11 -11
- package/build/components/scrollbar/index.js +24 -24
- package/build/components/scrollbar/scss/index.scss +1 -1
- package/build/components/select/index.js +40 -40
- package/build/components/select/scss/index.scss +1 -1
- package/build/components/sidebar/scss/index.scss +1 -1
- package/build/components/switch/scss/index.scss +1 -1
- package/build/components/text/scss/index.scss +1 -1
- package/build/components/textarea/index.js +20 -20
- package/build/components/textarea/scss/index.scss +1 -1
- package/build/components/tooltip/menu.d.ts +11 -11
- package/build/components/tooltip/menu.js +20 -20
- package/build/components/tooltip/onclick.d.ts +1101 -1101
- package/build/components/tooltip/onclick.js +14 -14
- package/build/components/tooltip/onhover.d.ts +16 -16
- package/build/components/tooltip/onhover.js +15 -15
- package/build/components/tooltip/scss/index.scss +1 -1
- package/build/components/typewriter/index.d.ts +11 -11
- package/build/components/typewriter/index.js +14 -14
- package/build/css-utilities/border/scss/index.scss +1 -1
- package/build/css-utilities/error/scss/index.scss +1 -1
- package/build/css-utilities/flex/scss/index.scss +1 -1
- package/build/css-utilities/flicker/scss/index.scss +1 -1
- package/build/css-utilities/gap/scss/index.scss +1 -1
- package/build/css-utilities/index.scss +1 -1
- package/build/css-utilities/scroller/scss/index.scss +1 -1
- package/build/css-utilities/skeleton/scss/index.scss +1 -1
- package/build/css-utilities/text/scss/index.scss +1 -1
- package/build/css-utilities/viewport/scss/index.scss +1 -1
- package/build/themes/dark/link/scss/index.scss +1 -1
- package/package.json +5 -5
- package/src/components/frame/scss/index.scss +2 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer components {.button{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default);--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-default:var(--background);--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default);--border-radius:var(--border-radius-400);--border-width:0px;--box-shadow:var(--box-shadow-default);--box-shadow-default:none;--color:var(--color-default);--color-active:var(--color-default);--color-default:var(--color-text-400);--color-hover:var(--color-default);--color-pressed:var(--color-default);--font-size:var(--font-size-400);--font-weight:var(--font-weight-400);--line-height:var(--line-height-400);--padding-horizontal:var(--size-400);--padding-vertical:var(--size-400);--width:auto}.button.--active{--background:var(--background-active);--border-color:var(--border-color-active);--color:var(--color-active)}.button:not(.--active):hover{--background:var(--background-hover);--border-color:var(--border-color-hover);--color:var(--color-hover)}.button:not(.--active):active{--background:var(--background-pressed);--border-color:var(--border-color-pressed);--color:var(--color-pressed)}.button--holding{--animation-duration:2.4s;--background-hold:var(--background-active)}.button--processing{--animation-duration:.64s;--border-width:var(--border-width-400);--processing-color:var(--color);--size:var(--size-400)}.button--skeleton{--animation-duration:6.4s}.button{background:var(--background);border-radius:var(--border-radius);color:var(--color);cursor:pointer;font-size:var(--font-size);font-weight:var(--font-weight);line-height:var(--line-height);padding:calc(var(--padding-vertical) - var(--border-width))calc(var(--padding-horizontal) - var(--border-width));transition:all var(--transition-duration)ease-in-out;width:var(--width);flex-wrap:wrap;place-content:center;align-items:center;display:flex;position:relative}.button:after{border-radius:inherit;box-shadow:var(--box-shadow);content:"";pointer-events:none;transition:box-shadow var(--transition-duration)ease-in-out,opacity var(--transition-duration)ease-in-out;z-index:-1;position:absolute;inset:0}.button--flat:after{display:none}.button--holding{-webkit-user-select:none;user-select:none;overflow:hidden}.button--holding:after{animation:buttonHolding var(--animation-duration)ease-in-out forwards;box-shadow:unset;background:var(--background-hold);z-index:1;border-radius:0;width:110%;height:100%;display:block;transform:translate(-100%)}@keyframes buttonHolding{to{transform:translate(0%)}}.button--holding>*{animation:buttonHoldingContentPulse calc(var(--animation-duration)/3)infinite ease-in-out;z-index:2}@keyframes buttonHoldingContentPulse{0%,to{opacity:1}50%{opacity:.4}}.button--processing{color:#0000;pointer-events:none}.button--processing:before{animation:buttonProcessing var(--animation-duration)infinite linear;border:var(--border-width)solid color-mix(in srgb,var(--processing-color),transparent 90%);border-left-color:var(--processing-color);content:"";height:var(--size);width:var(--size);border-top-color:#0000;border-right-color:#0000;border-radius:100%;position:absolute;bottom:50%;right:50%;transform:translate(50%,50%)}.button--processing *{opacity:0}@keyframes buttonProcessing{0%{transform:translate(50%,50%)rotate(0)}to{transform:translate(50%,50%)rotate(359deg)}}.button--skeleton{animation:var(--animation-duration)ease-in-out infinite buttonSkeleton;background-image:linear-gradient(270deg,var(--background-pressed),var(--background-default),var(--background-default),var(--background-pressed));color:#0000;pointer-events:none;background-size:400% 100%}.button--skeleton *{opacity:0}@keyframes buttonSkeleton{0%{background-position:200% 0}to{background-position:-200% 0}}.button--top-left,.button--top-right{top:calc((var(--padding-vertical) + var(--line-height)/2)
|
|
1
|
+
@layer components {.button{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default);--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-default:var(--background);--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default);--border-radius:var(--border-radius-400);--border-width:0px;--box-shadow:var(--box-shadow-default);--box-shadow-default:none;--color:var(--color-default);--color-active:var(--color-default);--color-default:var(--color-text-400);--color-hover:var(--color-default);--color-pressed:var(--color-default);--font-size:var(--font-size-400);--font-weight:var(--font-weight-400);--line-height:var(--line-height-400);--padding-horizontal:var(--size-400);--padding-vertical:var(--size-400);--width:auto}.button.--active{--background:var(--background-active);--border-color:var(--border-color-active);--color:var(--color-active)}.button:not(.--active):hover{--background:var(--background-hover);--border-color:var(--border-color-hover);--color:var(--color-hover)}.button:not(.--active):active{--background:var(--background-pressed);--border-color:var(--border-color-pressed);--color:var(--color-pressed)}.button--holding{--animation-duration:2.4s;--background-hold:var(--background-active)}.button--processing{--animation-duration:.64s;--border-width:var(--border-width-400);--processing-color:var(--color);--size:var(--size-400)}.button--skeleton{--animation-duration:6.4s}.button{background:var(--background);border-radius:var(--border-radius);color:var(--color);cursor:pointer;font-size:var(--font-size);font-weight:var(--font-weight);line-height:var(--line-height);padding:calc(var(--padding-vertical) - var(--border-width)) calc(var(--padding-horizontal) - var(--border-width));transition:all var(--transition-duration) ease-in-out;width:var(--width);flex-wrap:wrap;place-content:center;align-items:center;display:flex;position:relative}.button:after{border-radius:inherit;box-shadow:var(--box-shadow);content:"";pointer-events:none;transition:box-shadow var(--transition-duration) ease-in-out, opacity var(--transition-duration) ease-in-out;z-index:-1;position:absolute;inset:0}.button--flat:after{display:none}.button--holding{-webkit-user-select:none;user-select:none;overflow:hidden}.button--holding:after{animation:buttonHolding var(--animation-duration) ease-in-out forwards;box-shadow:unset;background:var(--background-hold);z-index:1;border-radius:0;width:110%;height:100%;display:block;transform:translate(-100%)}@keyframes buttonHolding{to{transform:translate(0%)}}.button--holding>*{animation:buttonHoldingContentPulse calc(var(--animation-duration) / 3) infinite ease-in-out;z-index:2}@keyframes buttonHoldingContentPulse{0%,to{opacity:1}50%{opacity:.4}}.button--processing{color:#0000;pointer-events:none}.button--processing:before{animation:buttonProcessing var(--animation-duration) infinite linear;border:var(--border-width) solid color-mix(in srgb, var(--processing-color), transparent 90%);border-left-color:var(--processing-color);content:"";height:var(--size);width:var(--size);border-top-color:#0000;border-right-color:#0000;border-radius:100%;position:absolute;bottom:50%;right:50%;transform:translate(50%,50%)}.button--processing *{opacity:0}@keyframes buttonProcessing{0%{transform:translate(50%,50%)rotate(0)}to{transform:translate(50%,50%)rotate(359deg)}}.button--skeleton{animation:var(--animation-duration) ease-in-out infinite buttonSkeleton;background-image:linear-gradient(270deg, var(--background-pressed), var(--background-default), var(--background-default), var(--background-pressed));color:#0000;pointer-events:none;background-size:400% 100%}.button--skeleton *{opacity:0}@keyframes buttonSkeleton{0%{background-position:200% 0}to{background-position:-200% 0}}.button--top-left,.button--top-right{top:calc((var(--padding-vertical) + var(--line-height)/2) * -1);position:absolute}.button--top-left{left:calc((var(--padding-horizontal) + var(--line-height)/2) * -1)}.button--top-right{right:calc((var(--padding-horizontal) + var(--line-height)/2) * -1)}.button--underline.--active,.button--underline:not(.--active):hover{text-decoration:underline}}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer components {.card{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default);--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-default:var(--background);--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default);--border-radius:var(--border-radius-400);--box-shadow:var(--box-shadow-default);--box-shadow-default:none;--padding-horizontal:0px;--padding-vertical:0px;--width:auto}.card.--active{--background:var(--background-active);--border-color:var(--border-color-active)}.card:not(.--active):hover{--background:var(--background-hover);--border-color:var(--border-color-hover)}.card:not(.--active):active{--background:var(--background-pressed);--border-color:var(--border-color-pressed)}.card{background:var(--background);border-radius:var(--border-radius);padding:var(--padding-vertical)var(--padding-horizontal);transition:background var(--transition-duration)ease-in-out,border-color var(--transition-duration)ease-in-out,box-shadow var(--transition-duration)ease-in-out,max-height var(--transition-duration)ease-in-out,opacity var(--transition-duration)ease-in-out,transform var(--transition-duration)ease-in-out;width:var(--width);position:relative}.card:after{border-radius:inherit;box-shadow:var(--box-shadow);content:"";pointer-events:none;transition:box-shadow var(--transition-duration)ease-in-out,opacity var(--transition-duration)ease-in-out;z-index:-1;position:absolute;inset:0}.card--flat:after{display:none}.card--option{border-radius:0}.card--option.--active{z-index:2}.card--option:not(.--active):hover{z-index:1}.card--option:only-child{border-radius:var(--border-radius)}.card--option:not(:only-child):not(:first-child){margin-top:calc(var(--border-width)
|
|
1
|
+
@layer components {.card{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default);--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-default:var(--background);--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default);--border-radius:var(--border-radius-400);--box-shadow:var(--box-shadow-default);--box-shadow-default:none;--padding-horizontal:0px;--padding-vertical:0px;--width:auto}.card.--active{--background:var(--background-active);--border-color:var(--border-color-active)}.card:not(.--active):hover{--background:var(--background-hover);--border-color:var(--border-color-hover)}.card:not(.--active):active{--background:var(--background-pressed);--border-color:var(--border-color-pressed)}.card{background:var(--background);border-radius:var(--border-radius);padding:var(--padding-vertical) var(--padding-horizontal);transition:background var(--transition-duration) ease-in-out, border-color var(--transition-duration) ease-in-out, box-shadow var(--transition-duration) ease-in-out, max-height var(--transition-duration) ease-in-out, opacity var(--transition-duration) ease-in-out, transform var(--transition-duration) ease-in-out;width:var(--width);position:relative}.card:after{border-radius:inherit;box-shadow:var(--box-shadow);content:"";pointer-events:none;transition:box-shadow var(--transition-duration) ease-in-out, opacity var(--transition-duration) ease-in-out;z-index:-1;position:absolute;inset:0}.card--flat:after{display:none}.card--option{border-radius:0}.card--option.--active{z-index:2}.card--option:not(.--active):hover{z-index:1}.card--option:only-child{border-radius:var(--border-radius)}.card--option:not(:only-child):not(:first-child){margin-top:calc(var(--border-width) * -1)}.card--option:not(:only-child):first-child{border-radius:var(--border-radius) var(--border-radius) 0 0}.card--option:not(:only-child):not(:has(~.card--option)){border-radius:0 0 var(--border-radius) var(--border-radius)}}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,51 +1,51 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as
|
|
1
|
+
import * as template_eee533dd50c34162b816f8be4c855b891 from '@esportsplus/template';
|
|
2
|
+
import * as reactivity_eee533dd50c34162b816f8be4c855b890 from '@esportsplus/reactivity';
|
|
3
3
|
import { root } from '@esportsplus/reactivity';
|
|
4
4
|
import { omit } from '@esportsplus/utilities';
|
|
5
5
|
import form from '../../components/form/index.js';
|
|
6
6
|
import './scss/index.scss';
|
|
7
|
-
const
|
|
8
|
-
class
|
|
9
|
-
#active = this[
|
|
10
|
-
#error = this[
|
|
7
|
+
const template_eee533dd50c34162b816f8be4c855b891b = template_eee533dd50c34162b816f8be4c855b891.template(`<div><input></div>`);
|
|
8
|
+
class ReactiveObject_eee533dd50c34162b816f8be4c855b8919 extends reactivity_eee533dd50c34162b816f8be4c855b890.ReactiveObject {
|
|
9
|
+
#active = this[reactivity_eee533dd50c34162b816f8be4c855b890.SIGNAL](false);
|
|
10
|
+
#error = this[reactivity_eee533dd50c34162b816f8be4c855b890.SIGNAL]('');
|
|
11
11
|
constructor() {
|
|
12
12
|
super(null);
|
|
13
13
|
}
|
|
14
14
|
get active() {
|
|
15
|
-
return
|
|
15
|
+
return reactivity_eee533dd50c34162b816f8be4c855b890.read(this.#active);
|
|
16
16
|
}
|
|
17
17
|
set active(_v0) {
|
|
18
|
-
|
|
18
|
+
reactivity_eee533dd50c34162b816f8be4c855b890.write(this.#active, _v0);
|
|
19
19
|
}
|
|
20
20
|
get error() {
|
|
21
|
-
return
|
|
21
|
+
return reactivity_eee533dd50c34162b816f8be4c855b890.read(this.#error);
|
|
22
22
|
}
|
|
23
23
|
set error(_v1) {
|
|
24
|
-
|
|
24
|
+
reactivity_eee533dd50c34162b816f8be4c855b890.write(this.#error, _v1);
|
|
25
25
|
}
|
|
26
26
|
}
|
|
27
27
|
const OMIT = ['checked', 'value'];
|
|
28
28
|
const factory = (type) => {
|
|
29
29
|
function template(attributes) {
|
|
30
|
-
let state = attributes?.state || new
|
|
30
|
+
let state = attributes?.state || new ReactiveObject_eee533dd50c34162b816f8be4c855b8919();
|
|
31
31
|
if (attributes?.checked) {
|
|
32
32
|
state.active = true;
|
|
33
33
|
}
|
|
34
34
|
return (() => {
|
|
35
|
-
let
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
35
|
+
let root_eee533dd50c34162b816f8be4c855b891a = template_eee533dd50c34162b816f8be4c855b891b(), element_eee533dd50c34162b816f8be4c855b891c = root_eee533dd50c34162b816f8be4c855b891a.firstChild, element_eee533dd50c34162b816f8be4c855b891d = element_eee533dd50c34162b816f8be4c855b891c.firstElementChild, attributes_eee533dd50c34162b816f8be4c855b891e = { "class": " " }, attributes_eee533dd50c34162b816f8be4c855b891f = {};
|
|
36
|
+
template_eee533dd50c34162b816f8be4c855b891.setList(element_eee533dd50c34162b816f8be4c855b891c, 'class', type, attributes_eee533dd50c34162b816f8be4c855b891e);
|
|
37
|
+
template_eee533dd50c34162b816f8be4c855b891.setList(element_eee533dd50c34162b816f8be4c855b891c, 'class', () => state.active && '--active', attributes_eee533dd50c34162b816f8be4c855b891e);
|
|
38
|
+
template_eee533dd50c34162b816f8be4c855b891.setProperties(element_eee533dd50c34162b816f8be4c855b891c, this?.attributes && omit(this.attributes, OMIT), attributes_eee533dd50c34162b816f8be4c855b891e);
|
|
39
|
+
template_eee533dd50c34162b816f8be4c855b891.setProperties(element_eee533dd50c34162b816f8be4c855b891c, attributes && omit(attributes, OMIT), attributes_eee533dd50c34162b816f8be4c855b891e);
|
|
40
|
+
template_eee533dd50c34162b816f8be4c855b891.setProperty(element_eee533dd50c34162b816f8be4c855b891d, 'checked', attributes?.checked || root(() => state.active));
|
|
41
|
+
template_eee533dd50c34162b816f8be4c855b891.setList(element_eee533dd50c34162b816f8be4c855b891d, 'class', `${type}-tag`, attributes_eee533dd50c34162b816f8be4c855b891f);
|
|
42
|
+
template_eee533dd50c34162b816f8be4c855b891.delegate(element_eee533dd50c34162b816f8be4c855b891d, 'change', (e) => {
|
|
43
43
|
state.active = e.target.checked;
|
|
44
44
|
});
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
return
|
|
45
|
+
template_eee533dd50c34162b816f8be4c855b891.onrender(element_eee533dd50c34162b816f8be4c855b891d, form.input.onrender(state));
|
|
46
|
+
template_eee533dd50c34162b816f8be4c855b891.setProperty(element_eee533dd50c34162b816f8be4c855b891d, 'type', type === 'radio' ? 'radio' : 'checkbox');
|
|
47
|
+
template_eee533dd50c34162b816f8be4c855b891.setProperty(element_eee533dd50c34162b816f8be4c855b891d, 'value', attributes?.value || 1);
|
|
48
|
+
return root_eee533dd50c34162b816f8be4c855b891a;
|
|
49
49
|
})();
|
|
50
50
|
}
|
|
51
51
|
return template;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer components {.checkbox{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default);--border-color:var(--border-color-default);--border-color-default:var(--background);--border-radius:var(--border-radius-300);--border-style:solid;--border-width:0px;--box-shadow:var(--box-shadow-default);--box-shadow-default:none;--height:var(--size);--margin-horizontal:calc(var(--width-switch) - var(--width));--opacity:var(--opacity-default);--opacity-active:var(--opacity-default);--opacity-default:1;--opacity-hover:var(--opacity-default);--opacity-pressed:var(--opacity-default);--rotate:45deg;--scale:var(--scale-default);--scale-active:1;--scale-default:0;--scale-hover:1.08;--scale-pressed:.98;--size:var(--size-600);--width:var(--height);--width-switch:40px}.checkbox:before{--border-width:4px;--box-shadow:1px 1px 0 #00000029;--height:100%;--translateX:124%;--translateY:8%;--width:50%}.checkbox:not(.--active):not(:hover):before{--translateY:100%}.checkbox:not(.--active):not(.--active):hover{--background:var(--background-hover);--border-color:var(--border-color-hover);--box-shadow:var(--box-shadow-hover);--opacity:var(--opacity-hover);--scale:var(--scale-hover)}.checkbox:not(.--active):not(.--active):active{--background:var(--background-pressed);--border-color:var(--border-color-pressed);--box-shadow:var(--box-shadow-pressed);--opacity:var(--opacity-pressed);--scale:var(--scale-pressed)}.checkbox.--active{--background:var(--background-active);--border-color:var(--border-color-active);--box-shadow:var(--box-shadow-active);--opacity:var(--opacity-active);--scale:var(--scale-active)}.checkbox{background:var(--background);border-color:var(--border-color);border-radius:var(--border-radius);border-style:var(--border-style);border-width:var(--border-width);flex:0 0 var(--width);height:var(--height);transition:background var(--transition-duration)ease-in-out,border-color var(--transition-duration)ease-in-out,box-shadow var(--transition-duration)ease-in-out,opacity var(--transition-duration)ease-in-out,transform var(--transition-duration)ease-in-out;width:var(--width);position:relative}.checkbox:invalid,.checkbox:required{box-shadow:none}.checkbox:before{border-bottom:var(--border-width)solid var(--accent);border-right:var(--border-width)solid var(--accent);box-shadow:var(--box-shadow);content:"";height:var(--height);opacity:var(--opacity);transform:translate(var(--translateX),var(--translateY))rotate(var(--rotate))scale(var(--scale));transform-origin:bottom;width:var(--width);position:absolute;bottom:50%;right:92%}.checkbox-tag{opacity:0;pointer-events:none;z-index:0;width:0;height:0;position:absolute;top:0;left:0}}
|
|
1
|
+
@layer components {.checkbox{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default);--border-color:var(--border-color-default);--border-color-default:var(--background);--border-radius:var(--border-radius-300);--border-style:solid;--border-width:0px;--box-shadow:var(--box-shadow-default);--box-shadow-default:none;--height:var(--size);--margin-horizontal:calc(var(--width-switch) - var(--width));--opacity:var(--opacity-default);--opacity-active:var(--opacity-default);--opacity-default:1;--opacity-hover:var(--opacity-default);--opacity-pressed:var(--opacity-default);--rotate:45deg;--scale:var(--scale-default);--scale-active:1;--scale-default:0;--scale-hover:1.08;--scale-pressed:.98;--size:var(--size-600);--width:var(--height);--width-switch:40px}.checkbox:before{--border-width:4px;--box-shadow:1px 1px 0 #00000029;--height:100%;--translateX:124%;--translateY:8%;--width:50%}.checkbox:not(.--active):not(:hover):before{--translateY:100%}.checkbox:not(.--active):not(.--active):hover{--background:var(--background-hover);--border-color:var(--border-color-hover);--box-shadow:var(--box-shadow-hover);--opacity:var(--opacity-hover);--scale:var(--scale-hover)}.checkbox:not(.--active):not(.--active):active{--background:var(--background-pressed);--border-color:var(--border-color-pressed);--box-shadow:var(--box-shadow-pressed);--opacity:var(--opacity-pressed);--scale:var(--scale-pressed)}.checkbox.--active{--background:var(--background-active);--border-color:var(--border-color-active);--box-shadow:var(--box-shadow-active);--opacity:var(--opacity-active);--scale:var(--scale-active)}.checkbox{background:var(--background);border-color:var(--border-color);border-radius:var(--border-radius);border-style:var(--border-style);border-width:var(--border-width);flex:0 0 var(--width);height:var(--height);transition:background var(--transition-duration) ease-in-out, border-color var(--transition-duration) ease-in-out, box-shadow var(--transition-duration) ease-in-out, opacity var(--transition-duration) ease-in-out, transform var(--transition-duration) ease-in-out;width:var(--width);position:relative}.checkbox:invalid,.checkbox:required{box-shadow:none}.checkbox:before{border-bottom:var(--border-width) solid var(--accent);border-right:var(--border-width) solid var(--accent);box-shadow:var(--box-shadow);content:"";height:var(--height);opacity:var(--opacity);transform:translate(var(--translateX), var(--translateY)) rotate(var(--rotate)) scale(var(--scale));transform-origin:bottom;width:var(--width);position:absolute;bottom:50%;right:92%}.checkbox-tag{opacity:0;pointer-events:none;z-index:0;width:0;height:0;position:absolute;top:0;left:0}}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as
|
|
1
|
+
import * as template_eee533dd50c34162b816f8be4c855b891 from '@esportsplus/template';
|
|
2
|
+
import * as reactivity_eee533dd50c34162b816f8be4c855b890 from '@esportsplus/reactivity';
|
|
3
3
|
import { omit } from '@esportsplus/utilities';
|
|
4
4
|
import template from '../../components/template/index.js';
|
|
5
5
|
import write from './write.js';
|
|
6
|
-
const
|
|
7
|
-
class
|
|
8
|
-
#copied = this[
|
|
6
|
+
const template_eee533dd50c34162b816f8be4c855b891i = template_eee533dd50c34162b816f8be4c855b891.template(`<div><!--$--></div>`);
|
|
7
|
+
class ReactiveObject_eee533dd50c34162b816f8be4c855b891g extends reactivity_eee533dd50c34162b816f8be4c855b890.ReactiveObject {
|
|
8
|
+
#copied = this[reactivity_eee533dd50c34162b816f8be4c855b890.SIGNAL](false);
|
|
9
9
|
constructor() {
|
|
10
10
|
super(null);
|
|
11
11
|
}
|
|
12
12
|
get copied() {
|
|
13
|
-
return
|
|
13
|
+
return reactivity_eee533dd50c34162b816f8be4c855b890.read(this.#copied);
|
|
14
14
|
}
|
|
15
15
|
set copied(_v0) {
|
|
16
|
-
|
|
16
|
+
reactivity_eee533dd50c34162b816f8be4c855b890.write(this.#copied, _v0);
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
const OMIT = ['timeout', 'value'];
|
|
20
20
|
export default template.factory(function (attributes, content) {
|
|
21
|
-
let state = new
|
|
21
|
+
let state = new ReactiveObject_eee533dd50c34162b816f8be4c855b891g(), timeout = attributes.timeout || 1000 * 2;
|
|
22
22
|
return (() => {
|
|
23
|
-
let
|
|
24
|
-
|
|
25
|
-
|
|
23
|
+
let root_eee533dd50c34162b816f8be4c855b891h = template_eee533dd50c34162b816f8be4c855b891i(), element_eee533dd50c34162b816f8be4c855b891j = root_eee533dd50c34162b816f8be4c855b891h.firstChild, element_eee533dd50c34162b816f8be4c855b891k = element_eee533dd50c34162b816f8be4c855b891j.firstChild, attributes_eee533dd50c34162b816f8be4c855b891l = {};
|
|
24
|
+
template_eee533dd50c34162b816f8be4c855b891.setProperties(element_eee533dd50c34162b816f8be4c855b891j, omit(attributes, OMIT), attributes_eee533dd50c34162b816f8be4c855b891l);
|
|
25
|
+
template_eee533dd50c34162b816f8be4c855b891.delegate(element_eee533dd50c34162b816f8be4c855b891j, 'click', (e) => {
|
|
26
26
|
e.preventDefault();
|
|
27
27
|
e.stopPropagation();
|
|
28
28
|
write(attributes.value).then(() => {
|
|
@@ -32,7 +32,7 @@ export default template.factory(function (attributes, content) {
|
|
|
32
32
|
}, timeout);
|
|
33
33
|
});
|
|
34
34
|
});
|
|
35
|
-
new
|
|
36
|
-
return
|
|
35
|
+
new template_eee533dd50c34162b816f8be4c855b891.EffectSlot(element_eee533dd50c34162b816f8be4c855b891k, () => content(state));
|
|
36
|
+
return root_eee533dd50c34162b816f8be4c855b891h;
|
|
37
37
|
})();
|
|
38
38
|
});
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer components {.container{--gap-horizontal:0px;--gap-vertical:0px;--margin-horizontal:var(--size-600);--margin-vertical:0px;--max-width:1400px;gap:var(--gap-vertical)var(--gap-horizontal);margin:var(--margin-vertical)auto;width:min(var(--max-width),100% - var(--margin-horizontal)*2);flex-wrap:wrap;justify-content:flex-start;display:flex;position:relative}}
|
|
1
|
+
@layer components {.container{--gap-horizontal:0px;--gap-vertical:0px;--margin-horizontal:var(--size-600);--margin-vertical:0px;--max-width:1400px;gap:var(--gap-vertical) var(--gap-horizontal);margin:var(--margin-vertical) auto;width:min(var(--max-width), 100% - var(--margin-horizontal) * 2);flex-wrap:wrap;justify-content:flex-start;display:flex;position:relative}}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,41 +1,41 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as
|
|
1
|
+
import * as template_eee533dd50c34162b816f8be4c855b891 from '@esportsplus/template';
|
|
2
|
+
import * as reactivity_eee533dd50c34162b816f8be4c855b890 from '@esportsplus/reactivity';
|
|
3
3
|
import { effect } from '@esportsplus/reactivity';
|
|
4
4
|
import { omit } from '@esportsplus/utilities';
|
|
5
5
|
import './scss/index.scss';
|
|
6
|
-
const
|
|
7
|
-
const
|
|
8
|
-
const
|
|
9
|
-
const
|
|
10
|
-
class
|
|
11
|
-
#value = this[
|
|
6
|
+
const template_eee533dd50c34162b816f8be4c855b891p = template_eee533dd50c34162b816f8be4c855b891.template(`<span class='counter-character counter-character--symbol'><!--$--></span>`);
|
|
7
|
+
const template_eee533dd50c34162b816f8be4c855b891s = template_eee533dd50c34162b816f8be4c855b891.template(`<span><!--$--></span>`);
|
|
8
|
+
const template_eee533dd50c34162b816f8be4c855b891v = template_eee533dd50c34162b816f8be4c855b891.template(`<div class=' counter-character'><div class='counter-character-track'><span>9</span><!--$--><span>0</span></div></div>`);
|
|
9
|
+
const template_eee533dd50c34162b816f8be4c855b8920 = template_eee533dd50c34162b816f8be4c855b891.template(`<div class='counter'><!--$--></div>`);
|
|
10
|
+
class ReactiveObject_eee533dd50c34162b816f8be4c855b891m extends reactivity_eee533dd50c34162b816f8be4c855b890.ReactiveObject {
|
|
11
|
+
#value = this[reactivity_eee533dd50c34162b816f8be4c855b890.SIGNAL](-1);
|
|
12
12
|
constructor() {
|
|
13
13
|
super(null);
|
|
14
14
|
}
|
|
15
15
|
get value() {
|
|
16
|
-
return
|
|
16
|
+
return reactivity_eee533dd50c34162b816f8be4c855b890.read(this.#value);
|
|
17
17
|
}
|
|
18
18
|
set value(_v0) {
|
|
19
|
-
|
|
19
|
+
reactivity_eee533dd50c34162b816f8be4c855b890.write(this.#value, _v0);
|
|
20
20
|
}
|
|
21
21
|
}
|
|
22
|
-
class
|
|
23
|
-
#length = this[
|
|
22
|
+
class ReactiveObject_eee533dd50c34162b816f8be4c855b891n extends reactivity_eee533dd50c34162b816f8be4c855b890.ReactiveObject {
|
|
23
|
+
#length = this[reactivity_eee533dd50c34162b816f8be4c855b890.SIGNAL](0);
|
|
24
24
|
#test;
|
|
25
25
|
#render;
|
|
26
26
|
constructor(_p0, _p1) {
|
|
27
27
|
super(null);
|
|
28
|
-
this.#test = this[
|
|
29
|
-
this.#render = this[
|
|
28
|
+
this.#test = this[reactivity_eee533dd50c34162b816f8be4c855b890.COMPUTED](_p0);
|
|
29
|
+
this.#render = this[reactivity_eee533dd50c34162b816f8be4c855b890.REACTIVE_ARRAY](_p1);
|
|
30
30
|
}
|
|
31
31
|
get length() {
|
|
32
|
-
return
|
|
32
|
+
return reactivity_eee533dd50c34162b816f8be4c855b890.read(this.#length);
|
|
33
33
|
}
|
|
34
34
|
set length(_v0) {
|
|
35
|
-
|
|
35
|
+
reactivity_eee533dd50c34162b816f8be4c855b890.write(this.#length, _v0);
|
|
36
36
|
}
|
|
37
37
|
get test() {
|
|
38
|
-
return
|
|
38
|
+
return reactivity_eee533dd50c34162b816f8be4c855b890.read(this.#test);
|
|
39
39
|
}
|
|
40
40
|
get render() {
|
|
41
41
|
return this.#render;
|
|
@@ -44,12 +44,12 @@ class ReactiveObject_18172a85379e40cd839ee4bba2ddfea81n extends reactivity_18172
|
|
|
44
44
|
const OMIT = ['currency', 'decimals', 'delay', 'max', 'state', 'suffix', 'value'];
|
|
45
45
|
let formatters = {};
|
|
46
46
|
export default (attributes) => {
|
|
47
|
-
let { currency, decimals, delay, max, suffix, value } = attributes, api = attributes.state || new
|
|
47
|
+
let { currency, decimals, delay, max, suffix, value } = attributes, api = attributes.state || new ReactiveObject_eee533dd50c34162b816f8be4c855b891m(), formatter = currency === 'IGNORE'
|
|
48
48
|
? undefined
|
|
49
49
|
: formatters[currency || 'USD'] ??= new Intl.NumberFormat('en-US', {
|
|
50
50
|
style: 'currency',
|
|
51
51
|
currency: currency || 'USD'
|
|
52
|
-
}), rendering = true, state = new
|
|
52
|
+
}), rendering = true, state = new ReactiveObject_eee533dd50c34162b816f8be4c855b891n(() => 'sds', []), render = new reactivity_eee533dd50c34162b816f8be4c855b890.ReactiveArray();
|
|
53
53
|
decimals ??= 2;
|
|
54
54
|
effect(() => {
|
|
55
55
|
if (api.value !== -1) {
|
|
@@ -84,33 +84,33 @@ export default (attributes) => {
|
|
|
84
84
|
}
|
|
85
85
|
});
|
|
86
86
|
return (() => {
|
|
87
|
-
let
|
|
88
|
-
|
|
89
|
-
new
|
|
87
|
+
let root_eee533dd50c34162b816f8be4c855b891z = template_eee533dd50c34162b816f8be4c855b8920(), element_eee533dd50c34162b816f8be4c855b8921 = root_eee533dd50c34162b816f8be4c855b891z.firstChild, element_eee533dd50c34162b816f8be4c855b8922 = element_eee533dd50c34162b816f8be4c855b8921.firstChild, attributes_eee533dd50c34162b816f8be4c855b8923 = { "class": " counter" };
|
|
88
|
+
template_eee533dd50c34162b816f8be4c855b891.setProperties(element_eee533dd50c34162b816f8be4c855b8921, omit(attributes, OMIT), attributes_eee533dd50c34162b816f8be4c855b8923);
|
|
89
|
+
new template_eee533dd50c34162b816f8be4c855b891.EffectSlot(element_eee533dd50c34162b816f8be4c855b8922, () => {
|
|
90
90
|
let n = state.length;
|
|
91
91
|
if (n === 0) {
|
|
92
92
|
return '';
|
|
93
93
|
}
|
|
94
|
-
return new
|
|
94
|
+
return new template_eee533dd50c34162b816f8be4c855b891.ArraySlot(render, function (value) {
|
|
95
95
|
if (isNaN(parseInt(value, 10))) {
|
|
96
96
|
return (() => {
|
|
97
|
-
let
|
|
98
|
-
|
|
99
|
-
return
|
|
97
|
+
let root_eee533dd50c34162b816f8be4c855b891o = template_eee533dd50c34162b816f8be4c855b891p(), element_eee533dd50c34162b816f8be4c855b891q = root_eee533dd50c34162b816f8be4c855b891o.firstChild.firstChild;
|
|
98
|
+
template_eee533dd50c34162b816f8be4c855b891.slot(element_eee533dd50c34162b816f8be4c855b891q, value);
|
|
99
|
+
return root_eee533dd50c34162b816f8be4c855b891o;
|
|
100
100
|
})();
|
|
101
101
|
}
|
|
102
102
|
return (() => {
|
|
103
|
-
let
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
let
|
|
107
|
-
|
|
108
|
-
return
|
|
103
|
+
let root_eee533dd50c34162b816f8be4c855b891u = template_eee533dd50c34162b816f8be4c855b891v(), element_eee533dd50c34162b816f8be4c855b891w = root_eee533dd50c34162b816f8be4c855b891u.firstChild.firstElementChild, element_eee533dd50c34162b816f8be4c855b891x = element_eee533dd50c34162b816f8be4c855b891w.firstChild.nextSibling, attributes_eee533dd50c34162b816f8be4c855b891y = { "class": " counter-character-track", "style": " " };
|
|
104
|
+
template_eee533dd50c34162b816f8be4c855b891.setList(element_eee533dd50c34162b816f8be4c855b891w, 'style', `--value: ${value}`, attributes_eee533dd50c34162b816f8be4c855b891y);
|
|
105
|
+
template_eee533dd50c34162b816f8be4c855b891.slot(element_eee533dd50c34162b816f8be4c855b891x, [0, 1, 2, 3, 4, 5, 6, 7, 8, 9].map((value) => {
|
|
106
|
+
let root_eee533dd50c34162b816f8be4c855b891r = template_eee533dd50c34162b816f8be4c855b891s(), element_eee533dd50c34162b816f8be4c855b891t = root_eee533dd50c34162b816f8be4c855b891r.firstChild.firstChild;
|
|
107
|
+
template_eee533dd50c34162b816f8be4c855b891.slot(element_eee533dd50c34162b816f8be4c855b891t, value);
|
|
108
|
+
return root_eee533dd50c34162b816f8be4c855b891r;
|
|
109
109
|
}));
|
|
110
|
-
return
|
|
110
|
+
return root_eee533dd50c34162b816f8be4c855b891u;
|
|
111
111
|
})();
|
|
112
112
|
});
|
|
113
113
|
});
|
|
114
|
-
return
|
|
114
|
+
return root_eee533dd50c34162b816f8be4c855b891z;
|
|
115
115
|
})();
|
|
116
116
|
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer components {.counter{--font-size:clamp(2rem,4vw + 1rem,8rem);--font-weight:var(--font-weight-400);--line-height:calc(var(--font-size)*1.5);--mask-size:.24;--timing-function:var(--timing-bounce-out);--transition-duration:2s}.counter-character{--scale:1}.counter-character--fraction,.counter-character--symbol{--opacity:.8}.counter-character--fraction{--font-weight:var(--font-weight-300);--scale:.75}.counter-character--symbol:first-child{--scale:.8}.counter{transition:transform calc(var(--transition-duration)/4)var(--transition-duration);transform-style:flat;place-items:center;gap:2px;display:flex}.counter-character,.counter-character-track span{color:#0000;transform-style:flat;background:linear-gradient(#fafafa 50%,#737373) fixed;-webkit-background-clip:text;background-clip:text}.counter-character{font-size:var(--font-size);font-variant:tabular-nums;font-weight:var(--font-weight);height:1lh;line-height:var(--line-height);-webkit-mask:linear-gradient(transparent,white calc(1lh*var(--mask-size))calc(100% - 1lh*var(--mask-size)),transparent);-webkit-mask:linear-gradient(transparent,white calc(1lh*var(--mask-size))calc(100% - 1lh*var(--mask-size)),transparent);mask:linear-gradient(transparent,white calc(1lh*var(--mask-size))calc(100% - 1lh*var(--mask-size)),transparent);transform-style:flat;display:grid;overflow:hidden}.counter-character--fraction{font-size:calc(var(--font-size)*var(--scale));font-weight:var(--font-weight-300);opacity:var(--opacity);height:var(--line-height);overflow:visible}.counter-character--fraction .counter-character-track span{padding:calc((var(--line-height) - var(--font-size))
|
|
1
|
+
@layer components {.counter{--font-size:clamp(2rem, 4vw + 1rem, 8rem);--font-weight:var(--font-weight-400);--line-height:calc(var(--font-size) * 1.5);--mask-size:.24;--timing-function:var(--timing-bounce-out);--transition-duration:2s}.counter-character{--scale:1}.counter-character--fraction,.counter-character--symbol{--opacity:.8}.counter-character--fraction{--font-weight:var(--font-weight-300);--scale:.75}.counter-character--symbol:first-child{--scale:.8}.counter{transition:transform calc(var(--transition-duration) / 4) var(--transition-duration);transform-style:flat;place-items:center;gap:2px;display:flex}.counter-character,.counter-character-track span{color:#0000;transform-style:flat;background:linear-gradient(#fafafa 50%,#737373) fixed;-webkit-background-clip:text;background-clip:text}.counter-character{font-size:var(--font-size);font-variant:tabular-nums;font-weight:var(--font-weight);height:1lh;line-height:var(--line-height);-webkit-mask:linear-gradient(transparent, white calc(1lh * var(--mask-size)) calc(100% - 1lh * var(--mask-size)), transparent);-webkit-mask:linear-gradient(transparent, white calc(1lh * var(--mask-size)) calc(100% - 1lh * var(--mask-size)), transparent);mask:linear-gradient(transparent, white calc(1lh * var(--mask-size)) calc(100% - 1lh * var(--mask-size)), transparent);transform-style:flat;display:grid;overflow:hidden}.counter-character--fraction{font-size:calc(var(--font-size) * var(--scale));font-weight:var(--font-weight-300);opacity:var(--opacity);height:var(--line-height);overflow:visible}.counter-character--fraction .counter-character-track span{padding:calc((var(--line-height) - var(--font-size)) * .2) 0;flex-direction:column;align-items:end;display:flex}.counter-character--symbol{font-size:calc(var(--font-size) * var(--scale));opacity:var(--opacity);margin-right:.1ch}.counter-character-track{translate:0 calc((var(--value) + 1) * var(--line-height) * -1);transition:translate var(--transition-duration) var(--timing-function);display:grid}.counter-character-track span{transform-style:flat;height:1lh}}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as template_eee533dd50c34162b816f8be4c855b891 from '@esportsplus/template';
|
|
2
2
|
import './scss/index.scss';
|
|
3
|
-
const
|
|
3
|
+
const template_eee533dd50c34162b816f8be4c855b8925 = template_eee533dd50c34162b816f8be4c855b891.template(`<div class='ellipsis'><span></span><span></span><span></span></div>`);
|
|
4
4
|
export default (attributes) => {
|
|
5
|
-
let
|
|
6
|
-
|
|
7
|
-
return
|
|
5
|
+
let root_eee533dd50c34162b816f8be4c855b8924 = template_eee533dd50c34162b816f8be4c855b8925(), element_eee533dd50c34162b816f8be4c855b8926 = root_eee533dd50c34162b816f8be4c855b8924.firstChild, attributes_eee533dd50c34162b816f8be4c855b8927 = { "class": " ellipsis" };
|
|
6
|
+
template_eee533dd50c34162b816f8be4c855b891.setProperties(element_eee533dd50c34162b816f8be4c855b8926, attributes, attributes_eee533dd50c34162b816f8be4c855b8927);
|
|
7
|
+
return root_eee533dd50c34162b816f8be4c855b8924;
|
|
8
8
|
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer components {.ellipsis{--animation-duration:1.24s;--margin-horizontal:var(--size-100);--size:var(--size-200)}.ellipsis span{animation:ellipsis var(--animation-duration)infinite linear;background-color:var(--color);height:var(--size);margin:0 var(--margin-horizontal);width:var(--size);border-radius:100%;display:inline-block}.ellipsis span :nth-child(2){animation-delay:.24s}.ellipsis span :nth-child(3){animation-delay:.48s}@keyframes ellipsis{0%,to{opacity:.16}20%{opacity:1}}}
|
|
1
|
+
@layer components {.ellipsis{--animation-duration:1.24s;--margin-horizontal:var(--size-100);--size:var(--size-200)}.ellipsis span{animation:ellipsis var(--animation-duration) infinite linear;background-color:var(--color);height:var(--size);margin:0 var(--margin-horizontal);width:var(--size);border-radius:100%;display:inline-block}.ellipsis span :nth-child(2){animation-delay:.24s}.ellipsis span :nth-child(3){animation-delay:.48s}@keyframes ellipsis{0%,to{opacity:.16}20%{opacity:1}}}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import response from '@esportsplus/action';
|
|
2
|
-
import * as
|
|
2
|
+
import * as template_eee533dd50c34162b816f8be4c855b891 from '@esportsplus/template';
|
|
3
3
|
import { omit } from '@esportsplus/utilities';
|
|
4
4
|
import input from './input.js';
|
|
5
|
-
const
|
|
5
|
+
const template_eee533dd50c34162b816f8be4c855b8929 = template_eee533dd50c34162b816f8be4c855b891.template(`<form class='form'><!--$--></form>`);
|
|
6
6
|
const OMIT = ['action', 'state'];
|
|
7
7
|
function parse(input) {
|
|
8
8
|
let data = {};
|
|
@@ -29,9 +29,9 @@ function parse(input) {
|
|
|
29
29
|
export default (attributes, content) => {
|
|
30
30
|
let { action, state } = attributes;
|
|
31
31
|
return (() => {
|
|
32
|
-
let
|
|
33
|
-
|
|
34
|
-
|
|
32
|
+
let root_eee533dd50c34162b816f8be4c855b8928 = template_eee533dd50c34162b816f8be4c855b8929(), element_eee533dd50c34162b816f8be4c855b892a = root_eee533dd50c34162b816f8be4c855b8928.firstChild, element_eee533dd50c34162b816f8be4c855b892b = element_eee533dd50c34162b816f8be4c855b892a.firstChild, attributes_eee533dd50c34162b816f8be4c855b892c = { "class": " form" };
|
|
33
|
+
template_eee533dd50c34162b816f8be4c855b891.setProperties(element_eee533dd50c34162b816f8be4c855b892a, omit(attributes, OMIT), attributes_eee533dd50c34162b816f8be4c855b892c);
|
|
34
|
+
template_eee533dd50c34162b816f8be4c855b891.delegate(element_eee533dd50c34162b816f8be4c855b892a, 'click', function (event) {
|
|
35
35
|
let trigger = event.target;
|
|
36
36
|
if (trigger?.type !== 'submit') {
|
|
37
37
|
return;
|
|
@@ -39,7 +39,7 @@ export default (attributes, content) => {
|
|
|
39
39
|
event.preventDefault();
|
|
40
40
|
this.dispatchEvent(new SubmitEvent('submit', { cancelable: true, bubbles: true, submitter: trigger }));
|
|
41
41
|
});
|
|
42
|
-
|
|
42
|
+
template_eee533dd50c34162b816f8be4c855b891.on(element_eee533dd50c34162b816f8be4c855b892a, 'submit', async function (event) {
|
|
43
43
|
event.preventDefault();
|
|
44
44
|
if (state) {
|
|
45
45
|
state.processing = true;
|
|
@@ -59,7 +59,7 @@ export default (attributes, content) => {
|
|
|
59
59
|
state.processing = false;
|
|
60
60
|
}
|
|
61
61
|
});
|
|
62
|
-
|
|
63
|
-
return
|
|
62
|
+
template_eee533dd50c34162b816f8be4c855b891.slot(element_eee533dd50c34162b816f8be4c855b892b, content);
|
|
63
|
+
return root_eee533dd50c34162b816f8be4c855b8928;
|
|
64
64
|
})();
|
|
65
65
|
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer components {.form{--gap-horizontal:0px;--gap-vertical:0px;--margin-horizontal:0px;--margin-vertical:0px;gap:var(--gap-vertical)var(--gap-horizontal);margin:var(--margin-vertical)var(--margin-horizontal);flex-wrap:wrap;justify-content:flex-start;display:flex;position:relative}}
|
|
1
|
+
@layer components {.form{--gap-horizontal:0px;--gap-vertical:0px;--margin-horizontal:0px;--margin-vertical:0px;gap:var(--gap-vertical) var(--gap-horizontal);margin:var(--margin-vertical) var(--margin-horizontal);flex-wrap:wrap;justify-content:flex-start;display:flex;position:relative}}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer components {.frames{--gap:var(--size-400);--opacity:.4;gap:var(--gap);transform:translateX(calc(var(--i)*(100% + var(--gap))));transition:transform .3s;display:flex}.frames .frame{flex-shrink:0;width:100%;min-width:100
|
|
1
|
+
@layer components {.frames{--gap:var(--size-400);--opacity:.4;gap:var(--gap);transform:translateX(calc(var(--i) * (100% + var(--gap))));transition:transform .3s;display:flex}.frames .frame{flex-shrink:0;width:100%;min-width:100%}.frames .frame:not(.--active){opacity:var(--opacity);display:flex}.frames .frame:not(.--active)>*{pointer-events:none}.frame{cursor:default;flex-wrap:wrap;justify-content:flex-start;width:100%;max-width:100%;display:none;position:relative}.frame.--active{display:flex}}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer components {.grid{--gap-horizontal:var(--size-400);--gap-vertical:var(--size-400);--max-width:1fr;--min-width:200px;grid-gap:var(--gap-horizontal)var(--gap-vertical);grid-template-columns:repeat(auto-fit,minmax(var(--min-width),var(--max-width)));display:grid;position:relative}.grid .grid-item{width:100%}}
|
|
1
|
+
@layer components {.grid{--gap-horizontal:var(--size-400);--gap-vertical:var(--size-400);--max-width:1fr;--min-width:200px;grid-gap:var(--gap-horizontal) var(--gap-vertical);grid-template-columns:repeat(auto-fit, minmax(var(--min-width), var(--max-width)));display:grid;position:relative}.grid .grid-item{width:100%}}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as template_eee533dd50c34162b816f8be4c855b891 from '@esportsplus/template';
|
|
2
2
|
import './scss/index.scss';
|
|
3
3
|
declare const _default: {
|
|
4
4
|
(): ReturnType<(this: {
|
|
5
|
-
attributes?:
|
|
6
|
-
content?:
|
|
7
|
-
}, attributes: Readonly<
|
|
8
|
-
<T extends
|
|
9
|
-
attributes?:
|
|
10
|
-
content?:
|
|
11
|
-
}, attributes: Readonly<
|
|
12
|
-
<T extends
|
|
13
|
-
attributes?:
|
|
14
|
-
content?:
|
|
15
|
-
}, attributes: Readonly<
|
|
16
|
-
(attributes:
|
|
17
|
-
attributes?:
|
|
18
|
-
content?:
|
|
19
|
-
}, attributes: Readonly<
|
|
5
|
+
attributes?: template_eee533dd50c34162b816f8be4c855b891.Attributes | undefined;
|
|
6
|
+
content?: template_eee533dd50c34162b816f8be4c855b891.Renderable<any>;
|
|
7
|
+
}, attributes: Readonly<template_eee533dd50c34162b816f8be4c855b891.Attributes>, content: template_eee533dd50c34162b816f8be4c855b891.Renderable<any>) => template_eee533dd50c34162b816f8be4c855b891.Renderable<any>>;
|
|
8
|
+
<T extends template_eee533dd50c34162b816f8be4c855b891.Attributes>(attributes: T): ReturnType<(this: {
|
|
9
|
+
attributes?: template_eee533dd50c34162b816f8be4c855b891.Attributes | undefined;
|
|
10
|
+
content?: template_eee533dd50c34162b816f8be4c855b891.Renderable<any>;
|
|
11
|
+
}, attributes: Readonly<template_eee533dd50c34162b816f8be4c855b891.Attributes>, content: template_eee533dd50c34162b816f8be4c855b891.Renderable<any>) => template_eee533dd50c34162b816f8be4c855b891.Renderable<any>>;
|
|
12
|
+
<T extends template_eee533dd50c34162b816f8be4c855b891.Renderable<any>>(content: T): ReturnType<(this: {
|
|
13
|
+
attributes?: template_eee533dd50c34162b816f8be4c855b891.Attributes | undefined;
|
|
14
|
+
content?: template_eee533dd50c34162b816f8be4c855b891.Renderable<any>;
|
|
15
|
+
}, attributes: Readonly<template_eee533dd50c34162b816f8be4c855b891.Attributes>, content: template_eee533dd50c34162b816f8be4c855b891.Renderable<any>) => template_eee533dd50c34162b816f8be4c855b891.Renderable<any>>;
|
|
16
|
+
(attributes: template_eee533dd50c34162b816f8be4c855b891.Attributes, content: template_eee533dd50c34162b816f8be4c855b891.Renderable<any>): ReturnType<(this: {
|
|
17
|
+
attributes?: template_eee533dd50c34162b816f8be4c855b891.Attributes | undefined;
|
|
18
|
+
content?: template_eee533dd50c34162b816f8be4c855b891.Renderable<any>;
|
|
19
|
+
}, attributes: Readonly<template_eee533dd50c34162b816f8be4c855b891.Attributes>, content: template_eee533dd50c34162b816f8be4c855b891.Renderable<any>) => template_eee533dd50c34162b816f8be4c855b891.Renderable<any>>;
|
|
20
20
|
};
|
|
21
21
|
export default _default;
|
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as
|
|
1
|
+
import * as template_eee533dd50c34162b816f8be4c855b891 from '@esportsplus/template';
|
|
2
|
+
import * as reactivity_eee533dd50c34162b816f8be4c855b890 from '@esportsplus/reactivity';
|
|
3
3
|
import { omit } from '@esportsplus/utilities';
|
|
4
4
|
import template from '../../components/template/index.js';
|
|
5
5
|
import './scss/index.scss';
|
|
6
|
-
const
|
|
7
|
-
class
|
|
8
|
-
#highlight = this[
|
|
6
|
+
const template_eee533dd50c34162b816f8be4c855b892f = template_eee533dd50c34162b816f8be4c855b891.template(`<div class='highlight'><!--$--></div>`);
|
|
7
|
+
class ReactiveObject_eee533dd50c34162b816f8be4c855b892d extends reactivity_eee533dd50c34162b816f8be4c855b890.ReactiveObject {
|
|
8
|
+
#highlight = this[reactivity_eee533dd50c34162b816f8be4c855b890.SIGNAL](0);
|
|
9
9
|
constructor() {
|
|
10
10
|
super(null);
|
|
11
11
|
}
|
|
12
12
|
get highlight() {
|
|
13
|
-
return
|
|
13
|
+
return reactivity_eee533dd50c34162b816f8be4c855b890.read(this.#highlight);
|
|
14
14
|
}
|
|
15
15
|
set highlight(_v0) {
|
|
16
|
-
|
|
16
|
+
reactivity_eee533dd50c34162b816f8be4c855b890.write(this.#highlight, _v0);
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
const OMIT = ['background'];
|
|
@@ -38,19 +38,19 @@ export default template.factory((attributes, content) => {
|
|
|
38
38
|
}
|
|
39
39
|
}, { threshold: 1 });
|
|
40
40
|
}
|
|
41
|
-
let state = new
|
|
41
|
+
let state = new ReactiveObject_eee533dd50c34162b816f8be4c855b892d();
|
|
42
42
|
return (() => {
|
|
43
|
-
let
|
|
44
|
-
|
|
45
|
-
|
|
43
|
+
let root_eee533dd50c34162b816f8be4c855b892e = template_eee533dd50c34162b816f8be4c855b892f(), element_eee533dd50c34162b816f8be4c855b892g = root_eee533dd50c34162b816f8be4c855b892e.firstChild, element_eee533dd50c34162b816f8be4c855b892h = element_eee533dd50c34162b816f8be4c855b892g.firstChild, attributes_eee533dd50c34162b816f8be4c855b892i = { "class": " highlight" };
|
|
44
|
+
template_eee533dd50c34162b816f8be4c855b891.setProperties(element_eee533dd50c34162b816f8be4c855b892g, omit(attributes, OMIT), attributes_eee533dd50c34162b816f8be4c855b892i);
|
|
45
|
+
template_eee533dd50c34162b816f8be4c855b891.onrender(element_eee533dd50c34162b816f8be4c855b892g, (element) => {
|
|
46
46
|
element[key] = state;
|
|
47
47
|
observer.observe(element);
|
|
48
48
|
});
|
|
49
|
-
|
|
49
|
+
template_eee533dd50c34162b816f8be4c855b891.setList(element_eee533dd50c34162b816f8be4c855b892g, 'style', [
|
|
50
50
|
() => `--highlight: ${state.highlight}`,
|
|
51
51
|
`--background: ${attributes.background}`,
|
|
52
|
-
],
|
|
53
|
-
|
|
54
|
-
return
|
|
52
|
+
], attributes_eee533dd50c34162b816f8be4c855b892i);
|
|
53
|
+
template_eee533dd50c34162b816f8be4c855b891.slot(element_eee533dd50c34162b816f8be4c855b892h, content);
|
|
54
|
+
return root_eee533dd50c34162b816f8be4c855b892e;
|
|
55
55
|
})();
|
|
56
56
|
});
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer components {.highlight{--background:transparent;--highlight:1;background:linear-gradient(90deg,var(--background)50%,transparent 50%)110% 0/200% 100% no-repeat;background-position:calc((1 - var(--highlight))*110%)0;transition:background-position .32s}}
|
|
1
|
+
@layer components {.highlight{--background:transparent;--highlight:1;background:linear-gradient(90deg, var(--background) 50%, transparent 50%) 110% 0/200% 100% no-repeat;background-position:calc((1 - var(--highlight)) * 110%) 0;transition:background-position .32s}}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as template_eee533dd50c34162b816f8be4c855b891 from '@esportsplus/template';
|
|
2
2
|
import './scss/index.scss';
|
|
3
3
|
declare const _default: {
|
|
4
4
|
(): ReturnType<(this: {
|
|
5
|
-
attributes?:
|
|
5
|
+
attributes?: template_eee533dd50c34162b816f8be4c855b891.Attributes | undefined;
|
|
6
6
|
content?: string | undefined;
|
|
7
|
-
}, attributes: Readonly<
|
|
8
|
-
<T extends
|
|
9
|
-
attributes?:
|
|
7
|
+
}, attributes: Readonly<template_eee533dd50c34162b816f8be4c855b891.Attributes>, content: string) => template_eee533dd50c34162b816f8be4c855b891.Renderable<any>>;
|
|
8
|
+
<T extends template_eee533dd50c34162b816f8be4c855b891.Attributes>(attributes: T): ReturnType<(this: {
|
|
9
|
+
attributes?: template_eee533dd50c34162b816f8be4c855b891.Attributes | undefined;
|
|
10
10
|
content?: string | undefined;
|
|
11
|
-
}, attributes: Readonly<
|
|
11
|
+
}, attributes: Readonly<template_eee533dd50c34162b816f8be4c855b891.Attributes>, content: string) => template_eee533dd50c34162b816f8be4c855b891.Renderable<any>>;
|
|
12
12
|
<T extends string>(content: T): ReturnType<(this: {
|
|
13
|
-
attributes?:
|
|
13
|
+
attributes?: template_eee533dd50c34162b816f8be4c855b891.Attributes | undefined;
|
|
14
14
|
content?: string | undefined;
|
|
15
|
-
}, attributes: Readonly<
|
|
16
|
-
(attributes:
|
|
17
|
-
attributes?:
|
|
15
|
+
}, attributes: Readonly<template_eee533dd50c34162b816f8be4c855b891.Attributes>, content: string) => template_eee533dd50c34162b816f8be4c855b891.Renderable<any>>;
|
|
16
|
+
(attributes: template_eee533dd50c34162b816f8be4c855b891.Attributes, content: string): ReturnType<(this: {
|
|
17
|
+
attributes?: template_eee533dd50c34162b816f8be4c855b891.Attributes | undefined;
|
|
18
18
|
content?: string | undefined;
|
|
19
|
-
}, attributes: Readonly<
|
|
19
|
+
}, attributes: Readonly<template_eee533dd50c34162b816f8be4c855b891.Attributes>, content: string) => template_eee533dd50c34162b816f8be4c855b891.Renderable<any>>;
|
|
20
20
|
};
|
|
21
21
|
export default _default;
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as template_eee533dd50c34162b816f8be4c855b891 from '@esportsplus/template';
|
|
2
2
|
import { svg } from '@esportsplus/template';
|
|
3
3
|
import template from '../../components/template/index.js';
|
|
4
4
|
import './scss/index.scss';
|
|
5
|
-
const
|
|
5
|
+
const template_eee533dd50c34162b816f8be4c855b892k = template_eee533dd50c34162b816f8be4c855b891.template(`<div class='icon'><!--$--></div>`);
|
|
6
6
|
export default template.factory((attributes, icon) => {
|
|
7
7
|
return (() => {
|
|
8
|
-
let
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
return
|
|
8
|
+
let root_eee533dd50c34162b816f8be4c855b892j = template_eee533dd50c34162b816f8be4c855b892k(), element_eee533dd50c34162b816f8be4c855b892l = root_eee533dd50c34162b816f8be4c855b892j.firstChild, element_eee533dd50c34162b816f8be4c855b892m = element_eee533dd50c34162b816f8be4c855b892l.firstChild, attributes_eee533dd50c34162b816f8be4c855b892n = { "class": " icon" };
|
|
9
|
+
template_eee533dd50c34162b816f8be4c855b891.setProperties(element_eee533dd50c34162b816f8be4c855b892l, attributes, attributes_eee533dd50c34162b816f8be4c855b892n);
|
|
10
|
+
template_eee533dd50c34162b816f8be4c855b891.slot(element_eee533dd50c34162b816f8be4c855b892m, svg.sprite(icon));
|
|
11
|
+
return root_eee533dd50c34162b816f8be4c855b892j;
|
|
12
12
|
})();
|
|
13
13
|
});
|