From 3cee6ace705241fc06b24ffdd5a8b0e208165719 Mon Sep 17 00:00:00 2001 From: babin Date: Sat, 7 Dec 2024 23:52:18 +0700 Subject: [PATCH] =?UTF-8?q?main=20=F0=9F=A7=8A=20add=20elemnt=20size,=20ad?= =?UTF-8?q?d=20doc=20for=20use=20key=20pressed=20event?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 10 +- src/hooks/index.ts | 1 + .../useActiveElement.demo.tsx | 2 +- .../useElementSize/useElementSize.demo.tsx | 8 +- src/hooks/useElementSize/useElementSize.ts | 75 +- src/hooks/useField/useField.demo.tsx | 2 +- .../useKeyPressEvent.demo.tsx | 2 +- .../useKeyPressEvent/useKeyPressEvent.ts | 44 +- .../useLastChanged/useLastChanged.demo.tsx | 2 +- src/hooks/useMap/useMap.demo.tsx | 2 +- src/hooks/useSet/useSet.demo.tsx | 2 +- yarn.lock | 879 +++++++++++++----- 12 files changed, 736 insertions(+), 293 deletions(-) diff --git a/package.json b/package.json index 8bae562b..0275f7cd 100644 --- a/package.json +++ b/package.json @@ -67,8 +67,8 @@ "screenfull": "^6.0.2" }, "devDependencies": { - "@siberiacancode/builder": "^1.3.16", - "@siberiacancode/eslint": "^2.5.2", + "@siberiacancode/builder": "^1.3.17", + "@siberiacancode/eslint": "^2.6.0", "@siberiacancode/prettier": "^1.1.1", "@siberiacancode/vitest": "^1.2.4", "@testing-library/dom": "^10.4.0", @@ -76,7 +76,7 @@ "@types/doctrine": "^0.0.9", "@types/node": "^22.9.1", "@types/react": "^18.3.12", - "@types/react-dom": "^18.3.1", + "@types/react-dom": "^18.3.2", "comment-parser": "^1.4.1", "core-js": "^3.39.0", "doctrine": "^3.0.0", @@ -86,8 +86,8 @@ "react": "^18.3.1", "react-dom": "^18.3.1", "shx": "^0.3.4", - "typescript": "^5.6.3", - "vite": "^5.4.11", + "typescript": "^5.7.2", + "vite": "^6.0.3", "vitepress": "^1.5.0" }, "lint-staged": { diff --git a/src/hooks/index.ts b/src/hooks/index.ts index e2dabb0d..09e6d89e 100644 --- a/src/hooks/index.ts +++ b/src/hooks/index.ts @@ -18,6 +18,7 @@ export * from './useDisclosure/useDisclosure'; export * from './useDocumentEvent/useDocumentEvent'; export * from './useDocumentTitle/useDocumentTitle'; export * from './useDocumentVisibility/useDocumentVisibility'; +export * from './useElementSize/useElementSize'; export * from './useEvent/useEvent'; export * from './useEventListener/useEventListener'; export * from './useEyeDropper/useEyeDropper'; diff --git a/src/hooks/useActiveElement/useActiveElement.demo.tsx b/src/hooks/useActiveElement/useActiveElement.demo.tsx index 6a2a0101..1b5cae4e 100644 --- a/src/hooks/useActiveElement/useActiveElement.demo.tsx +++ b/src/hooks/useActiveElement/useActiveElement.demo.tsx @@ -8,7 +8,7 @@ const Demo = () => { <>
{Array.from({ length: 6 }, (_, i) => i + 1).map((id) => ( - + ))}
diff --git a/src/hooks/useElementSize/useElementSize.demo.tsx b/src/hooks/useElementSize/useElementSize.demo.tsx index 0e5d8a52..4029c511 100644 --- a/src/hooks/useElementSize/useElementSize.demo.tsx +++ b/src/hooks/useElementSize/useElementSize.demo.tsx @@ -1,13 +1,9 @@ import type { CSSProperties } from 'react'; -import { useRef } from 'react'; - import { useElementSize } from './useElementSize'; const Demo = () => { - const element = useRef(null); - - const { height, width } = useElementSize(element); + const elementSize = useElementSize(); const containerStyle: CSSProperties = { display: 'flex', @@ -24,7 +20,7 @@ const Demo = () => { return (
Resize the box to see changes -