diff --git a/packages/overlayscrollbars-react/README.md b/packages/overlayscrollbars-react/README.md index 400198b..4e7b288 100644 --- a/packages/overlayscrollbars-react/README.md +++ b/packages/overlayscrollbars-react/README.md @@ -3,7 +3,7 @@ OverlayScrollbars

- React + React OverlayScrollbars Downloads License @@ -20,77 +20,98 @@
## Installation + ```sh npm install overlayscrollbars-react ``` ## Peer Dependencies + OverlayScrollbars for React has the following **peer dependencies**: -- The vanilla JavaScript library: [overlayscrollbars](https://www.npmjs.com/package/overlayscrollbars) + +- The vanilla JavaScript library: [overlayscrollbars](https://www.npmjs.com/package/overlayscrollbars) + ``` npm install overlayscrollbars ``` + - The React framework: [react](https://www.npmjs.com/package/react) + ``` npm install react ``` ## TypeScript + - In case you are using TypeScript, you have to install the [OverlayScrollbars typings](https://www.npmjs.com/package/@types/overlayscrollbars): + ``` npm install @types/overlayscrollbars ``` + Since this wrapper is written in TypeScript it comes with its generated typings.
Check out the [recommended](https://github.com/KingSora/OverlayScrollbars#typescript) **tsconfig.json** options. ## Usage + #### CSS + You have to import the `OverlayScrollbars.css` by yourself.
The component **doesn't** do it for you as the styles are **global styles**!
There are different ways to achieve this, in React the most simple way for me was to add [this line](https://github.com/KingSora/OverlayScrollbars/blob/master/packages/overlayscrollbars-react/example/src/index.tsx#L1) in the `index` file: + ```js -import 'overlayscrollbars/css/OverlayScrollbars.css'; +import "overlayscrollbars/css/OverlayScrollbars.css"; ``` #### Import + Simply import the component into your file(s): + ```js -import { OverlayScrollbarsComponent } from 'overlayscrollbars-react'; +import { OverlayScrollbarsComponent } from "overlayscrollbars-react"; ``` #### Template + After the import you can use it in JSX: + ```jsx - - example content - +example content ``` #### Properties + Two properties are accepted: `options` and `extensions`. + - The `options` property accepts a `object` and can be changed at any point in time, and the plugin will adapt. - The `extensions` property accepts a `string`, `string array` or `object` and is only taken into account if the component gets mounted. ```jsx - + options={{ scrollbars: { autoHide: "scroll" } }} + extensions={["extensionA", "extensionB"]} +> ``` + You can read more about the `options` object [here](https://kingsora.github.io/OverlayScrollbars/#!documentation/options), `extensions` are documented [here](https://kingsora.github.io/OverlayScrollbars/#!documentation/extensions-basics) and [here](https://kingsora.github.io/OverlayScrollbars/#!documentation/initialization). #### Instance + If you get the component reference, it provides two methods: `osInstance()` and `osTarget()`. + - The `osInstance()` method returns the OverlayScrollbars `instance` of the component, or `null` if the instance isn't initialized yet or already destroyed. - The `osTarget()` method returns the native `html` element to which the plugin was initialized, or `null` if the the component isn't mounted yet or already unmounted. ## Example App + In case you need a example app for reference, you can use the example app in this repo(`example folder`): + - [Live example](https://kingsora.github.io/OverlayScrollbars/frameworks/react/) - [Source code](https://github.com/KingSora/OverlayScrollbars/tree/master/packages/overlayscrollbars-react/example) If you wanna build the example app, run these commands: + ```sh npm run setup npm run build @@ -99,4 +120,4 @@ npm run example ## License -MIT \ No newline at end of file +MIT diff --git a/packages/overlayscrollbars-react/dist/overlayscrollbars-react.esm.js.map b/packages/overlayscrollbars-react/dist/overlayscrollbars-react.esm.js.map index f14a69e..4fb183a 100644 --- a/packages/overlayscrollbars-react/dist/overlayscrollbars-react.esm.js.map +++ b/packages/overlayscrollbars-react/dist/overlayscrollbars-react.esm.js.map @@ -1 +1 @@ -{"version":3,"file":"overlayscrollbars-react.esm.js","sources":["../src/OverlayScrollbarsComponent.tsx"],"sourcesContent":["import React, { Component, RefObject } from 'react';\nimport OverlayScrollbars from \"overlayscrollbars\";\n\nexport interface OverlayScrollbarsComponentProps extends React.HTMLAttributes {\n children?: any;\n options?: OverlayScrollbars.Options;\n extensions?: OverlayScrollbars.Extensions;\n}\nexport interface OverlayScrollbarsComponentState { }\n\nexport class OverlayScrollbarsComponent extends Component {\n private _osInstance: OverlayScrollbars | null = null;\n private _osTargetRef: RefObject;\n\n constructor(props: OverlayScrollbarsComponentProps) {\n super(props);\n this._osTargetRef = React.createRef();\n }\n\n osInstance(): OverlayScrollbars | null {\n return this._osInstance;\n }\n\n osTarget(): HTMLDivElement | null {\n return this._osTargetRef.current || null;\n }\n\n componentDidMount() {\n this._osInstance = OverlayScrollbars(this.osTarget(), this.props.options || {}, this.props.extensions);\n mergeHostClassNames(this._osInstance, this.props.className);\n }\n\n componentWillUnmount() {\n if (OverlayScrollbars.valid(this._osInstance)) {\n this._osInstance.destroy();\n this._osInstance = null;\n }\n }\n\n componentDidUpdate(prevProps: OverlayScrollbarsComponentProps) {\n if (OverlayScrollbars.valid(this._osInstance)) {\n this._osInstance.options(this.props.options);\n\n if (prevProps.className !== this.props.className) {\n mergeHostClassNames(this._osInstance, this.props.className);\n }\n }\n }\n\n render() {\n const {\n options,\n extensions,\n children,\n className,\n ...divProps\n } = this.props;\n\n return (\n
\n
\n
\n
\n
\n {this.props.children}\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n );\n }\n}\n\nfunction mergeHostClassNames(osInstance: OverlayScrollbars, className: string) {\n if (OverlayScrollbars.valid(osInstance)) {\n const { host } = osInstance.getElements();\n const regex = new RegExp(`(^os-host([-_].+|)$)|${osInstance.options().className.replace(/\\s/g, \"$|\")}$`, 'g');\n const osClassNames = host.className.split(' ')\n .filter(name => name.match(regex))\n .join(' ');\n\n host.className = `${osClassNames} ${className || ''}`;\n }\n}"],"names":[],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"overlayscrollbars-react.esm.js","sources":["../src/OverlayScrollbarsComponent.tsx"],"sourcesContent":["import React, { Component, RefObject } from 'react';\r\nimport OverlayScrollbars from \"overlayscrollbars\";\r\n\r\nexport interface OverlayScrollbarsComponentProps extends React.HTMLAttributes {\r\n children?: any;\r\n options?: OverlayScrollbars.Options;\r\n extensions?: OverlayScrollbars.Extensions;\r\n}\r\nexport interface OverlayScrollbarsComponentState { }\r\n\r\nexport class OverlayScrollbarsComponent extends Component {\r\n private _osInstance: OverlayScrollbars | null = null;\r\n private _osTargetRef: RefObject;\r\n\r\n constructor(props: OverlayScrollbarsComponentProps) {\r\n super(props);\r\n this._osTargetRef = React.createRef();\r\n }\r\n\r\n osInstance(): OverlayScrollbars | null {\r\n return this._osInstance;\r\n }\r\n\r\n osTarget(): HTMLDivElement | null {\r\n return this._osTargetRef.current || null;\r\n }\r\n\r\n componentDidMount() {\r\n this._osInstance = OverlayScrollbars(this.osTarget(), this.props.options || {}, this.props.extensions);\r\n mergeHostClassNames(this._osInstance, this.props.className);\r\n }\r\n\r\n componentWillUnmount() {\r\n if (OverlayScrollbars.valid(this._osInstance)) {\r\n this._osInstance.destroy();\r\n this._osInstance = null;\r\n }\r\n }\r\n\r\n componentDidUpdate(prevProps: OverlayScrollbarsComponentProps) {\r\n if (OverlayScrollbars.valid(this._osInstance)) {\r\n this._osInstance.options(this.props.options);\r\n\r\n if (prevProps.className !== this.props.className) {\r\n mergeHostClassNames(this._osInstance, this.props.className);\r\n }\r\n }\r\n }\r\n\r\n render() {\r\n const {\r\n options,\r\n extensions,\r\n children,\r\n className,\r\n ...divProps\r\n } = this.props;\r\n\r\n return (\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {this.props.children}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n );\r\n }\r\n}\r\n\r\nfunction mergeHostClassNames(osInstance: OverlayScrollbars, className: string) {\r\n if (OverlayScrollbars.valid(osInstance)) {\r\n const { host } = osInstance.getElements();\r\n const regex = new RegExp(`(^os-host([-_].+|)$)|${osInstance.options().className.replace(/\\s/g, \"$|\")}$`, 'g');\r\n const osClassNames = host.className.split(' ')\r\n .filter(name => name.match(regex))\r\n .join(' ');\r\n\r\n host.className = `${osClassNames} ${className || ''}`;\r\n }\r\n}"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/packages/overlayscrollbars-react/dist/overlayscrollbars-react.js.map b/packages/overlayscrollbars-react/dist/overlayscrollbars-react.js.map index df908c4..6a2f8fe 100644 --- a/packages/overlayscrollbars-react/dist/overlayscrollbars-react.js.map +++ b/packages/overlayscrollbars-react/dist/overlayscrollbars-react.js.map @@ -1 +1 @@ -{"version":3,"file":"overlayscrollbars-react.js","sources":["../src/OverlayScrollbarsComponent.tsx"],"sourcesContent":["import React, { Component, RefObject } from 'react';\nimport OverlayScrollbars from \"overlayscrollbars\";\n\nexport interface OverlayScrollbarsComponentProps extends React.HTMLAttributes {\n children?: any;\n options?: OverlayScrollbars.Options;\n extensions?: OverlayScrollbars.Extensions;\n}\nexport interface OverlayScrollbarsComponentState { }\n\nexport class OverlayScrollbarsComponent extends Component {\n private _osInstance: OverlayScrollbars | null = null;\n private _osTargetRef: RefObject;\n\n constructor(props: OverlayScrollbarsComponentProps) {\n super(props);\n this._osTargetRef = React.createRef();\n }\n\n osInstance(): OverlayScrollbars | null {\n return this._osInstance;\n }\n\n osTarget(): HTMLDivElement | null {\n return this._osTargetRef.current || null;\n }\n\n componentDidMount() {\n this._osInstance = OverlayScrollbars(this.osTarget(), this.props.options || {}, this.props.extensions);\n mergeHostClassNames(this._osInstance, this.props.className);\n }\n\n componentWillUnmount() {\n if (OverlayScrollbars.valid(this._osInstance)) {\n this._osInstance.destroy();\n this._osInstance = null;\n }\n }\n\n componentDidUpdate(prevProps: OverlayScrollbarsComponentProps) {\n if (OverlayScrollbars.valid(this._osInstance)) {\n this._osInstance.options(this.props.options);\n\n if (prevProps.className !== this.props.className) {\n mergeHostClassNames(this._osInstance, this.props.className);\n }\n }\n }\n\n render() {\n const {\n options,\n extensions,\n children,\n className,\n ...divProps\n } = this.props;\n\n return (\n
\n
\n
\n
\n
\n {this.props.children}\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n );\n }\n}\n\nfunction mergeHostClassNames(osInstance: OverlayScrollbars, className: string) {\n if (OverlayScrollbars.valid(osInstance)) {\n const { host } = osInstance.getElements();\n const regex = new RegExp(`(^os-host([-_].+|)$)|${osInstance.options().className.replace(/\\s/g, \"$|\")}$`, 'g');\n const osClassNames = host.className.split(' ')\n .filter(name => name.match(regex))\n .join(' ');\n\n host.className = `${osClassNames} ${className || ''}`;\n }\n}"],"names":["React","Component"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"overlayscrollbars-react.js","sources":["../src/OverlayScrollbarsComponent.tsx"],"sourcesContent":["import React, { Component, RefObject } from 'react';\r\nimport OverlayScrollbars from \"overlayscrollbars\";\r\n\r\nexport interface OverlayScrollbarsComponentProps extends React.HTMLAttributes {\r\n children?: any;\r\n options?: OverlayScrollbars.Options;\r\n extensions?: OverlayScrollbars.Extensions;\r\n}\r\nexport interface OverlayScrollbarsComponentState { }\r\n\r\nexport class OverlayScrollbarsComponent extends Component {\r\n private _osInstance: OverlayScrollbars | null = null;\r\n private _osTargetRef: RefObject;\r\n\r\n constructor(props: OverlayScrollbarsComponentProps) {\r\n super(props);\r\n this._osTargetRef = React.createRef();\r\n }\r\n\r\n osInstance(): OverlayScrollbars | null {\r\n return this._osInstance;\r\n }\r\n\r\n osTarget(): HTMLDivElement | null {\r\n return this._osTargetRef.current || null;\r\n }\r\n\r\n componentDidMount() {\r\n this._osInstance = OverlayScrollbars(this.osTarget(), this.props.options || {}, this.props.extensions);\r\n mergeHostClassNames(this._osInstance, this.props.className);\r\n }\r\n\r\n componentWillUnmount() {\r\n if (OverlayScrollbars.valid(this._osInstance)) {\r\n this._osInstance.destroy();\r\n this._osInstance = null;\r\n }\r\n }\r\n\r\n componentDidUpdate(prevProps: OverlayScrollbarsComponentProps) {\r\n if (OverlayScrollbars.valid(this._osInstance)) {\r\n this._osInstance.options(this.props.options);\r\n\r\n if (prevProps.className !== this.props.className) {\r\n mergeHostClassNames(this._osInstance, this.props.className);\r\n }\r\n }\r\n }\r\n\r\n render() {\r\n const {\r\n options,\r\n extensions,\r\n children,\r\n className,\r\n ...divProps\r\n } = this.props;\r\n\r\n return (\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {this.props.children}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n );\r\n }\r\n}\r\n\r\nfunction mergeHostClassNames(osInstance: OverlayScrollbars, className: string) {\r\n if (OverlayScrollbars.valid(osInstance)) {\r\n const { host } = osInstance.getElements();\r\n const regex = new RegExp(`(^os-host([-_].+|)$)|${osInstance.options().className.replace(/\\s/g, \"$|\")}$`, 'g');\r\n const osClassNames = host.className.split(' ')\r\n .filter(name => name.match(regex))\r\n .join(' ');\r\n\r\n host.className = `${osClassNames} ${className || ''}`;\r\n }\r\n}"],"names":["React","Component"],"mappings":"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"} \ No newline at end of file diff --git a/packages/overlayscrollbars-react/example/package-lock.json b/packages/overlayscrollbars-react/example/package-lock.json index f16d622..6f7a473 100644 --- a/packages/overlayscrollbars-react/example/package-lock.json +++ b/packages/overlayscrollbars-react/example/package-lock.json @@ -1410,9 +1410,9 @@ "integrity": "sha512-U3t35G0IH39eCoWKI6auh+3NkeP8jrmLyeZhiL3fKn4foOvbl223Ccd9cfUb1vhcxDmpTNAfKphDvl5jYJOD3w==" }, "@types/prop-types": { - "version": "15.7.1", - "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.1.tgz", - "integrity": "sha512-CFzn9idOEpHrgdw8JsoTkaDDyRWk1jrzIV8djzcgpq0y9tG4B4lFT+Nxh52DVpDXV+n4+NPNv7M1Dj5uMp6XFg==" + "version": "15.7.5", + "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz", + "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==" }, "@types/q": { "version": "1.5.2", @@ -1420,22 +1420,28 @@ "integrity": "sha512-ce5d3q03Ex0sy4R14722Rmt6MT07Ua+k4FwDfdcToYJcMKNtRVQvJ6JCAPdAmAnbRb6CsX6aYb9m96NGod9uTw==" }, "@types/react": { - "version": "16.8.23", - "resolved": "https://registry.npmjs.org/@types/react/-/react-16.8.23.tgz", - "integrity": "sha512-abkEOIeljniUN9qB5onp++g0EY38h7atnDHxwKUFz1r3VH1+yG1OKi2sNPTyObL40goBmfKFpdii2lEzwLX1cA==", + "version": "18.0.0", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.0.tgz", + "integrity": "sha512-7+K7zEQYu7NzOwQGLR91KwWXXDzmTFODRVizJyIALf6RfLv2GDpqpknX64pvRVILXCpXi7O/pua8NGk44dLvJw==", "requires": { "@types/prop-types": "*", - "csstype": "^2.2.0" + "@types/scheduler": "*", + "csstype": "^3.0.2" } }, "@types/react-dom": { - "version": "16.8.5", - "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-16.8.5.tgz", - "integrity": "sha512-idCEjROZ2cqh29+trmTmZhsBAUNQuYrF92JHKzZ5+aiFM1mlSk3bb23CK7HhYuOY75Apgap5y2jTyHzaM2AJGA==", + "version": "18.0.0", + "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.0.tgz", + "integrity": "sha512-49897Y0UiCGmxZqpC8Blrf6meL8QUla6eb+BBhn69dTXlmuOlzkfr7HHY/O8J25e1lTUMs+YYxSlVDAaGHCOLg==", "requires": { "@types/react": "*" } }, + "@types/scheduler": { + "version": "0.16.2", + "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz", + "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==" + }, "@types/stack-utils": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-1.0.1.tgz", @@ -3963,9 +3969,9 @@ } }, "csstype": { - "version": "2.6.6", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.6.tgz", - "integrity": "sha512-RpFbQGUE74iyPgvr46U9t1xoQBM8T4BL8SxrN66Le2xYAPSaDJJKeztV3awugusb3g3G9iL8StmkBBXhcbbXhg==" + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.0.tgz", + "integrity": "sha512-uX1KG+x9h5hIJsaKR9xHUeUraxf8IODOwq9JLNPq6BwB04a/xgpq3rcx47l5BZu5zBPlgD342tdke3Hom/nJRA==" }, "cyclist": { "version": "0.2.2", @@ -10006,13 +10012,11 @@ } }, "react": { - "version": "16.13.1", - "resolved": "https://registry.npmjs.org/react/-/react-16.13.1.tgz", - "integrity": "sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==", + "version": "18.1.0", + "resolved": "https://registry.npmjs.org/react/-/react-18.1.0.tgz", + "integrity": "sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ==", "requires": { - "loose-envify": "^1.1.0", - "object-assign": "^4.1.1", - "prop-types": "^15.6.2" + "loose-envify": "^1.1.0" } }, "react-app-polyfill": { @@ -10121,14 +10125,12 @@ } }, "react-dom": { - "version": "16.13.1", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.13.1.tgz", - "integrity": "sha512-81PIMmVLnCNLO/fFOQxdQkvEq/+Hfpv24XNJfpyZhTRfO0QcmQIF/PgCa1zCOj2w1hrn12MFLyaJ/G0+Mxtfag==", + "version": "18.1.0", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.1.0.tgz", + "integrity": "sha512-fU1Txz7Budmvamp7bshe4Zi32d0ll7ect+ccxNu9FlObT605GOEB8BfO4tmRJ39R5Zj831VCpvQ05QPBW5yb+w==", "requires": { "loose-envify": "^1.1.0", - "object-assign": "^4.1.1", - "prop-types": "^15.6.2", - "scheduler": "^0.19.1" + "scheduler": "^0.22.0" } }, "react-error-overlay": { @@ -10691,12 +10693,11 @@ } }, "scheduler": { - "version": "0.19.1", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.19.1.tgz", - "integrity": "sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==", + "version": "0.22.0", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.22.0.tgz", + "integrity": "sha512-6QAm1BgQI88NPYymgGQLCZgvep4FyePDWFpXVK+zNSUgHwlqpJy8VEh8Et0KxTACS4VWwMousBElAZOH9nkkoQ==", "requires": { - "loose-envify": "^1.1.0", - "object-assign": "^4.1.1" + "loose-envify": "^1.1.0" } }, "schema-utils": { diff --git a/packages/overlayscrollbars-react/example/package.json b/packages/overlayscrollbars-react/example/package.json index b228a38..7a5cd29 100644 --- a/packages/overlayscrollbars-react/example/package.json +++ b/packages/overlayscrollbars-react/example/package.json @@ -7,12 +7,12 @@ "@types/jest": "24.0.15", "@types/node": "12.6.8", "@types/overlayscrollbars": "^1.9.0", - "@types/react": "16.8.23", - "@types/react-dom": "16.8.5", + "@types/react": "^18.0.0", + "@types/react-dom": "^18.0.0", "overlayscrollbars": "^1.11.0", "overlayscrollbars-react": "^0.1.0", - "react": "^16.13.1", - "react-dom": "^16.13.1", + "react": "^18.0.0", + "react-dom": "^18.0.0", "react-scripts": "3.0.1", "typescript": ">=3.2.1 <3.5.0" }, diff --git a/packages/overlayscrollbars-react/package-lock.json b/packages/overlayscrollbars-react/package-lock.json index 8a31930..f46450f 100644 --- a/packages/overlayscrollbars-react/package-lock.json +++ b/packages/overlayscrollbars-react/package-lock.json @@ -1,6 +1,6 @@ { "name": "overlayscrollbars-react", - "version": "0.2.1", + "version": "0.3.0", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -23,19 +23,20 @@ "dev": true }, "@types/prop-types": { - "version": "15.7.3", - "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz", - "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==", + "version": "15.7.5", + "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz", + "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==", "dev": true }, "@types/react": { - "version": "16.9.27", - "resolved": "https://registry.npmjs.org/@types/react/-/react-16.9.27.tgz", - "integrity": "sha512-j+RvQb9w7a2kZFBOgTh+s/elCwtqWUMN6RJNdmz0ntmwpeoMHKnyhUcmYBu7Yw94Rtj9938D+TJSn6WGcq2+OA==", + "version": "18.0.9", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.9.tgz", + "integrity": "sha512-9bjbg1hJHUm4De19L1cHiW0Jvx3geel6Qczhjd0qY5VKVE2X5+x77YxAepuCwVh4vrgZJdgEJw48zrhRIeF4Nw==", "dev": true, "requires": { "@types/prop-types": "*", - "csstype": "^2.2.0" + "@types/scheduler": "*", + "csstype": "^3.0.2" } }, "@types/resolve": { @@ -47,6 +48,12 @@ "@types/node": "*" } }, + "@types/scheduler": { + "version": "0.16.2", + "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz", + "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==", + "dev": true + }, "abbrev": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz", @@ -656,9 +663,9 @@ "dev": true }, "csstype": { - "version": "2.6.10", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.10.tgz", - "integrity": "sha512-D34BqZU4cIlMCY93rZHbrq9pjTAQJ3U8S8rfBqjwHxkGPThWFjzZDQpgMJY0QViLxth6ZKYiwFBo14RdN44U/w==", + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.0.tgz", + "integrity": "sha512-uX1KG+x9h5hIJsaKR9xHUeUraxf8IODOwq9JLNPq6BwB04a/xgpq3rcx47l5BZu5zBPlgD342tdke3Hom/nJRA==", "dev": true }, "d": { @@ -1184,7 +1191,8 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "aproba": { "version": "1.2.0", @@ -1205,12 +1213,14 @@ "balanced-match": { "version": "1.0.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, "dev": true, + "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -1225,17 +1235,20 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "concat-map": { "version": "0.0.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "core-util-is": { "version": "1.0.2", @@ -1352,7 +1365,8 @@ "inherits": { "version": "2.0.3", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "ini": { "version": "1.3.5", @@ -1364,6 +1378,7 @@ "version": "1.0.0", "bundled": true, "dev": true, + "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -1378,6 +1393,7 @@ "version": "3.0.4", "bundled": true, "dev": true, + "optional": true, "requires": { "brace-expansion": "^1.1.7" } @@ -1385,12 +1401,14 @@ "minimist": { "version": "0.0.8", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "minipass": { "version": "2.3.5", "bundled": true, "dev": true, + "optional": true, "requires": { "safe-buffer": "^5.1.2", "yallist": "^3.0.0" @@ -1409,6 +1427,7 @@ "version": "0.5.1", "bundled": true, "dev": true, + "optional": true, "requires": { "minimist": "0.0.8" } @@ -1489,7 +1508,8 @@ "number-is-nan": { "version": "1.0.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "object-assign": { "version": "4.1.1", @@ -1501,6 +1521,7 @@ "version": "1.4.0", "bundled": true, "dev": true, + "optional": true, "requires": { "wrappy": "1" } @@ -1586,7 +1607,8 @@ "safe-buffer": { "version": "5.1.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -1622,6 +1644,7 @@ "version": "1.0.2", "bundled": true, "dev": true, + "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -1641,6 +1664,7 @@ "version": "3.0.1", "bundled": true, "dev": true, + "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -1684,12 +1708,14 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "yallist": { "version": "3.0.3", "bundled": true, - "dev": true + "dev": true, + "optional": true } } }, @@ -2570,12 +2596,6 @@ "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=", "dev": true }, - "object-assign": { - "version": "4.1.1", - "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", - "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=", - "dev": true - }, "object-copy": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/object-copy/-/object-copy-0.1.0.tgz", @@ -2872,17 +2892,6 @@ "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==", "dev": true }, - "prop-types": { - "version": "15.7.2", - "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz", - "integrity": "sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==", - "dev": true, - "requires": { - "loose-envify": "^1.4.0", - "object-assign": "^4.1.1", - "react-is": "^16.8.1" - } - }, "proto-list": { "version": "1.2.4", "resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz", @@ -2917,22 +2926,14 @@ } }, "react": { - "version": "16.13.1", - "resolved": "https://registry.npmjs.org/react/-/react-16.13.1.tgz", - "integrity": "sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==", + "version": "18.1.0", + "resolved": "https://registry.npmjs.org/react/-/react-18.1.0.tgz", + "integrity": "sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ==", "dev": true, "requires": { - "loose-envify": "^1.1.0", - "object-assign": "^4.1.1", - "prop-types": "^15.6.2" + "loose-envify": "^1.1.0" } }, - "react-is": { - "version": "16.13.1", - "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", - "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", - "dev": true - }, "read-pkg": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz", diff --git a/packages/overlayscrollbars-react/package.json b/packages/overlayscrollbars-react/package.json index 1f916b7..44929bb 100644 --- a/packages/overlayscrollbars-react/package.json +++ b/packages/overlayscrollbars-react/package.json @@ -1,6 +1,6 @@ { "name": "overlayscrollbars-react", - "version": "0.2.3", + "version": "0.3.0", "description": "OverlayScrollbars wrapper for React.", "keywords": [ "overlayscrollbars", @@ -25,12 +25,12 @@ "license": "MIT", "devDependencies": { "@types/overlayscrollbars": "^1.9.0", - "@types/react": "^16.9.27", + "@types/react": "^18.0.0", "chalk": "^2.4.2", "gulp": "^4.0.2", "gulp-json-editor": "^2.5.4", "overlayscrollbars": "^1.11.0", - "react": "^16.13.1", + "react": "^18.0.0", "rollup": "^1.32.1", "rollup-plugin-commonjs": "^10.1.0", "rollup-plugin-node-resolve": "^5.2.0", @@ -39,7 +39,7 @@ "typescript": "^3.8.3" }, "peerDependencies": { - "react": "^16.4.0 || ^17.0.0", + "react": "^16.4.0 || ^17.0.0 || ^18.0.0", "overlayscrollbars": "^1.10.0" }, "scripts": { @@ -49,4 +49,4 @@ "build-example": "cd example && npm run build", "test": "echo \"Error: no test specified\" && exit 1" } -} +} \ No newline at end of file