@myrmidon/paged-data-browsers 1.1.1 → 2.0.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/README.md +92 -0
- package/esm2022/lib/components/browser-tree-node/browser-tree-node.component.mjs +11 -5
- package/esm2022/lib/components/compact-pager/compact-pager.component.mjs +3 -3
- package/esm2022/lib/components/range-view/range-view.component.mjs +3 -3
- package/esm2022/lib/paged-data-browsers.module.mjs +4 -4
- package/esm2022/lib/services/paged-tree.store.mjs +60 -86
- package/fesm2022/myrmidon-paged-data-browsers.mjs +79 -99
- package/fesm2022/myrmidon-paged-data-browsers.mjs.map +1 -1
- package/lib/components/browser-tree-node/browser-tree-node.component.d.ts +5 -1
- package/lib/services/paged-tree.store.d.ts +42 -29
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -5,3 +5,95 @@ This library provides simple components to display filtered and paged data from
|
|
|
5
5
|
There are currently two components, one for displaying a flat list of data, and another to display hierarchically structured data, combining a tree view with paging.
|
|
6
6
|
|
|
7
7
|
Also, there is a LRU cache service and a compact pager used in the paged tree component.
|
|
8
|
+
|
|
9
|
+
## Paged Tree
|
|
10
|
+
|
|
11
|
+
### Services
|
|
12
|
+
|
|
13
|
+
The core of the tree is a `PagedTreeStore`.
|
|
14
|
+
|
|
15
|
+
Tree **nodes** extend interface `TreeNode`, having:
|
|
16
|
+
|
|
17
|
+
- `id`
|
|
18
|
+
- `parentId`
|
|
19
|
+
- `y` and `x`
|
|
20
|
+
- `label`
|
|
21
|
+
- `tag`
|
|
22
|
+
- `hasChildren`
|
|
23
|
+
|
|
24
|
+
The corresponding **node filter** (`TreeNodeFilter`) has `tags` and `parentId`, both optional. Your filters will extend this one, just like your nodes extend `TreeNode`.
|
|
25
|
+
|
|
26
|
+
A **paged tree node** (`PagedTreeNode<F>` where `F` is `TreeNodeFilter` or any extension of it) extends a `TreeNode` by adding paging (`PagingInfo`: page number, count and total items), filtering, and expansion state. All the nodes entering the store are enriched with such data, thus becoming paged nodes.
|
|
27
|
+
|
|
28
|
+
The **service** which fetches nodes into the store is `PagedTreeStoreService<F>`. It provides a single method, `getNodes(filter, pageNumber, pageSize, hasMockRoot?)` to get the specified page of nodes.
|
|
29
|
+
|
|
30
|
+
The **paged tree store** (`PagedTreeStore<E,F>` where `E`=paged tree node and `F`=node filter) is the local store for tree nodes. Its ideal hierarchy is:
|
|
31
|
+
|
|
32
|
+
- *radix*: a single, static radix node (Y=0, X=1) including all the other nodes. This is like the ground where one or more trees can be planted. Each tree is identified by a node's tag.
|
|
33
|
+
- *roots*: the direct children of the radix (Y=1, X=1-N).
|
|
34
|
+
- other descendant nodes, each with a higher Y level.
|
|
35
|
+
|
|
36
|
+
The essential store data are:
|
|
37
|
+
|
|
38
|
+
- flat list of paged nodes (`nodes$`).
|
|
39
|
+
- list of tree tags (`tags$`).
|
|
40
|
+
- global filter (`filter$`). This gets combined with (overridden by) node-specific filters, when specified. You can set it with `setFilter`. To set the filter for the children of a specific node use `setNodeFilter`.
|
|
41
|
+
- page size (`pageSize`), get/set property.
|
|
42
|
+
|
|
43
|
+
To initialize the store, you call `reset`, which loads root nodes (via its service's `getRootNodes`) and their direct children. When getting the children for each root node, an internal cache is used to minimize server fetches (via `getPageFromCacheOrServer`). The nodes got from the service are enriched with data required as paged tree nodes (paging, filtering, expansion).
|
|
44
|
+
|
|
45
|
+
>Methods related to the cache are `clearCache()` and `hasCachedPage(pageNumber, filter)`.
|
|
46
|
+
|
|
47
|
+
Nodes are managed in the tree with:
|
|
48
|
+
|
|
49
|
+
- `expand(id)`
|
|
50
|
+
- `expandAll(id)`
|
|
51
|
+
- `getChildren(id)`
|
|
52
|
+
- `getNodes()`
|
|
53
|
+
- `getRootNode()`
|
|
54
|
+
- `isEmtpy()`
|
|
55
|
+
- `collapse(id)`
|
|
56
|
+
- `collapseAll()`
|
|
57
|
+
- `changePage(parentId, pageNumber)`
|
|
58
|
+
- `setFilter(filter)`
|
|
59
|
+
- `setNodeFilter(id, filter)`
|
|
60
|
+
- `reset()`
|
|
61
|
+
|
|
62
|
+
### Component
|
|
63
|
+
|
|
64
|
+
The component for visualizing each single **node** of the paged tree is `BrowserTreeNodeComponent`. This wraps some HTML content providing a toggle button to expand/collapse the node, a paging control for the node's children, and a button to edit the node's filter. You should then provide the HTML content to display the node's data inside this component, e.g.:
|
|
65
|
+
|
|
66
|
+
```html
|
|
67
|
+
<pdb-browser-tree-node [node]="node">
|
|
68
|
+
<your-node-view [node]="node" />
|
|
69
|
+
<pdb-browser-tree-node>
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
This component API has:
|
|
73
|
+
|
|
74
|
+
- ➡️ `node` of type `PagedTreeNode`.
|
|
75
|
+
- ➡️ `paging` (`PagingInfo`) with optional data about children nodes paging.
|
|
76
|
+
- ➡️ `debug` (`boolean`) flag to toggle debug information in the view.
|
|
77
|
+
- ➡️ `hideLabel` (`boolean`) flag to hide the node's loc and label. This is useful if you want to provide your own view for the node, between the expansion toggle and the filter edit button. In this case, in your consumer template provide your own view as the content of this component. If instead you are fine with the default loc and label, and just want to add more data to the view, then you can just add your own content to this component's template, without setting this property to true.
|
|
78
|
+
- ➡️ `hidePaging` (`boolean`): true to hide the node's paging control unless hovered.
|
|
79
|
+
- 🔥 `toggleExpandedRequest` (`PagedTreeNode`): emitted when the user wants to toggle the expanded state of the node.
|
|
80
|
+
- 🔥 `changePageRequest` (`PageChangeRequest`): emitted when the user wants to change the page number of the node's children.
|
|
81
|
+
- 🔥 `editNodeFilterRequest` (`PagedTreeNode`): emitted when the user wants to edit the node's filter for its children.
|
|
82
|
+
|
|
83
|
+
You should provide your components for:
|
|
84
|
+
|
|
85
|
+
- the node's filters component. This is used both for global and node-specific filters (in the latter case as a popup).
|
|
86
|
+
- the tree browser component. This combines:
|
|
87
|
+
- a filters component for global filters. This dummy component gets a `filter$` and emits `filterChange`.
|
|
88
|
+
- a tree view.
|
|
89
|
+
|
|
90
|
+
The tree browser component uses a nested instance of `PagedTreeStore<N,F>`, typically injected via a middleman service like the sample `PagedTreeBrowserService`, which provides a new instance of the store to the component. The component orchestrates:
|
|
91
|
+
|
|
92
|
+
- `filter$` (observable of filters). This simply binds to the global filter of the nested store.
|
|
93
|
+
- `nodes$` (observable of paged tree nodes). Each of these nodes is displayed via a `BrowserTreeNodeComponent`. This simply binds to the nodes from the nested store, so these are all the nodes present in it. They are displayed in a list with various amounts of indentation representing the tree's hierarchy.
|
|
94
|
+
- page change requests
|
|
95
|
+
- filter change requests
|
|
96
|
+
- expand/collapse requests
|
|
97
|
+
- reset requests
|
|
98
|
+
|
|
99
|
+
All the requests are accomplished by virtue of the nested store.
|
|
@@ -31,6 +31,10 @@ export class BrowserTreeNodeComponent {
|
|
|
31
31
|
this._node = value;
|
|
32
32
|
}
|
|
33
33
|
constructor() {
|
|
34
|
+
/**
|
|
35
|
+
* The indent size for the node's children.
|
|
36
|
+
*/
|
|
37
|
+
this.indentSize = 30;
|
|
34
38
|
this.toggleExpandedRequest = new EventEmitter();
|
|
35
39
|
this.changePageRequest = new EventEmitter();
|
|
36
40
|
this.editNodeFilterRequest = new EventEmitter();
|
|
@@ -52,12 +56,12 @@ export class BrowserTreeNodeComponent {
|
|
|
52
56
|
this.editNodeFilterRequest.emit(this._node);
|
|
53
57
|
}
|
|
54
58
|
}
|
|
55
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.
|
|
56
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.
|
|
59
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: BrowserTreeNodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
60
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.6", type: BrowserTreeNodeComponent, selector: "pdb-browser-tree-node", inputs: { node: "node", paging: "paging", debug: "debug", hideLabel: "hideLabel", hidePaging: "hidePaging", indentSize: "indentSize" }, outputs: { toggleExpandedRequest: "toggleExpandedRequest", changePageRequest: "changePageRequest", editNodeFilterRequest: "editNodeFilterRequest" }, ngImport: i0, template: "@if (node) {\n<div id=\"node\" [style.margin-left.px]=\"(node.y - 1) * indentSize\">\n <!-- pager -->\n @if ($any(node).expanded && paging && paging.pageCount > 1) {\n <div id=\"pager\" [style.display]=\"hidePaging ? 'inherit' : 'block'\">\n <pdb-compact-pager\n [paging]=\"paging\"\n (pagingChange)=\"onPagingChange($any(node), $event)\"\n />\n <pdb-range-view\n [width]=\"250\"\n [domain]=\"[0, paging.pageCount]\"\n [range]=\"[paging.pageNumber - 1, paging.pageNumber]\"\n />\n </div>\n }\n <!-- node -->\n <div class=\"form-row\">\n <!-- expand/collapse button -->\n <button\n type=\"button\"\n mat-icon-button\n [matTooltip]=\"$any(node).expanded ? 'Collapse' : 'Expand'\"\n [disabled]=\"node.hasChildren === false\"\n (click)=\"onToggleExpanded()\"\n >\n <mat-icon class=\"mat-primary\">{{\n node.hasChildren === true || node.hasChildren === undefined\n ? $any(node).expanded\n ? \"expand_less\"\n : \"expand_more\"\n : \"stop\"\n }}</mat-icon>\n </button>\n\n <!-- tag -->\n @if (!hideLabel) {\n <span\n class=\"tag\"\n [ngStyle]=\"{\n 'background-color': (node.tag | stringToColor),\n color: node.tag | stringToColor | colorToContrast\n }\"\n >{{ node.tag }}</span\n >\n\n <!-- loc and label -->\n <span class=\"loc\">{{ node.y }}.{{ node.x }}</span> - {{ node.label }}\n }\n\n <!-- PROJECTED NODE -->\n <ng-content></ng-content>\n\n <!-- debug -->\n @if (debug) {\n <span class=\"debug\"\n >#{{ node.id }}\n <span\n >| {{ $any(node).paging.pageNumber }}/{{\n $any(node).paging.pageCount\n }}\n ({{ $any(node).paging.total }})</span\n ></span\n >\n }\n\n <!-- filter -->\n @if (!$any(node).filter && node.y) {\n <div class=\"muted\">\n <button\n type=\"button\"\n mat-icon-button\n matTooltip=\"Add filter\"\n (click)=\"onEditFilter()\"\n >\n <mat-icon>filter_list</mat-icon>\n </button>\n </div>\n } @if ($any(node).filter && node.y) {\n <div class=\"muted\">\n <button type=\"button\" mat-icon-button (click)=\"onEditFilter()\">\n <mat-icon [matBadge]=\"$any(node).filter ? 'F' : ''\"\n >filter_alt</mat-icon\n >\n </button>\n </div>\n }\n </div>\n</div>\n}\n", styles: [".form-row{display:flex;gap:8px;align-items:center}.form-row *{flex:0 0 auto}.form-row span{flex:0 1 auto;white-space:normal}#node #pager{display:none}#node:hover #pager{display:block}#node{margin-bottom:4px;padding:4px 6px;border:1px solid #98a8d4;border-radius:6px}#node:hover{background-color:#d6dee9}span.loc{font-size:.85em;color:#666;vertical-align:middle}span.tag{border:1px solid #aaa;border-radius:4px;padding:0 4px}fieldset{border:1px solid silver;border-radius:6px;padding:4px 6px;margin:4px 0}legend{color:silver}.muted{opacity:.3}.muted:hover{opacity:1}.debug{font-size:.85em;color:#9c3d3e}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i6.CompactPagerComponent, selector: "pdb-compact-pager", inputs: ["paging"], outputs: ["pagingChange"] }, { kind: "component", type: i7.RangeViewComponent, selector: "pdb-range-view", inputs: ["domain", "range", "width", "height"] }, { kind: "pipe", type: i8.ColorToContrastPipe, name: "colorToContrast" }, { kind: "pipe", type: i8.StringToColorPipe, name: "stringToColor" }] }); }
|
|
57
61
|
}
|
|
58
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.
|
|
62
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: BrowserTreeNodeComponent, decorators: [{
|
|
59
63
|
type: Component,
|
|
60
|
-
args: [{ selector: 'pdb-browser-tree-node', template: "@if (node) {\n<div id=\"node\" [style.margin-left.px]=\"(node.y - 1)
|
|
64
|
+
args: [{ selector: 'pdb-browser-tree-node', template: "@if (node) {\n<div id=\"node\" [style.margin-left.px]=\"(node.y - 1) * indentSize\">\n <!-- pager -->\n @if ($any(node).expanded && paging && paging.pageCount > 1) {\n <div id=\"pager\" [style.display]=\"hidePaging ? 'inherit' : 'block'\">\n <pdb-compact-pager\n [paging]=\"paging\"\n (pagingChange)=\"onPagingChange($any(node), $event)\"\n />\n <pdb-range-view\n [width]=\"250\"\n [domain]=\"[0, paging.pageCount]\"\n [range]=\"[paging.pageNumber - 1, paging.pageNumber]\"\n />\n </div>\n }\n <!-- node -->\n <div class=\"form-row\">\n <!-- expand/collapse button -->\n <button\n type=\"button\"\n mat-icon-button\n [matTooltip]=\"$any(node).expanded ? 'Collapse' : 'Expand'\"\n [disabled]=\"node.hasChildren === false\"\n (click)=\"onToggleExpanded()\"\n >\n <mat-icon class=\"mat-primary\">{{\n node.hasChildren === true || node.hasChildren === undefined\n ? $any(node).expanded\n ? \"expand_less\"\n : \"expand_more\"\n : \"stop\"\n }}</mat-icon>\n </button>\n\n <!-- tag -->\n @if (!hideLabel) {\n <span\n class=\"tag\"\n [ngStyle]=\"{\n 'background-color': (node.tag | stringToColor),\n color: node.tag | stringToColor | colorToContrast\n }\"\n >{{ node.tag }}</span\n >\n\n <!-- loc and label -->\n <span class=\"loc\">{{ node.y }}.{{ node.x }}</span> - {{ node.label }}\n }\n\n <!-- PROJECTED NODE -->\n <ng-content></ng-content>\n\n <!-- debug -->\n @if (debug) {\n <span class=\"debug\"\n >#{{ node.id }}\n <span\n >| {{ $any(node).paging.pageNumber }}/{{\n $any(node).paging.pageCount\n }}\n ({{ $any(node).paging.total }})</span\n ></span\n >\n }\n\n <!-- filter -->\n @if (!$any(node).filter && node.y) {\n <div class=\"muted\">\n <button\n type=\"button\"\n mat-icon-button\n matTooltip=\"Add filter\"\n (click)=\"onEditFilter()\"\n >\n <mat-icon>filter_list</mat-icon>\n </button>\n </div>\n } @if ($any(node).filter && node.y) {\n <div class=\"muted\">\n <button type=\"button\" mat-icon-button (click)=\"onEditFilter()\">\n <mat-icon [matBadge]=\"$any(node).filter ? 'F' : ''\"\n >filter_alt</mat-icon\n >\n </button>\n </div>\n }\n </div>\n</div>\n}\n", styles: [".form-row{display:flex;gap:8px;align-items:center}.form-row *{flex:0 0 auto}.form-row span{flex:0 1 auto;white-space:normal}#node #pager{display:none}#node:hover #pager{display:block}#node{margin-bottom:4px;padding:4px 6px;border:1px solid #98a8d4;border-radius:6px}#node:hover{background-color:#d6dee9}span.loc{font-size:.85em;color:#666;vertical-align:middle}span.tag{border:1px solid #aaa;border-radius:4px;padding:0 4px}fieldset{border:1px solid silver;border-radius:6px;padding:4px 6px;margin:4px 0}legend{color:silver}.muted{opacity:.3}.muted:hover{opacity:1}.debug{font-size:.85em;color:#9c3d3e}\n"] }]
|
|
61
65
|
}], ctorParameters: () => [], propDecorators: { node: [{
|
|
62
66
|
type: Input
|
|
63
67
|
}], paging: [{
|
|
@@ -68,6 +72,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.3", ngImpor
|
|
|
68
72
|
type: Input
|
|
69
73
|
}], hidePaging: [{
|
|
70
74
|
type: Input
|
|
75
|
+
}], indentSize: [{
|
|
76
|
+
type: Input
|
|
71
77
|
}], toggleExpandedRequest: [{
|
|
72
78
|
type: Output
|
|
73
79
|
}], changePageRequest: [{
|
|
@@ -75,4 +81,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.3", ngImpor
|
|
|
75
81
|
}], editNodeFilterRequest: [{
|
|
76
82
|
type: Output
|
|
77
83
|
}] } });
|
|
78
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
84
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnJvd3Nlci10cmVlLW5vZGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbXlybWlkb24vcGFnZWQtZGF0YS1icm93c2Vycy9zcmMvbGliL2NvbXBvbmVudHMvYnJvd3Nlci10cmVlLW5vZGUvYnJvd3Nlci10cmVlLW5vZGUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbXlybWlkb24vcGFnZWQtZGF0YS1icm93c2Vycy9zcmMvbGliL2NvbXBvbmVudHMvYnJvd3Nlci10cmVlLW5vZGUvYnJvd3Nlci10cmVlLW5vZGUuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQzs7Ozs7Ozs7OztBQVN2RTs7Ozs7Ozs7R0FRRztBQU1ILE1BQU0sT0FBTyx3QkFBd0I7SUFHbkM7O09BRUc7SUFDSCxJQUNXLElBQUk7UUFDYixPQUFPLElBQUksQ0FBQyxLQUFLLENBQUM7SUFDcEIsQ0FBQztJQUVELElBQVcsSUFBSSxDQUFDLEtBQTRDO1FBQzFELElBQUksSUFBSSxDQUFDLEtBQUssS0FBSyxLQUFLLEVBQUUsQ0FBQztZQUN6QixPQUFPO1FBQ1QsQ0FBQztRQUNELElBQUksQ0FBQyxLQUFLLEdBQUcsS0FBSyxDQUFDO0lBQ3JCLENBQUM7SUFxREQ7UUFyQkE7O1dBRUc7UUFFSSxlQUFVLEdBQUcsRUFBRSxDQUFDO1FBa0JyQixJQUFJLENBQUMscUJBQXFCLEdBQUcsSUFBSSxZQUFZLEVBQXNCLENBQUM7UUFDcEUsSUFBSSxDQUFDLGlCQUFpQixHQUFHLElBQUksWUFBWSxFQUFxQixDQUFDO1FBQy9ELElBQUksQ0FBQyxxQkFBcUIsR0FBRyxJQUFJLFlBQVksRUFBc0IsQ0FBQztJQUN0RSxDQUFDO0lBRU0sZ0JBQWdCO1FBQ3JCLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDaEIsT0FBTztRQUNULENBQUM7UUFDRCxJQUFJLENBQUMscUJBQXFCLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUEyQixDQUFDLENBQUM7SUFDcEUsQ0FBQztJQUVNLGNBQWMsQ0FBQyxJQUF3QixFQUFFLE1BQWtCO1FBQ2hFLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxJQUFJLENBQUM7WUFDMUIsSUFBSTtZQUNKLE1BQU07U0FDUCxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRU0sWUFBWTtRQUNqQixJQUFJLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztZQUNmLElBQUksQ0FBQyxxQkFBcUIsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzlDLENBQUM7SUFDSCxDQUFDOzhHQTdGVSx3QkFBd0I7a0dBQXhCLHdCQUF3QiwwVkN2QnJDLHU0RUEwRkE7OzJGRG5FYSx3QkFBd0I7a0JBTHBDLFNBQVM7K0JBQ0UsdUJBQXVCO3dEQVd0QixJQUFJO3NCQURkLEtBQUs7Z0JBZ0JOLE1BQU07c0JBREwsS0FBSztnQkFPQyxLQUFLO3NCQURYLEtBQUs7Z0JBYUMsU0FBUztzQkFEZixLQUFLO2dCQU9DLFVBQVU7c0JBRGhCLEtBQUs7Z0JBT0MsVUFBVTtzQkFEaEIsS0FBSztnQkFPQyxxQkFBcUI7c0JBRDNCLE1BQU07Z0JBT0EsaUJBQWlCO3NCQUR2QixNQUFNO2dCQUlBLHFCQUFxQjtzQkFEM0IsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IFBhZ2VkVHJlZU5vZGUsIFBhZ2luZ0luZm8gfSBmcm9tICcuLi8uLi9zZXJ2aWNlcy9wYWdlZC10cmVlLnN0b3JlJztcblxuZXhwb3J0IGludGVyZmFjZSBQYWdlQ2hhbmdlUmVxdWVzdCB7XG4gIG5vZGU6IFBhZ2VkVHJlZU5vZGU8YW55PjtcbiAgcGFnaW5nOiBQYWdpbmdJbmZvO1xufVxuXG4vKipcbiAqIEJyb3dzZXIgdHJlZSBub2RlIGNvbXBvbmVudCB2aWV3LiBUaGlzIHdyYXBzIHNvbWUgSFRNTCBjb250ZW50IHByb3ZpZGluZ1xuICogYSB0b2dnbGUgYnV0dG9uIHRvIGV4cGFuZC9jb2xsYXBzZSB0aGUgbm9kZSwgYSBwYWdpbmcgY29udHJvbCBmb3IgdGhlXG4gKiBub2RlJ3MgY2hpbGRyZW4sIGFuZCBhIGJ1dHRvbiB0byBlZGl0IHRoZSBub2RlJ3MgZmlsdGVyLiBZb3Ugc2hvdWxkIHRoZW5cbiAqIHByb3ZpZGUgdGhlIEhUTUwgY29udGVudCB0byBkaXNwbGF5IHRoZSBub2RlJ3MgZGF0YSBpbnNpZGUgdGhpcyBjb21wb25lbnQsIGUuZy5cbiAqIDxwZGItYnJvd3Nlci10cmVlLW5vZGUgW25vZGVdPVwibm9kZVwiPlxuICogICA8eW91ci1ub2RlLXZpZXcgW25vZGVdPVwibm9kZVwiIC8+XG4gKiA8cGRiLWJyb3dzZXItdHJlZS1ub2RlPlxuICovXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdwZGItYnJvd3Nlci10cmVlLW5vZGUnLFxuICB0ZW1wbGF0ZVVybDogJy4vYnJvd3Nlci10cmVlLW5vZGUuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9icm93c2VyLXRyZWUtbm9kZS5jb21wb25lbnQuY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIEJyb3dzZXJUcmVlTm9kZUNvbXBvbmVudCB7XG4gIHByaXZhdGUgX25vZGU6IFBhZ2VkVHJlZU5vZGU8YW55PiB8IHVuZGVmaW5lZCB8IG51bGw7XG5cbiAgLyoqXG4gICAqIFRoZSBub2RlIHRvIGRpc3BsYXkuXG4gICAqL1xuICBASW5wdXQoKVxuICBwdWJsaWMgZ2V0IG5vZGUoKTogUGFnZWRUcmVlTm9kZTxhbnk+IHwgdW5kZWZpbmVkIHwgbnVsbCB7XG4gICAgcmV0dXJuIHRoaXMuX25vZGU7XG4gIH1cblxuICBwdWJsaWMgc2V0IG5vZGUodmFsdWU6IFBhZ2VkVHJlZU5vZGU8YW55PiB8IHVuZGVmaW5lZCB8IG51bGwpIHtcbiAgICBpZiAodGhpcy5fbm9kZSA9PT0gdmFsdWUpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgdGhpcy5fbm9kZSA9IHZhbHVlO1xuICB9XG5cbiAgLyoqXG4gICAqIFRoZSBwYWdpbmcgaW5mb3JtYXRpb24gZm9yIHRoZSBub2RlJ3MgY2hpbGRyZW4uXG4gICAqL1xuICBASW5wdXQoKVxuICBwYWdpbmc/OiBQYWdpbmdJbmZvO1xuXG4gIC8qKlxuICAgKiBUcnVlIHRvIHNob3cgZGVidWcgaW5mb3JtYXRpb24uXG4gICAqL1xuICBASW5wdXQoKVxuICBwdWJsaWMgZGVidWc/OiBib29sZWFuO1xuXG4gIC8qKlxuICAgKiBUcnVlIHRvIGhpZGUgdGhlIG5vZGUncyBsb2MgYW5kIGxhYmVsLiBUaGlzIGlzIHVzZWZ1bCBpZiB5b3Ugd2FudCB0b1xuICAgKiBwcm92aWRlIHlvdXIgb3duIHZpZXcgZm9yIHRoZSBub2RlLCBiZXR3ZWVuIHRoZSBleHBhbnNpb24gdG9nZ2xlIGFuZFxuICAgKiB0aGUgZmlsdGVyIGVkaXQgYnV0dG9uLiBJbiB0aGlzIGNhc2UsIGluIHlvdXIgY29uc3VtZXIgdGVtcGxhdGUgcHJvdmlkZVxuICAgKiB5b3VyIG93biB2aWV3IGFzIHRoZSBjb250ZW50IG9mIHRoaXMgY29tcG9uZW50LiBJZiBpbnN0ZWFkIHlvdSBhcmUgZmluZVxuICAgKiB3aXRoIHRoZSBkZWZhdWx0IGxvYyBhbmQgbGFiZWwsIGFuZCBqdXN0IHdhbnQgdG8gYWRkIG1vcmUgZGF0YSB0b1xuICAgKiB0aGUgdmlldywgdGhlbiB5b3UgY2FuIGp1c3QgYWRkIHlvdXIgb3duIGNvbnRlbnQgdG8gdGhpcyBjb21wb25lbnQnc1xuICAgKiB0ZW1wbGF0ZSwgd2l0aG91dCBzZXR0aW5nIHRoaXMgcHJvcGVydHkgdG8gdHJ1ZS5cbiAgICovXG4gIEBJbnB1dCgpXG4gIHB1YmxpYyBoaWRlTGFiZWw/OiBib29sZWFuO1xuXG4gIC8qKlxuICAgKiBUcnVlIHRvIGhpZGUgdGhlIG5vZGUncyBwYWdpbmcgY29udHJvbCB1bmxlc3MgaG92ZXJlZC5cbiAgICovXG4gIEBJbnB1dCgpXG4gIHB1YmxpYyBoaWRlUGFnaW5nPzogYm9vbGVhbjtcblxuICAvKipcbiAgICogVGhlIGluZGVudCBzaXplIGZvciB0aGUgbm9kZSdzIGNoaWxkcmVuLlxuICAgKi9cbiAgQElucHV0KClcbiAgcHVibGljIGluZGVudFNpemUgPSAzMDtcblxuICAvKipcbiAgICogRW1pdHMgd2hlbiB0aGUgdXNlciB3YW50cyB0byB0b2dnbGUgdGhlIGV4cGFuZGVkIHN0YXRlIG9mIHRoZSBub2RlLlxuICAgKi9cbiAgQE91dHB1dCgpXG4gIHB1YmxpYyB0b2dnbGVFeHBhbmRlZFJlcXVlc3Q6IEV2ZW50RW1pdHRlcjxQYWdlZFRyZWVOb2RlPGFueT4+O1xuXG4gIC8qKlxuICAgKiBFbWl0cyB3aGVuIHRoZSB1c2VyIHdhbnRzIHRvIGNoYW5nZSB0aGUgcGFnZSBudW1iZXIgb2YgdGhlIG5vZGUncyBjaGlsZHJlbi5cbiAgICovXG4gIEBPdXRwdXQoKVxuICBwdWJsaWMgY2hhbmdlUGFnZVJlcXVlc3Q6IEV2ZW50RW1pdHRlcjxQYWdlQ2hhbmdlUmVxdWVzdD47XG5cbiAgQE91dHB1dCgpXG4gIHB1YmxpYyBlZGl0Tm9kZUZpbHRlclJlcXVlc3Q6IEV2ZW50RW1pdHRlcjxQYWdlZFRyZWVOb2RlPGFueT4+O1xuXG4gIGNvbnN0cnVjdG9yKCkge1xuICAgIHRoaXMudG9nZ2xlRXhwYW5kZWRSZXF1ZXN0ID0gbmV3IEV2ZW50RW1pdHRlcjxQYWdlZFRyZWVOb2RlPGFueT4+KCk7XG4gICAgdGhpcy5jaGFuZ2VQYWdlUmVxdWVzdCA9IG5ldyBFdmVudEVtaXR0ZXI8UGFnZUNoYW5nZVJlcXVlc3Q+KCk7XG4gICAgdGhpcy5lZGl0Tm9kZUZpbHRlclJlcXVlc3QgPSBuZXcgRXZlbnRFbWl0dGVyPFBhZ2VkVHJlZU5vZGU8YW55Pj4oKTtcbiAgfVxuXG4gIHB1YmxpYyBvblRvZ2dsZUV4cGFuZGVkKCk6IHZvaWQge1xuICAgIGlmICghdGhpcy5fbm9kZSkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICB0aGlzLnRvZ2dsZUV4cGFuZGVkUmVxdWVzdC5lbWl0KHRoaXMuX25vZGUgYXMgUGFnZWRUcmVlTm9kZTxhbnk+KTtcbiAgfVxuXG4gIHB1YmxpYyBvblBhZ2luZ0NoYW5nZShub2RlOiBQYWdlZFRyZWVOb2RlPGFueT4sIHBhZ2luZzogUGFnaW5nSW5mbyk6IHZvaWQge1xuICAgIHRoaXMuY2hhbmdlUGFnZVJlcXVlc3QuZW1pdCh7XG4gICAgICBub2RlLFxuICAgICAgcGFnaW5nLFxuICAgIH0pO1xuICB9XG5cbiAgcHVibGljIG9uRWRpdEZpbHRlcigpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5fbm9kZSkge1xuICAgICAgdGhpcy5lZGl0Tm9kZUZpbHRlclJlcXVlc3QuZW1pdCh0aGlzLl9ub2RlKTtcbiAgICB9XG4gIH1cbn1cbiIsIkBpZiAobm9kZSkge1xuPGRpdiBpZD1cIm5vZGVcIiBbc3R5bGUubWFyZ2luLWxlZnQucHhdPVwiKG5vZGUueSAtIDEpICAqIGluZGVudFNpemVcIj5cbiAgPCEtLSBwYWdlciAtLT5cbiAgQGlmICgkYW55KG5vZGUpLmV4cGFuZGVkICYmIHBhZ2luZyAmJiBwYWdpbmcucGFnZUNvdW50ID4gMSkge1xuICA8ZGl2IGlkPVwicGFnZXJcIiBbc3R5bGUuZGlzcGxheV09XCJoaWRlUGFnaW5nID8gJ2luaGVyaXQnIDogJ2Jsb2NrJ1wiPlxuICAgIDxwZGItY29tcGFjdC1wYWdlclxuICAgICAgW3BhZ2luZ109XCJwYWdpbmdcIlxuICAgICAgKHBhZ2luZ0NoYW5nZSk9XCJvblBhZ2luZ0NoYW5nZSgkYW55KG5vZGUpLCAkZXZlbnQpXCJcbiAgICAvPlxuICAgIDxwZGItcmFuZ2Utdmlld1xuICAgICAgW3dpZHRoXT1cIjI1MFwiXG4gICAgICBbZG9tYWluXT1cIlswLCBwYWdpbmcucGFnZUNvdW50XVwiXG4gICAgICBbcmFuZ2VdPVwiW3BhZ2luZy5wYWdlTnVtYmVyIC0gMSwgcGFnaW5nLnBhZ2VOdW1iZXJdXCJcbiAgICAvPlxuICA8L2Rpdj5cbiAgfVxuICA8IS0tIG5vZGUgLS0+XG4gIDxkaXYgY2xhc3M9XCJmb3JtLXJvd1wiPlxuICAgIDwhLS0gZXhwYW5kL2NvbGxhcHNlIGJ1dHRvbiAtLT5cbiAgICA8YnV0dG9uXG4gICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICAgIG1hdC1pY29uLWJ1dHRvblxuICAgICAgW21hdFRvb2x0aXBdPVwiJGFueShub2RlKS5leHBhbmRlZCA/ICdDb2xsYXBzZScgOiAnRXhwYW5kJ1wiXG4gICAgICBbZGlzYWJsZWRdPVwibm9kZS5oYXNDaGlsZHJlbiA9PT0gZmFsc2VcIlxuICAgICAgKGNsaWNrKT1cIm9uVG9nZ2xlRXhwYW5kZWQoKVwiXG4gICAgPlxuICAgICAgPG1hdC1pY29uIGNsYXNzPVwibWF0LXByaW1hcnlcIj57e1xuICAgICAgICBub2RlLmhhc0NoaWxkcmVuID09PSB0cnVlIHx8IG5vZGUuaGFzQ2hpbGRyZW4gPT09IHVuZGVmaW5lZFxuICAgICAgICAgID8gJGFueShub2RlKS5leHBhbmRlZFxuICAgICAgICAgICAgPyBcImV4cGFuZF9sZXNzXCJcbiAgICAgICAgICAgIDogXCJleHBhbmRfbW9yZVwiXG4gICAgICAgICAgOiBcInN0b3BcIlxuICAgICAgfX08L21hdC1pY29uPlxuICAgIDwvYnV0dG9uPlxuXG4gICAgPCEtLSB0YWcgLS0+XG4gICAgQGlmICghaGlkZUxhYmVsKSB7XG4gICAgPHNwYW5cbiAgICAgIGNsYXNzPVwidGFnXCJcbiAgICAgIFtuZ1N0eWxlXT1cIntcbiAgICAgICAgJ2JhY2tncm91bmQtY29sb3InOiAobm9kZS50YWcgfCBzdHJpbmdUb0NvbG9yKSxcbiAgICAgICAgY29sb3I6IG5vZGUudGFnIHwgc3RyaW5nVG9Db2xvciB8IGNvbG9yVG9Db250cmFzdFxuICAgICAgfVwiXG4gICAgICA+e3sgbm9kZS50YWcgfX08L3NwYW5cbiAgICA+XG5cbiAgICA8IS0tIGxvYyBhbmQgbGFiZWwgLS0+XG4gICAgPHNwYW4gY2xhc3M9XCJsb2NcIj57eyBub2RlLnkgfX0ue3sgbm9kZS54IH19PC9zcGFuPiAtIHt7IG5vZGUubGFiZWwgfX1cbiAgICB9XG5cbiAgICA8IS0tIFBST0pFQ1RFRCBOT0RFIC0tPlxuICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cblxuICAgIDwhLS0gZGVidWcgLS0+XG4gICAgQGlmIChkZWJ1Zykge1xuICAgIDxzcGFuIGNsYXNzPVwiZGVidWdcIlxuICAgICAgPiN7eyBub2RlLmlkIH19XG4gICAgICA8c3BhblxuICAgICAgICA+fCB7eyAkYW55KG5vZGUpLnBhZ2luZy5wYWdlTnVtYmVyIH19L3t7XG4gICAgICAgICAgJGFueShub2RlKS5wYWdpbmcucGFnZUNvdW50XG4gICAgICAgIH19XG4gICAgICAgICh7eyAkYW55KG5vZGUpLnBhZ2luZy50b3RhbCB9fSk8L3NwYW5cbiAgICAgID48L3NwYW5cbiAgICA+XG4gICAgfVxuXG4gICAgPCEtLSBmaWx0ZXIgLS0+XG4gICAgQGlmICghJGFueShub2RlKS5maWx0ZXIgJiYgbm9kZS55KSB7XG4gICAgPGRpdiBjbGFzcz1cIm11dGVkXCI+XG4gICAgICA8YnV0dG9uXG4gICAgICAgIHR5cGU9XCJidXR0b25cIlxuICAgICAgICBtYXQtaWNvbi1idXR0b25cbiAgICAgICAgbWF0VG9vbHRpcD1cIkFkZCBmaWx0ZXJcIlxuICAgICAgICAoY2xpY2spPVwib25FZGl0RmlsdGVyKClcIlxuICAgICAgPlxuICAgICAgICA8bWF0LWljb24+ZmlsdGVyX2xpc3Q8L21hdC1pY29uPlxuICAgICAgPC9idXR0b24+XG4gICAgPC9kaXY+XG4gICAgfSBAaWYgKCRhbnkobm9kZSkuZmlsdGVyICYmIG5vZGUueSkge1xuICAgIDxkaXYgY2xhc3M9XCJtdXRlZFwiPlxuICAgICAgPGJ1dHRvbiB0eXBlPVwiYnV0dG9uXCIgbWF0LWljb24tYnV0dG9uIChjbGljayk9XCJvbkVkaXRGaWx0ZXIoKVwiPlxuICAgICAgICA8bWF0LWljb24gW21hdEJhZGdlXT1cIiRhbnkobm9kZSkuZmlsdGVyID8gJ0YnIDogJydcIlxuICAgICAgICAgID5maWx0ZXJfYWx0PC9tYXQtaWNvblxuICAgICAgICA+XG4gICAgICA8L2J1dHRvbj5cbiAgICA8L2Rpdj5cbiAgICB9XG4gIDwvZGl2PlxuPC9kaXY+XG59XG4iXX0=
|
|
@@ -33,10 +33,10 @@ export class CompactPagerComponent {
|
|
|
33
33
|
this.pagingChange.emit(this.paging);
|
|
34
34
|
}
|
|
35
35
|
}
|
|
36
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.
|
|
37
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.
|
|
36
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: CompactPagerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
37
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.6", type: CompactPagerComponent, selector: "pdb-compact-pager", inputs: { paging: "paging" }, outputs: { pagingChange: "pagingChange" }, ngImport: i0, template: "@if (paging.pageCount) {\n <div class=\"form-row\">\n <span id=\"pages\">{{ paging.pageNumber }}/{{ paging.pageCount }}</span>\n <button\n type=\"button\"\n mat-icon-button\n (click)=\"onFirst()\"\n [disabled]=\"paging.pageNumber < 2\"\n >\n <mat-icon>first_page</mat-icon>\n </button>\n <button\n type=\"button\"\n mat-icon-button\n (click)=\"onPrevious()\"\n [disabled]=\"paging.pageNumber < 2\"\n >\n <mat-icon>navigate_before</mat-icon>\n </button>\n <button\n type=\"button\"\n mat-icon-button\n (click)=\"onNext()\"\n [disabled]=\"paging.pageNumber === paging.pageCount\"\n >\n <mat-icon>navigate_next</mat-icon>\n </button>\n <button\n type=\"button\"\n mat-icon-button\n (click)=\"onLast()\"\n [disabled]=\"paging.pageNumber === paging.pageCount\"\n >\n <mat-icon>last_page</mat-icon>\n </button>\n <span id=\"total\">{{ paging.total }} </span>\n </div>\n}\n", styles: ["#pages,#total{color:silver}.form-row{display:flex;gap:2px;align-items:center;flex-wrap:wrap}.form-row *{flex:0 0 auto}\n"], dependencies: [{ kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
|
|
38
38
|
}
|
|
39
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.
|
|
39
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: CompactPagerComponent, decorators: [{
|
|
40
40
|
type: Component,
|
|
41
41
|
args: [{ selector: 'pdb-compact-pager', template: "@if (paging.pageCount) {\n <div class=\"form-row\">\n <span id=\"pages\">{{ paging.pageNumber }}/{{ paging.pageCount }}</span>\n <button\n type=\"button\"\n mat-icon-button\n (click)=\"onFirst()\"\n [disabled]=\"paging.pageNumber < 2\"\n >\n <mat-icon>first_page</mat-icon>\n </button>\n <button\n type=\"button\"\n mat-icon-button\n (click)=\"onPrevious()\"\n [disabled]=\"paging.pageNumber < 2\"\n >\n <mat-icon>navigate_before</mat-icon>\n </button>\n <button\n type=\"button\"\n mat-icon-button\n (click)=\"onNext()\"\n [disabled]=\"paging.pageNumber === paging.pageCount\"\n >\n <mat-icon>navigate_next</mat-icon>\n </button>\n <button\n type=\"button\"\n mat-icon-button\n (click)=\"onLast()\"\n [disabled]=\"paging.pageNumber === paging.pageCount\"\n >\n <mat-icon>last_page</mat-icon>\n </button>\n <span id=\"total\">{{ paging.total }} </span>\n </div>\n}\n", styles: ["#pages,#total{color:silver}.form-row{display:flex;gap:2px;align-items:center;flex-wrap:wrap}.form-row *{flex:0 0 auto}\n"] }]
|
|
42
42
|
}], ctorParameters: () => [], propDecorators: { paging: [{
|
|
@@ -17,10 +17,10 @@ export class RangeViewComponent {
|
|
|
17
17
|
((rangeStart + rangeWidth) / domainWidth) * this.width,
|
|
18
18
|
];
|
|
19
19
|
}
|
|
20
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.
|
|
21
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.
|
|
20
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: RangeViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
21
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.6", type: RangeViewComponent, selector: "pdb-range-view", inputs: { domain: "domain", range: "range", width: "width", height: "height" }, usesOnChanges: true, ngImport: i0, template: "<svg [attr.width]=\"width\" [attr.height]=\"height\">\n <rect id=\"rdomain\" [attr.width]=\"width\" [attr.height]=\"height\" />\n <rect\n id=\"rrange\"\n [attr.x]=\"scaledRange[0]\"\n [attr.y]=\"0\"\n [attr.width]=\"scaledRange[1] - scaledRange[0]\"\n [attr.height]=\"height\"\n />\n</svg>\n", styles: ["#rdomain{fill:#d3d3d3;stroke-width:3;stroke:#c1ba9b}#rrange{fill:#91aad3;stroke-width:3}\n"] }); }
|
|
22
22
|
}
|
|
23
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.
|
|
23
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: RangeViewComponent, decorators: [{
|
|
24
24
|
type: Component,
|
|
25
25
|
args: [{ selector: 'pdb-range-view', template: "<svg [attr.width]=\"width\" [attr.height]=\"height\">\n <rect id=\"rdomain\" [attr.width]=\"width\" [attr.height]=\"height\" />\n <rect\n id=\"rrange\"\n [attr.x]=\"scaledRange[0]\"\n [attr.y]=\"0\"\n [attr.width]=\"scaledRange[1] - scaledRange[0]\"\n [attr.height]=\"height\"\n />\n</svg>\n", styles: ["#rdomain{fill:#d3d3d3;stroke-width:3;stroke:#c1ba9b}#rrange{fill:#91aad3;stroke-width:3}\n"] }]
|
|
26
26
|
}], ctorParameters: () => [], propDecorators: { domain: [{
|
|
@@ -18,8 +18,8 @@ import { RangeViewComponent } from './components/range-view/range-view.component
|
|
|
18
18
|
import { BrowserTreeNodeComponent } from './components/browser-tree-node/browser-tree-node.component';
|
|
19
19
|
import * as i0 from "@angular/core";
|
|
20
20
|
export class PagedDataBrowsersModule {
|
|
21
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.
|
|
22
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.
|
|
21
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: PagedDataBrowsersModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
22
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.6", ngImport: i0, type: PagedDataBrowsersModule, declarations: [CompactPagerComponent,
|
|
23
23
|
RangeViewComponent,
|
|
24
24
|
BrowserTreeNodeComponent], imports: [CommonModule,
|
|
25
25
|
ReactiveFormsModule,
|
|
@@ -39,7 +39,7 @@ export class PagedDataBrowsersModule {
|
|
|
39
39
|
NgToolsModule], exports: [CompactPagerComponent,
|
|
40
40
|
RangeViewComponent,
|
|
41
41
|
BrowserTreeNodeComponent] }); }
|
|
42
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.
|
|
42
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: PagedDataBrowsersModule, imports: [CommonModule,
|
|
43
43
|
ReactiveFormsModule,
|
|
44
44
|
// material
|
|
45
45
|
MatBadgeModule,
|
|
@@ -56,7 +56,7 @@ export class PagedDataBrowsersModule {
|
|
|
56
56
|
// myrmidon
|
|
57
57
|
NgToolsModule] }); }
|
|
58
58
|
}
|
|
59
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.
|
|
59
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: PagedDataBrowsersModule, decorators: [{
|
|
60
60
|
type: NgModule,
|
|
61
61
|
args: [{
|
|
62
62
|
declarations: [
|