mirrors/OverlayScrollbars
2
0
Fork 0
mirror of https://github.com/tenrok/OverlayScrollbars.git synced 2026-05-30 18:34:08 +03:00
Code Issues Packages Projects Releases Wiki Activity

improve overlayscrollbars-react and repo setup

Browse Source
This commit is contained in:
Rene Haas
2022-10-28 22:04:44 +02:00
parent 373bc03824
commit 568d5cfcd6
13 changed files with 99 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+37 -5
View File
@@ -58,8 +58,6 @@
"prettier": "^2.6.2",
"rollup": "^2.75.5",
"rollup-plugin-esbuild-resolve": "^1.0.0",
"rollup-plugin-summary": "^1.4.3",
"rollup-plugin-terser": "^7.0.2",
"should": "^13.2.3",
"tslib": "^2.4.0",
"typescript": "^4.7.4",
@@ -29888,7 +29886,11 @@
},
"packages/overlayscrollbars": {
"version": "2.0.0-beta.3",
"license": "MIT"
"license": "MIT",
"devDependencies": {
"rollup-plugin-summary": "^1.4.3",
"rollup-plugin-terser": "^7.0.2"
}
},
"packages/overlayscrollbars-ngx": {
"version": "0.4.0",
@@ -29916,13 +29918,15 @@
"karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "~2.0.0",
"ng-packagr": "^12.0.0",
"overlayscrollbars": "file:./../overlayscrollbars/dist",
"rxjs": "~6.6.0",
"typescript": "~4.3.5",
"zone.js": "~0.11.4"
},
"peerDependencies": {
"@angular/common": ">=12.0.0",
"@angular/core": ">=12.0.0"
"@angular/core": ">=12.0.0",
"overlayscrollbars": "^2.0.0"
}
},
"packages/overlayscrollbars-ngx/node_modules/@ampproject/remapping": {
@@ -31105,6 +31109,10 @@
"node": ">= 6"
}
},
"packages/overlayscrollbars-ngx/node_modules/overlayscrollbars": {
"resolved": "packages/overlayscrollbars/dist",
"link": true
},
"packages/overlayscrollbars-ngx/node_modules/postcss": {
"version": "8.3.6",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.6.tgz",
@@ -31426,11 +31434,13 @@
"@types/react": "^18.0.21",
"@types/react-dom": "^18.0.6",
"@vitejs/plugin-react": "^2.1.0",
"overlayscrollbars": "file:./../overlayscrollbars/dist",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"typescript": "^4.8.4"
},
"peerDependencies": {
"overlayscrollbars": "^2.0.0",
"react": ">=16.4.0"
}
},
@@ -31440,6 +31450,10 @@
"integrity": "sha512-JkRpuVz3xCNCWaeQ5EHLR/6woMbHZz/jZ7Kmc63AkU+1HxnoUugzSWMck7dsR4DvNYX8jp9wTi9K7WvnxOIQZQ==",
"dev": true
},
"packages/overlayscrollbars-react/node_modules/overlayscrollbars": {
"resolved": "packages/overlayscrollbars/dist",
"link": true
},
"packages/overlayscrollbars-svelte": {
"version": "0.4.0",
"devDependencies": {
@@ -31666,6 +31680,12 @@
"node": ">=4.2.0"
}
},
"packages/overlayscrollbars/dist": {
"name": "overlayscrollbars",
"version": "2.0.0-beta.3",
"dev": true,
"license": "MIT"
},
"packages/test": {
"name": "node-starter",
"version": "0.0.0",
@@ -47009,7 +47029,11 @@
"dev": true
},
"overlayscrollbars": {
"version": "file:packages/overlayscrollbars"
"version": "file:packages/overlayscrollbars",
"requires": {
"rollup-plugin-summary": "^1.4.3",
"rollup-plugin-terser": "^7.0.2"
}
},
"overlayscrollbars-ngx": {
"version": "file:packages/overlayscrollbars-ngx",
@@ -47034,6 +47058,7 @@
"karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "~2.0.0",
"ng-packagr": "^12.0.0",
"overlayscrollbars": "file:../overlayscrollbars/dist",
"rxjs": "~6.6.0",
"tslib": "^2.4.0",
"typescript": "~4.3.5",
@@ -47896,6 +47921,9 @@
"optional": true,
"peer": true
},
"overlayscrollbars": {
"version": "file:packages/overlayscrollbars/dist"
},
"postcss": {
"version": "8.3.6",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.6.tgz",
@@ -48127,6 +48155,7 @@
"@types/react": "^18.0.21",
"@types/react-dom": "^18.0.6",
"@vitejs/plugin-react": "^2.1.0",
"overlayscrollbars": "file:../overlayscrollbars/dist",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"typescript": "^4.8.4"
@@ -48137,6 +48166,9 @@
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.68.tgz",
"integrity": "sha512-JkRpuVz3xCNCWaeQ5EHLR/6woMbHZz/jZ7Kmc63AkU+1HxnoUugzSWMck7dsR4DvNYX8jp9wTi9K7WvnxOIQZQ==",
"dev": true
},
"overlayscrollbars": {
"version": "file:packages/overlayscrollbars/dist"
}
}
},
package.json
-2
View File
@@ -54,8 +54,6 @@
"prettier": "^2.6.2",
"rollup": "^2.75.5",
"rollup-plugin-esbuild-resolve": "^1.0.0",
"rollup-plugin-summary": "^1.4.3",
"rollup-plugin-terser": "^7.0.2",
"should": "^13.2.3",
"tslib": "^2.4.0",
"typescript": "^4.7.4",
packages/overlayscrollbars-ngx/ng-package.json
+4 -1
View File
@@ -2,6 +2,9 @@
"$schema": "./node_modules/ng-packagr/ng-package.schema.json",
"dest": "./dist",
"lib": {
"entryFile": "src/public-api.ts"
"entryFile": "src/public-api.ts",
"umdModuleIds": {
"overlayscrollbars": "OverlayScrollbarsGlobal"
}
}
}
packages/overlayscrollbars-ngx/package.json
+3 -1
View File
@@ -4,7 +4,8 @@
"private": true,
"peerDependencies": {
"@angular/common": ">=12.0.0",
"@angular/core": ">=12.0.0"
"@angular/core": ">=12.0.0",
"overlayscrollbars": "^2.0.0"
},
"devDependencies": {
"@angular-devkit/build-angular": "^12.0.0",
@@ -27,6 +28,7 @@
"karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "~2.0.0",
"ng-packagr": "^12.0.0",
"overlayscrollbars": "file:./../overlayscrollbars/dist",
"rxjs": "~6.6.0",
"typescript": "~4.3.5",
"zone.js": "~0.11.4"
packages/overlayscrollbars-ngx/src/overlayscrollbars.component.ts
+3
View File
@@ -1,6 +1,9 @@
import { Component } from '@angular/core';
import { OverlayScrollbars } from 'overlayscrollbars';
import type { OnInit } from '@angular/core';
console.log(OverlayScrollbars);
@Component({
selector: 'overlay-scrollbars',
template: ` <p>overlayscrollbars-ngx works!</p> `,
packages/overlayscrollbars-ngx/src/public-api.ts
-4
View File
@@ -1,7 +1,3 @@
/*
* Public API Surface of overlayscrollbars
*/
export * from './overlayscrollbars.service';
export * from './overlayscrollbars.component';
export * from './overlayscrollbars.module';
packages/overlayscrollbars-react/package.json
+3 -2
View File
@@ -3,7 +3,6 @@
"private": true,
"version": "0.4.0",
"files": [
"src",
"dist",
"README.md"
],
@@ -11,7 +10,8 @@
"module": "./dist/overlayscrollbars-react.es.js",
"types": "./dist/overlayscrollbars-react.d.ts",
"peerDependencies": {
"react": ">=16.4.0"
"react": ">=16.4.0",
"overlayscrollbars": "^2.0.0"
},
"devDependencies": {
"@testing-library/react": "^13.4.0",
@@ -19,6 +19,7 @@
"@types/react": "^18.0.21",
"@types/react-dom": "^18.0.6",
"@vitejs/plugin-react": "^2.1.0",
"overlayscrollbars": "file:./../overlayscrollbars/dist",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"typescript": "^4.8.4"
packages/overlayscrollbars-react/src/OverlayScrollbarsComponent.tsx
+1 -1
View File
@@ -28,7 +28,7 @@ const OverlayScrollbarsComponent = <T extends keyof JSX.IntrinsicElements>(
useEffect(() => {
const { current: target } = osTargetRef;
if (target) {
const instance = OverlayScrollbars(target as any, options || {});
const instance = OverlayScrollbars(target as any, options || {}, events);
osInstanceRef.current = instance;
return () => instance.destroy();
packages/overlayscrollbars-react/test/OverlayScrollbarsComponent.test.tsx
+36 -2
View File
@@ -1,9 +1,9 @@
import { describe, test, expect } from 'vitest';
import { describe, test, expect, vitest } from 'vitest';
import { render, screen } from '@testing-library/react';
import { OverlayScrollbars } from 'overlayscrollbars';
import { OverlayScrollbarsComponent } from '~/overlayscrollbars-react';
import type { OverlayScrollbarsComponentRef } from '~/overlayscrollbars-react';
import type { RefObject } from 'react';
import type { OverlayScrollbarsComponentRef } from '~/overlayscrollbars-react';
describe('OverlayScrollbarsComponent', () => {
describe('correct rendering', () => {
@@ -88,4 +88,38 @@ describe('OverlayScrollbarsComponent', () => {
expect(newOpts.overflow.y).toBe('scroll'); //switches back to default because its not specified in the new options
expect(newOpts.overflow.x).toBe('hidden');
});
test('events', () => {
const ref: RefObject<OverlayScrollbarsComponentRef> = { current: null };
const onUpdatedInitial = vitest.fn();
const onUpdated = vitest.fn();
const { rerender } = render(
<OverlayScrollbarsComponent events={{ updated: onUpdatedInitial }} ref={ref} />
);
expect(onUpdatedInitial).toHaveBeenCalledTimes(1);
rerender(<OverlayScrollbarsComponent events={{ updated: onUpdated }} ref={ref} />);
expect(onUpdated).not.toHaveBeenCalled();
ref.current?.osInstance()?.update(true);
expect(onUpdatedInitial).toHaveBeenCalledTimes(1);
expect(onUpdated).toHaveBeenCalledTimes(1);
rerender(
<OverlayScrollbarsComponent events={{ updated: [onUpdated, onUpdatedInitial] }} ref={ref} />
);
ref.current?.osInstance()?.update(true);
expect(onUpdatedInitial).toHaveBeenCalledTimes(2);
expect(onUpdated).toHaveBeenCalledTimes(2);
// unregister works with `[]`, `null` or `undefined`
rerender(<OverlayScrollbarsComponent events={{ updated: null }} ref={ref} />);
ref.current?.osInstance()?.update(true);
expect(onUpdatedInitial).toHaveBeenCalledTimes(2);
expect(onUpdated).toHaveBeenCalledTimes(2);
});
});
packages/overlayscrollbars-react/vite.config.js
+2 -1
View File
@@ -13,10 +13,11 @@ export default defineConfig({
fileName: (format) => `overlayscrollbars-react.${format}.js`,
},
rollupOptions: {
external: ['react'],
external: ['react', 'overlayscrollbars'],
output: {
globals: {
react: 'React',
overlayscrollbars: 'OverlayScrollbarsGlobal',
},
},
},
packages/overlayscrollbars/package.json
+4
View File
@@ -41,6 +41,10 @@
"./overlayscrollbars.scss": "./src/index.scss"
},
"sideEffects": ["*.css", "*.scss", "*.sass"],
"devDependencies": {
"rollup-plugin-summary": "^1.4.3",
"rollup-plugin-terser": "^7.0.2"
},
"scripts": {
"build": "rollup -c",
"test": "jest --coverage",
packages/overlayscrollbars/rollup.config.js
+1 -1
View File
@@ -33,7 +33,7 @@ module.exports = createRollupConfig({
keywords,
main: 'overlayscrollbars.cjs.js',
module: 'overlayscrollbars.esm.js',
types: 'overlayscrollbars.d.ts',
types: 'types/overlayscrollbars.d.ts',
exports: {
'.': {
require: './overlayscrollbars.cjs',
packages/overlayscrollbars/src/support/eventListeners.ts
+5 -4
View File
@@ -1,4 +1,4 @@
import { isArray, isString } from '~/support/utils/types';
import { isArray, isFunction, isString } from '~/support/utils/types';
import { keys } from '~/support/utils/object';
import { each, push, from, isEmptyArray, runEachAndClear } from '~/support/utils/array';
@@ -7,7 +7,7 @@ export type EventListener<EventMap extends Record<string, any[]>, N extends keyo
) => void;
export type EventListeners<EventMap extends Record<string, any[]>> = {
[K in keyof EventMap]?: EventListener<EventMap, K> | EventListener<EventMap, K>[];
[K in keyof EventMap]?: EventListener<EventMap, K> | EventListener<EventMap, K>[] | null;
};
export type RemoveEvent<EventMap extends Record<string, any[]>> = {
@@ -73,7 +73,7 @@ export const createEventListenerHub = <EventMap extends Record<string, any[]>>(
events.set(nameOrEventListeners, eventSet);
manageListener((currListener) => {
currListener && eventSet.add(currListener);
isFunction(currListener) && eventSet.add(currListener);
}, listener as any);
return removeEvent.bind(0, nameOrEventListeners as any, listener as any);
@@ -82,7 +82,8 @@ export const createEventListenerHub = <EventMap extends Record<string, any[]>>(
const eventListenerKeys = keys(nameOrEventListeners) as (keyof EventListeners<EventMap>)[];
const offFns: (() => void)[] = [];
each(eventListenerKeys, (key) => {
push(offFns, addEvent(key, (nameOrEventListeners as EventListeners<EventMap>)[key]));
const eventListener = (nameOrEventListeners as EventListeners<EventMap>)[key];
eventListener && push(offFns, addEvent(key, eventListener));
});
return runEachAndClear.bind(0, offFns);