@smallpearl/ngx-helper 0.29.23

package/mat-busy-wheel/src/busy-wheel-op.d.ts

@@ -0,0 +1,65 @@
+import { Observable } from 'rxjs';
+/**
+ * Returns an rxjs operator that would track an http request status
+ * and would use the request status to hide the global busy wheel. The wheel
+ * would be hidden when the request completes or errors.
+ *
+ * Use it like below:
+ *
+ *  this.http.get<User>('https://google.com/..').pipe(
+ *    trackBusyWheelStatus(),
+ *    tap(user => this.user = user)
+ *  ).subscribe();
+ *
+ * Note that the function internally uses a timer to delay showing the busy
+ * wheel. This helps avoid needless screen flicker that can occur when quickly
+ * showing & hiding the wheel when the network connection and server response
+ * are so good that it can exceed natural user reaction time. We set this
+ * delay to 150 milliseconds for now.
+ *
+ * @param id A string value that uniquely identities the the busy wheel host
+ * container within the page. This allows multiple busy wheels to be hosted
+ * within a page, each for a distinct network (or time-consuming) operation.
+ * This is optional and if not specified, will create a busy wheel that
+ * covers the entire app viewport.
+ * @param show A boolean value that says whether to show the wheel as
+ * part of the operator setup. If set to false, the caller is expected
+ * to have displayed the busy wheel explicitly.
+ * @param showImmediate A boolean value that decides whether to show the
+ * busy wheel immediately. If set to false (default), the busy wheel will
+ * only be shown when the HTTP request has not completed within 200ms.
+ * @param hideOnNthEmit Number of emits upon which the busy wheel is to
+ * be hidden. A value of 0 for this means the wheel is hidden only when
+ * the observable completes (errorneously or otherwise).
+ * @returns An rxjs op that can be added to the pipe() arg list.
+ */
+export declare function trackBusyWheelStatus(id?: string, show?: boolean, showImmediate?: boolean, hideOnNthEmit?: number): <T>(source: Observable<T>) => Observable<T>;
+/**
+ * Show a busy wheel until the observable is complete. Busy wheel is shown is either viewport global
+ * or localized to the element with the the given id.
+ *
+ * An example use case for this operator are HTTP requests which will complete no matter
+ * what. Either successfully or with an error. Either case will mark the observer as completed.
+ *
+ * See trackBusyWheelStatus() for explanations on arguments
+ *
+ * @param id
+ * @param showImmediate
+ * @returns
+ */
+export declare function showBusyWheelUntilComplete(id?: string, showImmediate?: boolean): <T>(source: Observable<T>) => Observable<T>;
+/**
+ * Show a busy wheel until the observable emits n number of values. Busy wheel is shown is
+ * either viewport global or localized to the element with the the given id.
+ *
+ * An example use case for this operator are observables that emit but which do not necessarily
+ * complete.
+ *
+ * See trackBusyWheelStatus() for explanations on arguments
+ *
+ * @param numEmits
+ * @param id
+ * @param showImmediate
+ * @returns
+ */
+export declare function showBusyWheelUntilEmits(numEmits: number, id?: string, showImmediate?: boolean): <T>(source: Observable<T>) => Observable<T>;

package/mat-busy-wheel/src/busy-wheel.component.d.ts

