@umbraco-cms/backoffice 1.0.0-next.99fe12c7 → 1.0.0-next.9c008bb2

package/router.d.ts

@@ -0,0 +1,368 @@
+import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
+import { UmbControllerHostElement } from '@umbraco-cms/backoffice/controller';
+import { UmbModalRouteRegistration } from '@umbraco-cms/backoffice/modal';
+
+interface IRouterSlot<D = any, P = any> extends HTMLElement {
+    readonly route: IRoute<D> | null;
+    readonly isRoot: boolean;
+    readonly fragments: IPathFragments | null;
+    readonly params: Params | null;
+    readonly match: IRouteMatch<D> | null;
+    routes: IRoute<D>[];
+    add: ((routes: IRoute<D>[], navigate?: boolean) => void);
+    clear: (() => void);
+    render: (() => Promise<void>);
+    constructAbsolutePath: ((path: PathFragment) => string);
+    parent: IRouterSlot<P> | null | undefined;
+    queryParentRouterSlot: (() => IRouterSlot<P> | null);
+}
+type IRoutingInfo<D = any, P = any> = {
+    slot: IRouterSlot<D, P>;
+    match: IRouteMatch<D>;
+};
+type CustomResolver<D = any, P = any> = ((info: IRoutingInfo<D>) => boolean | void | Promise<boolean> | Promise<void>);
+type Guard<D = any, P = any> = ((info: IRoutingInfo<D, P>) => boolean | Promise<boolean>);
+type PageComponent = HTMLElement | undefined;
+type ModuleResolver = Promise<{
+    default: any;
+}>;
+type Class<T extends PageComponent = PageComponent> = {
+    new (...args: any[]): T;
+};
+type Component = Class | ModuleResolver | PageComponent | (() => Class) | (() => PromiseLike<Class>) | (() => PageComponent) | (() => PromiseLike<PageComponent>) | (() => ModuleResolver) | (() => PromiseLike<ModuleResolver>);
+type Setup<D = any> = ((component: PageComponent, info: IRoutingInfo<D>) => void);
+type RouterTree<D = any, P = any> = {
+    slot: IRouterSlot<D, P>;
+} & {
+    child?: RouterTree;
+} | null | undefined;
+type PathMatch = "prefix" | "suffix" | "full" | "fuzzy";
+/**
+ * The base route interface.
+ * D = the data type of the data
+ */
+interface IRouteBase<D = any> {
+    path: PathFragment;
+    data?: D;
+    guards?: Guard[];
+    pathMatch?: PathMatch;
+}
+/**
+ * Route type used for redirection.
+ */
+interface IRedirectRoute<D = any> extends IRouteBase<D> {
+    redirectTo: string;
+    preserveQuery?: boolean;
+}
+/**
+ * Route type used to resolve and stamp components.
+ */
+interface IComponentRoute<D = any> extends IRouteBase<D> {
+    component: Component | PromiseLike<Component>;
+    setup?: Setup;
+}
+/**
+ * Route type used to take control of how the route should resolve.
+ */
+interface IResolverRoute<D = any> extends IRouteBase<D> {
+    resolve: CustomResolver;
+}
+type IRoute<D = any> = IRedirectRoute<D> | IComponentRoute<D> | IResolverRoute<D>;
+type PathFragment = string;
+type IPathFragments = {
+    consumed: PathFragment;
+    rest: PathFragment;
+};
+interface IRouteMatch<D = any> {
+    route: IRoute<D>;
+    params: Params;
+    fragments: IPathFragments;
+    match: RegExpMatchArray;
+}
+type PushStateEvent = CustomEvent<null>;
+type ReplaceStateEvent = CustomEvent<null>;
+type ChangeStateEvent = CustomEvent<null>;
+type WillChangeStateEvent = CustomEvent<{
+    url?: string | null;
+    eventName: GlobalRouterEvent;
+}>;
+type NavigationStartEvent<D = any> = CustomEvent<IRoutingInfo<D>>;
+type NavigationSuccessEvent<D = any> = CustomEvent<IRoutingInfo<D>>;
+type NavigationCancelEvent<D = any> = CustomEvent<IRoutingInfo<D>>;
+type NavigationErrorEvent<D = any> = CustomEvent<IRoutingInfo<D>>;
+type NavigationEndEvent<D = any> = CustomEvent<IRoutingInfo<D>>;
+type Params = {
+    [key: string]: string;
+};
+type Query = {
+    [key: string]: string;
+};
+type EventListenerSubscription = (() => void);
+/**
+ * History related events.
+ */
+type GlobalRouterEvent = "pushstate" | "replacestate" | "popstate" | "changestate" | "willchangestate" | "navigationstart" | "navigationcancel" | "navigationerror" | "navigationsuccess" | "navigationend";
+interface ISlashOptions {
+    start: boolean;
+    end: boolean;
+}
+declare global {
+    interface GlobalEventHandlersEventMap {
+        "pushstate": PushStateEvent;
+        "replacestate": ReplaceStateEvent;
+        "popstate": PopStateEvent;
+        "changestate": ChangeStateEvent;
+        "navigationstart": NavigationStartEvent;
+        "navigationend": NavigationEndEvent;
+        "navigationsuccess": NavigationSuccessEvent;
+        "navigationcancel": NavigationCancelEvent;
+        "navigationerror": NavigationErrorEvent;
+        "willchangestate": WillChangeStateEvent;
+    }
+}
+
+/**
+ * Dispatches a did change route event.
+ * @param $elem
+ * @param {IRoute} detail
+ */
+declare function dispatchRouteChangeEvent<D = any>($elem: HTMLElement, detail: IRoutingInfo<D>): void;
+/**
+ * Dispatches an event on the window object.
+ * @param name
+ * @param detail
+ */
+declare function dispatchGlobalRouterEvent<D = any>(name: GlobalRouterEvent, detail?: IRoutingInfo<D>): void;
+/**
+ * Adds an event listener (or more) to an element and returns a function to unsubscribe.
+ * @param $elem
+ * @param type
+ * @param listener
+ * @param options
+ */
+declare function addListener<T extends Event, eventType extends string>($elem: EventTarget, type: eventType[] | eventType, listener: ((e: T) => void), options?: boolean | AddEventListenerOptions): EventListenerSubscription;
+/**
+ * Removes the event listeners in the array.
+ * @param listeners
+ */
+declare function removeListeners(listeners: EventListenerSubscription[]): void;
+
+declare const historyPatches: [string, GlobalRouterEvent[]][];
+/**
+ * Patches the history object by ensuring correct events are dispatches when the history changes.
+ */
+declare function ensureHistoryEvents(): void;
+/**
+ * Attaches a global router event after the native function on the object has been invoked.
+ * Stores the original function at the _name.
+ * @param obj
+ * @param functionName
+ * @param eventName
+ */
+declare function attachCallback(obj: any, functionName: string, eventName: GlobalRouterEvent): void;
+/**
+ * Saves the native function on the history object.
+ * @param obj
+ * @param name
+ * @param func
+ */
+declare function saveNativeFunction(obj: any, name: string, func: (() => void)): void;
+declare global {
+    interface History {
+        "native": {
+            "back": ((distance?: any) => void);
+            "forward": ((distance?: any) => void);
+            "go": ((delta?: any) => void);
+            "pushState": ((data: any, title?: string, url?: string | null) => void);
+            "replaceState": ((data: any, title?: string, url?: string | null) => void);
+        };
+    }
+}
+
+/**
+ * Determines whether the path is active.
+ * If the full path starts with the path and is followed by the end of the string or a "/" the path is considered active.
+ * @param path
+ * @param fullPath
+ */
+declare function isPathActive(path: string | PathFragment, fullPath?: string): boolean;
+/**
+ * Matches a route.
+ * @param route
+ * @param path
+ */
+declare function matchRoute<D = any>(route: IRoute<D>, path: string | PathFragment): IRouteMatch<D> | null;
+/**
+ * Matches the first route that matches the given path.
+ * @param routes
+ * @param path
+ */
+declare function matchRoutes<D = any>(routes: IRoute<D>[], path: string | PathFragment): IRouteMatch<D> | null;
+/**
+ * Returns the page from the route.
+ * If the component provided is a function (and not a class) call the function to get the promise.
+ * @param route
+ * @param info
+ */
+declare function resolvePageComponent(route: IComponentRoute, info: IRoutingInfo): Promise<PageComponent>;
+/**
+ * Determines if a route is a redirect route.
+ * @param route
+ */
+declare function isRedirectRoute(route: IRoute): route is IRedirectRoute;
+/**
+ * Determines if a route is a resolver route.
+ * @param route
+ */
+declare function isResolverRoute(route: IRoute): route is IResolverRoute;
+/**
+ * Traverses the router tree up to the root route.
+ * @param slot
+ */
+declare function traverseRouterTree(slot: IRouterSlot): {
+    tree: RouterTree;
+    depth: number;
+};
+/**
+ * Generates a path based on the router tree.
+ * @param tree
+ * @param depth
+ */
+declare function getFragments(tree: RouterTree, depth: number): PathFragment[];
+/**
+ * Constructs the correct absolute path based on a router.
+ * - Handles relative paths: "mypath"
+ * - Handles absolute paths: "/mypath"
+ * - Handles traversing paths: "../../mypath"
+ * @param slot
+ * @param path
+ */
+declare function constructAbsolutePath<D = any, P = any>(slot: IRouterSlot<D, P>, path?: string | PathFragment): string;
+/**
+ * Handles a redirect.
+ * @param slot
+ * @param route
+ */
+declare function handleRedirect(slot: IRouterSlot, route: IRedirectRoute): void;
+/**
+ * Determines whether the navigation should start based on the current match and the new match.
+ * @param currentMatch
+ * @param newMatch
+ */
+declare function shouldNavigate<D>(currentMatch: IRouteMatch<D> | null, newMatch: IRouteMatch<D>): boolean;
+
+/**
+ * Queries the parent router.
+ * @param $elem
+ */
+declare function queryParentRouterSlot<D = any>($elem: Element): IRouterSlot<D> | null;
+/**
+ * Traverses the roots and returns the first match.
+ * The minRoots parameter indicates how many roots should be traversed before we started matching with the query.
+ * @param $elem
+ * @param query
+ * @param minRoots
+ * @param roots
+ */
+declare function queryParentRoots<T>($elem: Element, query: string, minRoots?: number, roots?: number): T | null;
+
+/**
+ * The current path of the location.
+ * As default slashes are included at the start and end.
+ * @param options
+ */
+declare function path(options?: Partial<ISlashOptions>): string;
+/**
+ * Returns the path without the base path.
+ * @param options
+ */
+declare function pathWithoutBasePath(options?: Partial<ISlashOptions>): string;
+/**
+ * Returns the base path as defined in the <base> tag in the head in a reliable way.
+ * If eg. <base href="/router-slot/"> is defined this function will return "/router-slot/".
+ *
+ * An alternative would be to use regex on document.baseURI,
+ * but that will be unreliable in some cases because it
+ * doesn't use the built in HTMLHyperlinkElementUtils.
+ *
+ * To make this method more performant we could cache the anchor element.
+ * As default it will return the base path with slashes in front and at the end.
+ */
+declare function basePath(options?: Partial<ISlashOptions>): string;
+/**
+ * Creates an URL using the built in HTMLHyperlinkElementUtils.
+ * An alternative would be to use regex on document.baseURI,
+ * but that will be unreliable in some cases because it
+ * doesn't use the built in HTMLHyperlinkElementUtils.
+ *
+ * As default it will return the base path with slashes in front and at the end.
+ * @param path
+ * @param options
+ */
+declare function constructPathWithBasePath(path: string, options?: Partial<ISlashOptions>): string;
+/**
+ * Removes the start of the path that matches the part.
+ * @param path
+ * @param part
+ */
+declare function stripStart(path: string, part: string): string;
+/**
+ * Returns the query string.
+ */
+declare function queryString(): string;
+/**
+ * Returns the params for the current path.
+ * @returns Params
+ */
+declare function query(): Query;
+/**
+ * Strips the slash from the start and end of a path.
+ * @param path
+ */
+declare function stripSlash(path: string): string;
+/**
+ * Ensures the path starts and ends with a slash
+ * @param path
+ */
+declare function ensureSlash(path: string): string;
+/**
+ * Makes sure that the start and end slashes are present or not depending on the options.
+ * @param path
+ * @param start
+ * @param end
+ */
+declare function slashify(path: string, { start, end }?: Partial<ISlashOptions>): string;
+/**
+ * Turns a query string into an object.
+ * @param {string} queryString (example: ("test=123&hejsa=LOL&wuhuu"))
+ * @returns {Query}
+ */
+declare function toQuery(queryString: string): Query;
+/**
+ * Turns a query object into a string query.
+ * @param query
+ */
+declare function toQueryString(query: Query): string;
+
+/**
+ * Hook up a click listener to the window that, for all anchor tags
+ * that has a relative HREF, uses the history API instead.
+ */
+declare function ensureAnchorHistory(): void;
+
+declare class UmbRouteContext {
+    #private;
+    private _onGotModals;
+    constructor(host: UmbControllerHostElement, _onGotModals: (contextRoutes: any) => void);
+    registerModal(registration: UmbModalRouteRegistration): UmbModalRouteRegistration<object, any>;
+    unregisterModal(registrationToken: ReturnType<typeof this$1.registerModal>): void;
+    _internal_routerGotBasePath(routerBasePath: string): void;
+    _internal_modalRouterChanged(activeModalPath: string | undefined): void;
+}
+declare const UMB_ROUTE_CONTEXT_TOKEN: UmbContextToken<UmbRouteContext>;
+
+declare function generateRoutePathBuilder(path: string): (params: {
+    [key: string]: string | number;
+}) => string;
+
+export { Guard, IComponentRoute, IRedirectRoute, IResolverRoute, IRoutingInfo, PageComponent, Params, Query, UMB_ROUTE_CONTEXT_TOKEN, IRoute as UmbRoute, UmbRouteContext, addListener, attachCallback, basePath, constructAbsolutePath, constructPathWithBasePath, dispatchGlobalRouterEvent, dispatchRouteChangeEvent, ensureAnchorHistory, ensureHistoryEvents, ensureSlash, generateRoutePathBuilder, getFragments, handleRedirect, historyPatches, isPathActive, isRedirectRoute, isResolverRoute, matchRoute, matchRoutes, path, pathWithoutBasePath, query, queryParentRoots, queryParentRouterSlot, queryString, removeListeners, resolvePageComponent, saveNativeFunction, shouldNavigate, slashify, stripSlash, stripStart, toQuery, toQueryString, traverseRouterTree };

package/sorter.d.ts

@@ -0,0 +1,103 @@
+import { UmbControllerInterface, UmbControllerHostElement } from '@umbraco-cms/backoffice/controller';
+
+type INTERNAL_UmbSorterConfig<T> = {
+    compareElementToModel: (el: HTMLElement, modelEntry: T) => boolean;
+    querySelectModelToElement: (container: HTMLElement, modelEntry: T) => HTMLElement | null;
+    identifier: string;
+    itemSelector: string;
+    disabledItemSelector?: string;
+    containerSelector: string;
+    ignorerSelector: string;
+    placeholderClass: string;
+    draggableSelector?: string;
+    boundarySelector?: string;
+    dataTransferResolver?: (dataTransfer: DataTransfer | null, currentItem: T) => void;
+    onStart?: (argument: {
+        item: T;
+        element: HTMLElement;
+    }) => void;
+    onChange?: (argument: {
+        item: T;
+        element: HTMLElement;
+    }) => void;
+    onContainerChange?: (argument: {
+        item: T;
+        element: HTMLElement;
+    }) => void;
+    onEnd?: (argument: {
+        item: T;
+        element: HTMLElement;
+    }) => void;
+    onSync?: (argument: {
+        item: T;
+        fromController: UmbSorterController<T>;
+        toController: UmbSorterController<T>;
+    }) => void;
+    itemHasNestedContainersResolver?: (element: HTMLElement) => boolean;
+    onDisallowed?: () => void;
+    onAllowed?: () => void;
+    onRequestDrop?: (argument: {
+        item: T;
+    }) => boolean | void;
+    resolveVerticalDirection?: (argument: {
+        containerElement: Element;
+        containerRect: DOMRect;
+        item: T;
+        element: HTMLElement;
+        elementRect: DOMRect;
+        relatedElement: HTMLElement;
+        relatedRect: DOMRect;
+        placeholderIsInThisRow: boolean;
+        horizontalPlaceAfter: boolean;
+    }) => void;
+    performItemInsert?: (argument: {
+        item: T;
+        newIndex: number;
+    }) => Promise<boolean> | boolean;
+    performItemRemove?: (argument: {
+        item: T;
+    }) => Promise<boolean> | boolean;
+};
+type UmbSorterConfig<T> = Omit<INTERNAL_UmbSorterConfig<T>, 'placeholderClass' | 'ignorerSelector' | 'containerSelector'> & Partial<Pick<INTERNAL_UmbSorterConfig<T>, 'placeholderClass' | 'ignorerSelector' | 'containerSelector'>>;
+/**
+ * @export
+ * @class UmbSorterController
+ * @implements {UmbControllerInterface}
+ * @description This controller can make user able to sort items.
+ */
+declare class UmbSorterController<T> implements UmbControllerInterface {
+    #private;
+    private _lastIndicationContainerVM;
+    get unique(): string;
+    constructor(host: UmbControllerHostElement, config: UmbSorterConfig<T>);
+    setModel(model: Array<T>): void;
+    hostConnected(): void;
+    private _onFirstRender;
+    hostDisconnected(): void;
+    setupItem(element: HTMLElement): void;
+    destroyItem(element: HTMLElement): void;
+    handleDragStart: (event: DragEvent) => void;
+    handleDragEnd: () => Promise<void>;
+    handleDragMove: (event: DragEvent) => void;
+    moveCurrentElement: () => void;
+    move(orderedContainerElements: Array<Element>, newElIndex: number): void;
+    /** Management methods: */
+    getItemOfElement(element: HTMLElement): T | null | undefined;
+    removeItem(item: T): Promise<boolean | T | null>;
+    hasOtherItemsThan(item: T): boolean;
+    sync(element: HTMLElement, fromVm: UmbSorterController<T>): Promise<boolean>;
+    updateAllowIndication(contextVM: UmbSorterController<T>, item: T): boolean;
+    removeAllowIndication(): void;
+    private autoScrollX;
+    private autoScrollY;
+    private handleAutoScroll;
+    private _performAutoScroll;
+    private stopAutoScroll;
+    notifySync(data: any): void;
+    notifyDisallowed(): void;
+    notifyAllowed(): void;
+    notifyRequestDrop(data: any): boolean;
+    destroy(): void;
+}
+
+export { UmbSorterConfig, UmbSorterController };

