@alfresco/adf-content-services
Version:
Alfresco ADF content services
562 lines • 123 kB
JavaScript
/*!
* @license
* Copyright © 2005-2025 Hyland Software, Inc. and its affiliates. All rights reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Component, DestroyRef, EventEmitter, inject, Input, Output, ViewChild, ViewEncapsulation } from '@angular/core';
import { CustomEmptyContentTemplateDirective, DataColumnComponent, DataColumnListComponent, HighlightDirective, InfinitePaginationComponent, ShowHeaderMode, ToolbarComponent, ToolbarTitleComponent, UserPreferencesService, UserPreferenceValues } from '@alfresco/adf-core';
import { NodesApiService, SitesService, UploadService } from '../../common';
import { ReactiveFormsModule, UntypedFormControl } from '@angular/forms';
import { Pagination, SiteEntry, SitePaging } from '@alfresco/js-api';
import { DocumentListComponent } from '../../document-list/components/document-list.component';
import { CustomResourcesService } from '../../document-list/services/custom-resources.service';
import { debounceTime } from 'rxjs/operators';
import { ContentNodeSelectorPanelService } from './content-node-selector-panel.service';
import { CommonModule } from '@angular/common';
import { MatFormFieldModule } from '@angular/material/form-field';
import { TranslateModule } from '@ngx-translate/core';
import { MatInputModule } from '@angular/material/input';
import { AutoFocusDirective } from '../../directives/auto-focus.directive';
import { NodeCounterDirective } from '../../directives/node-counter.directive';
import { MatIconModule } from '@angular/material/icon';
import { DropdownSitesComponent } from '../site-dropdown/sites-dropdown.component';
import { MatButtonModule } from '@angular/material/button';
import { NameLocationCellComponent } from '../name-location-cell/name-location-cell.component';
import { DropdownBreadcrumbComponent } from '../../breadcrumb/dropdown-breadcrumb.component';
import { SearchQueryBuilderService } from '../../search/services/search-query-builder.service';
import { SearchPanelComponent } from '../../search/components/search-panel/search-panel.component';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import * as i0 from "@angular/core";
import * as i1 from "../../document-list/services/custom-resources.service";
import * as i2 from "../../search/services/search-query-builder.service";
import * as i3 from "@alfresco/adf-core";
import * as i4 from "../../common";
import * as i5 from "./content-node-selector-panel.service";
import * as i6 from "@angular/common";
import * as i7 from "@angular/material/form-field";
import * as i8 from "@ngx-translate/core";
import * as i9 from "@angular/material/input";
import * as i10 from "@angular/forms";
import * as i11 from "@angular/material/icon";
import * as i12 from "@angular/material/button";
export const defaultValidation = () => true;
export class ContentNodeSelectorPanelComponent {
/**
* Custom row filter function. See the
* [Row Filter Model](row-filter.model.md) page
* for more information.
*/
set rowFilter(rowFilter) {
this.createRowFilter(rowFilter);
}
get rowFilter() {
return this._rowFilter;
}
/**
* Custom list of site content componentIds.
* Used to filter out the corresponding items from the displayed nodes
*/
set excludeSiteContent(excludeSiteContent) {
this._excludeSiteContent = excludeSiteContent;
this.createRowFilter(this._rowFilter);
}
get excludeSiteContent() {
return this._excludeSiteContent;
}
/** Toggle search input rendering */
set showSearch(value) {
if (value !== undefined && value !== null) {
this.showSearchField = value;
}
}
get showSearch() {
return this.showSearchField;
}
/** Toggle sites list dropdown rendering */
set showDropdownSiteList(value) {
if (value !== undefined && value !== null) {
this.showSiteList = value;
}
}
get showDropdownSiteList() {
return this.showSiteList;
}
/** Shows the files and folders in the search result */
set showFilesInResult(value) {
if (value !== undefined && value !== null) {
const showFilesQuery = `TYPE:'cm:folder'${value ? ` OR TYPE:'cm:content'` : ''}`;
this.queryBuilderService.addFilterQuery(showFilesQuery);
}
}
/** Shows the node counter in the breadcrumb */
set showNodeCounter(value) {
this.showCounter = value ?? false;
}
get showNodeCounter() {
return this.showCounter;
}
constructor(customResourcesService, queryBuilderService, userPreferencesService, nodesApiService, uploadService, sitesService, contentNodeSelectorPanelService) {
this.customResourcesService = customResourcesService;
this.queryBuilderService = queryBuilderService;
this.userPreferencesService = userPreferencesService;
this.nodesApiService = nodesApiService;
this.uploadService = uploadService;
this.sitesService = sitesService;
this.contentNodeSelectorPanelService = contentNodeSelectorPanelService;
// eslint-disable-next-line @typescript-eslint/naming-convention
this.DEFAULT_PAGINATION = new Pagination({
maxItems: 25,
skipCount: 0
});
this.disableActionFolderList = ['-mysites-'];
this.showSiteList = true;
this.showSearchField = true;
this.showCounter = false;
this._emptyList = true;
/** If true will restrict the search and breadcrumbs to the currentFolderId */
this.restrictRootToCurrentFolderId = false;
/** Node ID of the folder currently listed. */
this.currentFolderId = null;
/**
* Hide the "My Files" option added to the site list by default.
* See the [Sites Dropdown component](sites-dropdown.component.md)
* for more information.
*/
this.dropdownHideMyFiles = false;
/**
* Custom site for site dropdown. This is the same as the `siteList`.
* property of the Sites Dropdown component (see its doc page
* for more information).
*/
this.dropdownSiteList = null;
this._rowFilter = defaultValidation;
this._excludeSiteContent = [];
/**
* Custom image resolver function. See the
* [Image Resolver Model](image-resolver.model.md) page
* for more information.
*/
this.imageResolver = null;
/** Number of items shown per page in the list. */
this.pageSize = this.DEFAULT_PAGINATION.maxItems;
/** Define the selection mode for document list. The allowed values are single or multiple */
this.selectionMode = 'single';
/**
* Function used to decide if the selected node has permission to be selected.
* Default value is a function that always returns true.
*/
this.isSelectionValid = defaultValidation;
/** Emitted when the user has chosen an item. */
this.select = new EventEmitter();
/** Emitted when the navigation changes. */
this.navigationChange = new EventEmitter();
/** Emitted when the select site changes. */
this.siteChange = new EventEmitter();
/** Emitted when search is running. */
this.showingSearch = new EventEmitter();
/** Emitted when current folder loaded. */
this.currentFolder = new EventEmitter();
/** Emitted when folder loaded. */
this.folderLoaded = new EventEmitter();
this.nodePaging = null;
this.searchTerm = '';
this.showingSearchResults = false;
this.loadingSearchResults = false;
this.inDialog = false;
this._chosenNode = null;
this.selectionWithoutValidation = null;
this.folderIdToShow = null;
this.breadcrumbFolderTitle = null;
this.startSiteGuid = null;
this.hasValidQuery = false;
this.showHeader = ShowHeaderMode.Never;
this.infiniteScroll = false;
this.debounceSearch = 200;
this.searchInput = new UntypedFormControl();
this.preselectedNodes = [];
this.currentUploadBatch = [];
this.sorting = ['createdAt', 'desc'];
this.searchPanelExpanded = false;
this.destroyRef = inject(DestroyRef);
}
set chosenNode(value) {
this._chosenNode = value;
this.select.next(value);
}
get chosenNode() {
return this._chosenNode;
}
get emptyList() {
return this._emptyList;
}
getSelectedCount() {
return this.chosenNode?.length || 0;
}
ngOnInit() {
this.searchInput.valueChanges
.pipe(debounceTime(this.debounceSearch), takeUntilDestroyed(this.destroyRef))
.subscribe((searchValue) => {
this.searchTerm = searchValue;
this.queryBuilderService.userQuery = searchValue.length > 0 ? `${searchValue}*` : searchValue;
this.queryBuilderService.update();
});
this.queryBuilderService.updated.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((searchRequest) => {
if (searchRequest) {
this.hasValidQuery = true;
this.prepareDialogForNewSearch(searchRequest);
this.queryBuilderService.execute(false, searchRequest);
}
else {
this.hasValidQuery = false;
this.resetFolderToShow();
this.clearSearch();
}
});
this.queryBuilderService.executed.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((results) => {
if (this.hasValidQuery) {
this.showSearchResults(results);
}
});
this.userPreferencesService
.select(UserPreferenceValues.PaginationSize)
.pipe(takeUntilDestroyed(this.destroyRef))
.subscribe((pagSize) => (this.pageSize = pagSize));
this.target = this.documentList;
this.folderIdToShow = this.currentFolderId;
if (this.currentFolderId) {
if (this.restrictRootToCurrentFolderId) {
this.breadcrumbRootId = this.currentFolderId;
this.siteId = this.currentFolderId;
}
else {
this.getStartSite();
}
}
this.breadcrumbTransform = this.breadcrumbTransform ? this.breadcrumbTransform : null;
this.isSelectionValid = this.isSelectionValid ? this.isSelectionValid : defaultValidation;
this.onFileUploadEvent();
this.onFileUploadDeletedEvent();
this.resetPagination();
this.setSearchScopeToNodes();
this.documentList.$folderNode.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((currentNode) => {
this.currentFolder.emit(currentNode);
});
}
toggleSearchPanel() {
this.searchPanelExpanded = !this.searchPanelExpanded;
}
hasCustomModels() {
return this.contentNodeSelectorPanelService?.customModels?.length > 0;
}
onFileUploadEvent() {
this.uploadService.fileUploadComplete
.pipe(debounceTime(500), takeUntilDestroyed(this.destroyRef))
.subscribe((fileUploadEvent) => {
this.currentUploadBatch.push(fileUploadEvent.data);
if (!this.uploadService.isUploading()) {
this.preselectedNodes = this.getPreselectNodesBasedOnSelectionMode();
this.currentUploadBatch = [];
this.documentList.reloadWithoutResettingSelection();
}
});
}
onFileUploadDeletedEvent() {
this.uploadService.fileUploadDeleted.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((deletedFileEvent) => {
this.documentList.unselectRowFromNodeId(deletedFileEvent.file.data.entry.id);
this.documentList.reloadWithoutResettingSelection();
});
}
getStartSite() {
this.nodesApiService.getNode(this.currentFolderId).subscribe((startNodeEntry) => {
this.startSiteGuid = this.sitesService.getSiteNameFromNodePath(startNodeEntry);
if (this.startSiteGuid) {
this.sitesService.getSite(this.startSiteGuid).subscribe((startSiteEntry) => {
if (startSiteEntry instanceof SiteEntry) {
this.siteChange.emit(startSiteEntry.entry.title);
}
});
}
});
}
createRowFilter(filter) {
if (!filter) {
filter = () => true;
}
this._rowFilter = (value, index, array) => filter(value, index, array) && !this.isExcludedSiteContent(value);
}
isExcludedSiteContent(row) {
const entry = row.node.entry;
if (this._excludeSiteContent?.length && entry?.properties?.['st:componentId']) {
const excludedItem = this._excludeSiteContent.find((id) => entry.properties['st:componentId'] === id);
return !!excludedItem;
}
return false;
}
/**
* Updates the site attribute and starts a new search
*
* @param chosenSite SiteEntry to search within
*/
siteChanged(chosenSite) {
this.siteId = chosenSite.entry.guid;
this.setTitleIfCustomSite(chosenSite);
this.siteChange.emit(chosenSite.entry.title);
this.queryBuilderService.update();
}
/**
* Get current breadcrumb folder node
*
* @returns the actually selected|entered folder node or null in case of searching for the breadcrumb
*/
get breadcrumbFolderNode() {
let folderNode;
if (this.showingSearchResults && this.selectionWithoutValidation?.length) {
folderNode = this.selectionWithoutValidation[0];
}
else {
folderNode = this.documentList.folderNode;
}
return folderNode;
}
/**
* Prepares the dialog for a new search
*
* @param searchRequest request options
*/
prepareDialogForNewSearch(searchRequest) {
this.target = searchRequest ? null : this.documentList;
if (this.target) {
this.infinitePaginationComponent.reset();
}
this.folderIdToShow = null;
this.preselectedNodes = [];
this.loadingSearchResults = true;
this.addCorrespondingNodeIdsQuery();
this.resetChosenNode();
}
/**
* Clear the search input and reset to last folder node in which search was performed
*/
clear() {
this.searchTerm = '';
this.queryBuilderService.userQuery = '';
this.queryBuilderService.update();
}
/**
* Resets the folder to be shown with the site selection or the initial landing folder
*/
resetFolderToShow() {
this.folderIdToShow = this.siteId || this.currentFolderId;
}
/**
* Clear the search input and search related data
*/
clearSearch() {
this.searchTerm = '';
this.nodePaging = null;
this.resetPagination();
this.resetChosenNode();
this.showingSearchResults = false;
this.showingSearch.emit(this.showingSearchResults);
}
addCorrespondingNodeIdsQuery() {
let extraParentFiltering = '';
if (this.customResourcesService.hasCorrespondingNodeIds(this.siteId)) {
this.customResourcesService.getCorrespondingNodeIds(this.siteId).subscribe((nodeIds) => {
if (nodeIds?.length) {
nodeIds
.filter((id) => id !== this.siteId)
.forEach((extraId) => {
extraParentFiltering += ` OR ANCESTOR:'workspace://SpacesStore/${extraId}'`;
});
}
const parentFiltering = this.siteId ? `ANCESTOR:'workspace://SpacesStore/${this.siteId}'${extraParentFiltering}` : '';
this.queryBuilderService.addFilterQuery(parentFiltering);
});
}
else {
const parentFiltering = this.siteId ? `ANCESTOR:'workspace://SpacesStore/${this.siteId}'` : '';
this.queryBuilderService.addFilterQuery(parentFiltering);
}
}
setSearchScopeToNodes() {
const scope = {
locations: 'nodes'
};
this.queryBuilderService.setScope(scope);
}
/**
* Show the results of the search
*
* @param results Search results
*/
showSearchResults(results) {
this.showingSearchResults = true;
this.loadingSearchResults = false;
this.showingSearch.emit(this.showingSearchResults);
this.nodePaging = results;
}
/**
* Sets showingSearchResults state to be able to differentiate between search results or folder results
*
* @param $event node event
*/
onFolderChange($event) {
this.folderIdToShow = $event.value.id;
this.showingSearchResults = false;
this.infiniteScroll = false;
this.breadcrumbFolderTitle = null;
this.preselectedNodes = [];
this.clearSearch();
this.navigationChange.emit($event);
}
/**
* Attempts to set the currently loaded node
*
* @param nodePaging pagination model
*/
onFolderLoaded(nodePaging) {
setTimeout(() => {
this._emptyList = !this.documentList.data.getRows().length;
});
this.updatePaginationAfterRowFilter(nodePaging);
if (!this.showingSearchResults) {
this.attemptNodeSelection(this.documentList.folderNode);
}
this.folderLoaded.emit();
}
/**
* Updates pagination.hasMoreItems to false after filtering only folders during 'COPY' and 'MOVE' action
*
* @param nodePaging pagination model
*/
updatePaginationAfterRowFilter(nodePaging) {
if (this.documentList.data.getRows().length < nodePaging.list.pagination.maxItems) {
nodePaging.list.pagination.hasMoreItems = false;
}
}
/**
* Returns whether breadcrumb has to be shown or not
*
* @returns `true` if needs to show the breadcrumb, otherwise `false`
*/
showBreadcrumbs() {
return !this.showingSearchResults || this.chosenNode;
}
/**
* Loads the next batch of search results
*
* @param pagination Pagination object
*/
getNextPageOfSearch(pagination) {
this.infiniteScroll = true;
this.queryBuilderService.paging.maxItems = pagination.maxItems;
this.queryBuilderService.paging.skipCount = pagination.skipCount;
if (this.searchTerm.length > 0) {
this.queryBuilderService.update();
}
}
/**
* Selects node as chosen if it has the right permission, clears the selection otherwise
*
* @param entry node entry
*/
attemptNodeSelection(entry) {
if (entry && this.isSelectionValid(entry) && !this.isActionDisabledForFolder(this.documentList.currentFolderId)) {
this.chosenNode = [entry];
}
}
isActionDisabledForFolder(folderId) {
return this.disableActionFolderList.includes(folderId);
}
/**
* Clears the chosen node
*/
resetChosenNode() {
this.chosenNode = null;
}
/**
* It filters and emit the selection coming from the document list
*
* @param nodesEntries selected nodes
*/
onCurrentSelection(nodesEntries) {
const validNodesEntity = nodesEntries.filter((node) => this.isSelectionValid(node.entry));
this.chosenNode = validNodesEntity.map((node) => node.entry);
this.selectionWithoutValidation = nodesEntries.map((node) => node.entry);
}
setTitleIfCustomSite(site) {
if (this.customResourcesService.isCustomSource(site.entry.guid)) {
this.breadcrumbFolderTitle = site.entry.title;
if (this.documentList.folderNode.path.elements) {
this.breadcrumbFolderNode.name = site.entry.title;
this.documentList.folderNode.path.elements = null;
}
}
else {
this.breadcrumbFolderTitle = null;
}
}
hasPreselectNodes() {
return this.preselectedNodes?.length > 0;
}
isSingleSelectionMode() {
return this.selectionMode === 'single';
}
getPreselectNodesBasedOnSelectionMode() {
let selectedNodes = [];
if (this.currentUploadBatch?.length) {
if (this.isSingleSelectionMode()) {
selectedNodes = [this.currentUploadBatch[this.currentUploadBatch.length - 1]];
}
else {
selectedNodes = this.currentUploadBatch;
}
}
return selectedNodes;
}
resetPagination() {
this.queryBuilderService.paging = {
maxItems: this.pageSize,
skipCount: this.DEFAULT_PAGINATION.skipCount
};
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: ContentNodeSelectorPanelComponent, deps: [{ token: i1.CustomResourcesService }, { token: i2.SearchQueryBuilderService }, { token: i3.UserPreferencesService }, { token: i4.NodesApiService }, { token: i4.UploadService }, { token: i4.SitesService }, { token: i5.ContentNodeSelectorPanelService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.3", type: ContentNodeSelectorPanelComponent, isStandalone: true, selector: "adf-content-node-selector-panel", inputs: { restrictRootToCurrentFolderId: "restrictRootToCurrentFolderId", currentFolderId: "currentFolderId", dropdownHideMyFiles: "dropdownHideMyFiles", dropdownSiteList: "dropdownSiteList", where: "where", rowFilter: "rowFilter", excludeSiteContent: "excludeSiteContent", imageResolver: "imageResolver", pageSize: "pageSize", selectionMode: "selectionMode", isSelectionValid: "isSelectionValid", breadcrumbTransform: "breadcrumbTransform", showSearch: "showSearch", showDropdownSiteList: "showDropdownSiteList", showFilesInResult: "showFilesInResult", showNodeCounter: "showNodeCounter" }, outputs: { select: "select", navigationChange: "navigationChange", siteChange: "siteChange", showingSearch: "showingSearch", currentFolder: "currentFolder", folderLoaded: "folderLoaded" }, host: { classAttribute: "adf-content-node-selector-panel" }, providers: [SearchQueryBuilderService], viewQueries: [{ propertyName: "documentList", first: true, predicate: ["documentList"], descendants: true, static: true }, { propertyName: "highlighter", first: true, predicate: HighlightDirective, descendants: true, static: true }, { propertyName: "infinitePaginationComponent", first: true, predicate: InfinitePaginationComponent, descendants: true, static: true }], ngImport: i0, template: "<div class=\"adf-content-node-selector-content\">\n <mat-form-field floatPlaceholder=\"never\"\n appearance=\"fill\"\n class=\"adf-content-node-selector-content-input\"\n subscriptSizing=\"dynamic\"\n *ngIf=\"showSearch\">\n <mat-label>{{ 'NODE_SELECTOR.SEARCH' | translate }}</mat-label>\n <input matInput\n id=\"searchInput\"\n [formControl]=\"searchInput\"\n type=\"text\"\n [value]=\"searchTerm\"\n adf-auto-focus\n data-automation-id=\"content-node-selector-search-input\">\n\n <mat-icon *ngIf=\"searchTerm.length > 0\"\n matSuffix (click)=\"clear()\"\n class=\"adf-content-node-selector-content-input-icon\"\n data-automation-id=\"content-node-selector-search-clear\">clear\n </mat-icon>\n\n <mat-icon *ngIf=\"searchTerm.length === 0\"\n matSuffix\n class=\"adf-content-node-selector-content-input-icon\"\n data-automation-id=\"content-node-selector-search-icon\">search\n </mat-icon>\n\n </mat-form-field>\n <adf-sites-dropdown\n *ngIf=\"showDropdownSiteList\"\n class=\"full-width\"\n (change)=\"siteChanged($event)\"\n [placeholder]=\"'NODE_SELECTOR.SELECT_LIBRARY'\"\n [hideMyFiles]=\"dropdownHideMyFiles\"\n [siteList]=\"dropdownSiteList\"\n [value]=\"startSiteGuid\"\n data-automation-id=\"content-node-selector-sites-combo\" />\n <button *ngIf=\"hasCustomModels()\"\n data-automation-id=\"adf-toggle-search-panel-button\"\n mat-icon-button\n (click)=\"toggleSearchPanel()\">\n <mat-icon>filter_list</mat-icon>\n {{ 'SEARCH.SEARCH_HEADER.TITLE' | translate }}\n </button>\n <div class=\"adf-content-node-selector-search-panel-container\">\n <adf-search-panel *ngIf=\"searchPanelExpanded\" />\n <div class=\"adf-content-node-selector-document-list-container\">\n <adf-toolbar>\n <adf-toolbar-title>\n <ng-container *ngIf=\"!showBreadcrumbs()\">\n <h2 class=\"adf-search-results-label\">{{ 'NODE_SELECTOR.SEARCH_RESULTS' | translate }}</h2>\n </ng-container>\n <adf-dropdown-breadcrumb *ngIf=\"showBreadcrumbs()\"\n class=\"adf-content-node-selector-content-breadcrumb\"\n (navigate)=\"clearSearch()\"\n [target]=\"documentList\"\n [rootId]=\"breadcrumbRootId\"\n [transform]=\"breadcrumbTransform\"\n [folderNode]=\"breadcrumbFolderNode\"\n [root]=\"breadcrumbFolderTitle\"\n data-automation-id=\"content-node-selector-content-breadcrumb\" />\n <ng-container *ngIf=\"showNodeCounter\" [adf-node-counter]=\"getSelectedCount()\" />\n </adf-toolbar-title>\n </adf-toolbar>\n\n <div\n class=\"adf-content-node-selector-content-list\"\n [class.adf-content-node-selector-content-list-searchLayout]=\"showingSearchResults\"\n data-automation-id=\"content-node-selector-content-list\">\n <adf-document-list\n #documentList\n [adf-highlight]=\"searchTerm\"\n adf-highlight-selector=\".adf-name-location-cell-name\"\n [showHeader]=\"showHeader\"\n [node]=\"nodePaging\"\n [preselectNodes]=\"preselectedNodes\"\n [maxItems]=\"pageSize\"\n [rowFilter]=\"_rowFilter\"\n [imageResolver]=\"imageResolver\"\n [currentFolderId]=\"folderIdToShow\"\n [selectionMode]=\"selectionMode\"\n [contextMenuActions]=\"false\"\n [contentActions]=\"false\"\n [allowDropFiles]=\"false\"\n [sorting]=\"sorting\"\n sortingMode=\"server\"\n [where]=\"where\"\n (folderChange)=\"onFolderChange($event)\"\n (ready)=\"onFolderLoaded($event)\"\n (nodeSelected)=\"onCurrentSelection($event)\"\n [class.adf-content-node-selector-content-list-empty]=\"emptyList\"\n data-automation-id=\"content-node-selector-document-list\">\n\n <adf-custom-empty-content-template>\n <div aria-live=\"polite\">{{ 'NODE_SELECTOR.NO_RESULTS' | translate }}</div>\n </adf-custom-empty-content-template>\n\n <data-columns>\n <data-column key=\"$thumbnail\" type=\"image\" />\n <data-column key=\"name\" type=\"text\" title=\"ADF-DOCUMENT-LIST.LAYOUT.NAME\" class=\"adf-full-width adf-ellipsis-cell\">\n <ng-template let-context>\n <adf-name-location-cell [row]=\"context.row\" />\n </ng-template>\n </data-column>\n <data-column key=\"modifiedAt\" type=\"date\" title=\"ADF-DOCUMENT-LIST.LAYOUT.MODIFIED_ON\" format=\"timeAgo\" class=\"adf-content-selector-modified-cell\" />\n <data-column key=\"createdByUser.displayName\" type=\"text\" title=\"ADF-DOCUMENT-LIST.LAYOUT.CREATED_BY\" class=\"adf-content-selector-modifier-cell\" />\n <data-column key=\"visibility\" type=\"text\" title=\"ADF-DOCUMENT-LIST.LAYOUT.STATUS\" class=\"adf-content-selector-visibility-cell\" />\n </data-columns>\n\n </adf-document-list>\n\n <adf-infinite-pagination\n [target]=\"target\"\n [loading]=\"loadingSearchResults\"\n (loadMore)=\"getNextPageOfSearch($event)\"\n data-automation-id=\"content-node-selector-search-pagination\">\n {{ 'ADF-DOCUMENT-LIST.LAYOUT.LOAD_MORE' | translate }}\n </adf-infinite-pagination>\n </div>\n </div>\n </div>\n</div>\n", styles: ["h2.adf-search-results-label{flex:1;font-weight:600;font-size:var(--theme-body-1-font-size);font-style:normal;font-stretch:normal;line-height:1.43;letter-spacing:-.2px;color:var(--adf-theme-foreground-text-color-087)}.mdc-dialog .mat-mdc-dialog-surface:is(div){padding-bottom:0}.adf-content-node-selector-panel .adf-toolbar .adf-toolbar-container.adf-toolbar-container-row{max-height:48px;border-bottom-width:0;font-size:var(--theme-body-1-font-size);height:auto}.adf-content-node-selector-search-panel-container{display:flex}.adf-content-node-selector-document-list-container{margin-top:16px;width:100%}.adf-content-node-selector-content{padding-top:0}.adf-content-node-selector-content .mat-mdc-input-element:focus::placeholder{color:var(--theme-primary-color)}.adf-content-node-selector-content .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex{align-items:center}.adf-content-node-selector-content .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix{padding-bottom:0}.adf-content-node-selector-content .adf-sites-dropdown-form-field label.mat-mdc-floating-label{top:32px}.adf-content-node-selector-content .mat-mdc-form-field-subscript-wrapper{height:16px}.adf-content-node-selector-content-input{width:100%;margin-bottom:8px}.adf-content-node-selector-content-input .adf-content-node-selector-content-input-icon{color:var(--adf-theme-foreground-icon-color-054);cursor:pointer;padding:0 0 8px;width:1em;height:1em;font-size:20px}.adf-content-node-selector-content-input .adf-content-node-selector-content-input-icon:hover{color:var(--adf-theme-foreground-base-color)}.adf-content-node-selector-content-input .mat-mdc-form-field-subscript-wrapper{display:none}.adf-content-node-selector-content .adf-site-dropdown-container{display:block}.adf-content-node-selector-content .adf-site-dropdown-container .adf-sites-dropdown-form-field{width:100%}.adf-content-node-selector-breadcrumb .adf-dropdown-breadcrumb-trigger{outline:none}.adf-content-node-selector-breadcrumb .adf-dropdown-breadcrumb-trigger .adf-dropdown-breadcrumb-icon{color:var(--adf-theme-foreground-base-color-045)}.adf-content-node-selector-breadcrumb .adf-dropdown-breadcrumb-trigger .adf-dropdown-breadcrumb-icon:hover{color:var(--adf-theme-foreground-base-color-065)}.adf-content-node-selector-breadcrumb .adf-dropdown-breadcrumb-trigger:focus .adf-dropdown-breadcrumb-icon{color:var(--theme-primary-color)}.adf-content-node-selector-breadcrumb .adf-dropdown-breadcrumb-item-chevron{color:var(--adf-theme-foreground-base-color-045)}.adf-content-node-selector-content-list,.adf-content-node-selector-list{height:40vh;overflow:auto;border:1px solid var(--adf-theme-foreground-text-color-007);border-top:0;position:relative}.adf-content-node-selector-content-list-empty+adf-infinite-pagination,.adf-content-node-selector-list-empty+adf-infinite-pagination{position:absolute;bottom:0;width:100%}.adf-content-node-selector-content-list .adf-highlight,.adf-content-node-selector-list .adf-highlight{color:var(--theme-primary-color)}.adf-content-node-selector-content-list .adf-datatable-list,.adf-content-node-selector-list .adf-datatable-list{border:none}.adf-content-node-selector-content-list .adf-datatable-list .adf-name-location-cell-location,.adf-content-node-selector-list .adf-datatable-list .adf-name-location-cell-location{display:none}.adf-content-node-selector-content-list .adf-datatable-list .adf-datatable-selected,.adf-content-node-selector-list .adf-datatable-list .adf-datatable-selected{height:100%;width:100%}.adf-content-node-selector-content-list .adf-datatable-list .adf-datatable-selected>svg,.adf-content-node-selector-list .adf-datatable-list .adf-datatable-selected>svg{fill:var(--theme-primary-color)}.adf-content-node-selector-content-list .adf-datatable-list .adf-no-content-container.adf-datatable-cell,.adf-content-node-selector-list .adf-datatable-list .adf-no-content-container.adf-datatable-cell{text-align:center;border:none}.adf-content-node-selector-content-list .adf-datatable-list .adf-datatable-cell--image,.adf-content-node-selector-list .adf-datatable-list .adf-datatable-cell--image{min-width:35px;width:35px;max-width:40px}.adf-content-node-selector-content-list .adf-datatable-list .adf-datatable-cell:nth-child(2),.adf-content-node-selector-list .adf-datatable-list .adf-datatable-cell:nth-child(2){flex:1 0 95px}.adf-content-node-selector-content-list .adf-datatable-list .adf-datatable-cell .adf-no-content-container.adf-datatable-cell,.adf-content-node-selector-list .adf-datatable-list .adf-datatable-cell .adf-no-content-container.adf-datatable-cell{text-align:center;border:none}.adf-content-node-selector-content-list .adf-datatable-list .adf-datatable-cell.adf-content-selector-visibility-cell,.adf-content-node-selector-list .adf-datatable-list .adf-datatable-cell.adf-content-selector-visibility-cell{flex:0 1 auto;min-width:1px}.adf-content-node-selector-content-list .adf-datatable-list .adf-datatable-cell.adf-content-selector-visibility-cell .adf-datatable-cell-value,.adf-content-node-selector-list .adf-datatable-list .adf-datatable-cell.adf-content-selector-visibility-cell .adf-datatable-cell-value{padding:0}.adf-content-node-selector-content-list .adf-datatable-list .adf-datatable-body .adf-datatable-row,.adf-content-node-selector-list .adf-datatable-list .adf-datatable-body .adf-datatable-row{min-height:40px}@media screen and (-ms-high-contrast: active),screen and (-ms-high-contrast: none){.adf-content-node-selector-content-list .adf-datatable-list .adf-datatable-body .adf-datatable-row,.adf-content-node-selector-list .adf-datatable-list .adf-datatable-body .adf-datatable-row{padding-top:15px}}.adf-content-node-selector-content-list .adf-datatable-list .adf-datatable-body .adf-datatable-row:first-child .adf-datatable-cell,.adf-content-node-selector-list .adf-datatable-list .adf-datatable-body .adf-datatable-row:first-child .adf-datatable-cell{border-top:none}.adf-content-node-selector-content-list .adf-datatable-list .adf-datatable-body .adf-datatable-row:last-child .adf-datatable-cell,.adf-content-node-selector-list .adf-datatable-list .adf-datatable-body .adf-datatable-row:last-child .adf-datatable-cell{border-bottom:none}.adf-content-node-selector-content-list-searchLayout .adf-datatable-list .adf-datatable-body .adf-datatable-row,.adf-content-node-selector-list-searchLayout .adf-datatable-list .adf-datatable-body .adf-datatable-row{min-height:65px}@media screen and (-ms-high-contrast: active),screen and (-ms-high-contrast: none){.adf-content-node-selector-content-list-searchLayout .adf-datatable-list .adf-datatable-body .adf-datatable-row,.adf-content-node-selector-list-searchLayout .adf-datatable-list .adf-datatable-body .adf-datatable-row{padding-top:15px}}.adf-content-node-selector-content-list-searchLayout .adf-datatable-list .adf-datatable-body .adf-datatable-row .adf-name-location-cell-name,.adf-content-node-selector-list-searchLayout .adf-datatable-list .adf-datatable-body .adf-datatable-row .adf-name-location-cell-name{padding:5px 10px 2px}.adf-content-node-selector-content-list-searchLayout .adf-datatable-list .adf-datatable-body .adf-datatable-row.adf-content-selector-modified-cell,.adf-content-node-selector-list-searchLayout .adf-datatable-list .adf-datatable-body .adf-datatable-row.adf-content-selector-modified-cell,.adf-content-node-selector-content-list-searchLayout .adf-datatable-list .adf-datatable-body .adf-datatable-row.adf-content-selector-modifier-cell,.adf-content-node-selector-list-searchLayout .adf-datatable-list .adf-datatable-body .adf-datatable-row.adf-content-selector-modifier-cell,.adf-content-node-selector-content-list-searchLayout .adf-datatable-list .adf-datatable-body .adf-datatable-row.adf-content-selector-visibility-cell,.adf-content-node-selector-list-searchLayout .adf-datatable-list .adf-datatable-body .adf-datatable-row.adf-content-selector-visibility-cell{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7.MatLabel, selector: "mat-label" }, { kind: "directive", type: i7.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i8.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i9.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i10.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i10.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i10.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: AutoFocusDirective, selector: "[adf-auto-focus]" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i11.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: DropdownSitesComponent, selector: "adf-sites-dropdown", inputs: ["hideMyFiles", "siteList", "value", "placeholder", "relations"], outputs: ["change", "error"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i12.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: ToolbarTitleComponent, selector: "adf-toolbar-title" }, { kind: "component", type: ToolbarComponent, selector: "adf-toolbar", inputs: ["title", "color"] }, { kind: "component", type: DropdownBreadcrumbComponent, selector: "adf-dropdown-breadcrumb" }, { kind: "directive", type: NodeCounterDirective, selector: "[adf-node-counter]", inputs: ["adf-node-counter"] }, { kind: "component", type: DocumentListComponent, selector: "adf-document-list", inputs: ["includeFields", "where", "permissionsStyle", "locationFormat", "navigate", "showHeader", "navigationMode", "thumbnails", "selectionMode", "multiselect", "contentActions", "contentActionsPosition", "contextMenuActions", "emptyFolderImageUrl", "allowDropFiles", "sorting", "additionalSorting", "sortingMode", "rowStyle", "rowStyleClass", "loading", "_rowFilter", "rowFilter", "imageResolver", "stickyHeader", "headerFilters", "filterValue", "currentFolderId", "preselectNodes", "node", "maxItems", "columnsPresetKey", "setColumnsVisibility", "setColumnsWidths", "setColumnsOrder", "maxColumnsVisible", "isResizingEnabled", "blurOnResize", "displayCheckboxesOnHover", "displayDragAndDropHint"], outputs: ["nodeClick", "nodeDblClick", "folderChange", "preview", "ready", "error", "nodeSelected", "filterSelection", "columnsWidthChanged", "columnsVisibilityChanged", "columnsOrderChanged", "selectedItemsCountChanged"] }, { kind: "directive", type: HighlightDirective, selector: "[adf-highlight]", inputs: ["adf-highlight-selector", "adf-highlight", "adf-highlight-class"] }, { kind: "component", type: DataColumnListComponent, selector: "data-columns" }, { kind: "component", type: DataColumnComponent, selector: "data-column", inputs: ["id", "key", "customData", "type", "format", "sortable", "draggable", "resizable", "isHidden", "title", "subtitle", "formatTooltip", "sr-title", "class", "copyContent", "editable", "focus", "sortingKey", "order", "currencyConfig", "decimalConfig", "dateConfig"] }, { kind: "component", type: NameLocationCellComponent, selector: "adf-name-location-cell", inputs: ["row"] }, { kind: "component", type: InfinitePaginationComponent, selector: "adf-infinite-pagination", inputs: ["target", "pageSize", "loading"], outputs: ["loadMore"] }, { kind: "directive", type: CustomEmptyContentTemplateDirective, selector: "adf-custom-empty-content-template, empty-folder-content" }, { kind: "component", type: SearchPanelComponent, selector: "adf-search-panel" }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: ContentNodeSelectorPanelComponent, decorators: [{
type: Component,
args: [{ selector: 'adf-content-node-selector-panel', standalone: true, imports: [
CommonModule,
MatFormFieldModule,
TranslateModule,
MatInputModule,
ReactiveFormsModule,
AutoFocusDirective,
MatIconModule,
DropdownSitesComponent,
MatButtonModule,
ToolbarTitleComponent,
ToolbarComponent,
DropdownBreadcrumbComponent,
NodeCounterDirective,
DocumentListComponent,
HighlightDirective,
DataColumnListComponent,
DataColumnComponent,
NameLocationCellComponent,
InfinitePaginationComponent,
CustomEmptyContentTemplateDirective,
SearchPanelComponent
], encapsulation: ViewEncapsulation.None, host: { class: 'adf-content-node-selector-panel' }, providers: [SearchQueryBuilderService], template: "<div class=\"adf-content-node-selector-content\">\n <mat-form-field floatPlaceholder=\"never\"\n appearance=\"fill\"\n class=\"adf-content-node-selector-content-input\"\n subscriptSizing=\"dynamic\"\n *ngIf=\"showSearch\">\n <mat-label>{{ 'NODE_SELECTOR.SEARCH' | translate }}</mat-label>\n <input matInput\n id=\"searchInput\"\n [formControl]=\"searchInput\"\n type=\"text\"\n [value]=\"searchTerm\"\n adf-auto-focus\n data-automation-id=\"content-node-selector-search-input\">\n\n <mat-icon *ngIf=\"searchTerm.length > 0\"\n matSuffix (click)=\"clear()\"\n class=\"adf-content-node-selector-content-input-icon\"\n data-automation-id=\"content-node-selector-search-clear\">clear\n </mat-icon>\n\n <mat-icon *ngIf=\"searchTerm.length === 0\"\n matSuffix\n class=\"adf-content-node-selector-content-input-icon\"\n data-automation-id=\"content-node-selector-search-icon\">search\n </mat-icon>\n\n </mat-form-field>\n <adf-sites-dropdown\n *ngIf=\"showDropdownSiteList\"\n class=\"full-width\"\n (change)=\"siteChanged($event)\"\n [placeholder]=\"'NODE_SELECTOR.SELECT_LIBRARY'\"\n [hideMyFiles]=\"dropdownHideMyFiles\"\n [siteList]=\"dropdownSiteList\"\n [value]=\"startSiteGuid\"\n data-automation-id=\"content-node-selector-sites-combo\" />\n <button *ngIf=\"hasCustomModels()\"\n data-automation-id=\"adf-toggle-search-panel-button\"\n mat-icon-button\n (click)=\"toggleSearchPanel()\">\n <mat-icon>filter_list</mat-icon>\n {{ 'SEARCH.SEARCH_HEADER.TITLE' | translate }}\n </button>\n <div class=\"adf-content-node-selector-search-panel-container\">\n <adf-search-panel *ngIf=\"searchPanelExpanded\" />\n <div class=\"adf-content-node-selector-document-list-container\">\n <adf-toolbar>\n <adf-toolbar-title>\n <ng-container *ngIf=\"!showBreadcrumbs()\">\n <h2 class=\"adf-search-results-label\">{{ 'NODE_SELECTOR.SEARCH_RESULTS' | translate }}</h2>\n </ng-container>\n <adf-dropdown-breadcrumb *ngIf=\"showBreadcrumbs()\"\n class=\"adf-content-node-selector-content-breadcrumb\"\n (navigate)=\"clearSearch()\"\n [target]=\"documentList\"\n [rootId]=\"breadcrumbRootId\"\n [transform]=\"breadcrumbTransform\"\n [folderNode]=\"breadcrumbFolderNode\"\n [root]=\"breadcrumbFolderTitle\"\n data-automation-id=\"content-node-selector-content-breadcrumb\" />\n <ng-container *ngIf=\"showNodeCounter\" [adf-node-counter]=\"getSelectedCount()\" />\n </adf-toolbar-title>\n </adf-toolbar>\n\n <div\n class=\"adf-content-node-selector-content-list\"\n [class.adf-content-node-selector-content-list-searchLayout]=\"showingSearchResults\"\n data-automation-id=\"content-node-selector-content-list\">\n <adf-document-list\n #documentList\n [adf-highlight]=\"searchTerm\"\n adf-highlight-selector=\".adf-name-location-cell-name\"\n [showHeader]=\"showHeader\"\n [node]=\"nodePaging\"\n [preselectNodes]=\"preselectedNodes\"\n [maxItems]=\"pageSize\"\n [rowFilter]=\"_rowFilter\"\n [imageResolver]=\"imageResolver\"\n [currentFolderId]=\"folderIdToShow\"\n [selectionMode]=\"selectionMode\"\n [contextMenuActions]=\"false\"\n [contentActions]=\"false\"\n [allowDropFiles]=\"false\"\n [sorting]=\"sorting\"\n sortingMode=\"server\"\n [where]=\"where\"\n (folderChange)=\"onFolderChange($event)\"\n (ready)=\"onFolderLoaded($event)\"\n (nodeSelected)=\"onCurrentSelection($event)\"\n [class.adf-content-node-selector-content-list-empty]=\"emptyList\"\n data-automation-id=\"content-node-selector-document-list\">\n\n <adf-custom-empty-content-template>\n <div aria-live=\"polite\">{{ 'NODE_SELECTOR.NO_RESULTS' | translate }}</div>\n </adf-custom-empty-content-template>\n\n <data-columns>\n <data-column key=\"$thumbnail\" type=\"image\" />\n <data-column key=\"name\" type=\"text\" title=\"ADF-DOCUMENT-LIST.LAYOUT.NAME\" class=\"adf-full-width adf-ellipsis-cell\">\n <ng-template let-context>\n <adf-name-location-cell [row]=\"context.row\" />\n </ng-template>\n </data-column>\n <data-column key=\"modifiedAt\" type=\"date\" title=\"ADF-DOCUMENT-LIST.LAYOUT.MODIFIED_ON\" format=\"timeAgo\" class=\"adf-content-selector-modified-cell\" />\n <data-column key=\"createdByUser.displayName\" type=\"text\" title=\"ADF-DOCUMENT-LIST.LAYOUT.CREATED_BY\" class=\"adf-content-selector-modifier-cell\" />\n <data-column key=\"visibility\" type=\"text\" title=\"ADF-DOCUMENT-LIST.LAYOUT.STATUS\" class=\"adf-content-selector-visibility-cell\" />\n </data-columns>\n\n </adf-document-list>\n\n <adf-infinite-pagination\n [target]=\"target\"\n [loading]=\"loadingSearchResults\"\n (loadMore)=\"getNextPageOfSearch($event)\"\n data-automation-id=\"content-node-selector-search-pagination\">\n {{ 'ADF-DOCUMENT-LIST.LAYOUT.LOAD_MORE' | translate }}\n </adf-infinite-pagination>\n </div>\n </div>\n </div>\n</div>\n", styles: ["h2.adf-search-results-label{flex:1;font-weight:600;font-size:var(--theme-body-1-font-size);font-style:normal;font-stretch:normal;line-height:1.43;letter-spacing:-.2px;color:var(--adf-theme-foreground-text-color-087)}.mdc-dialog .mat-mdc-dialog-surface:is(div){padding-bottom:0}.adf-content-node-selector-panel .adf-toolbar .adf-toolbar-container.adf-toolbar-container-row{max-height:48px;border-bottom-width:0;font-size:var(--theme-body-1-font-size);height:auto}.adf-content-node-selector-search-panel-container{display:flex}.adf-content-node-selector-document-list-container{margin-top:16px;width:100%}.adf-content-node-selector-content{padding-top:0}.adf-content-node-selector-content .mat-mdc-input-element:focus: