@bit.rhplus/ui.grid 0.0.5 → 0.0.7

package/ColumnBuilder.jsx

@@ -1,4 +1,5 @@
 import {prepareColDef} from './utils';
+import {currencySymbols} from './enums';
 
 class ColumnBuilder {
   #addPreparedColumn(props) {
@@ -15,6 +16,22 @@ class ColumnBuilder {
     return this;
   }
 
+  addCurrencyColumn({currency, position, cellAlign = 'right', ...restProps}) {
+    const valueFormatter = (params) => {
+      const currencyValue = typeof currency === 'function' ? currency(params) : currency;
+      const symbol = currencySymbols[currencyValue] || currencyValue;
+      if (!symbol) 
+        return params.value.toFixed(2);
+      
+      if (position === 'left') 
+        return `${symbol} ${params.value.toFixed(2)}`;
+      return `${params.value.toFixed(2)} ${symbol}`;
+    };
+    
+    this.#addPreparedColumn({ valueFormatter, cellAlign, ...restProps });
+    return this;
+  }
+
   addDateColumn({dateFormat = "dd.MM.yyyy", ...restProps}) {
     this.#addPreparedColumn({ dateRenderer: dateFormat, ...restProps });
     return this; 
@@ -37,6 +54,15 @@ class ColumnBuilder {
     return this;
   }
 
+  addButtonColumn({buttons, visibleGetter = () => true, ...restProps}) {
+    const buttonRendererParams = {
+      buttons,
+      visibleGetter
+    }
+    this.#addPreparedColumn({ buttonRenderer: true, buttonRendererParams, ...restProps})
+    return this;
+  }
+
   build() {
     return this.columns;
   }

package/dist/ColumnBuilder.d.ts

@@ -4,6 +4,12 @@ declare class ColumnBuilder {
     columns: any[];
     intl: any;
     addColumn(props: any): this;
+    addCurrencyColumn({ currency, position, cellAlign, ...restProps }: {
+        [x: string]: any;
+        currency: any;
+        position: any;
+        cellAlign?: string | undefined;
+    }): this;
     addDateColumn({ dateFormat, ...restProps }: {
         [x: string]: any;
         dateFormat?: string | undefined;
@@ -22,6 +28,11 @@ declare class ColumnBuilder {
         cellAlign: any;
         visibleGetter?: (() => boolean) | undefined;
     }): this;
+    addButtonColumn({ buttons, visibleGetter, ...restProps }: {
+        [x: string]: any;
+        buttons: any;
+        visibleGetter?: (() => boolean) | undefined;
+    }): this;
     build(): any[];
     #private;
 }

package/dist/ColumnBuilder.js

@@ -5,6 +5,7 @@ var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (
 };
 var _ColumnBuilder_instances, _ColumnBuilder_addPreparedColumn;
 import { prepareColDef } from './utils';
+import { currencySymbols } from './enums';
 class ColumnBuilder {
     constructor(intl) {
         _ColumnBuilder_instances.add(this);
@@ -15,6 +16,19 @@ class ColumnBuilder {
         __classPrivateFieldGet(this, _ColumnBuilder_instances, "m", _ColumnBuilder_addPreparedColumn).call(this, props);
         return this;
     }
+    addCurrencyColumn({ currency, position, cellAlign = 'right', ...restProps }) {
+        const valueFormatter = (params) => {
+            const currencyValue = typeof currency === 'function' ? currency(params) : currency;
+            const symbol = currencySymbols[currencyValue] || currencyValue;
+            if (!symbol)
+                return params.value.toFixed(2);
+            if (position === 'left')
+                return `${symbol} ${params.value.toFixed(2)}`;
+            return `${params.value.toFixed(2)} ${symbol}`;
+        };
+        __classPrivateFieldGet(this, _ColumnBuilder_instances, "m", _ColumnBuilder_addPreparedColumn).call(this, { valueFormatter, cellAlign, ...restProps });
+        return this;
+    }
     addDateColumn({ dateFormat = "dd.MM.yyyy", ...restProps }) {
         __classPrivateFieldGet(this, _ColumnBuilder_instances, "m", _ColumnBuilder_addPreparedColumn).call(this, { dateRenderer: dateFormat, ...restProps });
         return this;
@@ -33,6 +47,14 @@ class ColumnBuilder {
         __classPrivateFieldGet(this, _ColumnBuilder_instances, "m", _ColumnBuilder_addPreparedColumn).call(this, { booleanRenderer: true, booleanRendererParams, ...restProps });
         return this;
     }
+    addButtonColumn({ buttons, visibleGetter = () => true, ...restProps }) {
+        const buttonRendererParams = {
+            buttons,
+            visibleGetter
+        };
+        __classPrivateFieldGet(this, _ColumnBuilder_instances, "m", _ColumnBuilder_addPreparedColumn).call(this, { buttonRenderer: true, buttonRendererParams, ...restProps });
+        return this;
+    }
     build() {
         return this.columns;
     }

package/dist/ColumnBuilder.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnBuilder.js","sourceRoot":"","sources":["../ColumnBuilder.jsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAC,aAAa,EAAC,MAAM,SAAS,CAAC;AAEtC,MAAM,aAAa;IAKjB,YAAY,IAAI;;QACd,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;QAClB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACnB,CAAC;IAED,SAAS,CAAC,KAAK;QACb,uBAAA,IAAI,kEAAmB,MAAvB,IAAI,EAAoB,KAAK,CAAC,CAAC;QAC/B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,aAAa,CAAC,EAAC,UAAU,GAAG,YAAY,EAAE,GAAG,SAAS,EAAC;QACrD,uBAAA,IAAI,kEAAmB,MAAvB,IAAI,EAAoB,EAAE,YAAY,EAAE,UAAU,EAAE,GAAG,SAAS,EAAE,CAAC,CAAC;QACpE,OAAO,IAAI,CAAC;IACd,CAAC;IAED,eAAe,CAAC,EAAC,cAAc,EAAE,YAAY,EAAE,kBAAkB,EAAE,gBAAgB,GAAG,GAAG,EAAE,GAAG,SAAS,EAAC;QACtG,uBAAA,IAAI,kEAAmB,MAAvB,IAAI,EAAoB,EAAE,cAAc,EAAE,YAAY,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,GAAG,SAAS,EAAE,CAAC,CAAC;QAC9G,OAAO,IAAI,CAAC;IACd,CAAC;IAED,gBAAgB,CAAC,EAAC,YAAY,GAAG,IAAI,EAAE,WAAW,GAAG,IAAI,EAAE,SAAS,EAAE,aAAa,GAAG,GAAG,EAAE,CAAC,IAAI,EAAE,GAAG,SAAS,EAAC;QAC7G,MAAM,qBAAqB,GAAG;YAC5B,SAAS;YACT,YAAY;YACZ,WAAW;YACX,aAAa;SACd,CAAA;QACD,uBAAA,IAAI,kEAAmB,MAAvB,IAAI,EAAoB,EAAE,eAAe,EAAE,IAAI,EAAE,qBAAqB,EAAE,GAAG,SAAS,EAAE,CAAC,CAAC;QAExF,OAAO,IAAI,CAAC;IACd,CAAC;IAED,KAAK;QACH,OAAO,IAAI,CAAC,OAAO,CAAC;IACtB,CAAC;CACF;uHAvCoB,KAAK;IACtB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;AACrD,CAAC;AAuCH,eAAe,aAAa,CAAC"}
+{"version":3,"file":"ColumnBuilder.js","sourceRoot":"","sources":["../ColumnBuilder.jsx"],"names":[],"mappings":"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"}

package/dist/enums.d.ts

@@ -1,3 +1,37 @@
 export namespace contentTooltipsEnum {
     let User: string;
 }
+export namespace currencySymbols {
+    let CZK: string;
+    let USD: string;
+    let GBP: string;
+    let EUR: string;
+    let PLN: string;
+    let AUD: string;
+    let BRL: string;
+    let BGN: string;
+    let CNY: string;
+    let DKK: string;
+    let PHP: string;
+    let HKD: string;
+    let INR: string;
+    let IDR: string;
+    let ISK: string;
+    let ILS: string;
+    let JPY: string;
+    let ZAR: string;
+    let CAD: string;
+    let KRW: string;
+    let HUF: string;
+    let MYR: string;
+    let MXN: string;
+    let XDR: string;
+    let NOK: string;
+    let NZD: string;
+    let RON: string;
+    let SGD: string;
+    let SEK: string;
+    let CHF: string;
+    let THB: string;
+    let TRY: string;
+}

package/dist/enums.js

@@ -1,4 +1,38 @@
 export const contentTooltipsEnum = {
     User: 'User'
 };
+export const currencySymbols = {
+    CZK: 'Kč',
+    USD: '$',
+    GBP: '£',
+    EUR: '€',
+    PLN: 'zł',
+    AUD: 'A$',
+    BRL: 'R$',
+    BGN: 'лв',
+    CNY: '¥',
+    DKK: 'kr',
+    PHP: '₱',
+    HKD: 'HK$',
+    INR: '₹',
+    IDR: 'Rp',
+    ISK: 'kr',
+    ILS: '₪',
+    JPY: '¥',
+    ZAR: 'R',
+    CAD: 'C$',
+    KRW: '₩',
+    HUF: 'Ft',
+    MYR: 'RM',
+    MXN: 'Mex$',
+    XDR: 'SDR',
+    NOK: 'kr',
+    NZD: 'NZ$',
+    RON: 'lei',
+    SGD: 'S$',
+    SEK: 'kr',
+    CHF: 'CHF',
+    THB: '฿',
+    TRY: '₺'
+};
 //# sourceMappingURL=enums.js.map

package/dist/enums.js.map

@@ -1 +1 @@
-{"version":3,"file":"enums.js","sourceRoot":"","sources":["../enums.js"],"names":[],"mappings":"AACA,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC,IAAI,EAAE,MAAM;CACb,CAAA"}
+{"version":3,"file":"enums.js","sourceRoot":"","sources":["../enums.js"],"names":[],"mappings":"AACA,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC,IAAI,EAAE,MAAM;CACb,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,KAAK;IACV,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,MAAM;IACX,GAAG,EAAE,KAAK;IACV,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,KAAK;IACV,GAAG,EAAE,KAAK;IACV,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,IAAI;IACT,GAAG,EAAE,KAAK;IACV,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,GAAG;CACT,CAAC"}

package/dist/utils.d.ts

@@ -5,5 +5,5 @@ export function prepareColDef(intl: any, { cellAlign, intlId, headerName, ...res
     headerName: any;
 }): {
     headerName: any;
-    cellStyle?: {} | undefined;
+    overrideCellStyle?: {} | undefined;
 };

package/dist/utils.js

@@ -1,14 +1,23 @@
 export const prepareColDef = (intl, { cellAlign, intlId, headerName, ...restColDef }) => {
-    let cellStyle = {};
+    let overrideCellStyle = {};
     switch (cellAlign) {
         case "left":
-            cellStyle = { textAlign: "left" };
+            overrideCellStyle = {
+                display: 'flex',
+                justifyContent: 'center'
+            };
             break;
         case "center":
-            cellStyle = { textAlign: "center" };
+            overrideCellStyle = {
+                display: 'flex',
+                justifyContent: 'flex-end'
+            };
             break;
         case "right":
-            cellStyle = { textAlign: "right" };
+            overrideCellStyle = {
+                display: 'flex',
+                justifyContent: 'flex-end'
+            };
             break;
         default:
             break;
@@ -19,7 +28,7 @@ export const prepareColDef = (intl, { cellAlign, intlId, headerName, ...restColD
     }
     return {
         ...restColDef,
-        ...(Object.keys(cellStyle).length > 0 && { cellStyle }),
+        ...(Object.keys(overrideCellStyle).length > 0 && { overrideCellStyle }),
         headerName: headerName || intlName,
     };
 };

package/dist/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../utils.js"],"names":[],"mappings":"AACA,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,UAAU,EAAE,EAAE,EAAE;IACtF,IAAI,SAAS,GAAG,EAAE,CAAC;IAEnB,QAAQ,SAAS,EAAE,CAAC;QAClB,KAAK,MAAM;YACT,SAAS,GAAG,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC;YAClC,MAAM;QACR,KAAK,QAAQ;YACX,SAAS,GAAG,EAAE,SAAS,EAAE,QAAQ,EAAE,CAAC;YACpC,MAAM;QACR,KAAK,OAAO;YACV,SAAS,GAAG,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC;YACnC,MAAM;QACR;YACE,MAAM;IACV,CAAC;IAED,IAAI,QAAQ,GAAG,IAAI,CAAC;IACpB,IAAI,IAAI,IAAI,CAAC,UAAU,IAAI,MAAM,EAAE,CAAC;QAClC,QAAQ,GAAG,IAAI,CAAC,aAAa,CAAC,EAAE,EAAE,EAAE,MAAM,EAAC,CAAC,CAAA;IAC9C,CAAC;IAED,OAAO;QACL,GAAG,UAAU;QACb,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,MAAM,GAAG,CAAC,IAAI,EAAE,SAAS,EAAE,CAAC;QACvD,UAAU,EAAE,UAAU,IAAI,QAAQ;KACnC,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../utils.js"],"names":[],"mappings":"AACA,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,UAAU,EAAE,EAAE,EAAE;IACtF,IAAI,iBAAiB,GAAG,EAAE,CAAC;IAE3B,QAAQ,SAAS,EAAE,CAAC;QAClB,KAAK,MAAM;YACT,iBAAiB,GAAG;gBAClB,OAAO,EAAE,MAAM;gBACf,cAAc,EAAE,QAAQ;aACzB,CAAA;YACD,MAAM;QACR,KAAK,QAAQ;YACX,iBAAiB,GAAG;gBAClB,OAAO,EAAE,MAAM;gBACf,cAAc,EAAE,UAAU;aAC3B,CAAA;YACD,MAAM;QACR,KAAK,OAAO;YACV,iBAAiB,GAAG;gBAClB,OAAO,EAAE,MAAM;gBACf,cAAc,EAAE,UAAU;aAC3B,CAAA;YACD,MAAM;QACR;YACE,MAAM;IACV,CAAC;IAED,IAAI,QAAQ,GAAG,IAAI,CAAC;IACpB,IAAI,IAAI,IAAI,CAAC,UAAU,IAAI,MAAM,EAAE,CAAC;QAClC,QAAQ,GAAG,IAAI,CAAC,aAAa,CAAC,EAAE,EAAE,EAAE,MAAM,EAAC,CAAC,CAAA;IAC9C,CAAC;IAED,OAAO;QACL,GAAG,UAAU;QACb,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,MAAM,GAAG,CAAC,IAAI,EAAE,iBAAiB,EAAE,CAAC;QACvE,UAAU,EAAE,UAAU,IAAI,QAAQ;KACnC,CAAC;AACJ,CAAC,CAAC"}

package/enums.js

@@ -1,4 +1,39 @@
 
 export const contentTooltipsEnum = {
   User: 'User'
-}
+}
+
+export const currencySymbols = {
+  CZK: 'Kč',
+  USD: '$',
+  GBP: '£',
+  EUR: '€',
+  PLN: 'zł',
+  AUD: 'A$',
+  BRL: 'R$',
+  BGN: 'лв',
+  CNY: '¥',
+  DKK: 'kr',
+  PHP: '₱',
+  HKD: 'HK$',
+  INR: '₹',
+  IDR: 'Rp',
+  ISK: 'kr',
+  ILS: '₪',
+  JPY: '¥',
+  ZAR: 'R',
+  CAD: 'C$',
+  KRW: '₩',
+  HUF: 'Ft',
+  MYR: 'RM',
+  MXN: 'Mex$',
+  XDR: 'SDR',
+  NOK: 'kr',
+  NZD: 'NZ$',
+  RON: 'lei',
+  SGD: 'S$',
+  SEK: 'kr',
+  CHF: 'CHF',
+  THB: '฿',
+  TRY: '₺'
+};

package/package.json

@@ -1,16 +1,16 @@
 {
   "name": "@bit.rhplus/ui.grid",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "homepage": "https://bit.cloud/remote-scope/ui/grid",
   "main": "dist/index.js",
   "componentId": {
     "scope": "remote-scope",
     "name": "ui/grid",
-    "version": "0.0.5"
+    "version": "0.0.7"
   },
   "dependencies": {
     "classnames": "^2.5.1",
-    "@bit.rhplus/ag-grid": "0.0.13"
+    "@bit.rhplus/ag-grid": "0.0.16"
   },
   "devDependencies": {
     "@teambit/react.react-env": "1.0.98"

package/utils.js

@@ -1,16 +1,25 @@
 
 export const prepareColDef = (intl, { cellAlign, intlId, headerName, ...restColDef }) => {
-  let cellStyle = {};
+  let overrideCellStyle = {};
   
   switch (cellAlign) {
-    case "left":
-      cellStyle = { textAlign: "left" };
+    case "left":      
+      overrideCellStyle = { 
+        display: 'flex',
+        justifyContent: 'center'
+      }
       break;
     case "center":
-      cellStyle = { textAlign: "center" };
+      overrideCellStyle = { 
+        display: 'flex',
+        justifyContent: 'flex-end'
+      }
       break;
     case "right":
-      cellStyle = { textAlign: "right" };
+      overrideCellStyle = { 
+        display: 'flex',
+        justifyContent: 'flex-end'
+      }
       break;
     default:
       break;
@@ -23,7 +32,7 @@ export const prepareColDef = (intl, { cellAlign, intlId, headerName, ...restColD
 
   return {
     ...restColDef,
-    ...(Object.keys(cellStyle).length > 0 && { cellStyle }),
+    ...(Object.keys(overrideCellStyle).length > 0 && { overrideCellStyle }), 
     headerName: headerName || intlName,
   };
 };