@myrmidon/cadmus-ui 14.0.0 → 15.1.0

package/index.d.ts

@@ -1,12 +1,13 @@
 import * as _angular_core from '@angular/core';
-import { OnInit, ElementRef, OnDestroy } from '@angular/core';
-import { FormGroup, UntypedFormGroup, FormArray, FormBuilder, UntypedFormControl, UntypedFormBuilder, FormControl, ValidatorFn, AbstractControl } from '@angular/forms';
-import { TokenLocation, TextLayerService, FacetDefinition, FlagDefinition, LayerHint, DataPinInfo, IndexLookupDefinitions, Thesaurus, PartTypeIds, ThesaurusEntry, Part, Fragment, PartIdentity, FragmentIdentity, EditedObject } from '@myrmidon/cadmus-core';
+import { OnInit, ElementRef, OnDestroy, Type } from '@angular/core';
+import { FormGroup, UntypedFormGroup, FormArray, FormControl, FormBuilder, UntypedFormControl, UntypedFormBuilder, ValidatorFn, AbstractControl } from '@angular/forms';
+import { TokenLocation, TextLayerService, FacetDefinition, FlagDefinition, LayerHint, DataPinInfo, IndexLookupDefinitions, Thesaurus, PartTypeIds, Part, Fragment, PartIdentity, FragmentIdentity, EditedObject } from '@myrmidon/cadmus-core';
 import { DialogService } from '@myrmidon/ngx-mat-tools';
 import { Observable, BehaviorSubject } from 'rxjs';
 import { ItemService, FacetService, UserService } from '@myrmidon/cadmus-api';
-import { NestedTreeControl } from '@angular/cdk/tree';
-import { MatTreeNestedDataSource } from '@angular/material/tree';
+import { PagedTreeStoreService, TreeNodeFilter, PagedTreeNode, PagedTreeStore, PageChangeRequest } from '@myrmidon/paged-data-browsers';
+import { DataPage } from '@myrmidon/ngx-tools';
+import { MatDialogRef } from '@angular/material/dialog';
 import { AuthJwtService, User } from '@myrmidon/auth-jwt-login';
 import { AppRepository } from '@myrmidon/cadmus-state';
 import { RefLookupService, RefLookupFilter } from '@myrmidon/cadmus-refs-lookup';