package/store.d.ts

@@ -1,8 +1,9 @@
 import * as rxjs from 'rxjs';
 import { Observable } from 'rxjs';
-import { UmbControllerHostInterface } from './controller';
-import { EntityTreeItemResponseModel } from './backend-api';
-import { UmbStoreBase as UmbStoreBase$1 } from './store';
+import { UmbControllerHostElement } from '@umbraco-cms/backoffice/controller';
+import { UmbArrayState } from '@umbraco-cms/backoffice/observable-api';
+import { EntityTreeItemResponseModel, FileSystemTreeItemPresentationModel } from '@umbraco-cms/backoffice/backend-api';
+import { UmbStoreBase as UmbStoreBase$1, UmbTreeStore as UmbTreeStore$1 } from '@umbraco-cms/backoffice/store';
 
 interface UmbDataStoreIdentifiers {
     key?: string;
@@ -11,24 +12,6 @@ interface UmbDataStoreIdentifiers {
 interface UmbDataStore {
     readonly storeAlias: string;
 }
-interface UmbTreeStore<T> extends UmbDataStore {
-    getTreeRoot(): Observable<Array<T>>;
-    getTreeItemChildren(key: string): Observable<Array<T>>;
-    /**
-     * @description - Trash data.
-     * @param {string[]} keys
-     * @return {*}  {(Promise<void>)}
-     * @memberof UmbTreeStore
-     */
-    trash(keys: string[]): Promise<void>;
-    /**
-     * @description - Move data.
-     * @param {string[]} keys
-     * @return {*}  {(Promise<void>)}
-     * @memberof UmbTreeStore
-     */
-    move(keys: string[], destination: string): Promise<void>;
-}
 interface UmbEntityDetailStore<T> extends UmbDataStore {
     /**
      * @description - Request scaffold data by entityType and . The data is added to the store and is returned as an Observable.
@@ -36,7 +19,7 @@ interface UmbEntityDetailStore<T> extends UmbDataStore {
      * @return {*}  {T}
      * @memberof UmbEntityDetailStore
      */
-    getScaffold: (entityType: string, parentKey: string | null) => T;
+    getScaffold: (entityType: string, parentId: string | null) => T;
     /**
      * @description - Request data by key. The data is added to the store and is returned as an Observable.
      * @param {string} key
@@ -56,58 +39,116 @@ interface UmbContentStore<T> extends UmbEntityDetailStore<T> {
     save(data: T[]): Promise<void>;
 }
 
-declare class UmbStoreBase {
-    protected _host: UmbControllerHostInterface;
+interface UmbStore<T> {
+    appendItems: (items: Array<T>) => void;
+    updateItem: (unique: string, item: Partial<T>) => void;
+    removeItem: (unique: string) => void;
+}
+
+declare class UmbStoreBase<StoreItemType = any> implements UmbStore<StoreItemType> {
+    protected _host: UmbControllerHostElement;
+    protected _data: UmbArrayState<StoreItemType>;
     readonly storeAlias: string;
-    constructor(_host: UmbControllerHostInterface, storeAlias: string);
+    constructor(_host: UmbControllerHostElement, storeAlias: string, data: UmbArrayState<StoreItemType>);
+    /**
+     * Appends items to the store
+     * @param {Array<StoreItemType>} items
+     * @memberof UmbEntityTreeStore
+     */
+    appendItems(items: Array<StoreItemType>): void;
+    /**
+     * Updates an item in the store
+     * @param {string} id
+     * @param {Partial<StoreItemType>} data
+     * @memberof UmbEntityTreeStore
+     */
+    updateItem(unique: string, data: Partial<StoreItemType>): void;
+    /**
+     * Removes an item from the store
+     * @param {string} id
+     * @memberof UmbEntityTreeStore
+     */
+    removeItem(unique: string): void;
 }
 
 /**
  * @export
- * @class UmbTreeStoreBase
+ * @class UmbEntityTreeStore
  * @extends {UmbStoreBase}
- * @description - General Tree Data Store
+ * @description - Entity Tree Store
  */
-declare class UmbTreeStoreBase extends UmbStoreBase$1 {
-    #private;
+declare class UmbEntityTreeStore extends UmbStoreBase$1<EntityTreeItemResponseModel> implements UmbTreeStore$1<EntityTreeItemResponseModel> {
+    constructor(host: UmbControllerHostElement, storeAlias: string);
     /**
-     * Appends items to the store
-     * @param {Array<EntityTreeItemModel>} items
-     * @memberof UmbTreeStoreBase
+     * An observable to observe the root items
+     * @memberof UmbEntityTreeStore
      */
-    appendItems(items: Array<EntityTreeItemResponseModel>): void;
+    rootItems: rxjs.Observable<EntityTreeItemResponseModel[]>;
     /**
-     * Updates an item in the store
-     * @param {string} key
-     * @param {Partial<EntityTreeItemModel>} data
-     * @memberof UmbTreeStoreBase
+     * Returns an observable to observe the children of a given parent
+     * @param {(string | null)} parentId
+     * @return {*}
+     * @memberof UmbEntityTreeStore
      */
-    updateItem(key: string, data: Partial<EntityTreeItemResponseModel>): void;
+    childrenOf(parentId: string | null): rxjs.Observable<EntityTreeItemResponseModel[]>;
     /**
-     * Removes an item from the store
-     * @param {string} key
-     * @memberof UmbTreeStoreBase
+     * Returns an observable to observe the items with the given ids
+     * @param {Array<string>} ids
+     * @return {*}
+     * @memberof UmbEntityTreeStore
      */
-    removeItem(key: string): void;
+    items(ids: Array<string>): rxjs.Observable<EntityTreeItemResponseModel[]>;
+}
+
+/**
+ * @export
+ * @class UmbFileSystemTreeStore
+ * @extends {UmbStoreBase}
+ * @description - File System Tree Store
+ */
+declare class UmbFileSystemTreeStore extends UmbStoreBase$1<FileSystemTreeItemPresentationModel> implements UmbTreeStore$1<FileSystemTreeItemPresentationModel> {
+    constructor(host: UmbControllerHostElement, storeAlias: string);
     /**
      * An observable to observe the root items
-     * @memberof UmbTreeStoreBase
+     * @memberof UmbFileSystemTreeStore
      */
-    rootItems: rxjs.Observable<EntityTreeItemResponseModel[]>;
+    rootItems: rxjs.Observable<FileSystemTreeItemPresentationModel[]>;
     /**
      * Returns an observable to observe the children of a given parent
-     * @param {(string | null)} parentKey
+     * @param {(string | null)} parentPath
      * @return {*}
-     * @memberof UmbTreeStoreBase
+     * @memberof UmbFileSystemTreeStore
      */
-    childrenOf(parentKey: string | null): rxjs.Observable<EntityTreeItemResponseModel[]>;
+    childrenOf(parentPath: string | null): rxjs.Observable<FileSystemTreeItemPresentationModel[]>;
     /**
-     * Returns an observable to observe the items with the given keys
-     * @param {Array<string>} keys
+     * Returns an observable to observe the items with the given ids
+     * @param {Array<string>} paths
      * @return {*}
-     * @memberof UmbTreeStoreBase
+     * @memberof UmbFileSystemTreeStore
      */
-    items(keys: Array<string>): rxjs.Observable<EntityTreeItemResponseModel[]>;
+    items(paths: Array<string>): rxjs.Observable<FileSystemTreeItemPresentationModel[]>;
+}
+
+type TreeItemPresentationModel = {
+    name?: string;
+    type?: string;
+    icon?: string;
+    hasChildren?: boolean;
+};
+
+type ItemResponseModelBaseModel = {
+    name?: string;
+    id?: string;
+};
+
+interface UmbTreeStore<T extends TreeItemPresentationModel = any> extends UmbStore<T> {
+    rootItems: Observable<Array<T>>;
+    childrenOf: (parentUnique: string | null) => Observable<Array<T>>;
+    items: (uniques: Array<string>) => Observable<Array<T>>;
+}
+
+interface UmbItemStore<T extends ItemResponseModelBaseModel = any> extends UmbStore<T> {
+    items: (uniques: Array<string>) => Observable<Array<T>>;
 }
 
-export { UmbContentStore, UmbDataStore, UmbDataStoreIdentifiers, UmbEntityDetailStore, UmbStoreBase, UmbTreeStore, UmbTreeStoreBase };
+export { UmbContentStore, UmbDataStore, UmbDataStoreIdentifiers, UmbEntityDetailStore, UmbEntityTreeStore, UmbFileSystemTreeStore, UmbItemStore, UmbStoreBase, UmbTreeStore };