@omegagrid/core 0.10.65 → 0.10.67
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.
|
@@ -1,8 +1,12 @@
|
|
|
1
1
|
import { DropdownMenu } from './dropdownMenu';
|
|
2
2
|
export declare class DropdownList extends DropdownMenu {
|
|
3
|
+
static styles: import("lit").CSSResult[];
|
|
3
4
|
value: string | number | boolean;
|
|
5
|
+
caption: string;
|
|
6
|
+
placeholder: string;
|
|
4
7
|
constructor();
|
|
5
8
|
open(): Promise<void>;
|
|
9
|
+
updateLabel(): void;
|
|
6
10
|
willUpdate(props: Map<string, unknown>): void;
|
|
7
11
|
}
|
|
8
12
|
//# sourceMappingURL=dropdownList.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdownList.d.ts","sourceRoot":"","sources":["../../src/ui/dropdownList.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"dropdownList.d.ts","sourceRoot":"","sources":["../../src/ui/dropdownList.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAI9C,qBACa,YAAa,SAAQ,YAAY;IAE7C,MAAM,CAAC,MAAM,4BAcV;IAGH,KAAK,EAAE,MAAM,GAAC,MAAM,GAAC,OAAO,CAAC;IAG7B,OAAO,EAAE,MAAM,CAAC;IAGhB,WAAW,EAAE,MAAM,CAAC;;IAWd,IAAI;IAQV,WAAW;IAmBX,UAAU,CAAC,KAAK,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;CAKtC"}
|
package/dist/ui/dropdownList.js
CHANGED
|
@@ -7,6 +7,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
7
7
|
import { customElement, property } from 'lit/decorators.js';
|
|
8
8
|
import { ChangeEvent } from '../common/events';
|
|
9
9
|
import { DropdownMenu } from './dropdownMenu';
|
|
10
|
+
import { Dropdown } from './dropdown';
|
|
11
|
+
import { css, html } from 'lit';
|
|
10
12
|
let DropdownList = class DropdownList extends DropdownMenu {
|
|
11
13
|
constructor() {
|
|
12
14
|
super();
|
|
@@ -24,23 +26,54 @@ let DropdownList = class DropdownList extends DropdownMenu {
|
|
|
24
26
|
setTimeout(() => this.menu.list.scrollToIndex(index), 10);
|
|
25
27
|
}
|
|
26
28
|
}
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
29
|
+
updateLabel() {
|
|
30
|
+
const caption = this.caption ? html `<div class="caption">${this.caption}</div>` : null;
|
|
31
|
+
const placeholder = this.placeholder ? html `<div class="placeholder">${this.placeholder}</div>` : null;
|
|
32
|
+
let value = null;
|
|
33
|
+
if (this.value != null) {
|
|
34
|
+
const index = this.items?.findIndex(i => (i.key ?? i.k) == this.value) ?? -1;
|
|
31
35
|
if (index > -1) {
|
|
32
36
|
const item = this.items[index];
|
|
33
|
-
|
|
37
|
+
value = item.renderer ? item.renderer(this.labelElm, index, item) : (item.value ?? item.v);
|
|
34
38
|
}
|
|
35
39
|
else {
|
|
36
|
-
|
|
40
|
+
value = this.value;
|
|
37
41
|
}
|
|
38
42
|
}
|
|
43
|
+
this.label = html `<div class="content">${value != null ? html `${caption ? html `${caption}:` : ``}<div class="itm">${value}</div>` : (caption
|
|
44
|
+
? html `${caption}${placeholder ? html `: ${placeholder}` : ``}`
|
|
45
|
+
: (placeholder ? html `${placeholder}` : html ` `))}</div>`;
|
|
46
|
+
}
|
|
47
|
+
willUpdate(props) {
|
|
48
|
+
super.willUpdate(props);
|
|
49
|
+
if (props.has('value') || props.has('caption') || props.has('placeholder'))
|
|
50
|
+
this.updateLabel();
|
|
39
51
|
}
|
|
40
52
|
};
|
|
53
|
+
DropdownList.styles = [...Dropdown.styles, css `
|
|
54
|
+
.caption, .placeholder {
|
|
55
|
+
color: var(--og-text-color-2);
|
|
56
|
+
opacity: 0.7;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.content {
|
|
60
|
+
display: flex;
|
|
61
|
+
align-items: center;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.content .itm {
|
|
65
|
+
margin-left: 2px;
|
|
66
|
+
}
|
|
67
|
+
`];
|
|
41
68
|
__decorate([
|
|
42
69
|
property()
|
|
43
70
|
], DropdownList.prototype, "value", void 0);
|
|
71
|
+
__decorate([
|
|
72
|
+
property({ type: String })
|
|
73
|
+
], DropdownList.prototype, "caption", void 0);
|
|
74
|
+
__decorate([
|
|
75
|
+
property({ type: String })
|
|
76
|
+
], DropdownList.prototype, "placeholder", void 0);
|
|
44
77
|
DropdownList = __decorate([
|
|
45
78
|
customElement(`og-dropdown-list`)
|
|
46
79
|
], DropdownList);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdownList.js","sourceRoot":"","sources":["../../src/ui/dropdownList.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"dropdownList.js","sourceRoot":"","sources":["../../src/ui/dropdownList.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property } from 'lit/decorators.js';\nimport { MenuEvent } from './menu';\nimport { ChangeEvent } from '../common/events';\nimport { DropdownMenu } from './dropdownMenu';\nimport { Dropdown } from './dropdown';\nimport { css, html } from 'lit';\n\n@customElement(`og-dropdown-list`)\nexport class DropdownList extends DropdownMenu {\n\n\tstatic styles = [...Dropdown.styles, css`\n\t\t.caption, .placeholder {\n\t\t\tcolor: var(--og-text-color-2);\n\t\t\topacity: 0.7;\n\t\t}\n\n\t\t.content {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t}\n\n\t\t.content .itm {\n\t\t\tmargin-left: 2px;\n\t\t}\n\t`];\n\n\t@property()\n\tvalue: string|number|boolean;\n\n\t@property({type: String})\n\tcaption: string;\n\n\t@property({type: String})\n\tplaceholder: string;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.label = String.fromCharCode(160);\n\t\tthis.addEventListener('menu.select', (e: MenuEvent) => {\n\t\t\tthis.value = e.item.key ?? e.item.k;\n\t\t\tthis.dispatchEvent(new ChangeEvent(this.value));\n\t\t});\n\t}\n\n\tasync open() {\n\t\tawait super.open();\n\t\tif (this.value != null) {\n\t\t\tconst index = this.items.findIndex(i => i.key == this.value);\n\t\t\tif (index > -1) setTimeout(() => this.menu.list.scrollToIndex(index), 10);\n\t\t}\n\t}\n\n\tupdateLabel() {\n\t\tconst caption = this.caption ? html`<div class=\"caption\">${this.caption}</div>` : null;\n\t\tconst placeholder = this.placeholder ? html`<div class=\"placeholder\">${this.placeholder}</div>` : null;\n\t\tlet value = null;\n\t\tif (this.value != null) {\n\t\t\tconst index = this.items?.findIndex(i => (i.key ?? i.k) == this.value) ?? -1;\n\t\t\tif (index > -1) {\n\t\t\t\tconst item = this.items[index];\n\t\t\t\tvalue = item.renderer ? item.renderer(this.labelElm, index, item) : (item.value ?? item.v);\n\t\t\t} else {\n\t\t\t\tvalue = this.value;\n\t\t\t}\n\t\t}\n\t\tthis.label = html`<div class=\"content\">${value != null ? html`${caption ? html`${caption}:` : ``}<div class=\"itm\">${value}</div>` : (caption\n\t\t\t? html`${caption}${placeholder ? html`: ${placeholder}` : ``}`\n\t\t\t: (placeholder ? html`${placeholder}` : html` `)\n\t\t)}</div>`;\n\t}\n\n\twillUpdate(props: Map<string, unknown>) {\n\t\tsuper.willUpdate(props);\n\t\tif (props.has('value') || props.has('caption') || props.has('placeholder')) this.updateLabel();\n\t}\n\t\n}"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@omegagrid/core",
|
|
3
|
-
"version": "0.10.
|
|
3
|
+
"version": "0.10.67",
|
|
4
4
|
"license": "UNLICENSED",
|
|
5
5
|
"description": "Core components",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
38
|
"@fortawesome/fontawesome-svg-core": "^7.0.1",
|
|
39
|
-
"@omegagrid/localize": "^0.10.
|
|
39
|
+
"@omegagrid/localize": "^0.10.67",
|
|
40
40
|
"color": "^4.2.3",
|
|
41
41
|
"date-fns": "^3.2.0",
|
|
42
42
|
"lit": "^3.1.1",
|