@esportsplus/ui 0.48.7 → 0.49.1
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/README.md +4 -4
- package/build/components/accordion/index.d.ts +16 -16
- package/build/components/accordion/index.js +12 -12
- package/build/components/alert/index.d.ts +1 -1
- package/build/components/alert/index.js +27 -27
- package/build/components/back/index.d.ts +9 -9
- package/build/components/back/index.js +8 -8
- package/build/components/button/index.d.ts +22 -22
- package/build/components/button/index.js +16 -16
- package/build/components/checkbox/index.d.ts +1 -1
- package/build/components/checkbox/index.js +15 -15
- package/build/components/clipboard/index.d.ts +1120 -1120
- package/build/components/clipboard/onclick.d.ts +1 -1
- package/build/components/clipboard/onclick.js +8 -8
- package/build/components/counter/index.d.ts +1 -1
- package/build/components/counter/index.js +21 -21
- package/build/components/ellipsis/index.d.ts +1 -1
- package/build/components/ellipsis/index.js +5 -5
- package/build/components/form/action.d.ts +1 -1
- package/build/components/form/action.js +8 -8
- package/build/components/form/index.d.ts +3 -3
- package/build/components/form/input.d.ts +1 -1
- package/build/components/frame/index.d.ts +10 -10
- package/build/components/highlight/index.d.ts +16 -16
- package/build/components/highlight/index.js +10 -10
- package/build/components/icon/index.d.ts +11 -11
- package/build/components/icon/index.js +7 -7
- package/build/components/input/index.d.ts +1 -1
- package/build/components/input/index.js +12 -12
- package/build/components/loader/index.d.ts +16 -16
- package/build/components/loader/index.js +22 -22
- package/build/components/loading/index.d.ts +1 -1
- package/build/components/loading/index.js +5 -5
- package/build/components/overlay/index.d.ts +10 -10
- package/build/components/radio/index.d.ts +2 -2
- package/build/components/range/index.d.ts +1 -1
- package/build/components/range/index.js +14 -14
- package/build/components/scrollbar/index.d.ts +12 -12
- package/build/components/scrollbar/index.js +16 -16
- package/build/components/select/index.d.ts +1 -1
- package/build/components/select/index.js +25 -25
- package/build/components/sidebar/index.d.ts +10 -10
- package/build/components/site/index.d.ts +10 -10
- package/build/components/switch/index.d.ts +2 -2
- package/build/components/template/index.d.ts +1 -1
- package/build/components/textarea/index.d.ts +1 -1
- package/build/components/textarea/index.js +12 -12
- package/build/components/tooltip/index.d.ts +2295 -2295
- package/build/components/tooltip/menu.d.ts +12 -12
- package/build/components/tooltip/menu.js +20 -20
- package/build/components/tooltip/onclick.d.ts +1121 -1121
- package/build/components/tooltip/onclick.js +9 -9
- package/build/components/tooltip/onhover.d.ts +16 -16
- package/build/components/tooltip/onhover.js +10 -10
- package/build/components/typewriter/index.d.ts +11 -11
- package/build/components/typewriter/index.js +9 -9
- package/build/themes/dark/alert.d.ts +3 -3
- package/build/themes/dark/back.d.ts +11 -11
- package/build/themes/dark/input.d.ts +111 -111
- package/build/themes/dark/select.d.ts +1220 -1220
- package/build/themes/dark/textarea.d.ts +111 -111
- package/package.json +3 -3
- package/src/components/accordion/index.ts +1 -1
- package/src/components/alert/index.ts +1 -1
- package/src/components/back/index.ts +1 -1
- package/src/components/button/index.ts +1 -1
- package/src/components/checkbox/index.ts +1 -1
- package/src/components/clipboard/onclick.ts +1 -1
- package/src/components/counter/index.ts +1 -1
- package/src/components/ellipsis/index.ts +1 -1
- package/src/components/form/action.ts +1 -1
- package/src/components/form/input.ts +1 -1
- package/src/components/highlight/index.ts +1 -1
- package/src/components/icon/index.ts +1 -1
- package/src/components/input/index.ts +1 -1
- package/src/components/loader/index.ts +1 -1
- package/src/components/loading/index.ts +1 -1
- package/src/components/range/index.ts +1 -1
- package/src/components/scrollbar/index.ts +1 -1
- package/src/components/select/index.ts +1 -1
- package/src/components/template/index.ts +1 -1
- package/src/components/textarea/index.ts +1 -1
- package/src/components/tooltip/menu.ts +1 -1
- package/src/components/tooltip/onclick.ts +1 -1
- package/src/components/tooltip/onhover.ts +1 -1
- package/src/components/typewriter/index.ts +1 -1
- package/tsconfig.json +1 -1
package/README.md
CHANGED
|
@@ -10,7 +10,7 @@ pnpm add @esportsplus/ui
|
|
|
10
10
|
|
|
11
11
|
## Dependencies
|
|
12
12
|
|
|
13
|
-
- `@esportsplus/
|
|
13
|
+
- `@esportsplus/frontend` - Tagged template literals with compile-time transforms and reactive state management
|
|
14
14
|
- `@esportsplus/action` - Response/error handling
|
|
15
15
|
- `@esportsplus/utilities` - Core utilities
|
|
16
16
|
|
|
@@ -18,7 +18,7 @@ pnpm add @esportsplus/ui
|
|
|
18
18
|
|
|
19
19
|
```typescript
|
|
20
20
|
import { button, form, input, select } from '@esportsplus/ui';
|
|
21
|
-
import { html } from '@esportsplus/
|
|
21
|
+
import { html } from '@esportsplus/frontend';
|
|
22
22
|
|
|
23
23
|
// Simple component
|
|
24
24
|
html`${button({}, 'Click Me')}`;
|
|
@@ -123,7 +123,7 @@ component({ class: 'custom' }, html`<span>Content</span>`)
|
|
|
123
123
|
Components can accept and return reactive state:
|
|
124
124
|
|
|
125
125
|
```typescript
|
|
126
|
-
import { reactive } from '@esportsplus/
|
|
126
|
+
import { reactive } from '@esportsplus/frontend';
|
|
127
127
|
|
|
128
128
|
let state = reactive({ active: false });
|
|
129
129
|
|
|
@@ -261,7 +261,7 @@ build/
|
|
|
261
261
|
Full type safety with zero `any` types:
|
|
262
262
|
|
|
263
263
|
```typescript
|
|
264
|
-
import type { Attributes } from '@esportsplus/
|
|
264
|
+
import type { Attributes } from '@esportsplus/frontend';
|
|
265
265
|
|
|
266
266
|
// Components are generic
|
|
267
267
|
template.factory<A extends Attributes, C>(fn);
|
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as template_88a2fd04bc87484a954d07fc771290fa0 from '@esportsplus/frontend';
|
|
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_88a2fd04bc87484a954d07fc771290fa0.Attributes | undefined;
|
|
6
|
+
content?: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>;
|
|
7
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>) => template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>>;
|
|
8
|
+
<T extends template_88a2fd04bc87484a954d07fc771290fa0.Attributes>(attributes: T): ReturnType<(this: {
|
|
9
|
+
attributes?: template_88a2fd04bc87484a954d07fc771290fa0.Attributes | undefined;
|
|
10
|
+
content?: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>;
|
|
11
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>) => template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>>;
|
|
12
|
+
<T extends template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>>(content: T): ReturnType<(this: {
|
|
13
|
+
attributes?: template_88a2fd04bc87484a954d07fc771290fa0.Attributes | undefined;
|
|
14
|
+
content?: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>;
|
|
15
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>) => template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>>;
|
|
16
|
+
(attributes: template_88a2fd04bc87484a954d07fc771290fa0.Attributes, content: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>): ReturnType<(this: {
|
|
17
|
+
attributes?: template_88a2fd04bc87484a954d07fc771290fa0.Attributes | undefined;
|
|
18
|
+
content?: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>;
|
|
19
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>) => template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>>;
|
|
20
20
|
};
|
|
21
21
|
export default _default;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import { reactive } from '@esportsplus/
|
|
1
|
+
import * as template_88a2fd04bc87484a954d07fc771290fa0 from '@esportsplus/frontend';
|
|
2
|
+
import { reactive } from '@esportsplus/frontend';
|
|
3
3
|
import { omit } from '@esportsplus/utilities';
|
|
4
4
|
import template from '../../components/template/index.js';
|
|
5
5
|
import './scss/index.scss';
|
|
6
|
-
const
|
|
6
|
+
const template_88a2fd04bc87484a954d07fc771290fa2 = template_88a2fd04bc87484a954d07fc771290fa0.template(`<div><!--$--></div>`);
|
|
7
7
|
const OMIT = ['state'];
|
|
8
8
|
let key = Symbol();
|
|
9
9
|
export default template.factory(function (attributes, content) {
|
|
@@ -11,22 +11,22 @@ export default template.factory(function (attributes, content) {
|
|
|
11
11
|
active: 0
|
|
12
12
|
});
|
|
13
13
|
return (() => {
|
|
14
|
-
let
|
|
15
|
-
|
|
16
|
-
|
|
14
|
+
let root_88a2fd04bc87484a954d07fc771290fa1 = template_88a2fd04bc87484a954d07fc771290fa2(), element_88a2fd04bc87484a954d07fc771290fa3 = root_88a2fd04bc87484a954d07fc771290fa1.firstChild, element_88a2fd04bc87484a954d07fc771290fa4 = element_88a2fd04bc87484a954d07fc771290fa3.firstChild, attributes_88a2fd04bc87484a954d07fc771290fa5 = {};
|
|
15
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperties(element_88a2fd04bc87484a954d07fc771290fa3, omit(attributes, OMIT), attributes_88a2fd04bc87484a954d07fc771290fa5);
|
|
16
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setList(element_88a2fd04bc87484a954d07fc771290fa3, 'class', () => {
|
|
17
17
|
return state.active && '--active';
|
|
18
|
-
},
|
|
19
|
-
|
|
18
|
+
}, attributes_88a2fd04bc87484a954d07fc771290fa5);
|
|
19
|
+
template_88a2fd04bc87484a954d07fc771290fa0.onrender(element_88a2fd04bc87484a954d07fc771290fa3, (element) => {
|
|
20
20
|
(ref = element)[key] = state;
|
|
21
21
|
});
|
|
22
|
-
|
|
22
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setList(element_88a2fd04bc87484a954d07fc771290fa3, 'style', () => {
|
|
23
23
|
let parent = ref.closest('accordion');
|
|
24
24
|
if (parent && key in parent) {
|
|
25
25
|
parent[key].active = (+parent[key].active) + 1;
|
|
26
26
|
}
|
|
27
27
|
return state.active && `--max-height: ${ref.scrollHeight}`;
|
|
28
|
-
},
|
|
29
|
-
|
|
30
|
-
return
|
|
28
|
+
}, attributes_88a2fd04bc87484a954d07fc771290fa5);
|
|
29
|
+
template_88a2fd04bc87484a954d07fc771290fa0.slot(element_88a2fd04bc87484a954d07fc771290fa4, content);
|
|
30
|
+
return root_88a2fd04bc87484a954d07fc771290fa1;
|
|
31
31
|
})();
|
|
32
32
|
});
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import '@esportsplus/vite/global.d.ts';
|
|
2
2
|
import { Response } from '@esportsplus/action';
|
|
3
|
-
import { Attributes, Renderable } from '@esportsplus/
|
|
3
|
+
import { Attributes, Renderable } from '@esportsplus/frontend';
|
|
4
4
|
import './scss/index.scss';
|
|
5
5
|
declare const _default: (attributes: Attributes & {
|
|
6
6
|
"alert-close"?: Attributes;
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import '@esportsplus/vite/global.d.ts';
|
|
2
|
-
import * as
|
|
3
|
-
import { reactive, svg } from '@esportsplus/
|
|
2
|
+
import * as template_88a2fd04bc87484a954d07fc771290fa0 from '@esportsplus/frontend';
|
|
3
|
+
import { reactive, svg } from '@esportsplus/frontend';
|
|
4
4
|
import { omit } from '@esportsplus/utilities';
|
|
5
5
|
import { icon } from '@esportsplus/ui';
|
|
6
6
|
import check from './svg/check.svg';
|
|
7
7
|
import close from './svg/close.svg';
|
|
8
8
|
import e from './svg/error.svg';
|
|
9
9
|
import './scss/index.scss';
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
const
|
|
13
|
-
const
|
|
10
|
+
const template_88a2fd04bc87484a954d07fc771290fa7 = template_88a2fd04bc87484a954d07fc771290fa0.template(`<div class='--flex-vertical'><!--$--></div>`);
|
|
11
|
+
const template_88a2fd04bc87484a954d07fc771290fac = template_88a2fd04bc87484a954d07fc771290fa0.template(`<p><!--$--></p>`);
|
|
12
|
+
const template_88a2fd04bc87484a954d07fc771290fah = template_88a2fd04bc87484a954d07fc771290fa0.template(`<div class='--flex-start'><!--$--></div>`);
|
|
13
|
+
const template_88a2fd04bc87484a954d07fc771290fak = template_88a2fd04bc87484a954d07fc771290fa0.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>`);
|
|
14
14
|
const OMIT = ['alert-close', 'alert-messages', 'alert-message'];
|
|
15
15
|
let modifiers = {
|
|
16
16
|
error: 'red',
|
|
@@ -77,41 +77,41 @@ export default (attributes) => {
|
|
|
77
77
|
};
|
|
78
78
|
return {
|
|
79
79
|
content: (() => {
|
|
80
|
-
let
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
new
|
|
80
|
+
let root_88a2fd04bc87484a954d07fc771290faj = template_88a2fd04bc87484a954d07fc771290fak(), element_88a2fd04bc87484a954d07fc771290fal = root_88a2fd04bc87484a954d07fc771290faj.firstChild, element_88a2fd04bc87484a954d07fc771290fam = element_88a2fd04bc87484a954d07fc771290fal.firstChild, element_88a2fd04bc87484a954d07fc771290fan = element_88a2fd04bc87484a954d07fc771290fal.firstElementChild, element_88a2fd04bc87484a954d07fc771290fao = element_88a2fd04bc87484a954d07fc771290fan.firstChild, element_88a2fd04bc87484a954d07fc771290fap = element_88a2fd04bc87484a954d07fc771290fan.nextElementSibling.firstElementChild, element_88a2fd04bc87484a954d07fc771290faq = element_88a2fd04bc87484a954d07fc771290fap.firstElementChild.firstChild, attributes_88a2fd04bc87484a954d07fc771290far = { "class": "alert anchor anchor--n --flex-row" }, attributes_88a2fd04bc87484a954d07fc771290fas = { "class": "alert-messages --flex-column --flex-fill" }, attributes_88a2fd04bc87484a954d07fc771290fat = { "class": "alert-close button --padding-300" };
|
|
81
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setList(element_88a2fd04bc87484a954d07fc771290fal, 'class', () => state.active && '--active', attributes_88a2fd04bc87484a954d07fc771290far);
|
|
82
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperties(element_88a2fd04bc87484a954d07fc771290fal, omit(attributes, OMIT), attributes_88a2fd04bc87484a954d07fc771290far);
|
|
83
|
+
new template_88a2fd04bc87484a954d07fc771290fa0.EffectSlot(element_88a2fd04bc87484a954d07fc771290fam, () => {
|
|
84
84
|
let type = state.type;
|
|
85
85
|
return (() => {
|
|
86
|
-
let
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
return
|
|
86
|
+
let root_88a2fd04bc87484a954d07fc771290fa6 = template_88a2fd04bc87484a954d07fc771290fa7(), element_88a2fd04bc87484a954d07fc771290fa8 = root_88a2fd04bc87484a954d07fc771290fa6.firstChild, element_88a2fd04bc87484a954d07fc771290fa9 = element_88a2fd04bc87484a954d07fc771290fa8.firstChild, attributes_88a2fd04bc87484a954d07fc771290faa = { "class": "--flex-vertical", "style": "" };
|
|
87
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setList(element_88a2fd04bc87484a954d07fc771290fa8, 'style', `--color: var(--color-${modifiers[type]}-400);`, attributes_88a2fd04bc87484a954d07fc771290faa);
|
|
88
|
+
template_88a2fd04bc87484a954d07fc771290fa0.slot(element_88a2fd04bc87484a954d07fc771290fa9, icon({ class: '--size-500' }, type === 'error' ? e : check));
|
|
89
|
+
return root_88a2fd04bc87484a954d07fc771290fa6;
|
|
90
90
|
})();
|
|
91
91
|
});
|
|
92
|
-
|
|
93
|
-
new
|
|
92
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperties(element_88a2fd04bc87484a954d07fc771290fan, attributes['alert-messages'], attributes_88a2fd04bc87484a954d07fc771290fas);
|
|
93
|
+
new template_88a2fd04bc87484a954d07fc771290fa0.EffectSlot(element_88a2fd04bc87484a954d07fc771290fao, () => {
|
|
94
94
|
let message = attributes['alert-message'];
|
|
95
95
|
return state.rerender && [...state.messages].map((content) => {
|
|
96
96
|
if (typeof content === 'string') {
|
|
97
97
|
return (() => {
|
|
98
|
-
let
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
return
|
|
98
|
+
let root_88a2fd04bc87484a954d07fc771290fab = template_88a2fd04bc87484a954d07fc771290fac(), element_88a2fd04bc87484a954d07fc771290fad = root_88a2fd04bc87484a954d07fc771290fab.firstChild, element_88a2fd04bc87484a954d07fc771290fae = element_88a2fd04bc87484a954d07fc771290fad.firstChild, attributes_88a2fd04bc87484a954d07fc771290faf = {};
|
|
99
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperties(element_88a2fd04bc87484a954d07fc771290fad, message, attributes_88a2fd04bc87484a954d07fc771290faf);
|
|
100
|
+
template_88a2fd04bc87484a954d07fc771290fa0.slot(element_88a2fd04bc87484a954d07fc771290fae, content);
|
|
101
|
+
return root_88a2fd04bc87484a954d07fc771290fab;
|
|
102
102
|
})();
|
|
103
103
|
}
|
|
104
104
|
return (() => {
|
|
105
|
-
let
|
|
106
|
-
|
|
107
|
-
return
|
|
105
|
+
let root_88a2fd04bc87484a954d07fc771290fag = template_88a2fd04bc87484a954d07fc771290fah(), element_88a2fd04bc87484a954d07fc771290fai = root_88a2fd04bc87484a954d07fc771290fag.firstChild.firstChild;
|
|
106
|
+
template_88a2fd04bc87484a954d07fc771290fa0.slot(element_88a2fd04bc87484a954d07fc771290fai, content);
|
|
107
|
+
return root_88a2fd04bc87484a954d07fc771290fag;
|
|
108
108
|
})();
|
|
109
109
|
});
|
|
110
110
|
});
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
return
|
|
111
|
+
template_88a2fd04bc87484a954d07fc771290fa0.delegate(element_88a2fd04bc87484a954d07fc771290fap, 'click', () => deactivate(state));
|
|
112
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperties(element_88a2fd04bc87484a954d07fc771290fap, attributes['alert-close'], attributes_88a2fd04bc87484a954d07fc771290fat);
|
|
113
|
+
template_88a2fd04bc87484a954d07fc771290fa0.slot(element_88a2fd04bc87484a954d07fc771290faq, svg.sprite(close));
|
|
114
|
+
return root_88a2fd04bc87484a954d07fc771290faj;
|
|
115
115
|
})(),
|
|
116
116
|
deactivate: () => deactivate(state),
|
|
117
117
|
error,
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import { Attributes } from '@esportsplus/
|
|
1
|
+
import * as template_88a2fd04bc87484a954d07fc771290fa0 from '@esportsplus/frontend';
|
|
2
|
+
import { Attributes } from '@esportsplus/frontend';
|
|
3
3
|
import './scss/index.scss';
|
|
4
4
|
declare const _default: {
|
|
5
5
|
(): ReturnType<(this: {
|
|
6
6
|
attributes?: Attributes;
|
|
7
|
-
}, attributes: Readonly<
|
|
8
|
-
<T extends
|
|
7
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>) => template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>>;
|
|
8
|
+
<T extends template_88a2fd04bc87484a954d07fc771290fa0.Attributes>(attributes: T): ReturnType<(this: {
|
|
9
9
|
attributes?: Attributes;
|
|
10
|
-
}, attributes: Readonly<
|
|
11
|
-
<T extends
|
|
10
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>) => template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>>;
|
|
11
|
+
<T extends template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>>(content: T): ReturnType<(this: {
|
|
12
12
|
attributes?: Attributes;
|
|
13
|
-
}, attributes: Readonly<
|
|
14
|
-
(attributes:
|
|
13
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>) => template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>>;
|
|
14
|
+
(attributes: template_88a2fd04bc87484a954d07fc771290fa0.Attributes, content: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>): ReturnType<(this: {
|
|
15
15
|
attributes?: Attributes;
|
|
16
|
-
}, attributes: Readonly<
|
|
16
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>) => template_88a2fd04bc87484a954d07fc771290fa0.Renderable<any>>;
|
|
17
17
|
};
|
|
18
18
|
export default _default;
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as template_88a2fd04bc87484a954d07fc771290fa0 from '@esportsplus/frontend';
|
|
2
2
|
import icon from '../../components/icon/index.js';
|
|
3
3
|
import template from '../../components/template/index.js';
|
|
4
4
|
import arrow from './svg/arrow.svg';
|
|
5
5
|
import './scss/index.scss';
|
|
6
|
-
const
|
|
6
|
+
const template_88a2fd04bc87484a954d07fc771290fav = template_88a2fd04bc87484a954d07fc771290fa0.template(`<a class='back link --padding-0px --flex-vertical'><!--$--><!--$--></a>`);
|
|
7
7
|
export default template.factory(function (attributes, content) {
|
|
8
8
|
return (() => {
|
|
9
|
-
let
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
return
|
|
9
|
+
let root_88a2fd04bc87484a954d07fc771290fau = template_88a2fd04bc87484a954d07fc771290fav(), element_88a2fd04bc87484a954d07fc771290faw = root_88a2fd04bc87484a954d07fc771290fau.firstChild, element_88a2fd04bc87484a954d07fc771290fax = element_88a2fd04bc87484a954d07fc771290faw.firstChild, element_88a2fd04bc87484a954d07fc771290fay = element_88a2fd04bc87484a954d07fc771290fax.nextSibling, attributes_88a2fd04bc87484a954d07fc771290faz = { "class": "back link --padding-0px --flex-vertical" };
|
|
10
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperties(element_88a2fd04bc87484a954d07fc771290faw, this.attributes, attributes_88a2fd04bc87484a954d07fc771290faz);
|
|
11
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperties(element_88a2fd04bc87484a954d07fc771290faw, attributes, attributes_88a2fd04bc87484a954d07fc771290faz);
|
|
12
|
+
template_88a2fd04bc87484a954d07fc771290fa0.slot(element_88a2fd04bc87484a954d07fc771290fax, icon({ class: 'back-arrow --margin-right --margin-200' }, arrow));
|
|
13
|
+
template_88a2fd04bc87484a954d07fc771290fa0.slot(element_88a2fd04bc87484a954d07fc771290fay, content);
|
|
14
|
+
return root_88a2fd04bc87484a954d07fc771290fau;
|
|
15
15
|
})();
|
|
16
16
|
});
|
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import { Renderable } from '@esportsplus/
|
|
1
|
+
import * as template_88a2fd04bc87484a954d07fc771290fa0 from '@esportsplus/frontend';
|
|
2
|
+
import { Renderable } from '@esportsplus/frontend';
|
|
3
3
|
import './scss/index.scss';
|
|
4
4
|
declare const hold: {
|
|
5
5
|
(): ReturnType<(this: {
|
|
6
|
-
attributes?:
|
|
6
|
+
attributes?: template_88a2fd04bc87484a954d07fc771290fa0.Attributes | undefined;
|
|
7
7
|
content?: ((state: {
|
|
8
8
|
holding: boolean;
|
|
9
9
|
complete: boolean;
|
|
10
10
|
}) => Renderable<any>) | undefined;
|
|
11
|
-
}, attributes: Readonly<
|
|
11
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: (state: {
|
|
12
12
|
holding: boolean;
|
|
13
13
|
complete: boolean;
|
|
14
14
|
}) => Renderable<any>) => Renderable<any>>;
|
|
15
|
-
<T extends
|
|
16
|
-
attributes?:
|
|
15
|
+
<T extends template_88a2fd04bc87484a954d07fc771290fa0.Attributes>(attributes: T): ReturnType<(this: {
|
|
16
|
+
attributes?: template_88a2fd04bc87484a954d07fc771290fa0.Attributes | undefined;
|
|
17
17
|
content?: ((state: {
|
|
18
18
|
holding: boolean;
|
|
19
19
|
complete: boolean;
|
|
20
20
|
}) => Renderable<any>) | undefined;
|
|
21
|
-
}, attributes: Readonly<
|
|
21
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: (state: {
|
|
22
22
|
holding: boolean;
|
|
23
23
|
complete: boolean;
|
|
24
24
|
}) => Renderable<any>) => Renderable<any>>;
|
|
@@ -26,25 +26,25 @@ declare const hold: {
|
|
|
26
26
|
holding: boolean;
|
|
27
27
|
complete: boolean;
|
|
28
28
|
}) => Renderable<any>>(content: T): ReturnType<(this: {
|
|
29
|
-
attributes?:
|
|
29
|
+
attributes?: template_88a2fd04bc87484a954d07fc771290fa0.Attributes | undefined;
|
|
30
30
|
content?: ((state: {
|
|
31
31
|
holding: boolean;
|
|
32
32
|
complete: boolean;
|
|
33
33
|
}) => Renderable<any>) | undefined;
|
|
34
|
-
}, attributes: Readonly<
|
|
34
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: (state: {
|
|
35
35
|
holding: boolean;
|
|
36
36
|
complete: boolean;
|
|
37
37
|
}) => Renderable<any>) => Renderable<any>>;
|
|
38
|
-
(attributes:
|
|
38
|
+
(attributes: template_88a2fd04bc87484a954d07fc771290fa0.Attributes, content: (state: {
|
|
39
39
|
holding: boolean;
|
|
40
40
|
complete: boolean;
|
|
41
41
|
}) => Renderable<any>): ReturnType<(this: {
|
|
42
|
-
attributes?:
|
|
42
|
+
attributes?: template_88a2fd04bc87484a954d07fc771290fa0.Attributes | undefined;
|
|
43
43
|
content?: ((state: {
|
|
44
44
|
holding: boolean;
|
|
45
45
|
complete: boolean;
|
|
46
46
|
}) => Renderable<any>) | undefined;
|
|
47
|
-
}, attributes: Readonly<
|
|
47
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: (state: {
|
|
48
48
|
holding: boolean;
|
|
49
49
|
complete: boolean;
|
|
50
50
|
}) => Renderable<any>) => Renderable<any>>;
|
|
@@ -52,22 +52,22 @@ declare const hold: {
|
|
|
52
52
|
declare const _default: {
|
|
53
53
|
hold: {
|
|
54
54
|
(): ReturnType<(this: {
|
|
55
|
-
attributes?:
|
|
55
|
+
attributes?: template_88a2fd04bc87484a954d07fc771290fa0.Attributes | undefined;
|
|
56
56
|
content?: ((state: {
|
|
57
57
|
holding: boolean;
|
|
58
58
|
complete: boolean;
|
|
59
59
|
}) => Renderable<any>) | undefined;
|
|
60
|
-
}, attributes: Readonly<
|
|
60
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: (state: {
|
|
61
61
|
holding: boolean;
|
|
62
62
|
complete: boolean;
|
|
63
63
|
}) => Renderable<any>) => Renderable<any>>;
|
|
64
|
-
<T extends
|
|
65
|
-
attributes?:
|
|
64
|
+
<T extends template_88a2fd04bc87484a954d07fc771290fa0.Attributes>(attributes: T): ReturnType<(this: {
|
|
65
|
+
attributes?: template_88a2fd04bc87484a954d07fc771290fa0.Attributes | undefined;
|
|
66
66
|
content?: ((state: {
|
|
67
67
|
holding: boolean;
|
|
68
68
|
complete: boolean;
|
|
69
69
|
}) => Renderable<any>) | undefined;
|
|
70
|
-
}, attributes: Readonly<
|
|
70
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: (state: {
|
|
71
71
|
holding: boolean;
|
|
72
72
|
complete: boolean;
|
|
73
73
|
}) => Renderable<any>) => Renderable<any>>;
|
|
@@ -75,25 +75,25 @@ declare const _default: {
|
|
|
75
75
|
holding: boolean;
|
|
76
76
|
complete: boolean;
|
|
77
77
|
}) => Renderable<any>>(content: T): ReturnType<(this: {
|
|
78
|
-
attributes?:
|
|
78
|
+
attributes?: template_88a2fd04bc87484a954d07fc771290fa0.Attributes | undefined;
|
|
79
79
|
content?: ((state: {
|
|
80
80
|
holding: boolean;
|
|
81
81
|
complete: boolean;
|
|
82
82
|
}) => Renderable<any>) | undefined;
|
|
83
|
-
}, attributes: Readonly<
|
|
83
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: (state: {
|
|
84
84
|
holding: boolean;
|
|
85
85
|
complete: boolean;
|
|
86
86
|
}) => Renderable<any>) => Renderable<any>>;
|
|
87
|
-
(attributes:
|
|
87
|
+
(attributes: template_88a2fd04bc87484a954d07fc771290fa0.Attributes, content: (state: {
|
|
88
88
|
holding: boolean;
|
|
89
89
|
complete: boolean;
|
|
90
90
|
}) => Renderable<any>): ReturnType<(this: {
|
|
91
|
-
attributes?:
|
|
91
|
+
attributes?: template_88a2fd04bc87484a954d07fc771290fa0.Attributes | undefined;
|
|
92
92
|
content?: ((state: {
|
|
93
93
|
holding: boolean;
|
|
94
94
|
complete: boolean;
|
|
95
95
|
}) => Renderable<any>) | undefined;
|
|
96
|
-
}, attributes: Readonly<
|
|
96
|
+
}, attributes: Readonly<template_88a2fd04bc87484a954d07fc771290fa0.Attributes>, content: (state: {
|
|
97
97
|
holding: boolean;
|
|
98
98
|
complete: boolean;
|
|
99
99
|
}) => Renderable<any>) => Renderable<any>>;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import { reactive } from '@esportsplus/
|
|
1
|
+
import * as template_88a2fd04bc87484a954d07fc771290fa0 from '@esportsplus/frontend';
|
|
2
|
+
import { reactive } from '@esportsplus/frontend';
|
|
3
3
|
import template from '../template/index.js';
|
|
4
4
|
import './scss/index.scss';
|
|
5
|
-
const
|
|
5
|
+
const template_88a2fd04bc87484a954d07fc771290fa11 = template_88a2fd04bc87484a954d07fc771290fa0.template(`<div class='button '><!--$--></div>`);
|
|
6
6
|
const hold = template.factory(function (attributes, content) {
|
|
7
7
|
let end = () => {
|
|
8
8
|
if (!state.complete) {
|
|
@@ -13,32 +13,32 @@ const hold = template.factory(function (attributes, content) {
|
|
|
13
13
|
holding: false
|
|
14
14
|
});
|
|
15
15
|
return (() => {
|
|
16
|
-
let
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
16
|
+
let root_88a2fd04bc87484a954d07fc771290fa10 = template_88a2fd04bc87484a954d07fc771290fa11(), element_88a2fd04bc87484a954d07fc771290fa12 = root_88a2fd04bc87484a954d07fc771290fa10.firstChild, element_88a2fd04bc87484a954d07fc771290fa13 = element_88a2fd04bc87484a954d07fc771290fa12.firstChild, attributes_88a2fd04bc87484a954d07fc771290fa14 = { "class": "button" };
|
|
17
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setList(element_88a2fd04bc87484a954d07fc771290fa12, 'class', () => state.holding && 'button--holding', attributes_88a2fd04bc87484a954d07fc771290fa14);
|
|
18
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setList(element_88a2fd04bc87484a954d07fc771290fa12, 'class', () => state.complete && '--active', attributes_88a2fd04bc87484a954d07fc771290fa14);
|
|
19
|
+
template_88a2fd04bc87484a954d07fc771290fa0.delegate(element_88a2fd04bc87484a954d07fc771290fa12, 'mousedown', (e) => {
|
|
20
20
|
e.preventDefault();
|
|
21
21
|
state.holding = true;
|
|
22
22
|
});
|
|
23
|
-
|
|
24
|
-
|
|
23
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperties(element_88a2fd04bc87484a954d07fc771290fa12, attributes, attributes_88a2fd04bc87484a954d07fc771290fa14);
|
|
24
|
+
template_88a2fd04bc87484a954d07fc771290fa0.delegate(element_88a2fd04bc87484a954d07fc771290fa12, 'animationend', (e) => {
|
|
25
25
|
if (e.animationName === 'buttonHolding') {
|
|
26
26
|
state.complete = true;
|
|
27
27
|
}
|
|
28
28
|
});
|
|
29
|
-
|
|
30
|
-
|
|
29
|
+
template_88a2fd04bc87484a954d07fc771290fa0.delegate(element_88a2fd04bc87484a954d07fc771290fa12, 'click', () => { });
|
|
30
|
+
template_88a2fd04bc87484a954d07fc771290fa0.delegate(element_88a2fd04bc87484a954d07fc771290fa12, 'mousedown', (e) => {
|
|
31
31
|
e.preventDefault();
|
|
32
32
|
state.holding = true;
|
|
33
33
|
});
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
34
|
+
template_88a2fd04bc87484a954d07fc771290fa0.delegate(element_88a2fd04bc87484a954d07fc771290fa12, 'mouseup', end);
|
|
35
|
+
template_88a2fd04bc87484a954d07fc771290fa0.delegate(element_88a2fd04bc87484a954d07fc771290fa12, 'touchend', end);
|
|
36
|
+
template_88a2fd04bc87484a954d07fc771290fa0.delegate(element_88a2fd04bc87484a954d07fc771290fa12, 'touchstart', (e) => {
|
|
37
37
|
e.preventDefault();
|
|
38
38
|
state.holding = true;
|
|
39
39
|
});
|
|
40
|
-
new
|
|
41
|
-
return
|
|
40
|
+
new template_88a2fd04bc87484a954d07fc771290fa0.EffectSlot(element_88a2fd04bc87484a954d07fc771290fa13, () => content(state));
|
|
41
|
+
return root_88a2fd04bc87484a954d07fc771290fa10;
|
|
42
42
|
})();
|
|
43
43
|
});
|
|
44
44
|
export default { hold };
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import { reactive, root } from '@esportsplus/
|
|
1
|
+
import * as template_88a2fd04bc87484a954d07fc771290fa0 from '@esportsplus/frontend';
|
|
2
|
+
import { reactive, root } from '@esportsplus/frontend';
|
|
3
3
|
import { omit } from '@esportsplus/utilities';
|
|
4
4
|
import form from '../../components/form/index.js';
|
|
5
5
|
import './scss/index.scss';
|
|
6
|
-
const
|
|
6
|
+
const template_88a2fd04bc87484a954d07fc771290fa16 = template_88a2fd04bc87484a954d07fc771290fa0.template(`<div><input></div>`);
|
|
7
7
|
const OMIT = ['checked', 'value'];
|
|
8
8
|
const factory = (type) => {
|
|
9
9
|
function template(attributes) {
|
|
@@ -15,20 +15,20 @@ const factory = (type) => {
|
|
|
15
15
|
state.active = true;
|
|
16
16
|
}
|
|
17
17
|
return (() => {
|
|
18
|
-
let
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
18
|
+
let root_88a2fd04bc87484a954d07fc771290fa15 = template_88a2fd04bc87484a954d07fc771290fa16(), element_88a2fd04bc87484a954d07fc771290fa17 = root_88a2fd04bc87484a954d07fc771290fa15.firstChild, element_88a2fd04bc87484a954d07fc771290fa18 = element_88a2fd04bc87484a954d07fc771290fa17.firstElementChild, attributes_88a2fd04bc87484a954d07fc771290fa19 = { "class": "" }, attributes_88a2fd04bc87484a954d07fc771290fa1a = {};
|
|
19
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setList(element_88a2fd04bc87484a954d07fc771290fa17, 'class', type, attributes_88a2fd04bc87484a954d07fc771290fa19);
|
|
20
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setList(element_88a2fd04bc87484a954d07fc771290fa17, 'class', () => state.active && '--active', attributes_88a2fd04bc87484a954d07fc771290fa19);
|
|
21
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperties(element_88a2fd04bc87484a954d07fc771290fa17, this?.attributes && omit(this.attributes, OMIT), attributes_88a2fd04bc87484a954d07fc771290fa19);
|
|
22
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperties(element_88a2fd04bc87484a954d07fc771290fa17, attributes && omit(attributes, OMIT), attributes_88a2fd04bc87484a954d07fc771290fa19);
|
|
23
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperty(element_88a2fd04bc87484a954d07fc771290fa18, 'checked', attributes?.checked || root(() => state.active));
|
|
24
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setList(element_88a2fd04bc87484a954d07fc771290fa18, 'class', `${type}-tag`, attributes_88a2fd04bc87484a954d07fc771290fa1a);
|
|
25
|
+
template_88a2fd04bc87484a954d07fc771290fa0.delegate(element_88a2fd04bc87484a954d07fc771290fa18, 'change', (e) => {
|
|
26
26
|
state.active = e.target.checked;
|
|
27
27
|
});
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
return
|
|
28
|
+
template_88a2fd04bc87484a954d07fc771290fa0.onrender(element_88a2fd04bc87484a954d07fc771290fa18, form.input.onrender(state));
|
|
29
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperty(element_88a2fd04bc87484a954d07fc771290fa18, 'type', type === 'radio' ? 'radio' : 'checkbox');
|
|
30
|
+
template_88a2fd04bc87484a954d07fc771290fa0.setProperty(element_88a2fd04bc87484a954d07fc771290fa18, 'value', attributes?.value || 1);
|
|
31
|
+
return root_88a2fd04bc87484a954d07fc771290fa15;
|
|
32
32
|
})();
|
|
33
33
|
}
|
|
34
34
|
return template;
|