godown 1.1.4 → 1.1.5
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 +35 -35
- package/effect/ov-effect.d.ts +3 -3
- package/effect/ov-effect.d.ts.map +1 -1
- package/effect/ov-effect.js +252 -228
- package/effect/ro-effect.d.ts +1 -1
- package/effect/ro-effect.d.ts.map +1 -1
- package/effect/ro-effect.js +51 -46
- package/effect/std.d.ts.map +1 -1
- package/effect/tw-effect.d.ts +1 -1
- package/effect/tw-effect.d.ts.map +1 -1
- package/effect/tw-effect.js +19 -18
- package/glob.d.ts.map +1 -1
- package/glob.js +18 -17
- package/group/avatar-group.d.ts +1 -1
- package/group/avatar-group.d.ts.map +1 -1
- package/group/avatar-group.js +29 -5
- package/group/button-group.d.ts +1 -1
- package/group/button-group.d.ts.map +1 -1
- package/group/button-group.js +53 -48
- package/group/details-group.d.ts +1 -1
- package/group/details-group.d.ts.map +1 -1
- package/group/details-group.js +5 -3
- package/group/std.d.ts.map +1 -1
- package/input-form/base-input.d.ts +2 -2
- package/input-form/base-input.d.ts.map +1 -1
- package/input-form/base-input.js +109 -106
- package/input-form/exp-input.d.ts +1 -1
- package/input-form/exp-input.d.ts.map +1 -1
- package/input-form/exp-input.js +155 -142
- package/input-form/label-input.d.ts +1 -1
- package/input-form/label-input.d.ts.map +1 -1
- package/input-form/label-input.js +88 -75
- package/input-form/search-input.d.ts +3 -3
- package/input-form/search-input.d.ts.map +1 -1
- package/input-form/search-input.js +171 -157
- package/input-form/select-input.d.ts +3 -3
- package/input-form/select-input.d.ts.map +1 -1
- package/input-form/select-input.js +128 -104
- package/input-form/sign-form.d.ts +7 -5
- package/input-form/sign-form.d.ts.map +1 -1
- package/input-form/sign-form.js +49 -44
- package/input-form/split-input.d.ts +3 -3
- package/input-form/split-input.d.ts.map +1 -1
- package/input-form/split-input.js +80 -72
- package/input-form/std.d.ts +1 -1
- package/input-form/std.d.ts.map +1 -1
- package/input-form/std.js +20 -17
- package/input-form/switch-input.d.ts +3 -3
- package/input-form/switch-input.d.ts.map +1 -1
- package/input-form/switch-input.js +118 -112
- package/items/alert-item.d.ts +1 -1
- package/items/alert-item.d.ts.map +1 -1
- package/items/alert-item.js +99 -98
- package/items/avatar-anchor.d.ts +2 -2
- package/items/avatar-anchor.d.ts.map +1 -1
- package/items/avatar-anchor.js +91 -89
- package/items/base-button.d.ts +1 -1
- package/items/base-button.d.ts.map +1 -1
- package/items/base-button.js +129 -126
- package/items/dialog-item.d.ts +1 -1
- package/items/dialog-item.d.ts.map +1 -1
- package/items/dialog-item.js +72 -71
- package/items/link-a.d.ts.map +1 -1
- package/items/link-a.js +23 -22
- package/items/load-track.d.ts +1 -1
- package/items/load-track.d.ts.map +1 -1
- package/items/load-track.js +45 -39
- package/items/std.d.ts.map +1 -1
- package/items/super-a.d.ts +2 -2
- package/items/super-a.d.ts.map +1 -1
- package/items/super-a.js +59 -48
- package/layout/div-line.d.ts +1 -1
- package/layout/div-line.d.ts.map +1 -1
- package/layout/div-line.js +35 -29
- package/layout/drag-box.d.ts +1 -1
- package/layout/drag-box.d.ts.map +1 -1
- package/layout/drag-box.js +10 -9
- package/layout/flex-flow.d.ts +2 -2
- package/layout/flex-flow.d.ts.map +1 -1
- package/layout/flex-flow.js +12 -7
- package/layout/nav-aside.d.ts +1 -1
- package/layout/nav-aside.d.ts.map +1 -1
- package/layout/nav-aside.js +32 -25
- package/layout/nav-layout.d.ts +1 -1
- package/layout/nav-layout.d.ts.map +1 -1
- package/layout/nav-layout.js +125 -104
- package/layout/std.d.ts.map +1 -1
- package/layout/std.js +6 -4
- package/package.json +47 -40
- package/react/effect.js +6 -6
- package/react/group.js +3 -3
- package/react/input-form.js +11 -11
- package/react/items.js +7 -7
- package/react/layout.js +5 -5
- package/react/view.js +5 -5
- package/view/details-expand.d.ts +1 -1
- package/view/details-expand.d.ts.map +1 -1
- package/view/details-expand.js +38 -33
- package/view/down-drop.d.ts +1 -1
- package/view/down-drop.d.ts.map +1 -1
- package/view/down-drop.js +34 -30
- package/view/menu-list.d.ts +1 -1
- package/view/menu-list.d.ts.map +1 -1
- package/view/menu-list.js +35 -30
- package/view/route-view.d.ts.map +1 -1
- package/view/route-view.js +9 -6
- package/view/scroll-x.d.ts +1 -1
- package/view/scroll-x.d.ts.map +1 -1
- package/view/scroll-x.js +32 -27
- package/view/std.d.ts.map +1 -1
- package/view/std.js +33 -33
- package/with.d.ts +10 -10
- package/with.d.ts.map +1 -1
- package/with.js +14 -15
- package/view/react/effect.d.ts +0 -10
- package/view/react/effect.d.ts.map +0 -1
- package/view/react/effect.js +0 -32
- package/view/react/group.d.ts +0 -5
- package/view/react/group.d.ts.map +0 -1
- package/view/react/group.js +0 -18
- package/view/react/index.d.ts +0 -7
- package/view/react/index.d.ts.map +0 -1
- package/view/react/index.js +0 -6
- package/view/react/input-form.d.ts +0 -33
- package/view/react/input-form.d.ts.map +0 -1
- package/view/react/input-form.js +0 -64
- package/view/react/items.d.ts +0 -9
- package/view/react/items.d.ts.map +0 -1
- package/view/react/items.js +0 -38
- package/view/react/layout.d.ts +0 -7
- package/view/react/layout.d.ts.map +0 -1
- package/view/react/layout.js +0 -28
- package/view/react/view.d.ts +0 -7
- package/view/react/view.d.ts.map +0 -1
- package/view/react/view.js +0 -28
@@ -4,8 +4,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
4
4
|
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
5
5
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
6
6
|
};
|
7
|
-
import { html, css, property, query, queryAll, define, cssvar } from
|
8
|
-
import STD from
|
7
|
+
import { html, css, property, query, queryAll, define, cssvar } from "../deps.js";
|
8
|
+
import STD from "./std.js";
|
9
9
|
let SplitInput = class SplitInput extends STD {
|
10
10
|
constructor() {
|
11
11
|
super(...arguments);
|
@@ -18,23 +18,27 @@ let SplitInput = class SplitInput extends STD {
|
|
18
18
|
this.currentValue = [];
|
19
19
|
}
|
20
20
|
render() {
|
21
|
-
return html `<main
|
22
|
-
|
23
|
-
|
24
|
-
|
21
|
+
return html `<main>
|
22
|
+
<div>
|
23
|
+
${Array(this.max)
|
24
|
+
.fill(0)
|
25
|
+
.map(() => html `<span><i></i></span>`)}
|
26
|
+
<input @input=${this._handleInput} value=" " />
|
27
|
+
</div>
|
28
|
+
</main>`;
|
25
29
|
}
|
26
30
|
firstUpdated() {
|
27
31
|
this._focusCheck();
|
28
|
-
this.currentValue = this.value.split(
|
29
|
-
this.current =
|
32
|
+
this.currentValue = this.value.split("").concat(Array(this.max - this.value.length).fill(null));
|
33
|
+
this.current = this.index < 0 || this.index > this.max ? this.currentValue.indexOf(null) : this.index;
|
30
34
|
this._spans.forEach((span, index) => {
|
31
|
-
span.addEventListener(
|
35
|
+
span.addEventListener("click", () => {
|
32
36
|
this.current = index;
|
33
37
|
this.focusAt();
|
34
38
|
this._input.focus();
|
35
39
|
});
|
36
40
|
});
|
37
|
-
document.addEventListener(
|
41
|
+
document.addEventListener("click", (e) => {
|
38
42
|
if (!this.contains(e.target)) {
|
39
43
|
this.blur();
|
40
44
|
}
|
@@ -44,7 +48,6 @@ let SplitInput = class SplitInput extends STD {
|
|
44
48
|
if (e.data === null) {
|
45
49
|
if (this.currentValue[this.current] !== null) {
|
46
50
|
this.currentValue[this.current] = null;
|
47
|
-
this.current = this.current;
|
48
51
|
}
|
49
52
|
else {
|
50
53
|
this.currentValue[this.current - 1] = null;
|
@@ -65,11 +68,11 @@ let SplitInput = class SplitInput extends STD {
|
|
65
68
|
}
|
66
69
|
this.focus();
|
67
70
|
this._spans.forEach((span, index) => {
|
68
|
-
span.querySelector(
|
71
|
+
span.querySelector("i").innerText = this.currentValue[index] || "";
|
69
72
|
});
|
70
|
-
this.value = this.currentValue.join(
|
71
|
-
this.dispatchEvent(new CustomEvent(
|
72
|
-
this.dispatchEvent(new CustomEvent(
|
73
|
+
this.value = this.currentValue.join("");
|
74
|
+
this.dispatchEvent(new CustomEvent("input", { detail: this.value, bubbles: true, composed: true }));
|
75
|
+
this.dispatchEvent(new CustomEvent("change", { detail: this.value, composed: true }));
|
73
76
|
}
|
74
77
|
focus() {
|
75
78
|
this.focusAt();
|
@@ -77,74 +80,79 @@ let SplitInput = class SplitInput extends STD {
|
|
77
80
|
focusAt(i = this.current) {
|
78
81
|
var _a;
|
79
82
|
this._spans.forEach((span) => {
|
80
|
-
span.classList.remove(
|
83
|
+
span.classList.remove("focus");
|
81
84
|
});
|
82
|
-
(_a = this._spans[i]) === null || _a === void 0 ? void 0 : _a.classList.add(
|
85
|
+
(_a = this._spans[i]) === null || _a === void 0 ? void 0 : _a.classList.add("focus");
|
83
86
|
this._input.value = " ";
|
84
87
|
}
|
85
88
|
blur(i = this.current) {
|
86
89
|
var _a;
|
87
|
-
(_a = this._spans[i]) === null || _a === void 0 ? void 0 : _a.classList.remove(
|
90
|
+
(_a = this._spans[i]) === null || _a === void 0 ? void 0 : _a.classList.remove("focus");
|
88
91
|
this._input.blur();
|
89
92
|
}
|
90
93
|
reset() {
|
91
94
|
this.currentValue = Array(this.max).fill(null);
|
92
95
|
this.current = 0;
|
93
96
|
this._spans.forEach((span) => {
|
94
|
-
span.querySelector(
|
97
|
+
span.querySelector("i").innerText = "";
|
95
98
|
});
|
96
|
-
this.value =
|
97
|
-
this.dispatchEvent(new CustomEvent(
|
99
|
+
this.value = "";
|
100
|
+
this.dispatchEvent(new CustomEvent("change", { detail: this.value }));
|
98
101
|
}
|
99
102
|
};
|
100
|
-
SplitInput.styles = [
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
|
147
|
-
|
103
|
+
SplitInput.styles = [
|
104
|
+
STD.styles,
|
105
|
+
css `
|
106
|
+
:host {
|
107
|
+
display: inline-block;
|
108
|
+
width: fit-content;
|
109
|
+
}
|
110
|
+
main {
|
111
|
+
display: flex;
|
112
|
+
}
|
113
|
+
* {
|
114
|
+
font-size: 1em;
|
115
|
+
}
|
116
|
+
div {
|
117
|
+
vertical-align: top;
|
118
|
+
position: relative;
|
119
|
+
display: inline-flex;
|
120
|
+
font-size: 116%;
|
121
|
+
}
|
122
|
+
span {
|
123
|
+
box-sizing: content-box;
|
124
|
+
vertical-align: top;
|
125
|
+
display: inline-flex;
|
126
|
+
width: 1.0275em;
|
127
|
+
padding: 0.1em;
|
128
|
+
height: 1.0275em;
|
129
|
+
pointer-events: all;
|
130
|
+
}
|
131
|
+
i {
|
132
|
+
height: inherit;
|
133
|
+
width: 100%;
|
134
|
+
z-index: 1;
|
135
|
+
background-color: var(${cssvar}--input-false);
|
136
|
+
font-style: normal;
|
137
|
+
text-align: center;
|
138
|
+
font-size: 80%;
|
139
|
+
line-height: 1.09;
|
140
|
+
}
|
141
|
+
input {
|
142
|
+
border: 0;
|
143
|
+
opacity: 0;
|
144
|
+
left: 0;
|
145
|
+
position: absolute;
|
146
|
+
background-color: tan;
|
147
|
+
right: 0;
|
148
|
+
top: 0;
|
149
|
+
bottom: 0;
|
150
|
+
}
|
151
|
+
.focus i {
|
152
|
+
outline: 0.12em solid var(${cssvar}--input-true);
|
153
|
+
}
|
154
|
+
`,
|
155
|
+
];
|
148
156
|
__decorate([
|
149
157
|
property()
|
150
158
|
], SplitInput.prototype, "name", void 0);
|
@@ -161,13 +169,13 @@ __decorate([
|
|
161
169
|
property({ type: Boolean })
|
162
170
|
], SplitInput.prototype, "autofocus", void 0);
|
163
171
|
__decorate([
|
164
|
-
query(
|
172
|
+
query("input")
|
165
173
|
], SplitInput.prototype, "_input", void 0);
|
166
174
|
__decorate([
|
167
|
-
queryAll(
|
175
|
+
queryAll("span")
|
168
176
|
], SplitInput.prototype, "_spans", void 0);
|
169
177
|
SplitInput = __decorate([
|
170
|
-
define(
|
178
|
+
define("split-input")
|
171
179
|
], SplitInput);
|
172
180
|
export { SplitInput };
|
173
181
|
export default SplitInput;
|
package/input-form/std.d.ts
CHANGED
@@ -7,7 +7,7 @@ export default class InputFormSTD extends GLOBSTD {
|
|
7
7
|
compositing: boolean;
|
8
8
|
autofocus: boolean;
|
9
9
|
static styles: import("@lit/reactive-element/css-tag.js").CSSResultGroup[];
|
10
|
-
namevalue(): any
|
10
|
+
namevalue(): [string, any];
|
11
11
|
reset(): void;
|
12
12
|
_handleInput(e: any): void;
|
13
13
|
_handleChange(): void;
|
package/input-form/std.d.ts.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"std.d.ts","sourceRoot":"","sources":["../../src/input-form/std.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAe,MAAM,YAAY,CAAC;AAClD,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,OAAO;IAC/C,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,GAAG,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,gBAAgB,CAAC;IACzB,WAAW,EAAE,OAAO,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,MAAM,
|
1
|
+
{"version":3,"file":"std.d.ts","sourceRoot":"","sources":["../../src/input-form/std.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAe,MAAM,YAAY,CAAC;AAClD,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,OAAO;IAC/C,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,GAAG,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,gBAAgB,CAAC;IACzB,WAAW,EAAE,OAAO,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,MAAM,8DAmBX;IACF,SAAS,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC;IAG1B,KAAK;IAIL,YAAY,CAAC,CAAC,EAAE,GAAG;IAOnB,aAAa;IAGb,iBAAiB;IAKjB,iBAAiB;IASjB,WAAW;IAKX,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY;IAG5B,YAAY;CAIb"}
|
package/input-form/std.js
CHANGED
@@ -49,20 +49,23 @@ export default class InputFormSTD extends GLOBSTD {
|
|
49
49
|
this._compositionCheck();
|
50
50
|
}
|
51
51
|
}
|
52
|
-
InputFormSTD.styles = [
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
}
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
}
|
68
|
-
|
52
|
+
InputFormSTD.styles = [
|
53
|
+
GLOBSTD.styles,
|
54
|
+
css `
|
55
|
+
:host {
|
56
|
+
${cssvar}--text:rgb(240 240 240);
|
57
|
+
${cssvar}--input-outline: rgb(25 130 180);
|
58
|
+
${cssvar}--input-outline-focus: rgb(29 155 180);
|
59
|
+
${cssvar}--input-background: rgb(24 24 24);
|
60
|
+
${cssvar}--input-background-hover: rgb(42 42 42);
|
61
|
+
${cssvar}--input-control:rgb(244 244 244);
|
62
|
+
${cssvar}--input-true: rgb(47 129 237);
|
63
|
+
${cssvar}--input-false: rgb(204 204 204);
|
64
|
+
${cssvar}--input-width: 10.6rem;
|
65
|
+
}
|
66
|
+
::-webkit-calendar-picker-indicator {
|
67
|
+
background-color: var(${cssvar}--input-true);
|
68
|
+
border-radius: 0.1rem;
|
69
|
+
}
|
70
|
+
`,
|
71
|
+
];
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import STD from
|
1
|
+
import STD from "./std.js";
|
2
2
|
export declare class SwitchInput extends STD {
|
3
3
|
static styles: (import("lit").CSSResult | import("@lit/reactive-element/css-tag.js").CSSResultGroup[])[];
|
4
4
|
checked: boolean;
|
@@ -8,11 +8,11 @@ export declare class SwitchInput extends STD {
|
|
8
8
|
name: string;
|
9
9
|
value: string;
|
10
10
|
_input: HTMLInputElement;
|
11
|
-
render(): import("lit").TemplateResult<1>;
|
11
|
+
render(): import("lit-html").TemplateResult<1>;
|
12
12
|
reset(): void;
|
13
13
|
connectedCallback(): void;
|
14
14
|
_handleChange(): void;
|
15
|
-
namevalue():
|
15
|
+
namevalue(): [string, boolean];
|
16
16
|
}
|
17
17
|
export default SwitchInput;
|
18
18
|
declare global {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"switch-input.d.ts","sourceRoot":"","sources":["../../src/input-form/switch-input.ts"],"names":[],"mappings":"AACA,OAAO,GAAG,MAAM,UAAU,CAAC;AAC3B,qBACa,WAAY,SAAQ,GAAG;IAClC,MAAM,CAAC,MAAM,
|
1
|
+
{"version":3,"file":"switch-input.d.ts","sourceRoot":"","sources":["../../src/input-form/switch-input.ts"],"names":[],"mappings":"AACA,OAAO,GAAG,MAAM,UAAU,CAAC;AAC3B,qBACa,WAAY,SAAQ,GAAG;IAClC,MAAM,CAAC,MAAM,4FAwGX;IAC2B,OAAO,UAAS;IAChB,QAAQ,UAAS;IAClC,IAAI,EAAE,KAAK,GAAG,MAAM,CAAU;IAC9B,GAAG,SAAW;IACd,IAAI,SAAc;IAClB,KAAK,SAAQ;IACT,MAAM,EAAE,gBAAgB,CAAC;IACzC,MAAM;IAUN,KAAK;IAIL,iBAAiB;IAQjB,aAAa;IAKb,SAAS,IAAI,CAAC,MAAM,EAAE,OAAO,CAAC;CAG/B;AACD,eAAe,WAAW,CAAC;AAC3B,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF"}
|
@@ -4,8 +4,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
4
4
|
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
5
5
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
6
6
|
};
|
7
|
-
import { html, css, property, query, define, cssvar } from
|
8
|
-
import STD from
|
7
|
+
import { html, css, property, query, define, cssvar } from "../deps.js";
|
8
|
+
import STD from "./std.js";
|
9
9
|
let SwitchInput = class SwitchInput extends STD {
|
10
10
|
constructor() {
|
11
11
|
super(...arguments);
|
@@ -17,13 +17,14 @@ let SwitchInput = class SwitchInput extends STD {
|
|
17
17
|
this.value = "on";
|
18
18
|
}
|
19
19
|
render() {
|
20
|
-
return html `<span class=${this.base}>
|
21
|
-
<input @change=${this._handleChange} ?disabled=${this.disabled} ?checked=${this.checked} name=${this.name} value=${this.value} type="checkbox"
|
22
|
-
<aside>
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
</aside
|
20
|
+
return html `<span class=${this.base}>
|
21
|
+
<input @change=${this._handleChange} ?disabled=${this.disabled} ?checked=${this.checked} name=${this.name} value=${this.value} type="checkbox" />
|
22
|
+
<aside>
|
23
|
+
<div class="false"><slot name="false"></slot></div>
|
24
|
+
<div class="always"><slot></slot><slot name="always"></slot></div>
|
25
|
+
<div class="true"><slot name="true"></slot></div>
|
26
|
+
</aside>
|
27
|
+
</span>`;
|
27
28
|
}
|
28
29
|
reset() {
|
29
30
|
this.checked = this.def === "true";
|
@@ -40,113 +41,118 @@ let SwitchInput = class SwitchInput extends STD {
|
|
40
41
|
}
|
41
42
|
_handleChange() {
|
42
43
|
this.checked = this._input.checked;
|
43
|
-
this.dispatchEvent(new CustomEvent(
|
44
|
-
this.dispatchEvent(new CustomEvent(
|
44
|
+
this.dispatchEvent(new CustomEvent("input", { detail: this.checked, bubbles: true, composed: true }));
|
45
|
+
this.dispatchEvent(new CustomEvent("change", { detail: this.checked, composed: true }));
|
45
46
|
}
|
46
47
|
namevalue() {
|
47
48
|
return [this.name, this.checked];
|
48
49
|
}
|
49
50
|
};
|
50
|
-
SwitchInput.styles = [
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
|
51
|
+
SwitchInput.styles = [
|
52
|
+
STD.styles,
|
53
|
+
css `
|
54
|
+
:host {
|
55
|
+
width: 3em;
|
56
|
+
height: 1.5em;
|
57
|
+
}
|
58
|
+
:host,
|
59
|
+
span {
|
60
|
+
display: inline-flex;
|
61
|
+
font-size: inherit;
|
62
|
+
position: relative;
|
63
|
+
align-items: center;
|
64
|
+
border-radius: inherit;
|
65
|
+
}
|
66
|
+
span {
|
67
|
+
width: inherit;
|
68
|
+
height: inherit;
|
69
|
+
}
|
70
|
+
input {
|
71
|
+
width: inherit;
|
72
|
+
height: inherit;
|
73
|
+
margin: 0;
|
74
|
+
outline: none;
|
75
|
+
appearance: none;
|
76
|
+
-webkit-appearance: none;
|
77
|
+
-moz-appearance: none;
|
78
|
+
position: relative;
|
79
|
+
font-size: inherit;
|
80
|
+
background-color: var(${cssvar}--input-false);
|
81
|
+
border-radius: inherit;
|
82
|
+
transition: all 0.3s;
|
83
|
+
}
|
84
|
+
aside {
|
85
|
+
pointer-events: none;
|
86
|
+
transition: 0.3s;
|
87
|
+
display: inline-flex;
|
88
|
+
align-items: center;
|
89
|
+
justify-content: center;
|
90
|
+
position: absolute;
|
91
|
+
font-size: inherit;
|
92
|
+
overflow: hidden;
|
93
|
+
border-radius: inherit;
|
94
|
+
}
|
95
|
+
aside div {
|
96
|
+
height: 100%;
|
97
|
+
}
|
98
|
+
input[disabled] ~ aside {
|
99
|
+
filter: brightness(0.87);
|
100
|
+
}
|
101
|
+
.rect div.always {
|
102
|
+
display: none;
|
103
|
+
}
|
104
|
+
.always {
|
105
|
+
position: absolute;
|
106
|
+
}
|
107
|
+
.rect aside {
|
108
|
+
height: 100%;
|
109
|
+
width: 100%;
|
110
|
+
left: 0;
|
111
|
+
}
|
112
|
+
.rect .true,
|
113
|
+
.rect .false {
|
114
|
+
width: 50%;
|
115
|
+
text-align: center;
|
116
|
+
transition: all 0.3s;
|
117
|
+
}
|
118
|
+
.rect input:checked ~ aside div.true,
|
119
|
+
.rect .false {
|
120
|
+
background-color: var(${cssvar}--input-true);
|
121
|
+
}
|
122
|
+
.rect input:checked ~ aside div.false,
|
123
|
+
.rect .true {
|
124
|
+
background-color: var(${cssvar}--input-false);
|
125
|
+
}
|
126
|
+
.fat aside {
|
127
|
+
width: 1.2em;
|
128
|
+
height: 1.2em;
|
129
|
+
border-radius: 50%;
|
130
|
+
background-color: var(${cssvar}--input-control);
|
131
|
+
transition: 0.3s;
|
132
|
+
left: 0.15em;
|
133
|
+
top: 0.15em;
|
134
|
+
bottom: 0.15em;
|
135
|
+
}
|
136
|
+
.fat {
|
137
|
+
border-radius: 0.75em;
|
138
|
+
}
|
139
|
+
.fat input:checked {
|
140
|
+
background-color: var(${cssvar}--input-true);
|
141
|
+
}
|
142
|
+
.fat input:checked ~ aside {
|
143
|
+
left: calc(100% - 0.15em - 1.2em);
|
144
|
+
right: 0.15em;
|
145
|
+
}
|
146
|
+
.fat input:checked ~ aside div.true,
|
147
|
+
.fat div.false {
|
148
|
+
display: block;
|
149
|
+
}
|
150
|
+
.fat input:checked ~ aside div.false,
|
151
|
+
.fat div.true {
|
152
|
+
display: none;
|
153
|
+
}
|
154
|
+
`,
|
155
|
+
];
|
150
156
|
__decorate([
|
151
157
|
property({ type: Boolean })
|
152
158
|
], SwitchInput.prototype, "checked", void 0);
|
@@ -166,7 +172,7 @@ __decorate([
|
|
166
172
|
property()
|
167
173
|
], SwitchInput.prototype, "value", void 0);
|
168
174
|
__decorate([
|
169
|
-
query(
|
175
|
+
query("input")
|
170
176
|
], SwitchInput.prototype, "_input", void 0);
|
171
177
|
SwitchInput = __decorate([
|
172
178
|
define("switch-input")
|
package/items/alert-item.d.ts
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"alert-item.d.ts","sourceRoot":"","sources":["../../src/items/alert-item.ts"],"names":[],"mappings":"AACA,OAAO,GAAG,MAAM,UAAU,CAAC;AAC3B,qBACa,SAAU,SAAQ,GAAG;IAChC,MAAM,CAAC,MAAM,
|
1
|
+
{"version":3,"file":"alert-item.d.ts","sourceRoot":"","sources":["../../src/items/alert-item.ts"],"names":[],"mappings":"AACA,OAAO,GAAG,MAAM,UAAU,CAAC;AAC3B,qBACa,SAAU,SAAQ,GAAG;IAChC,MAAM,CAAC,MAAM,0BAsFX;IACU,IAAI,EAAE,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAU;IAClD,SAAS,SAAQ;IACjC,KAAK,SAAM;IACX,OAAO,SAAM;IACzB,MAAM;IAeN,KAAK;CAMN;AACD,eAAe,SAAS,CAAC;AACzB,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,SAAS,CAAC;KACzB;CACF"}
|