@os-design/use-prevent-default-event 1.0.16 → 1.0.17

package/dist/cjs/index.js

@@ -21,6 +21,5 @@ function usePreventDefaultEvent(target, type) {
     passive: false
   });
 }
-var _default = usePreventDefaultEvent;
-exports["default"] = _default;
+var _default = exports["default"] = usePreventDefaultEvent;
 //# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_useEvent","_interopRequireDefault","require","_react","obj","__esModule","usePreventDefaultEvent","target","type","enabled","arguments","length","undefined","enabledRef","useRef","useEffect","current","prevent","useCallback","e","preventDefault","useEvent","passive","_default","exports"],"sources":["../../src/index.ts"],"sourcesContent":["import useEvent from '@os-design/use-event';\nimport { RefObject, useCallback, useEffect, useRef } from 'react';\n\nfunction usePreventDefaultEvent<K extends keyof HTMLElementEventMap>(\n  target: EventTarget | RefObject<EventTarget>,\n  type: K,\n  enabled = true\n) {\n  const enabledRef = useRef(enabled);\n  useEffect(() => {\n    enabledRef.current = enabled;\n  }, [enabled]);\n\n  const prevent = useCallback((e: Event) => {\n    if (!enabledRef.current) return;\n    e.preventDefault();\n  }, []);\n\n  useEvent(target, type, prevent, { passive: false });\n}\n\nexport default usePreventDefaultEvent;\n"],"mappings":";;;;;;AAAA,IAAAA,SAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAAkE,SAAAD,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,gBAAAA,GAAA;AAElE,SAASE,sBAAsBA,CAC7BC,MAA4C,EAC5CC,IAAO,EAEP;EAAA,IADAC,OAAO,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,IAAI;EAEd,IAAMG,UAAU,GAAG,IAAAC,aAAM,EAACL,OAAO,CAAC;EAClC,IAAAM,gBAAS,EAAC,YAAM;IACdF,UAAU,CAACG,OAAO,GAAGP,OAAO;EAC9B,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAEb,IAAMQ,OAAO,GAAG,IAAAC,kBAAW,EAAC,UAACC,CAAQ,EAAK;IACxC,IAAI,CAACN,UAAU,CAACG,OAAO,EAAE;IACzBG,CAAC,CAACC,cAAc,CAAC,CAAC;EACpB,CAAC,EAAE,EAAE,CAAC;EAEN,IAAAC,oBAAQ,EAACd,MAAM,EAAEC,IAAI,EAAES,OAAO,EAAE;IAAEK,OAAO,EAAE;EAAM,CAAC,CAAC;AACrD;AAAC,IAAAC,QAAA,GAEcjB,sBAAsB;AAAAkB,OAAA,cAAAD,QAAA"}
