From c647b90721e403522284dd4622d130a6b6c54866 Mon Sep 17 00:00:00 2001 From: v1rtl Date: Wed, 28 Aug 2024 19:18:41 +0300 Subject: [PATCH] remove es-toolkit --- components/package.json | 1 - .../atoms/DynamicPopover/DynamicPopover.tsx | 6 ++-- .../molecules/Dropdown/Dropdown.tsx | 2 +- .../DynamicPopover => }/utils/debounce.ts | 29 ++++++++++--------- pnpm-lock.yaml | 16 +++------- 5 files changed, 24 insertions(+), 30 deletions(-) rename components/src/{components/atoms/DynamicPopover => }/utils/debounce.ts (56%) diff --git a/components/package.json b/components/package.json index d7a448a2..bc609c32 100644 --- a/components/package.json +++ b/components/package.json @@ -39,7 +39,6 @@ }, "dependencies": { "clsx": "^1.1.1", - "es-toolkit": "^1.16.0", "react-transition-state": "^2.1.1", "ts-pattern": "^4.3.0" }, diff --git a/components/src/components/atoms/DynamicPopover/DynamicPopover.tsx b/components/src/components/atoms/DynamicPopover/DynamicPopover.tsx index a0ba22e1..3123f970 100644 --- a/components/src/components/atoms/DynamicPopover/DynamicPopover.tsx +++ b/components/src/components/atoms/DynamicPopover/DynamicPopover.tsx @@ -5,7 +5,7 @@ import { Portal } from '../Portal' import { Box, BoxProps } from '../Box/Box' import { getValueForTransitionState } from './utils/getValueForTransitionState' import { container } from './style.css' -import { debounceWithWait } from './utils/debounce' +import { debounce } from '../../../utils/debounce' export type DynamicPopoverSide = 'top' | 'right' | 'bottom' | 'left' @@ -362,7 +362,7 @@ export const DynamicPopover: React.FC = ({ onShowCallback?.() } - const debouncedMouseMove = debounceWithWait( + const debouncedMouseMove = debounce( (e: MouseEvent) => { const cursorXY = { x: e.clientX, y: e.clientY } const targetRect = targetElement?.getBoundingClientRect() @@ -380,7 +380,7 @@ export const DynamicPopover: React.FC = ({ document.removeEventListener('mousemove', handleMouseMove) }, 100, - 1000, + { maxWait: 1000 }, ) handleMouseMove = (e: MouseEvent) => { diff --git a/components/src/components/molecules/Dropdown/Dropdown.tsx b/components/src/components/molecules/Dropdown/Dropdown.tsx index 5bb9ee3e..e0fa1ad7 100644 --- a/components/src/components/molecules/Dropdown/Dropdown.tsx +++ b/components/src/components/molecules/Dropdown/Dropdown.tsx @@ -1,6 +1,5 @@ import * as React from 'react' import { P, match } from 'ts-pattern' -import { debounce } from 'es-toolkit' import { TransitionState } from 'react-transition-state' @@ -15,6 +14,7 @@ import { DownChevronSVG, DynamicPopover, ScrollBox } from '../..' import { ActionSheet } from './ActionSheet' import { Box, BoxProps } from '../../atoms/Box/Box' import { PopoverProps } from '../../atoms/DynamicPopover' +import { debounce } from '@/src/utils/debounce' type Align = 'left' | 'right' type LabelAlign = 'flex-start' | 'flex-end' | 'center' diff --git a/components/src/components/atoms/DynamicPopover/utils/debounce.ts b/components/src/utils/debounce.ts similarity index 56% rename from components/src/components/atoms/DynamicPopover/utils/debounce.ts rename to components/src/utils/debounce.ts index 95f600dd..7579864a 100644 --- a/components/src/components/atoms/DynamicPopover/utils/debounce.ts +++ b/components/src/utils/debounce.ts @@ -1,13 +1,18 @@ -export function debounceWithWait any>( +type DebounceOptions = { + maxWait?: number +} + +export function debounce any>( func: T, wait: number, - maxWait: number, + options?: DebounceOptions, ): (...args: Parameters) => void { let timer: NodeJS.Timeout | null = null let maxTimer: NodeJS.Timeout | null = null + const { maxWait } = options || {} return function (...args: Parameters): void { - // @ts-expect-error some magic + // @ts-expect-error because this in a func // eslint-disable-next-line @typescript-eslint/no-this-alias const context = this @@ -15,12 +20,10 @@ export function debounceWithWait any>( clearTimeout(timer) } - // Clear the maxWait timer if it exists if (maxTimer) { clearTimeout(maxTimer) } - // Set the regular debounce timer timer = setTimeout(() => { if (maxTimer) { clearTimeout(maxTimer) @@ -28,13 +31,13 @@ export function debounceWithWait any>( func.apply(context, args) }, wait) - // Set the maxWait timer - maxTimer = setTimeout(() => { - func.apply(context, args) - // Clear the regular timer since maxWait has fired - if (timer) { - clearTimeout(timer) - } - }, maxWait) + if (maxWait) { + maxTimer = setTimeout(() => { + func.apply(context, args) + if (timer) { + clearTimeout(timer) + } + }, maxWait) + } } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 5d42cf62..9af0015d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -111,9 +111,6 @@ importers: clsx: specifier: ^1.1.1 version: 1.2.1 - es-toolkit: - specifier: ^1.16.0 - version: 1.16.0 react-transition-state: specifier: ^2.1.1 version: 2.1.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -4465,9 +4462,6 @@ packages: resolution: {integrity: sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==} engines: {node: '>= 0.4'} - es-toolkit@1.16.0: - resolution: {integrity: sha512-eNJh3zF1KmAHRYd1D8rFi1cMFMCjrC6tumBfwuuZdSur97mED/ifyeBoGzxS11L4owCMx3XSmWTo6oxJQkdGng==} - esbuild@0.12.29: resolution: {integrity: sha512-w/XuoBCSwepyiZtIRsKsetiLDUVGPVw1E/R3VTFSecIy8UR7Cq3SOtwKHJMFoVqqVG36aGkzh4e8BvpO1Fdc7g==} hasBin: true @@ -10834,7 +10828,7 @@ snapshots: '@jest/schemas': 29.6.3 '@types/istanbul-lib-coverage': 2.0.6 '@types/istanbul-reports': 3.0.4 - '@types/node': 22.5.0 + '@types/node': 22.5.1 '@types/yargs': 17.0.32 chalk: 4.1.2 optional: true @@ -13861,8 +13855,6 @@ snapshots: is-date-object: 1.0.5 is-symbol: 1.0.4 - es-toolkit@1.16.0: {} - esbuild@0.12.29: {} esbuild@0.19.12: @@ -15511,12 +15503,12 @@ snapshots: jest-message-util@29.7.0: dependencies: - '@babel/code-frame': 7.24.2 + '@babel/code-frame': 7.24.7 '@jest/types': 29.6.3 '@types/stack-utils': 2.0.3 chalk: 4.1.2 graceful-fs: 4.2.11 - micromatch: 4.0.5 + micromatch: 4.0.8 pretty-format: 29.7.0 slash: 3.0.0 stack-utils: 2.0.6 @@ -15642,7 +15634,7 @@ snapshots: jest-util@29.7.0: dependencies: '@jest/types': 29.6.3 - '@types/node': 22.5.0 + '@types/node': 22.5.1 chalk: 4.1.2 ci-info: 3.9.0 graceful-fs: 4.2.11