@angular-generic-table/core - npm Package Compare versions

Comparing version 4.1.0-rc.3 to 4.1.1

package.json

 {
   "name": "@angular-generic-table/core",
-  "version": "4.1.0-rc.3",
+  "version": "4.1.1",
   "description": "A generic table component for Angular",
@@ -8,13 +8,12 @@ "main": "index.js",
     "test": "echo \"Error: no test specified\" && exit 1",
-    "build:css": "../../node_modules/.bin/node-sass --source-map true --include-path scss generic-table.scss ../packages/core/css/generic-table-prebuild.css",
-    "autoprefix:css": "../../node_modules/.bin/postcss -u autoprefixer -r ../packages/core/css/generic-table-prebuild.css",
-    "minify:css": "../../node_modules/.bin/cleancss -o ../packages/core/css/generic-table-prebuild.min.css ../packages/core/css/generic-table-prebuild.css --source-map",
+    "build:css": "node-sass --source-map true --include-path scss generic-table.scss ../packages/core/css/generic-table-prebuild.css",
+    "autoprefix:css": "postcss -u autoprefixer -r ../packages/core/css/generic-table-prebuild.css",
+    "minify:css": "cleancss -o ../packages/core/css/generic-table-prebuild.min.css ../packages/core/css/generic-table-prebuild.css --source-map",
     "compile:css": "npm run build:css && npm run autoprefix:css && npm run minify:css",
-    "rename:css": "../../node_modules/.bin/renamer --find \"generic-table-prebuild\" --replace \"generic-table\" ../packages/core/css/*",
-    "copy:scss": "../../node_modules/.bin/copyfiles -f generic-table.scss ../packages/core/scss",
-    "copy:meta": "../../node_modules/.bin/copyfiles -f ../../LICENSE README.md ../../CHANGELOG.md package.json README.md ../packages/core/",
-    "clean": "../../node_modules/.bin/rimraf ../packages/core",
-    "build": "npm run clean && ../../node_modules/.bin/ngc -p tsconfig-aot.json && npm run copy:meta && npm run copy:scss && npm run compile:css && npm run rename:css",
-    "prepublish": "npm run -s build",
-    "publish":"npm publish --access public"
+    "rename:css": "renamer --find \"generic-table-prebuild\" --replace \"generic-table\" ../packages/core/css/*",
+    "copy:scss": "copyfiles -f generic-table.scss ../packages/core/scss",
+    "copy:meta": "copyfiles -f ../../LICENSE README.md ../../CHANGELOG.md package.json README.md ../packages/core/",
+    "clean": "rimraf ../packages/core",
+    "build": "npm run clean && ngc -p tsconfig-aot.json && npm run copy:meta && npm run copy:scss && npm run compile:css && npm run rename:css",
+    "publish-package": "npm install && npm run build && onpm ../packages/core publish"
   },
@@ -34,3 +33,10 @@ "keywords": [
     "@angular/common": "^4.0.0"
+  },
+  "devDependencies": {
+    "@angular/compiler-cli": "^4.0.2",
+    "bootstrap": "^4.0.0-alpha.6",
+    "node-sass": "^4.5.2",
+    "othernpm": "^1.1.0",
+    "renamer": "^0.6.1"
   }
 }

README.md

@@ -18,3 +18,3 @@ # angular-generic-table
 
-Run `npm install --save angular-generic-table`
+Run `npm install @angular-generic-table/core --save`
 
@@ -27,3 +27,3 @@ Include generic table module in your project, for example if you want to add it to your app module:
 import { AppComponent } from './app.component';
-import { GenericTableModule } from 'angular-generic-table';
+import { GenericTableModule } from '@angular-generic-table/core';
 
