jb-grid 0.4.0 → 0.5.0

package/web-component/lib/utils.ts

@@ -0,0 +1,46 @@
+import type { GridTemplate } from "./types.js";
+
+type CreateTemplateStylesheetOptions = {
+  selector: string,
+  autoModeVariableName?: string
+}
+
+export function createTemplateStylesheet(sheet: CSSStyleSheet, template: GridTemplate | null, options: CreateTemplateStylesheetOptions) {
+  const autoModeVariable = options.autoModeVariableName ? `${options.autoModeVariableName}: auto;` : "";
+  if (template === null) {
+    const css = /* css */ `
+    ${options.selector}{
+      display:grid;
+      grid-auto-columns: 1fr;
+      grid-auto-flow: column;
+      grid-template-rows: 1fr;
+      ${autoModeVariable}
+    }
+  `;
+    sheet.replaceSync(css);
+    return sheet;
+  }
+  let gridTemplateColumns = "";
+  const gridTemplateAreas = template.map(t => `${t.name}`).join(" ");
+  template.forEach((item) => {
+    if (item.size != null || item.size != undefined) {
+      if (typeof item.size == "number") {
+        gridTemplateColumns += ` ${item.size}px`;
+      } else {
+        gridTemplateColumns += ` ${item.size}`;
+      }
+
+    } else {
+      gridTemplateColumns += " 1fr";
+    }
+  });
+  const css = /* css */ `
+    ${options.selector}{
+      display:grid;
+      grid-template-columns: ${gridTemplateColumns};
+      grid-template-areas: "${gridTemplateAreas}"
+    }
+  `;
+  sheet.replaceSync(css);
+  return sheet;
+}

package/react/lib/JBGridBridgeExample.js

@@ -1,90 +0,0 @@
-import { fetchResponseHandler, fetchErrorHandler } from 'jb-modules/FetchHandler/dist/FetchHandler.cjs.min'
-import RequestData from 'jb-modules/RequestModule/dist/RequestData.cjs.min'
-class JBGridBridge {
-    //public
-    mapServerResponseDataToGridData(data) {
-        //convert server response data to grid standard data
-        if (!data.content.length > -1 || !data.size || !data.numberOfElements) {
-            console.error('we cant set meta data')
-        }
-        var bridgeData = {}
-        //the content array contain data we want to show
-        bridgeData.content = data.content;
-        //current list start index to show to user exp:20-35 its 20
-        bridgeData.startItemIndex = data.size * data.number + 1;
-        //last index of current loaded list
-        bridgeData.endItemIndex = data.size * data.number + data.numberOfElements;
-        //all item count for example if we had 500  user its 500
-        bridgeData.totalItemsCount = data.totalElements;
-        //how many page we have
-        bridgeData.totalPages = data.totalPages;
-        //current loaded page index
-        bridgeData.pageIndex = data.number + 1;//our server page start index from 0
-        return bridgeData;
-    }
-    //public
-    createRequestBody(pageObj, filterObj, sortColumn, dataConfig) {
-        //create body of request to send to the server
-
-        var requestBody = {}
-        //به خاطر اینکه صفحه بندی سرور از صفر شروع میشده
-        requestBody.page = pageObj.index - 1;
-        requestBody.size = pageObj.size;
-        /* implement grid filter */
-        if (filterObj) {
-            var bodyFilterObject = this._mapJBSearchBarFilterObjectToServerFilterObject(filterObj);
-            if (bodyFilterObject.length > 0) {
-                requestBody.criteria = bodyFilterObject
-            }
-        }
-        //implement user sort config to request body
-        this._implementSortToRequestBody(sortColumn, requestBody);
-        return requestBody;
-    }
-    getData(configData, requestBody) {
-        return new Promise((resolve, reject) => {
-            var request = new RequestData({
-                url: configData.url,
-                method: configData.method,
-                body: requestBody
-            });
-            fetch(request.request).then(fetchResponseHandler(request)).then((data) => {
-                resolve(data);
-            }).catch((err) => {
-                fetchErrorHandler(err);
-                reject(err);
-            })
-        });
-    }
-    //private . not need for jb grid bridge
-    _mapJBSearchBarFilterObjectToServerFilterObject(JBSearchBarFilterObject) {
-        var filterList = [];
-        JBSearchBarFilterObject.forEach((filter, index) => {
-            var value = filter.value.value;
-            var key = filter.column.name;
-            if (!filter.column.operation) {
-                filter.column.operation = "EQUALITY"
-            }
-            filterList.push({
-                "key": key,
-                "operation": filter.column.operation,
-                "value": value
-            });
-        });
-        return filterList;
-    }
-    //private
-    _implementSortToRequestBody(sortColumn, requestBody) {
-        if (sortColumn) {
-            if (!requestBody.criteria) {
-                requestBody.criteria = []
-            }
-            requestBody.criteria.push({
-                "key": sortColumn.name,
-                "operation": 'SORT_BY',
-                "value": sortColumn.sort.toUpperCase()
-            });
-        }
-    }
-}
-export default JBGridBridge;

