From d2c0719573cc61dbe00af61a5748a4b2a2ac204e Mon Sep 17 00:00:00 2001 From: Chau Tran Date: Tue, 3 Oct 2023 22:06:58 -0500 Subject: [PATCH] feat(gestures): port use-gesture Closes #91 - [x] drag - [ ] move - [ ] hover - [ ] scroll - [ ] wheel - [ ] pinch - [ ] multiple --- apps/test-app/src/app/app.component.ts | 4 + apps/test-app/src/app/app.config.ts | 4 + apps/test-app/src/app/drag/drag.component.ts | 64 +++++++++++ apps/test-app/src/styles.css | 17 +++ libs/ngxtension/gestures/README.md | 3 + libs/ngxtension/gestures/ng-package.json | 5 + libs/ngxtension/gestures/project.json | 33 ++++++ libs/ngxtension/gestures/src/drag.ts | 98 ++++++++++++++++ libs/ngxtension/gestures/src/index.ts | 2 + .../gestures/src/zoneless-gesture.ts | 9 ++ .../if-validator/src/if-validator.ts | 4 +- .../ngxtension/intl/src/display-names.pipe.ts | 4 +- libs/ngxtension/intl/src/list-format.pipe.ts | 4 +- libs/ngxtension/intl/src/plural-rules.pipe.ts | 4 +- .../intl/src/relative-time-format.pipe.ts | 4 +- .../intl/src/supportedValuesOf.pipe.ts | 2 +- libs/ngxtension/package.json | 1 + package.json | 1 + pnpm-lock.yaml | 106 +++++------------- tsconfig.base.json | 2 + 20 files changed, 281 insertions(+), 90 deletions(-) create mode 100644 apps/test-app/src/app/drag/drag.component.ts create mode 100644 libs/ngxtension/gestures/README.md create mode 100644 libs/ngxtension/gestures/ng-package.json create mode 100644 libs/ngxtension/gestures/project.json create mode 100644 libs/ngxtension/gestures/src/drag.ts create mode 100644 libs/ngxtension/gestures/src/index.ts create mode 100644 libs/ngxtension/gestures/src/zoneless-gesture.ts diff --git a/apps/test-app/src/app/app.component.ts b/apps/test-app/src/app/app.component.ts index 0633327ae..57c4a53f2 100644 --- a/apps/test-app/src/app/app.component.ts +++ b/apps/test-app/src/app/app.component.ts @@ -24,6 +24,10 @@ import { RouterLink, RouterOutlet } from '@angular/router';
  • Intl
    • + +
  • + Drag Gesture +
    • diff --git a/apps/test-app/src/app/app.config.ts b/apps/test-app/src/app/app.config.ts index 6faab732e..3f841b79a 100644 --- a/apps/test-app/src/app/app.config.ts +++ b/apps/test-app/src/app/app.config.ts @@ -20,6 +20,10 @@ export const appConfig: ApplicationConfig = { path: 'intl', loadComponent: () => import('./intl/intl.component'), }, + { + path: 'drag', + loadComponent: () => import('./drag/drag.component'), + }, ]), ], }; diff --git a/apps/test-app/src/app/drag/drag.component.ts b/apps/test-app/src/app/drag/drag.component.ts new file mode 100644 index 000000000..5c0891899 --- /dev/null +++ b/apps/test-app/src/app/drag/drag.component.ts @@ -0,0 +1,64 @@ +import { Component, signal } from '@angular/core'; +import type { Vector2 } from '@use-gesture/vanilla'; +import { + NgxDrag, + injectDrag, + provideZonelessGesture, + type NgxDragState, +} from 'ngxtension/gestures'; + +@Component({ + selector: 'app-box', + standalone: true, + template: ` + + {{ position() }} + + `, + host: { + class: 'draggable-box pink-draggable-box', + }, +}) +export class Box { + position = signal([0, 0]); + + constructor() { + injectDrag( + ({ target, active, offset: [ox, oy], cdr }) => { + const el = target as HTMLElement; + this.position.set([ox, oy]); + el.style.transform = `translate(${ox}px, ${oy}px)`; + if (!active) { + cdr.detectChanges(); + } + }, + { config: () => ({ from: this.position }) } + ); + } +} + +@Component({ + standalone: true, + imports: [Box, NgxDrag], + template: ` + +
    + `, + providers: [provideZonelessGesture()], +}) +export default class Drag { + position = signal([0, 0]); + + onDrag({ target, active, offset: [ox, oy], cdr }: NgxDragState) { + const el = target as HTMLElement; + this.position.set([ox, oy]); + el.style.transform = `translate(${ox}px, ${oy}px)`; + if (!active) { + cdr.detectChanges(); + } + } +} diff --git a/apps/test-app/src/styles.css b/apps/test-app/src/styles.css index 31682099b..736cdfa95 100644 --- a/apps/test-app/src/styles.css +++ b/apps/test-app/src/styles.css @@ -5,3 +5,20 @@ body { margin: 0; box-sizing: border-box; } + +.draggable-box { + display: block; + position: relative; + width: 100px; + height: 100px; + border-radius: 0.25rem; + touch-action: none; +} + +.pink-draggable-box { + background: hotpink; +} + +.blue-draggable-box { + background: dodgerblue; +} diff --git a/libs/ngxtension/gestures/README.md b/libs/ngxtension/gestures/README.md new file mode 100644 index 000000000..6981400e7 --- /dev/null +++ b/libs/ngxtension/gestures/README.md @@ -0,0 +1,3 @@ +# ngxtension/gestures + +Secondary entry point of `ngxtension`. It can be used by importing from `ngxtension/gestures`. diff --git a/libs/ngxtension/gestures/ng-package.json b/libs/ngxtension/gestures/ng-package.json new file mode 100644 index 000000000..b3e53d699 --- /dev/null +++ b/libs/ngxtension/gestures/ng-package.json @@ -0,0 +1,5 @@ +{ + "lib": { + "entryFile": "src/index.ts" + } +} diff --git a/libs/ngxtension/gestures/project.json b/libs/ngxtension/gestures/project.json new file mode 100644 index 000000000..f011a1cdf --- /dev/null +++ b/libs/ngxtension/gestures/project.json @@ -0,0 +1,33 @@ +{ + "name": "ngxtension/gestures", + "$schema": "../../../node_modules/nx/schemas/project-schema.json", + "projectType": "library", + "sourceRoot": "libs/ngxtension/gestures/src", + "targets": { + "test": { + "executor": "@nx/jest:jest", + "outputs": ["{workspaceRoot}/coverage/{projectRoot}"], + "options": { + "jestConfig": "libs/ngxtension/jest.config.ts", + "testPathPattern": ["gestures"], + "passWithNoTests": true + }, + "configurations": { + "ci": { + "ci": true, + "codeCoverage": true + } + } + }, + "lint": { + "executor": "@nx/linter:eslint", + "outputs": ["{options.outputFile}"], + "options": { + "lintFilePatterns": [ + "libs/ngxtension/gestures/**/*.ts", + "libs/ngxtension/gestures/**/*.html" + ] + } + } + } +} diff --git a/libs/ngxtension/gestures/src/drag.ts b/libs/ngxtension/gestures/src/drag.ts new file mode 100644 index 000000000..94dc34060 --- /dev/null +++ b/libs/ngxtension/gestures/src/drag.ts @@ -0,0 +1,98 @@ +import { + ChangeDetectorRef, + DestroyRef, + Directive, + ElementRef, + EventEmitter, + Injector, + Input, + NgZone, + Output, + effect, + inject, + runInInjectionContext, + signal, + type OnInit, +} from '@angular/core'; +import { + DragGesture, + type DragConfig, + type DragState, + type EventTypes, + type Handler, +} from '@use-gesture/vanilla'; +import { assertInjector } from 'ngxtension/assert-injector'; +import { injectZonelessGesture } from './zoneless-gesture'; + +type DragHandler = Handler<'drag', EventTypes['drag']>; +export type NgxDragState = Parameters[0] & { + cdr: ChangeDetectorRef; +}; +type NgxDragHandler = (state: NgxDragState) => ReturnType; + +export function injectDrag( + handler: NgxDragHandler, + { + injector, + zoneless, + config = () => ({}), + }: { injector?: Injector; zoneless?: boolean; config?: () => DragConfig } = {} +) { + injector = assertInjector(injectDrag, injector); + return runInInjectionContext(injector, () => { + const zonelessGesture = injectZonelessGesture(); + const host = inject(ElementRef) as ElementRef; + const zone = inject(NgZone); + const cdr = inject(ChangeDetectorRef); + + zoneless ??= zonelessGesture; + + const ngHandler = (state: DragState) => { + Object.assign(state, { cdr }); + return handler(state as NgxDragState); + }; + + let dragGesture: DragGesture; + + dragGesture = zoneless + ? zone.runOutsideAngular( + () => new DragGesture(host.nativeElement, ngHandler) + ) + : new DragGesture(host.nativeElement, ngHandler); + + effect(() => { + if (zoneless) { + zone.runOutsideAngular(() => { + dragGesture.setConfig(config()); + }); + } else { + dragGesture.setConfig(config()); + } + }); + + inject(DestroyRef).onDestroy(dragGesture.destroy.bind(dragGesture)); + }); +} + +@Directive({ + selector: '[ngxDrag]', + standalone: true, +}) +export class NgxDrag implements OnInit { + private config = signal({}); + @Input('ngxDragConfig') set _config(config: DragConfig) { + this.config.set(config); + } + @Input('ngxDragZoneless') zoneless?: boolean; + @Output() ngxDrag = new EventEmitter(); + + private injector = inject(Injector); + + ngOnInit(): void { + injectDrag(this.ngxDrag.emit.bind(this.ngxDrag), { + injector: this.injector, + zoneless: this.zoneless, + config: this.config, + }); + } +} diff --git a/libs/ngxtension/gestures/src/index.ts b/libs/ngxtension/gestures/src/index.ts new file mode 100644 index 000000000..e72297f6a --- /dev/null +++ b/libs/ngxtension/gestures/src/index.ts @@ -0,0 +1,2 @@ +export * from './drag'; +export * from './zoneless-gesture'; diff --git a/libs/ngxtension/gestures/src/zoneless-gesture.ts b/libs/ngxtension/gestures/src/zoneless-gesture.ts new file mode 100644 index 000000000..4400ceefa --- /dev/null +++ b/libs/ngxtension/gestures/src/zoneless-gesture.ts @@ -0,0 +1,9 @@ +import { createInjectionToken } from 'ngxtension/create-injection-token'; + +const [injectZonelessGesture, provideFn] = createInjectionToken(() => false); + +function provideZonelessGesture() { + return provideFn(true); +} + +export { injectZonelessGesture, provideZonelessGesture }; diff --git a/libs/ngxtension/if-validator/src/if-validator.ts b/libs/ngxtension/if-validator/src/if-validator.ts index 67f853727..cc3633c39 100644 --- a/libs/ngxtension/if-validator/src/if-validator.ts +++ b/libs/ngxtension/if-validator/src/if-validator.ts @@ -1,9 +1,9 @@ import { AbstractControl, - AsyncValidatorFn, FormControl, - ValidatorFn, Validators, + type AsyncValidatorFn, + type ValidatorFn, } from '@angular/forms'; import { of } from 'rxjs'; diff --git a/libs/ngxtension/intl/src/display-names.pipe.ts b/libs/ngxtension/intl/src/display-names.pipe.ts index b45b39a92..0130fa048 100644 --- a/libs/ngxtension/intl/src/display-names.pipe.ts +++ b/libs/ngxtension/intl/src/display-names.pipe.ts @@ -2,8 +2,8 @@ import { inject, LOCALE_ID, Pipe, - PipeTransform, - Provider, + type PipeTransform, + type Provider, } from '@angular/core'; import { createInjectionToken } from 'ngxtension/create-injection-token'; diff --git a/libs/ngxtension/intl/src/list-format.pipe.ts b/libs/ngxtension/intl/src/list-format.pipe.ts index 0fddbe759..752c089d8 100644 --- a/libs/ngxtension/intl/src/list-format.pipe.ts +++ b/libs/ngxtension/intl/src/list-format.pipe.ts @@ -2,8 +2,8 @@ import { inject, LOCALE_ID, Pipe, - PipeTransform, - Provider, + type PipeTransform, + type Provider, } from '@angular/core'; import { createInjectionToken } from 'ngxtension/create-injection-token'; diff --git a/libs/ngxtension/intl/src/plural-rules.pipe.ts b/libs/ngxtension/intl/src/plural-rules.pipe.ts index 4113dbb1a..5c2848b9f 100644 --- a/libs/ngxtension/intl/src/plural-rules.pipe.ts +++ b/libs/ngxtension/intl/src/plural-rules.pipe.ts @@ -2,8 +2,8 @@ import { inject, LOCALE_ID, Pipe, - PipeTransform, - Provider, + type PipeTransform, + type Provider, } from '@angular/core'; import { createInjectionToken } from 'ngxtension/create-injection-token'; diff --git a/libs/ngxtension/intl/src/relative-time-format.pipe.ts b/libs/ngxtension/intl/src/relative-time-format.pipe.ts index 2ac85b731..7765f4a83 100644 --- a/libs/ngxtension/intl/src/relative-time-format.pipe.ts +++ b/libs/ngxtension/intl/src/relative-time-format.pipe.ts @@ -2,8 +2,8 @@ import { inject, LOCALE_ID, Pipe, - PipeTransform, - Provider, + type PipeTransform, + type Provider, } from '@angular/core'; import { createInjectionToken } from 'ngxtension/create-injection-token'; diff --git a/libs/ngxtension/intl/src/supportedValuesOf.pipe.ts b/libs/ngxtension/intl/src/supportedValuesOf.pipe.ts index 8e3c1dcde..eb8fa9c47 100644 --- a/libs/ngxtension/intl/src/supportedValuesOf.pipe.ts +++ b/libs/ngxtension/intl/src/supportedValuesOf.pipe.ts @@ -1,4 +1,4 @@ -import { Pipe, PipeTransform } from '@angular/core'; +import { Pipe, type PipeTransform } from '@angular/core'; /** * This pipe is a wrapper around the [Intl.supportedValuesOf](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/supportedValuesOf) method. diff --git a/libs/ngxtension/package.json b/libs/ngxtension/package.json index 06422d7fd..abd6f2ace 100644 --- a/libs/ngxtension/package.json +++ b/libs/ngxtension/package.json @@ -20,6 +20,7 @@ "peerDependencies": { "@angular/common": "^16.0.0", "@angular/core": "^16.0.0", + "@use-gesture/vanilla": "^10.0.0", "rxjs": "^6.0.0 || ^7.0.0" }, "dependencies": { diff --git a/package.json b/package.json index 09454a862..f1412c9dd 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,7 @@ "@angular/platform-browser-dynamic": "~16.2.7", "@angular/router": "~16.2.7", "@swc/helpers": "0.5.2", + "@use-gesture/vanilla": "^10.3.0", "rxjs": "~7.8.1", "tslib": "^2.6.2", "zone.js": "~0.13.3" diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 347f5a4f2..2a5adb7f5 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -35,6 +35,9 @@ dependencies: '@swc/helpers': specifier: 0.5.2 version: 0.5.2 + '@use-gesture/vanilla': + specifier: ^10.3.0 + version: 10.3.0 rxjs: specifier: ~7.8.1 version: 7.8.1 @@ -4566,7 +4569,7 @@ packages: rxjs: 7.8.1 semver: 7.5.3 tslib: 2.6.2 - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) webpack-merge: 5.9.0 transitivePeerDependencies: - '@babel/traverse' @@ -4963,11 +4966,11 @@ packages: style-loader: 3.3.3(webpack@5.88.2) stylus: 0.59.0 stylus-loader: 7.1.3(stylus@0.59.0)(webpack@5.88.2) - terser-webpack-plugin: 5.3.9(@swc/core@1.3.91)(webpack@5.88.2) + terser-webpack-plugin: 5.3.9(@swc/core@1.3.91)(esbuild@0.18.17)(webpack@5.88.2) ts-loader: 9.4.4(typescript@5.1.6)(webpack@5.88.2) tsconfig-paths-webpack-plugin: 4.0.0 tslib: 2.6.2 - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) webpack-dev-server: 4.15.1(webpack@5.88.2) webpack-node-externals: 3.0.0 webpack-subresource-integrity: 5.1.0(webpack@5.88.2) @@ -6076,6 +6079,16 @@ packages: eslint-visitor-keys: 3.4.3 dev: true + /@use-gesture/core@10.3.0: + resolution: {integrity: sha512-rh+6MND31zfHcy9VU3dOZCqGY511lvGcfyJenN4cWZe0u1BH6brBpBddLVXhF2r4BMqWbvxfsbL7D287thJU2A==} + dev: false + + /@use-gesture/vanilla@10.3.0: + resolution: {integrity: sha512-hehZWLaNyNc+TWAbhJpj84yumD8ZBp/eet6HGg3xztPcchuNNTGEu5LEEdSg69SXHzS7exWE6j5VnsZ3VXVFxQ==} + dependencies: + '@use-gesture/core': 10.3.0 + dev: false + /@vitejs/plugin-basic-ssl@1.0.1(vite@4.4.7): resolution: {integrity: sha512-pcub+YbFtFhaGRTo1832FQHQSHvMrlb43974e2eS8EKleR3p1cDdkJFPci1UhwkEf1J9Bz+wKBSzqpKp7nNj2A==} engines: {node: '>=14.6.0'} @@ -6742,7 +6755,7 @@ packages: '@babel/core': 7.22.17 find-cache-dir: 4.0.0 schema-utils: 4.2.0 - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true /babel-loader@9.1.3(@babel/core@7.22.9)(webpack@5.88.2): @@ -7815,7 +7828,7 @@ packages: normalize-path: 3.0.0 schema-utils: 4.2.0 serialize-javascript: 6.0.1 - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true /copy-webpack-plugin@11.0.0(webpack@5.88.2): @@ -8044,7 +8057,7 @@ packages: postcss: 8.4.31 schema-utils: 4.2.0 serialize-javascript: 6.0.1 - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true /css-prefers-color-scheme@9.0.0(postcss@8.4.31): @@ -9509,7 +9522,7 @@ packages: semver: 7.5.4 tapable: 2.2.1 typescript: 5.1.6 - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true /form-data-encoder@2.1.4: @@ -12152,7 +12165,7 @@ packages: webpack: ^5.0.0 dependencies: schema-utils: 4.2.0 - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true /mini-css-extract-plugin@2.7.6(webpack@5.88.2): @@ -13568,7 +13581,7 @@ packages: klona: 2.0.6 postcss: 8.4.31 semver: 7.5.4 - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true /postcss-loader@7.3.3(postcss@8.4.27)(typescript@5.1.6)(webpack@5.88.2): @@ -14722,7 +14735,7 @@ packages: klona: 2.0.6 neo-async: 2.6.2 sass: 1.66.1 - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true /sass-loader@13.3.2(sass@1.64.1)(webpack@5.88.2): @@ -15119,7 +15132,7 @@ packages: abab: 2.0.6 iconv-lite: 0.6.3 source-map-js: 1.0.2 - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true /source-map-loader@4.0.1(webpack@5.88.2): @@ -15426,7 +15439,7 @@ packages: peerDependencies: webpack: ^5.0.0 dependencies: - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true /stylehacks@6.0.0(postcss@8.4.31): @@ -15450,7 +15463,7 @@ packages: fast-glob: 3.3.1 normalize-path: 3.0.0 stylus: 0.59.0 - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true /stylus@0.59.0: @@ -15580,31 +15593,6 @@ packages: webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true - /terser-webpack-plugin@5.3.9(@swc/core@1.3.91)(webpack@5.88.2): - resolution: {integrity: sha512-ZuXsqE07EcggTWQjXUj+Aot/OMcD0bMKGgF63f7UxYcu5/AJF53aIpK1YoP5xR9l6s/Hy2b+t1AM0bLNPRuhwA==} - engines: {node: '>= 10.13.0'} - peerDependencies: - '@swc/core': '*' - esbuild: '*' - uglify-js: '*' - webpack: ^5.1.0 - peerDependenciesMeta: - '@swc/core': - optional: true - esbuild: - optional: true - uglify-js: - optional: true - dependencies: - '@jridgewell/trace-mapping': 0.3.19 - '@swc/core': 1.3.91(@swc/helpers@0.5.2) - jest-worker: 27.5.1 - schema-utils: 3.3.0 - serialize-javascript: 6.0.1 - terser: 5.19.2 - webpack: 5.88.2(@swc/core@1.3.91) - dev: true - /terser@5.19.2: resolution: {integrity: sha512-qC5+dmecKJA4cpYxRa5aVkKehYsQKc+AHeKl0Oe62aYjBL8ZA33tTljktDHJSaxxMnbI5ZYw+o/S2DxxLu8OfA==} engines: {node: '>=10'} @@ -15790,7 +15778,7 @@ packages: micromatch: 4.0.5 semver: 7.5.4 typescript: 5.1.6 - webpack: 5.88.2(@swc/core@1.3.91) + webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true /ts-node@10.9.1(@swc/core@1.3.91)(@types/node@20.8.0)(typescript@5.1.6): @@ -16427,46 +16415,6 @@ packages: webpack: 5.88.2(@swc/core@1.3.91)(esbuild@0.18.17) dev: true - /webpack@5.88.2(@swc/core@1.3.91): - resolution: {integrity: sha512-JmcgNZ1iKj+aiR0OvTYtWQqJwq37Pf683dY9bVORwVbUrDhLhdn/PlO2sHsFHPkj7sHNQF3JwaAkp49V+Sq1tQ==} - engines: {node: '>=10.13.0'} - hasBin: true - peerDependencies: - webpack-cli: '*' - peerDependenciesMeta: - webpack-cli: - optional: true - dependencies: - '@types/eslint-scope': 3.7.4 - '@types/estree': 1.0.1 - '@webassemblyjs/ast': 1.11.6 - '@webassemblyjs/wasm-edit': 1.11.6 - '@webassemblyjs/wasm-parser': 1.11.6 - acorn: 8.10.0 - acorn-import-assertions: 1.9.0(acorn@8.10.0) - browserslist: 4.21.10 - chrome-trace-event: 1.0.3 - enhanced-resolve: 5.15.0 - es-module-lexer: 1.3.0 - eslint-scope: 5.1.1 - events: 3.3.0 - glob-to-regexp: 0.4.1 - graceful-fs: 4.2.11 - json-parse-even-better-errors: 2.3.1 - loader-runner: 4.3.0 - mime-types: 2.1.35 - neo-async: 2.6.2 - schema-utils: 3.3.0 - tapable: 2.2.1 - terser-webpack-plugin: 5.3.9(@swc/core@1.3.91)(webpack@5.88.2) - watchpack: 2.4.0 - webpack-sources: 3.2.3 - transitivePeerDependencies: - - '@swc/core' - - esbuild - - uglify-js - dev: true - /webpack@5.88.2(@swc/core@1.3.91)(esbuild@0.18.17): resolution: {integrity: sha512-JmcgNZ1iKj+aiR0OvTYtWQqJwq37Pf683dY9bVORwVbUrDhLhdn/PlO2sHsFHPkj7sHNQF3JwaAkp49V+Sq1tQ==} engines: {node: '>=10.13.0'} diff --git a/tsconfig.base.json b/tsconfig.base.json index 6dade6685..04dfa6e5d 100644 --- a/tsconfig.base.json +++ b/tsconfig.base.json @@ -7,6 +7,7 @@ "moduleResolution": "node", "emitDecoratorMetadata": true, "experimentalDecorators": true, + "verbatimModuleSyntax": true, "importHelpers": true, "target": "es2015", "module": "esnext", @@ -33,6 +34,7 @@ ], "ngxtension/filter-array": ["libs/ngxtension/filter-array/src/index.ts"], "ngxtension/filter-nil": ["libs/ngxtension/filter-nil/src/index.ts"], + "ngxtension/gestures": ["libs/ngxtension/gestures/src/index.ts"], "ngxtension/if-validator": ["libs/ngxtension/if-validator/src/index.ts"], "ngxtension/inject-destroy": [ "libs/ngxtension/inject-destroy/src/index.ts"