@dotglitch/ngx-common 3.0.0-beta.1 → 3.0.0-beta.2

package/filemanager/file-grid/file-grid.component.d.ts

@@ -0,0 +1,94 @@
+import { ChangeDetectorRef, ElementRef, EventEmitter, OnInit, TemplateRef } from '@angular/core';
+import { MatCheckboxChange } from '@angular/material/checkbox';
+import { MatDialog } from '@angular/material/dialog';
+import { DomSanitizer } from '@angular/platform-browser';
+import { DialogService, Fetch, KeyboardService, MenuItem } from '@dotglitch/ngx-common/core';
+import { TabulatorComponent } from 'ngx-tabulator-tables';
+import { DirectoryDescriptor, FileDescriptor, FilemanagerComponent, FileViewTab, FSDescriptor, NgxFileManagerConfiguration } from '../filemanager.component';
+import { IconResolver } from '../icon-resolver';
+import { FileSorting } from '../types';
+import * as i0 from "@angular/core";
+export declare class FileGridComponent implements OnInit {
+    private readonly fetch;
+    private readonly keyboard;
+    private readonly dialog;
+    private readonly matDialog;
+    private readonly fileManager;
+    private readonly changeDetector;
+    private readonly sanitizer;
+    filesRef: ElementRef;
+    tabulator: TabulatorComponent;
+    renameTemplate: TemplateRef<any>;
+    private _path;
+    set path(value: string);
+    get path(): string;
+    pathChange: EventEmitter<string>;
+    config: NgxFileManagerConfiguration;
+    showHiddenFiles: boolean;
+    viewMode: "list" | "grid";
+    gridSize: "small" | "normal" | "large";
+    tab: FileViewTab;
+    fileSelect: EventEmitter<FileDescriptor>;
+    fileDblClick: EventEmitter<FileDescriptor>;
+    folderSelect: EventEmitter<DirectoryDescriptor>;
+    folderDblClick: EventEmitter<DirectoryDescriptor>;
+    newTab: EventEmitter<{
+        path: string;
+    }>;
+    loadFiles: EventEmitter<FSDescriptor[]>;
+    directoryContents: FSDescriptor[];
+    selection: FSDescriptor[];
+    selectionChange: EventEmitter<FSDescriptor[]>;
+    value: FSDescriptor[];
+    valueChange: EventEmitter<FSDescriptor[]>;
+    selectionText: string;
+    sortedFolders: any[][];
+    private readonly sorters;
+    sortOrder: FileSorting;
+    itemsPerRow: number;
+    isArchive: boolean;
+    userIsDraggingFile: boolean;
+    draggingOver: boolean;
+    showLoader: boolean;
+    hideLoader: boolean;
+    failedLoad: boolean;
+    error: any;
+    readonly columns: {
+        id: string;
+        label: string;
+    }[];
+    cols: {
+        id: string;
+        label: string;
+    }[];
+    folderContextMenu: MenuItem<FSDescriptor>[];
+    fileContextMenu: MenuItem<FSDescriptor>[];
+    performChecksum(path: any, digest: any): void;
+    iconResolver: IconResolver;
+    get libConfig(): Partial<{
+        assetPath: string;
+    }>;
+    constructor(fetch: Fetch, keyboard: KeyboardService, dialog: DialogService, matDialog: MatDialog, fileManager: FilemanagerComponent, changeDetector: ChangeDetectorRef, sanitizer: DomSanitizer);
+    ngOnInit(): Promise<void>;
+    ngAfterViewInit(): void;
+    loadFolder(): Promise<void>;
+    flowRows(): void;
+    onSelect(item: FSDescriptor, evt: any): void;
+    onItemClick(file: FSDescriptor): void;
+    onToggle(item: any, state: MatCheckboxChange): void;
+    clearSelection(): Promise<void>;
+    private _sortFilter;
+    private getSelectionText;
+    bytesToString(bytes: number, decimals?: number): string;
+    resize(): void;
+    onDragStart(evt: DragEvent, item: FSDescriptor): void;
+    onDrop(ev: any): void;
+    nameCellFormatter: any;
+    onRowCtx([event, row]?: [any?, any?]): void;
+    onRowClick(row: any): void;
+    sort(): void;
+    onUploadFile(evt?: FSDescriptor): void;
+    onCreateFolder(data?: FSDescriptor): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FileGridComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FileGridComponent, "app-file-grid", never, { "path": { "alias": "path"; "required": false; }; "config": { "alias": "config"; "required": false; }; "showHiddenFiles": { "alias": "showHiddenFiles"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; "gridSize": { "alias": "gridSize"; "required": false; }; "tab": { "alias": "tab"; "required": false; }; "selection": { "alias": "selection"; "required": false; }; "value": { "alias": "value"; "required": false; }; "sortOrder": { "alias": "sortOrder"; "required": false; }; }, { "pathChange": "pathChange"; "fileSelect": "fileSelect"; "fileDblClick": "fileDblClick"; "folderSelect": "folderSelect"; "folderDblClick": "folderDblClick"; "newTab": "newTab"; "loadFiles": "loadFiles"; "selectionChange": "selectionChange"; "valueChange": "valueChange"; }, never, never, true, never>;
+}

package/filemanager/filemanager.component.d.ts

@@ -0,0 +1,206 @@
+import { EventEmitter, OnInit, QueryList, ViewContainerRef } from '@angular/core';
+import { MatDrawerContainer } from '@angular/material/sidenav';
+import { MatTabGroup } from '@angular/material/tabs';
+import { Fetch, LazyLoaderService, NgxWebComponentsConfig } from '@dotglitch/ngx-common/core';
+import { FileGridComponent } from './file-grid/file-grid.component';
+import { IconResolver } from './icon-resolver';
+import { ToolbarComponent } from './toolbar/toolbar.component';
+import { TreeViewComponent } from './tree-view/tree-view.component';
+import { FileSorting } from './types';
+import * as i0 from "@angular/core";
+/**
+ * Multiple music / video / image files selected turns into a playlist
+ * Dragging music / video / image queues the file(s)
+ * Can save and edit a list of files as playlist
+ * Can "loop" "randomize"
+ */
+export type DirectoryDescriptor = {
+    kind: "directory";
+    path: string;
+    name: string;
+    contents: {
+        dirs: DirectoryDescriptor[];
+        files: FileDescriptor[];
+    };
+};
+export type FileDescriptor = {
+    kind: "file";
+    stats: {
+        size: number;
+        compressedSize?: number;
+        atimeMs: number;
+        mtimeMs: number;
+        ctimeMs: number;
+        birthtimeMs: number;
+    };
+    path: string;
+    name: string;
+    ext: string;
+    comment?: string;
+};
+export type FSDescriptor = DirectoryDescriptor | FileDescriptor;
+export type FileViewTab = {
+    id: string;
+    label: string;
+    breadcrumb: {
+        id: string;
+        label: string;
+    }[];
+    path: string;
+    selection: FSDescriptor[];
+    viewMode: "grid" | "list";
+    historyIndex: number;
+    history: string[];
+    sidebarItems: FSDescriptor[];
+    sortOrder: FileSorting;
+};
+export type NgxFileManagerConfiguration = Partial<{
+    /**
+     * Initial path
+     */
+    path: string;
+    /**
+     * Custom root path (will appear as '/').
+     * Defaults to '/'.
+     *
+     * User cannot view outside of this path.
+     *   (Not to be used as a security measure!)
+     */
+    chrootPath: string;
+    /**
+     * Restrict users to only navigate around to subpaths of the specified `path`
+     */
+    navigateOnlyToDescendants: boolean;
+    showBreadcrumb: boolean;
+    showTreeview: boolean;
+    /**
+     * Name of the "root" path `/`
+     * Defaults to "Storage"
+     */
+    rootName: string;
+    /**
+     * Maximum number of items to be stored in history.
+     */
+    maxHistoryLength: number;
+    apiSettings: {
+        listEntriesUrl?: string;
+        listEntriesUrlTemplate?: (path: string) => string;
+        downloadEntryUrl?: string;
+        downloadEntryUrlTemplate?: (path: string) => string;
+        uploadEntryUrl?: string;
+        uploadEntryUrlTemplate?: (path: string) => string;
+        deleteEntryUrl?: string;
+        deleteEntryUrlTemplate?: (path: string) => string;
+        renameEntryUrl?: string;
+        renameEntryUrlTemplate?: (path: string) => string;
+        createDirectoryUrl?: string;
+        createDirectoryUrlTemplate?: (path: string) => string;
+    };
+    /**
+     * The path that images are loaded from.
+     * Default value `/assets/dotglitch/webcomponents/`
+     */
+    assetPath: string;
+    sidebarLocationStrategy: "known" | "currentDirectory";
+    iconResolver: (file: FSDescriptor) => string;
+    imageSize: "normal" | "small" | "huge";
+    /**
+     *
+     */
+    selectionMode: "single" | "multiple";
+    /**
+     * This determines if the filemanager shows selected entries
+     *
+     * If set to `focusFiles`, file paths that match from the provided `focusedFiles`
+     * will be highlighted, and can be selected / deselected.
+     */
+    mode: "focusFiles" | "normal";
+    focusedFiles: string[];
+}>;
+export declare class FilemanagerComponent implements OnInit {
+    readonly libConfig: NgxWebComponentsConfig;
+    private readonly lazyLoader;
+    private viewContainer;
+    private fetch;
+    tabGroup: MatTabGroup;
+    fileGrids: QueryList<FileGridComponent>;
+    treeView: TreeViewComponent;
+    toolbar: ToolbarComponent;
+    drawer: MatDrawerContainer;
+    config: NgxFileManagerConfiguration;
+    gridSize: "small" | "normal" | "large";
+    mode: "grid" | "list";
+    contextTags: {
+        [key: string]: string;
+    };
+    value: FSDescriptor[];
+    valueChange: EventEmitter<FSDescriptor[]>;
+    gridValues: FSDescriptor[][];
+    /**
+     * Emits when focused files change.
+     * Only available in `focusFiles` mode.
+     */
+    focusedFilesChange: EventEmitter<any>;
+    /**
+     * Emits when a file is uploaded.
+     */
+    fileUpload: EventEmitter<any>;
+    /**
+     * Emits when a file is downloaded.
+     */
+    fileDownload: EventEmitter<any>;
+    fileRename: EventEmitter<any>;
+    fileDelete: EventEmitter<any>;
+    fileCopy: EventEmitter<any>;
+    filePaste: EventEmitter<any>;
+    fileSelect: EventEmitter<FileDescriptor>;
+    fileDblClick: EventEmitter<FileDescriptor>;
+    folderSelect: EventEmitter<DirectoryDescriptor>;
+    folderDblClick: EventEmitter<DirectoryDescriptor>;
+    /**
+     * Emits when multiple file selections change.
+     */
+    filesSelect: EventEmitter<FSDescriptor[]>;
+    /**
+     * Emits when any selection changes, single or multiple files.
+     */
+    showHiddenFiles: boolean;
+    showSidebar: boolean;
+    sidebarOverlay: boolean;
+    width: number;
+    isHomeAncestor: boolean;
+    currentTab: FileViewTab;
+    get currentFileGrid(): FileGridComponent;
+    tabIndex: number;
+    tabs: FileViewTab[];
+    iconResolver: IconResolver;
+    constructor(libConfig: NgxWebComponentsConfig, lazyLoader: LazyLoaderService, viewContainer: ViewContainerRef, fetch: Fetch);
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    onTreeViewLoadChildren({ item, cb }: {
+        item: any;
+        cb: any;
+    }): void;
+    initTab(path: string): void;
+    closeTab(tab: FileViewTab): void;
+    calcBreadcrumb(path: string): {
+        id: string;
+        label: string;
+    }[];
+    onBreadcrumbClick(crumb: any): void;
+    onTabPathChange(tab: FileViewTab): void;
+    onTreeViewSelect(item: FSDescriptor): void;
+    onTabLoadFiles(tab: FileViewTab, files: FSDescriptor[]): void;
+    onGridValueChange(): void;
+    getTabLabel(path: string): string;
+    onResize(): Promise<void>;
+    onResizeEnd(): Promise<void>;
+    getSelection(): FSDescriptor[];
+    clearSelection(): void;
+    refreshSorting(): void;
+    refreshData(): void;
+    getFileData(file: FileDescriptor): string;
+    downloadFile(file: FSDescriptor): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FilemanagerComponent, [{ optional: true; }, null, null, null]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FilemanagerComponent, "app-filemanager", never, { "config": { "alias": "config"; "required": false; }; "gridSize": { "alias": "gridSize"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "contextTags": { "alias": "contextTags"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "focusedFilesChange": "focusedFilesChange"; "fileUpload": "fileUpload"; "fileDownload": "fileDownload"; "fileRename": "fileRename"; "fileDelete": "fileDelete"; "fileCopy": "fileCopy"; "filePaste": "filePaste"; "fileSelect": "fileSelect"; "fileDblClick": "fileDblClick"; "folderSelect": "folderSelect"; "folderDblClick": "folderDblClick"; "filesSelect": "filesSelect"; }, never, never, true, never>;
+}

package/filemanager/folder-rename/folder-rename.component.d.ts

@@ -0,0 +1,18 @@
+import { OnInit } from '@angular/core';
+import { MatDialogRef } from '@angular/material/dialog';
+import { Fetch } from '@dotglitch/ngx-common/core';
+import { NgxFileManagerConfiguration } from '../filemanager.component';
+import * as i0 from "@angular/core";
+export declare class FolderRenameComponent implements OnInit {
+    dialog: MatDialogRef<any>;
+    private fetch;
+    path: string;
+    name: string;
+    config: NgxFileManagerConfiguration;
+    isRename: boolean;
+    constructor(dialog: MatDialogRef<any>, fetch: Fetch);
+    ngOnInit(): void;
+    onSave(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FolderRenameComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FolderRenameComponent, "app-folder-rename", never, { "path": { "alias": "path"; "required": false; }; "name": { "alias": "name"; "required": false; }; "config": { "alias": "config"; "required": false; }; }, {}, never, never, true, never>;
+}

package/filemanager/helpers.d.ts

@@ -0,0 +1,5 @@
+import { Fetch } from '@dotglitch/ngx-common/core';
+import { NgxFileManagerConfiguration } from './filemanager.component';
+export declare const uploadFile: (fetch: Fetch, config: NgxFileManagerConfiguration, currentDirectory: string, targetPath?: string, contextTags?: {
+    [key: string]: string;
+}) => Promise<unknown>;

package/filemanager/icon-resolver.d.ts

@@ -0,0 +1,13 @@
+import { FSDescriptor } from './filemanager.component';
+export declare class IconResolver {
+    path: string;
+    constructor(assetPath?: string);
+    private isText;
+    private getBestMatch;
+    private resolveDirIcon;
+    private resolveFileIcon;
+    resolveIcon(file: FSDescriptor): {
+        path: string;
+        needsBackdrop: boolean;
+    };
+}

package/filemanager/index.d.ts

@@ -0,0 +1 @@
+export * from './filemanager.component';