@@ -0,0 +1,12 @@
+import { ElementRef, OnDestroy, OnInit } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class SPMatBusyWheelComponent implements OnInit, OnDestroy {
+    elRef: ElementRef;
+    wheelId: import("@angular/core").InputSignal<string>;
+    viewport: import("@angular/core").InputSignal<boolean>;
+    constructor(elRef: ElementRef);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SPMatBusyWheelComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SPMatBusyWheelComponent, "sp-mat-busy-wheel", never, { "wheelId": { "alias": "wheelId"; "required": false; "isSignal": true; }; "viewport": { "alias": "viewport"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/mat-busy-wheel/src/busy-wheel.service.d.ts

@@ -0,0 +1,42 @@
+import { SPMatHostBusyWheelDirective } from './host-busy-wheel.directive';
+import * as i0 from "@angular/core";
+export declare class BusyWheelService {
+    private defaultBusyWheelDir;
+    private namedBusyWheelDirs;
+    private wheelComponents;
+    static s_instance: BusyWheelService;
+    constructor();
+    static getInstance(): BusyWheelService;
+    show(id?: string): void;
+    hide(id?: string): void;
+    registerBusyWheelHost(busyWheelDir: SPMatHostBusyWheelDirective): void;
+    deregisterBusyWheelHost(busyWheelDir: SPMatHostBusyWheelDirective): void;
+    /**
+     * Creates a div fragment that hosts the busy wheel. The fragment has the following
+     * structure:
+     *
+     *  <div id="id_busy-wheel_{id}">
+     *    <div class="{containerClass}">
+     *      <!-- <div class="busy-wheel"></div> -->
+     *      <mat-spinner></mat-spinner>
+     *    </div>
+     *  </div>
+     * @param containerClass
+     * @param id
+     * @returns
+     */
+    private createViewportBusyWheel;
+    /**
+     * Creates a backdrop overlay, of the same size as the container that it
+     * covers, on which the busy wheel will be positioned.
+     * @returns
+     */
+    private createBackdrop;
+    private removeViewportBusyWheel;
+    static ɵfac: i0.ɵɵFactoryDeclaration<BusyWheelService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<BusyWheelService>;
+}
+export declare function registerBusyWheelHost(busyWheelDir: SPMatHostBusyWheelDirective): void;
+export declare function deregisterBusyWheelHost(busyWheelDir: SPMatHostBusyWheelDirective): void;
+export declare function showBusyWheel(id?: string): void;
+export declare function hideBusyWheel(id?: string): void;

package/mat-busy-wheel/src/host-busy-wheel.directive.d.ts

@@ -0,0 +1,35 @@
+import { OnDestroy, OnInit, Renderer2, ViewContainerRef } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Use this directive with a unique value assigned to it to display a busy
+ * wheel over it. This can be used as:-
+ *
+ * import {showBusyWheelUntilComplete} from '@smallpearl/ngx-helper/mat-busy-wheel';
+ *
+ * <div spHostBusyWheel='myDivBusyWheel'>
+ *  ..content
+ * </div>
+ *
+ * Then in your code:
+ *
+ * obs.pipe(
+ *  showBusyWheelUntilComplete('myDivBusyWheel'),
+ *  tap((resp) => {
+ *    ...
+ *  })
+ * ).subscribe();
+ *
+ * This will cover the 'div' above when the obs is waiting to be completed.
+ * (or error). Note that you can also use the trackBusyWheelStatus() function
+ * if you want more control over the busy wheel.
+ */
+export declare class SPMatHostBusyWheelDirective implements OnInit, OnDestroy {
+    viewContainerRef: ViewContainerRef;
+    renderer2: Renderer2;
+    spHostBusyWheel: import("@angular/core").InputSignal<string | undefined>;
+    constructor(viewContainerRef: ViewContainerRef, renderer2: Renderer2);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SPMatHostBusyWheelDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SPMatHostBusyWheelDirective, "[spHostBusyWheel]", never, { "spHostBusyWheel": { "alias": "spHostBusyWheel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/mat-context-menu/index.d.ts

@@ -0,0 +1 @@
+export * from './src/mat-context-menu.component';

package/mat-context-menu/src/mat-context-menu.component.d.ts

@@ -0,0 +1,54 @@
+import { EventEmitter, OnInit } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Describes each item in the context menu.
+ */
+export interface SPContextMenuItem {
+    label: string;
+    icon?: string;
+    route?: string | string[];
+    role?: string;
+    disable?: (arg: any) => boolean;
+}
+export declare class SPMatContextMenuComponent implements OnInit {
+    /**
+     * The menu items to display. Refer to ContextMenuItem doc for details
+     * on the menu items.
+     */
+    menuItems: import("@angular/core").InputSignal<SPContextMenuItem[]>;
+    /**
+     * Label to display for the context menu. If omitted will just show the
+     * menuIcon.
+     */
+    label: import("@angular/core").InputSignal<string>;
+    /**
+     * Button icon. defaults to more_vert.
+     */
+    menuIconName: import("@angular/core").InputSignal<string>;
+    /**
+     * By default the context menu is activated whenever the mouse cursor hovers
+     * over the button. Set this to 'true' to disable this feature.
+     */
+    enableHover: import("@angular/core").InputSignal<boolean>;
+    /**
+     * Context data for menu item disabled callback
+     */
+    contextData: import("@angular/core").InputSignal<any>;
+    /**
+     * enable menu backdrop
+     */
+    hasBackdrop: import("@angular/core").InputSignal<boolean>;
+    /**
+     * Event generated when use selects an item in the context menu. This event
+     * is generated only if the context menu item does not specify a route to
+     * activate. The string event parameter is ContextMenuItem.role property
+     * value.
+     */
+    selected: EventEmitter<string>;
+    constructor();
+    ngOnInit(): void;
+    onSelectMenuItem(item: SPContextMenuItem): void;
+    itemDisabled(menuItem: SPContextMenuItem): boolean | undefined;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SPMatContextMenuComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SPMatContextMenuComponent, "sp-mat-context-menu", never, { "menuItems": { "alias": "menuItems"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "menuIconName": { "alias": "menuIconName"; "required": false; "isSignal": true; }; "enableHover": { "alias": "enableHover"; "required": false; "isSignal": true; }; "contextData": { "alias": "contextData"; "required": false; "isSignal": true; }; "hasBackdrop": { "alias": "hasBackdrop"; "required": false; "isSignal": true; }; }, { "selected": "selected"; }, never, never, true, never>;
+}

package/mat-entity-crud/index.d.ts

@@ -0,0 +1,5 @@
+export * from './src/mat-entity-crud-types';
+export * from './src/providers';
+export * from './src/mat-entity-crud.component';
+export * from './src/preview-pane.component';
+export * from './src/mat-entity-crud-form-base';

package/mat-entity-crud/src/default-config.d.ts

@@ -0,0 +1,9 @@
+import { SPMatEntityCrudConfig } from "./mat-entity-crud-types";
+export declare const DefaultSPMatEntityCrudConfig: SPMatEntityCrudConfig;
+/**
+ * To be called from an object constructor as it internally calls Angular's
+ * inject() API.
+ * @param userConfig
+ * @returns
+ */
+export declare function getEntityCrudConfig(): SPMatEntityCrudConfig;

package/mat-entity-crud/src/form-view-host.component.d.ts

@@ -0,0 +1,34 @@
+import { EmbeddedViewRef, OnDestroy, OnInit, TemplateRef, ViewContainerRef } from '@angular/core';
+import { Subscription } from 'rxjs';
+import { SPMatEntityCrudComponentBase } from './mat-entity-crud-internal-types';
+import { SPMatEntityCrudConfig, SPMatEntityCrudCreateEditBridge } from './mat-entity-crud-types';
+import * as i0 from "@angular/core";
+export declare class FormViewHostComponent<TEntity> implements SPMatEntityCrudCreateEditBridge, OnInit, OnDestroy {
+    entityCrudComponentBase: import("@angular/core").InputSignal<SPMatEntityCrudComponentBase<TEntity>>;
+    clientViewTemplate: import("@angular/core").InputSignal<TemplateRef<any> | null>;
+    itemLabel: import("@angular/core").InputSignal<string>;
+    itemLabelPlural: import("@angular/core").InputSignal<string>;
+    entity: import("@angular/core").WritableSignal<TEntity | undefined>;
+    title: import("@angular/core").WritableSignal<string>;
+    params: import("@angular/core").WritableSignal<any>;
+    clientFormView: EmbeddedViewRef<any> | null;
+    vc: import("@angular/core").Signal<ViewContainerRef | undefined>;
+    config: SPMatEntityCrudConfig;
+    sub$: Subscription;
+    constructor();
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    show(entity: TEntity | undefined, params?: any): void;
+    close(cancel: boolean): void;
+    registerCanCancelEditCallback(callback: () => boolean): void;
+    create(entityValue: any): import("rxjs").Observable<any>;
+    update(id: any, entityValue: any): import("rxjs").Observable<any>;
+    /**
+     * Creates the client view provided via template
+     */
+    createClientView(): void;
+    destroyClientView(): void;
+    onClose(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormViewHostComponent<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormViewHostComponent<any>, "sp-create-edit-entity-host", never, { "entityCrudComponentBase": { "alias": "entityCrudComponentBase"; "required": true; "isSignal": true; }; "clientViewTemplate": { "alias": "clientViewTemplate"; "required": false; "isSignal": true; }; "itemLabel": { "alias": "itemLabel"; "required": true; "isSignal": true; }; "itemLabelPlural": { "alias": "itemLabelPlural"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/mat-entity-crud/src/mat-entity-crud-form-base.d.ts

@@ -0,0 +1,95 @@
+import { ChangeDetectorRef, OnDestroy, OnInit } from '@angular/core';
+import { AbstractControl } from '@angular/forms';
+import { Subscription } from 'rxjs';
+import { SPMatEntityCrudCreateEditBridge } from './mat-entity-crud-types';
+import * as i0 from "@angular/core";
+/**
+ * This is a convenience base class that clients can derive from to implement
+ * their CRUD form component. Particularly this class registers the change
+ * detection hook which will be called when the user attempts to close the
+ * form's parent container pane via the Close button on the top right.
+ *
+ * This button behaves like a Cancel button in a desktop app and therefore if
+ * the user has entered any data in the form's controls, (determined by
+ * checking form.touched), then a 'Lose Changes' prompt is displayed allowing
+ * the user to cancel the closure.
+ *
+ * The @Component is fake just to keep the VSCode angular linter quiet.
+ *
+ * To use this class:-
+ *
+ * 1. Declare a FormGroup<> type as
+ *
+ *      ```
+ *      type MyForm = FormGroup<{
+ *        name: FormControl<string>;
+ *        type: FormControl<string>;
+ *        notes: FormControl<string>;
+ *      }>;
+ *      ```
+ *
+ * 2. Derive your form's component class from this and implement the
+ *    createForm() method returing the FormGroup<> instance that matches
+ *    the FormGroup concrete type above.
+ *
+ *    ```
+ *    class MyFormComponent extends SPMatEntityCrudFormBase<MyForm, MyEntity> {
+ *      constructor() {
+ *        super()
+ *      }
+ *
+ *      createForm() {
+ *        return new FormGroup([...])
+ *      }
+ *    }
+ *    ```
+ *
+ * 3. If you form's value requires manipulation before being sent to the
+ *    server, override getFormValue() method and do it there before returning
+ *    the modified values.
+ *
+ * 4. Wire up the form in the template as:
+ *
+ *    ```
+ *    <form [formGroup]='form'.. (ngSubmit)="onSubmit()">
+ *      <button type="submit">Submit</button>
+ *    </form>
+ *    ```
+ */
+export declare abstract class SPMatEntityCrudFormBase<TFormGroup extends AbstractControl, TEntity extends {
+    [P in IdKey]: PropertyKey;
+}, IdKey extends string = 'id'> implements OnInit, OnDestroy {
+    _form: import("@angular/core").WritableSignal<TFormGroup | undefined>;
+    entity: import("@angular/core").InputSignal<TEntity>;
+    bridge: import("@angular/core").InputSignal<SPMatEntityCrudCreateEditBridge>;
+    params: import("@angular/core").InputSignal<any>;
+    sub$: Subscription;
+    form: import("@angular/core").Signal<TFormGroup | undefined>;
+    crudConfig: import("./mat-entity-crud-types").SPMatEntityCrudConfig;
+    cdr: ChangeDetectorRef;
+    canCancelEdit: () => boolean;
+    _canCancelEdit(): boolean;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /**
+     * Create the TFormGroup FormGroup class that will be used for the reactive
+     * form.
+     * @param entity
+     */
+    abstract createForm(entity: TEntity | undefined): TFormGroup;
+    /**
+     * Override to customize the id key name if it's not 'id'
+     * @returns The name of the unique identifier key that will be used to
+     * extract the entity's id for UPDATE operation.
+     */
+    getIdKey(): string;
+    /**
+     * Return the form's value to be sent to server as Create/Update CRUD
+     * operation data.
+     * @returns
+     */
+    getFormValue(): any;
+    onSubmit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SPMatEntityCrudFormBase<any, any, any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SPMatEntityCrudFormBase<any, any, any>, "_#_sp-mat-entity-crud-form-base_#_", never, { "entity": { "alias": "entity"; "required": true; "isSignal": true; }; "bridge": { "alias": "bridge"; "required": true; "isSignal": true; }; "params": { "alias": "params"; "required": false; "isSignal": true; }; }, {}, never, never, false, never>;
+}

package/mat-entity-crud/src/mat-entity-crud-internal-types.d.ts

@@ -0,0 +1,66 @@
+import { Observable } from "rxjs";
+/**
+ * SPMatEntityCrudCreateEditBridge implementer uses this interface to
+ * communicate with the parent SPMatEntityCreateComponent. The bridge
+ * component would use the hideCreateEdit() to close itself, when user cancels
+ * the create/edit operation.
+ */
+export interface SPMatEntityCrudComponentBase<TEntity> {
+    /**
+     * FormViewHostComponent will call this to close the Create/Edit pane.
+     * SPMatEntityCrudComponentBase implementor will destroy the client form
+     * view and hide the Create/Edit form view pane and show the hidden
+     * entity list view.
+     * @returns
+     */
+    closeCreateEdit: (cancelled: boolean) => void;
+    /**
+     * Used internally by FormViewHostComponent to determine if the client form
+     * view wants to intercept user's cancel the create/edit operation. Perhaps
+     * with the Yes/No prompt 'Lose changes?'
+     * @returns boolean indicating it's okay to cancel the create/edit operation.
+     */
+    canCancelEdit: () => boolean;
+    /**
+     * Client form view can register a callback that will be invoked by the
+     * framework when user cancels the create/edit operation by clicking on the
+     * close button on the top right.
+     * @param callback
+     * @returns
+     */
+    registerCanCancelEditCallback: (callback: () => boolean) => void;
+    /**
+     * Initiates update on the given entity.
+     * @returns
+     */
+    triggerEntityUpdate: (entity: TEntity) => void;
+    /**
+     * Initiates entity delete.
+     * @returns
+     */
+    triggerEntityDelete: (entity: TEntity) => void;
+    /**
+     * Called by client form-view host component to close a new entity.
+     * @param entityValue The ReactiveForm.value object that the server expects
+     * to create a new object.
+     * @returns The new Entity object returned by the server. For typical REST
+     * API, this would be of the same shape as the objects returned by the
+     * REST's GET request.
+     */
+    create: (entityValue: any) => Observable<any>;
+    /**
+     * Called by client form-view host component to close a new entity.
+     * @param id The id of the entity being edited.
+     * @param entityValue The ReactiveForm.value object that the server expects
+     * to update the new object.
+     * @returns The new Entity object returned by the server. For typical REST
+     * API, this would be of the same shape as the objects returned by the
+     * REST's GET request.
+     */
+    update: (id: any, entityValue: any) => Observable<any>;
+    /**
+     * Close the preview pane.
+     * @returns
+     */
+    closePreview: () => void;
+}

package/mat-entity-crud/src/mat-entity-crud-types.d.ts

@@ -0,0 +1,141 @@
+import { HttpContextToken } from "@angular/common/http";
+import { SPContextMenuItem } from "@smallpearl/ngx-helper/mat-context-menu";
+import { Observable } from "rxjs";
+/**
+ * Prototype of the function to parse the CRUD action response.
+ */
+export type SPMatEntityCrudResponseParser = (entityName: string, idKey: string, method: 'create' | 'retrieve' | 'update' | 'delete', resp: any) => any | undefined;
+/**
+ * Global config for SPMatEntityList component.
+ */
+export interface SPMatEntityCrudConfig {
+    i18n: {
+        newItemLabel: (itemLabel: string) => string;
+        editItemLabel: (itemLabel: string) => string;
+        edit: string;
+        delete: string;
+        deleteItemHeader: (itemLabel: string) => string;
+        deleteItemMessage: (itemLabel: string) => string;
+        itemDeletedNotification: (itemLabel: string) => string;
+        createdItemNotification: (itemLabel: string) => string;
+        updatedItemNotification: (itemLabel: string) => string;
+        loseChangesPrompt: string;
+    };
+    defaultItemActions?: SPContextMenuItem[];
+    listPaneWrapperClass?: string;
+    previewPaneWrapperClass?: string;
+    previewPaneContentClass?: string;
+    /**
+     * Global crud response parser.
+     */
+    crudOpResponseParser?: SPMatEntityCrudResponseParser;
+}
+/**
+ * This is the interface through which the client provided CRUD form component
+ * interacts with the 'host' SPMatEntityCrudComponent. When the form wants to
+ * submit an entity to the server (for create or update), it should call the
+ * one of the create or update methods. The interface also other methods for
+ * the form component to interact with SPMatEntityCrudComponent such as
+ * refresh its entities list, close the form pane, etc.
+ *
+ * The interface name has a 'Bridge' as the interface acts as a bridge between
+ * the client provided form handler component and the host
+ * SPMatEntityCrudComponent.
+ */
+export interface SPMatEntityCrudCreateEditBridge {
+    /**
+     * Close the edit/update form pane. This WON'T call the 'cancelEditCallback'
+     * even if one is registered.
+     */
+    close: (cancel: boolean) => void;
+    /**
+     * Client form view can register a callback that will be invoked by the
+     * framework when user cancels the create/edit operation by clicking on the
+     * close button on the top right.
+     * @param callback
+     * @returns None
+     */
+    registerCanCancelEditCallback: (callback: () => boolean) => void;
+    /**
+     * Create a new instance of TEntity, by sending a POST request to remote.
+     * @param entityValue This is the typically the output of Reactive form's
+     * form.value. Since this value's shape may be different from TEntity and is
+     * known only to client form, we use 'any'.
+     * @returns None
+     * @inner Implementation will show a busy wheel centered on the form
+     * view while the async function to update the object remains active.
+     */
+    create: (entityValue: any) => Observable<any>;
+    /**
+     * Update the entity with id `id` with new values in entityValue.
+     * @param id TEntity id
+     * @param entityValue Entity values to be updated.
+     * @returns None
+     * @inner Implementation will show a busy wheel centered on the form
+     * view while the async function to update the object remains active.
+     */
+    update: (id: any, entityValue: any) => Observable<any>;
+}
+/**
+ * Prototype of the function that will be used instead of HttpClient for
+ * CRUD operations.
+ * @param op - the CRUD operation being requested
+ * @param entityValue - The entity or entity value upon which the operation
+ * is being requested. for 'create' & 'update' this will be the value
+ * of the reactive form. This is typically form.value or the 2nd arg to create
+ * & update methods of SPMatEntityCrudCreateEditBridge.
+ */
+export type CRUD_OP_FN<TEntity extends {
+    [P in IdKey]: PropertyKey;
+}, IdKey extends string = 'id'> = (op: 'get' | 'create' | 'update' | 'delete', id: TEntity[IdKey] | undefined, // valid only for 'get', 'update' & 'delete'
+entityValue: any, // valid only for 'create' & 'update'
+entityCrudComponent: any) => Observable<TEntity | null>;
+export type ALLOW_ITEM_ACTION_FN<TEntity> = (entity: TEntity, action: string) => boolean;
+/**
+ * This interface is used to define sub types for the "New {{item}}" button on
+ * top of the CRUD UI. An array of these is provided as the value to the
+ * component property 'newItemSubTypes'.
+ */
+export interface NewItemSubType {
+    /**
+     * A role string that will be passed as argument to the (action) event
+     * handler. This string allows the event handler to distinguish the selected
+     * sub-type.
+     *
+     * The special keyword '_new_' can be used to activate the
+     * `createEditTemplate` template if one is provided. In this case the params
+     * element value (see below) can be used in the template to distinguish
+     * between different menu items.
+     */
+    role: string;
+    /**
+     * Label displayed in the menu representing this role.
+     */
+    label: string;
+    /**
+     * Arbitrary value that will be passed to the 'createEditTemplate' in the
+     * $implicit template context as 'params'. You can access this in the
+     * template like below (see `data.params`):-
+        ```
+        <ng-template #createEdit let-data>
+          <app-create-edit-entity-demo
+            [bridge]="data.bridge"
+            [entity]="data.entity"
+            [params]="data.params"
+          ></app-create-edit-entity-demo>
+        </ng-template>
+        ```
+  
+      If params is an object and it includes the key 'title', its value will be
+      used as the title for the edit form.
+     */
+    params?: any;
+}
+export type CrudOp = 'create' | 'retrieve' | 'update' | 'delete' | undefined;
+export interface SPMatEntityCrudHttpContext {
+    entityName: string;
+    entityNamePlural: string;
+    endpoint: string;
+    op: CrudOp;
+}
+export declare const SP_MAT_ENTITY_CRUD_HTTP_CONTEXT: HttpContextToken<SPMatEntityCrudHttpContext>;