@wiggindev/hooks 0.2.0 → 0.2.3
Sign up to get free protection for your applications and to get access to all the features.
- package/.eslintrc.cjs +7 -43
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.modern.js +1 -1
- package/dist/index.modern.js.map +1 -1
- package/dist/index.module.js +1 -1
- package/dist/index.module.js.map +1 -1
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.map +1 -1
- package/dist/useDocumentEventListener.d.ts +2 -2
- package/dist/useEvent.d.ts +1 -2
- package/dist/useEventListener.d.ts +2 -2
- package/dist/useIsomorphicLayoutEffect.d.ts +1 -1
- package/dist/usePrevious.d.ts +1 -0
- package/dist/useWindowDimensions.d.ts +4 -0
- package/dist/useWindowEventListener.d.ts +2 -2
- package/package.json +6 -21
- package/src/index.ts +2 -0
- package/src/useDocumentEventListener.ts +1 -1
- package/src/useEvent.ts +1 -2
- package/src/useEventListener.ts +1 -1
- package/src/usePrevious.ts +9 -0
- package/src/useWindowDimensions.ts +34 -0
- package/tsconfig.json +3 -22
- package/.editorconfig +0 -10
- package/.husky/pre-commit +0 -4
- package/.idea/codeStyles/Project.xml +0 -50
- package/.idea/codeStyles/codeStyleConfig.xml +0 -5
- package/.idea/codestream.xml +0 -7
- package/.idea/hooks.iml +0 -13
- package/.idea/inspectionProfiles/Project_Default.xml +0 -6
- package/.idea/jsLinters/eslint.xml +0 -6
- package/.idea/modules.xml +0 -9
- package/.idea/prettier.xml +0 -7
- package/.idea/vcs.xml +0 -7
- package/.prettierignore +0 -2
- package/.prettierrc.json +0 -9
- package/.yarn/plugins/@yarnpkg/plugin-typescript.cjs +0 -9
- package/.yarn/plugins/@yarnpkg/plugin-version.cjs +0 -550
- package/.yarn/releases/yarn-3.2.1.cjs +0 -786
- package/.yarn/versions/5e6f01b6.yml +0 -0
- package/.yarn/versions/8b4bba28.yml +0 -0
- package/.yarn/versions/ee3e92fc.yml +0 -0
- package/dist/events.d.ts +0 -4
- package/dist/tsconfig.tsbuildinfo +0 -1
- package/lint-staged.config.cjs +0 -9
- package/src/events.ts +0 -6
package/.eslintrc.cjs
CHANGED
@@ -1,54 +1,18 @@
|
|
1
1
|
module.exports = {
|
2
|
-
root: true,
|
3
|
-
parser: '@typescript-eslint/parser',
|
4
2
|
parserOptions: {
|
5
3
|
ecmaFeatures: {
|
6
4
|
jsx: true,
|
7
5
|
},
|
8
6
|
},
|
9
|
-
|
10
|
-
|
7
|
+
settings: {
|
8
|
+
react: {
|
9
|
+
version: 'detect',
|
10
|
+
},
|
11
|
+
},
|
12
|
+
plugins: ['react'],
|
13
|
+
extends: ['plugin:react/recommended'],
|
11
14
|
rules: {
|
12
|
-
'prefer-const': 'error',
|
13
|
-
'no-unused-vars': 'off',
|
14
|
-
'no-cond-assign': ['error', 'always'],
|
15
|
-
'@typescript-eslint/no-unused-vars': [
|
16
|
-
'error',
|
17
|
-
{ ignoreRestSiblings: true },
|
18
|
-
],
|
19
|
-
'@typescript-eslint/no-explicit-any': 'error',
|
20
15
|
'react/jsx-uses-react': 'error',
|
21
16
|
'react/jsx-uses-vars': 'error',
|
22
|
-
'@next/next/no-html-link-for-pages': 'off',
|
23
|
-
'prettier/prettier': 'error',
|
24
17
|
},
|
25
|
-
overrides: [
|
26
|
-
{
|
27
|
-
files: ['*.ts', '*.tsx'],
|
28
|
-
extends: [
|
29
|
-
'plugin:@typescript-eslint/recommended',
|
30
|
-
'plugin:@typescript-eslint/recommended-requiring-type-checking',
|
31
|
-
],
|
32
|
-
parserOptions: {
|
33
|
-
tsconfigRootDir: __dirname,
|
34
|
-
project: ['./tsconfig.json'],
|
35
|
-
},
|
36
|
-
},
|
37
|
-
{
|
38
|
-
files: ['*.js'],
|
39
|
-
rules: {
|
40
|
-
'@typescript-eslint/no-var-requires': 'off',
|
41
|
-
},
|
42
|
-
},
|
43
|
-
],
|
44
|
-
ignorePatterns: [
|
45
|
-
'node_modules',
|
46
|
-
'.fleet',
|
47
|
-
'.yarn',
|
48
|
-
'.idea',
|
49
|
-
'.next',
|
50
|
-
'.vercel',
|
51
|
-
'dist',
|
52
|
-
'.pnp.*',
|
53
|
-
],
|
54
18
|
};
|
package/dist/index.cjs
CHANGED
@@ -1,2 +1,2 @@
|
|
1
|
-
var e=require("react"),t=require("@wiggindev/utils");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=/*#__PURE__*/n(e),r="undefined"!=typeof window?u.default.useLayoutEffect:u.default.useEffect,f=function(e){var t=u.default.useRef(e);return r(function(){t.current=e}),u.default.useMemo(function(){return t.current},[])};exports.useDocumentEventListener=function(e,n){var r=f(n);u.default.useEffect(function(){if(document&&document.addEventListener)return t.events.document.on(e,r),function(){return t.events.document.off(e,r)}},[e,r])},exports.useEvent=f,exports.useEventListener=function(e,n,r){var
|
1
|
+
var e=require("react"),t=require("@wiggindev/utils");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=/*#__PURE__*/n(e),r="undefined"!=typeof window?u.default.useLayoutEffect:u.default.useEffect,f=function(e){var t=u.default.useRef(e);return r(function(){t.current=e}),u.default.useMemo(function(){return t.current},[])},i=function(e,n){var r=f(n);u.default.useEffect(function(){if(window&&window.addEventListener)return t.events.window.on(e,r),function(){return t.events.window.off(e,r)}},[e,r])};exports.useDocumentEventListener=function(e,n){var r=f(n);u.default.useEffect(function(){if(document&&document.addEventListener)return t.events.document.on(e,r),function(){return t.events.document.off(e,r)}},[e,r])},exports.useEvent=f,exports.useEventListener=function(e,n,r){var i=f(n);u.default.useEffect(function(){var n=r.current;if(n&&n.addEventListener)return t.events.element.on(n,e,i),function(){return t.events.element.off(n,e,i)}},[r,e,i])},exports.useIsomorphicLayoutEffect=r,exports.usePrevious=function(e){var t=u.default.useRef();return u.default.useEffect(function(){t.current=e},[e]),t.current},exports.useWindowDimensions=function(e){void 0===e&&(e=250);var n=u.default.useState({width:0,height:0}),o=n[0],s=n[1],c=function(){return s({width:(e=window).innerWidth,height:e.innerHeight});var e},d=f(t.throttle(c,e));return i("resize",d),r(function(){c()},[]),o},exports.useWindowEventListener=i;
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.cjs.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../src/useIsomorphicLayoutEffect.ts","../src/useEvent.ts","../src/useDocumentEventListener.ts","../src/useEventListener.ts","../src/
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../src/useIsomorphicLayoutEffect.ts","../src/useEvent.ts","../src/useWindowEventListener.ts","../src/useDocumentEventListener.ts","../src/useEventListener.ts","../src/usePrevious.ts","../src/useWindowDimensions.ts"],"sourcesContent":["import React from 'react';\n\nexport const useIsomorphicLayoutEffect =\n typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\n","import React from 'react';\nimport { Callback } from '@wiggindev/utils';\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';\n\nexport const useEvent = <C extends Callback>(callback: C): C => {\n const callbackRef = React.useRef(callback);\n useIsomorphicLayoutEffect(() => {\n callbackRef.current = callback;\n });\n return React.useMemo(() => callbackRef.current, []);\n};\n","import React from 'react';\nimport { events, EventName, EventListener } from '@wiggindev/utils';\nimport { useEvent } from './useEvent';\n\nexport const useWindowEventListener = <K extends EventName<WindowEventMap>>(\n eventName: K,\n listener: EventListener<WindowEventMap, K>\n) => {\n const stableListener = useEvent(listener);\n React.useEffect(() => {\n if (!window || !window.addEventListener) {\n return;\n }\n events.window.on(eventName, stableListener);\n return () => events.window.off(eventName, stableListener);\n }, [eventName, stableListener]);\n};\n","import React from 'react';\nimport { events, EventName, EventListener } from '@wiggindev/utils';\nimport { useEvent } from './useEvent';\n\nexport const useDocumentEventListener = <K extends EventName<DocumentEventMap>>(\n eventName: K,\n listener: EventListener<DocumentEventMap, K>\n) => {\n const stableListener = useEvent(listener);\n React.useEffect(() => {\n if (!document || !document.addEventListener) {\n return;\n }\n events.document.on(eventName, stableListener);\n return () => events.document.off(eventName, stableListener);\n }, [eventName, stableListener]);\n};\n","import React from 'react';\nimport { events, EventName, EventListener } from '@wiggindev/utils';\nimport { useEvent } from './useEvent';\n\nexport const useEventListener = <\n K extends EventName<HTMLElementEventMap>,\n E extends HTMLElement\n>(\n eventName: K,\n listener: EventListener<HTMLElementEventMap, K>,\n element: React.RefObject<E>\n) => {\n const stableListener = useEvent(listener);\n React.useEffect(() => {\n const node = element.current;\n if (!node || !node.addEventListener) {\n return;\n }\n events.element.on(node, eventName, stableListener);\n return () => events.element.off(node, eventName, stableListener);\n }, [element, eventName, stableListener]);\n};\n","import React from 'react';\n\nexport const usePrevious = <T>(value: T) => {\n const stateRef = React.useRef<T>();\n React.useEffect(() => {\n stateRef.current = value;\n }, [value]);\n return stateRef.current;\n};\n","import React from 'react';\nimport { throttle } from '@wiggindev/utils';\nimport { useWindowEventListener } from './useWindowEventListener';\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';\nimport { useEvent } from './useEvent';\n\nconst getWindowDimensions = () => {\n const { innerWidth: width, innerHeight: height } = window;\n return {\n width,\n height,\n };\n};\n\nexport const useWindowDimensions = (throttleLimit = 250) => {\n const [windowDimensions, setWindowDimensions] = React.useState({\n width: 0,\n height: 0,\n });\n\n const updateWindowDimensions = () =>\n setWindowDimensions(getWindowDimensions());\n const handleResize = useEvent(\n throttle(updateWindowDimensions, throttleLimit)\n );\n\n useWindowEventListener('resize', handleResize);\n\n useIsomorphicLayoutEffect(() => {\n updateWindowDimensions();\n }, []);\n\n return windowDimensions;\n};\n"],"names":["useIsomorphicLayoutEffect","window","React","useLayoutEffect","useEffect","useEvent","callback","callbackRef","useRef","current","useMemo","useWindowEventListener","eventName","listener","stableListener","addEventListener","events","on","off","document","element","node","value","stateRef","throttleLimit","useState","width","height","windowDimensions","_React$useState","setWindowDimensions","updateWindowDimensions","_window","innerWidth","innerHeight","handleResize","throttle"],"mappings":"qJAEaA,EACS,oBAAXC,OAAyBC,EAAAA,QAAMC,gBAAkBD,EAAAA,QAAME,UCCrDC,EAAW,SAAqBC,GACzC,IAAMC,EAAcL,EAAK,QAACM,OAAOF,GAIjC,OAHAN,EAA0B,WACtBO,EAAYE,QAAUH,IAEnBJ,UAAMQ,QAAQ,WAAA,OAAMH,EAAYE,SAAS,KCLvCE,EAAyB,SAClCC,EACAC,GAEA,IAAMC,EAAiBT,EAASQ,GAChCX,EAAK,QAACE,UAAU,WACZ,GAAKH,QAAWA,OAAOc,iBAIvB,OADAC,EAAMA,OAACf,OAAOgB,GAAGL,EAAWE,GACfE,WAAAA,OAAAA,EAAAA,OAAOf,OAAOiB,IAAIN,EAAWE,KAC3C,CAACF,EAAWE,sCCXqB,SACpCF,EACAC,GAEA,IAAMC,EAAiBT,EAASQ,GAChCX,EAAK,QAACE,UAAU,WACZ,GAAKe,UAAaA,SAASJ,iBAI3B,OADAC,EAAMA,OAACG,SAASF,GAAGL,EAAWE,GACjBE,WAAAA,OAAAA,EAAAA,OAAOG,SAASD,IAAIN,EAAWE,KAC7C,CAACF,EAAWE,iDCXa,SAI5BF,EACAC,EACAO,GAEA,IAAMN,EAAiBT,EAASQ,GAChCX,EAAK,QAACE,UAAU,WACZ,IAAMiB,EAAOD,EAAQX,QACrB,GAAKY,GAASA,EAAKN,iBAInB,OADAC,EAAMA,OAACI,QAAQH,GAAGI,EAAMT,EAAWE,qBACtBE,EAAMA,OAACI,QAAQF,IAAIG,EAAMT,EAAWE,KAClD,CAACM,EAASR,EAAWE,6DClBD,SAAIQ,GAC3B,IAAMC,EAAWrB,EAAK,QAACM,SAIvB,OAHAN,EAAK,QAACE,UAAU,WACZmB,EAASd,QAAUa,GACpB,CAACA,IACGC,EAASd,qCCOe,SAACe,YAAAA,IAAAA,EAAgB,KAChD,IAAgDtB,EAAAA,EAAK,QAACuB,SAAS,CAC3DC,MAAO,EACPC,OAAQ,IAFLC,EAAPC,EAAA,GAAyBC,EAAzBD,EAAA,GAKME,EAAyB,kBAC3BD,EAbG,CACHJ,OAFJM,EAAmD/B,QAA3CgC,WAGJN,OAHuBO,EAAAA,cADH,IACxBF,GAeMG,EAAe9B,EACjB+B,EAAQA,SAACL,EAAwBP,IASrC,OANAb,EAAuB,SAAUwB,GAEjCnC,EAA0B,WACtB+B,KACD,IAEIH"}
|
package/dist/index.d.ts
CHANGED
package/dist/index.modern.js
CHANGED
@@ -1,2 +1,2 @@
|
|
1
|
-
import e from"react";import{events as t}from"@wiggindev/utils";const
|
1
|
+
import e from"react";import{events as t,throttle as n}from"@wiggindev/utils";const r="undefined"!=typeof window?e.useLayoutEffect:e.useEffect,o=t=>{const n=e.useRef(t);return r(()=>{n.current=t}),e.useMemo(()=>n.current,[])},u=(n,r,u)=>{const f=o(r);e.useEffect(()=>{const e=u.current;if(e&&e.addEventListener)return t.element.on(e,n,f),()=>t.element.off(e,n,f)},[u,n,f])},f=(n,r)=>{const u=o(r);e.useEffect(()=>{if(document&&document.addEventListener)return t.document.on(n,u),()=>t.document.off(n,u)},[n,u])},i=(n,r)=>{const u=o(r);e.useEffect(()=>{if(window&&window.addEventListener)return t.window.on(n,u),()=>t.window.off(n,u)},[n,u])},c=t=>{const n=e.useRef();return e.useEffect(()=>{n.current=t},[t]),n.current},s=(t=250)=>{const[u,f]=e.useState({width:0,height:0}),c=()=>f((()=>{const{innerWidth:e,innerHeight:t}=window;return{width:e,height:t}})()),s=o(n(c,t));return i("resize",s),r(()=>{c()},[]),u};export{f as useDocumentEventListener,o as useEvent,u as useEventListener,r as useIsomorphicLayoutEffect,c as usePrevious,s as useWindowDimensions,i as useWindowEventListener};
|
2
2
|
//# sourceMappingURL=index.modern.js.map
|
package/dist/index.modern.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.modern.js","sources":["../src/useIsomorphicLayoutEffect.ts","../src/useEvent.ts","../src/useEventListener.ts","../src/useDocumentEventListener.ts","../src/useWindowEventListener.ts"],"sourcesContent":["import React from 'react';\n\nexport const useIsomorphicLayoutEffect =\n typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\n","import React from 'react';\nimport {
|
1
|
+
{"version":3,"file":"index.modern.js","sources":["../src/useIsomorphicLayoutEffect.ts","../src/useEvent.ts","../src/useEventListener.ts","../src/useDocumentEventListener.ts","../src/useWindowEventListener.ts","../src/usePrevious.ts","../src/useWindowDimensions.ts"],"sourcesContent":["import React from 'react';\n\nexport const useIsomorphicLayoutEffect =\n typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\n","import React from 'react';\nimport { Callback } from '@wiggindev/utils';\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';\n\nexport const useEvent = <C extends Callback>(callback: C): C => {\n const callbackRef = React.useRef(callback);\n useIsomorphicLayoutEffect(() => {\n callbackRef.current = callback;\n });\n return React.useMemo(() => callbackRef.current, []);\n};\n","import React from 'react';\nimport { events, EventName, EventListener } from '@wiggindev/utils';\nimport { useEvent } from './useEvent';\n\nexport const useEventListener = <\n K extends EventName<HTMLElementEventMap>,\n E extends HTMLElement\n>(\n eventName: K,\n listener: EventListener<HTMLElementEventMap, K>,\n element: React.RefObject<E>\n) => {\n const stableListener = useEvent(listener);\n React.useEffect(() => {\n const node = element.current;\n if (!node || !node.addEventListener) {\n return;\n }\n events.element.on(node, eventName, stableListener);\n return () => events.element.off(node, eventName, stableListener);\n }, [element, eventName, stableListener]);\n};\n","import React from 'react';\nimport { events, EventName, EventListener } from '@wiggindev/utils';\nimport { useEvent } from './useEvent';\n\nexport const useDocumentEventListener = <K extends EventName<DocumentEventMap>>(\n eventName: K,\n listener: EventListener<DocumentEventMap, K>\n) => {\n const stableListener = useEvent(listener);\n React.useEffect(() => {\n if (!document || !document.addEventListener) {\n return;\n }\n events.document.on(eventName, stableListener);\n return () => events.document.off(eventName, stableListener);\n }, [eventName, stableListener]);\n};\n","import React from 'react';\nimport { events, EventName, EventListener } from '@wiggindev/utils';\nimport { useEvent } from './useEvent';\n\nexport const useWindowEventListener = <K extends EventName<WindowEventMap>>(\n eventName: K,\n listener: EventListener<WindowEventMap, K>\n) => {\n const stableListener = useEvent(listener);\n React.useEffect(() => {\n if (!window || !window.addEventListener) {\n return;\n }\n events.window.on(eventName, stableListener);\n return () => events.window.off(eventName, stableListener);\n }, [eventName, stableListener]);\n};\n","import React from 'react';\n\nexport const usePrevious = <T>(value: T) => {\n const stateRef = React.useRef<T>();\n React.useEffect(() => {\n stateRef.current = value;\n }, [value]);\n return stateRef.current;\n};\n","import React from 'react';\nimport { throttle } from '@wiggindev/utils';\nimport { useWindowEventListener } from './useWindowEventListener';\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';\nimport { useEvent } from './useEvent';\n\nconst getWindowDimensions = () => {\n const { innerWidth: width, innerHeight: height } = window;\n return {\n width,\n height,\n };\n};\n\nexport const useWindowDimensions = (throttleLimit = 250) => {\n const [windowDimensions, setWindowDimensions] = React.useState({\n width: 0,\n height: 0,\n });\n\n const updateWindowDimensions = () =>\n setWindowDimensions(getWindowDimensions());\n const handleResize = useEvent(\n throttle(updateWindowDimensions, throttleLimit)\n );\n\n useWindowEventListener('resize', handleResize);\n\n useIsomorphicLayoutEffect(() => {\n updateWindowDimensions();\n }, []);\n\n return windowDimensions;\n};\n"],"names":["useIsomorphicLayoutEffect","window","React","useLayoutEffect","useEffect","useEvent","callback","callbackRef","useRef","current","useMemo","useEventListener","eventName","listener","element","stableListener","node","addEventListener","events","on","off","useDocumentEventListener","document","useWindowEventListener","usePrevious","value","stateRef","useWindowDimensions","throttleLimit","windowDimensions","setWindowDimensions","useState","width","height","updateWindowDimensions","innerWidth","innerHeight","getWindowDimensions","handleResize","throttle"],"mappings":"6EAEaA,MAAAA,EACS,oBAAXC,OAAyBC,EAAMC,gBAAkBD,EAAME,UCCrDC,EAAgCC,IACzC,MAAMC,EAAcL,EAAMM,OAAOF,GAIjC,OAHAN,EAA0B,KACtBO,EAAYE,QAAUH,IAEnBJ,EAAMQ,QAAQ,IAAMH,EAAYE,QAAS,KCLvCE,EAAmB,CAI5BC,EACAC,EACAC,KAEA,MAAMC,EAAiBV,EAASQ,GAChCX,EAAME,UAAU,KACZ,MAAMY,EAAOF,EAAQL,QACrB,GAAKO,GAASA,EAAKC,iBAInB,OADAC,EAAOJ,QAAQK,GAAGH,EAAMJ,EAAWG,GAC5B,IAAMG,EAAOJ,QAAQM,IAAIJ,EAAMJ,EAAWG,IAClD,CAACD,EAASF,EAAWG,KChBfM,EAA2B,CACpCT,EACAC,KAEA,MAAME,EAAiBV,EAASQ,GAChCX,EAAME,UAAU,KACZ,GAAKkB,UAAaA,SAASL,iBAI3B,OADAC,EAAOI,SAASH,GAAGP,EAAWG,GACvB,IAAMG,EAAOI,SAASF,IAAIR,EAAWG,IAC7C,CAACH,EAAWG,KCXNQ,EAAyB,CAClCX,EACAC,KAEA,MAAME,EAAiBV,EAASQ,GAChCX,EAAME,UAAU,KACZ,GAAKH,QAAWA,OAAOgB,iBAIvB,OADAC,EAAOjB,OAAOkB,GAAGP,EAAWG,GACrB,IAAMG,EAAOjB,OAAOmB,IAAIR,EAAWG,IAC3C,CAACH,EAAWG,KCbNS,EAAkBC,IAC3B,MAAMC,EAAWxB,EAAMM,SAIvB,OAHAN,EAAME,UAAU,KACZsB,EAASjB,QAAUgB,GACpB,CAACA,IACGC,EAASjB,SCOPkB,EAAsB,CAACC,EAAgB,OAChD,MAAOC,EAAkBC,GAAuB5B,EAAM6B,SAAS,CAC3DC,MAAO,EACPC,OAAQ,IAGNC,EAAyB,IAC3BJ,EAfoB,MACxB,MAAQK,WAAYH,EAAOI,YAAaH,GAAWhC,OACnD,MAAO,CACH+B,MAAAA,EACAC,OAAAA,IAWoBI,IAClBC,EAAejC,EACjBkC,EAASL,EAAwBN,IASrC,OANAL,EAAuB,SAAUe,GAEjCtC,EAA0B,KACtBkC,KACD,IAEIL"}
|
package/dist/index.module.js
CHANGED
@@ -1,2 +1,2 @@
|
|
1
|
-
import n from"react";import{events as e}from"@wiggindev/utils";var
|
1
|
+
import n from"react";import{events as e,throttle as t}from"@wiggindev/utils";var r="undefined"!=typeof window?n.useLayoutEffect:n.useEffect,u=function(e){var t=n.useRef(e);return r(function(){t.current=e}),n.useMemo(function(){return t.current},[])},i=function(t,r,i){var f=u(r);n.useEffect(function(){var n=i.current;if(n&&n.addEventListener)return e.element.on(n,t,f),function(){return e.element.off(n,t,f)}},[i,t,f])},f=function(t,r){var i=u(r);n.useEffect(function(){if(document&&document.addEventListener)return e.document.on(t,i),function(){return e.document.off(t,i)}},[t,i])},o=function(t,r){var i=u(r);n.useEffect(function(){if(window&&window.addEventListener)return e.window.on(t,i),function(){return e.window.off(t,i)}},[t,i])},c=function(e){var t=n.useRef();return n.useEffect(function(){t.current=e},[e]),t.current},d=function(e){void 0===e&&(e=250);var i=n.useState({width:0,height:0}),f=i[0],c=i[1],d=function(){return c({width:(n=window).innerWidth,height:n.innerHeight});var n},a=u(t(d,e));return o("resize",a),r(function(){d()},[]),f};export{f as useDocumentEventListener,u as useEvent,i as useEventListener,r as useIsomorphicLayoutEffect,c as usePrevious,d as useWindowDimensions,o as useWindowEventListener};
|
2
2
|
//# sourceMappingURL=index.module.js.map
|
package/dist/index.module.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.module.js","sources":["../src/useIsomorphicLayoutEffect.ts","../src/useEvent.ts","../src/useEventListener.ts","../src/useDocumentEventListener.ts","../src/useWindowEventListener.ts"],"sourcesContent":["import React from 'react';\n\nexport const useIsomorphicLayoutEffect =\n typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\n","import React from 'react';\nimport {
|
1
|
+
{"version":3,"file":"index.module.js","sources":["../src/useIsomorphicLayoutEffect.ts","../src/useEvent.ts","../src/useEventListener.ts","../src/useDocumentEventListener.ts","../src/useWindowEventListener.ts","../src/usePrevious.ts","../src/useWindowDimensions.ts"],"sourcesContent":["import React from 'react';\n\nexport const useIsomorphicLayoutEffect =\n typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\n","import React from 'react';\nimport { Callback } from '@wiggindev/utils';\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';\n\nexport const useEvent = <C extends Callback>(callback: C): C => {\n const callbackRef = React.useRef(callback);\n useIsomorphicLayoutEffect(() => {\n callbackRef.current = callback;\n });\n return React.useMemo(() => callbackRef.current, []);\n};\n","import React from 'react';\nimport { events, EventName, EventListener } from '@wiggindev/utils';\nimport { useEvent } from './useEvent';\n\nexport const useEventListener = <\n K extends EventName<HTMLElementEventMap>,\n E extends HTMLElement\n>(\n eventName: K,\n listener: EventListener<HTMLElementEventMap, K>,\n element: React.RefObject<E>\n) => {\n const stableListener = useEvent(listener);\n React.useEffect(() => {\n const node = element.current;\n if (!node || !node.addEventListener) {\n return;\n }\n events.element.on(node, eventName, stableListener);\n return () => events.element.off(node, eventName, stableListener);\n }, [element, eventName, stableListener]);\n};\n","import React from 'react';\nimport { events, EventName, EventListener } from '@wiggindev/utils';\nimport { useEvent } from './useEvent';\n\nexport const useDocumentEventListener = <K extends EventName<DocumentEventMap>>(\n eventName: K,\n listener: EventListener<DocumentEventMap, K>\n) => {\n const stableListener = useEvent(listener);\n React.useEffect(() => {\n if (!document || !document.addEventListener) {\n return;\n }\n events.document.on(eventName, stableListener);\n return () => events.document.off(eventName, stableListener);\n }, [eventName, stableListener]);\n};\n","import React from 'react';\nimport { events, EventName, EventListener } from '@wiggindev/utils';\nimport { useEvent } from './useEvent';\n\nexport const useWindowEventListener = <K extends EventName<WindowEventMap>>(\n eventName: K,\n listener: EventListener<WindowEventMap, K>\n) => {\n const stableListener = useEvent(listener);\n React.useEffect(() => {\n if (!window || !window.addEventListener) {\n return;\n }\n events.window.on(eventName, stableListener);\n return () => events.window.off(eventName, stableListener);\n }, [eventName, stableListener]);\n};\n","import React from 'react';\n\nexport const usePrevious = <T>(value: T) => {\n const stateRef = React.useRef<T>();\n React.useEffect(() => {\n stateRef.current = value;\n }, [value]);\n return stateRef.current;\n};\n","import React from 'react';\nimport { throttle } from '@wiggindev/utils';\nimport { useWindowEventListener } from './useWindowEventListener';\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';\nimport { useEvent } from './useEvent';\n\nconst getWindowDimensions = () => {\n const { innerWidth: width, innerHeight: height } = window;\n return {\n width,\n height,\n };\n};\n\nexport const useWindowDimensions = (throttleLimit = 250) => {\n const [windowDimensions, setWindowDimensions] = React.useState({\n width: 0,\n height: 0,\n });\n\n const updateWindowDimensions = () =>\n setWindowDimensions(getWindowDimensions());\n const handleResize = useEvent(\n throttle(updateWindowDimensions, throttleLimit)\n );\n\n useWindowEventListener('resize', handleResize);\n\n useIsomorphicLayoutEffect(() => {\n updateWindowDimensions();\n }, []);\n\n return windowDimensions;\n};\n"],"names":["useIsomorphicLayoutEffect","window","React","useLayoutEffect","useEffect","useEvent","callback","callbackRef","useRef","current","useMemo","useEventListener","eventName","listener","element","stableListener","node","addEventListener","events","on","off","useDocumentEventListener","document","useWindowEventListener","usePrevious","value","stateRef","useWindowDimensions","throttleLimit","useState","width","height","windowDimensions","_React$useState","setWindowDimensions","updateWindowDimensions","_window","innerWidth","innerHeight","handleResize","throttle"],"mappings":"6EAEaA,IAAAA,EACS,oBAAXC,OAAyBC,EAAMC,gBAAkBD,EAAME,UCCrDC,EAAW,SAAqBC,GACzC,IAAMC,EAAcL,EAAMM,OAAOF,GAIjC,OAHAN,EAA0B,WACtBO,EAAYE,QAAUH,IAEnBJ,EAAMQ,QAAQ,WAAA,OAAMH,EAAYE,SAAS,KCLvCE,EAAmB,SAI5BC,EACAC,EACAC,GAEA,IAAMC,EAAiBV,EAASQ,GAChCX,EAAME,UAAU,WACZ,IAAMY,EAAOF,EAAQL,QACrB,GAAKO,GAASA,EAAKC,iBAInB,OADAC,EAAOJ,QAAQK,GAAGH,EAAMJ,EAAWG,qBACtBG,EAAOJ,QAAQM,IAAIJ,EAAMJ,EAAWG,KAClD,CAACD,EAASF,EAAWG,KChBfM,EAA2B,SACpCT,EACAC,GAEA,IAAME,EAAiBV,EAASQ,GAChCX,EAAME,UAAU,WACZ,GAAKkB,UAAaA,SAASL,iBAI3B,OADAC,EAAOI,SAASH,GAAGP,EAAWG,GACjBG,WAAAA,OAAAA,EAAOI,SAASF,IAAIR,EAAWG,KAC7C,CAACH,EAAWG,KCXNQ,EAAyB,SAClCX,EACAC,GAEA,IAAME,EAAiBV,EAASQ,GAChCX,EAAME,UAAU,WACZ,GAAKH,QAAWA,OAAOgB,iBAIvB,OADAC,EAAOjB,OAAOkB,GAAGP,EAAWG,GACfG,WAAAA,OAAAA,EAAOjB,OAAOmB,IAAIR,EAAWG,KAC3C,CAACH,EAAWG,KCbNS,EAAc,SAAIC,GAC3B,IAAMC,EAAWxB,EAAMM,SAIvB,OAHAN,EAAME,UAAU,WACZsB,EAASjB,QAAUgB,GACpB,CAACA,IACGC,EAASjB,SCOPkB,EAAsB,SAACC,YAAAA,IAAAA,EAAgB,KAChD,IAAgD1B,EAAAA,EAAM2B,SAAS,CAC3DC,MAAO,EACPC,OAAQ,IAFLC,EAAPC,EAAA,GAAyBC,EAAzBD,EAAA,GAKME,EAAyB,kBAC3BD,EAbG,CACHJ,OAFJM,EAAmDnC,QAA3CoC,WAGJN,OAHuBO,EAAAA,cADH,IACxBF,GAeMG,EAAelC,EACjBmC,EAASL,EAAwBP,IASrC,OANAL,EAAuB,SAAUgB,GAEjCvC,EAA0B,WACtBmC,KACD,IAEIH"}
|
package/dist/index.umd.js
CHANGED
@@ -1,2 +1,2 @@
|
|
1
|
-
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("@wiggindev/utils")):"function"==typeof define&&define.amd?define(["exports","react","@wiggindev/utils"],n):n((e||self).hooks={},e.react,e.utils)}(this,function(e,n,t){function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var f=/*#__PURE__*/u(n),
|
1
|
+
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("@wiggindev/utils")):"function"==typeof define&&define.amd?define(["exports","react","@wiggindev/utils"],n):n((e||self).hooks={},e.react,e.utils)}(this,function(e,n,t){function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var f=/*#__PURE__*/u(n),i="undefined"!=typeof window?f.default.useLayoutEffect:f.default.useEffect,o=function(e){var n=f.default.useRef(e);return i(function(){n.current=e}),f.default.useMemo(function(){return n.current},[])},r=function(e,n){var u=o(n);f.default.useEffect(function(){if(window&&window.addEventListener)return t.events.window.on(e,u),function(){return t.events.window.off(e,u)}},[e,u])};e.useDocumentEventListener=function(e,n){var u=o(n);f.default.useEffect(function(){if(document&&document.addEventListener)return t.events.document.on(e,u),function(){return t.events.document.off(e,u)}},[e,u])},e.useEvent=o,e.useEventListener=function(e,n,u){var i=o(n);f.default.useEffect(function(){var n=u.current;if(n&&n.addEventListener)return t.events.element.on(n,e,i),function(){return t.events.element.off(n,e,i)}},[u,e,i])},e.useIsomorphicLayoutEffect=i,e.usePrevious=function(e){var n=f.default.useRef();return f.default.useEffect(function(){n.current=e},[e]),n.current},e.useWindowDimensions=function(e){void 0===e&&(e=250);var n=f.default.useState({width:0,height:0}),u=n[0],d=n[1],s=function(){return d({width:(e=window).innerWidth,height:e.innerHeight});var e},c=o(t.throttle(s,e));return r("resize",c),i(function(){s()},[]),u},e.useWindowEventListener=r});
|
2
2
|
//# sourceMappingURL=index.umd.js.map
|
package/dist/index.umd.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.umd.js","sources":["../src/useIsomorphicLayoutEffect.ts","../src/useEvent.ts","../src/useDocumentEventListener.ts","../src/useEventListener.ts","../src/
|
1
|
+
{"version":3,"file":"index.umd.js","sources":["../src/useIsomorphicLayoutEffect.ts","../src/useEvent.ts","../src/useWindowEventListener.ts","../src/useDocumentEventListener.ts","../src/useEventListener.ts","../src/usePrevious.ts","../src/useWindowDimensions.ts"],"sourcesContent":["import React from 'react';\n\nexport const useIsomorphicLayoutEffect =\n typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\n","import React from 'react';\nimport { Callback } from '@wiggindev/utils';\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';\n\nexport const useEvent = <C extends Callback>(callback: C): C => {\n const callbackRef = React.useRef(callback);\n useIsomorphicLayoutEffect(() => {\n callbackRef.current = callback;\n });\n return React.useMemo(() => callbackRef.current, []);\n};\n","import React from 'react';\nimport { events, EventName, EventListener } from '@wiggindev/utils';\nimport { useEvent } from './useEvent';\n\nexport const useWindowEventListener = <K extends EventName<WindowEventMap>>(\n eventName: K,\n listener: EventListener<WindowEventMap, K>\n) => {\n const stableListener = useEvent(listener);\n React.useEffect(() => {\n if (!window || !window.addEventListener) {\n return;\n }\n events.window.on(eventName, stableListener);\n return () => events.window.off(eventName, stableListener);\n }, [eventName, stableListener]);\n};\n","import React from 'react';\nimport { events, EventName, EventListener } from '@wiggindev/utils';\nimport { useEvent } from './useEvent';\n\nexport const useDocumentEventListener = <K extends EventName<DocumentEventMap>>(\n eventName: K,\n listener: EventListener<DocumentEventMap, K>\n) => {\n const stableListener = useEvent(listener);\n React.useEffect(() => {\n if (!document || !document.addEventListener) {\n return;\n }\n events.document.on(eventName, stableListener);\n return () => events.document.off(eventName, stableListener);\n }, [eventName, stableListener]);\n};\n","import React from 'react';\nimport { events, EventName, EventListener } from '@wiggindev/utils';\nimport { useEvent } from './useEvent';\n\nexport const useEventListener = <\n K extends EventName<HTMLElementEventMap>,\n E extends HTMLElement\n>(\n eventName: K,\n listener: EventListener<HTMLElementEventMap, K>,\n element: React.RefObject<E>\n) => {\n const stableListener = useEvent(listener);\n React.useEffect(() => {\n const node = element.current;\n if (!node || !node.addEventListener) {\n return;\n }\n events.element.on(node, eventName, stableListener);\n return () => events.element.off(node, eventName, stableListener);\n }, [element, eventName, stableListener]);\n};\n","import React from 'react';\n\nexport const usePrevious = <T>(value: T) => {\n const stateRef = React.useRef<T>();\n React.useEffect(() => {\n stateRef.current = value;\n }, [value]);\n return stateRef.current;\n};\n","import React from 'react';\nimport { throttle } from '@wiggindev/utils';\nimport { useWindowEventListener } from './useWindowEventListener';\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';\nimport { useEvent } from './useEvent';\n\nconst getWindowDimensions = () => {\n const { innerWidth: width, innerHeight: height } = window;\n return {\n width,\n height,\n };\n};\n\nexport const useWindowDimensions = (throttleLimit = 250) => {\n const [windowDimensions, setWindowDimensions] = React.useState({\n width: 0,\n height: 0,\n });\n\n const updateWindowDimensions = () =>\n setWindowDimensions(getWindowDimensions());\n const handleResize = useEvent(\n throttle(updateWindowDimensions, throttleLimit)\n );\n\n useWindowEventListener('resize', handleResize);\n\n useIsomorphicLayoutEffect(() => {\n updateWindowDimensions();\n }, []);\n\n return windowDimensions;\n};\n"],"names":["useIsomorphicLayoutEffect","window","React","useLayoutEffect","useEffect","useEvent","callback","callbackRef","useRef","current","useMemo","useWindowEventListener","eventName","listener","stableListener","addEventListener","events","on","off","document","element","node","value","stateRef","throttleLimit","useState","width","height","windowDimensions","_React$useState","setWindowDimensions","updateWindowDimensions","_window","innerWidth","innerHeight","handleResize","throttle"],"mappings":"2ZAEaA,EACS,oBAAXC,OAAyBC,EAAAA,QAAMC,gBAAkBD,EAAAA,QAAME,UCCrDC,EAAW,SAAqBC,GACzC,IAAMC,EAAcL,EAAK,QAACM,OAAOF,GAIjC,OAHAN,EAA0B,WACtBO,EAAYE,QAAUH,IAEnBJ,UAAMQ,QAAQ,WAAA,OAAMH,EAAYE,SAAS,KCLvCE,EAAyB,SAClCC,EACAC,GAEA,IAAMC,EAAiBT,EAASQ,GAChCX,EAAK,QAACE,UAAU,WACZ,GAAKH,QAAWA,OAAOc,iBAIvB,OADAC,EAAMA,OAACf,OAAOgB,GAAGL,EAAWE,GACfE,WAAAA,OAAAA,EAAAA,OAAOf,OAAOiB,IAAIN,EAAWE,KAC3C,CAACF,EAAWE,gCCXqB,SACpCF,EACAC,GAEA,IAAMC,EAAiBT,EAASQ,GAChCX,EAAK,QAACE,UAAU,WACZ,GAAKe,UAAaA,SAASJ,iBAI3B,OADAC,EAAMA,OAACG,SAASF,GAAGL,EAAWE,GACjBE,WAAAA,OAAAA,EAAAA,OAAOG,SAASD,IAAIN,EAAWE,KAC7C,CAACF,EAAWE,qCCXa,SAI5BF,EACAC,EACAO,GAEA,IAAMN,EAAiBT,EAASQ,GAChCX,EAAK,QAACE,UAAU,WACZ,IAAMiB,EAAOD,EAAQX,QACrB,GAAKY,GAASA,EAAKN,iBAInB,OADAC,EAAMA,OAACI,QAAQH,GAAGI,EAAMT,EAAWE,qBACtBE,EAAMA,OAACI,QAAQF,IAAIG,EAAMT,EAAWE,KAClD,CAACM,EAASR,EAAWE,iDClBD,SAAIQ,GAC3B,IAAMC,EAAWrB,EAAK,QAACM,SAIvB,OAHAN,EAAK,QAACE,UAAU,WACZmB,EAASd,QAAUa,GACpB,CAACA,IACGC,EAASd,+BCOe,SAACe,YAAAA,IAAAA,EAAgB,KAChD,IAAgDtB,EAAAA,EAAK,QAACuB,SAAS,CAC3DC,MAAO,EACPC,OAAQ,IAFLC,EAAPC,EAAA,GAAyBC,EAAzBD,EAAA,GAKME,EAAyB,kBAC3BD,EAbG,CACHJ,OAFJM,EAAmD/B,QAA3CgC,WAGJN,OAHuBO,EAAAA,cADH,IACxBF,GAeMG,EAAe9B,EACjB+B,EAAQA,SAACL,EAAwBP,IASrC,OANAb,EAAuB,SAAUwB,GAEjCnC,EAA0B,WACtB+B,KACD,IAEIH"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import { EventListener } from '@wiggindev/utils';
|
2
|
-
export declare const useDocumentEventListener: <K extends
|
1
|
+
import { EventName, EventListener } from '@wiggindev/utils';
|
2
|
+
export declare const useDocumentEventListener: <K extends EventName<DocumentEventMap>>(eventName: K, listener: EventListener<DocumentEventMap, K>) => void;
|
package/dist/useEvent.d.ts
CHANGED
@@ -1,3 +1,3 @@
|
|
1
1
|
import React from 'react';
|
2
|
-
import { EventListener } from '@wiggindev/utils';
|
3
|
-
export declare const useEventListener: <K extends
|
2
|
+
import { EventName, EventListener } from '@wiggindev/utils';
|
3
|
+
export declare const useEventListener: <K extends EventName<HTMLElementEventMap>, E extends HTMLElement>(eventName: K, listener: EventListener<HTMLElementEventMap, K>, element: React.RefObject<E>) => void;
|
@@ -1,2 +1,2 @@
|
|
1
1
|
import React from 'react';
|
2
|
-
export declare const useIsomorphicLayoutEffect: typeof React.
|
2
|
+
export declare const useIsomorphicLayoutEffect: typeof React.useEffect;
|
@@ -0,0 +1 @@
|
|
1
|
+
export declare const usePrevious: <T>(value: T) => T | undefined;
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import { EventListener } from '@wiggindev/utils';
|
2
|
-
export declare const useWindowEventListener: <K extends
|
1
|
+
import { EventName, EventListener } from '@wiggindev/utils';
|
2
|
+
export declare const useWindowEventListener: <K extends EventName<WindowEventMap>>(eventName: K, listener: EventListener<WindowEventMap, K>) => void;
|
package/package.json
CHANGED
@@ -1,12 +1,13 @@
|
|
1
1
|
{
|
2
2
|
"name": "@wiggindev/hooks",
|
3
3
|
"description": "Various hooks that I use in my projects",
|
4
|
-
"version": "0.2.
|
4
|
+
"version": "0.2.3",
|
5
5
|
"author": {
|
6
6
|
"name": "Andrew Wiggin",
|
7
7
|
"email": "andrew@wiggin.dev",
|
8
8
|
"url": "https://wiggin.dev"
|
9
9
|
},
|
10
|
+
"repository": "git://github.com/wiggindev/hooks",
|
10
11
|
"type": "module",
|
11
12
|
"source": "src/index.ts",
|
12
13
|
"exports": {
|
@@ -18,36 +19,20 @@
|
|
18
19
|
"unpkg": "dist/index.umd.js",
|
19
20
|
"types": "dist/index.d.ts",
|
20
21
|
"scripts": {
|
21
|
-
"
|
22
|
-
"
|
23
|
-
"dev": "microbundle -f es,cjs,modern watch",
|
24
|
-
"_postinstall": "husky install",
|
25
|
-
"prepack": "pinst --disable",
|
26
|
-
"postpack": "pinst --enable",
|
27
|
-
"lint": "tsc --noEmit && yarn eslint",
|
28
|
-
"format": "yarn eslint --fix && yarn prettier --write ."
|
22
|
+
"build": "rm -rf dist && microbundle",
|
23
|
+
"dev": "rm -rf dist && microbundle watch"
|
29
24
|
},
|
30
25
|
"dependencies": {
|
31
|
-
"@wiggindev/utils": "
|
26
|
+
"@wiggindev/utils": "*"
|
32
27
|
},
|
33
28
|
"peerDependencies": {
|
34
29
|
"react": ">= 18"
|
35
30
|
},
|
36
31
|
"devDependencies": {
|
37
32
|
"@types/react": "^18.0.9",
|
38
|
-
"@typescript-eslint/eslint-plugin": "^5.23.0",
|
39
|
-
"@typescript-eslint/parser": "^5.23.0",
|
40
|
-
"eslint": "^8.15.0",
|
41
|
-
"eslint-config-prettier": "^8.5.0",
|
42
|
-
"eslint-plugin-prettier": "^4.0.0",
|
43
33
|
"eslint-plugin-react": "^7.29.4",
|
44
|
-
"husky": "^8.0.1",
|
45
|
-
"lint-staged": "^12.4.1",
|
46
34
|
"microbundle": "^0.15.0",
|
47
|
-
"
|
48
|
-
"prettier": "^2.6.2",
|
49
|
-
"rimraf": "^3.0.2",
|
50
|
-
"typescript": "^4.6.4"
|
35
|
+
"react": "^18.1.0"
|
51
36
|
},
|
52
37
|
"packageManager": "yarn@3.2.1",
|
53
38
|
"publishConfig": {
|
package/src/index.ts
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
import React from 'react';
|
2
|
-
import { useEvent } from './useEvent';
|
3
2
|
import { events, EventName, EventListener } from '@wiggindev/utils';
|
3
|
+
import { useEvent } from './useEvent';
|
4
4
|
|
5
5
|
export const useDocumentEventListener = <K extends EventName<DocumentEventMap>>(
|
6
6
|
eventName: K,
|
package/src/useEvent.ts
CHANGED
@@ -1,8 +1,7 @@
|
|
1
1
|
import React from 'react';
|
2
|
+
import { Callback } from '@wiggindev/utils';
|
2
3
|
import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';
|
3
4
|
|
4
|
-
type Callback = (...args: any[]) => any;
|
5
|
-
|
6
5
|
export const useEvent = <C extends Callback>(callback: C): C => {
|
7
6
|
const callbackRef = React.useRef(callback);
|
8
7
|
useIsomorphicLayoutEffect(() => {
|
package/src/useEventListener.ts
CHANGED
@@ -0,0 +1,34 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { throttle } from '@wiggindev/utils';
|
3
|
+
import { useWindowEventListener } from './useWindowEventListener';
|
4
|
+
import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';
|
5
|
+
import { useEvent } from './useEvent';
|
6
|
+
|
7
|
+
const getWindowDimensions = () => {
|
8
|
+
const { innerWidth: width, innerHeight: height } = window;
|
9
|
+
return {
|
10
|
+
width,
|
11
|
+
height,
|
12
|
+
};
|
13
|
+
};
|
14
|
+
|
15
|
+
export const useWindowDimensions = (throttleLimit = 250) => {
|
16
|
+
const [windowDimensions, setWindowDimensions] = React.useState({
|
17
|
+
width: 0,
|
18
|
+
height: 0,
|
19
|
+
});
|
20
|
+
|
21
|
+
const updateWindowDimensions = () =>
|
22
|
+
setWindowDimensions(getWindowDimensions());
|
23
|
+
const handleResize = useEvent(
|
24
|
+
throttle(updateWindowDimensions, throttleLimit)
|
25
|
+
);
|
26
|
+
|
27
|
+
useWindowEventListener('resize', handleResize);
|
28
|
+
|
29
|
+
useIsomorphicLayoutEffect(() => {
|
30
|
+
updateWindowDimensions();
|
31
|
+
}, []);
|
32
|
+
|
33
|
+
return windowDimensions;
|
34
|
+
};
|
package/tsconfig.json
CHANGED
@@ -1,27 +1,8 @@
|
|
1
1
|
{
|
2
|
+
"extends": "../../tsconfig.json",
|
2
3
|
"compilerOptions": {
|
3
|
-
"outDir": "dist"
|
4
|
-
"module": "esnext",
|
5
|
-
"target": "esnext",
|
6
|
-
"lib": ["dom", "dom.iterable", "esnext"],
|
7
|
-
"allowJs": true,
|
8
|
-
"strict": true,
|
9
|
-
"forceConsistentCasingInFileNames": true,
|
10
|
-
"noEmit": true,
|
11
|
-
"esModuleInterop": true,
|
12
|
-
"moduleResolution": "node",
|
13
|
-
"resolveJsonModule": true,
|
14
|
-
"isolatedModules": true,
|
15
|
-
"incremental": true
|
4
|
+
"outDir": "dist"
|
16
5
|
},
|
17
6
|
"include": ["src/**/*"],
|
18
|
-
"exclude": [
|
19
|
-
"node_modules",
|
20
|
-
".fleet",
|
21
|
-
".yarn",
|
22
|
-
".idea",
|
23
|
-
".next",
|
24
|
-
".vercel",
|
25
|
-
"dist"
|
26
|
-
]
|
7
|
+
"exclude": ["dist"]
|
27
8
|
}
|
package/.editorconfig
DELETED
package/.husky/pre-commit
DELETED
@@ -1,50 +0,0 @@
|
|
1
|
-
<component name="ProjectCodeStyleConfiguration">
|
2
|
-
<code_scheme name="Project" version="173">
|
3
|
-
<HTMLCodeStyleSettings>
|
4
|
-
<option name="HTML_SPACE_INSIDE_EMPTY_TAG" value="true" />
|
5
|
-
<option name="HTML_QUOTE_STYLE" value="Single" />
|
6
|
-
<option name="HTML_ENFORCE_QUOTES" value="true" />
|
7
|
-
</HTMLCodeStyleSettings>
|
8
|
-
<JSCodeStyleSettings version="0">
|
9
|
-
<option name="FORCE_SEMICOLON_STYLE" value="true" />
|
10
|
-
<option name="SPACE_BEFORE_FUNCTION_LEFT_PARENTH" value="false" />
|
11
|
-
<option name="USE_DOUBLE_QUOTES" value="false" />
|
12
|
-
<option name="FORCE_QUOTE_STYlE" value="true" />
|
13
|
-
<option name="ENFORCE_TRAILING_COMMA" value="WhenMultiline" />
|
14
|
-
<option name="SPACES_WITHIN_OBJECT_LITERAL_BRACES" value="true" />
|
15
|
-
<option name="SPACES_WITHIN_IMPORTS" value="true" />
|
16
|
-
</JSCodeStyleSettings>
|
17
|
-
<TypeScriptCodeStyleSettings version="0">
|
18
|
-
<option name="FORCE_SEMICOLON_STYLE" value="true" />
|
19
|
-
<option name="SPACE_BEFORE_FUNCTION_LEFT_PARENTH" value="false" />
|
20
|
-
<option name="USE_DOUBLE_QUOTES" value="false" />
|
21
|
-
<option name="FORCE_QUOTE_STYlE" value="true" />
|
22
|
-
<option name="ENFORCE_TRAILING_COMMA" value="WhenMultiline" />
|
23
|
-
<option name="SPACES_WITHIN_OBJECT_LITERAL_BRACES" value="true" />
|
24
|
-
<option name="SPACES_WITHIN_IMPORTS" value="true" />
|
25
|
-
</TypeScriptCodeStyleSettings>
|
26
|
-
<VueCodeStyleSettings>
|
27
|
-
<option name="INTERPOLATION_NEW_LINE_AFTER_START_DELIMITER" value="false" />
|
28
|
-
<option name="INTERPOLATION_NEW_LINE_BEFORE_END_DELIMITER" value="false" />
|
29
|
-
</VueCodeStyleSettings>
|
30
|
-
<codeStyleSettings language="HTML">
|
31
|
-
<option name="SOFT_MARGINS" value="80" />
|
32
|
-
<indentOptions>
|
33
|
-
<option name="CONTINUATION_INDENT_SIZE" value="4" />
|
34
|
-
</indentOptions>
|
35
|
-
</codeStyleSettings>
|
36
|
-
<codeStyleSettings language="JavaScript">
|
37
|
-
<option name="SOFT_MARGINS" value="80" />
|
38
|
-
</codeStyleSettings>
|
39
|
-
<codeStyleSettings language="TypeScript">
|
40
|
-
<option name="SOFT_MARGINS" value="80" />
|
41
|
-
</codeStyleSettings>
|
42
|
-
<codeStyleSettings language="Vue">
|
43
|
-
<option name="SOFT_MARGINS" value="80" />
|
44
|
-
<indentOptions>
|
45
|
-
<option name="INDENT_SIZE" value="4" />
|
46
|
-
<option name="TAB_SIZE" value="4" />
|
47
|
-
</indentOptions>
|
48
|
-
</codeStyleSettings>
|
49
|
-
</code_scheme>
|
50
|
-
</component>
|
package/.idea/codestream.xml
DELETED
@@ -1,7 +0,0 @@
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8"?>
|
2
|
-
<project version="4">
|
3
|
-
<component name="CodeStream">
|
4
|
-
<option name="teamId" value="627c6dbe4df6f3ed8737f84c" />
|
5
|
-
<option name="webViewContext" value="{"chatProviderAccess":"strict","currentTeamId":"627c6dbe4df6f3ed8737f84c","currentStreamId":"","pullRequestCheckoutBranch":false,"isRepositioning":false,"onboardStep":0,"panelStack":["landing-redirect"],"hasFocus":false,"channelFilter":"all","channelsMuteAll":false,"codemarkFileFilter":"all","codemarkTypeFilter":"all","codemarkTagFilter":"all","codemarkBranchFilter":"all","codemarkAuthorFilter":"all","codemarksFileViewStyle":"inline","codemarksShowArchived":false,"codemarksShowResolved":false,"codemarksWrapComments":false,"showFeedbackSmiley":true,"route":{"name":"login","params":{}},"spatialViewShowPRComments":false,"__teamless__":{"selectedRegion":"us"},"sessionStart":1652501943270,"isFirstPageview":false}" />
|
6
|
-
</component>
|
7
|
-
</project>
|
package/.idea/hooks.iml
DELETED
@@ -1,13 +0,0 @@
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8"?>
|
2
|
-
<module type="WEB_MODULE" version="4">
|
3
|
-
<component name="NewModuleRootManager">
|
4
|
-
<content url="file://$MODULE_DIR$">
|
5
|
-
<excludeFolder url="file://$MODULE_DIR$/temp" />
|
6
|
-
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
|
7
|
-
<excludeFolder url="file://$MODULE_DIR$/tmp" />
|
8
|
-
</content>
|
9
|
-
<orderEntry type="inheritedJdk" />
|
10
|
-
<orderEntry type="sourceFolder" forTests="false" />
|
11
|
-
<orderEntry type="module" module-name="utils" />
|
12
|
-
</component>
|
13
|
-
</module>
|
package/.idea/modules.xml
DELETED
@@ -1,9 +0,0 @@
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8"?>
|
2
|
-
<project version="4">
|
3
|
-
<component name="ProjectModuleManager">
|
4
|
-
<modules>
|
5
|
-
<module fileurl="file://$PROJECT_DIR$/.idea/hooks.iml" filepath="$PROJECT_DIR$/.idea/hooks.iml" />
|
6
|
-
<module fileurl="file://$PROJECT_DIR$/../utils/.idea/utils.iml" filepath="$PROJECT_DIR$/../utils/.idea/utils.iml" />
|
7
|
-
</modules>
|
8
|
-
</component>
|
9
|
-
</project>
|
package/.idea/prettier.xml
DELETED
package/.idea/vcs.xml
DELETED
package/.prettierignore
DELETED