@deepfuture/dui-components 0.0.12 → 0.0.13
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/_deprecated/center/center.js +2 -2
- package/_deprecated/hstack/hstack.js +79 -33
- package/_deprecated/page-inset/page-inset.js +104 -56
- package/_deprecated/vstack/vstack.js +61 -19
- package/accordion/accordion-item.js +217 -147
- package/accordion/accordion.js +214 -149
- package/alert-dialog/alert-dialog-close.js +2 -2
- package/alert-dialog/alert-dialog-popup.js +230 -166
- package/alert-dialog/alert-dialog-trigger.js +2 -2
- package/alert-dialog/alert-dialog.js +128 -73
- package/avatar/avatar.js +175 -115
- package/badge/badge.js +2 -2
- package/breadcrumb/breadcrumb-ellipsis.js +2 -2
- package/breadcrumb/breadcrumb-item.js +2 -2
- package/breadcrumb/breadcrumb-link.js +2 -2
- package/breadcrumb/breadcrumb-page.js +2 -2
- package/breadcrumb/breadcrumb-separator.js +2 -2
- package/breadcrumb/breadcrumb.js +2 -2
- package/button/button.js +109 -65
- package/calendar/calendar.js +368 -290
- package/checkbox/checkbox-group.js +146 -87
- package/checkbox/checkbox.js +232 -167
- package/collapsible/collapsible.js +210 -132
- package/combobox/combobox.js +318 -252
- package/command/command-empty.js +67 -25
- package/command/command-group.js +87 -47
- package/command/command-input.js +84 -44
- package/command/command-item.js +168 -124
- package/command/command-list.js +60 -18
- package/command/command-separator.js +2 -2
- package/command/command-shortcut.js +2 -2
- package/command/command.js +297 -232
- package/data-table/data-table.js +225 -153
- package/dialog/dialog-close.js +2 -2
- package/dialog/dialog-popup.js +247 -181
- package/dialog/dialog-trigger.js +2 -2
- package/dialog/dialog.js +128 -73
- package/dropzone/dropzone.js +310 -249
- package/icon/icon.js +2 -2
- package/input/input.js +204 -143
- package/link/link.js +62 -24
- package/menu/menu-item.js +66 -24
- package/menu/menu.js +189 -136
- package/menubar/menubar.js +142 -91
- package/number-field/number-field.js +277 -204
- package/package.json +2 -2
- package/popover/popover-close.js +2 -2
- package/popover/popover-popup.js +126 -76
- package/popover/popover-trigger.js +2 -2
- package/popover/popover.js +181 -120
- package/portal/portal.js +128 -86
- package/preview-card/preview-card-popup.js +114 -66
- package/preview-card/preview-card-trigger.js +2 -2
- package/preview-card/preview-card.js +211 -142
- package/progress/progress.js +91 -45
- package/radio/radio-group.js +153 -90
- package/radio/radio.js +137 -94
- package/scroll-area/scroll-area.js +382 -283
- package/select/select.js +260 -203
- package/separator/separator.js +60 -18
- package/sidebar/sidebar-content.js +2 -2
- package/sidebar/sidebar-footer.js +2 -2
- package/sidebar/sidebar-group-label.js +2 -2
- package/sidebar/sidebar-group.js +2 -2
- package/sidebar/sidebar-header.js +2 -2
- package/sidebar/sidebar-inset.js +2 -2
- package/sidebar/sidebar-menu-button.js +118 -74
- package/sidebar/sidebar-menu-item.js +2 -2
- package/sidebar/sidebar-menu.js +2 -2
- package/sidebar/sidebar-provider.js +202 -129
- package/sidebar/sidebar-separator.js +2 -2
- package/sidebar/sidebar-trigger.js +2 -2
- package/sidebar/sidebar.js +150 -85
- package/slider/slider.js +217 -159
- package/spinner/spinner.js +70 -28
- package/switch/switch.js +174 -111
- package/tabs/tab.js +89 -47
- package/tabs/tabs-indicator.js +2 -2
- package/tabs/tabs-list.js +92 -54
- package/tabs/tabs-panel.js +90 -44
- package/tabs/tabs.js +130 -71
- package/textarea/textarea.js +153 -95
- package/toggle/toggle-group.js +184 -125
- package/toggle/toggle.js +131 -76
- package/toolbar/toolbar.js +79 -33
- package/tooltip/tooltip-popup.js +108 -60
- package/tooltip/tooltip-trigger.js +93 -55
- package/tooltip/tooltip.js +225 -154
- package/trunc/trunc.js +78 -34
package/command/command-empty.js
CHANGED
|
@@ -1,9 +1,37 @@
|
|
|
1
1
|
/** Ported from original DUI: deep-future-app/app/client/components/dui/command */
|
|
2
|
-
var
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
2
|
+
var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
|
|
3
|
+
function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
|
|
4
|
+
var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
|
|
5
|
+
var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
|
|
6
|
+
var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
|
|
7
|
+
var _, done = false;
|
|
8
|
+
for (var i = decorators.length - 1; i >= 0; i--) {
|
|
9
|
+
var context = {};
|
|
10
|
+
for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
|
|
11
|
+
for (var p in contextIn.access) context.access[p] = contextIn.access[p];
|
|
12
|
+
context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
|
|
13
|
+
var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
|
|
14
|
+
if (kind === "accessor") {
|
|
15
|
+
if (result === void 0) continue;
|
|
16
|
+
if (result === null || typeof result !== "object") throw new TypeError("Object expected");
|
|
17
|
+
if (_ = accept(result.get)) descriptor.get = _;
|
|
18
|
+
if (_ = accept(result.set)) descriptor.set = _;
|
|
19
|
+
if (_ = accept(result.init)) initializers.unshift(_);
|
|
20
|
+
}
|
|
21
|
+
else if (_ = accept(result)) {
|
|
22
|
+
if (kind === "field") initializers.unshift(_);
|
|
23
|
+
else descriptor[key] = _;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
if (target) Object.defineProperty(target, contextIn.name, descriptor);
|
|
27
|
+
done = true;
|
|
28
|
+
};
|
|
29
|
+
var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
|
|
30
|
+
var useValue = arguments.length > 2;
|
|
31
|
+
for (var i = 0; i < initializers.length; i++) {
|
|
32
|
+
value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
|
|
33
|
+
}
|
|
34
|
+
return useValue ? value : void 0;
|
|
7
35
|
};
|
|
8
36
|
import { css, html, LitElement } from "lit";
|
|
9
37
|
import { consume } from "@lit/context";
|
|
@@ -22,29 +50,43 @@ const styles = css `
|
|
|
22
50
|
text-align: center;
|
|
23
51
|
}
|
|
24
52
|
`;
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
this.
|
|
53
|
+
let DuiCommandEmpty = (() => {
|
|
54
|
+
let _classSuper = LitElement;
|
|
55
|
+
let __ctx_decorators;
|
|
56
|
+
let __ctx_initializers = [];
|
|
57
|
+
let __ctx_extraInitializers = [];
|
|
58
|
+
return class DuiCommandEmpty extends _classSuper {
|
|
59
|
+
static {
|
|
60
|
+
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
|
|
61
|
+
__ctx_decorators = [consume({ context: commandContext, subscribe: true })];
|
|
62
|
+
__esDecorate(this, null, __ctx_decorators, { kind: "accessor", name: "_ctx", static: false, private: false, access: { has: obj => "_ctx" in obj, get: obj => obj._ctx, set: (obj, value) => { obj._ctx = value; } }, metadata: _metadata }, __ctx_initializers, __ctx_extraInitializers);
|
|
63
|
+
if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
35
64
|
}
|
|
36
|
-
|
|
37
|
-
|
|
65
|
+
static tagName = "dui-command-empty";
|
|
66
|
+
static styles = [base, styles];
|
|
67
|
+
#_ctx_accessor_storage = __runInitializers(this, __ctx_initializers, void 0);
|
|
68
|
+
get _ctx() { return this.#_ctx_accessor_storage; }
|
|
69
|
+
set _ctx(value) { this.#_ctx_accessor_storage = value; }
|
|
70
|
+
willUpdate() {
|
|
71
|
+
const shouldShow = this._ctx?.search !== "" && this._ctx?.getVisibleCount() === 0;
|
|
72
|
+
if (shouldShow) {
|
|
73
|
+
this.removeAttribute("data-hidden");
|
|
74
|
+
}
|
|
75
|
+
else {
|
|
76
|
+
this.setAttribute("data-hidden", "");
|
|
77
|
+
}
|
|
38
78
|
}
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
return html `
|
|
79
|
+
render() {
|
|
80
|
+
return html `
|
|
42
81
|
<div class="Empty" role="status">
|
|
43
82
|
<slot></slot>
|
|
44
83
|
</div>
|
|
45
84
|
`;
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
85
|
+
}
|
|
86
|
+
constructor() {
|
|
87
|
+
super(...arguments);
|
|
88
|
+
__runInitializers(this, __ctx_extraInitializers);
|
|
89
|
+
}
|
|
90
|
+
};
|
|
91
|
+
})();
|
|
92
|
+
export { DuiCommandEmpty };
|
package/command/command-group.js
CHANGED
|
@@ -1,9 +1,37 @@
|
|
|
1
1
|
/** Ported from original DUI: deep-future-app/app/client/components/dui/command */
|
|
2
|
-
var
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
2
|
+
var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
|
|
3
|
+
function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
|
|
4
|
+
var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
|
|
5
|
+
var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
|
|
6
|
+
var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
|
|
7
|
+
var _, done = false;
|
|
8
|
+
for (var i = decorators.length - 1; i >= 0; i--) {
|
|
9
|
+
var context = {};
|
|
10
|
+
for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
|
|
11
|
+
for (var p in contextIn.access) context.access[p] = contextIn.access[p];
|
|
12
|
+
context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
|
|
13
|
+
var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
|
|
14
|
+
if (kind === "accessor") {
|
|
15
|
+
if (result === void 0) continue;
|
|
16
|
+
if (result === null || typeof result !== "object") throw new TypeError("Object expected");
|
|
17
|
+
if (_ = accept(result.get)) descriptor.get = _;
|
|
18
|
+
if (_ = accept(result.set)) descriptor.set = _;
|
|
19
|
+
if (_ = accept(result.init)) initializers.unshift(_);
|
|
20
|
+
}
|
|
21
|
+
else if (_ = accept(result)) {
|
|
22
|
+
if (kind === "field") initializers.unshift(_);
|
|
23
|
+
else descriptor[key] = _;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
if (target) Object.defineProperty(target, contextIn.name, descriptor);
|
|
27
|
+
done = true;
|
|
28
|
+
};
|
|
29
|
+
var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
|
|
30
|
+
var useValue = arguments.length > 2;
|
|
31
|
+
for (var i = 0; i < initializers.length; i++) {
|
|
32
|
+
value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
|
|
33
|
+
}
|
|
34
|
+
return useValue ? value : void 0;
|
|
7
35
|
};
|
|
8
36
|
import { css, html, LitElement, nothing } from "lit";
|
|
9
37
|
import { property } from "lit/decorators.js";
|
|
@@ -25,55 +53,67 @@ const styles = css `
|
|
|
25
53
|
overflow: hidden;
|
|
26
54
|
}
|
|
27
55
|
`;
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
56
|
+
let DuiCommandGroup = (() => {
|
|
57
|
+
let _classSuper = LitElement;
|
|
58
|
+
let _heading_decorators;
|
|
59
|
+
let _heading_initializers = [];
|
|
60
|
+
let _heading_extraInitializers = [];
|
|
61
|
+
let __ctx_decorators;
|
|
62
|
+
let __ctx_initializers = [];
|
|
63
|
+
let __ctx_extraInitializers = [];
|
|
64
|
+
return class DuiCommandGroup extends _classSuper {
|
|
65
|
+
static {
|
|
66
|
+
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
|
|
67
|
+
_heading_decorators = [property({ type: String })];
|
|
68
|
+
__ctx_decorators = [consume({ context: commandContext, subscribe: true })];
|
|
69
|
+
__esDecorate(this, null, _heading_decorators, { kind: "accessor", name: "heading", static: false, private: false, access: { has: obj => "heading" in obj, get: obj => obj.heading, set: (obj, value) => { obj.heading = value; } }, metadata: _metadata }, _heading_initializers, _heading_extraInitializers);
|
|
70
|
+
__esDecorate(this, null, __ctx_decorators, { kind: "accessor", name: "_ctx", static: false, private: false, access: { has: obj => "_ctx" in obj, get: obj => obj._ctx, set: (obj, value) => { obj._ctx = value; } }, metadata: _metadata }, __ctx_initializers, __ctx_extraInitializers);
|
|
71
|
+
if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
72
|
+
}
|
|
73
|
+
static tagName = "dui-command-group";
|
|
74
|
+
static styles = [base, styles];
|
|
75
|
+
#heading_accessor_storage = __runInitializers(this, _heading_initializers, "");
|
|
76
|
+
/** Heading text for this group. */
|
|
77
|
+
get heading() { return this.#heading_accessor_storage; }
|
|
78
|
+
set heading(value) { this.#heading_accessor_storage = value; }
|
|
79
|
+
#_ctx_accessor_storage = (__runInitializers(this, _heading_extraInitializers), __runInitializers(this, __ctx_initializers, void 0));
|
|
80
|
+
get _ctx() { return this.#_ctx_accessor_storage; }
|
|
81
|
+
set _ctx(value) { this.#_ctx_accessor_storage = value; }
|
|
82
|
+
#groupId = (__runInitializers(this, __ctx_extraInitializers), nextGroupId());
|
|
83
|
+
connectedCallback() {
|
|
84
|
+
super.connectedCallback();
|
|
85
|
+
this.setAttribute("data-group-id", this.#groupId);
|
|
86
|
+
this._ctx?.registerGroup(this.#groupId);
|
|
87
|
+
}
|
|
88
|
+
disconnectedCallback() {
|
|
89
|
+
super.disconnectedCallback();
|
|
90
|
+
this._ctx?.unregisterGroup(this.#groupId);
|
|
91
|
+
}
|
|
92
|
+
willUpdate() {
|
|
93
|
+
// Hide group when no visible items
|
|
94
|
+
if (this._ctx?.shouldFilter) {
|
|
95
|
+
const visibleCount = this._ctx.getGroupVisibleCount(this.#groupId);
|
|
96
|
+
if (visibleCount === 0 && this._ctx.search !== "") {
|
|
97
|
+
this.setAttribute("data-hidden", "");
|
|
98
|
+
}
|
|
99
|
+
else {
|
|
100
|
+
this.removeAttribute("data-hidden");
|
|
101
|
+
}
|
|
54
102
|
}
|
|
55
103
|
else {
|
|
56
104
|
this.removeAttribute("data-hidden");
|
|
57
105
|
}
|
|
58
106
|
}
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
}
|
|
62
|
-
}
|
|
63
|
-
render() {
|
|
64
|
-
return html `
|
|
107
|
+
render() {
|
|
108
|
+
return html `
|
|
65
109
|
<div class="Group" role="group" aria-label="${this.heading || nothing}">
|
|
66
110
|
${this.heading
|
|
67
|
-
|
|
68
|
-
|
|
111
|
+
? html `<div class="Heading" aria-hidden="true">${this.heading}</div>`
|
|
112
|
+
: nothing}
|
|
69
113
|
<slot></slot>
|
|
70
114
|
</div>
|
|
71
115
|
`;
|
|
72
|
-
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
], DuiCommandGroup.prototype, "heading", null);
|
|
77
|
-
__decorate([
|
|
78
|
-
consume({ context: commandContext, subscribe: true })
|
|
79
|
-
], DuiCommandGroup.prototype, "_ctx", null);
|
|
116
|
+
}
|
|
117
|
+
};
|
|
118
|
+
})();
|
|
119
|
+
export { DuiCommandGroup };
|
package/command/command-input.js
CHANGED
|
@@ -1,9 +1,37 @@
|
|
|
1
1
|
/** Ported from original DUI: deep-future-app/app/client/components/dui/command */
|
|
2
|
-
var
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
2
|
+
var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
|
|
3
|
+
function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
|
|
4
|
+
var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
|
|
5
|
+
var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
|
|
6
|
+
var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
|
|
7
|
+
var _, done = false;
|
|
8
|
+
for (var i = decorators.length - 1; i >= 0; i--) {
|
|
9
|
+
var context = {};
|
|
10
|
+
for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
|
|
11
|
+
for (var p in contextIn.access) context.access[p] = contextIn.access[p];
|
|
12
|
+
context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
|
|
13
|
+
var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
|
|
14
|
+
if (kind === "accessor") {
|
|
15
|
+
if (result === void 0) continue;
|
|
16
|
+
if (result === null || typeof result !== "object") throw new TypeError("Object expected");
|
|
17
|
+
if (_ = accept(result.get)) descriptor.get = _;
|
|
18
|
+
if (_ = accept(result.set)) descriptor.set = _;
|
|
19
|
+
if (_ = accept(result.init)) initializers.unshift(_);
|
|
20
|
+
}
|
|
21
|
+
else if (_ = accept(result)) {
|
|
22
|
+
if (kind === "field") initializers.unshift(_);
|
|
23
|
+
else descriptor[key] = _;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
if (target) Object.defineProperty(target, contextIn.name, descriptor);
|
|
27
|
+
done = true;
|
|
28
|
+
};
|
|
29
|
+
var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
|
|
30
|
+
var useValue = arguments.length > 2;
|
|
31
|
+
for (var i = 0; i < initializers.length; i++) {
|
|
32
|
+
value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
|
|
33
|
+
}
|
|
34
|
+
return useValue ? value : void 0;
|
|
7
35
|
};
|
|
8
36
|
import { css, html, LitElement, nothing } from "lit";
|
|
9
37
|
import { property } from "lit/decorators.js";
|
|
@@ -34,39 +62,55 @@ const styles = css `
|
|
|
34
62
|
padding: 0;
|
|
35
63
|
}
|
|
36
64
|
`;
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
if (event.key === "ArrowUp" || event.key === "ArrowDown") {
|
|
54
|
-
event.preventDefault();
|
|
65
|
+
let DuiCommandInput = (() => {
|
|
66
|
+
let _classSuper = LitElement;
|
|
67
|
+
let _placeholder_decorators;
|
|
68
|
+
let _placeholder_initializers = [];
|
|
69
|
+
let _placeholder_extraInitializers = [];
|
|
70
|
+
let __ctx_decorators;
|
|
71
|
+
let __ctx_initializers = [];
|
|
72
|
+
let __ctx_extraInitializers = [];
|
|
73
|
+
return class DuiCommandInput extends _classSuper {
|
|
74
|
+
static {
|
|
75
|
+
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
|
|
76
|
+
_placeholder_decorators = [property({ type: String })];
|
|
77
|
+
__ctx_decorators = [consume({ context: commandContext, subscribe: true })];
|
|
78
|
+
__esDecorate(this, null, _placeholder_decorators, { kind: "accessor", name: "placeholder", static: false, private: false, access: { has: obj => "placeholder" in obj, get: obj => obj.placeholder, set: (obj, value) => { obj.placeholder = value; } }, metadata: _metadata }, _placeholder_initializers, _placeholder_extraInitializers);
|
|
79
|
+
__esDecorate(this, null, __ctx_decorators, { kind: "accessor", name: "_ctx", static: false, private: false, access: { has: obj => "_ctx" in obj, get: obj => obj._ctx, set: (obj, value) => { obj._ctx = value; } }, metadata: _metadata }, __ctx_initializers, __ctx_extraInitializers);
|
|
80
|
+
if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
55
81
|
}
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
82
|
+
static tagName = "dui-command-input";
|
|
83
|
+
static styles = [base, styles];
|
|
84
|
+
#placeholder_accessor_storage = __runInitializers(this, _placeholder_initializers, "Search...");
|
|
85
|
+
/** Placeholder text for the search input. */
|
|
86
|
+
get placeholder() { return this.#placeholder_accessor_storage; }
|
|
87
|
+
set placeholder(value) { this.#placeholder_accessor_storage = value; }
|
|
88
|
+
#_ctx_accessor_storage = (__runInitializers(this, _placeholder_extraInitializers), __runInitializers(this, __ctx_initializers, void 0));
|
|
89
|
+
get _ctx() { return this.#_ctx_accessor_storage; }
|
|
90
|
+
set _ctx(value) { this.#_ctx_accessor_storage = value; }
|
|
91
|
+
#prevSearch = (__runInitializers(this, __ctx_extraInitializers), undefined);
|
|
92
|
+
#handleInput = (event) => {
|
|
93
|
+
const input = event.target;
|
|
94
|
+
this._ctx?.setSearch(input.value);
|
|
95
|
+
};
|
|
96
|
+
#handleKeyDown = (event) => {
|
|
97
|
+
if (event.key === "ArrowUp" || event.key === "ArrowDown") {
|
|
98
|
+
event.preventDefault();
|
|
99
|
+
}
|
|
100
|
+
};
|
|
101
|
+
willUpdate() {
|
|
102
|
+
// Sync input value when search is cleared externally
|
|
103
|
+
if (this.#prevSearch !== undefined &&
|
|
104
|
+
this._ctx?.search === "" &&
|
|
105
|
+
this.#prevSearch !== "") {
|
|
106
|
+
const input = this.shadowRoot?.querySelector(".Input");
|
|
107
|
+
if (input)
|
|
108
|
+
input.value = "";
|
|
109
|
+
}
|
|
110
|
+
this.#prevSearch = this._ctx?.search;
|
|
65
111
|
}
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
render() {
|
|
69
|
-
return html `
|
|
112
|
+
render() {
|
|
113
|
+
return html `
|
|
70
114
|
<div class="InputWrapper">
|
|
71
115
|
<svg
|
|
72
116
|
class="SearchIcon"
|
|
@@ -96,11 +140,7 @@ export class DuiCommandInput extends LitElement {
|
|
|
96
140
|
/>
|
|
97
141
|
</div>
|
|
98
142
|
`;
|
|
99
|
-
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
], DuiCommandInput.prototype, "placeholder", null);
|
|
104
|
-
__decorate([
|
|
105
|
-
consume({ context: commandContext, subscribe: true })
|
|
106
|
-
], DuiCommandInput.prototype, "_ctx", null);
|
|
143
|
+
}
|
|
144
|
+
};
|
|
145
|
+
})();
|
|
146
|
+
export { DuiCommandInput };
|