From 606795b677956a88c2e4b5e943fddcaba3113b51 Mon Sep 17 00:00:00 2001 From: ghiscoding Date: Mon, 28 Jun 2021 15:35:45 -0400 Subject: [PATCH] feat(Pagination): decouple the Pagination Component to separate package - in order to use this Pagination Component in other framework (like Aurelia-Slickgrid) without rewriting the same code, we can simply extract this into a brand new Pagination Component --- packages/pagination-component/README.md | 22 ++++++++ packages/pagination-component/package.json | 55 +++++++++++++++++++ packages/pagination-component/src/.npmignore | 2 + .../slick-pagination-without-i18n.spec.ts | 4 +- .../src}/__tests__/slick-pagination.spec.ts | 4 +- .../pagination-component/src/index.spec.ts | 11 ++++ packages/pagination-component/src/index.ts | 1 + .../src}/slick-pagination.component.html | 0 .../src}/slick-pagination.component.ts | 0 .../pagination-component/tsconfig.bundle.json | 14 +++++ packages/pagination-component/tsconfig.json | 24 ++++++++ packages/vanilla-bundle/package.json | 1 + .../components/slick-vanilla-grid-bundle.ts | 2 +- 13 files changed, 135 insertions(+), 5 deletions(-) create mode 100644 packages/pagination-component/README.md create mode 100644 packages/pagination-component/package.json create mode 100644 packages/pagination-component/src/.npmignore rename packages/{vanilla-bundle/src/components => pagination-component/src}/__tests__/slick-pagination-without-i18n.spec.ts (96%) rename packages/{vanilla-bundle/src/components => pagination-component/src}/__tests__/slick-pagination.spec.ts (98%) create mode 100644 packages/pagination-component/src/index.spec.ts create mode 100644 packages/pagination-component/src/index.ts rename packages/{vanilla-bundle/src/components => pagination-component/src}/slick-pagination.component.html (100%) rename packages/{vanilla-bundle/src/components => pagination-component/src}/slick-pagination.component.ts (100%) create mode 100644 packages/pagination-component/tsconfig.bundle.json create mode 100644 packages/pagination-component/tsconfig.json diff --git a/packages/pagination-component/README.md b/packages/pagination-component/README.md new file mode 100644 index 000000000..0bafc9dd1 --- /dev/null +++ b/packages/pagination-component/README.md @@ -0,0 +1,22 @@ +[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) +[![TypeScript](https://img.shields.io/badge/%3C%2F%3E-TypeScript-%230074c1.svg)](http://www.typescriptlang.org/) +[![lerna](https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg)](https://lerna.js.org/) +[![npm](https://img.shields.io/npm/v/@slickgrid-universal/pagination-component.svg?color=forest)](https://www.npmjs.com/package/@slickgrid-universal/pagination-component) +[![npm](https://img.shields.io/npm/dy/@slickgrid-universal/pagination-component?color=forest)](https://www.npmjs.com/package/@slickgrid-universal/pagination-component) + +[![Actions Status](https://github.com/ghiscoding/slickgrid-universal/workflows/CI%20Build/badge.svg)](https://github.com/ghiscoding/slickgrid-universal/actions) +[![Cypress.io](https://img.shields.io/badge/tested%20with-Cypress-04C38E.svg)](https://www.cypress.io/) +[![jest](https://jestjs.io/img/jest-badge.svg)](https://github.com/facebook/jest) +[![codecov](https://codecov.io/gh/ghiscoding/slickgrid-universal/branch/master/graph/badge.svg)](https://codecov.io/gh/ghiscoding/slickgrid-universal) + +## Pagination Component +#### @slickgrid-universal/pagination-component + +Vanilla Implementation of a Pagination Component that can optionally be shown at the bottom of the grid. This Pagination will automatically be enabled when using a Backend Service (like OData/GraphQL) but can also optionally be used with a local (in-memory) dataset as well, the data will still remain in memory but it will be shown with pagination. + +### Internal Dependencies +- [@slickgrid-universal/binding](https://github.com/ghiscoding/slickgrid-universal/tree/master/packages/binding) +- [@slickgrid-universal/common](https://github.com/ghiscoding/slickgrid-universal/tree/master/packages/common) + +### Installation +Follow the instruction provided in the main [README](https://github.com/ghiscoding/slickgrid-universal#installation) diff --git a/packages/pagination-component/package.json b/packages/pagination-component/package.json new file mode 100644 index 000000000..b0ee2be80 --- /dev/null +++ b/packages/pagination-component/package.json @@ -0,0 +1,55 @@ +{ + "name": "@slickgrid-universal/pagination-component", + "version": "0.14.1", + "description": "Slick Pagination Component - Vanilla Implementation of a Pagination Component", + "main": "dist/commonjs/index.js", + "browser": "src/index.ts", + "module": "dist/esm/index.js", + "types": "dist/commonjs/index.d.ts", + "typings": "dist/commonjs/index.d.ts", + "publishConfig": { + "access": "public" + }, + "directories": { + "src": "src" + }, + "scripts": { + "build": "cross-env tsc --build", + "postbuild": "npm-run-all bundle:commonjs", + "build:watch": "cross-env tsc --incremental --watch", + "dev": "run-s build", + "dev:watch": "run-p build:watch", + "bundle": "run-p bundle:commonjs bundle:esm", + "bundle:commonjs": "tsc --project tsconfig.bundle.json --outDir dist/commonjs --module commonjs", + "postbundle:commonjs": "run-s copy:html:cjs", + "bundle:esm": "cross-env tsc --project tsconfig.bundle.json --outDir dist/esm --module esnext --target es2018", + "postbundle:esm": "run-s copy:html:esm", + "copy:html:cjs": "cross-env copyfiles -f src/*.html dist/commonjs", + "copy:html:esm": "cross-env copyfiles -f src/*.html dist/esm", + "prebundle": "npm-run-all delete:dist", + "delete:dist": "cross-env rimraf --maxBusyTries=10 dist", + "package:add-browser-prop": "cross-env node ../change-package-browser.js --add-browser=true --folder-name=pagination-component", + "package:remove-browser-prop": "cross-env node ../change-package-browser.js --remove-browser=true --folder-name=pagination-component" + }, + "author": "Ghislain B.", + "license": "MIT", + "engines": { + "node": ">=14.15.0", + "npm": ">=6.14.8" + }, + "browserslist": [ + "last 2 version", + "> 1%", + "not dead" + ], + "dependencies": { + "@slickgrid-universal/binding": "^0.14.1", + "@slickgrid-universal/common": "^0.14.1" + }, + "devDependencies": { + "copyfiles": "^2.4.1", + "cross-env": "^7.0.3", + "npm-run-all": "^4.1.5", + "rimraf": "^3.0.2" + } +} \ No newline at end of file diff --git a/packages/pagination-component/src/.npmignore b/packages/pagination-component/src/.npmignore new file mode 100644 index 000000000..083a3140f --- /dev/null +++ b/packages/pagination-component/src/.npmignore @@ -0,0 +1,2 @@ +index.ts +**/*.* diff --git a/packages/vanilla-bundle/src/components/__tests__/slick-pagination-without-i18n.spec.ts b/packages/pagination-component/src/__tests__/slick-pagination-without-i18n.spec.ts similarity index 96% rename from packages/vanilla-bundle/src/components/__tests__/slick-pagination-without-i18n.spec.ts rename to packages/pagination-component/src/__tests__/slick-pagination-without-i18n.spec.ts index b5c033621..b74e20868 100644 --- a/packages/vanilla-bundle/src/components/__tests__/slick-pagination-without-i18n.spec.ts +++ b/packages/pagination-component/src/__tests__/slick-pagination-without-i18n.spec.ts @@ -1,8 +1,8 @@ import { PaginationService, SharedService, SlickGrid, GridOption, Locale } from '@slickgrid-universal/common'; +import { TranslateServiceStub } from '../../../../test/translateServiceStub'; +import { EventPubSubService } from '../../../vanilla-bundle/src/services/eventPubSub.service'; import { SlickPaginationComponent } from '../slick-pagination.component'; -import { TranslateServiceStub } from '../../../../../test/translateServiceStub'; -import { EventPubSubService } from '../../services/eventPubSub.service'; function removeExtraSpaces(text: string) { return `${text}`.replace(/\s{2,}/g, ''); diff --git a/packages/vanilla-bundle/src/components/__tests__/slick-pagination.spec.ts b/packages/pagination-component/src/__tests__/slick-pagination.spec.ts similarity index 98% rename from packages/vanilla-bundle/src/components/__tests__/slick-pagination.spec.ts rename to packages/pagination-component/src/__tests__/slick-pagination.spec.ts index 6bbeb561c..eea05b235 100644 --- a/packages/vanilla-bundle/src/components/__tests__/slick-pagination.spec.ts +++ b/packages/pagination-component/src/__tests__/slick-pagination.spec.ts @@ -1,8 +1,8 @@ import { PaginationService, SharedService, SlickGrid, GridOption } from '@slickgrid-universal/common'; +import { TranslateServiceStub } from '../../../../test/translateServiceStub'; +import { EventPubSubService } from '../../../vanilla-bundle/src/services/eventPubSub.service'; import { SlickPaginationComponent } from '../slick-pagination.component'; -import { TranslateServiceStub } from '../../../../../test/translateServiceStub'; -import { EventPubSubService } from '../../services/eventPubSub.service'; function removeExtraSpaces(text: string) { return `${text}`.replace(/\s{2,}/g, ''); diff --git a/packages/pagination-component/src/index.spec.ts b/packages/pagination-component/src/index.spec.ts new file mode 100644 index 000000000..e6bbfe0d5 --- /dev/null +++ b/packages/pagination-component/src/index.spec.ts @@ -0,0 +1,11 @@ +import * as entry from './index'; + +describe('Testing library entry point', () => { + it('should have an index entry point defined', () => { + expect(entry).toBeTruthy(); + }); + + it('should have all exported object defined', () => { + expect(typeof entry.SlickPaginationComponent).toBe('function'); + }); +}); diff --git a/packages/pagination-component/src/index.ts b/packages/pagination-component/src/index.ts new file mode 100644 index 000000000..0903f549d --- /dev/null +++ b/packages/pagination-component/src/index.ts @@ -0,0 +1 @@ +export * from './slick-pagination.component'; diff --git a/packages/vanilla-bundle/src/components/slick-pagination.component.html b/packages/pagination-component/src/slick-pagination.component.html similarity index 100% rename from packages/vanilla-bundle/src/components/slick-pagination.component.html rename to packages/pagination-component/src/slick-pagination.component.html diff --git a/packages/vanilla-bundle/src/components/slick-pagination.component.ts b/packages/pagination-component/src/slick-pagination.component.ts similarity index 100% rename from packages/vanilla-bundle/src/components/slick-pagination.component.ts rename to packages/pagination-component/src/slick-pagination.component.ts diff --git a/packages/pagination-component/tsconfig.bundle.json b/packages/pagination-component/tsconfig.bundle.json new file mode 100644 index 000000000..7c6f72a9a --- /dev/null +++ b/packages/pagination-component/tsconfig.bundle.json @@ -0,0 +1,14 @@ +{ + "extends": "../tsconfig.bundle.json", + "compilerOptions": { + "typeRoots": [ + "../typings", + "../../node_modules/@types" + ], + "outDir": "dist/commonjs" + }, + "include": [ + "../typings", + "**/*" + ] +} \ No newline at end of file diff --git a/packages/pagination-component/tsconfig.json b/packages/pagination-component/tsconfig.json new file mode 100644 index 000000000..277dfa292 --- /dev/null +++ b/packages/pagination-component/tsconfig.json @@ -0,0 +1,24 @@ +{ + "extends": "../tsconfig.base.json", + "compileOnSave": false, + "compilerOptions": { + "rootDir": "src", + "declarationDir": "dist/esm", + "outDir": "dist/esm", + "typeRoots": [ + "typings" + ] + }, + "exclude": [ + "dist", + "node_modules", + "**/*.spec.ts" + ], + "filesGlob": [ + "./src/**/*.ts" + ], + "include": [ + "src/**/*.ts", + "typings/**/*.ts" + ] +} \ No newline at end of file diff --git a/packages/vanilla-bundle/package.json b/packages/vanilla-bundle/package.json index ec60c7c48..222d4b133 100644 --- a/packages/vanilla-bundle/package.json +++ b/packages/vanilla-bundle/package.json @@ -51,6 +51,7 @@ "@slickgrid-universal/custom-footer-component": "^0.14.1", "@slickgrid-universal/empty-warning-component": "^0.14.1", "@slickgrid-universal/excel-export": "^0.14.1", + "@slickgrid-universal/pagination-component": "^0.14.1", "@slickgrid-universal/text-export": "^0.14.1", "whatwg-fetch": "^3.6.2" }, diff --git a/packages/vanilla-bundle/src/components/slick-vanilla-grid-bundle.ts b/packages/vanilla-bundle/src/components/slick-vanilla-grid-bundle.ts index 2836533ba..5c90273b6 100644 --- a/packages/vanilla-bundle/src/components/slick-vanilla-grid-bundle.ts +++ b/packages/vanilla-bundle/src/components/slick-vanilla-grid-bundle.ts @@ -74,12 +74,12 @@ import { import { SlickCompositeEditorComponent } from '@slickgrid-universal/composite-editor-component'; import { SlickEmptyWarningComponent } from '@slickgrid-universal/empty-warning-component'; import { SlickFooterComponent } from '@slickgrid-universal/custom-footer-component'; +import { SlickPaginationComponent } from '@slickgrid-universal/pagination-component'; import { EventPubSubService } from '../services/eventPubSub.service'; import { TextExportService } from '../services/textExport.service'; import { ResizerService } from '../services/resizer.service'; import { SalesforceGlobalGridOptions } from '../salesforce-global-grid-options'; -import { SlickPaginationComponent } from './slick-pagination.component'; import { SlickerGridInstance } from '../interfaces/slickerGridInstance.interface'; import { UniversalContainerService } from '../services/universalContainer.service';