godown 2.6.0 → 2.6.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/lib/event-collection.d.ts +1 -1
- package/package.json +4 -4
- package/react/index.d.ts +0 -1
- package/react/index.d.ts.map +1 -1
- package/react/index.js +0 -3
- package/react/index.js.map +1 -1
- package/web-components/a/avatar-a.js +40 -40
- package/web-components/a/avatar-a.js.map +1 -1
- package/web-components/a/super-a.js +22 -22
- package/web-components/a/super-a.js.map +1 -1
- package/web-components/button/base-button.js +86 -86
- package/web-components/button/base-button.js.map +1 -1
- package/web-components/carousel/carousel-slider.d.ts +1 -1
- package/web-components/carousel/carousel-slider.d.ts.map +1 -1
- package/web-components/carousel/carousel-slider.js +70 -70
- package/web-components/carousel/carousel-slider.js.map +1 -1
- package/web-components/form/base-form.js +15 -15
- package/web-components/form/base-form.js.map +1 -1
- package/web-components/group/avatar-group.js +13 -13
- package/web-components/group/avatar-group.js.map +1 -1
- package/web-components/group/details-group.js +7 -7
- package/web-components/group/details-group.js.map +1 -1
- package/web-components/group/tab-group.js +45 -45
- package/web-components/group/tab-group.js.map +1 -1
- package/web-components/index.d.ts +0 -1
- package/web-components/index.d.ts.map +1 -1
- package/web-components/index.js +0 -1
- package/web-components/index.js.map +1 -1
- package/web-components/input/base-input.js +73 -73
- package/web-components/input/base-input.js.map +1 -1
- package/web-components/input/input.js +15 -15
- package/web-components/input/input.js.map +1 -1
- package/web-components/input/label-input.js +49 -49
- package/web-components/input/label-input.js.map +1 -1
- package/web-components/input/search-input.js +53 -53
- package/web-components/input/search-input.js.map +1 -1
- package/web-components/input/select-input.js +88 -88
- package/web-components/input/select-input.js.map +1 -1
- package/web-components/input/split-input.js +51 -51
- package/web-components/input/split-input.js.map +1 -1
- package/web-components/input/switch-input.js +36 -36
- package/web-components/input/switch-input.js.map +1 -1
- package/web-components/items/alert-item.js +32 -33
- package/web-components/items/alert-item.js.map +1 -1
- package/web-components/items/card-item.js +54 -54
- package/web-components/items/card-item.js.map +1 -1
- package/web-components/items/drag-box.js +8 -8
- package/web-components/items/drag-box.js.map +1 -1
- package/web-components/items/time-bar.js +8 -9
- package/web-components/items/time-bar.js.map +1 -1
- package/web-components/layout/divider-line.js +11 -11
- package/web-components/layout/divider-line.js.map +1 -1
- package/web-components/layout/flex-flow.js +7 -7
- package/web-components/layout/flex-flow.js.map +1 -1
- package/web-components/layout/nav-aside.js +14 -14
- package/web-components/layout/nav-aside.js.map +1 -1
- package/web-components/layout/nav-layout.js +26 -26
- package/web-components/layout/nav-layout.js.map +1 -1
- package/web-components/loading/loading-progress.d.ts +1 -1
- package/web-components/loading/loading-progress.d.ts.map +1 -1
- package/web-components/loading/loading-progress.js +28 -28
- package/web-components/loading/loading-progress.js.map +1 -1
- package/web-components/loading/skeleton-screen.js +19 -19
- package/web-components/loading/skeleton-screen.js.map +1 -1
- package/web-components/open/open-details.d.ts.map +1 -1
- package/web-components/open/open-details.js +73 -22
- package/web-components/open/open-details.js.map +1 -1
- package/web-components/open/open-dialog.d.ts +5 -16
- package/web-components/open/open-dialog.d.ts.map +1 -1
- package/web-components/open/open-dialog.js +92 -102
- package/web-components/open/open-dialog.js.map +1 -1
- package/web-components/open/open-offset.d.ts +0 -1
- package/web-components/open/open-offset.d.ts.map +1 -1
- package/web-components/open/open-offset.js +50 -53
- package/web-components/open/open-offset.js.map +1 -1
- package/web-components/open/open-tooltip.d.ts +2 -2
- package/web-components/open/open-tooltip.d.ts.map +1 -1
- package/web-components/open/open-tooltip.js +14 -15
- package/web-components/open/open-tooltip.js.map +1 -1
- package/web-components/open/open.d.ts +3 -2
- package/web-components/open/open.d.ts.map +1 -1
- package/web-components/open/open.js +13 -59
- package/web-components/open/open.js.map +1 -1
- package/web-components/text/clip-text.js +8 -8
- package/web-components/text/clip-text.js.map +1 -1
- package/web-components/text/overbreath-text.js +17 -17
- package/web-components/text/overbreath-text.js.map +1 -1
- package/web-components/text/typewriter-text.js +32 -32
- package/web-components/text/typewriter-text.js.map +1 -1
- package/web-components/view/route-view.d.ts +2 -2
- package/web-components/view/route-view.js +7 -7
- package/web-components/view/route-view.js.map +1 -1
- package/web-components/view/scroll-x.js +29 -29
- package/web-components/view/scroll-x.js.map +1 -1
- package/web-components/view/wrap-view.d.ts +1 -1
- package/web-components/view/wrap-view.js +15 -15
- package/web-components/view/wrap-view.js.map +1 -1
- package/open-list.d.ts +0 -2
- package/open-list.d.ts.map +0 -1
- package/open-list.js +0 -2
- package/open-list.js.map +0 -1
- package/web-components/layout/index.d.ts +0 -5
- package/web-components/layout/index.d.ts.map +0 -1
- package/web-components/layout/index.js +0 -6
- package/web-components/layout/index.js.map +0 -1
- package/web-components/open/open-list.d.ts +0 -20
- package/web-components/open/open-list.d.ts.map +0 -1
- package/web-components/open/open-list.js +0 -71
- package/web-components/open/open-list.js.map +0 -1
@@ -32,94 +32,6 @@ let SelectInput = class SelectInput extends InputElement {
|
|
32
32
|
*/
|
33
33
|
this.text = [];
|
34
34
|
}
|
35
|
-
static { this.styles = [
|
36
|
-
InputElement.styles,
|
37
|
-
css `
|
38
|
-
:host {
|
39
|
-
background: var(${cssvarValues.input}--background);
|
40
|
-
margin: var(${cssvarValues.input}--outline-width);
|
41
|
-
outline: var(${cssvarValues.input}--outline-width) solid transparent;
|
42
|
-
height: var(${cssvarValues.input}--height);
|
43
|
-
width: var(${cssvarValues.input}--width);
|
44
|
-
border-radius: var(${cssvarValues.input}--radius);
|
45
|
-
}
|
46
|
-
|
47
|
-
:host([open]) {
|
48
|
-
outline-color: var(${cssvarValues.input}--outline-color);
|
49
|
-
}
|
50
|
-
|
51
|
-
input {
|
52
|
-
padding: 0 0 0 0.25em;
|
53
|
-
background: none;
|
54
|
-
cursor: inherit;
|
55
|
-
height: 100%;
|
56
|
-
width: 100%;
|
57
|
-
box-sizing: border-box;
|
58
|
-
border: inherit;
|
59
|
-
outline: none;
|
60
|
-
border-radius: inherit;
|
61
|
-
flex: 1;
|
62
|
-
}
|
63
|
-
|
64
|
-
div {
|
65
|
-
display: inline-flex;
|
66
|
-
position: relative;
|
67
|
-
width: 100%;
|
68
|
-
border-radius: inherit;
|
69
|
-
z-index: inherit;
|
70
|
-
}
|
71
|
-
|
72
|
-
label svg {
|
73
|
-
height: 100%;
|
74
|
-
}
|
75
|
-
|
76
|
-
aside {
|
77
|
-
margin-top: 1px;
|
78
|
-
position: absolute;
|
79
|
-
top: 100%;
|
80
|
-
width: 100%;
|
81
|
-
visibility: hidden;
|
82
|
-
z-index: 1;
|
83
|
-
border-radius: inherit;
|
84
|
-
}
|
85
|
-
|
86
|
-
section {
|
87
|
-
max-width: calc(100% - 1.2em);
|
88
|
-
height: 100%;
|
89
|
-
overflow: hidden;
|
90
|
-
pointer-events: none;
|
91
|
-
border-radius: inherit;
|
92
|
-
z-index: inherit;
|
93
|
-
}
|
94
|
-
|
95
|
-
i.selected-item {
|
96
|
-
background: var(${cssvarValues.input}--true);
|
97
|
-
border-radius: inherit;
|
98
|
-
height: 100%;
|
99
|
-
float: left;
|
100
|
-
display: inline-flex;
|
101
|
-
font-style: normal;
|
102
|
-
align-items: center;
|
103
|
-
padding-left: 0.1em;
|
104
|
-
margin-left: 0.065em;
|
105
|
-
}
|
106
|
-
|
107
|
-
i:first-child {
|
108
|
-
margin-left: 0;
|
109
|
-
}
|
110
|
-
|
111
|
-
i.selected-item svg {
|
112
|
-
width: 1em;
|
113
|
-
padding: 0 0.12em;
|
114
|
-
height: 0.8em;
|
115
|
-
pointer-events: all;
|
116
|
-
}
|
117
|
-
|
118
|
-
aside[open] {
|
119
|
-
visibility: visible;
|
120
|
-
}
|
121
|
-
`,
|
122
|
-
]; }
|
123
35
|
get assigned() {
|
124
36
|
return super.assigned;
|
125
37
|
}
|
@@ -309,6 +221,94 @@ let SelectInput = class SelectInput extends InputElement {
|
|
309
221
|
}
|
310
222
|
}
|
311
223
|
};
|
224
|
+
SelectInput.styles = [
|
225
|
+
InputElement.styles,
|
226
|
+
css `
|
227
|
+
:host {
|
228
|
+
background: var(${cssvarValues.input}--background);
|
229
|
+
margin: var(${cssvarValues.input}--outline-width);
|
230
|
+
outline: var(${cssvarValues.input}--outline-width) solid transparent;
|
231
|
+
height: var(${cssvarValues.input}--height);
|
232
|
+
width: var(${cssvarValues.input}--width);
|
233
|
+
border-radius: var(${cssvarValues.input}--radius);
|
234
|
+
}
|
235
|
+
|
236
|
+
:host([open]) {
|
237
|
+
outline-color: var(${cssvarValues.input}--outline-color);
|
238
|
+
}
|
239
|
+
|
240
|
+
input {
|
241
|
+
padding: 0 0 0 0.25em;
|
242
|
+
background: none;
|
243
|
+
cursor: inherit;
|
244
|
+
height: 100%;
|
245
|
+
width: 100%;
|
246
|
+
box-sizing: border-box;
|
247
|
+
border: inherit;
|
248
|
+
outline: none;
|
249
|
+
border-radius: inherit;
|
250
|
+
flex: 1;
|
251
|
+
}
|
252
|
+
|
253
|
+
div {
|
254
|
+
display: inline-flex;
|
255
|
+
position: relative;
|
256
|
+
width: 100%;
|
257
|
+
border-radius: inherit;
|
258
|
+
z-index: inherit;
|
259
|
+
}
|
260
|
+
|
261
|
+
label svg {
|
262
|
+
height: 100%;
|
263
|
+
}
|
264
|
+
|
265
|
+
aside {
|
266
|
+
margin-top: 1px;
|
267
|
+
position: absolute;
|
268
|
+
top: 100%;
|
269
|
+
width: 100%;
|
270
|
+
visibility: hidden;
|
271
|
+
z-index: 1;
|
272
|
+
border-radius: inherit;
|
273
|
+
}
|
274
|
+
|
275
|
+
section {
|
276
|
+
max-width: calc(100% - 1.2em);
|
277
|
+
height: 100%;
|
278
|
+
overflow: hidden;
|
279
|
+
pointer-events: none;
|
280
|
+
border-radius: inherit;
|
281
|
+
z-index: inherit;
|
282
|
+
}
|
283
|
+
|
284
|
+
i.selected-item {
|
285
|
+
background: var(${cssvarValues.input}--true);
|
286
|
+
border-radius: inherit;
|
287
|
+
height: 100%;
|
288
|
+
float: left;
|
289
|
+
display: inline-flex;
|
290
|
+
font-style: normal;
|
291
|
+
align-items: center;
|
292
|
+
padding-left: 0.1em;
|
293
|
+
margin-left: 0.065em;
|
294
|
+
}
|
295
|
+
|
296
|
+
i:first-child {
|
297
|
+
margin-left: 0;
|
298
|
+
}
|
299
|
+
|
300
|
+
i.selected-item svg {
|
301
|
+
width: 1em;
|
302
|
+
padding: 0 0.12em;
|
303
|
+
height: 0.8em;
|
304
|
+
pointer-events: all;
|
305
|
+
}
|
306
|
+
|
307
|
+
aside[open] {
|
308
|
+
visibility: visible;
|
309
|
+
}
|
310
|
+
`,
|
311
|
+
];
|
312
312
|
__decorate([
|
313
313
|
property({ type: Boolean, reflect: true })
|
314
314
|
], SelectInput.prototype, "open", void 0);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"select-input.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/input/select-input.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, type CSSResultGroup, html, property, query } from \"../../deps.js\";\nimport { ifValue } from \"../../lib/directives.js\";\nimport { htmlSlot, type HTMLTemplate, svgDelta, svgX } from \"../../lib/templates.js\";\nimport { cssvarValues, define, GodownElement } from \"../../root.js\";\nimport { InputElement } from \"./input.js\";\n\nconst defineName = \"select-input\";\n\n/**\n * SelectInput select matched elements.\n */\n@define(defineName)\nexport class SelectInput extends InputElement {\n /**\n * Open content.\n */\n @property({ type: Boolean, reflect: true }) open = false;\n /**\n * Only a single option is allowed.\n */\n @property({ type: Boolean, reflect: true }) only = false;\n /**\n * Selected values.\n */\n @property({ type: Array }) value = [];\n /**\n * Input name.\n */\n @property() name = \"select\";\n /**\n * Selected texts.\n */\n @property({ type: Array }) text: string[] = [];\n\n static styles = [\n InputElement.styles,\n css`\n :host {\n background: var(${cssvarValues.input}--background);\n margin: var(${cssvarValues.input}--outline-width);\n outline: var(${cssvarValues.input}--outline-width) solid transparent;\n height: var(${cssvarValues.input}--height);\n width: var(${cssvarValues.input}--width);\n border-radius: var(${cssvarValues.input}--radius);\n }\n\n :host([open]) {\n outline-color: var(${cssvarValues.input}--outline-color);\n }\n\n input {\n padding: 0 0 0 0.25em;\n background: none;\n cursor: inherit;\n height: 100%;\n width: 100%;\n box-sizing: border-box;\n border: inherit;\n outline: none;\n border-radius: inherit;\n flex: 1;\n }\n\n div {\n display: inline-flex;\n position: relative;\n width: 100%;\n border-radius: inherit;\n z-index: inherit;\n }\n\n label svg {\n height: 100%;\n }\n\n aside {\n margin-top: 1px;\n position: absolute;\n top: 100%;\n width: 100%;\n visibility: hidden;\n z-index: 1;\n border-radius: inherit;\n }\n\n section {\n max-width: calc(100% - 1.2em);\n height: 100%;\n overflow: hidden;\n pointer-events: none;\n border-radius: inherit;\n z-index: inherit;\n }\n\n i.selected-item {\n background: var(${cssvarValues.input}--true);\n border-radius: inherit;\n height: 100%;\n float: left;\n display: inline-flex;\n font-style: normal;\n align-items: center;\n padding-left: 0.1em;\n margin-left: 0.065em;\n }\n\n i:first-child {\n margin-left: 0;\n }\n\n i.selected-item svg {\n width: 1em;\n padding: 0 0.12em;\n height: 0.8em;\n pointer-events: all;\n }\n\n aside[open] {\n visibility: visible;\n }\n `,\n ] as CSSResultGroup;\n\n get assigned() {\n return super.assigned as any;\n }\n\n @query(\"input\") _input: HTMLInputElement;\n @query(\"aside\") _aside: HTMLInputElement;\n\n protected render(): HTMLTemplate {\n return html` <div>\n <section>${this.renderList()}</section>\n <input\n ?autofocus=\"${this.autofocus}\"\n id=\"input\"\n @focus=\"${() => {\n this.open = true;\n }}\"\n @input=\"${this._handleInput}\"\n placeholder=\"${this.pla}\"\n />\n <label for=\"input\"> ${ifValue(this.children.length > 0, svgDelta())}</label>\n <aside ?open=\"${this.open}\">${htmlSlot()}</aside>\n </div>`;\n }\n\n private renderList(): HTMLTemplate[] {\n const itemTemplates = [];\n if (this.value.length) {\n for (const i in this.value) {\n itemTemplates.push(\n html`<i class=\"selected-item\">\n ${this.text[i] || this.value[i]}\n <div\n @click=\"${() => {\n this.select(this.value[i]);\n }}\"\n >\n ${svgX()}\n </div>\n </i>`,\n );\n }\n }\n return itemTemplates;\n }\n\n protected _focusCheck() {\n if (this.autofocus) {\n this._input?.focus();\n this.open = true;\n }\n }\n\n focus(options?: FocusOptions) {\n this._input?.focus(options);\n this.open = true;\n }\n\n connectedCallback() {\n GodownElement.prototype.connectedCallback.call(this);\n }\n\n getOptionValue(option: Element) {\n return (option as HTMLOptionElement).value || option.getAttribute(\"value\");\n }\n\n protected firstUpdated() {\n const defs = this.def.split(\";\");\n defs\n .filter((i) => i.trim())\n .forEach((i) => {\n this.select(i);\n });\n this._focusCheck();\n const CLICK = \"click\";\n (this.assigned as HTMLElement[]).forEach((option: HTMLElement) => {\n if (this.getOptionValue(option)) {\n this.addEvent(option, CLICK, () => {\n this.select(this.getOptionValue(option), option.textContent);\n });\n } else if (option.children) {\n [...option.children].forEach((option: HTMLElement) => {\n this.addEvent(option, CLICK, () => {\n this.select(this.getOptionValue(option), option.textContent);\n });\n });\n }\n });\n this.addEvent(this, \"change\", () => {\n this.open = !this.only;\n });\n this.addEvent(document, CLICK, (e) => {\n if (!this.contains(e.target as Node)) {\n this.open = false;\n }\n });\n }\n\n select(value: string, text?: string) {\n if (text === undefined || text === null) {\n this.assigned.some((option: HTMLElement) => {\n const optionValue = this.getOptionValue(option);\n if (optionValue) {\n if (optionValue === value) {\n text = option.textContent;\n return true;\n }\n } else if (option.children) {\n return [...option.children].some((subOption) => {\n const subOptionValue = this.getOptionValue(subOption);\n if (subOptionValue === value) {\n text = subOption.textContent;\n return true;\n }\n return false;\n });\n }\n return false;\n });\n }\n if (this.value.includes(value)) {\n if (!this.only) {\n this.value = this.value.filter((v) => v !== value);\n this.text = this.text.filter((v) => v !== text);\n } else {\n this.value = [];\n this.text = [];\n }\n } else {\n if (!this.only) {\n this.value.push(value);\n this.text.push(text);\n } else {\n this.value = [value];\n this.text = [text];\n }\n }\n this._input.value = \"\";\n this.dispatchEvent(new CustomEvent(\"change\", { detail: this.namevalue() }));\n this.requestUpdate();\n }\n\n protected _handleInput() {\n const BLOCK = \"block\";\n const NONE = \"none\";\n let value = this._input.value.trim();\n if (!this.only && value.includes(\";\")) {\n value = value.split(\";\").pop().trim();\n }\n this.assigned.forEach((option) => {\n if (this.getOptionValue(option)) {\n option.style.display = BLOCK;\n }\n if (option.children) {\n option.style.display = BLOCK;\n [...option.children].forEach((subOption) => {\n subOption.style.display = BLOCK;\n });\n }\n });\n if (value) {\n this.assigned.forEach((option) => {\n const optionValue = this.getOptionValue(option);\n if (optionValue) {\n const isMatch = includesIgnoreCase(optionValue, value) || includesIgnoreCase(option.innerText, value);\n option.style.display = isMatch ? BLOCK : NONE;\n } else if (option.children) {\n [...option.children].forEach((subOption) => {\n const subOptionValue = this.getOptionValue(subOption);\n const isSubMatch = includesIgnoreCase(subOptionValue, value) || includesIgnoreCase(subOption.innerText, value);\n subOption.style.display = isSubMatch ? BLOCK : NONE;\n });\n if ([...option.children].filter((option) => option.style.display === BLOCK).length === 0) {\n option.style.display = NONE;\n }\n }\n });\n }\n this.dispatchEvent(new CustomEvent(\"input\", { detail: this.namevalue() }));\n }\n\n namevalue(): [string, any[]] | [string, any] {\n return [this.name, this.only ? this.value[0] : this.value];\n }\n\n reset() {\n this.value = [];\n this.text = [];\n this._input.value = \"\";\n if (this.def) {\n const defs = this.def.split(\";\");\n const defToSelect = this.only ? [defs[0]] : defs;\n defToSelect\n .filter((def) => def.trim())\n .forEach((def) => {\n this.select(def.trim(), null);\n });\n }\n }\n}\n\nexport default SelectInput;\n\nfunction includesIgnoreCase(a: string, b: string): boolean {\n return a.toLowerCase().includes(b.toLowerCase());\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"select-input\": SelectInput;\n }\n}\n"]}
|
1
|
+
{"version":3,"file":"select-input.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/input/select-input.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, type CSSResultGroup, html, property, query } from \"../../deps.js\";\nimport { ifValue } from \"../../lib/directives.js\";\nimport { htmlSlot, type HTMLTemplate, svgDelta, svgX } from \"../../lib/templates.js\";\nimport { cssvarValues, define, GodownElement } from \"../../root.js\";\nimport { InputElement } from \"./input.js\";\n\nconst defineName = \"select-input\";\n\n/**\n * SelectInput select matched elements.\n */\n@define(defineName)\nexport class SelectInput extends InputElement {\n /**\n * Open content.\n */\n @property({ type: Boolean, reflect: true }) open = false;\n /**\n * Only a single option is allowed.\n */\n @property({ type: Boolean, reflect: true }) only = false;\n /**\n * Selected values.\n */\n @property({ type: Array }) value = [];\n /**\n * Input name.\n */\n @property() name = \"select\";\n /**\n * Selected texts.\n */\n @property({ type: Array }) text: string[] = [];\n\n static styles = [\n InputElement.styles,\n css`\n :host {\n background: var(${cssvarValues.input}--background);\n margin: var(${cssvarValues.input}--outline-width);\n outline: var(${cssvarValues.input}--outline-width) solid transparent;\n height: var(${cssvarValues.input}--height);\n width: var(${cssvarValues.input}--width);\n border-radius: var(${cssvarValues.input}--radius);\n }\n\n :host([open]) {\n outline-color: var(${cssvarValues.input}--outline-color);\n }\n\n input {\n padding: 0 0 0 0.25em;\n background: none;\n cursor: inherit;\n height: 100%;\n width: 100%;\n box-sizing: border-box;\n border: inherit;\n outline: none;\n border-radius: inherit;\n flex: 1;\n }\n\n div {\n display: inline-flex;\n position: relative;\n width: 100%;\n border-radius: inherit;\n z-index: inherit;\n }\n\n label svg {\n height: 100%;\n }\n\n aside {\n margin-top: 1px;\n position: absolute;\n top: 100%;\n width: 100%;\n visibility: hidden;\n z-index: 1;\n border-radius: inherit;\n }\n\n section {\n max-width: calc(100% - 1.2em);\n height: 100%;\n overflow: hidden;\n pointer-events: none;\n border-radius: inherit;\n z-index: inherit;\n }\n\n i.selected-item {\n background: var(${cssvarValues.input}--true);\n border-radius: inherit;\n height: 100%;\n float: left;\n display: inline-flex;\n font-style: normal;\n align-items: center;\n padding-left: 0.1em;\n margin-left: 0.065em;\n }\n\n i:first-child {\n margin-left: 0;\n }\n\n i.selected-item svg {\n width: 1em;\n padding: 0 0.12em;\n height: 0.8em;\n pointer-events: all;\n }\n\n aside[open] {\n visibility: visible;\n }\n `,\n ] as CSSResultGroup;\n\n get assigned() {\n return super.assigned as any;\n }\n\n @query(\"input\") _input: HTMLInputElement;\n @query(\"aside\") _aside: HTMLInputElement;\n\n protected render(): HTMLTemplate {\n return html` <div>\n <section>${this.renderList()}</section>\n <input\n ?autofocus=\"${this.autofocus}\"\n id=\"input\"\n @focus=\"${() => {\n this.open = true;\n }}\"\n @input=\"${this._handleInput}\"\n placeholder=\"${this.pla}\"\n />\n <label for=\"input\"> ${ifValue(this.children.length > 0, svgDelta())}</label>\n <aside ?open=\"${this.open}\">${htmlSlot()}</aside>\n </div>`;\n }\n\n private renderList(): HTMLTemplate[] {\n const itemTemplates = [];\n if (this.value.length) {\n for (const i in this.value) {\n itemTemplates.push(\n html`<i class=\"selected-item\">\n ${this.text[i] || this.value[i]}\n <div\n @click=\"${() => {\n this.select(this.value[i]);\n }}\"\n >\n ${svgX()}\n </div>\n </i>`,\n );\n }\n }\n return itemTemplates;\n }\n\n protected _focusCheck() {\n if (this.autofocus) {\n this._input?.focus();\n this.open = true;\n }\n }\n\n focus(options?: FocusOptions) {\n this._input?.focus(options);\n this.open = true;\n }\n\n connectedCallback() {\n GodownElement.prototype.connectedCallback.call(this);\n }\n\n getOptionValue(option: Element) {\n return (option as HTMLOptionElement).value || option.getAttribute(\"value\");\n }\n\n protected firstUpdated() {\n const defs = this.def.split(\";\");\n defs\n .filter((i) => i.trim())\n .forEach((i) => {\n this.select(i);\n });\n this._focusCheck();\n const CLICK = \"click\";\n (this.assigned as HTMLElement[]).forEach((option: HTMLElement) => {\n if (this.getOptionValue(option)) {\n this.addEvent(option, CLICK, () => {\n this.select(this.getOptionValue(option), option.textContent);\n });\n } else if (option.children) {\n [...option.children].forEach((option: HTMLElement) => {\n this.addEvent(option, CLICK, () => {\n this.select(this.getOptionValue(option), option.textContent);\n });\n });\n }\n });\n this.addEvent(this, \"change\", () => {\n this.open = !this.only;\n });\n this.addEvent(document, CLICK, (e) => {\n if (!this.contains(e.target as Node)) {\n this.open = false;\n }\n });\n }\n\n select(value: string, text?: string) {\n if (text === undefined || text === null) {\n this.assigned.some((option: HTMLElement) => {\n const optionValue = this.getOptionValue(option);\n if (optionValue) {\n if (optionValue === value) {\n text = option.textContent;\n return true;\n }\n } else if (option.children) {\n return [...option.children].some((subOption) => {\n const subOptionValue = this.getOptionValue(subOption);\n if (subOptionValue === value) {\n text = subOption.textContent;\n return true;\n }\n return false;\n });\n }\n return false;\n });\n }\n if (this.value.includes(value)) {\n if (!this.only) {\n this.value = this.value.filter((v) => v !== value);\n this.text = this.text.filter((v) => v !== text);\n } else {\n this.value = [];\n this.text = [];\n }\n } else {\n if (!this.only) {\n this.value.push(value);\n this.text.push(text);\n } else {\n this.value = [value];\n this.text = [text];\n }\n }\n this._input.value = \"\";\n this.dispatchEvent(new CustomEvent(\"change\", { detail: this.namevalue() }));\n this.requestUpdate();\n }\n\n protected _handleInput() {\n const BLOCK = \"block\";\n const NONE = \"none\";\n let value = this._input.value.trim();\n if (!this.only && value.includes(\";\")) {\n value = value.split(\";\").pop().trim();\n }\n this.assigned.forEach((option) => {\n if (this.getOptionValue(option)) {\n option.style.display = BLOCK;\n }\n if (option.children) {\n option.style.display = BLOCK;\n [...option.children].forEach((subOption) => {\n subOption.style.display = BLOCK;\n });\n }\n });\n if (value) {\n this.assigned.forEach((option) => {\n const optionValue = this.getOptionValue(option);\n if (optionValue) {\n const isMatch = includesIgnoreCase(optionValue, value) || includesIgnoreCase(option.innerText, value);\n option.style.display = isMatch ? BLOCK : NONE;\n } else if (option.children) {\n [...option.children].forEach((subOption) => {\n const subOptionValue = this.getOptionValue(subOption);\n const isSubMatch = includesIgnoreCase(subOptionValue, value) || includesIgnoreCase(subOption.innerText, value);\n subOption.style.display = isSubMatch ? BLOCK : NONE;\n });\n if ([...option.children].filter((option) => option.style.display === BLOCK).length === 0) {\n option.style.display = NONE;\n }\n }\n });\n }\n this.dispatchEvent(new CustomEvent(\"input\", { detail: this.namevalue() }));\n }\n\n namevalue(): [string, any[]] | [string, any] {\n return [this.name, this.only ? this.value[0] : this.value];\n }\n\n reset() {\n this.value = [];\n this.text = [];\n this._input.value = \"\";\n if (this.def) {\n const defs = this.def.split(\";\");\n const defToSelect = this.only ? [defs[0]] : defs;\n defToSelect\n .filter((def) => def.trim())\n .forEach((def) => {\n this.select(def.trim(), null);\n });\n }\n }\n}\n\nexport default SelectInput;\n\nfunction includesIgnoreCase(a: string, b: string): boolean {\n return a.toLowerCase().includes(b.toLowerCase());\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"select-input\": SelectInput;\n }\n}\n"]}
|
@@ -22,57 +22,6 @@ let SplitInput = class SplitInput extends InputElement {
|
|
22
22
|
this.current = 0;
|
23
23
|
this.currentValue = [];
|
24
24
|
}
|
25
|
-
static { this.styles = [
|
26
|
-
InputElement.styles,
|
27
|
-
css `
|
28
|
-
:host {
|
29
|
-
${cssScope}--outline: .15em solid var( ${cssvarValues.input}--outline-color);
|
30
|
-
margin: var(${cssvarValues.input}--outline-width);
|
31
|
-
width: fit-content;
|
32
|
-
border-radius: 1px;
|
33
|
-
}
|
34
|
-
|
35
|
-
* {
|
36
|
-
font-size: 1em;
|
37
|
-
border-radius: inherit;
|
38
|
-
}
|
39
|
-
|
40
|
-
div {
|
41
|
-
vertical-align: top;
|
42
|
-
position: relative;
|
43
|
-
display: inline-flex;
|
44
|
-
gap: 0.25em;
|
45
|
-
}
|
46
|
-
|
47
|
-
span {
|
48
|
-
box-sizing: content-box;
|
49
|
-
vertical-align: top;
|
50
|
-
display: inline-flex;
|
51
|
-
width: 1.45em;
|
52
|
-
height: 1.45em;
|
53
|
-
pointer-events: all;
|
54
|
-
}
|
55
|
-
|
56
|
-
i {
|
57
|
-
height: inherit;
|
58
|
-
width: 100%;
|
59
|
-
z-index: 1;
|
60
|
-
background-color: var(${cssvarValues.input}--false);
|
61
|
-
text-align: center;
|
62
|
-
}
|
63
|
-
|
64
|
-
input {
|
65
|
-
position: absolute;
|
66
|
-
opacity: 0;
|
67
|
-
left: 0;
|
68
|
-
top: 0;
|
69
|
-
}
|
70
|
-
|
71
|
-
.focus i {
|
72
|
-
outline: var(${cssScope}--outline);
|
73
|
-
}
|
74
|
-
`,
|
75
|
-
]; }
|
76
25
|
render() {
|
77
26
|
return html `
|
78
27
|
<div>
|
@@ -153,6 +102,57 @@ let SplitInput = class SplitInput extends InputElement {
|
|
153
102
|
this.dispatchEvent(new CustomEvent("change", { detail: this.value }));
|
154
103
|
}
|
155
104
|
};
|
105
|
+
SplitInput.styles = [
|
106
|
+
InputElement.styles,
|
107
|
+
css `
|
108
|
+
:host {
|
109
|
+
${cssScope}--outline: .15em solid var( ${cssvarValues.input}--outline-color);
|
110
|
+
margin: var(${cssvarValues.input}--outline-width);
|
111
|
+
width: fit-content;
|
112
|
+
border-radius: 1px;
|
113
|
+
}
|
114
|
+
|
115
|
+
* {
|
116
|
+
font-size: 1em;
|
117
|
+
border-radius: inherit;
|
118
|
+
}
|
119
|
+
|
120
|
+
div {
|
121
|
+
vertical-align: top;
|
122
|
+
position: relative;
|
123
|
+
display: inline-flex;
|
124
|
+
gap: 0.25em;
|
125
|
+
}
|
126
|
+
|
127
|
+
span {
|
128
|
+
box-sizing: content-box;
|
129
|
+
vertical-align: top;
|
130
|
+
display: inline-flex;
|
131
|
+
width: 1.45em;
|
132
|
+
height: 1.45em;
|
133
|
+
pointer-events: all;
|
134
|
+
}
|
135
|
+
|
136
|
+
i {
|
137
|
+
height: inherit;
|
138
|
+
width: 100%;
|
139
|
+
z-index: 1;
|
140
|
+
background-color: var(${cssvarValues.input}--false);
|
141
|
+
text-align: center;
|
142
|
+
}
|
143
|
+
|
144
|
+
input {
|
145
|
+
position: absolute;
|
146
|
+
opacity: 0;
|
147
|
+
left: 0;
|
148
|
+
top: 0;
|
149
|
+
}
|
150
|
+
|
151
|
+
.focus i {
|
152
|
+
outline: var(${cssScope}--outline);
|
153
|
+
}
|
154
|
+
`,
|
155
|
+
];
|
156
156
|
__decorate([
|
157
157
|
property({ type: Number })
|
158
158
|
], SplitInput.prototype, "max", void 0);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"split-input.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/input/split-input.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAuB,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAE1F,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1C,MAAM,KAAK,GAAG,OAAO,CAAC;AAEtB,MAAM,UAAU,GAAG,aAAa,CAAC;AAEjC,MAAM,QAAQ,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;AAEzC;;GAEG;AAEI,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,YAAY;IAArC;;QACL;;WAEG;QACyB,QAAG,GAAG,CAAC,CAAC;QACpC;;WAEG;QACyB,UAAK,GAAG,CAAC,CAAC,CAAC;QAIvC,YAAO,GAAG,CAAC,CAAC;QACZ,iBAAY,GAAsB,EAAE,CAAC;IAwIvC,CAAC;
|
1
|
+
{"version":3,"file":"split-input.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/input/split-input.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, type CSSResultGroup, html, property, query, queryAll } from \"../../deps.js\";\nimport { type HTMLTemplate } from \"../../lib/templates.js\";\nimport { createScope, cssvarValues, define } from \"../../root.js\";\nimport { InputElement } from \"./input.js\";\n\nconst FOCUS = \"focus\";\n\nconst defineName = \"split-input\";\n\nconst cssScope = createScope(defineName);\n\n/**\n * SplitInput renders multiple inputs.\n */\n@define(defineName)\nexport class SplitInput extends InputElement {\n /**\n * The number of simulated input boxes.\n */\n @property({ type: Number }) max = 6;\n /**\n * Active index.\n */\n @property({ type: Number }) index = -1;\n\n @query(\"input\") _input: HTMLInputElement;\n @queryAll(\"span\") _spans: NodeListOf<HTMLSpanElement>;\n current = 0;\n currentValue: (string | null)[] = [];\n\n static styles = [\n InputElement.styles,\n css`\n :host {\n ${cssScope}--outline: .15em solid var( ${cssvarValues.input}--outline-color);\n margin: var(${cssvarValues.input}--outline-width);\n width: fit-content;\n border-radius: 1px;\n }\n\n * {\n font-size: 1em;\n border-radius: inherit;\n }\n\n div {\n vertical-align: top;\n position: relative;\n display: inline-flex;\n gap: 0.25em;\n }\n\n span {\n box-sizing: content-box;\n vertical-align: top;\n display: inline-flex;\n width: 1.45em;\n height: 1.45em;\n pointer-events: all;\n }\n\n i {\n height: inherit;\n width: 100%;\n z-index: 1;\n background-color: var(${cssvarValues.input}--false);\n text-align: center;\n }\n\n input {\n position: absolute;\n opacity: 0;\n left: 0;\n top: 0;\n }\n\n .focus i {\n outline: var(${cssScope}--outline);\n }\n `,\n ] as CSSResultGroup;\n\n protected render(): HTMLTemplate {\n return html`\n <div>\n ${Array(this.max)\n .fill(0)\n .map(() => html`<span><i></i></span>`)}\n <input @input=\"${this._handleInput}\" />\n </div>\n `;\n }\n\n protected firstUpdated() {\n this.currentValue = this.value.split(\"\").concat(Array(this.max - this.value.length).fill(null));\n this.current = this.index < 0 || this.index > this.max ? this.currentValue.indexOf(null) : this.index;\n this._spans.forEach((span, index) => {\n this.addEvent(span, \"click\", () => {\n this.current = index;\n this.focusAt();\n this._input.focus();\n });\n });\n this.addEvent(document, \"click\", (e) => {\n if (!this.contains(e.target as Node)) {\n this.blur();\n }\n });\n }\n\n protected _handleInput(e: InputEvent) {\n if (e.data === null) {\n if (this.currentValue[this.current] !== null) {\n this.currentValue[this.current] = null;\n } else {\n this.currentValue[this.current - 1] = null;\n this.current = this.current - 1 < 0 ? 0 : this.current - 1;\n }\n } else {\n this.currentValue[this.current] = e.data;\n if (this.current + 1 >= this.max) {\n this.current = this.currentValue.indexOf(null);\n if (this.current === -1) {\n this.blur();\n }\n } else {\n this.current += 1;\n }\n }\n this.focus();\n this._spans.forEach((span, index) => {\n span.querySelector(\"i\").innerText = this.currentValue[index] || \"\";\n });\n this.value = this.currentValue.join(\"\");\n this.dispatchEvent(new CustomEvent(\"input\", { detail: this.value, bubbles: true, composed: true }));\n this.dispatchEvent(new CustomEvent(\"change\", { detail: this.value, composed: true }));\n }\n\n focus() {\n this.focusAt();\n }\n\n focusAt(i = this.current) {\n this._spans.forEach((span) => {\n span.classList.remove(FOCUS);\n });\n this._spans[i]?.classList.add(FOCUS);\n this._input.value = \"\";\n }\n\n blur(i = this.current) {\n this._spans[i]?.classList.remove(FOCUS);\n this._input.blur();\n }\n\n reset() {\n this.currentValue = Array(this.max).fill(null);\n this.current = 0;\n this._spans.forEach((span) => {\n span.querySelector(\"i\").innerText = \"\";\n });\n this.value = \"\";\n this.dispatchEvent(new CustomEvent(\"change\", { detail: this.value }));\n }\n}\n\nexport default SplitInput;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"split-input\": SplitInput;\n }\n}\n"]}
|
@@ -38,9 +38,41 @@ let SwitchInput = class SwitchInput extends InputElement {
|
|
38
38
|
*/
|
39
39
|
this.value = "on";
|
40
40
|
}
|
41
|
-
|
42
|
-
|
43
|
-
|
41
|
+
render() {
|
42
|
+
return html `<span class="${this.base}">
|
43
|
+
<input @change="${this._handleChange}" ?disabled="${this.disabled}" ?checked="${this.checked}" name="${this.name}" type="checkbox" />
|
44
|
+
<aside>
|
45
|
+
<div class="false"><slot name="false"></slot></div>
|
46
|
+
<div class="always">${htmlSlot()}<slot name="always"></slot></div>
|
47
|
+
<div class="true"><slot name="true"></slot></div>
|
48
|
+
</aside>
|
49
|
+
</span>`;
|
50
|
+
}
|
51
|
+
reset() {
|
52
|
+
this.checked = this.def === "true";
|
53
|
+
this._input.checked = this.checked;
|
54
|
+
}
|
55
|
+
connectedCallback() {
|
56
|
+
super.connectedCallback();
|
57
|
+
if (this.checked) {
|
58
|
+
this.def = "true";
|
59
|
+
}
|
60
|
+
else if (this.def === "true") {
|
61
|
+
this.checked = true;
|
62
|
+
}
|
63
|
+
}
|
64
|
+
_handleChange() {
|
65
|
+
this.checked = this._input.checked;
|
66
|
+
this.dispatchEvent(new CustomEvent("input", { detail: this.checked, bubbles: true, composed: true }));
|
67
|
+
this.dispatchEvent(new CustomEvent("change", { detail: this.checked, composed: true }));
|
68
|
+
}
|
69
|
+
namevalue() {
|
70
|
+
return [this.name, this.checked];
|
71
|
+
}
|
72
|
+
};
|
73
|
+
SwitchInput.styles = [
|
74
|
+
InputElement.styles,
|
75
|
+
css `
|
44
76
|
:host {
|
45
77
|
${cssScope}--width: 3em;
|
46
78
|
${cssScope}--height: calc(var(${cssScope}--width) / 2);
|
@@ -162,39 +194,7 @@ let SwitchInput = class SwitchInput extends InputElement {
|
|
162
194
|
display: none;
|
163
195
|
}
|
164
196
|
`,
|
165
|
-
|
166
|
-
render() {
|
167
|
-
return html `<span class="${this.base}">
|
168
|
-
<input @change="${this._handleChange}" ?disabled="${this.disabled}" ?checked="${this.checked}" name="${this.name}" type="checkbox" />
|
169
|
-
<aside>
|
170
|
-
<div class="false"><slot name="false"></slot></div>
|
171
|
-
<div class="always">${htmlSlot()}<slot name="always"></slot></div>
|
172
|
-
<div class="true"><slot name="true"></slot></div>
|
173
|
-
</aside>
|
174
|
-
</span>`;
|
175
|
-
}
|
176
|
-
reset() {
|
177
|
-
this.checked = this.def === "true";
|
178
|
-
this._input.checked = this.checked;
|
179
|
-
}
|
180
|
-
connectedCallback() {
|
181
|
-
super.connectedCallback();
|
182
|
-
if (this.checked) {
|
183
|
-
this.def = "true";
|
184
|
-
}
|
185
|
-
else if (this.def === "true") {
|
186
|
-
this.checked = true;
|
187
|
-
}
|
188
|
-
}
|
189
|
-
_handleChange() {
|
190
|
-
this.checked = this._input.checked;
|
191
|
-
this.dispatchEvent(new CustomEvent("input", { detail: this.checked, bubbles: true, composed: true }));
|
192
|
-
this.dispatchEvent(new CustomEvent("change", { detail: this.checked, composed: true }));
|
193
|
-
}
|
194
|
-
namevalue() {
|
195
|
-
return [this.name, this.checked];
|
196
|
-
}
|
197
|
-
};
|
197
|
+
];
|
198
198
|
__decorate([
|
199
199
|
property()
|
200
200
|
], SwitchInput.prototype, "base", void 0);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"switch-input.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/input/switch-input.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAuB,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAChF,OAAO,EAAE,QAAQ,EAAqB,MAAM,wBAAwB,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1C,MAAM,UAAU,GAAG,cAAc,CAAC;AAElC,MAAM,QAAQ,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;AAEzC;;;;GAIG;AAEI,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,YAAY;IAAtC;;QACL;;WAEG;QACS,SAAI,GAAmB,MAAM,CAAC;QAC1C;;WAEG;QAC0B,YAAO,GAAG,KAAK,CAAC;QAC7C;;WAEG;QAC0B,aAAQ,GAAG,KAAK,CAAC;QAC9C;;WAEG;QACS,QAAG,GAAG,OAAO,CAAC;QAC1B;;WAEG;QACS,SAAI,GAAG,UAAU,CAAC;QAC9B;;WAEG;QACS,UAAK,GAAG,IAAI,CAAC;IAoK3B,CAAC;
|
1
|
+
{"version":3,"file":"switch-input.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/input/switch-input.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, type CSSResultGroup, html, property, query } from \"../../deps.js\";\nimport { htmlSlot, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { createScope, cssvarValues, define } from \"../../root.js\";\nimport { InputElement } from \"./input.js\";\n\nconst defineName = \"switch-input\";\n\nconst cssScope = createScope(defineName);\n\n/**\n * Switch renders a switch.\n *\n * Inspired by Steam.\n */\n@define(defineName)\nexport class SwitchInput extends InputElement {\n /**\n * Border style.\n */\n @property() base: \"fat\" | \"rect\" = \"rect\";\n /**\n * Whether this element is selected or not.\n */\n @property({ type: Boolean }) checked = false;\n /**\n * Whether this element is disabled or not.\n */\n @property({ type: Boolean }) disabled = false;\n /**\n * Parsed by JSON.parse to checked.\n */\n @property() def = \"false\";\n /**\n * Input name.\n */\n @property() name = \"checkbox\";\n /**\n * Input value.\n */\n @property() value = \"on\";\n\n @query(\"input\") _input: HTMLInputElement;\n\n static styles = [\n InputElement.styles,\n css`\n :host {\n ${cssScope}--width: 3em;\n ${cssScope}--height: calc(var(${cssScope}--width) / 2);\n width: var(${cssScope}--width);\n height: var(${cssScope}--height);\n }\n\n :host,\n span {\n display: inline-flex;\n font-size: inherit;\n position: relative;\n align-items: center;\n border-radius: inherit;\n }\n\n span {\n width: inherit;\n height: inherit;\n }\n\n input {\n width: inherit;\n height: inherit;\n margin: 0;\n outline: none;\n appearance: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n position: relative;\n font-size: inherit;\n background: var(${cssvarValues.input}--false);\n border-radius: inherit;\n transition: all 0.3s;\n }\n\n aside {\n pointer-events: none;\n transition: 0.3s;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n position: absolute;\n font-size: inherit;\n overflow: hidden;\n border-radius: inherit;\n }\n\n aside div {\n height: 100%;\n }\n\n input[disabled] ~ aside {\n filter: brightness(0.87);\n }\n\n .rect div.always {\n display: none;\n }\n\n .always {\n position: absolute;\n }\n\n .rect aside {\n height: 100%;\n width: 100%;\n left: 0;\n }\n\n .rect .true,\n .rect .false {\n width: 50%;\n text-align: center;\n transition: all 0.3s;\n }\n\n .rect input:checked ~ aside div.true,\n .rect .false {\n background-color: var(${cssvarValues.input}--true);\n }\n\n .rect input:checked ~ aside div.false,\n .rect .true {\n background: var(${cssvarValues.input}--false);\n }\n\n .fat aside {\n width: 1.2em;\n height: 1.2em;\n border-radius: 50%;\n background: var(${cssvarValues.input}--control);\n transition: 0.3s;\n left: 0.15em;\n top: 0.15em;\n bottom: 0.15em;\n }\n\n .fat {\n border-radius: 0.75em;\n }\n\n .fat input:checked {\n background: var(${cssvarValues.input}--true);\n }\n\n .fat input:checked ~ aside {\n left: calc(100% - 0.15em - 1.2em);\n right: 0.15em;\n }\n\n .fat input:checked ~ aside div.true,\n .fat div.false {\n display: block;\n }\n\n .fat input:checked ~ aside div.false,\n .fat div.true {\n display: none;\n }\n `,\n ] as CSSResultGroup;\n\n protected render(): HTMLTemplate {\n return html`<span class=\"${this.base}\">\n <input @change=\"${this._handleChange}\" ?disabled=\"${this.disabled}\" ?checked=\"${this.checked}\" name=\"${this.name}\" type=\"checkbox\" />\n <aside>\n <div class=\"false\"><slot name=\"false\"></slot></div>\n <div class=\"always\">${htmlSlot()}<slot name=\"always\"></slot></div>\n <div class=\"true\"><slot name=\"true\"></slot></div>\n </aside>\n </span>`;\n }\n\n reset() {\n this.checked = this.def === \"true\";\n this._input.checked = this.checked;\n }\n\n connectedCallback() {\n super.connectedCallback();\n if (this.checked) {\n this.def = \"true\";\n } else if (this.def === \"true\") {\n this.checked = true;\n }\n }\n\n protected _handleChange() {\n this.checked = this._input.checked;\n this.dispatchEvent(new CustomEvent(\"input\", { detail: this.checked, bubbles: true, composed: true }));\n this.dispatchEvent(new CustomEvent(\"change\", { detail: this.checked, composed: true }));\n }\n\n namevalue(): [string, boolean] {\n return [this.name, this.checked];\n }\n}\n\nexport default SwitchInput;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"switch-input\": SwitchInput;\n }\n}\n"]}
|
@@ -20,7 +20,7 @@ const colors = {
|
|
20
20
|
*
|
21
21
|
* Inspired by Ant-design.
|
22
22
|
*/
|
23
|
-
let AlertItem = class AlertItem extends GodownElement {
|
23
|
+
let AlertItem = AlertItem_1 = class AlertItem extends GodownElement {
|
24
24
|
constructor() {
|
25
25
|
super(...arguments);
|
26
26
|
/**
|
@@ -40,12 +40,36 @@ let AlertItem = class AlertItem extends GodownElement {
|
|
40
40
|
*/
|
41
41
|
this.content = "";
|
42
42
|
}
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
}
|
48
|
-
|
43
|
+
render() {
|
44
|
+
if (this.autoclose) {
|
45
|
+
setTimeout(() => this.close(), this.autoclose);
|
46
|
+
}
|
47
|
+
return html `<main class="${this.call} alert">
|
48
|
+
<div>
|
49
|
+
<strong> ${this.title || htmlSlot("title")}</strong>
|
50
|
+
${this.content || htmlSlot()}
|
51
|
+
</div>
|
52
|
+
<aside class="close" @click="${this.close}">${htmlSlot("close", svgX(), this)}</aside>
|
53
|
+
</main>`;
|
54
|
+
}
|
55
|
+
close() {
|
56
|
+
this.shadowRoot.querySelector(".alert").classList.add("hide");
|
57
|
+
setTimeout(() => {
|
58
|
+
this.remove();
|
59
|
+
}, 250);
|
60
|
+
}
|
61
|
+
static alert(root, option) {
|
62
|
+
const ai = new AlertItem_1();
|
63
|
+
Object.assign(ai, option);
|
64
|
+
root.appendChild(ai);
|
65
|
+
return ai;
|
66
|
+
}
|
67
|
+
};
|
68
|
+
AlertItem.styles = [
|
69
|
+
unsafeCSS(constructCSS(vars, colors, (raw) => {
|
70
|
+
return `.${raw}`;
|
71
|
+
})),
|
72
|
+
css `
|
49
73
|
:host {
|
50
74
|
${cssvarScope}--padding: .05em .25em .05em .35em;
|
51
75
|
${cssvarScope}--border-width: 0.15em;
|
@@ -113,32 +137,7 @@ let AlertItem = class AlertItem extends GodownElement {
|
|
113
137
|
stroke: var(${cssvarScope}--color);
|
114
138
|
}
|
115
139
|
`,
|
116
|
-
|
117
|
-
render() {
|
118
|
-
if (this.autoclose) {
|
119
|
-
setTimeout(() => this.close(), this.autoclose);
|
120
|
-
}
|
121
|
-
return html `<main class="${this.call} alert">
|
122
|
-
<div>
|
123
|
-
<strong> ${this.title || htmlSlot("title")}</strong>
|
124
|
-
${this.content || htmlSlot()}
|
125
|
-
</div>
|
126
|
-
<aside class="close" @click="${this.close}">${htmlSlot("close", svgX(), this)}</aside>
|
127
|
-
</main>`;
|
128
|
-
}
|
129
|
-
close() {
|
130
|
-
this.shadowRoot.querySelector(".alert").classList.add("hide");
|
131
|
-
setTimeout(() => {
|
132
|
-
this.remove();
|
133
|
-
}, 250);
|
134
|
-
}
|
135
|
-
static alert(root, option) {
|
136
|
-
const ai = new AlertItem_1();
|
137
|
-
Object.assign(ai, option);
|
138
|
-
root.appendChild(ai);
|
139
|
-
return ai;
|
140
|
-
}
|
141
|
-
};
|
140
|
+
];
|
142
141
|
__decorate([
|
143
142
|
property()
|
144
143
|
], AlertItem.prototype, "call", void 0);
|