package/react/lib/JBGridData.ts

@@ -1,51 +0,0 @@
-import { makeObservable, observable } from 'mobx';
-import { JBGridConfigStates, JBGridDataPage, JBGridTableConfig,JBGridCallbackConfig, JBGridI18nConfig, JBGridDataConfig, JBGridConfigInterface, AnyObject } from './types.js';
-
-class JBGridData<T extends AnyObject> implements JBGridConfigInterface<T> {
-  constructor(){
-    makeObservable(this,{
-      table:observable,
-      data:observable,
-      page:observable,
-      states:observable
-    });
-  }
-    table:JBGridTableConfig = {
-      columns: []
-    }
-    data:JBGridDataConfig<T> = {
-      data: [],
-      requestParams:{
-        method:"GET",
-        url:""
-      },
-      //keep detail of which items we show in a grid and detail of what information do we have
-      metaData: {
-        startItemIndex: 0,
-        endItemIndex: 0,
-        totalItemsCount: 0
-      }
-    }
-    page:JBGridDataPage = {
-      index: 1,
-      size: 20,
-      totalPages: 1,
-    }
-    states:JBGridConfigStates = {
-      headerSection: "MAIN",
-      isFullScreen: false
-    }
-    callbacks:JBGridCallbackConfig<any> = {
-      //TODO: define standard callback for grid like onRefresh , onDataLoad ,onFullScreen , onFilter ,....
-      onPageIndexChange: null, //when grid pageIndex change
-      onDataStandardizing: null //when we retrive new data and let outside programmer change the data structure before it compile
-
-    }
-    /**
-     * @deprecated provide it as a prop
-     */
-    customComponents = {
-      headerEnd: []
-    }
-}
-export {JBGridData};

package/react/lib/global.d.ts

@@ -1,15 +0,0 @@
-type FileStringModules = {
-    readonly default: string;
-}
-declare module '*.css' {
-    const value: FileStringModules;
-    export default value;
-}
-declare module '*.html' {
-    const value: FileStringModules;
-    export default value.default;
-}
-declare module '*.svg' {
-    const value: string;
-    export default value;
-}

package/web-component/lib/global.d.ts

@@ -1,15 +0,0 @@
-type FileStringModules = {
-    readonly default: string;
-}
-declare module '*.css' {
-    const value: FileStringModules;
-    export default value;
-}
-declare module '*.html' {
-    const value: FileStringModules;
-    export default value.default;
-}
-declare module '*.svg' {
-    const value: string;
-    export default value;
-}

package/web-component/tsconfig.json

@@ -1,17 +0,0 @@
-{
-    "compilerOptions": {
-        
-        "rootDir": "./lib",
-        "declarationDir": "./dist",
-    },
-    "include": [
-        "lib/global.d.ts",
-        "lib/**/*.ts",
-    ],
-    "exclude": [
-        "node_modules",
-        "**/*.spec.ts",
-        "dist",
-    ],
-    "extends":"jb-core/configs/tsconfig-web-component.json"
-}