@esportsplus/ui 0.51.5 → 0.51.7
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/.github/workflows/bump.yml +4 -1
- package/.github/workflows/publish.yml +4 -0
- package/build/components/accordion/index.d.ts +17 -16
- package/build/components/accordion/index.js +18 -18
- package/build/components/alert/index.d.ts +8 -8
- package/build/components/alert/index.js +43 -44
- package/build/components/back/index.d.ts +8 -8
- package/build/components/back/index.js +10 -10
- package/build/components/button/index.d.ts +22 -22
- package/build/components/button/index.js +23 -23
- package/build/components/checkbox/index.d.ts +3 -3
- package/build/components/checkbox/index.js +23 -24
- package/build/components/clipboard/index.d.ts +40 -30
- package/build/components/clipboard/onclick.d.ts +1 -1
- package/build/components/clipboard/onclick.js +14 -14
- package/build/components/clipboard/write.d.ts +1 -1
- package/build/components/counter/index.d.ts +5 -5
- package/build/components/counter/index.js +35 -35
- package/build/components/ellipsis/index.d.ts +1 -1
- package/build/components/ellipsis/index.js +5 -5
- package/build/components/form/action.d.ts +3 -3
- package/build/components/form/action.js +8 -8
- package/build/components/form/index.d.ts +3 -3
- package/build/components/form/input.d.ts +8 -6
- package/build/components/frame/index.d.ts +10 -10
- package/build/components/frame/index.js +1 -1
- package/build/components/highlight/index.d.ts +17 -16
- package/build/components/highlight/index.js +16 -16
- package/build/components/icon/index.d.ts +11 -11
- package/build/components/icon/index.js +11 -9
- package/build/components/input/index.d.ts +2 -2
- package/build/components/input/index.js +21 -21
- package/build/components/json/download.d.ts +1 -1
- package/build/components/loader/index.d.ts +17 -16
- package/build/components/loader/index.js +35 -35
- 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/overlay/index.js +1 -1
- package/build/components/radio/index.d.ts +1 -1
- package/build/components/radio/index.js +1 -1
- package/build/components/range/index.d.ts +2 -2
- package/build/components/range/index.js +26 -26
- package/build/components/root/index.d.ts +1 -4
- package/build/components/root/onclick.d.ts +4 -4
- package/build/components/scrollbar/index.d.ts +12 -12
- package/build/components/scrollbar/index.js +25 -25
- package/build/components/select/index.d.ts +2 -2
- package/build/components/select/index.js +45 -45
- package/build/components/sidebar/index.d.ts +10 -10
- package/build/components/sidebar/index.js +1 -1
- package/build/components/site/index.d.ts +10 -10
- package/build/components/site/index.js +2 -2
- package/build/components/switch/index.d.ts +1 -1
- package/build/components/switch/index.js +1 -1
- package/build/components/template/index.d.ts +10 -9
- package/build/components/textarea/index.d.ts +2 -2
- package/build/components/textarea/index.js +21 -21
- package/build/components/tooltip/index.d.ts +80 -60
- package/build/components/tooltip/menu.d.ts +11 -12
- package/build/components/tooltip/menu.js +22 -22
- package/build/components/tooltip/onclick.d.ts +1131 -1121
- package/build/components/tooltip/onclick.js +16 -16
- package/build/components/tooltip/onhover.d.ts +17 -16
- package/build/components/tooltip/onhover.js +16 -16
- package/build/components/typewriter/index.d.ts +11 -11
- package/build/components/typewriter/index.js +15 -15
- package/build/themes/dark/alert.d.ts +2 -2
- package/build/themes/dark/input.d.ts +5 -4
- package/build/themes/dark/select.d.ts +40 -30
- package/build/themes/dark/textarea.d.ts +5 -4
- package/package.json +8 -8
- package/pnpm-workspace.yaml +25 -0
- package/src/components/alert/index.ts +4 -6
- package/src/components/icon/index.ts +7 -3
- package/src/components/tooltip/onclick.ts +1 -1
|
@@ -1,78 +1,78 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as
|
|
1
|
+
import * as template_u1 from '@esportsplus/template';
|
|
2
|
+
import * as reactivity_u0 from '@esportsplus/reactivity';
|
|
3
3
|
import { omit } from '@esportsplus/utilities';
|
|
4
|
-
import template from '
|
|
4
|
+
import template from '../template/index.js';
|
|
5
5
|
import './scss/index.scss';
|
|
6
|
-
const
|
|
7
|
-
const
|
|
8
|
-
class
|
|
9
|
-
#load = this[
|
|
10
|
-
#remove = this[
|
|
11
|
-
#scale = this[
|
|
6
|
+
const template_0bvfqbq2 = template_u1.template(`<div class='loader-content' ><div class='loader-logo text --flex-center --text-uppercase --text-600' style='color: var(--color-grey-500);' >`);
|
|
7
|
+
const template_0bvfqbq6 = template_u1.template(`<div class='loader '><div class='loader ' >`);
|
|
8
|
+
class ReactiveObject_0bvfqbq0 extends reactivity_u0.ReactiveObject {
|
|
9
|
+
#load = this[reactivity_u0.SIGNAL](false);
|
|
10
|
+
#remove = this[reactivity_u0.SIGNAL](false);
|
|
11
|
+
#scale = this[reactivity_u0.SIGNAL](false);
|
|
12
12
|
constructor() {
|
|
13
13
|
super(null);
|
|
14
14
|
}
|
|
15
15
|
get load() {
|
|
16
|
-
return
|
|
16
|
+
return reactivity_u0.read(this.#load);
|
|
17
17
|
}
|
|
18
18
|
set load(_v0) {
|
|
19
|
-
|
|
19
|
+
reactivity_u0.write(this.#load, _v0);
|
|
20
20
|
}
|
|
21
21
|
get remove() {
|
|
22
|
-
return
|
|
22
|
+
return reactivity_u0.read(this.#remove);
|
|
23
23
|
}
|
|
24
24
|
set remove(_v1) {
|
|
25
|
-
|
|
25
|
+
reactivity_u0.write(this.#remove, _v1);
|
|
26
26
|
}
|
|
27
27
|
get scale() {
|
|
28
|
-
return
|
|
28
|
+
return reactivity_u0.read(this.#scale);
|
|
29
29
|
}
|
|
30
30
|
set scale(_v2) {
|
|
31
|
-
|
|
31
|
+
reactivity_u0.write(this.#scale, _v2);
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
34
|
const OMIT = ['loader-content', 'loader-logo'];
|
|
35
35
|
export default template.factory((attributes, content) => {
|
|
36
|
-
let state = new
|
|
36
|
+
let state = new ReactiveObject_0bvfqbq0();
|
|
37
37
|
return () => {
|
|
38
38
|
if (state.remove) {
|
|
39
39
|
return;
|
|
40
40
|
}
|
|
41
41
|
let i = 0;
|
|
42
42
|
return (() => {
|
|
43
|
-
let
|
|
44
|
-
|
|
45
|
-
|
|
43
|
+
let root_0bvfqbq5 = template_0bvfqbq6(), element_0bvfqbq7 = root_0bvfqbq5.firstChild, element_0bvfqbq8 = element_0bvfqbq7.firstElementChild;
|
|
44
|
+
template_u1.setList(element_0bvfqbq7, 'class', () => state.load && 'loader--load');
|
|
45
|
+
template_u1.delegate(element_0bvfqbq7, 'animationend', (e) => {
|
|
46
46
|
i++;
|
|
47
47
|
if (e.animationName === 'move' && i > 1) {
|
|
48
48
|
state.remove = true;
|
|
49
49
|
}
|
|
50
50
|
});
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
51
|
+
template_u1.setProperties(element_0bvfqbq7, omit(attributes, OMIT));
|
|
52
|
+
template_u1.setList(element_0bvfqbq8, 'class', () => state.load && 'loader--load');
|
|
53
|
+
template_u1.setProperties(element_0bvfqbq8, !content && {
|
|
54
54
|
onconnect: () => {
|
|
55
55
|
state.load = true;
|
|
56
56
|
}
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
let
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
57
|
+
});
|
|
58
|
+
template_u1.setProperties(element_0bvfqbq8, attributes.loader);
|
|
59
|
+
template_u1.slot(element_0bvfqbq8, content && (() => {
|
|
60
|
+
let root_0bvfqbq1 = template_0bvfqbq2(), element_0bvfqbq3 = root_0bvfqbq1.firstChild, element_0bvfqbq4 = element_0bvfqbq3.firstElementChild;
|
|
61
|
+
template_u1.setProperties(element_0bvfqbq3, attributes['loader-content']);
|
|
62
|
+
template_u1.setProperties(element_0bvfqbq4, attributes['loader-logo']);
|
|
63
|
+
template_u1.setList(element_0bvfqbq4, 'class', () => state.scale && 'loader-logo--scale');
|
|
64
|
+
template_u1.delegate(element_0bvfqbq4, 'animationend', ({ animationName: name }) => {
|
|
65
65
|
if (name === 'scale') {
|
|
66
66
|
state.load = true;
|
|
67
67
|
}
|
|
68
68
|
});
|
|
69
|
-
|
|
69
|
+
template_u1.onconnect(element_0bvfqbq4, () => {
|
|
70
70
|
state.scale = true;
|
|
71
71
|
});
|
|
72
|
-
|
|
73
|
-
return
|
|
74
|
-
})());
|
|
75
|
-
return
|
|
72
|
+
template_u1.slot(element_0bvfqbq4, content, 1);
|
|
73
|
+
return root_0bvfqbq1;
|
|
74
|
+
})(), 1);
|
|
75
|
+
return root_0bvfqbq5;
|
|
76
76
|
})();
|
|
77
77
|
};
|
|
78
78
|
});
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as template_u1 from '@esportsplus/template';
|
|
2
2
|
import './scss/index.scss';
|
|
3
|
-
const
|
|
3
|
+
const template_17hj0u91 = template_u1.template(`<div class='loading --border-width-700 --size-800' style='--border-color: var(--color-border-500);' >`);
|
|
4
4
|
export default (attributes) => {
|
|
5
5
|
return (() => {
|
|
6
|
-
let
|
|
7
|
-
|
|
8
|
-
return
|
|
6
|
+
let root_17hj0u90 = template_17hj0u91(), element_17hj0u92 = root_17hj0u90.firstChild;
|
|
7
|
+
template_u1.setProperties(element_17hj0u92, attributes);
|
|
8
|
+
return root_17hj0u90;
|
|
9
9
|
})();
|
|
10
10
|
};
|
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import './scss/index.scss';
|
|
2
2
|
declare const _default: {
|
|
3
3
|
(): ReturnType<(this: {
|
|
4
|
-
attributes?: import("
|
|
4
|
+
attributes?: import("../scrollbar/index.js").Attributes | undefined;
|
|
5
5
|
content?: import("@esportsplus/template").Renderable<any>;
|
|
6
|
-
}, attributes: Readonly<import("
|
|
7
|
-
<T extends import("
|
|
8
|
-
attributes?: import("
|
|
6
|
+
}, attributes: Readonly<import("../scrollbar/index.js").Attributes>, content: import("@esportsplus/template").Renderable<any>) => import("@esportsplus/template").Renderable<any>>;
|
|
7
|
+
<T extends import("../scrollbar/index.js").Attributes>(attributes: T): ReturnType<(this: {
|
|
8
|
+
attributes?: import("../scrollbar/index.js").Attributes | undefined;
|
|
9
9
|
content?: import("@esportsplus/template").Renderable<any>;
|
|
10
|
-
}, attributes: Readonly<import("
|
|
10
|
+
}, attributes: Readonly<import("../scrollbar/index.js").Attributes>, content: import("@esportsplus/template").Renderable<any>) => import("@esportsplus/template").Renderable<any>>;
|
|
11
11
|
<T extends import("@esportsplus/template").Renderable<any>>(content: T): ReturnType<(this: {
|
|
12
|
-
attributes?: import("
|
|
12
|
+
attributes?: import("../scrollbar/index.js").Attributes | undefined;
|
|
13
13
|
content?: import("@esportsplus/template").Renderable<any>;
|
|
14
|
-
}, attributes: Readonly<import("
|
|
15
|
-
(attributes: import("
|
|
16
|
-
attributes?: import("
|
|
14
|
+
}, attributes: Readonly<import("../scrollbar/index.js").Attributes>, content: import("@esportsplus/template").Renderable<any>) => import("@esportsplus/template").Renderable<any>>;
|
|
15
|
+
(attributes: import("../scrollbar/index.js").Attributes, content: import("@esportsplus/template").Renderable<any>): ReturnType<(this: {
|
|
16
|
+
attributes?: import("../scrollbar/index.js").Attributes | undefined;
|
|
17
17
|
content?: import("@esportsplus/template").Renderable<any>;
|
|
18
|
-
}, attributes: Readonly<import("
|
|
18
|
+
}, attributes: Readonly<import("../scrollbar/index.js").Attributes>, content: import("@esportsplus/template").Renderable<any>) => import("@esportsplus/template").Renderable<any>>;
|
|
19
19
|
};
|
|
20
20
|
export default _default;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Attributes } from '@esportsplus/template';
|
|
1
|
+
import { type Attributes } from '@esportsplus/template';
|
|
2
2
|
import './scss/index.scss';
|
|
3
3
|
export default function (this: {
|
|
4
4
|
attributes?: Attributes;
|
|
@@ -10,4 +10,4 @@ export default function (this: {
|
|
|
10
10
|
error: string;
|
|
11
11
|
value: number;
|
|
12
12
|
};
|
|
13
|
-
}): DocumentFragment;
|
|
13
|
+
}): DocumentFragment | Text;
|
|
@@ -1,58 +1,58 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as
|
|
1
|
+
import * as template_u1 from '@esportsplus/template';
|
|
2
|
+
import * as reactivity_u0 from '@esportsplus/reactivity';
|
|
3
3
|
import { root } from '@esportsplus/reactivity';
|
|
4
|
-
import form from '
|
|
4
|
+
import form from '../form/index.js';
|
|
5
5
|
import './scss/index.scss';
|
|
6
|
-
const
|
|
7
|
-
class
|
|
8
|
-
#active = this[
|
|
9
|
-
#error = this[
|
|
10
|
-
#value = this[
|
|
6
|
+
const template_0aka2e62 = template_u1.template(`<input class='range --border-state --border-black' type='range' />`);
|
|
7
|
+
class ReactiveObject_0aka2e60 extends reactivity_u0.ReactiveObject {
|
|
8
|
+
#active = this[reactivity_u0.SIGNAL](false);
|
|
9
|
+
#error = this[reactivity_u0.SIGNAL]('');
|
|
10
|
+
#value = this[reactivity_u0.SIGNAL](0);
|
|
11
11
|
constructor() {
|
|
12
12
|
super(null);
|
|
13
13
|
}
|
|
14
14
|
get active() {
|
|
15
|
-
return
|
|
15
|
+
return reactivity_u0.read(this.#active);
|
|
16
16
|
}
|
|
17
17
|
set active(_v0) {
|
|
18
|
-
|
|
18
|
+
reactivity_u0.write(this.#active, _v0);
|
|
19
19
|
}
|
|
20
20
|
get error() {
|
|
21
|
-
return
|
|
21
|
+
return reactivity_u0.read(this.#error);
|
|
22
22
|
}
|
|
23
23
|
set error(_v1) {
|
|
24
|
-
|
|
24
|
+
reactivity_u0.write(this.#error, _v1);
|
|
25
25
|
}
|
|
26
26
|
get value() {
|
|
27
|
-
return
|
|
27
|
+
return reactivity_u0.read(this.#value);
|
|
28
28
|
}
|
|
29
29
|
set value(_v2) {
|
|
30
|
-
|
|
30
|
+
reactivity_u0.write(this.#value, _v2);
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
33
|
export default function (attributes) {
|
|
34
|
-
let { max, min } = attributes, state = attributes.state || new
|
|
34
|
+
let { max, min } = attributes, state = attributes.state || new ReactiveObject_0aka2e60();
|
|
35
35
|
if (attributes?.value) {
|
|
36
36
|
state.value = Number(attributes.value);
|
|
37
37
|
}
|
|
38
38
|
return (() => {
|
|
39
|
-
let
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
39
|
+
let root_0aka2e61 = template_0aka2e62(), element_0aka2e63 = root_0aka2e61.firstChild;
|
|
40
|
+
template_u1.setList(element_0aka2e63, 'style', () => `--thumb-position: ${((state.value - min) / (max - min)) * 100}%`);
|
|
41
|
+
template_u1.setProperties(element_0aka2e63, this?.attributes);
|
|
42
|
+
template_u1.setProperties(element_0aka2e63, attributes);
|
|
43
|
+
template_u1.setList(element_0aka2e63, 'class', () => state.active && '--active');
|
|
44
|
+
template_u1.on(element_0aka2e63, 'focusin', () => {
|
|
45
45
|
state.active = true;
|
|
46
46
|
});
|
|
47
|
-
|
|
47
|
+
template_u1.on(element_0aka2e63, 'focusout', () => {
|
|
48
48
|
state.active = false;
|
|
49
49
|
});
|
|
50
|
-
|
|
50
|
+
template_u1.delegate(element_0aka2e63, 'input', (e) => {
|
|
51
51
|
state.value = Number(e.target.value);
|
|
52
52
|
});
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
return
|
|
53
|
+
template_u1.onrender(element_0aka2e63, form.input.onrender(state));
|
|
54
|
+
template_u1.setProperty(element_0aka2e63, 'value', root(() => attributes?.value || state.value || 0));
|
|
55
|
+
return root_0aka2e61;
|
|
56
56
|
})();
|
|
57
57
|
}
|
|
58
58
|
;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
declare
|
|
2
|
-
|
|
3
|
-
push(fn: VoidFunction)
|
|
4
|
-
}
|
|
1
|
+
declare function onclick(): Promise<void>;
|
|
2
|
+
declare namespace onclick {
|
|
3
|
+
var push: (fn: VoidFunction) => void;
|
|
4
|
+
}
|
|
5
5
|
export default onclick;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import { Attributes } from '@esportsplus/template';
|
|
1
|
+
import * as template_u1 from '@esportsplus/template';
|
|
2
|
+
import { type Attributes } from '@esportsplus/template';
|
|
3
3
|
import './scss/index.scss';
|
|
4
4
|
type A = Attributes & {
|
|
5
5
|
scrollbar?: Attributes;
|
|
@@ -8,20 +8,20 @@ type A = Attributes & {
|
|
|
8
8
|
declare const _default: {
|
|
9
9
|
(): ReturnType<(this: {
|
|
10
10
|
attributes?: A | undefined;
|
|
11
|
-
content?:
|
|
12
|
-
}, attributes: Readonly<A>, content:
|
|
11
|
+
content?: template_u1.Renderable<any>;
|
|
12
|
+
}, attributes: Readonly<A>, content: template_u1.Renderable<any>) => template_u1.Renderable<any>>;
|
|
13
13
|
<T extends A>(attributes: T): ReturnType<(this: {
|
|
14
14
|
attributes?: A | undefined;
|
|
15
|
-
content?:
|
|
16
|
-
}, attributes: Readonly<A>, content:
|
|
17
|
-
<T extends
|
|
15
|
+
content?: template_u1.Renderable<any>;
|
|
16
|
+
}, attributes: Readonly<A>, content: template_u1.Renderable<any>) => template_u1.Renderable<any>>;
|
|
17
|
+
<T extends template_u1.Renderable<any>>(content: T): ReturnType<(this: {
|
|
18
18
|
attributes?: A | undefined;
|
|
19
|
-
content?:
|
|
20
|
-
}, attributes: Readonly<A>, content:
|
|
21
|
-
(attributes: A, content:
|
|
19
|
+
content?: template_u1.Renderable<any>;
|
|
20
|
+
}, attributes: Readonly<A>, content: template_u1.Renderable<any>) => template_u1.Renderable<any>>;
|
|
21
|
+
(attributes: A, content: template_u1.Renderable<any>): ReturnType<(this: {
|
|
22
22
|
attributes?: A | undefined;
|
|
23
|
-
content?:
|
|
24
|
-
}, attributes: Readonly<A>, content:
|
|
23
|
+
content?: template_u1.Renderable<any>;
|
|
24
|
+
}, attributes: Readonly<A>, content: template_u1.Renderable<any>) => template_u1.Renderable<any>>;
|
|
25
25
|
};
|
|
26
26
|
export default _default;
|
|
27
27
|
export type { A as Attributes };
|
|
@@ -1,39 +1,39 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as
|
|
1
|
+
import * as template_u1 from '@esportsplus/template';
|
|
2
|
+
import * as reactivity_u0 from '@esportsplus/reactivity';
|
|
3
3
|
import { omit } from '@esportsplus/utilities';
|
|
4
|
-
import template from '
|
|
4
|
+
import template from '../template/index.js';
|
|
5
5
|
import './scss/index.scss';
|
|
6
|
-
const
|
|
7
|
-
class
|
|
8
|
-
#height = this[
|
|
9
|
-
#translate = this[
|
|
6
|
+
const template_1aruxaj2 = template_u1.template(`<div class='scrollbar-container' ><div class='scrollbar-container-content' ></div><div class='scrollbar' >`);
|
|
7
|
+
class ReactiveObject_1aruxaj0 extends reactivity_u0.ReactiveObject {
|
|
8
|
+
#height = this[reactivity_u0.SIGNAL](100);
|
|
9
|
+
#translate = this[reactivity_u0.SIGNAL](0);
|
|
10
10
|
constructor() {
|
|
11
11
|
super(null);
|
|
12
12
|
}
|
|
13
13
|
get height() {
|
|
14
|
-
return
|
|
14
|
+
return reactivity_u0.read(this.#height);
|
|
15
15
|
}
|
|
16
16
|
set height(_v0) {
|
|
17
|
-
|
|
17
|
+
reactivity_u0.write(this.#height, _v0);
|
|
18
18
|
}
|
|
19
19
|
get translate() {
|
|
20
|
-
return
|
|
20
|
+
return reactivity_u0.read(this.#translate);
|
|
21
21
|
}
|
|
22
22
|
set translate(_v1) {
|
|
23
|
-
|
|
23
|
+
reactivity_u0.write(this.#translate, _v1);
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
26
|
const OMIT = ['scrollbar', 'scrollbar-container-content'];
|
|
27
27
|
let root = document.body, width;
|
|
28
28
|
export default template.factory(function (attributes, content) {
|
|
29
|
-
let state = new
|
|
29
|
+
let state = new ReactiveObject_1aruxaj0();
|
|
30
30
|
return (() => {
|
|
31
|
-
let
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
31
|
+
let root_1aruxaj1 = template_1aruxaj2(), element_1aruxaj3 = root_1aruxaj1.firstChild, element_1aruxaj4 = element_1aruxaj3.firstElementChild, element_1aruxaj5 = element_1aruxaj4.nextElementSibling;
|
|
32
|
+
template_u1.setProperties(element_1aruxaj3, this?.attributes && omit(this.attributes, OMIT));
|
|
33
|
+
template_u1.setProperties(element_1aruxaj3, omit(attributes, OMIT));
|
|
34
|
+
template_u1.setProperties(element_1aruxaj4, this?.attributes?.['scrollbar-container-content']);
|
|
35
|
+
template_u1.setProperties(element_1aruxaj4, attributes['scrollbar-container-content']);
|
|
36
|
+
template_u1.on(element_1aruxaj4, 'scroll', function () {
|
|
37
37
|
if (width === undefined) {
|
|
38
38
|
width = this.offsetWidth - this.clientWidth;
|
|
39
39
|
if (width && width !== 17) {
|
|
@@ -43,14 +43,14 @@ export default template.factory(function (attributes, content) {
|
|
|
43
43
|
state.height = (this.clientHeight / this.scrollHeight) * 100;
|
|
44
44
|
state.translate = (this.scrollTop / this.clientHeight) * 100;
|
|
45
45
|
});
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
46
|
+
template_u1.slot(element_1aruxaj4, content, 1);
|
|
47
|
+
template_u1.setProperties(element_1aruxaj5, this?.attributes?.scrollbar);
|
|
48
|
+
template_u1.setProperties(element_1aruxaj5, attributes.scrollbar);
|
|
49
|
+
template_u1.setList(element_1aruxaj5, 'class', () => state.height >= 100 && 'scrollbar--hidden');
|
|
50
|
+
template_u1.setList(element_1aruxaj5, 'style', () => `
|
|
51
51
|
--translate: translate3d(0, ${state.translate}%, 0);
|
|
52
52
|
--height: ${state.height}%;
|
|
53
|
-
|
|
54
|
-
return
|
|
53
|
+
`);
|
|
54
|
+
return root_1aruxaj1;
|
|
55
55
|
})();
|
|
56
56
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { Attributes, Renderable } from '@esportsplus/template';
|
|
2
|
-
import { Attributes as Attr } from '
|
|
1
|
+
import { type Attributes, type Renderable } from '@esportsplus/template';
|
|
2
|
+
import { Attributes as Attr } from '../scrollbar/index.js';
|
|
3
3
|
import './scss/index.scss';
|
|
4
4
|
type A = {
|
|
5
5
|
arrow?: Attributes;
|
|
@@ -1,45 +1,45 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as
|
|
1
|
+
import * as template_u1 from '@esportsplus/template';
|
|
2
|
+
import * as reactivity_u0 from '@esportsplus/reactivity';
|
|
3
3
|
import { EMPTY_ARRAY, omit, toArray } from '@esportsplus/utilities';
|
|
4
|
-
import form from '
|
|
5
|
-
import root from '
|
|
6
|
-
import scrollbar from '
|
|
7
|
-
import template from '
|
|
4
|
+
import form from '../form/index.js';
|
|
5
|
+
import root from '../root/index.js';
|
|
6
|
+
import scrollbar from '../scrollbar/index.js';
|
|
7
|
+
import template from '../template/index.js';
|
|
8
8
|
import './scss/index.scss';
|
|
9
|
-
const
|
|
10
|
-
const
|
|
11
|
-
class
|
|
12
|
-
#active = this[
|
|
13
|
-
#error = this[
|
|
14
|
-
#render = this[
|
|
9
|
+
const template_167mg1f2 = template_u1.template(`<div class='link select-option ' data-key='' >`);
|
|
10
|
+
const template_167mg1f5 = template_u1.template(`<div class='select tooltip '><!--$--><div class='select-arrow' ></div><input class='select-tag' />`);
|
|
11
|
+
class ReactiveObject_167mg1f0 extends reactivity_u0.ReactiveObject {
|
|
12
|
+
#active = this[reactivity_u0.SIGNAL](false);
|
|
13
|
+
#error = this[reactivity_u0.SIGNAL]('');
|
|
14
|
+
#render = this[reactivity_u0.SIGNAL](false);
|
|
15
15
|
#selected;
|
|
16
16
|
constructor(_p0) {
|
|
17
17
|
super(null);
|
|
18
|
-
this.#selected = this[
|
|
18
|
+
this.#selected = this[reactivity_u0.SIGNAL](_p0);
|
|
19
19
|
}
|
|
20
20
|
get active() {
|
|
21
|
-
return
|
|
21
|
+
return reactivity_u0.read(this.#active);
|
|
22
22
|
}
|
|
23
23
|
set active(_v0) {
|
|
24
|
-
|
|
24
|
+
reactivity_u0.write(this.#active, _v0);
|
|
25
25
|
}
|
|
26
26
|
get error() {
|
|
27
|
-
return
|
|
27
|
+
return reactivity_u0.read(this.#error);
|
|
28
28
|
}
|
|
29
29
|
set error(_v1) {
|
|
30
|
-
|
|
30
|
+
reactivity_u0.write(this.#error, _v1);
|
|
31
31
|
}
|
|
32
32
|
get render() {
|
|
33
|
-
return
|
|
33
|
+
return reactivity_u0.read(this.#render);
|
|
34
34
|
}
|
|
35
35
|
set render(_v2) {
|
|
36
|
-
|
|
36
|
+
reactivity_u0.write(this.#render, _v2);
|
|
37
37
|
}
|
|
38
38
|
get selected() {
|
|
39
|
-
return
|
|
39
|
+
return reactivity_u0.read(this.#selected);
|
|
40
40
|
}
|
|
41
41
|
set selected(_v3) {
|
|
42
|
-
|
|
42
|
+
reactivity_u0.write(this.#selected, _v3);
|
|
43
43
|
}
|
|
44
44
|
}
|
|
45
45
|
const OMIT = [
|
|
@@ -78,19 +78,19 @@ function set(current, value) {
|
|
|
78
78
|
}
|
|
79
79
|
}
|
|
80
80
|
const select = template.factory(function (attributes, content) {
|
|
81
|
-
let { options, option } = attributes, state = attributes.state || new
|
|
81
|
+
let { options, option } = attributes, state = attributes.state || new ReactiveObject_167mg1f0(attributes.selected || Object.keys(options)[0]);
|
|
82
82
|
return (() => {
|
|
83
|
-
let
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
83
|
+
let root_167mg1f4 = template_167mg1f5(), element_167mg1f6 = root_167mg1f4.firstChild, element_167mg1f7 = element_167mg1f6.firstChild, element_167mg1f8 = element_167mg1f6.firstElementChild, element_167mg1f9 = element_167mg1f8.nextElementSibling;
|
|
84
|
+
template_u1.setList(element_167mg1f6, 'class', () => state.active && '--active');
|
|
85
|
+
template_u1.setProperties(element_167mg1f6, this?.attributes && omit(this.attributes, OMIT));
|
|
86
|
+
template_u1.setProperties(element_167mg1f6, omit(attributes, OMIT));
|
|
87
|
+
template_u1.delegate(element_167mg1f6, 'click', () => {
|
|
88
88
|
if (state.render) {
|
|
89
89
|
set(state, !state.active);
|
|
90
90
|
}
|
|
91
91
|
state.render = true;
|
|
92
92
|
});
|
|
93
|
-
new
|
|
93
|
+
new template_u1.EffectSlot(element_167mg1f7, content ? (() => content(state)) : (() => {
|
|
94
94
|
let selected = options[state.selected];
|
|
95
95
|
if (!selected) {
|
|
96
96
|
return '-';
|
|
@@ -100,17 +100,17 @@ const select = template.factory(function (attributes, content) {
|
|
|
100
100
|
}
|
|
101
101
|
return selected;
|
|
102
102
|
}));
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
new
|
|
103
|
+
template_u1.setProperties(element_167mg1f8, this?.attributes?.arrow);
|
|
104
|
+
template_u1.setProperties(element_167mg1f8, attributes.arrow);
|
|
105
|
+
template_u1.setProperty(element_167mg1f9, 'name', attributes.name);
|
|
106
|
+
template_u1.delegate(element_167mg1f9, 'click', () => { });
|
|
107
|
+
template_u1.onrender(element_167mg1f9, form.input.onrender(state));
|
|
108
|
+
template_u1.setProperty(element_167mg1f9, 'value', () => state.selected);
|
|
109
|
+
new template_u1.EffectSlot(element_167mg1f6, () => {
|
|
110
110
|
if (!state.render) {
|
|
111
111
|
return;
|
|
112
112
|
}
|
|
113
|
-
let keys = Object.keys(options), selected =
|
|
113
|
+
let keys = Object.keys(options), selected = reactivity_u0.reactive(Object.fromEntries(keys.map(key => [key, false])));
|
|
114
114
|
return sb({
|
|
115
115
|
...this?.attributes?.['tooltip-content'] || EMPTY_ARRAY,
|
|
116
116
|
...attributes['tooltip-content'],
|
|
@@ -154,17 +154,17 @@ const select = template.factory(function (attributes, content) {
|
|
|
154
154
|
content = content.content;
|
|
155
155
|
}
|
|
156
156
|
return (() => {
|
|
157
|
-
let
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
return
|
|
157
|
+
let root_167mg1f1 = template_167mg1f2(), element_167mg1f3 = root_167mg1f1.firstChild;
|
|
158
|
+
template_u1.setList(element_167mg1f3, 'class', () => selected[key] && '--active');
|
|
159
|
+
template_u1.setProperties(element_167mg1f3, this?.attributes?.option);
|
|
160
|
+
template_u1.setProperties(element_167mg1f3, option);
|
|
161
|
+
template_u1.setProperty(element_167mg1f3, 'data-key', key);
|
|
162
|
+
template_u1.slot(element_167mg1f3, content, 1);
|
|
163
|
+
return root_167mg1f1;
|
|
164
164
|
})();
|
|
165
165
|
}));
|
|
166
|
-
});
|
|
167
|
-
return
|
|
166
|
+
}, 2);
|
|
167
|
+
return root_167mg1f4;
|
|
168
168
|
})();
|
|
169
169
|
});
|
|
170
170
|
export default select;
|