@omegagrid/grid 0.10.61 → 0.10.63
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/dist/filters/filterFactory.js +1 -1
- package/dist/filters/filterFactory.js.map +1 -1
- package/dist/filters/numberFilter.d.ts +20 -3
- package/dist/filters/numberFilter.d.ts.map +1 -1
- package/dist/filters/numberFilter.js +102 -7
- package/dist/filters/numberFilter.js.map +1 -1
- package/dist/filters/rangeFilterPopup.d.ts +2 -0
- package/dist/filters/rangeFilterPopup.d.ts.map +1 -1
- package/dist/filters/rangeFilterPopup.js +13 -1
- package/dist/filters/rangeFilterPopup.js.map +1 -1
- package/package.json +7 -7
|
@@ -24,7 +24,7 @@ const createDropdownFilter = (column) => {
|
|
|
24
24
|
};
|
|
25
25
|
const filterMap = new Map([
|
|
26
26
|
['t', () => dom.createElement('og-filter-text')],
|
|
27
|
-
['n', () => dom.createElement('og-filter-
|
|
27
|
+
['n', () => dom.createElement('og-filter-number')],
|
|
28
28
|
['d', () => dom.createElement('og-filter-range')],
|
|
29
29
|
['dt', () => dom.createElement('og-filter-range')],
|
|
30
30
|
['tm', () => dom.createElement('og-filter-range')],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filterFactory.js","sourceRoot":"","sources":["../../src/filters/filterFactory.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,GAAG,EAAE,MAAM,iBAAiB,CAAC;AAItC,SAAS,oBAAoB,CAAC,MAAmB;IAChD,MAAM,MAAM,GAAG,IAAI,GAAG,EAAkB,CAAC;IAEzC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACnD,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAC5B,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,KAAe,EAAE,CAAC,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;IACtF,CAAC;IAED,MAAM,KAAK,GAAe,EAAE,CAAC;IAC7B,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,EAAC,CAAC,EAAE,CAAC,EAAC,CAAC,CAAC,CAAC;IAC7C,OAAO,KAAK,CAAC;AACd,CAAC;AAED,MAAM,oBAAoB,GAAG,CAAC,MAAmB,EAAE,EAAE;IACpD,MAAM,SAAS,GAAG,GAAG,CAAC,aAAa,CAAiB,oBAAoB,CAAC,CAAC;IAC1E,IAAI,MAAM,CAAC,OAAO,EAAE,CAAC;QACpB,SAAS,CAAC,OAAO,GAAG,MAAM,CAAC,OAAsB,CAAC;IACnD,CAAC;SAAM,IAAI,MAAM,CAAC,aAAa,EAAE,CAAC;QACjC,SAAS,CAAC,KAAK,GAAG,MAAM,CAAC,aAA2B,CAAC;IACtD,CAAC;SAAM,CAAC;QACP,SAAS,CAAC,KAAK,GAAG,oBAAoB,CAAC,MAAM,CAAC,CAAC;IAChD,CAAC;IACD,OAAO,SAAS,CAAC;AAClB,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,IAAI,GAAG,CAAgD;IACxE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IAChD,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,aAAa,CAAC,
|
|
1
|
+
{"version":3,"file":"filterFactory.js","sourceRoot":"","sources":["../../src/filters/filterFactory.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,GAAG,EAAE,MAAM,iBAAiB,CAAC;AAItC,SAAS,oBAAoB,CAAC,MAAmB;IAChD,MAAM,MAAM,GAAG,IAAI,GAAG,EAAkB,CAAC;IAEzC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACnD,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAC5B,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,KAAe,EAAE,CAAC,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;IACtF,CAAC;IAED,MAAM,KAAK,GAAe,EAAE,CAAC;IAC7B,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,EAAC,CAAC,EAAE,CAAC,EAAC,CAAC,CAAC,CAAC;IAC7C,OAAO,KAAK,CAAC;AACd,CAAC;AAED,MAAM,oBAAoB,GAAG,CAAC,MAAmB,EAAE,EAAE;IACpD,MAAM,SAAS,GAAG,GAAG,CAAC,aAAa,CAAiB,oBAAoB,CAAC,CAAC;IAC1E,IAAI,MAAM,CAAC,OAAO,EAAE,CAAC;QACpB,SAAS,CAAC,OAAO,GAAG,MAAM,CAAC,OAAsB,CAAC;IACnD,CAAC;SAAM,IAAI,MAAM,CAAC,aAAa,EAAE,CAAC;QACjC,SAAS,CAAC,KAAK,GAAG,MAAM,CAAC,aAA2B,CAAC;IACtD,CAAC;SAAM,CAAC;QACP,SAAS,CAAC,KAAK,GAAG,oBAAoB,CAAC,MAAM,CAAC,CAAC;IAChD,CAAC;IACD,OAAO,SAAS,CAAC;AAClB,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,IAAI,GAAG,CAAgD;IACxE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IAChD,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;IAClD,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;IACjD,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAClD,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAClD,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;IACpD,CAAC,GAAG,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC;IAC/C,CAAC,GAAG,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC;CAC/C,CAAC,CAAC;AAEH,MAAM,UAAU,YAAY,CAAC,MAAmB,EAAE,UAAuB;IACxE,MAAM,OAAO,GAAG,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAC3C,MAAM,SAAS,GAAe,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IAC9F,SAAS,CAAC,WAAW,GAAG,MAAM,CAAC;IAC/B,SAAS,CAAC,WAAW,GAAG,UAAU,CAAC;IACnC,OAAO,SAAS,CAAC;AAClB,CAAC","sourcesContent":["import { CellType, ColumnModel, FilterModel } from \"@omegagrid/grid-core\";\nimport { BaseFilter } from \"./baseFilter\";\nimport { dom } from \"@omegagrid/core\";\nimport { DropdownFilter } from \"./dropdownFilter\";\nimport { TreeAdapter, TreeSource } from \"@omegagrid/tree\";\n\nfunction collectDropdownItems(column: ColumnModel) : TreeSource {\n\tconst values = new Map<string, string>();\n\t\n\tfor (let r = 0; r < column.model.rows.length; r++) {\n\t\tconst cell = column.cell(r);\n\t\tvalues.set(cell.value as string, (cell.displayValue ?? cell.value ?? \"\").toString());\n\t}\n\n\tconst items: TreeSource = [];\n\tvalues.forEach((v, k) => items.push({k, v}));\n\treturn items;\n}\n\nconst createDropdownFilter = (column: ColumnModel) => {\n\tconst component = dom.createElement<DropdownFilter>('og-filter-dropdown');\n\tif (column.adapter) {\n\t\tcomponent.adapter = column.adapter as TreeAdapter;\n\t} else if (column.editorContent) {\n\t\tcomponent.items = column.editorContent as TreeSource;\n\t} else {\n\t\tcomponent.items = collectDropdownItems(column);\n\t}\n\treturn component;\n}\n\nconst filterMap = new Map<CellType, (column: ColumnModel) => BaseFilter>([\n\t['t', () => dom.createElement('og-filter-text')],\n\t['n', () => dom.createElement('og-filter-number')],\n\t['d', () => dom.createElement('og-filter-range')],\n\t['dt', () => dom.createElement('og-filter-range')],\n\t['tm', () => dom.createElement('og-filter-range')],\n\t['b', () => dom.createElement('og-filter-checkbox')],\n\t['s', (column) => createDropdownFilter(column)],\n\t['m', (column) => createDropdownFilter(column)]\n]);\n\nexport function createFilter(column: ColumnModel, filteModel: FilterModel): BaseFilter {\n\tconst factory = filterMap.get(column.type);\n\tconst component: BaseFilter = factory ? factory(column) : dom.createElement('og-filter-text');\n\tcomponent.columnModel = column;\n\tcomponent.filterModel = filteModel;\n\treturn component;\n}\n"]}
|
|
@@ -1,8 +1,25 @@
|
|
|
1
|
-
import { FilterSettings } from "@omegagrid/grid-core";
|
|
2
1
|
import { BaseFilter } from "./baseFilter";
|
|
2
|
+
/**
|
|
3
|
+
* Text-based filter for numeric columns. Instead of a range popup the user types an
|
|
4
|
+
* expression such as `> 100`, `<10 or >20`, `>10 and <20`, `100..200`, `=42` (exact),
|
|
5
|
+
* `!=5`, or a value list `1 2 3` (OR of exact matches). A single bare number is matched
|
|
6
|
+
* as a plain text "contains" search. Parsing and matching are handled by grid-core's
|
|
7
|
+
* `createCellMatcher`.
|
|
8
|
+
*/
|
|
3
9
|
export declare class NumberFilter extends BaseFilter {
|
|
4
|
-
|
|
5
|
-
|
|
10
|
+
static styles: import("lit").CSSResult[];
|
|
11
|
+
private inputRef;
|
|
12
|
+
get input(): HTMLInputElement;
|
|
13
|
+
private filterButtonRef;
|
|
14
|
+
get filterButton(): HTMLButtonElement;
|
|
15
|
+
private clearButtonRef;
|
|
16
|
+
get clearButton(): HTMLButtonElement;
|
|
17
|
+
private _apply;
|
|
18
|
+
_onFilterClick(): void;
|
|
19
|
+
_onClearClick(): void;
|
|
20
|
+
_onInputKeyDown(e: KeyboardEvent): void;
|
|
21
|
+
render: () => import("lit-html").TemplateResult<1>;
|
|
22
|
+
activate(): void;
|
|
6
23
|
deactivate(): void;
|
|
7
24
|
}
|
|
8
25
|
//# sourceMappingURL=numberFilter.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"numberFilter.d.ts","sourceRoot":"","sources":["../../src/filters/numberFilter.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"numberFilter.d.ts","sourceRoot":"","sources":["../../src/filters/numberFilter.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAK1C;;;;;;GAMG;AACH,qBACa,YAAa,SAAQ,UAAU;IAE3C,MAAM,CAAC,MAAM,4BA4BV;IAEH,OAAO,CAAC,QAAQ,CAAiC;IACjD,IAAI,KAAK,qBAAiC;IAE1C,OAAO,CAAC,eAAe,CAAkC;IACzD,IAAI,YAAY,sBAAwC;IAExD,OAAO,CAAC,cAAc,CAAkC;IACxD,IAAI,WAAW,sBAAuC;IAEtD,OAAO,CAAC,MAAM;IASd,cAAc;IAId,aAAa;IAKb,eAAe,CAAC,CAAC,EAAE,aAAa;IAOhC,MAAM,6CAUJ;IAEF,QAAQ;IAQR,UAAU;CAIV"}
|
|
@@ -1,13 +1,108 @@
|
|
|
1
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
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
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
+
};
|
|
7
|
+
import constants from "../constants";
|
|
8
|
+
import { customElement } from 'lit/decorators.js';
|
|
1
9
|
import { BaseFilter } from "./baseFilter";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
10
|
+
import { html, css } from 'lit';
|
|
11
|
+
import { createRef, ref } from 'lit/directives/ref.js';
|
|
12
|
+
import { msg } from '@omegagrid/localize';
|
|
13
|
+
/**
|
|
14
|
+
* Text-based filter for numeric columns. Instead of a range popup the user types an
|
|
15
|
+
* expression such as `> 100`, `<10 or >20`, `>10 and <20`, `100..200`, `=42` (exact),
|
|
16
|
+
* `!=5`, or a value list `1 2 3` (OR of exact matches). A single bare number is matched
|
|
17
|
+
* as a plain text "contains" search. Parsing and matching are handled by grid-core's
|
|
18
|
+
* `createCellMatcher`.
|
|
19
|
+
*/
|
|
20
|
+
let NumberFilter = class NumberFilter extends BaseFilter {
|
|
21
|
+
constructor() {
|
|
22
|
+
super(...arguments);
|
|
23
|
+
this.inputRef = createRef();
|
|
24
|
+
this.filterButtonRef = createRef();
|
|
25
|
+
this.clearButtonRef = createRef();
|
|
26
|
+
this.render = () => html `
|
|
27
|
+
<div class="filter-inner">
|
|
28
|
+
<input ${ref(this.inputRef)}
|
|
29
|
+
type="text"
|
|
30
|
+
title="${msg('Examples: > 100, <10 or >20, >10 and <20, 100..200, 1 2 3, =42 (exact), 42 (contains)')}"
|
|
31
|
+
@keydown="${this._onInputKeyDown}"
|
|
32
|
+
.value="${this.currentValue ?? ''}">
|
|
33
|
+
<og-button icon="filter" color="accent" ${ref(this.filterButtonRef)} @mousedown="${this._onFilterClick}"></og-button>
|
|
34
|
+
<og-button icon="xmark" color="red" ${ref(this.clearButtonRef)} @mousedown="${this._onClearClick}"></og-button>
|
|
35
|
+
</div>
|
|
36
|
+
`;
|
|
5
37
|
}
|
|
6
|
-
|
|
7
|
-
|
|
38
|
+
get input() { return this.inputRef.value; }
|
|
39
|
+
get filterButton() { return this.filterButtonRef.value; }
|
|
40
|
+
get clearButton() { return this.clearButtonRef.value; }
|
|
41
|
+
_apply() {
|
|
42
|
+
const value = (this.input?.value ?? '').trim();
|
|
43
|
+
if (value === '') {
|
|
44
|
+
this.clearFilter();
|
|
45
|
+
}
|
|
46
|
+
else {
|
|
47
|
+
this.filter(value);
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
_onFilterClick() {
|
|
51
|
+
this._apply();
|
|
52
|
+
}
|
|
53
|
+
_onClearClick() {
|
|
54
|
+
if (this.input)
|
|
55
|
+
this.input.value = '';
|
|
56
|
+
this.clearFilter();
|
|
57
|
+
}
|
|
58
|
+
_onInputKeyDown(e) {
|
|
59
|
+
if (e.key == 'Enter') {
|
|
60
|
+
this._apply();
|
|
61
|
+
this.deactivate();
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
activate() {
|
|
65
|
+
super.activate();
|
|
66
|
+
if (this.input) {
|
|
67
|
+
this.input.value = this.currentValue ?? '';
|
|
68
|
+
}
|
|
69
|
+
setTimeout(() => this.input?.focus(), 100);
|
|
8
70
|
}
|
|
9
71
|
deactivate() {
|
|
10
|
-
|
|
72
|
+
super.deactivate();
|
|
11
73
|
}
|
|
12
|
-
}
|
|
74
|
+
};
|
|
75
|
+
NumberFilter.styles = [...BaseFilter.styles, css `
|
|
76
|
+
.filter-inner {
|
|
77
|
+
height: 100%;
|
|
78
|
+
display: flex;
|
|
79
|
+
flex-direction: row;
|
|
80
|
+
overflow: hidden;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
input {
|
|
84
|
+
border-width: 0;
|
|
85
|
+
outline: none;
|
|
86
|
+
height: 100%;
|
|
87
|
+
flex: 1;
|
|
88
|
+
width: 100%;
|
|
89
|
+
background-color: var(--og-background-color);
|
|
90
|
+
color: var(--og-text-color);
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
og-button {
|
|
94
|
+
flex: 0;
|
|
95
|
+
min-width: 18px;
|
|
96
|
+
max-width: 18px;
|
|
97
|
+
padding: 0;
|
|
98
|
+
text-align: center;
|
|
99
|
+
border-width: 0;
|
|
100
|
+
border-radius: 0;
|
|
101
|
+
height: 100%;
|
|
102
|
+
}
|
|
103
|
+
`];
|
|
104
|
+
NumberFilter = __decorate([
|
|
105
|
+
customElement(`${constants.PREFIX}-filter-number`)
|
|
106
|
+
], NumberFilter);
|
|
107
|
+
export { NumberFilter };
|
|
13
108
|
//# sourceMappingURL=numberFilter.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"numberFilter.js","sourceRoot":"","sources":["../../src/filters/numberFilter.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"numberFilter.js","sourceRoot":"","sources":["../../src/filters/numberFilter.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,SAAS,MAAM,cAAc,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C;;;;;;GAMG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QAgCE,aAAQ,GAAG,SAAS,EAAoB,CAAC;QAGzC,oBAAe,GAAG,SAAS,EAAqB,CAAC;QAGjD,mBAAc,GAAG,SAAS,EAAqB,CAAC;QA4BxD,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;YAER,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;;aAEjB,GAAG,CAAC,uFAAuF,CAAC;gBACzF,IAAI,CAAC,eAAe;cACtB,IAAI,CAAC,YAAsB,IAAI,EAAE;6CACF,GAAG,CAAC,IAAI,CAAC,eAAe,CAAC,gBAAgB,IAAI,CAAC,cAAc;yCAChE,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,gBAAgB,IAAI,CAAC,aAAa;;EAEjG,CAAC;IAcH,CAAC;IAzDA,IAAI,KAAK,KAAK,OAAO,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAA,CAAC,CAAC;IAG1C,IAAI,YAAY,KAAK,OAAO,IAAI,CAAC,eAAe,CAAC,KAAK,CAAA,CAAC,CAAC;IAGxD,IAAI,WAAW,KAAK,OAAO,IAAI,CAAC,cAAc,CAAC,KAAK,CAAA,CAAC,CAAC;IAE9C,MAAM;QACb,MAAM,KAAK,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC;QAC/C,IAAI,KAAK,KAAK,EAAE,EAAE,CAAC;YAClB,IAAI,CAAC,WAAW,EAAE,CAAC;QACpB,CAAC;aAAM,CAAC;YACP,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACpB,CAAC;IACF,CAAC;IAED,cAAc;QACb,IAAI,CAAC,MAAM,EAAE,CAAC;IACf,CAAC;IAED,aAAa;QACZ,IAAI,IAAI,CAAC,KAAK;YAAE,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,EAAE,CAAC;QACtC,IAAI,CAAC,WAAW,EAAE,CAAC;IACpB,CAAC;IAED,eAAe,CAAC,CAAgB;QAC/B,IAAI,CAAC,CAAC,GAAG,IAAI,OAAO,EAAE,CAAC;YACtB,IAAI,CAAC,MAAM,EAAE,CAAC;YACd,IAAI,CAAC,UAAU,EAAE,CAAC;QACnB,CAAC;IACF,CAAC;IAcD,QAAQ;QACP,KAAK,CAAC,QAAQ,EAAE,CAAC;QACjB,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YAChB,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,YAAsB,IAAI,EAAE,CAAC;QACtD,CAAC;QACD,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,GAAG,CAAC,CAAC;IAC5C,CAAC;IAED,UAAU;QACT,KAAK,CAAC,UAAU,EAAE,CAAC;IACpB,CAAC;;AAtFM,mBAAM,GAAG,CAAC,GAAG,UAAU,CAAC,MAAM,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4BzC,CAAC,AA5BW,CA4BV;AA9BS,YAAY;IADxB,aAAa,CAAC,GAAG,SAAS,CAAC,MAAM,gBAAgB,CAAC;GACtC,YAAY,CA0FxB","sourcesContent":["import constants from \"../constants\";\nimport { customElement } from 'lit/decorators.js';\nimport { BaseFilter } from \"./baseFilter\";\nimport { html, css } from 'lit';\nimport { createRef, ref } from 'lit/directives/ref.js';\nimport { msg } from '@omegagrid/localize';\n\n/**\n * Text-based filter for numeric columns. Instead of a range popup the user types an\n * expression such as `> 100`, `<10 or >20`, `>10 and <20`, `100..200`, `=42` (exact),\n * `!=5`, or a value list `1 2 3` (OR of exact matches). A single bare number is matched\n * as a plain text \"contains\" search. Parsing and matching are handled by grid-core's\n * `createCellMatcher`.\n */\n@customElement(`${constants.PREFIX}-filter-number`)\nexport class NumberFilter extends BaseFilter {\n\n\tstatic styles = [...BaseFilter.styles, css`\n\t\t.filter-inner {\n\t\t\theight: 100%;\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\toverflow: hidden;\n\t\t}\n\n\t\tinput {\n\t\t\tborder-width: 0;\n\t\t\toutline: none;\n\t\t\theight: 100%;\n\t\t\tflex: 1;\n\t\t\twidth: 100%;\n\t\t\tbackground-color: var(--og-background-color);\n\t\t\tcolor: var(--og-text-color);\n\t\t}\n\n\t\tog-button {\n\t\t\tflex: 0;\n\t\t\tmin-width: 18px;\n\t\t\tmax-width: 18px;\n\t\t\tpadding: 0;\n\t\t\ttext-align: center;\n\t\t\tborder-width: 0;\n\t\t\tborder-radius: 0;\n\t\t\theight: 100%;\n\t\t}\n\t`];\n\n\tprivate inputRef = createRef<HTMLInputElement>();\n\tget input() { return this.inputRef.value }\n\n\tprivate filterButtonRef = createRef<HTMLButtonElement>();\n\tget filterButton() { return this.filterButtonRef.value }\n\n\tprivate clearButtonRef = createRef<HTMLButtonElement>();\n\tget clearButton() { return this.clearButtonRef.value }\n\n\tprivate _apply() {\n\t\tconst value = (this.input?.value ?? '').trim();\n\t\tif (value === '') {\n\t\t\tthis.clearFilter();\n\t\t} else {\n\t\t\tthis.filter(value);\n\t\t}\n\t}\n\n\t_onFilterClick() {\n\t\tthis._apply();\n\t}\n\n\t_onClearClick() {\n\t\tif (this.input) this.input.value = '';\n\t\tthis.clearFilter();\n\t}\n\n\t_onInputKeyDown(e: KeyboardEvent) {\n\t\tif (e.key == 'Enter') {\n\t\t\tthis._apply();\n\t\t\tthis.deactivate();\n\t\t}\n\t}\n\n\trender = () => html`\n\t\t<div class=\"filter-inner\">\n\t\t\t<input ${ref(this.inputRef)}\n\t\t\t\ttype=\"text\"\n\t\t\t\ttitle=\"${msg('Examples: > 100, <10 or >20, >10 and <20, 100..200, 1 2 3, =42 (exact), 42 (contains)')}\"\n\t\t\t\t@keydown=\"${this._onInputKeyDown}\"\n\t\t\t\t.value=\"${this.currentValue as string ?? ''}\">\n\t\t\t<og-button icon=\"filter\" color=\"accent\" ${ref(this.filterButtonRef)} @mousedown=\"${this._onFilterClick}\"></og-button>\n\t\t\t<og-button icon=\"xmark\" color=\"red\" ${ref(this.clearButtonRef)} @mousedown=\"${this._onClearClick}\"></og-button>\n\t\t</div>\n\t`;\n\n\tactivate() {\n\t\tsuper.activate();\n\t\tif (this.input) {\n\t\t\tthis.input.value = this.currentValue as string ?? '';\n\t\t}\n\t\tsetTimeout(() => this.input?.focus(), 100);\n\t}\n\n\tdeactivate() {\n\t\tsuper.deactivate();\n\t}\n\n}\n"]}
|
|
@@ -14,6 +14,8 @@ export declare class RangeFilterPopup extends LitElement {
|
|
|
14
14
|
type: RangeFilterType;
|
|
15
15
|
private _from;
|
|
16
16
|
private _to;
|
|
17
|
+
constructor();
|
|
18
|
+
private _onPopupMouseDown;
|
|
17
19
|
setValues(from: RangeValue, to: RangeValue): void;
|
|
18
20
|
private _onFromDate;
|
|
19
21
|
private _onToDate;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"rangeFilterPopup.d.ts","sourceRoot":"","sources":["../../src/filters/rangeFilterPopup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAM5C,MAAM,MAAM,eAAe,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,IAAI,CAAC;AACtD,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;AAEvD,qBAAa,qBAAsB,SAAQ,KAAK;IAC5B,IAAI,EAAE,UAAU;IAAS,EAAE,EAAE,UAAU;gBAAvC,IAAI,EAAE,UAAU,EAAS,EAAE,EAAE,UAAU;CAG1D;AAED,qBAAa,qBAAsB,SAAQ,KAAK;;CAI/C;AAED,qBACa,gBAAiB,SAAQ,UAAU;IAE/C,MAAM,CAAC,MAAM,0BAkCX;IAGF,IAAI,EAAE,eAAe,CAAO;IAEnB,OAAO,CAAC,KAAK,CAAoB;IACjC,OAAO,CAAC,GAAG,CAAoB;
|
|
1
|
+
{"version":3,"file":"rangeFilterPopup.d.ts","sourceRoot":"","sources":["../../src/filters/rangeFilterPopup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAM5C,MAAM,MAAM,eAAe,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,IAAI,CAAC;AACtD,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;AAEvD,qBAAa,qBAAsB,SAAQ,KAAK;IAC5B,IAAI,EAAE,UAAU;IAAS,EAAE,EAAE,UAAU;gBAAvC,IAAI,EAAE,UAAU,EAAS,EAAE,EAAE,UAAU;CAG1D;AAED,qBAAa,qBAAsB,SAAQ,KAAK;;CAI/C;AAED,qBACa,gBAAiB,SAAQ,UAAU;IAE/C,MAAM,CAAC,MAAM,0BAkCX;IAGF,IAAI,EAAE,eAAe,CAAO;IAEnB,OAAO,CAAC,KAAK,CAAoB;IACjC,OAAO,CAAC,GAAG,CAAoB;;IAWxC,OAAO,CAAC,iBAAiB,CAKxB;IAED,SAAS,CAAC,IAAI,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU;IAK1C,OAAO,CAAC,WAAW,CAAqE;IACxF,OAAO,CAAC,SAAS,CAAmE;IAEpF,OAAO,CAAC,UAAU,CAGjB;IACD,OAAO,CAAC,QAAQ,CAGf;IAED,OAAO,CAAC,WAAW,CAAuE;IAC1F,OAAO,CAAC,SAAS,CAAqE;IAEtF,OAAO,CAAC,MAAM,CAEb;IAED,OAAO,CAAC,MAAM,CAIb;IAED,OAAO,CAAC,UAAU,CAKjB;IAED,OAAO,CAAC,UAAU;IAgBlB,MAAM;CAYN"}
|
|
@@ -22,10 +22,17 @@ export class RangeFilterClearEvent extends Event {
|
|
|
22
22
|
}
|
|
23
23
|
let RangeFilterPopup = class RangeFilterPopup extends LitElement {
|
|
24
24
|
constructor() {
|
|
25
|
-
super(
|
|
25
|
+
super();
|
|
26
26
|
this.type = 'n';
|
|
27
27
|
this._from = null;
|
|
28
28
|
this._to = null;
|
|
29
|
+
this._onPopupMouseDown = (e) => {
|
|
30
|
+
const path = e.composedPath();
|
|
31
|
+
this.renderRoot.querySelectorAll('og-calendar-dropdown').forEach(dd => {
|
|
32
|
+
if (dd.isOpen && !path.includes(dd) && !path.includes(dd.dropdown))
|
|
33
|
+
dd.close();
|
|
34
|
+
});
|
|
35
|
+
};
|
|
29
36
|
this._onFromDate = (e) => { this._from = e.value ?? null; };
|
|
30
37
|
this._onToDate = (e) => { this._to = e.value ?? null; };
|
|
31
38
|
this._onFromNum = (e) => {
|
|
@@ -52,6 +59,11 @@ let RangeFilterPopup = class RangeFilterPopup extends LitElement {
|
|
|
52
59
|
this._apply();
|
|
53
60
|
}
|
|
54
61
|
};
|
|
62
|
+
// Close an open calendar dropdown when clicking elsewhere in the popup. The popup
|
|
63
|
+
// content lives inside the outer dropdown container, which stops mousedown before it
|
|
64
|
+
// reaches document.body — so the calendar's own outside-click handler never fires for
|
|
65
|
+
// in-popup clicks. Handle it here, scoped to this popup, so the popup itself stays open.
|
|
66
|
+
this.addEventListener('mousedown', this._onPopupMouseDown);
|
|
55
67
|
}
|
|
56
68
|
setValues(from, to) {
|
|
57
69
|
this._from = from;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"rangeFilterPopup.js","sourceRoot":"","sources":["../../src/filters/rangeFilterPopup.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAC1C,OAAO,SAAS,MAAM,cAAc,CAAC;AAKrC,MAAM,OAAO,qBAAsB,SAAQ,KAAK;IAC/C,YAAmB,IAAgB,EAAS,EAAc;QACzD,KAAK,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;QADjC,SAAI,GAAJ,IAAI,CAAY;QAAS,OAAE,GAAF,EAAE,CAAY;IAE1D,CAAC;CACD;AAED,MAAM,OAAO,qBAAsB,SAAQ,KAAK;IAC/C;QACC,KAAK,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IACpD,CAAC;CACD;AAGM,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,UAAU;
|
|
1
|
+
{"version":3,"file":"rangeFilterPopup.js","sourceRoot":"","sources":["../../src/filters/rangeFilterPopup.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { Dropdown, events } from '@omegagrid/core';\nimport { msg } from '@omegagrid/localize';\nimport constants from '../constants';\n\nexport type RangeFilterType = 'n' | 'd' | 'dt' | 'tm';\nexport type RangeValue = Date | number | string | null;\n\nexport class RangeFilterApplyEvent extends Event {\n\tconstructor(public from: RangeValue, public to: RangeValue) {\n\t\tsuper('apply', { bubbles: false, composed: true });\n\t}\n}\n\nexport class RangeFilterClearEvent extends Event {\n\tconstructor() {\n\t\tsuper('clear', { bubbles: false, composed: true });\n\t}\n}\n\n@customElement(`${constants.PREFIX}-filter-range-popup`)\nexport class RangeFilterPopup extends LitElement {\n\n\tstatic styles = css`\n\t\t:host {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\tgap: 5px;\n\t\t\tpadding: 6px;\n\t\t\tmin-width: 200px;\n\t\t}\n\n\t\t.row {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\talign-items: center;\n\t\t\tgap: 6px;\n\t\t}\n\n\t\t.row > label {\n\t\t\tflex: 0 0 28px;\n\t\t}\n\n\t\t.row > og-calendar-dropdown,\n\t\t.row > og-numericinput,\n\t\t.row > og-input {\n\t\t\tflex: 1;\n\t\t\tmin-width: 0;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t.actions {\n\t\t\tdisplay: flex;\n\t\t\tjustify-content: flex-end;\n\t\t\tgap: 4px;\n\t\t\tmargin-top: 4px;\n\t\t}\n\t`;\n\n\t@property({ type: String })\n\ttype: RangeFilterType = 'n';\n\n\t@state() private _from: RangeValue = null;\n\t@state() private _to: RangeValue = null;\n\n\tconstructor() {\n\t\tsuper();\n\t\t// Close an open calendar dropdown when clicking elsewhere in the popup. The popup\n\t\t// content lives inside the outer dropdown container, which stops mousedown before it\n\t\t// reaches document.body — so the calendar's own outside-click handler never fires for\n\t\t// in-popup clicks. Handle it here, scoped to this popup, so the popup itself stays open.\n\t\tthis.addEventListener('mousedown', this._onPopupMouseDown);\n\t}\n\n\tprivate _onPopupMouseDown = (e: MouseEvent) => {\n\t\tconst path = e.composedPath();\n\t\tthis.renderRoot.querySelectorAll<Dropdown>('og-calendar-dropdown').forEach(dd => {\n\t\t\tif (dd.isOpen && !path.includes(dd) && !path.includes(dd.dropdown)) dd.close();\n\t\t});\n\t}\n\n\tsetValues(from: RangeValue, to: RangeValue) {\n\t\tthis._from = from;\n\t\tthis._to = to;\n\t}\n\n\tprivate _onFromDate = (e: events.ChangeEvent<Date>) => { this._from = e.value ?? null; }\n\tprivate _onToDate = (e: events.ChangeEvent<Date>) => { this._to = e.value ?? null; }\n\n\tprivate _onFromNum = (e: Event) => {\n\t\tconst v = (e.target as unknown as { value: number }).value;\n\t\tthis._from = v == null || Number.isNaN(v) ? null : v;\n\t}\n\tprivate _onToNum = (e: Event) => {\n\t\tconst v = (e.target as unknown as { value: number }).value;\n\t\tthis._to = v == null || Number.isNaN(v) ? null : v;\n\t}\n\n\tprivate _onFromText = (e: events.ChangeEvent<string>) => { this._from = e.value || null; }\n\tprivate _onToText = (e: events.ChangeEvent<string>) => { this._to = e.value || null; }\n\n\tprivate _apply = () => {\n\t\tthis.dispatchEvent(new RangeFilterApplyEvent(this._from, this._to));\n\t}\n\n\tprivate _clear = () => {\n\t\tthis._from = null;\n\t\tthis._to = null;\n\t\tthis.dispatchEvent(new RangeFilterClearEvent());\n\t}\n\n\tprivate _onKeyDown = (e: KeyboardEvent) => {\n\t\tif (e.key === 'Enter') {\n\t\t\te.stopPropagation();\n\t\t\tthis._apply();\n\t\t}\n\t}\n\n\tprivate _renderRow(label: string, value: RangeValue, which: 'from' | 'to') {\n\t\tlet control;\n\t\tif (this.type === 'd' || this.type === 'dt') {\n\t\t\tconst onChange = which === 'from' ? this._onFromDate : this._onToDate;\n\t\t\tcontrol = html`<og-calendar-dropdown cross buttonInput .value=\"${value as Date | null}\" @change=\"${onChange}\"></og-calendar-dropdown>`;\n\t\t} else if (this.type === 'tm') {\n\t\t\t// TODO: change to time picker when available\n\t\t\tconst onChange = which === 'from' ? this._onFromText : this._onToText;\n\t\t\tcontrol = html`<og-input .value=\"${(value ?? '') as string}\" @change=\"${onChange}\"></og-input>`;\n\t\t} else {\n\t\t\tconst onChange = which === 'from' ? this._onFromNum : this._onToNum;\n\t\t\tcontrol = html`<og-numericinput buttons .value=\"${value as number | null}\" @change=\"${onChange}\"></og-numericinput>`;\n\t\t}\n\t\treturn html`<div class=\"row\"><label>${label}</label>${control}</div>`;\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<div @keydown=\"${this._onKeyDown}\" style=\"display: contents;\">\n\t\t\t\t${this._renderRow(msg('From'), this._from, 'from')}\n\t\t\t\t${this._renderRow(msg('To'), this._to, 'to')}\n\t\t\t\t<div class=\"actions\">\n\t\t\t\t\t<og-button icon=\"check\" color=\"accent\" text=\"${msg('Apply')}\" @click=\"${this._apply}\"></og-button>\n\t\t\t\t\t<og-button icon=\"xmark\" color=\"red\" text=\"${msg('Clear')}\" @click=\"${this._clear}\"></og-button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`;\n\t}\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@omegagrid/grid",
|
|
3
|
-
"version": "0.10.
|
|
3
|
+
"version": "0.10.63",
|
|
4
4
|
"license": "UNLICENSED",
|
|
5
5
|
"description": "Universal datagrid component",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -35,12 +35,12 @@
|
|
|
35
35
|
"_prepublish": "yarn test && yarn lint"
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@omegagrid/commands": "^0.10.
|
|
39
|
-
"@omegagrid/core": "^0.10.
|
|
40
|
-
"@omegagrid/grid-core": "^0.10.
|
|
41
|
-
"@omegagrid/localize": "^0.10.
|
|
42
|
-
"@omegagrid/tabs": "^0.10.
|
|
43
|
-
"@omegagrid/tree": "^0.10.
|
|
38
|
+
"@omegagrid/commands": "^0.10.63",
|
|
39
|
+
"@omegagrid/core": "^0.10.63",
|
|
40
|
+
"@omegagrid/grid-core": "^0.10.63",
|
|
41
|
+
"@omegagrid/localize": "^0.10.63",
|
|
42
|
+
"@omegagrid/tabs": "^0.10.63",
|
|
43
|
+
"@omegagrid/tree": "^0.10.63",
|
|
44
44
|
"@stdlib/stats": "^0.0.13",
|
|
45
45
|
"date-fns": "^3.2.0",
|
|
46
46
|
"lit": "^3.1.1",
|