+{"version":3,"file":"index.js","names":["_useEvent","_interopRequireDefault","require","_react","obj","__esModule","usePreventDefaultEvent","target","type","enabled","arguments","length","undefined","enabledRef","useRef","useEffect","current","prevent","useCallback","e","preventDefault","useEvent","passive","_default","exports"],"sources":["../../src/index.ts"],"sourcesContent":["import useEvent from '@os-design/use-event';\nimport { RefObject, useCallback, useEffect, useRef } from 'react';\n\nfunction usePreventDefaultEvent<K extends keyof HTMLElementEventMap>(\n  target: EventTarget | RefObject<EventTarget>,\n  type: K,\n  enabled = true\n) {\n  const enabledRef = useRef(enabled);\n  useEffect(() => {\n    enabledRef.current = enabled;\n  }, [enabled]);\n\n  const prevent = useCallback((e: Event) => {\n    if (!enabledRef.current) return;\n    e.preventDefault();\n  }, []);\n\n  useEvent(target, type, prevent, { passive: false });\n}\n\nexport default usePreventDefaultEvent;\n"],"mappings":";;;;;;AAAA,IAAAA,SAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAAkE,SAAAD,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,gBAAAA,GAAA;AAElE,SAASE,sBAAsBA,CAC7BC,MAA4C,EAC5CC,IAAO,EAEP;EAAA,IADAC,OAAO,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,IAAI;EAEd,IAAMG,UAAU,GAAG,IAAAC,aAAM,EAACL,OAAO,CAAC;EAClC,IAAAM,gBAAS,EAAC,YAAM;IACdF,UAAU,CAACG,OAAO,GAAGP,OAAO;EAC9B,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAEb,IAAMQ,OAAO,GAAG,IAAAC,kBAAW,EAAC,UAACC,CAAQ,EAAK;IACxC,IAAI,CAACN,UAAU,CAACG,OAAO,EAAE;IACzBG,CAAC,CAACC,cAAc,CAAC,CAAC;EACpB,CAAC,EAAE,EAAE,CAAC;EAEN,IAAAC,oBAAQ,EAACd,MAAM,EAAEC,IAAI,EAAES,OAAO,EAAE;IAAEK,OAAO,EAAE;EAAM,CAAC,CAAC;AACrD;AAAC,IAAAC,QAAA,GAAAC,OAAA,cAEclB,sBAAsB","ignoreList":[]}

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["useEvent","useCallback","useEffect","useRef","usePreventDefaultEvent","target","type","enabled","enabledRef","current","prevent","e","preventDefault","passive"],"sources":["../../src/index.ts"],"sourcesContent":["import useEvent from '@os-design/use-event';\nimport { RefObject, useCallback, useEffect, useRef } from 'react';\n\nfunction usePreventDefaultEvent<K extends keyof HTMLElementEventMap>(\n  target: EventTarget | RefObject<EventTarget>,\n  type: K,\n  enabled = true\n) {\n  const enabledRef = useRef(enabled);\n  useEffect(() => {\n    enabledRef.current = enabled;\n  }, [enabled]);\n\n  const prevent = useCallback((e: Event) => {\n    if (!enabledRef.current) return;\n    e.preventDefault();\n  }, []);\n\n  useEvent(target, type, prevent, { passive: false });\n}\n\nexport default usePreventDefaultEvent;\n"],"mappings":"AAAA,OAAOA,QAAQ,MAAM,sBAAsB;AAC3C,SAAoBC,WAAW,EAAEC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAEjE,SAASC,sBAAsBA,CAC7BC,MAA4C,EAC5CC,IAAO,EACPC,OAAO,GAAG,IAAI,EACd;EACA,MAAMC,UAAU,GAAGL,MAAM,CAACI,OAAO,CAAC;EAClCL,SAAS,CAAC,MAAM;IACdM,UAAU,CAACC,OAAO,GAAGF,OAAO;EAC9B,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAEb,MAAMG,OAAO,GAAGT,WAAW,CAAEU,CAAQ,IAAK;IACxC,IAAI,CAACH,UAAU,CAACC,OAAO,EAAE;IACzBE,CAAC,CAACC,cAAc,CAAC,CAAC;EACpB,CAAC,EAAE,EAAE,CAAC;EAENZ,QAAQ,CAACK,MAAM,EAAEC,IAAI,EAAEI,OAAO,EAAE;IAAEG,OAAO,EAAE;EAAM,CAAC,CAAC;AACrD;AAEA,eAAeT,sBAAsB"}
+{"version":3,"file":"index.js","names":["useEvent","useCallback","useEffect","useRef","usePreventDefaultEvent","target","type","enabled","enabledRef","current","prevent","e","preventDefault","passive"],"sources":["../../src/index.ts"],"sourcesContent":["import useEvent from '@os-design/use-event';\nimport { RefObject, useCallback, useEffect, useRef } from 'react';\n\nfunction usePreventDefaultEvent<K extends keyof HTMLElementEventMap>(\n  target: EventTarget | RefObject<EventTarget>,\n  type: K,\n  enabled = true\n) {\n  const enabledRef = useRef(enabled);\n  useEffect(() => {\n    enabledRef.current = enabled;\n  }, [enabled]);\n\n  const prevent = useCallback((e: Event) => {\n    if (!enabledRef.current) return;\n    e.preventDefault();\n  }, []);\n\n  useEvent(target, type, prevent, { passive: false });\n}\n\nexport default usePreventDefaultEvent;\n"],"mappings":"AAAA,OAAOA,QAAQ,MAAM,sBAAsB;AAC3C,SAAoBC,WAAW,EAAEC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAEjE,SAASC,sBAAsBA,CAC7BC,MAA4C,EAC5CC,IAAO,EACPC,OAAO,GAAG,IAAI,EACd;EACA,MAAMC,UAAU,GAAGL,MAAM,CAACI,OAAO,CAAC;EAClCL,SAAS,CAAC,MAAM;IACdM,UAAU,CAACC,OAAO,GAAGF,OAAO;EAC9B,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAEb,MAAMG,OAAO,GAAGT,WAAW,CAAEU,CAAQ,IAAK;IACxC,IAAI,CAACH,UAAU,CAACC,OAAO,EAAE;IACzBE,CAAC,CAACC,cAAc,CAAC,CAAC;EACpB,CAAC,EAAE,EAAE,CAAC;EAENZ,QAAQ,CAACK,MAAM,EAAEC,IAAI,EAAEI,OAAO,EAAE;IAAEG,OAAO,EAAE;EAAM,CAAC,CAAC;AACrD;AAEA,eAAeT,sBAAsB","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@os-design/use-prevent-default-event",
-  "version": "1.0.16",
+  "version": "1.0.17",
   "license": "UNLICENSED",
   "repository": "git@gitlab.com:os-team/libs/os-design.git",
   "main": "dist/cjs/index.js",
@@ -30,10 +30,10 @@
     "access": "public"
   },
   "dependencies": {
-    "@os-design/use-event": "^1.0.19"
+    "@os-design/use-event": "^1.0.20"
   },
   "peerDependencies": {
     "react": ">=18"
   },
-  "gitHead": "2605fbf8f46c78800cd4ba6dcb0dd895a893bf96"
+  "gitHead": "1f17189e344a56fd6347dd6b896d6e7ef6e7b35d"
 }

package/src/index.mdx

@@ -0,0 +1,39 @@
+import { Meta } from '@storybook/blocks';
+import UsePreventDefaultEventExample from './index.example';
+
+<Meta title='Utils/usePreventDefaultEvent' />
+
+# usePreventDefaultEvent
+
+Prevents the default action of the specified event.
+
+## Example of usage
+
+```tsx
+import React, { useCallback, useState } from 'react';
+import { Button } from '@os-design/core';
+import { usePreventDefaultEvent } from '@os-design/utils';
+
+const UsePreventDefaultEventExample: React.FC = () => {
+  const [scrollDisabled, setScrollDisabled] = useState(false);
+
+  const toggle = useCallback(() => setScrollDisabled((value) => !value), []);
+
+  usePreventDefaultEvent(document, 'wheel', scrollDisabled);
+
+  return (
+    <>
+      <p>
+        The default wheel event is {scrollDisabled ? 'disabled' : 'enabled'}
+      </p>
+      <Button onClick={toggle}>{scrollDisabled ? 'Enable' : 'Disable'}</Button>
+    </>
+  );
+};
+
+export default UsePreventDefaultEventExample;
+```
+
+<UsePreventDefaultEventExample />
+
+Try to scroll when the default wheel event is disabled.