@@ -39,7 +40,7 @@ declare class DecoratedTokenTextComponent implements OnInit {
      * A selected token-based location.
      */
     readonly selectedLocation: _angular_core.InputSignal<TokenLocation | undefined>;
-    text?: string;
+    readonly text: _angular_core.WritableSignal<string | undefined>;
     constructor(_textLayerService: TextLayerService);
     ngOnInit(): void;
     private decorate;
@@ -110,9 +111,9 @@ declare class FacetBadgeComponent {
     private _colorService;
     private _facetColors;
     private _facetTips;
-    color: string;
-    contrastColor: string;
-    tip?: string;
+    readonly color: _angular_core.WritableSignal<string>;
+    readonly contrastColor: _angular_core.WritableSignal<string>;
+    readonly tip: _angular_core.WritableSignal<string | undefined>;
     /**
      * The facet data.
      */
@@ -137,8 +138,8 @@ interface FlagsBadgeData {
  * with the flag's color key.
  */
 declare class FlagsBadgeComponent {
-    badgeFlags: FlagDefinition[];
     readonly data: _angular_core.InputSignal<FlagsBadgeData | undefined>;
+    readonly badgeFlags: _angular_core.WritableSignal<FlagDefinition[]>;
     constructor();
     private updateBadge;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<FlagsBadgeComponent, never>;
@@ -157,7 +158,7 @@ declare class LayerHintsComponent {
     readonly requestMove: _angular_core.OutputEmitterRef<LayerHint>;
     readonly requestPatch: _angular_core.OutputEmitterRef<string[]>;
     form: FormGroup;
-    checks: FormArray;
+    checks: FormArray<FormControl<boolean>>;
     constructor(_formBuilder: FormBuilder, _dialogService: DialogService);
     private updateChecks;
     emitRequestEdit(hint: LayerHint): void;
@@ -211,7 +212,7 @@ declare class LookupPinComponent implements OnInit {
     form: UntypedFormGroup;
     lookup: UntypedFormControl;
     entries$: Observable<DataPinInfo[]> | undefined;
-    entry: DataPinInfo | undefined;
+    readonly entry: _angular_core.WritableSignal<DataPinInfo | undefined>;
     constructor(formBuilder: UntypedFormBuilder, _itemService: ItemService, _lookupDefs: IndexLookupDefinitions);
     /**
      * The lookup key to be used for this component.
@@ -228,6 +229,98 @@ declare class LookupPinComponent implements OnInit {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<LookupPinComponent, "cadmus-lookup-pin", never, { "initialValue": { "alias": "initialValue"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "limit": { "alias": "limit"; "required": false; "isSignal": true; }; "resetOnPick": { "alias": "resetOnPick"; "required": false; "isSignal": true; }; "lookupKey": { "alias": "lookupKey"; "required": false; "isSignal": true; }; }, { "entryChange": "entryChange"; }, never, never, true, never>;
 }
 
+interface ThesaurusEntry {
+    id: string;
+    value: string;
+}
+/**
+ * The filter for thesaurus entry nodes. The only filtered property is
+ * the node's label.
+ */
+interface ThesEntryNodeFilter extends TreeNodeFilter {
+    label?: string;
+}
+/**
+ * The tree node for thesaurus entries in a paging tree node.
+ */
+interface ThesEntryPagedTreeNode extends PagedTreeNode<ThesEntryNodeFilter> {
+    key: string;
+    value: string;
+}
+/**
+ * A label rendering function which removes from a label
+ * all the characters past the last colon, trimming the result.
+ * This is a typical rendering when dealing with hierarchical
+ * thesaurus entries, e.g. "furniture: table: color", where
+ * we can shorten the label to just "color", as "furniture"
+ * and "table" are its ancestors.
+ */
+declare const renderLabelFromLastColon: (label: string) => string;
+/**
+ * A static paged tree store service for thesaurus entries.
+ * This builds the tree nodes from the thesaurus entries, assuming
+ * that entry IDs are hierarchical and separated by dots (.).
+ */
+declare class StaticThesPagedTreeStoreService implements PagedTreeStoreService<ThesEntryNodeFilter> {
+    private _renderLabel?;
+    private _nodes;
+    private _built;
+    private readonly _entries;
+    constructor(entries: ThesaurusEntry[], _renderLabel?: ((label: string) => string) | undefined);
+    private ensureNodes;
+    /**
+     * Get the specified page of nodes.
+     * @param filter The filter.
+     * @param pageNumber The page number.
+     * @param pageSize The page size.
+     * @param hasMockRoot Whether the root node is a mock node. Not used here.
+     */
+    getNodes(filter: ThesEntryNodeFilter, pageNumber: number, pageSize: number, hasMockRoot?: boolean): Observable<DataPage<ThesEntryPagedTreeNode>>;
+}
+
+declare class ThesPagedTreeBrowserComponent implements OnInit, OnDestroy {
+    private _dialog;
+    private _sub?;
+    /**
+     * The service to use to load the nodes.
+     */
+    readonly service: _angular_core.InputSignal<StaticThesPagedTreeStoreService>;
+    /**
+     * Emitted when a node is clicked.
+     */
+    readonly nodePick: _angular_core.OutputEmitterRef<ThesEntryPagedTreeNode>;
+    /**
+     * The store instance, built from the service.
+     */
+    readonly store: _angular_core.Signal<PagedTreeStore<ThesEntryPagedTreeNode, ThesEntryNodeFilter>>;
+    readonly loading: _angular_core.WritableSignal<boolean>;
+    debug: FormControl<boolean>;
+    hideLoc: FormControl<boolean>;
+    hideFilter: FormControl<boolean>;
+    filter$: Observable<Readonly<ThesEntryNodeFilter>>;
+    nodes$: Observable<Readonly<ThesEntryPagedTreeNode[]>>;
+    label: FormControl<string | null>;
+    form: FormGroup<{
+        label: FormControl<string | null>;
+    }>;
+    constructor();
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    reset(): void;
+    onToggleExpanded(node: ThesEntryPagedTreeNode): void;
+    onPageChangeRequest(request: PageChangeRequest): void;
+    onFilterChange(filter: ThesEntryNodeFilter | null | undefined): void;
+    onEditFilterRequest(node: ThesEntryPagedTreeNode): void;
+    expandAll(): void;
+    collapseAll(): void;
+    clear(): void;
+    onNodeClick(node: ThesEntryPagedTreeNode): void;
+    findLabels(): void;
+    removeHilites(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ThesPagedTreeBrowserComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ThesPagedTreeBrowserComponent, "cadmus-thes-paged-tree-browser", never, { "service": { "alias": "service"; "required": false; "isSignal": true; }; }, { "nodePick": "nodePick"; }, never, never, true, never>;
+}
+
 declare enum PartBadgeType {
     partAndRole = 0,
     partOnly = 1,
@@ -252,10 +345,6 @@ declare function getPartIdName(typeId: string, roleId?: string | null, typeThesa
 declare class PartBadgeComponent {
     private _facetService;
     private _colorService;
-    typeName: string | undefined;
-    roleName: string | undefined;
-    color: string;
-    contrastColor: string;
     /**
      * The badge type: 0=part and role, 1=part only, 2=role only.
      */
@@ -272,6 +361,10 @@ declare class PartBadgeComponent {
      * The part type IDs.
      */
     readonly partTypeIds: _angular_core.InputSignal<PartTypeIds | undefined>;
+    readonly typeName: _angular_core.WritableSignal<string | undefined>;
+    readonly roleName: _angular_core.WritableSignal<string | undefined>;
+    readonly color: _angular_core.WritableSignal<string>;
+    readonly contrastColor: _angular_core.WritableSignal<string>;
     constructor(_facetService: FacetService, _colorService: ColorService);
     private getPartColor;
     /**
@@ -286,23 +379,29 @@ declare class PartBadgeComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<PartBadgeComponent, "cadmus-part-badge", never, { "badgeType": { "alias": "badgeType"; "required": false; "isSignal": true; }; "typeThesaurus": { "alias": "typeThesaurus"; "required": false; "isSignal": true; }; "facetDefinition": { "alias": "facetDefinition"; "required": false; "isSignal": true; }; "partTypeIds": { "alias": "partTypeIds"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
-interface TreeNode {
-    id: string;
-    label: string;
-    originalLabel?: string;
-    parent?: TreeNode;
-    children?: TreeNode[];
-    clickable?: boolean;
-}
 /**
- * A label rendering function which removes from a label
- * all the characters past the last colon, trimming the result.
- * This is a typical rendering when dealing with hierarchical
- * thesaurus entries, e.g. "furniture: table: color", where
- * we can shorten the label to just "color", as "furniture"
- * and "table" are its ancestors.
+ * A filter to be used for thesaurus paged tree browsers.
  */
-declare const renderLabelFromLastColon: (label: string) => string;
+declare class ThesPagedTreeFilterComponent implements OnInit {
+    readonly dialogRef: MatDialogRef<ThesPagedTreeFilterComponent, any> | null;
+    readonly data: any;
+    /**
+     * The filter.
+     */
+    readonly filter: _angular_core.ModelSignal<ThesEntryNodeFilter | null | undefined>;
+    readonly wrapped: _angular_core.WritableSignal<boolean>;
+    label: FormControl<string | null>;
+    form: FormGroup;
+    constructor();
+    ngOnInit(): void;
+    private updateForm;
+    private getFilter;
+    reset(): void;
+    apply(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ThesPagedTreeFilterComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ThesPagedTreeFilterComponent, "cadmus-thes-paged-tree-filter", never, { "filter": { "alias": "filter"; "required": false; "isSignal": true; }; }, { "filter": "filterChange"; }, never, never, true, never>;
+}
+
 /**
  * Thesaurus tree component.
  * This component displays a set of hierarchical thesaurus entries
@@ -316,54 +415,30 @@ declare const renderLabelFromLastColon: (label: string) => string;
  * event is emitted. Note that even if you specify a label renderer
  * function, the event always emits the original label.
  */
-declare class ThesaurusTreeComponent implements OnInit {
+declare class ThesaurusTreeComponent {
     /**
      * The thesaurus entries.
      */
     readonly entries: _angular_core.InputSignal<ThesaurusEntry[] | undefined>;
-    /**
-     * The label for the root node.
-     */
-    readonly rootLabel: _angular_core.InputSignal<string>;
     /**
      * The optional node label rendering function.
      */
-    readonly renderLabel: _angular_core.InputSignal<((label: string) => string) | undefined>;
+    readonly renderLabel: _angular_core.InputSignal<(label: string) => string>;
     /**
      * Fired when a thesaurus entry is selected.
      */
     readonly entryChange: _angular_core.OutputEmitterRef<ThesaurusEntry>;
-    root: TreeNode;
-    treeControl: NestedTreeControl<TreeNode>;
-    treeDataSource: MatTreeNestedDataSource<TreeNode>;
-    filter: FormControl<string | null>;
-    form: FormGroup;
-    foundNodes: TreeNode[] | undefined;
-    hasChildren: (index: number, node: TreeNode) => boolean | undefined;
-    isRoot: (index: number, node: TreeNode) => boolean;
-    constructor(formBuilder: FormBuilder);
-    ngOnInit(): void;
-    private initTree;
-    private getLabel;
-    private addNode;
-    /**
-     * Build a tree model from a list of name=value pairs,
-     * where each value can include one or more components separated by
-     * the specified separator.
-     * @param entries The entries to add.
-     * @param separator string The separator string to use for values.
-     */
-    buildTreeModel(entries: ThesaurusEntry[], separator?: string): TreeNode;
-    onTreeNodeClick(node: TreeNode): void;
-    expandAll(): void;
-    collapseAll(): void;
-    private expandFromNode;
-    private expandMatchingNodes;
-    find(): void;
-    resetFilter(): void;
-    isFoundNode(node: TreeNode): boolean;
+    /**
+     * The tree store service, dependent on the current entries and renderLabel.
+     */
+    readonly service: _angular_core.Signal<StaticThesPagedTreeStoreService>;
+    /**
+     * The filter component class to use.
+     */
+    readonly filterComponent: Type<ThesPagedTreeFilterComponent>;
+    onNodePick(node: ThesEntryPagedTreeNode): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ThesaurusTreeComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ThesaurusTreeComponent, "cadmus-thesaurus-tree", never, { "entries": { "alias": "entries"; "required": false; "isSignal": true; }; "rootLabel": { "alias": "rootLabel"; "required": false; "isSignal": true; }; "renderLabel": { "alias": "renderLabel"; "required": false; "isSignal": true; }; }, { "entryChange": "entryChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ThesaurusTreeComponent, "cadmus-thesaurus-tree", never, { "entries": { "alias": "entries"; "required": false; "isSignal": true; }; "renderLabel": { "alias": "renderLabel"; "required": false; "isSignal": true; }; }, { "entryChange": "entryChange"; }, never, never, true, never>;
 }
 
 /**
@@ -570,5 +645,5 @@ declare const extractTouchedChanges: (control: ObjectLike<AbstractControl, "mark
  */
 declare const extractPristineChanges: (control: ObjectLike<AbstractControl, "markAsPristine" | "markAsDirty">) => Observable<boolean>;
 
-export { CloseSaveButtonsComponent, ColorService, CustomValidators, DecoratedTokenTextComponent, ErrorListComponent, FacetBadgeComponent, FlagsBadgeComponent, JsonValidators, LayerHintsComponent, LookupPinComponent, ModelEditorComponentBase, PartBadgeComponent, PartBadgeType, ThesaurusTreeComponent, UserRefLookupService, extractPristineChanges, extractTouchedChanges, getPartIdName, renderLabelFromLastColon };
-export type { ArgumentsType, FacetBadgeData, FlagsBadgeData, UserWithRoles };
+export { CloseSaveButtonsComponent, ColorService, CustomValidators, DecoratedTokenTextComponent, ErrorListComponent, FacetBadgeComponent, FlagsBadgeComponent, JsonValidators, LayerHintsComponent, LookupPinComponent, ModelEditorComponentBase, PartBadgeComponent, PartBadgeType, StaticThesPagedTreeStoreService, ThesPagedTreeBrowserComponent, ThesaurusTreeComponent, UserRefLookupService, extractPristineChanges, extractTouchedChanges, getPartIdName, renderLabelFromLastColon };
+export type { ArgumentsType, FacetBadgeData, FlagsBadgeData, ThesEntryNodeFilter, ThesEntryPagedTreeNode, ThesaurusEntry, UserWithRoles };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@myrmidon/cadmus-ui",
-  "version": "14.0.0",
+  "version": "15.1.0",
   "description": "Cadmus - general UI components.",
   "keywords": [
     "Cadmus"
@@ -16,9 +16,10 @@
   "peerDependencies": {
     "@angular/common": "^20.0.0",
     "@angular/core": "^20.0.0",
+    "@angular/material": "^20.0.0",
     "@myrmidon/ngx-tools": "^2.0.0",
-    "@myrmidon/cadmus-refs-lookup": "^9.0.1",
-    "@myrmidon/cadmus-core": "^12.0.1"
+    "@myrmidon/cadmus-refs-lookup": "^10.0.3",
+    "@myrmidon/cadmus-core": "^12.0.2"
   },
   "dependencies": {
     "tslib": "^2.3.0"