interface IBase <T <T>extends object> {

    reportType: IReportType;

    readonly _defaultConfig: object; // default configurations as per the reportType

    height?: string; 
    
    width?: string;
    
    id: string;
    
    config: object; // input configuration for the dashlets component. It should be as per the report type. Refer to next sections for more details as per the report Type

    data: <T>obejct[] | IDataLocation; // input
data
either in JSON format, url or API configurationstate: EventEmitter<IReportState>;
     stateevents: EventEmitter<IReportState>EventEmitter<CustomEvent>;

    initialize(config: object, data: T[]InputParams); // Get the initialisation options used for rendering.

    reset(): void; // resets the component to initial view

    destroy(): void; // performs cleanup post the component is destroyed;

    update(config: UpdateInputParams); // updates and re renders the view

    fetchData<T>(config: IData): Promise<T[]> | Observable<T[]>;
}


  /*
genetic##########################################################################
methods*
for*. addition and removal of data;    depenedent interfaces    addData();
        removeData
    */
}


/*
##########################################################################
*
*.         depenedent interfaces are are as follows:-
*
##########################################################################
*/


type IReportType = "chart" | "table" | "etc"

type methodType = "GET" | "POST";

interface IApiConfig {
  body: object url:| stringnull;
 
  headers?: {
        [header: string]: string | string[];
    };
  params?: {
methodType: methodType;
    params: {
        [param: string]: string | string[];
 
  };
    responseresponseType?: {'arraybuffer' | 'blob' | 'json' | 'text';
  pathreportProgress?: stringboolean;
 //Gets the value at path of response object response: {
    path: string;
  };
  [key: string]: }any
}

interface IDataSchema {
    type: string,
    enum?: string[],
    default?: string,
    format?: string; //url, date etc
    items?: IDataSchema // if type is array
}

interface IDataLocationIData {
  values?: unknown[];
  location?: {
    options?: Partial<IApiConfig>;
  apiConfig  url?: IApiConfigstring;
        urlmethod?: string;
    },
    dataSchema?: {
        [key: string]: IDataSchema;
    }
}

type IReportState = "initialized" | "rendered" | "destroyed" | "etc";  // pending or done state;

interface EventEmitter<T>{
    emit(value? : T);
    subscribe(next?: (value: T) => void, error?: (error: any) => void, complete?: () => void): Subscription;
}

type InputParams = {
  type: string;
  config: object;
  data: IData
}

type UpdateInputParams = {
  type: string;
  config: object;
  data: object[]
}

interface ITable extends IBase {

    readonly reportType: IReportType = "table"

    readonly _defaultConfiguration: ITableConfig;

    config: ITableConfig[];

    getRowsCount(); // rows count
    getRowAtIndex(index: number);   //get row at index number
    rowSelector(selectors); //fetch first row matching the config
    rowSelectorAll(selectors); // fetch rows matching a config

    addRow(data: object); // add a new row to the table by passing row configuration
    removeRow(index?: string); //removes row from the end or  at specific index;
    addColumn(config: ITableConfiguration); // adds a new column at the end
    removeColumn(columnName: string); // removes a column

    rowClick: EventEmitter<any>; // row click  event emitter
    rowHover: EventEmitter<any>; // mouse over event emitter

    exportTable(exportType: string); // exports the table into a type
    sortTable(sortByColumnName: string, orderBy: "asc" | "desc");
}


/*
##########################################################################
*
*.         depenedent interfaces are as follows:-
*
##########################################################################
*/

interface ITableConfig {
    title?paging: stringboolean;    // headerto nameshow forpagination below the columntable
    searchable?info: boolean; // if the column is searchable or not - will be used by the search bar at the topto show count or other info below the table
  [otherTableLevelConfig: string]: any;
  columnConfig: {
      orderabletitle?: booleanstring;    // header name iffor the column
can be ordered or sorted in asecending or descending fashion
    data?: string;  // key in the input JSON to be used as columnsearchable?: boolean; // if the column is searchable or not - will be used by the search bar at the top
      visibleorderable?: boolean;  // hides if the column can be ordered or shows a column within a tablesorted in asecending or descending fashion
      renderdata?: () => anystring;  // key in the input JSON to be used as column
      visible?: boolean; // hides or shows a column within a table
      render?: () => any;  // method to override the view and customise it like showing a button or chip instead of normal text
      autoWidth?: boolean;
      widthSize?: string; // customised width either in percentage or fixed width
      [key: string]: any; //any other metadata
      }

at path of response object;
    }
}

abstract class Filter<T> {

    data: T[];

    config: IFilterConfig[];

    filteredDataEventEmitter: EventEmitter<T[width]="string" (...anyOtherEvent)="eventListener($event)">

</sb-dashlet>

]>

    abstract init(config: IFilterConfig); //Get the initialisation options to render the filters;

    abstract filterData(data: T, config): object[];
}


interface IFilterConfig {
    reference: string;
    label: string;
    placeholder: string;
    controlType: "single-select" | "multi-select" | "date";
    searchable?: boolean;
    filters: IFilterConfig[];
    default?: string;
}

/* Questions

    Nested Filter Capability..

*/

},
        {
 

    "District": "Dharmapuri",
     

      "Unique Devices on app": "7133.0",
  

         "Unique Devices on 

portal": 

"8236.0"
        }
    

]