@@ -49,3 +49,3 @@ @NgModule({
 import { Component } from '@angular/core';
-import { GtConfig } from 'angular-generic-table';
+import { GtConfig } from '@angular-generic-table/core';
 
@@ -59,3 +59,3 @@ @Component({
   public configObject: GtConfig<any>;
-  
+
   public data:Array<{
@@ -143,323 +143,1 @@ id:number,
 ```
-
-
-## Configuration
-
-In order for generic tables to render the data in a table, we need to create a configuration object like this:
-```TypeScript
-config = {
-  settings:[],
-  fields:[],
-  data:[]
-}
-```
-
-### Settings array
-Each column must have it's own settings object that can have the following properties:
-
-| Key         | Type    | Usage                                                                                             | Default        |            |
-|:------------|:--------|:--------------------------------------------------------------------------------------------------|:---------------|:-----------|
-| objectKey   | string  | unique identifier for column, used for data mapping                                               |                |            |
-| visible     | boolean | should column be visible                                                                          | true           | (OPTIONAL) |
-| enabled     | boolean | should column be enabled, if not enabled a user shouldn't be able to toggle visibility for column | true           | (OPTIONAL) |
-| sort        | string  | "enable", "asc" or "desc" use "disable" to disable sorting                                        | 'enable'       | (OPTIONAL) |
-| sortOrder   | number  | initial sort order                                                                                | order in array | (OPTIONAL) |
-| columnOrder | number  | initial column order                                                                              | order in array | (OPTIONAL) |
-| export      | boolean | should column be included when exporting to CSV                                                   | true           | (OPTIONAL) |
-| search      | boolean | should column be included when using global search                                                | true           | (OPTIONAL) |
-
-**Usage:**
-
-```TypeScript
-[{
-    objectKey:"first_column"
-  }, {
-    objectKey:"second_column"
-  }, {
-  objectKey:"third_column"
-}]
-```
-
-### Fields array
-Each column must also have it's own field definition object that can have the following properties:
-
-
-| Key        | Type          | Usage                                                                                                                                                                                                                                                                             |            |
-|:-----------|:--------------|:----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|:-----------|
-| name       | string        | heading for column                                                                                                                                                                                                                                                                |            |
-| objectKey  | string        | unique identifier for column, used for data mapping                                                                                                                                                                                                                               |            |
-| classNames | string        | class names to be applied to column                                                                                                                                                                                                                                               | (OPTIONAL) |
-| render     | function(row) | custom function for data presentation, ex. display 1480579417501 as 2016-12-01 09:03:37                                                                                                                                                                                           | (OPTIONAL) |
-| value      | function(row) | custom function for data manipulation/creation ex. combine first name and last name into a new column                                                                                                                                                                             | (OPTIONAL) |
-| sort       | function(row) | custom function used when sorting column, i.e. you might want to sort a value as a number but display (render) it as a string                                                                                                                                                     | (OPTIONAL) |
-| search     | function(row) | custom function used when searching column, i.e similar to render, you might want to match on something else than the raw data. If no search function is defined, generic table will look for a value function and if no value function is defined table will use raw data value. | (OPTIONAL) |
-| export     | function(row) | feature not available yet...                                                                                                                                                                                                                                                      | (OPTIONAL) |
-| click      | function(row) | execute function when column cell is clicked                                                                                                                                                                                                                                      | (OPTIONAL) |
-| expand     | boolean       | if true row will expand and show a custom component passed using `gtRowComponent` (false by default)                                                                                                                                                                                | (OPTIONAL) |
-
-
-**Usage:**
-
-```TypeScript
-[{
-    objectKey:"first_column",
-    name:"First column"
-  }, {
-    objectKey:"second_column",
-    name:"Second column"
-  }, {
-    objectKey:"third_column",
-    name:"Third column"
-}]
-```
-
-### Data array
-The data for each row needs to be stored in an object where each key in the object should map against object keys specified in the settings and field arrays ex.
-
-```TypeScript
-[{
-  first_column:"first row",
-  second_column:1,
-  third_column:"third column"
-}, {
-  first_column:"second row",
-  second_column:2,
-  third_column:"third column"
-}]
-```
-
-## Table attributes/inputs
-To pass data, settings and configuration to the table using the following inputs:
-
-| Attribute         | Type      | Usage                                                                                  |            |
-|:------------------|:----------|:---------------------------------------------------------------------------------------|:-----------|
-| gtSettings        | array     | used for passing settings                                                              |            |
-| gtFields          | array     | used for passing field definitions                                                     |            |
-| gtData            | array     | used for passing data                                                                  |            |
-| gtClasses         | string    | used for adding classes to table element                                               | (OPTIONAL) |
-| gtTexts           | object    | use to override default texts                                                          | (OPTIONAL) |
-| gtOptions         | object    | use to override default table options (see available options below)                    | (OPTIONAL) |
-| gtInfo            | object    | used for passing record info to table (lazy loading only)                              | (OPTIONAL) |
-| gtRowComponent    | component | used for passing expanding row component to table                                      | (OPTIONAL) |
-
-**Usage:**
-```Html
-<generic-table [gtClasses]="'table-hover'" [gtSettings]="configObject.settings" [gtFields]="configObject.fields" [(gtData)]="configObject.data" [gtRowComponent]="expandedRow" [gtOptions]="{lazyLoad:true}"></generic-table>
-```
-
-## Table options
-Available options:
-
-| Name            | Type        | Usage                                                                                         | Default |            |
-|:----------------|:------------|:----------------------------------------------------------------------------------------------|:--------|:-----------|
-| csvDelimiter    | string      | csv delimiter when exporting to CSV file                                                      | ";"     | (OPTIONAL) |
-| stack           | boolean     | stack columns on mobile devices and tablets, requires css (included)                          | false   | (OPTIONAL) |
-| lazyLoad        | boolean     | should table lazy load data                                                                   | false   | (OPTIONAL) |
-| cache           | boolean     | should table cache data when lazy loading                                                     | false   | (OPTIONAL) |
-| debounceTime    | number (ms) | prevent multiple server requests for data when lazy loading by setting a debounce time        | 200     | (OPTIONAL) |
-| highlightSearch | boolean     | should table highlight matched search terms, style using .gt-highlight-search selector        | false   | (OPTIONAL) |
-| rowSelection    | boolean     | enable row selection (on row click), emits select/deselect event with currently selected rows | false   | (OPTIONAL) |
-
-
-
-**Usage:**
-```Html
-<generic-table ... [gtOptions]="{lazy:true, cache: true}"></generic-table>
-```
-
-## Table events
-The table emits events using `gtEvent`, the events are passed in an object which looks like this:
-```TypeScript
-{
-  name:'gt-sorting-applied',
-  value: 'passed data...'
-}
-```
-Currently the table emits the following events:
-
-| Name                  | Trigger                                                | Data passed with event                                                             |
-|:----------------------|:-------------------------------------------------------|:-----------------------------------------------------------------------------------|
-| gt-sorting-applied    | sorting changed                                        | new sort order in array ex. ["-firstColumn", "secondColumn"]                       |
-| gt-row-length-changed | record length changed                                  | new record length ex. 10                                                           |
-| gt-page-changed       | page changed                                           | current state ex. {pageCurrent: current page, recordLength: current record length} |
-| gt-page-changed-lazy  | page changed and no data exits for new page            | current state ex. {pageCurrent: current page, recordLength: current record length} |
-| gt-info               | table info has changed (not emitted when lazy loading) | current state ex. {pageCurrent: current page, recordLength: current record length} |
-| gt-exported-csv       | table has exported data to csv file                    | file name                                                                          |
-| gt-row-select         | row selected (on row clicked)                          | row selection ex. {changedRow: row object, selectedRows: array with selected rows} |
-| gt-row-deselect       | row deselected (on row clicked)                        | row selection ex. {changedRow: row object, selectedRows: array with selected rows} |
-| gt-row-select-all     | selectAllRows function                                 | row selection ex. {changedRow: 'all', selectedRows: array with selected rows}      |
-| gt-row-deselect-all   | deselectAllRows function                               | row selection ex. {changedRow: 'all', selectedRows: array with selected rows}      |
-| gt-row-expand         | when row is expanded                                   | row state ex. {changedRow: row object, expandedRows: array with expanded rows}     |
-| gt-row-collapse       | when row is collapsed                                  | row state ex. {changedRow: row object, expandedRows: array with expanded rows}     |
-| gt-row-expand-all     | expandAllRows function                                 | row state ex. {changedRow: row object, expandedRows: array with expanded rows}     |
-| gt-row-collapse-all   | collapseAllRows function                               | row state ex. {changedRow: row object, expandedRows: array with expanded rows}     |
-
-
-**Usage:**
-
-```Html
-<generic-table ... (gtEvent)="trigger($event)"></generic-table>
-```
-
-```TypeScript
-public trigger = function($event){
-    switch($event.name){
-      case 'gt-sorting-applied':
-            console.log($event.value);
-            break;
-    }
-  };
-```
-
-## Texts
-
-Override texts by passing a new object using `gtTexts` attribute.
-
-**Available texts:**
-
-| Key                     | Description                                                                            | Default                                                                                                         |
-|:------------------------|:---------------------------------------------------------------------------------------|:----------------------------------------------------------------------------------------------------------------|
-| loading                 | Text displayed when table rows are loading data (lazy loading only)                    | Loading...                                                                                                      |
-| noData                  | Text displayed when table contains no data                                             | No data                                                                                                         |
-| noMatchingData          | Text displayed when table search/filter has no matches                                 | No data matching results found                                                                                  |
-| noVisibleColumnsHeading | Table heading displayed when no columns are visible                                    | No visible columns                                                                                              |
-| noVisibleColumns        | Table content displayed when no columns are visible                                    | Please select at least one column to be visible.                                                                |
-| tableInfo               | Text displayed in table info component when neither search nor filter has been applied | Showing #recordFrom to #recordTo of #recordsAfterSearch entries.                                                |
-| tableInfoAfterSearch    | Text displayed in table info component when search or filter has been applied          | Showing,#recordFrom to #recordTo of #recordsAfterSearch entries (filtered from a total of #recordsAll entries). |
-| csvDownload             | File name for CSV export (.csv is added by default)                                    | download                                                                                                        |
-| sortLabel               | Text for sort label shown when tables columns are stacked                              | Sort:                                                                                                           |
-| paginateNext            | Text used by screen readers for going to next page                                     | Next page                                                                                                       |
-| paginatePrevious        | Text used by screen readers for going to previous page                                 | Previous page                                                                                                   |
-
-
-**Usage:**
-
-```Html
-<generic-table ... [gtTexts]="{loading:'Loading data...'}"></generic-table>
-```
-
-## Table functions
-
-| Name            | Description                                                                                             | Usage
-|:----------------|:--------------------------------------------------------------------------------------------------------|:---------------------------------------------|
-| exportCSV       | See 'Export to CSV' section below                                                                       | `myTable.exportCSV('custom-file-name')`      |
-| gtApplyFilter   | Filter table data, [see example](https://hjalmers.github.io/angular-generic-table/examples)             | `myTable.gtApplyFilter(object with filters)` |
-| gtClearFilter   | Clear filters, [see example](https://hjalmers.github.io/angular-generic-table/examples)                 | `myTable.gtClearFilter()`                    |
-| gtSearch        | See 'Global table search and highlight' section below                                                   | `myTable.gtSearch(search string)`            |
-| changeRowLength | Change number of visible rows, [see example](https://hjalmers.github.io/angular-generic-table/examples) | `myTable.changeRowLength(number of rows)`    |
-| nextPage        | Go to next page                                                                                         | `myTable.nextPage()`                         |
-| previousPage    | Go to previous                                                                                          | `myTable.previousPage()`                     |
-| goToPage        | Go to specific page (pass page number)                                                                  | `myTable.goToPage()`                         |
-| selectAllRows   | Select all rows                                                                                         | `myTable.selectAllRows()`                    |
-| deselectAllRows | Deselect all rows                                                                                       | `myTable.deselectAllRows()`                  |
-| expandAllRows   | Expand all rows                                                                                         | `myTable.expandAllRows()`                    |
-| collapseAllRows | Collapse all rows                                                                                       | `myTable.collapseAllRows()`                  |
-
-
-## Global table search and highlight
-
-Search and filter table using global search. Separate multiple search terms with a space [ ] or match whole phrase by putting them within quotes ["].
-
-Define custom search value for individual columns by declaring a custom search function in the fields array, ie. you might want the search to match one value but display/render another in the table ex. search for 100000 and display 1 000 000,00 in the table.
-
-Turn of search for individual columns by setting column setting property `search` to `false`.
-
-**Usage:** 
-
-Call generic tables search function and pass your search term(s)
-
-```TypeScript
-myTable.gtSearch(searchString);
-```
-
-**Usage (when lazy loading):**
-
-Return search terms in your server response.
- 
-```TypeScript
-this.configObject.info:GtInformation = {
-  pageCurrent: 1,
-  pageNext: 2,
-  pagePrevious: null,
-  pageTotal: 10,
-  recordLength: 10,
-  recordsAll: 100,
-  recordsAfterFilter: 100,
-  recordsAfterSearch: 13,
-  searchTerms: "foo bar"
-}
-```
-
-[see demo](https://hjalmers.github.io/angular-generic-table/examples) for full implementation and examples
-
-## Column visibility
-
-You can implement your own control for toggling column visibility, either bind directly to the settings array and alter the visibility property directly or create an object to hold the values until your ready to update. Don't forget to call 'redraw()' when you want the table to update ie. `(click)="myTable.redraw()"`
-
-## Export to CSV
-
-Export table data to CSV and optionally pass a file name. Please note that the table exports data after sort order, filters and global search have been applied. In case you use the lazy load feature you'll have to implement the export server-side.
-
-Define custom export value for individual columns by declaring a custom export function in the fields array, ie. you might want the export one value but display/render another in the table ex. export 100000 as a number but display it as a string 1 000 000,00 in the table.
-
-Turn of export for individual columns by setting column setting property `export` to `false`.
-
-**Usage:**
-```TypeScript
-(click)="myTable.exportCSV('custom-file-name')"
-```
-
-## Pagination
-
-Display pagination for your table, uses bootstrap default markup.
-
-**Usage:**
-
-```Html
-<gt-pagination [genericTable]="myTable"></gt-pagination>
-```
-
-**Options:**
-
-| Attribute         | Type           | Usage                                                               |            |
-|:------------------|:---------------|:--------------------------------------------------------------------|:-----------|
-| genericTable      | table instance | used for linking pagination component to table                      |            |
-| gtClasses         | string         | used for adding classes to pagination element, ex. pagination-sm    | (OPTIONAL) |
-
-## Table information
-
-Display information about your table, ie. number of records, filtered records, record length etc. 
-
-**Usage:**
-
-```Html
-<gt-table-info [genericTable]="myTable"></gt-table-info>
-```
-
-**Options:**
-
-| Attribute         | Type           | Usage                                                                                                    |            |
-|:------------------|:---------------|:---------------------------------------------------------------------------------------------------------|:-----------|
-| genericTable      | table instance | used for linking table info component to table                                                           |            |
-| customText        | string         | override default text provided by generic table component, useful when you want to split up the display  | (OPTIONAL) |
-
-Available information:
-Use the key in the text passed, either to the table component using `gtTexts` attribute or to the individual table info component using `customText` attribute.
-Ex. `Showing #recordFrom to #recordTo.` will be rendered as `Showing 1 to 10.`
-
-| Name               | Key                 | Description                                                                 |
-|:-------------------|:--------------------|:----------------------------------------------------------------------------|
-| pageCurrent        | #pageCurrent        | Displays current page number                                                |
-| pageNext           | #pageNext           | Displays next page number                                                   |
-| pagePrevious       | #pagePrevious       | Displays previous page number                                               |
-| pageTotal          | #pageTotal          | Displays total number of pages                                              |
-| recordFrom         | #recordFrom         | Displays visible record number from                                         |
-| recordTo           | #recordTo           | Displays visible record number to                                           |
-| recordLength       | #recordLength       | Displays number of records shown                                            |
-| recordsAll         | #recordsAll         | Displays total number of records                                            |
-| recordsAfterFilter | #recordsAfterFilter | Displays total number of records after filters have been applied            |
-| recordsAfterSearch | #recordsAfterSearch | Displays total number of records after filters and search have been applied |
-
-
-## Please note
-As this component is still under development, please expect breaking changes.

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

219656

increased by123.83%

Number of package files

109

increased by251.61%

Lines of code

2242

increased by30.96%

Number of low quality alerts

2

decreased by-33.33%

Worsened metrics

Dev dependency count

5

increased byInfinity%

Number of lines in readme file

139

decreased by-69.85%

Number of low supply chain risk alerts

2

increased byInfinity%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes