@nanahoshi/mona-ui 0.21.0 → 0.22.0
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/fesm2022/nanahoshi-mona-ui-color-gradient.mjs +5 -3
- package/fesm2022/nanahoshi-mona-ui-color-picker.mjs +4 -3
- package/fesm2022/nanahoshi-mona-ui-date-picker.mjs +4 -2
- package/fesm2022/nanahoshi-mona-ui-datetime-picker.mjs +4 -2
- package/fesm2022/{nanahoshi-mona-ui-grid-grid-footer-cell.component-ZdcR20RJ.mjs → nanahoshi-mona-ui-grid-grid-footer-cell.component-cJjJ1b6M.mjs} +2 -2
- package/fesm2022/{nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-Bu093U9J.mjs → nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-CkkLBnoI.mjs} +2 -2
- package/fesm2022/nanahoshi-mona-ui-grid-grid-list.component-Do-ktlth.mjs +164 -0
- package/fesm2022/{nanahoshi-mona-ui-grid-grid-toggle.component-DFMbXpKb.mjs → nanahoshi-mona-ui-grid-grid-toggle.component-BDMX9KGc.mjs} +6 -6
- package/fesm2022/{nanahoshi-mona-ui-grid-grid-virtual-list.component-xc8ybFkY.mjs → nanahoshi-mona-ui-grid-grid-virtual-list.component-Cs1gPJps.mjs} +5 -5
- package/fesm2022/{nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-BGfDw6_5.mjs → nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-CIfTr1Qm.mjs} +32 -17
- package/fesm2022/nanahoshi-mona-ui-grid.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-internal-filter-input.mjs +3 -2
- package/fesm2022/nanahoshi-mona-ui-internal-tree.mjs +17 -14
- package/fesm2022/nanahoshi-mona-ui-time-picker.mjs +11 -3
- package/package.json +1 -1
- package/types/nanahoshi-mona-ui-grid.d.ts +7 -2
- package/fesm2022/nanahoshi-mona-ui-grid-grid-list.component-Dtze5qye.mjs +0 -162
|
@@ -10,11 +10,11 @@ import { v4 } from 'uuid';
|
|
|
10
10
|
import { cva } from 'class-variance-authority';
|
|
11
11
|
import { themeOverlaySurfaceClasses } from '@nanahoshi/mona-ui/internal';
|
|
12
12
|
import { CdkDropList, CdkDrag, CdkDragPreview } from '@angular/cdk/drag-drop';
|
|
13
|
+
import { LucideArrowDown, LucideArrowUp, LucideBan, LucideChevronDown, LucideChevronRight, LucideLoaderCircle, LucidePlus } from '@lucide/angular';
|
|
13
14
|
import * as i1 from '@angular/forms';
|
|
14
15
|
import { FormsModule } from '@angular/forms';
|
|
15
16
|
import { CheckBoxComponent } from '@nanahoshi/mona-ui/check-box';
|
|
16
17
|
import { NgTemplateOutlet } from '@angular/common';
|
|
17
|
-
import { twMerge } from 'tailwind-merge';
|
|
18
18
|
|
|
19
19
|
class TreeNodeTemplateDirective {
|
|
20
20
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TreeNodeTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
@@ -1199,7 +1199,7 @@ const treeDropHintBaseThemeVariants = cva(`
|
|
|
1199
1199
|
`);
|
|
1200
1200
|
const treeDropHintIconThemeVariants = cva(`
|
|
1201
1201
|
absolute flex items-center justify-center
|
|
1202
|
-
-top-
|
|
1202
|
+
-top-2.25 -start-3.5 text-xl rtl:rotate-180
|
|
1203
1203
|
`);
|
|
1204
1204
|
const treeNodeBaseThemeVariants = cva(`
|
|
1205
1205
|
cursor-default px-2 py-1 text-foreground
|
|
@@ -1710,11 +1710,18 @@ class SubTreeComponent {
|
|
|
1710
1710
|
element.focus();
|
|
1711
1711
|
}
|
|
1712
1712
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: SubTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1713
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: SubTreeComponent, isStandalone: true, selector: "mona-sub-tree", inputs: { depth: { classPropertyName: "depth", publicName: "depth", isSignal: true, isRequired: true, transformFunction: null }, nodes: { classPropertyName: "nodes", publicName: "nodes", isSignal: true, isRequired: true, transformFunction: null }, parent: { classPropertyName: "parent", publicName: "parent", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ul\n [class]=\"listClass()\"\n [attr.role]=\"parent() ? 'group' : null\"\n cdkDropList\n [cdkDropListSortingDisabled]=\"true\"\n (cdkDropListDropped)=\"onNodeDrop($event)\">\n @for (node of visibleNodes(); track node.uid) {\n <li\n [attr.id]=\"node.uid | treeNodeElementId\"\n [attr.data-uid]=\"node.uid\"\n [class]=\"listItemClass()\"\n [tabindex]=\"-1\"\n role=\"treeitem\"\n [attr.aria-level]=\"depth() + 1\"\n [attr.aria-setsize]=\"visibleNodes().length\"\n [attr.aria-posinset]=\"$index + 1\"\n [attr.aria-expanded]=\"nodeComponent.expandable() ? nodeComponent.expanded() : null\"\n [attr.aria-selected]=\"treeService.selectableOptions().enabled ? nodeComponent.selected() : null\"\n [attr.aria-disabled]=\"nodeComponent.disabled() ? true : null\"\n [attr.aria-checked]=\"\n nodeComponent.checkable() ? (nodeComponent.indeterminate() ? 'mixed' : nodeComponent.checked()) : null\n \"\n (focus)=\"treeService.navigatedNode.set(node)\"\n cdkDrag\n [cdkDragData]=\"node\"\n [cdkDragDisabled]=\"!treeService.draggableOptions().enabled\"\n (cdkDragStarted)=\"onNodeDragStart($event)\"\n (cdkDragEnded)=\"onNodeDragEnd($event)\"\n (cdkDragMoved)=\"onNodeDragMove($event, node)\">\n <div [class]=\"nodeContainerClass()\">\n @if (treeService.expandableOptions().enabled && nodeComponent.expandable()) {\n <button\n type=\"button\"\n tabindex=\"-1\"\n [class]=\"nodeExpanderClass()\"\n [class.mona-disabled]=\"nodeComponent.disabled()\"\n [attr.aria-label]=\"\n (nodeComponent.expanded() ? messages().collapse : messages().expand)
|
|
1713
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: SubTreeComponent, isStandalone: true, selector: "mona-sub-tree", inputs: { depth: { classPropertyName: "depth", publicName: "depth", isSignal: true, isRequired: true, transformFunction: null }, nodes: { classPropertyName: "nodes", publicName: "nodes", isSignal: true, isRequired: true, transformFunction: null }, parent: { classPropertyName: "parent", publicName: "parent", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ul\n [class]=\"listClass()\"\n [attr.role]=\"parent() ? 'group' : null\"\n cdkDropList\n [cdkDropListSortingDisabled]=\"true\"\n (cdkDropListDropped)=\"onNodeDrop($event)\">\n @for (node of visibleNodes(); track node.uid) {\n <li\n [attr.id]=\"node.uid | treeNodeElementId\"\n [attr.data-uid]=\"node.uid\"\n [class]=\"listItemClass()\"\n [tabindex]=\"-1\"\n role=\"treeitem\"\n [attr.aria-level]=\"depth() + 1\"\n [attr.aria-setsize]=\"visibleNodes().length\"\n [attr.aria-posinset]=\"$index + 1\"\n [attr.aria-expanded]=\"nodeComponent.expandable() ? nodeComponent.expanded() : null\"\n [attr.aria-selected]=\"treeService.selectableOptions().enabled ? nodeComponent.selected() : null\"\n [attr.aria-disabled]=\"nodeComponent.disabled() ? true : null\"\n [attr.aria-checked]=\"\n nodeComponent.checkable() ? (nodeComponent.indeterminate() ? 'mixed' : nodeComponent.checked()) : null\n \"\n (focus)=\"treeService.navigatedNode.set(node)\"\n cdkDrag\n [cdkDragData]=\"node\"\n [cdkDragDisabled]=\"!treeService.draggableOptions().enabled\"\n (cdkDragStarted)=\"onNodeDragStart($event)\"\n (cdkDragEnded)=\"onNodeDragEnd($event)\"\n (cdkDragMoved)=\"onNodeDragMove($event, node)\">\n <div [class]=\"nodeContainerClass()\">\n @if (treeService.expandableOptions().enabled && nodeComponent.expandable()) {\n <button\n type=\"button\"\n tabindex=\"-1\"\n [class]=\"nodeExpanderClass()\"\n [class.mona-disabled]=\"nodeComponent.disabled()\"\n [attr.aria-label]=\"\n (nodeComponent.expanded() ? messages().collapse : messages().expand) +\n ' ' +\n nodeComponent.nodeText()\n \"\n (click)=\"onExpandStateChange(node)\">\n @if (node.loading()) {\n <svg lucideLoaderCircle [size]=\"16\" aria-hidden=\"true\" class=\"animate-spin\"></svg>\n } @else if (nodeComponent.expanded()) {\n <svg lucideChevronDown [size]=\"16\" aria-hidden=\"true\"></svg>\n } @else {\n <svg lucideChevronRight [size]=\"16\" aria-hidden=\"true\" class=\"rtl:rotate-180\"></svg>\n }\n </button>\n }\n @if (nodeComponent.checkable()) {\n <mona-check-box\n aria-hidden=\"true\"\n [tabIndex]=\"-1\"\n [disabled]=\"nodeComponent.disabled()\"\n [indeterminate]=\"nodeComponent.indeterminate()\"\n [ngModel]=\"nodeComponent.checked()\"\n (click)=\"nodeComponent.checkboxClick$.next($event)\"\n (ngModelChange)=\"nodeComponent.checkboxCheck$.next($event)\"></mona-check-box>\n }\n <mona-tree-node [node]=\"node\" [depth]=\"depth()\" #nodeComponent></mona-tree-node>\n </div>\n @if (node.children().length > 0 && nodeComponent.expanded()) {\n <div\n class=\"grid overflow-hidden\"\n [animate.enter]=\"nodeExpandEnterClass()\"\n [animate.leave]=\"nodeExpandLeaveClass()\">\n <div class=\"min-h-0 overflow-hidden\">\n <mona-sub-tree [nodes]=\"node.children()\" [depth]=\"depth() + 1\" [parent]=\"node\"></mona-sub-tree>\n </div>\n </div>\n }\n @if (!nodeComponent.disabled()) {\n <div *cdkDragPreview [class]=\"nodeDraggingClass()\">\n <span>\n @switch (treeService.dropPositionSignal()?.position) {\n @case (\"before\") {\n @if (treeService.dropAllowed()) {\n <svg lucideArrowUp [size]=\"16\" aria-hidden=\"true\"></svg>\n } @else {\n <svg lucideBan [size]=\"16\" aria-hidden=\"true\"></svg>\n }\n }\n @case (\"after\") {\n @if (treeService.dropAllowed()) {\n <svg lucideArrowDown [size]=\"16\" aria-hidden=\"true\"></svg>\n } @else {\n <svg lucideBan [size]=\"16\" aria-hidden=\"true\"></svg>\n }\n }\n @case (\"inside\") {\n <svg lucidePlus [size]=\"16\" aria-hidden=\"true\"></svg>\n }\n @default {\n <svg lucideBan [size]=\"16\" aria-hidden=\"true\"></svg>\n }\n }\n </span>\n <span>{{ nodeComponent.nodeText() }}</span>\n </div>\n } @else {\n <div *cdkDragPreview [class]=\"nodeDraggingClass()\"></div>\n }\n </li>\n }\n</ul>\n", styles: [".mona-tree-node-expand-enter{animation:mona-tree-node-expand-in .15s ease-out}.mona-tree-node-expand-leave{animation:mona-tree-node-expand-out .15s ease-out}@keyframes mona-tree-node-expand-in{0%{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}@keyframes mona-tree-node-expand-out{0%{grid-template-rows:1fr;opacity:1}to{grid-template-rows:0fr;opacity:0}}@media(prefers-reduced-motion:reduce){.mona-tree-node-expand-enter,.mona-tree-node-expand-leave{animation-duration:1ms}}\n"], dependencies: [{ kind: "component", type: SubTreeComponent, selector: "mona-sub-tree", inputs: ["depth", "nodes", "parent"] }, { kind: "component", type: LucideArrowDown, selector: "svg[lucideArrowDown]" }, { kind: "component", type: LucideArrowUp, selector: "svg[lucideArrowUp]" }, { kind: "component", type: LucideBan, selector: "svg[lucideBan]" }, { kind: "component", type: LucideChevronDown, selector: "svg[lucideChevronDown]" }, { kind: "component", type: LucideChevronRight, selector: "svg[lucideChevronRight]" }, { kind: "component", type: LucideLoaderCircle, selector: "svg[lucideLoaderCircle], svg[lucideLoader2]" }, { kind: "component", type: LucidePlus, selector: "svg[lucidePlus]" }, { kind: "component", type: TreeNodeComponent, selector: "mona-tree-node", inputs: ["depth", "node"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragPreview, selector: "ng-template[cdkDragPreview]", inputs: ["data", "matchSize"] }, { kind: "component", type: CheckBoxComponent, selector: "mona-check-box", inputs: ["checked", "disabled", "indeterminate", "invalid", "label", "labelPosition", "labelSize", "required", "rounded", "tabIndex", "touched", "class"], outputs: ["checkedChange", "inputBlur", "inputChange", "inputFocus", "touch"] }, { kind: "pipe", type: TreeNodeElementIdPipe, name: "treeNodeElementId" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1714
1714
|
}
|
|
1715
1715
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: SubTreeComponent, decorators: [{
|
|
1716
1716
|
type: Component,
|
|
1717
1717
|
args: [{ selector: "mona-sub-tree", changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
1718
|
+
LucideArrowDown,
|
|
1719
|
+
LucideArrowUp,
|
|
1720
|
+
LucideBan,
|
|
1721
|
+
LucideChevronDown,
|
|
1722
|
+
LucideChevronRight,
|
|
1723
|
+
LucideLoaderCircle,
|
|
1724
|
+
LucidePlus,
|
|
1718
1725
|
TreeNodeComponent,
|
|
1719
1726
|
FormsModule,
|
|
1720
1727
|
CdkDropList,
|
|
@@ -1722,23 +1729,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
|
|
|
1722
1729
|
CdkDragPreview,
|
|
1723
1730
|
CheckBoxComponent,
|
|
1724
1731
|
TreeNodeElementIdPipe
|
|
1725
|
-
], template: "<ul\n [class]=\"listClass()\"\n [attr.role]=\"parent() ? 'group' : null\"\n cdkDropList\n [cdkDropListSortingDisabled]=\"true\"\n (cdkDropListDropped)=\"onNodeDrop($event)\">\n @for (node of visibleNodes(); track node.uid) {\n <li\n [attr.id]=\"node.uid | treeNodeElementId\"\n [attr.data-uid]=\"node.uid\"\n [class]=\"listItemClass()\"\n [tabindex]=\"-1\"\n role=\"treeitem\"\n [attr.aria-level]=\"depth() + 1\"\n [attr.aria-setsize]=\"visibleNodes().length\"\n [attr.aria-posinset]=\"$index + 1\"\n [attr.aria-expanded]=\"nodeComponent.expandable() ? nodeComponent.expanded() : null\"\n [attr.aria-selected]=\"treeService.selectableOptions().enabled ? nodeComponent.selected() : null\"\n [attr.aria-disabled]=\"nodeComponent.disabled() ? true : null\"\n [attr.aria-checked]=\"\n nodeComponent.checkable() ? (nodeComponent.indeterminate() ? 'mixed' : nodeComponent.checked()) : null\n \"\n (focus)=\"treeService.navigatedNode.set(node)\"\n cdkDrag\n [cdkDragData]=\"node\"\n [cdkDragDisabled]=\"!treeService.draggableOptions().enabled\"\n (cdkDragStarted)=\"onNodeDragStart($event)\"\n (cdkDragEnded)=\"onNodeDragEnd($event)\"\n (cdkDragMoved)=\"onNodeDragMove($event, node)\">\n <div [class]=\"nodeContainerClass()\">\n @if (treeService.expandableOptions().enabled && nodeComponent.expandable()) {\n <button\n type=\"button\"\n tabindex=\"-1\"\n [class]=\"nodeExpanderClass()\"\n [class.mona-disabled]=\"nodeComponent.disabled()\"\n [attr.aria-label]=\"\n (nodeComponent.expanded() ? messages().collapse : messages().expand)
|
|
1732
|
+
], template: "<ul\n [class]=\"listClass()\"\n [attr.role]=\"parent() ? 'group' : null\"\n cdkDropList\n [cdkDropListSortingDisabled]=\"true\"\n (cdkDropListDropped)=\"onNodeDrop($event)\">\n @for (node of visibleNodes(); track node.uid) {\n <li\n [attr.id]=\"node.uid | treeNodeElementId\"\n [attr.data-uid]=\"node.uid\"\n [class]=\"listItemClass()\"\n [tabindex]=\"-1\"\n role=\"treeitem\"\n [attr.aria-level]=\"depth() + 1\"\n [attr.aria-setsize]=\"visibleNodes().length\"\n [attr.aria-posinset]=\"$index + 1\"\n [attr.aria-expanded]=\"nodeComponent.expandable() ? nodeComponent.expanded() : null\"\n [attr.aria-selected]=\"treeService.selectableOptions().enabled ? nodeComponent.selected() : null\"\n [attr.aria-disabled]=\"nodeComponent.disabled() ? true : null\"\n [attr.aria-checked]=\"\n nodeComponent.checkable() ? (nodeComponent.indeterminate() ? 'mixed' : nodeComponent.checked()) : null\n \"\n (focus)=\"treeService.navigatedNode.set(node)\"\n cdkDrag\n [cdkDragData]=\"node\"\n [cdkDragDisabled]=\"!treeService.draggableOptions().enabled\"\n (cdkDragStarted)=\"onNodeDragStart($event)\"\n (cdkDragEnded)=\"onNodeDragEnd($event)\"\n (cdkDragMoved)=\"onNodeDragMove($event, node)\">\n <div [class]=\"nodeContainerClass()\">\n @if (treeService.expandableOptions().enabled && nodeComponent.expandable()) {\n <button\n type=\"button\"\n tabindex=\"-1\"\n [class]=\"nodeExpanderClass()\"\n [class.mona-disabled]=\"nodeComponent.disabled()\"\n [attr.aria-label]=\"\n (nodeComponent.expanded() ? messages().collapse : messages().expand) +\n ' ' +\n nodeComponent.nodeText()\n \"\n (click)=\"onExpandStateChange(node)\">\n @if (node.loading()) {\n <svg lucideLoaderCircle [size]=\"16\" aria-hidden=\"true\" class=\"animate-spin\"></svg>\n } @else if (nodeComponent.expanded()) {\n <svg lucideChevronDown [size]=\"16\" aria-hidden=\"true\"></svg>\n } @else {\n <svg lucideChevronRight [size]=\"16\" aria-hidden=\"true\" class=\"rtl:rotate-180\"></svg>\n }\n </button>\n }\n @if (nodeComponent.checkable()) {\n <mona-check-box\n aria-hidden=\"true\"\n [tabIndex]=\"-1\"\n [disabled]=\"nodeComponent.disabled()\"\n [indeterminate]=\"nodeComponent.indeterminate()\"\n [ngModel]=\"nodeComponent.checked()\"\n (click)=\"nodeComponent.checkboxClick$.next($event)\"\n (ngModelChange)=\"nodeComponent.checkboxCheck$.next($event)\"></mona-check-box>\n }\n <mona-tree-node [node]=\"node\" [depth]=\"depth()\" #nodeComponent></mona-tree-node>\n </div>\n @if (node.children().length > 0 && nodeComponent.expanded()) {\n <div\n class=\"grid overflow-hidden\"\n [animate.enter]=\"nodeExpandEnterClass()\"\n [animate.leave]=\"nodeExpandLeaveClass()\">\n <div class=\"min-h-0 overflow-hidden\">\n <mona-sub-tree [nodes]=\"node.children()\" [depth]=\"depth() + 1\" [parent]=\"node\"></mona-sub-tree>\n </div>\n </div>\n }\n @if (!nodeComponent.disabled()) {\n <div *cdkDragPreview [class]=\"nodeDraggingClass()\">\n <span>\n @switch (treeService.dropPositionSignal()?.position) {\n @case (\"before\") {\n @if (treeService.dropAllowed()) {\n <svg lucideArrowUp [size]=\"16\" aria-hidden=\"true\"></svg>\n } @else {\n <svg lucideBan [size]=\"16\" aria-hidden=\"true\"></svg>\n }\n }\n @case (\"after\") {\n @if (treeService.dropAllowed()) {\n <svg lucideArrowDown [size]=\"16\" aria-hidden=\"true\"></svg>\n } @else {\n <svg lucideBan [size]=\"16\" aria-hidden=\"true\"></svg>\n }\n }\n @case (\"inside\") {\n <svg lucidePlus [size]=\"16\" aria-hidden=\"true\"></svg>\n }\n @default {\n <svg lucideBan [size]=\"16\" aria-hidden=\"true\"></svg>\n }\n }\n </span>\n <span>{{ nodeComponent.nodeText() }}</span>\n </div>\n } @else {\n <div *cdkDragPreview [class]=\"nodeDraggingClass()\"></div>\n }\n </li>\n }\n</ul>\n", styles: [".mona-tree-node-expand-enter{animation:mona-tree-node-expand-in .15s ease-out}.mona-tree-node-expand-leave{animation:mona-tree-node-expand-out .15s ease-out}@keyframes mona-tree-node-expand-in{0%{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}@keyframes mona-tree-node-expand-out{0%{grid-template-rows:1fr;opacity:1}to{grid-template-rows:0fr;opacity:0}}@media(prefers-reduced-motion:reduce){.mona-tree-node-expand-enter,.mona-tree-node-expand-leave{animation-duration:1ms}}\n"] }]
|
|
1726
1733
|
}], propDecorators: { depth: [{ type: i0.Input, args: [{ isSignal: true, alias: "depth", required: true }] }], nodes: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodes", required: true }] }], parent: [{ type: i0.Input, args: [{ isSignal: true, alias: "parent", required: true }] }] } });
|
|
1727
1734
|
|
|
1728
1735
|
class TreeDropHintComponent {
|
|
1729
1736
|
#direction;
|
|
1730
1737
|
#dropPositionChange;
|
|
1731
1738
|
#hostElementRef;
|
|
1732
|
-
#i18n;
|
|
1733
1739
|
constructor() {
|
|
1734
1740
|
this.#direction = injectComponentDirection();
|
|
1735
1741
|
this.#dropPositionChange = toSignal(inject(TreeService).dropPositionChange$, {
|
|
1736
1742
|
initialValue: null
|
|
1737
1743
|
});
|
|
1738
1744
|
this.#hostElementRef = inject(ElementRef);
|
|
1739
|
-
this.#i18n = inject(MonaI18nService);
|
|
1740
|
-
this.isRtl = computed(() => this.#direction() === "rtl", /* @ts-ignore */
|
|
1741
|
-
...(ngDevMode ? [{ debugName: "isRtl" }] : /* istanbul ignore next */ []));
|
|
1742
1745
|
this.baseClass = computed(() => {
|
|
1743
1746
|
return treeDropHintBaseThemeVariants();
|
|
1744
1747
|
}, /* @ts-ignore */
|
|
@@ -1780,11 +1783,11 @@ class TreeDropHintComponent {
|
|
|
1780
1783
|
}, /* @ts-ignore */
|
|
1781
1784
|
...(ngDevMode ? [{ debugName: "dropHintStyles" }] : /* istanbul ignore next */ []));
|
|
1782
1785
|
this.iconClass = computed(() => {
|
|
1783
|
-
|
|
1784
|
-
const variantClass = treeDropHintIconThemeVariants();
|
|
1785
|
-
return twMerge(icon, variantClass);
|
|
1786
|
+
return treeDropHintIconThemeVariants();
|
|
1786
1787
|
}, /* @ts-ignore */
|
|
1787
1788
|
...(ngDevMode ? [{ debugName: "iconClass" }] : /* istanbul ignore next */ []));
|
|
1789
|
+
this.isRtl = computed(() => this.#direction() === "rtl", /* @ts-ignore */
|
|
1790
|
+
...(ngDevMode ? [{ debugName: "isRtl" }] : /* istanbul ignore next */ []));
|
|
1788
1791
|
afterRenderEffect({
|
|
1789
1792
|
write: () => {
|
|
1790
1793
|
const styles = this.dropHintStyles();
|
|
@@ -1793,13 +1796,13 @@ class TreeDropHintComponent {
|
|
|
1793
1796
|
});
|
|
1794
1797
|
}
|
|
1795
1798
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TreeDropHintComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1796
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.6", type: TreeDropHintComponent, isStandalone: true, selector: "mona-tree-drop-hint", host: { properties: { "class": "baseClass()" } }, ngImport: i0, template: "<
|
|
1799
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.6", type: TreeDropHintComponent, isStandalone: true, selector: "mona-tree-drop-hint", host: { properties: { "class": "baseClass()" } }, ngImport: i0, template: "<svg lucideChevronRight [size]=\"20\" [class]=\"iconClass()\" aria-hidden=\"true\"></svg>\n", dependencies: [{ kind: "component", type: LucideChevronRight, selector: "svg[lucideChevronRight]" }] }); }
|
|
1797
1800
|
}
|
|
1798
1801
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TreeDropHintComponent, decorators: [{
|
|
1799
1802
|
type: Component,
|
|
1800
|
-
args: [{ selector: "mona-tree-drop-hint", host: {
|
|
1803
|
+
args: [{ selector: "mona-tree-drop-hint", imports: [LucideChevronRight], host: {
|
|
1801
1804
|
"[class]": "baseClass()"
|
|
1802
|
-
}, template: "<
|
|
1805
|
+
}, template: "<svg lucideChevronRight [size]=\"20\" [class]=\"iconClass()\" aria-hidden=\"true\"></svg>\n" }]
|
|
1803
1806
|
}], ctorParameters: () => [] });
|
|
1804
1807
|
|
|
1805
1808
|
class TreeComponent {
|
|
@@ -2,6 +2,7 @@ import { CdkTrapFocus } from '@angular/cdk/a11y';
|
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
3
|
import { inject, DestroyRef, ElementRef, computed, linkedSignal, signal, viewChild, output, input, model, afterNextRender, effect, untracked, forwardRef, Component } from '@angular/core';
|
|
4
4
|
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
5
|
+
import { LucideClock } from '@lucide/angular';
|
|
5
6
|
import { ButtonDirective } from '@nanahoshi/mona-ui/button';
|
|
6
7
|
import * as i1 from '@nanahoshi/mona-ui/dropdowns';
|
|
7
8
|
import { DropdownService, dropdownPopupThemeVariants, DROPDOWN_POPUP_INPUT_TOKEN, DropdownPopupHandlerDirective } from '@nanahoshi/mona-ui/dropdowns';
|
|
@@ -444,7 +445,7 @@ class TimePickerComponent {
|
|
|
444
445
|
useExisting: forwardRef(() => TimePickerComponent),
|
|
445
446
|
multi: false
|
|
446
447
|
}
|
|
447
|
-
], viewQueries: [{ propertyName: "timePopupTemplateRef", first: true, predicate: ["timePopupTemplate"], descendants: true, isSignal: true }], hostDirectives: [{ directive: i1.DropdownPopupHandlerDirective }], ngImport: i0, template: "<mona-text-box\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || readonlyInput()\"\n [required]=\"required()\"\n [value]=\"currentDateString()\"\n [inputAttributes]=\"inputAttributes()\"\n [invalid]=\"invalid()\"\n [placeholder]=\"placeholder()\"\n [rounded]=\"rounded()\"\n [size]=\"size()\"\n [touched]=\"touched()\"\n [clearButton]=\"showClearButton()\"\n (valueChange)=\"onDateStringEdit($event)\"\n (inputBlur)=\"onTimeInputBlur()\">\n <ng-template monaTextBoxSuffixTemplate>\n <button\n monaButton\n look=\"ghost\"\n [iconOnly]=\"true\"\n [size]=\"size()\"\n [rounded]=\"'none'\"\n (click)=\"onTimeInputButtonClick()\"\n class=\"aspect-square h-full w-auto\"\n [attr.aria-label]=\"messages().openTimePicker\"\n [attr.aria-expanded]=\"expanded()\"\n [attr.aria-controls]=\"popupId\"\n [disabled]=\"disabled() || readonly()\"\n [tabindex]=\"-1\">\n <
|
|
448
|
+
], viewQueries: [{ propertyName: "timePopupTemplateRef", first: true, predicate: ["timePopupTemplate"], descendants: true, isSignal: true }], hostDirectives: [{ directive: i1.DropdownPopupHandlerDirective }], ngImport: i0, template: "<mona-text-box\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || readonlyInput()\"\n [required]=\"required()\"\n [value]=\"currentDateString()\"\n [inputAttributes]=\"inputAttributes()\"\n [invalid]=\"invalid()\"\n [placeholder]=\"placeholder()\"\n [rounded]=\"rounded()\"\n [size]=\"size()\"\n [touched]=\"touched()\"\n [clearButton]=\"showClearButton()\"\n (valueChange)=\"onDateStringEdit($event)\"\n (inputBlur)=\"onTimeInputBlur()\">\n <ng-template monaTextBoxSuffixTemplate>\n <button\n monaButton\n look=\"ghost\"\n [iconOnly]=\"true\"\n [size]=\"size()\"\n [rounded]=\"'none'\"\n (click)=\"onTimeInputButtonClick()\"\n class=\"aspect-square h-full w-auto\"\n [attr.aria-label]=\"messages().openTimePicker\"\n [attr.aria-expanded]=\"expanded()\"\n [attr.aria-controls]=\"popupId\"\n [disabled]=\"disabled() || readonly()\"\n [tabindex]=\"-1\">\n <svg lucideClock [size]=\"16\" aria-hidden=\"true\"></svg>\n </button>\n </ng-template>\n</mona-text-box>\n\n<ng-template #timePopupTemplate>\n <div\n [class]=\"pickerPopupClass()\"\n [id]=\"popupId\"\n aria-modal=\"true\"\n role=\"dialog\"\n [attr.aria-label]=\"messages().timePicker\"\n cdkTrapFocus>\n <mona-time-selector\n [value]=\"value()\"\n (valueChange)=\"onTimeSelectorValueChange($event)\"\n [max]=\"max()\"\n [min]=\"min()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [hourFormat]=\"hourFormat()\"\n [hourStep]=\"hourStep()\"\n [minuteStep]=\"minuteStep()\"\n [secondStep]=\"secondStep()\"\n [size]=\"size()\"\n [rounded]=\"rounded()\"\n [showSeconds]=\"showSeconds()\"></mona-time-selector>\n </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: LucideClock, selector: "svg[lucideClock]" }, { kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "component", type: TimeSelectorComponent, selector: "mona-time-selector", inputs: ["aria-label", "disabled", "focusOnMount", "footer", "hourFormat", "hourStep", "invalid", "max", "min", "minuteStep", "readonly", "required", "rounded", "secondStep", "showSeconds", "size", "touched", "value"], outputs: ["touch", "valueChange"] }, { kind: "component", type: TextBoxComponent, selector: "mona-text-box", inputs: ["clearButton", "disabled", "inputAttributes", "inputClass", "inputStyle", "invalid", "placeholder", "readonly", "required", "rounded", "size", "touched", "type", "class", "value"], outputs: ["inputBlur", "inputFocus", "touch", "valueChange"] }, { kind: "directive", type: TextBoxSuffixTemplateDirective, selector: "ng-template[monaTextBoxSuffixTemplate]" }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }] }); }
|
|
448
449
|
}
|
|
449
450
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TimePickerComponent, decorators: [{
|
|
450
451
|
type: Component,
|
|
@@ -455,7 +456,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
|
|
|
455
456
|
useExisting: forwardRef(() => TimePickerComponent),
|
|
456
457
|
multi: false
|
|
457
458
|
}
|
|
458
|
-
], imports: [
|
|
459
|
+
], imports: [
|
|
460
|
+
LucideClock,
|
|
461
|
+
ButtonDirective,
|
|
462
|
+
TimeSelectorComponent,
|
|
463
|
+
TextBoxComponent,
|
|
464
|
+
TextBoxSuffixTemplateDirective,
|
|
465
|
+
CdkTrapFocus
|
|
466
|
+
], hostDirectives: [DropdownPopupHandlerDirective], host: {
|
|
459
467
|
"[attr.tabindex]": "disabled() ? null : -1",
|
|
460
468
|
"[attr.aria-invalid]": "invalidState() ? 'true' : null",
|
|
461
469
|
"[attr.data-disabled]": "disabled() || null",
|
|
@@ -464,7 +472,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
|
|
|
464
472
|
"[attr.data-readonly]": "readonly() || null",
|
|
465
473
|
"[class]": "baseClass()",
|
|
466
474
|
"(blur)": "onTimeInputBlur()"
|
|
467
|
-
}, template: "<mona-text-box\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || readonlyInput()\"\n [required]=\"required()\"\n [value]=\"currentDateString()\"\n [inputAttributes]=\"inputAttributes()\"\n [invalid]=\"invalid()\"\n [placeholder]=\"placeholder()\"\n [rounded]=\"rounded()\"\n [size]=\"size()\"\n [touched]=\"touched()\"\n [clearButton]=\"showClearButton()\"\n (valueChange)=\"onDateStringEdit($event)\"\n (inputBlur)=\"onTimeInputBlur()\">\n <ng-template monaTextBoxSuffixTemplate>\n <button\n monaButton\n look=\"ghost\"\n [iconOnly]=\"true\"\n [size]=\"size()\"\n [rounded]=\"'none'\"\n (click)=\"onTimeInputButtonClick()\"\n class=\"aspect-square h-full w-auto\"\n [attr.aria-label]=\"messages().openTimePicker\"\n [attr.aria-expanded]=\"expanded()\"\n [attr.aria-controls]=\"popupId\"\n [disabled]=\"disabled() || readonly()\"\n [tabindex]=\"-1\">\n <
|
|
475
|
+
}, template: "<mona-text-box\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || readonlyInput()\"\n [required]=\"required()\"\n [value]=\"currentDateString()\"\n [inputAttributes]=\"inputAttributes()\"\n [invalid]=\"invalid()\"\n [placeholder]=\"placeholder()\"\n [rounded]=\"rounded()\"\n [size]=\"size()\"\n [touched]=\"touched()\"\n [clearButton]=\"showClearButton()\"\n (valueChange)=\"onDateStringEdit($event)\"\n (inputBlur)=\"onTimeInputBlur()\">\n <ng-template monaTextBoxSuffixTemplate>\n <button\n monaButton\n look=\"ghost\"\n [iconOnly]=\"true\"\n [size]=\"size()\"\n [rounded]=\"'none'\"\n (click)=\"onTimeInputButtonClick()\"\n class=\"aspect-square h-full w-auto\"\n [attr.aria-label]=\"messages().openTimePicker\"\n [attr.aria-expanded]=\"expanded()\"\n [attr.aria-controls]=\"popupId\"\n [disabled]=\"disabled() || readonly()\"\n [tabindex]=\"-1\">\n <svg lucideClock [size]=\"16\" aria-hidden=\"true\"></svg>\n </button>\n </ng-template>\n</mona-text-box>\n\n<ng-template #timePopupTemplate>\n <div\n [class]=\"pickerPopupClass()\"\n [id]=\"popupId\"\n aria-modal=\"true\"\n role=\"dialog\"\n [attr.aria-label]=\"messages().timePicker\"\n cdkTrapFocus>\n <mona-time-selector\n [value]=\"value()\"\n (valueChange)=\"onTimeSelectorValueChange($event)\"\n [max]=\"max()\"\n [min]=\"min()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [hourFormat]=\"hourFormat()\"\n [hourStep]=\"hourStep()\"\n [minuteStep]=\"minuteStep()\"\n [secondStep]=\"secondStep()\"\n [size]=\"size()\"\n [rounded]=\"rounded()\"\n [showSeconds]=\"showSeconds()\"></mona-time-selector>\n </div>\n</ng-template>\n" }]
|
|
468
476
|
}], ctorParameters: () => [], propDecorators: { timePopupTemplateRef: [{ type: i0.ViewChild, args: ["timePopupTemplate", { isSignal: true }] }], close: [{ type: i0.Output, args: ["close"] }], closed: [{ type: i0.Output, args: ["closed"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], format: [{ type: i0.Input, args: [{ isSignal: true, alias: "format", required: false }] }], hourFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "hourFormat", required: false }] }], hourStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "hourStep", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], minuteStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "minuteStep", required: false }] }], open: [{ type: i0.Output, args: ["open"] }], opened: [{ type: i0.Output, args: ["opened"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], popupClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "popupClass", required: false }] }], popupHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "popupHeight", required: false }] }], popupWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "popupWidth", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], readonlyInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonlyInput", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], rounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "rounded", required: false }] }], secondStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "secondStep", required: false }] }], showClearButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearButton", required: false }] }], showSeconds: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSeconds", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], touch: [{ type: i0.Output, args: ["touch"] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }] } });
|
|
469
477
|
|
|
470
478
|
/*
|
package/package.json
CHANGED
|
@@ -31,8 +31,8 @@ interface ColumnConfig {
|
|
|
31
31
|
readonly editable: boolean;
|
|
32
32
|
readonly field: string;
|
|
33
33
|
readonly filterable: boolean;
|
|
34
|
-
readonly format: ColumnFormat | null;
|
|
35
34
|
readonly footerTemplate: TemplateRef<unknown> | null;
|
|
35
|
+
readonly format: ColumnFormat | null;
|
|
36
36
|
readonly groupFooterTemplate: TemplateRef<unknown> | null;
|
|
37
37
|
readonly headerTemplate: TemplateRef<unknown> | null;
|
|
38
38
|
readonly hidden: boolean;
|
|
@@ -43,6 +43,7 @@ interface ColumnConfig {
|
|
|
43
43
|
readonly maxWidth: number | null;
|
|
44
44
|
readonly minWidth: number | null;
|
|
45
45
|
readonly removeConfirmation: boolean;
|
|
46
|
+
readonly sortable: boolean;
|
|
46
47
|
readonly stateKey: string | null;
|
|
47
48
|
readonly title: string;
|
|
48
49
|
readonly titleTemplate: TemplateRef<unknown> | null;
|
|
@@ -826,6 +827,10 @@ declare class GridColumnComponent implements GridColumnDefinition {
|
|
|
826
827
|
* @description The minimum width of this column in pixels.
|
|
827
828
|
*/
|
|
828
829
|
readonly minWidth: _angular_core.InputSignal<number>;
|
|
830
|
+
/**
|
|
831
|
+
* @description Whether this column can be sorted through its header when grid sorting is enabled. Has no effect if sorting is disabled on the grid.
|
|
832
|
+
*/
|
|
833
|
+
readonly sortable: _angular_core.InputSignal<boolean>;
|
|
829
834
|
/**
|
|
830
835
|
* @description A stable key used to persist state for columns whose field is empty or unstable.
|
|
831
836
|
*/
|
|
@@ -844,7 +849,7 @@ declare class GridColumnComponent implements GridColumnDefinition {
|
|
|
844
849
|
readonly width: _angular_core.InputSignal<number | null | undefined>;
|
|
845
850
|
getColumn(): Column;
|
|
846
851
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<GridColumnComponent, never>;
|
|
847
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<GridColumnComponent, "mona-grid-column", never, { "aggregate": { "alias": "aggregate"; "required": false; "isSignal": true; }; "editable": { "alias": "editable"; "required": false; "isSignal": true; }; "field": { "alias": "field"; "required": false; "isSignal": true; }; "filterable": { "alias": "filterable"; "required": false; "isSignal": true; }; "format": { "alias": "format"; "required": false; "isSignal": true; }; "hidden": { "alias": "hidden"; "required": false; "isSignal": true; }; "locked": { "alias": "locked"; "required": false; "isSignal": true; }; "lockedPosition": { "alias": "lockedPosition"; "required": false; "isSignal": true; }; "maxWidth": { "alias": "maxWidth"; "required": false; "isSignal": true; }; "minWidth": { "alias": "minWidth"; "required": false; "isSignal": true; }; "stateKey": { "alias": "stateKey"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; }, {}, ["cellTemplate", "editTemplate", "footerTemplate", "groupFooterTemplate", "headerTemplate", "titleTemplate"], never, true, never>;
|
|
852
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<GridColumnComponent, "mona-grid-column", never, { "aggregate": { "alias": "aggregate"; "required": false; "isSignal": true; }; "editable": { "alias": "editable"; "required": false; "isSignal": true; }; "field": { "alias": "field"; "required": false; "isSignal": true; }; "filterable": { "alias": "filterable"; "required": false; "isSignal": true; }; "format": { "alias": "format"; "required": false; "isSignal": true; }; "hidden": { "alias": "hidden"; "required": false; "isSignal": true; }; "locked": { "alias": "locked"; "required": false; "isSignal": true; }; "lockedPosition": { "alias": "lockedPosition"; "required": false; "isSignal": true; }; "maxWidth": { "alias": "maxWidth"; "required": false; "isSignal": true; }; "minWidth": { "alias": "minWidth"; "required": false; "isSignal": true; }; "sortable": { "alias": "sortable"; "required": false; "isSignal": true; }; "stateKey": { "alias": "stateKey"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; }, {}, ["cellTemplate", "editTemplate", "footerTemplate", "groupFooterTemplate", "headerTemplate", "titleTemplate"], never, true, never>;
|
|
848
853
|
}
|
|
849
854
|
|
|
850
855
|
interface ColumnFilterState {
|